Skip to content

Commit

Permalink
v2: Context menu on option+right click [publish]
Browse files Browse the repository at this point in the history
  • Loading branch information
ArnaudBarre committed Feb 23, 2023
1 parent b1d0a96 commit f59260b
Show file tree
Hide file tree
Showing 14 changed files with 840 additions and 600 deletions.
2 changes: 1 addition & 1 deletion .github/workflows/publish.yml
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ jobs:
if: ${{ contains(github.event.head_commit.message, '[publish]') }}
steps:
- uses: actions/checkout@v3
- uses: xhyrom/setup-bun@v0.1.8
- uses: xhyrom/setup-bun@v1
- run: bun install
- run: bun ci
- uses: ArnaudBarre/npm-publish@v1
Expand Down
8 changes: 8 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,13 @@
# Changelog

## 2.0.0

Context menu on option+right click to see all the intermediate components and jump to the right place!
Direct click is remove for two reasons:

- It doesn't play well with buttons and links
- In large apps, you often end up on the generic component instead of going inside the usage of it

## 1.0.3

- Add Vite 4 to peer dependency range
Expand Down
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# vite-plugin-react-click-to-component [![npm](https://img.shields.io/npm/v/vite-plugin-react-click-to-component)](https://www.npmjs.com/package/vite-plugin-react-click-to-component)

Option+Click React components in your browser to open the source in your editor.
Option+Right Click in your browser to open the source in your editor.

Light version of [ericclemmons/click-to-component](https://github.com/ericclemmons/click-to-component) that uses Vite's launch editor middleware to open the source code in your currently running editor.

Expand Down
Binary file modified bun.lockb
Binary file not shown.
16 changes: 8 additions & 8 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "vite-plugin-react-click-to-component",
"version": "1.0.3",
"version": "2.0.0",
"license": "MIT",
"scripts": {
"postinstall": "cd playground && bun i",
Expand All @@ -11,7 +11,7 @@
"lint-ci": "eslint src scripts --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
"prettier": "yarn prettier-ci --write",
"prettier-ci": "prettier --ignore-path=.gitignore --check '**/*.{ts,tsx,html,css,json,md,yml}'",
"ci": "tsc && bun lint-ci && bun prettier-ci && bun run build"
"ci": "tsc && bun lint-ci && bun prettier-ci && bun run build && cd playground && tsc && bun lint-ci"
},
"prettier": {
"trailingComma": "all"
Expand All @@ -21,12 +21,12 @@
"vite": "^2 || ^3 || ^4"
},
"devDependencies": {
"@arnaud-barre/eslint-config": "^1.0.17",
"@arnaud-barre/eslint-config": "^1.0.19",
"@nabla/tnode": "^0.8.0",
"@types/node": "^18.11.12",
"eslint": "^8.29.0",
"prettier": "^2.8.1",
"typescript": "^4.9.4",
"vite": "^4.0.0"
"@types/node": "^18.14.0",
"eslint": "^8.34.0",
"prettier": "^2.8.4",
"typescript": "^4.9.5",
"vite": "^4.1.4"
}
}
Binary file modified playground/bun.lockb
Binary file not shown.
7 changes: 4 additions & 3 deletions playground/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,15 @@
"name": "playground",
"private": true,
"scripts": {
"dev": "vite"
"dev": "vite",
"lint-ci": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0"
},
"dependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {
"@types/react-dom": "^18.0.9",
"@vitejs/plugin-react-swc": "^3.0.0"
"@types/react-dom": "^18.0.11",
"@vitejs/plugin-react-swc": "^3.2.0"
}
}
50 changes: 23 additions & 27 deletions playground/src/App.tsx
Original file line number Diff line number Diff line change
@@ -1,32 +1,28 @@
import { useState } from "react";
import reactLogo from "./react.svg";
import { Button } from "./Button";
import "./App.css";

