Skip to content

Commit

Permalink
Update package.json and issue templates
Browse files Browse the repository at this point in the history
  • Loading branch information
alexgorbatchev committed Oct 18, 2024
1 parent b73f0c7 commit 73da6ca
Show file tree
Hide file tree
Showing 5 changed files with 39 additions and 47 deletions.
15 changes: 5 additions & 10 deletions .github/ISSUE_TEMPLATE/bug_report.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,14 +4,14 @@ about: Create a report to help us improve
title: ''
labels: ''
assignees: ''

---

**Describe the bug**
A clear and concise description of what the bug is.

**To Reproduce**
Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
Expand All @@ -24,15 +24,10 @@ A clear and concise description of what you expected to happen.
If applicable, add screenshots to help explain your problem.

**Desktop (please complete the following information):**
- OS: [e.g. iOS]
- Browser [e.g. chrome, safari]
- Version [e.g. 22]

**Smartphone (please complete the following information):**
- Device: [e.g. iPhone6]
- OS: [e.g. iOS8.1]
- Browser [e.g. stock browser, safari]
- Version [e.g. 22]

- OS: [e.g. iOS]
- Browser [e.g. chrome, safari]
- Version [e.g. 22]

**Additional context**
Add any other context about the problem here.
1 change: 0 additions & 1 deletion .github/ISSUE_TEMPLATE/feature_request.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ about: Suggest an idea for this project
title: ''
labels: ''
assignees: ''

---