export const App = () => {
const [count, setCount] = useState(0);

return (
<div className="App">
<div style={{ position: "fixed", right: 40, top: 40 }}>Top right</div>
<div className="full-height">Full height</div>
<div>
<a href="https://vitejs.dev" target="_blank" rel="noreferrer">
<img src="/vite.svg" className="logo" alt="Vite logo" />
</a>
<a href="https://reactjs.org" target="_blank" rel="noreferrer">
<img src={reactLogo} className="logo react" alt="React logo" />
</a>
</div>
<h1>Vite + React</h1>
<div className="card">
<button onClick={() => setCount(count + 1)}>count is {count}</button>
<p>
Edit <code>src/App.tsx</code> and save to test HMR
</p>
</div>
<p className="read-the-docs">
Click on the Vite and React logos to learn more
export const App = () => (
<div className="App">
<div style={{ position: "fixed", right: 40, top: 40 }}>Top right</div>
<div className="full-height">Full height</div>
<div>
<a href="https://vitejs.dev" target="_blank" rel="noreferrer">
<img src="/vite.svg" className="logo" alt="Vite logo" />
</a>
<a href="https://reactjs.org" target="_blank" rel="noreferrer">
<img src={reactLogo} className="logo react" alt="React logo" />
</a>
</div>
<h1>Vite + React</h1>
<div className="card">
<Button />
<p>
Edit <code>src/App.tsx</code> and save to test HMR
</p>
</div>
);
};
<p className="read-the-docs">
Click on the Vite and React logos to learn more
</p>
</div>
);
7 changes: 7 additions & 0 deletions playground/src/Button.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import { useState } from "react";

export const Button = () => {
const [count, setCount] = useState(0);

return <button onClick={() => setCount(count + 1)}>count is {count}</button>;
};
156 changes: 78 additions & 78 deletions playground/yarn.lock
100755 → 100644
Original file line number Diff line number Diff line change
@@ -1,92 +1,92 @@
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1
# bun ./bun.lockb --hash: 7E502891CC3CE8CC-f8f63b46ff797c67-3D098B48DC753020-0c86a38c3d477462
# bun ./bun.lockb --hash: C6A399B4BFDAB035-b0d685f590d9fa8d-44ABB523C705F2F6-56bcddc0f6883165


"@swc/core@^1.3.21":
version "1.3.22"
resolved "https://registry.npmjs.org/@swc/core/-/core-1.3.22.tgz"
integrity sha512-oQ9EPEb7NgWcGIDoVfLCuffvtC4MzVtrwjqwKzFHP8FUh1fn8+2wraOjkkDXW74BB4Hgve5ykkaHix9bebB9Ww==
"@swc/core@^1.3.35":
version "1.3.36"
resolved "https://registry.npmjs.org/@swc/core/-/core-1.3.36.tgz"
integrity sha512-Ogrd9uRNIj7nHjXxG66UlKBIcXESUenJ7OD6K2a8p82qlg6ne7Ne5Goiipm/heHYhSfVmjcnRWL9ZJ4gv+YCPA==
dependencies:
"@swc/core-win32-x64-msvc" "1.3.22"
"@swc/core-darwin-x64" "1.3.22"
"@swc/core-linux-x64-gnu" "1.3.22"
"@swc/core-linux-x64-musl" "1.3.22"
"@swc/core-win32-ia32-msvc" "1.3.22"
"@swc/core-linux-arm64-gnu" "1.3.22"
"@swc/core-linux-arm-gnueabihf" "1.3.22"
"@swc/core-darwin-arm64" "1.3.22"
"@swc/core-linux-arm64-musl" "1.3.22"
"@swc/core-win32-arm64-msvc" "1.3.22"

"@swc/[email protected].22":
version "1.3.22"
resolved "https://registry.npmjs.org/@swc/core-darwin-arm64/-/core-darwin-arm64-1.3.22.tgz"
integrity sha512-MMhtPsuXp8gpUgr9bs+RZQ2IyFGiUNDG93usCDAFgAF+6VVp+YaAVjET/3/Bx5Lk2WAt0RxT62C9KTEw1YMo3w==

"@swc/[email protected].22":
version "1.3.22"
resolved "https://registry.npmjs.org/@swc/core-darwin-x64/-/core-darwin-x64-1.3.22.tgz"
integrity sha512-SG6QbNat4GZ5VJU3Zo6a54oQOtbhJVE6BCQw4JjOCZJmAeBzNebGy9wsT4+fCJNHC3C5qtaRw7ToXJvLniXwfg==

"@swc/[email protected].22":
version "1.3.22"
resolved "https://registry.npmjs.org/@swc/core-linux-arm-gnueabihf/-/core-linux-arm-gnueabihf-1.3.22.tgz"
integrity sha512-4E+TdQT1oHnHjDaPs/DyrRy9lOuFd6ncEd67yYA4j9lFqt6nuz/jnXss45k8KU7wR5kOTtdW73xPwkU4NbOWdw==

"@swc/[email protected].22":
version "1.3.22"
resolved "https://registry.npmjs.org/@swc/core-linux-arm64-gnu/-/core-linux-arm64-gnu-1.3.22.tgz"
integrity sha512-6VcynOMbOBcbLutIPENI3Ejvg5LGz/Pwvzm25hM0FoiEtPxHA+tawQUwLx8Alk1Yr+Rnqid06UEZ0veJOGn2pQ==

"@swc/[email protected].22":
version "1.3.22"
resolved "https://registry.npmjs.org/@swc/core-linux-arm64-musl/-/core-linux-arm64-musl-1.3.22.tgz"
integrity sha512-86RxGy0L3qa4De3xWHx8vL2caTxvSLSWTlgUW/Yd4l1pvrCFibMjhkImGu5ViKiReX9DlBtJ7CBs4dln2kHidw==

"@swc/[email protected].22":
version "1.3.22"
resolved "https://registry.npmjs.org/@swc/core-linux-x64-gnu/-/core-linux-x64-gnu-1.3.22.tgz"
integrity sha512-FLkbiqsdXsVIFZi6iedx4rSBGX8x0vo/5aDlklSxJAAYOcQpO0QADKP5Yr65iMT1d6ABCt2d+/StpGLF7GWOcA==

"@swc/[email protected].22":
version "1.3.22"
resolved "https://registry.npmjs.org/@swc/core-linux-x64-musl/-/core-linux-x64-musl-1.3.22.tgz"
integrity sha512-giBuw+Z0Bq6fpZ0Y5TcfpcQwf9p/cE1fOQyO/K1XSTn/haQOqFi7421Jq/dFThSARZiXw1u9Om9VFbwxr8VI+A==

"@swc/[email protected].22":
version "1.3.22"
resolved "https://registry.npmjs.org/@swc/core-win32-arm64-msvc/-/core-win32-arm64-msvc-1.3.22.tgz"
integrity sha512-loKGO+ZM2By6VdrmVJk1G79jVgDPaee93qLFuis5KyeoLLb4m1MlNMc/6SIDZUSuYg6NqaGP1spFeiFetMQ4Zg==

"@swc/[email protected].22":
version "1.3.22"
resolved "https://registry.npmjs.org/@swc/core-win32-ia32-msvc/-/core-win32-ia32-msvc-1.3.22.tgz"
integrity sha512-lvNWAZ3QjXMsrsch6oLLQVikT/hC/4ZcLrTBXa14HwQylaYigkGElgp3ekJr78HjWDPwB46GXwBbNMG0VNAfvA==

"@swc/[email protected].22":
version "1.3.22"
resolved "https://registry.npmjs.org/@swc/core-win32-x64-msvc/-/core-win32-x64-msvc-1.3.22.tgz"
integrity sha512-ESyn4lZXAKEE3mcTaDfXatsolCiEfVGstsXdgBmZYa6o1IE1bDW8FE7Ob/Y+82WTpm9+A9ZYXYjZ62t67POHZg==
"@swc/core-win32-x64-msvc" "1.3.36"
"@swc/core-darwin-x64" "1.3.36"
"@swc/core-linux-x64-gnu" "1.3.36"
"@swc/core-linux-x64-musl" "1.3.36"
"@swc/core-win32-ia32-msvc" "1.3.36"
"@swc/core-linux-arm64-gnu" "1.3.36"
"@swc/core-linux-arm-gnueabihf" "1.3.36"
"@swc/core-darwin-arm64" "1.3.36"
"@swc/core-linux-arm64-musl" "1.3.36"
"@swc/core-win32-arm64-msvc" "1.3.36"