**Is your feature request related to a problem? Please describe.**
Expand Down
1 change: 0 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
{
"private": true,
"main": "index.js",
"scripts": {
"build": "turbo run build --filter=click-to-*-component",
"env": "env",
Expand Down
51 changes: 25 additions & 26 deletions packages/click-to-react-component/README.md
Original file line number Diff line number Diff line change
@@ -1,37 +1,38 @@
# <ClickToComponent />
# <ClickToComponent /> Next (aka fork)

[![npm](https://img.shields.io/npm/v/click-to-react-component)](https://www.npmjs.com/package/click-to-react-component)
[![Release](https://github.com/ericclemmons/click-to-component/actions/workflows/release.yml/badge.svg)](https://github.com/ericclemmons/click-to-component/actions/workflows/release.yml)
[![npm](https://img.shields.io/npm/v/click-to-react-component-next)](https://www.npmjs.com/package/click-to-react-component-next)
[![Release](https://github.com/alexgorbatchev/click-to-component-next/actions/workflows/release.yml/badge.svg)](https://github.com/alexgorbatchev/click-to-component-next/actions/workflows/release.yml)

<kbd>Option+Click</kbd> a Component in the browser to **instantly** goto the source in your editor.
<kbd>Option+Click</kbd> or <kbd>Alt+Click</kbd> a Component in the browser to **instantly** goto the source in your editor.

![Next.js Demo](next.gif)
![Next.js Demo](https://raw.githubusercontent.com/alexgorbatchev/click-to-component-next/main/.github/next.gif)

## Features

- <kbd>Option+Click</kbd> opens the immediate Component's source
- <kbd>Option+Right-click</kbd> opens a context menu with the parent Components' `props`, `fileName`, `columnNumber`, and `lineNumber`
- <kbd>Option+Click</kbd> or <kbd>Alt+Click</kbd> opens the immediate Component's source
- <kbd>Option+RightClick</kbd> or <kbd>Alt+RightClick</kbd> opens a context menu with the parent Components' `props`, `fileName`, `columnNumber`, and `lineNumber`

> ![props](props.png)
> ![props](https://raw.githubusercontent.com/alexgorbatchev/click-to-component-next/main/.github/props.png)
- Works with frameworks like [Next.js](https://nextjs.org/),
[Create React App](https://create-react-app.dev/),
& [Vite](https://github.com/vitejs/vite/tree/main/packages/plugin-react)
that use [@babel/plugin-transform-react-jsx-source](https://github.com/babel/babel/tree/master/packages/babel-plugin-transform-react-jsx-source)
- Works with [RSBuild](https://rsbuild.dev/) with [plugin-react](https://rsbuild.dev/guide/framework/react) out of the box
- Supports `vscode` & `vscode-insiders` & `webstorm` & `cursor` [URL handling](https://code.visualstudio.com/docs/editor/command-line#_opening-vs-code-with-urls)
- Automatically **tree-shaken** from `production` builds
- Keyboard navigation in context menu (e.g. <kbd>←</kbd>, <kbd>→</kbd>, <kbd>⏎</kbd>)
- More context & faster than using React DevTools:

> ![React DevTools](devtools.png)
> ![React DevTools](https://raw.githubusercontent.com/alexgorbatchev/click-to-component-next/main/.github/devtools.png)
## Installation

<details>
<summary>npm</summary>

```shell
npm install click-to-react-component
npm install click-to-react-component-next
```

</details>
Expand All @@ -40,7 +41,7 @@ npm install click-to-react-component
<summary>pnpm</summary>

```shell
pnpm add click-to-react-component
pnpm add click-to-react-component-next
```

</details>
Expand All @@ -49,22 +50,22 @@ pnpm add click-to-react-component
<summary>yarn</summary>

```shell
yarn add click-to-react-component
yarn add click-to-react-component-next
```

</details>

Even though `click-to-react-component` is added to `dependencies`, [tree-shaking](https://esbuild.github.io/api/#tree-shaking) will remove `click-to-react-component` from `production` builds.
Even though `click-to-react-component-next` is added to `dependencies`, [tree-shaking](https://esbuild.github.io/api/#tree-shaking) will remove `click-to-react-component-next` from `production` builds.

## Usage

<details>
<summary>Create React App</summary>

[/src/index.js](https://github.com/ericclemmons/click-to-component/blob/main/apps/cra/src/index.js#L11)
[/src/index.js](https://github.com/alexgorbatchev/click-to-component-next/blob/main/apps/cra/src/index.js#L11)

```diff
+import { ClickToComponent } from 'click-to-react-component';
+import { ClickToComponent } from 'click-to-react-component-next';
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
Expand All @@ -78,17 +79,17 @@ Even though `click-to-react-component` is added to `dependencies`, [tree-shaking
);
```

> ![Create React App Demo](cra.gif)
> ![Create React App Demo](https://raw.githubusercontent.com/alexgorbatchev/click-to-component-next/main/.github/cra.gif)
</details>

<details>
<summary>Next.js</summary>

[pages/\_app.tsx](https://github.com/ericclemmons/click-to-component/blob/main/apps/next/pages/_app.tsx#L8)
[pages/\_app.tsx](https://github.com/alexgorbatchev/click-to-component-next/blob/main/apps/next/pages/_app.tsx#L8)

```diff
+import { ClickToComponent } from 'click-to-react-component'
+import { ClickToComponent } from 'click-to-react-component-next'
import type { AppProps } from 'next/app'
import '../styles/globals.css'

Expand All @@ -101,15 +102,15 @@ Even though `click-to-react-component` is added to `dependencies`, [tree-shaking
)
```

> ![Next.js Demo](next.gif)
> ![Next.js Demo](https://raw.githubusercontent.com/alexgorbatchev/click-to-component-next/main/.github/next.gif)
</details>

<details>
<summary>Vite</summary>

```diff
+import { ClickToComponent } from "click-to-react-component";
+import { ClickToComponent } from "click-to-react-component-next";
import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App";
Expand All @@ -123,7 +124,7 @@ ReactDOM.createRoot(document.getElementById("root")!).render(
);
```

> ![Vite Demo](vite.gif)
> ![Vite Demo](https://raw.githubusercontent.com/alexgorbatchev/click-to-component-next/main/.github/vite.gif)
</details>

Expand All @@ -148,7 +149,7 @@ module.exports = {
src/theme/Root.js:

```js
import { ClickToComponent } from 'click-to-react-component'
import { ClickToComponent } from 'click-to-react-component-next'
import React from 'react'

// Default implementation, that you can customize
Expand All @@ -164,13 +165,11 @@ export default function Root({ children }) {

</details>

If [developing in container](https://github.com/ericclemmons/click-to-component/issues/58)?

### `editor`

By default, the `editor` is set to [`vscode`](https://code.visualstudio.com/).

But you can choose between `webstorm` and `vscode-insider` too.
But you can choose between `webstorm`, `cursor` and `vscode-insider` too.

```diff
-<ClickToComponent />
Expand All @@ -197,7 +196,7 @@ This function will be called with the `path`, `line`, and `column` of the target
Clone the project

```shell
gh repo clone ericclemmons/click-to-component
gh repo clone alexgorbatchev/click-to-component-next
```

Go to the project directory
Expand Down
18 changes: 9 additions & 9 deletions packages/click-to-react-component/package.json
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
{
"type": "module",
"name": "click-to-react-component",
"version": "1.1.0",
"description": "Option+Click your React components in your browser to open the source file in VS Code",
"name": "click-to-react-component-next",
"version": "2.0.0",
"description": "option/alt+click React components in the browser to open source files in IDE",
"exports": {
"import": "./src/index.js",
"types": "./src/types.d.ts"
Expand All @@ -12,28 +12,28 @@
"src"
],
"scripts": {
"build": "echo \"Fuck build tools\"",
"dev": "pnpm run build",
"lint": "tsc -p ./jsconfig.json",
"test": "echo \"Error: no test specified\" && exit 1"
"lint": "tsc -p ./jsconfig.json"
},
"repository": {
"type": "git",
"url": "git+https://github.com/ericclemmons/click-to-component.git"
"url": "git+https://github.com/alexgorbatchev/click-to-component-next.git"
},
"keywords": [
"react",
"vue",
"dx",
"vscode",
"webstorm",
"cursor",
"devtools"
],
"author": "Eric Clemmons <[email protected]>",
"license": "ISC",
"bugs": {
"url": "https://github.com/ericclemmons/click-to-component/issues"
"url": "https://github.com/alexgorbatchev/click-to-component-next/issues"
},
"homepage": "https://github.com/ericclemmons/click-to-component#readme",
"homepage": "https://github.com/alexgorbatchev/click-to-component-next#readme",
"peerDependencies": {
"react": ">=16.8.0"
},
Expand Down

0 comments on commit 73da6ca

Please sign in to comment.