"@swc/[email protected].36":
version "1.3.36"
resolved "https://registry.npmjs.org/@swc/core-darwin-arm64/-/core-darwin-arm64-1.3.36.tgz"
integrity sha512-lsP+C8p9cC/Vd9uAbtxpEnM8GoJI/MMnVuXak7OlxOtDH9/oTwmAcAQTfNGNaH19d2FAIRwf+5RbXCPnxa2Zjw==

"@swc/[email protected].36":
version "1.3.36"
resolved "https://registry.npmjs.org/@swc/core-darwin-x64/-/core-darwin-x64-1.3.36.tgz"
integrity sha512-jaLXsozWN5xachl9fPxDMi5nbWq1rRxPAt6ISeiYB6RJk0MQKH1634pOweBBem2pUDDzwDFXFw6f22LTm/cFvA==

"@swc/[email protected].36":
version "1.3.36"
resolved "https://registry.npmjs.org/@swc/core-linux-arm-gnueabihf/-/core-linux-arm-gnueabihf-1.3.36.tgz"
integrity sha512-vcBdTHjoEpvJDbFlgto+S6VwAHzLA9GyCiuNcTU2v4KNQlFzhbO4A4PMfMCb/Z0RLJEr16tirfHdWIxjU3h8nw==

"@swc/[email protected].36":
version "1.3.36"
resolved "https://registry.npmjs.org/@swc/core-linux-arm64-gnu/-/core-linux-arm64-gnu-1.3.36.tgz"
integrity sha512-o7f5OsvwWppJo+qIZmrGO5+XC6DPt6noecSbRHjF6o1YAcR13ETPC14k1eC9H1YbQwpyCFNVAFXyNcUbCeQyrQ==

"@swc/[email protected].36":
version "1.3.36"
resolved "https://registry.npmjs.org/@swc/core-linux-arm64-musl/-/core-linux-arm64-musl-1.3.36.tgz"
integrity sha512-FSHPngMi3c0fuGt9yY2Ubn5UcELi3EiPLJxBSC3X8TF9atI/WHZzK9PE9Gtn0C/LyRh4CoyOugDtSOPzGYmLQg==

"@swc/[email protected].36":
version "1.3.36"
resolved "https://registry.npmjs.org/@swc/core-linux-x64-gnu/-/core-linux-x64-gnu-1.3.36.tgz"
integrity sha512-PHSsH2rek5pr3e0K09VgWAbrWK2vJhaI7MW9TPoTjyACYjcs3WwjcjQ30MghXUs2Dc/bXjWAOi9KFTjq/uCyFg==

"@swc/[email protected].36":
version "1.3.36"
resolved "https://registry.npmjs.org/@swc/core-linux-x64-musl/-/core-linux-x64-musl-1.3.36.tgz"
integrity sha512-4LfMYQHzozHCKkIcmQy83b+4SpI+mOp6sYNbXqSRz5dYvTVjegKZXe596P1U/87cK2cgR4uYvkgkgBXquaWvwQ==

"@swc/[email protected].36":
version "1.3.36"
resolved "https://registry.npmjs.org/@swc/core-win32-arm64-msvc/-/core-win32-arm64-msvc-1.3.36.tgz"
integrity sha512-7y3dDcun79TAjCyk3Iv0eOMw1X/KNQbkVyKOGqnEgq9g22F8F1FoUGKHNTzUqVdzpHeJSsHgW5PlkEkl3c/d9w==

"@swc/[email protected].36":
version "1.3.36"
resolved "https://registry.npmjs.org/@swc/core-win32-ia32-msvc/-/core-win32-ia32-msvc-1.3.36.tgz"
integrity sha512-zK0VR3B4LX5hzQ+7eD+K+FkxJlJg5Lo36BeahMzQ+/i0IURpnuyFlW88sdkFkMsc2swdU6bpvxLZeIRQ3W4OUg==

"@swc/[email protected].36":
version "1.3.36"
resolved "https://registry.npmjs.org/@swc/core-win32-x64-msvc/-/core-win32-x64-msvc-1.3.36.tgz"
integrity sha512-2bIjr9DhAckGiXZEvj6z2z7ECPcTimG+wD0VuQTvr+wkx46uAJKl5Kq+Zk+dd15ErL7JGUtCet1T7bf1k4FwvQ==

"@types/prop-types@*":
version "15.7.5"
resolved "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz"
integrity sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==

"@types/react@*":
version "18.0.25"
resolved "https://registry.npmjs.org/@types/react/-/react-18.0.25.tgz"
integrity sha512-xD6c0KDT4m7n9uD4ZHi02lzskaiqcBxf4zi+tXZY98a04wvc0hi/TcCPC2FOESZi51Nd7tlUeOJY8RofL799/g==
version "18.0.28"
resolved "https://registry.npmjs.org/@types/react/-/react-18.0.28.tgz"
integrity sha512-RD0ivG1kEztNBdoAK7lekI9M+azSnitIn85h4iOiaLjaTrMjzslhaqCGaI4IyCJ1RljWiLCEu4jyrLLgqxBTew==
dependencies:
"@types/prop-types" "*"
"@types/scheduler" "*"
csstype "^3.0.2"

"@types/react-dom@^18.0.9":
version "18.0.9"
resolved "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.9.tgz"
integrity sha512-qnVvHxASt/H7i+XG1U1xMiY5t+IHcPGUK7TDMDzom08xa7e86eCeKOiLZezwCKVxJn6NEiiy2ekgX8aQssjIKg==
"@types/react-dom@^18.0.11":
version "18.0.11"
resolved "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.11.tgz"
integrity sha512-O38bPbI2CWtgw/OoQoY+BRelw7uysmXbWvw3nLWO21H1HSh+GOlqPuXshJfjmpNlKiiSDG9cc1JZAaMmVdcTlw==
dependencies:
"@types/react" "*"

Expand All @@ -95,12 +95,12 @@
resolved "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz"
integrity sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==

"@vitejs/plugin-react-swc@^3.0.0":
version "3.0.0"
resolved "https://registry.npmjs.org/@vitejs/plugin-react-swc/-/plugin-react-swc-3.0.0.tgz"
integrity sha512-vYlodz/mjYRbxMGbHzDgR8aPR+z8n7K/enWkyBGH096xrL2DIPCuTvQVRYPTXGyy6wO7OFiMxZ3r4nKQD1sH0A==
"@vitejs/plugin-react-swc@^3.2.0":
version "3.2.0"
resolved "https://registry.npmjs.org/@vitejs/plugin-react-swc/-/plugin-react-swc-3.2.0.tgz"
integrity sha512-IcBoXL/mcH7JdQr/nfDlDwTdIaH8Rg7LpfQDF4nAht+juHWIuv6WhpKPCSfY4+zztAaB07qdBoFz1XCZsgo3pQ==
dependencies:
"@swc/core" "^1.3.21"
"@swc/core" "^1.3.35"

csstype@^3.0.2:
version "3.1.1"
Expand All @@ -109,7 +109,7 @@ csstype@^3.0.2:

"js-tokens@^3.0.0 || ^4.0.0":
version "4.0.0"
resolved ""
resolved "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz"
integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==

loose-envify@^1.1.0:
Expand Down
10 changes: 8 additions & 2 deletions scripts/bundle.ts
Original file line number Diff line number Diff line change
Expand Up @@ -46,13 +46,19 @@ export declare const reactClickToComponent: () => PluginOption;
{
name: packageJSON.name,
description:
"Option+Click React components in your browser to open the source in your editor",
"Option+Right Click in your browser to open the source in your editor",
version: packageJSON.version,
author: "Arnaud Barré (https://github.com/ArnaudBarre)",
license: packageJSON.license,
repository: "github:ArnaudBarre/vite-plugin-react-click-to-component",
main: "index.js",
keywords: ["vite", "vite-plugin", "react", "click-to-component"],
keywords: [
"vite",
"vite-plugin",
"react",
"inspector",
"click-to-component",
],
peerDependencies: packageJSON.peerDependencies,
},
null,
Expand Down
Loading

0 comments on commit f59260b

Please sign in to comment.