From 44b42f35cc6923a989deb64eecb1957ee0104fc7 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Mon, 21 Jul 2025 15:56:22 +0200 Subject: [PATCH 01/26] update tsup config to only output ESM --- .storybook/local-preset.cjs | 15 -- .storybook/local-preset.ts | 12 + .storybook/main.ts | 2 +- .storybook/preview-head.html | 3 - package-lock.json | 471 ++++++++++++++++------------------- package.json | 12 +- src/components/Panel.tsx | 6 +- src/components/Tab.tsx | 2 +- tsconfig.json | 6 +- tsup.config.ts | 66 +---- 10 files changed, 255 insertions(+), 340 deletions(-) delete mode 100644 .storybook/local-preset.cjs create mode 100644 .storybook/local-preset.ts delete mode 100644 .storybook/preview-head.html diff --git a/.storybook/local-preset.cjs b/.storybook/local-preset.cjs deleted file mode 100644 index 1f63cf0..0000000 --- a/.storybook/local-preset.cjs +++ /dev/null @@ -1,15 +0,0 @@ -/** - * to load the built addon in this test Storybook - */ -function previewAnnotations(entry = []) { - return [...entry, require.resolve("../dist/preview.js")]; -} - -function managerEntries(entry = []) { - return [...entry, require.resolve("../dist/manager.js")]; -} - -module.exports = { - managerEntries, - previewAnnotations, -}; diff --git a/.storybook/local-preset.ts b/.storybook/local-preset.ts new file mode 100644 index 0000000..310aafe --- /dev/null +++ b/.storybook/local-preset.ts @@ -0,0 +1,12 @@ +import { fileURLToPath } from "node:url"; + +/** + * to load the built addon in this test Storybook + */ +export function previewAnnotations(entry = []) { + return [...entry, fileURLToPath(import.meta.resolve("../dist/preview.js"))]; +} + +export function managerEntries(entry = []) { + return [...entry, fileURLToPath(import.meta.resolve("../dist/manager.js"))]; +} diff --git a/.storybook/main.ts b/.storybook/main.ts index cec263f..9516632 100644 --- a/.storybook/main.ts +++ b/.storybook/main.ts @@ -2,7 +2,7 @@ import { defineMain } from "@storybook/react-vite/node"; const config = defineMain({ stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"], - addons: ["@storybook/addon-docs", "./local-preset.cjs"], + addons: ["@storybook/addon-docs", import.meta.resolve("./local-preset.ts")], framework: "@storybook/react-vite", }); diff --git a/.storybook/preview-head.html b/.storybook/preview-head.html deleted file mode 100644 index 05da1e9..0000000 --- a/.storybook/preview-head.html +++ /dev/null @@ -1,3 +0,0 @@ - \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 15b925a..c1a8425 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,8 +13,8 @@ "@storybook/icons": "^1.4.0" }, "devDependencies": { - "@storybook/addon-docs": "^9.0.0", - "@storybook/react-vite": "^9.0.0", + "@storybook/addon-docs": "0.0.0-pr-31819-sha-5b109949", + "@storybook/react-vite": "0.0.0-pr-31819-sha-5b109949", "@types/node": "^22", "@types/react": "^18.2.65", "@types/react-dom": "^18.2.21", @@ -26,7 +26,7 @@ "prompts": "^2.4.2", "react": "^18.2.0", "react-dom": "^18.2.0", - "storybook": "^9.0.0", + "storybook": "0.0.0-pr-31819-sha-5b109949", "ts-dedent": "^2.2.0", "tsup": "^8.2.4", "typescript": "^5.8.2", @@ -34,7 +34,7 @@ "zx": "^8.4.1" }, "peerDependencies": { - "storybook": "^9.0.0" + "storybook": "*" } }, "node_modules/@adobe/css-tools": { @@ -461,17 +461,6 @@ "@babel/core": "^7.0.0-0" } }, - "node_modules/@babel/runtime": { - "version": "7.27.3", - "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.27.3.tgz", - "integrity": "sha512-7EYtGezsdiDMyY80+65EzwiGmcJqpmcZCojSXaRgdrBaGtWTgDZKq69cPIVped6MkIM78cTQ2GOiEYjwOlG4xw==", - "dev": true, - "license": "MIT", - "peer": true, - "engines": { - "node": ">=6.9.0" - } - }, "node_modules/@babel/template": { "version": "7.27.2", "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.2.tgz", @@ -1063,9 +1052,9 @@ } }, "node_modules/@joshwooding/vite-plugin-react-docgen-typescript": { - "version": "0.6.0", - "resolved": "https://registry.npmjs.org/@joshwooding/vite-plugin-react-docgen-typescript/-/vite-plugin-react-docgen-typescript-0.6.0.tgz", - "integrity": "sha512-dPo6SE4dm8UKcgGg4LsV9iw6f5HkIeJwzMA2M2Lb+mhl5vxesbDvb3ENTzNTkGnOxS6PqJig2pfXdtYaW3S9fg==", + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/@joshwooding/vite-plugin-react-docgen-typescript/-/vite-plugin-react-docgen-typescript-0.6.1.tgz", + "integrity": "sha512-J4BaTocTOYFkMHIra1JDWrMWpNmBl4EkplIwHEsV8aeUOtdWjwSnln9U7twjMFTAEB7mptNtSKyVi1Y2W9sDJw==", "dev": true, "license": "MIT", "dependencies": { @@ -1075,7 +1064,7 @@ }, "peerDependencies": { "typescript": ">= 4.3.x", - "vite": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0" + "vite": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0" }, "peerDependenciesMeta": { "typescript": { @@ -1694,16 +1683,16 @@ ] }, "node_modules/@storybook/addon-docs": { - "version": "9.0.0", - "resolved": "https://registry.npmjs.org/@storybook/addon-docs/-/addon-docs-9.0.0.tgz", - "integrity": "sha512-uTUfJvZL3cYbDKllYXWTZTa353sO6xyyNjG8xrjDNqUIod/V0JSxbMNt/87HT443SeWZzNiWQGoenR4op7fJMA==", + "version": "0.0.0-pr-31819-sha-5b109949", + "resolved": "https://registry.npmjs.org/@storybook/addon-docs/-/addon-docs-0.0.0-pr-31819-sha-5b109949.tgz", + "integrity": "sha512-ofdZ7J+/LQUANxRBvasvYpRqETGXcGsQKrkh86JE9w7l6UaOXrP6h3RipoxhqkQusG9uQ54cHbi93hTkUr5XCA==", "dev": true, "license": "MIT", "dependencies": { "@mdx-js/react": "^3.0.0", - "@storybook/csf-plugin": "9.0.0", + "@storybook/csf-plugin": "0.0.0-pr-31819-sha-5b109949", "@storybook/icons": "^1.2.12", - "@storybook/react-dom-shim": "9.0.0", + "@storybook/react-dom-shim": "0.0.0-pr-31819-sha-5b109949", "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", "ts-dedent": "^2.0.0" @@ -1713,17 +1702,17 @@ "url": "https://opencollective.com/storybook" }, "peerDependencies": { - "storybook": "^9.0.0" + "storybook": "^0.0.0-pr-31819-sha-5b109949" } }, "node_modules/@storybook/builder-vite": { - "version": "9.0.0", - "resolved": "https://registry.npmjs.org/@storybook/builder-vite/-/builder-vite-9.0.0.tgz", - "integrity": "sha512-0idj9v6ttbuT8ms/N7J4y1x034XM1vgAbfpJHUaO0+AcRoER3/hOiVG6563mE/uDFe+DXyf1BZk6n/VvhtgQcA==", + "version": "0.0.0-pr-31819-sha-5b109949", + "resolved": "https://registry.npmjs.org/@storybook/builder-vite/-/builder-vite-0.0.0-pr-31819-sha-5b109949.tgz", + "integrity": "sha512-QXeminI4UCTWr6xOePKm4rYOgxz++39M6EeS+fQH7wTfZZ+DqC9viHO1LQxue1IQ7713Or3DMWFkpbndOE0TKw==", "dev": true, "license": "MIT", "dependencies": { - "@storybook/csf-plugin": "9.0.0", + "@storybook/csf-plugin": "0.0.0-pr-31819-sha-5b109949", "ts-dedent": "^2.0.0" }, "funding": { @@ -1731,25 +1720,43 @@ "url": "https://opencollective.com/storybook" }, "peerDependencies": { - "storybook": "^9.0.0", - "vite": "^5.0.0 || ^6.0.0" + "storybook": "^0.0.0-pr-31819-sha-5b109949", + "vite": "^5.0.0 || ^6.0.0 || ^7.0.0" } }, "node_modules/@storybook/csf-plugin": { - "version": "9.0.0", - "resolved": "https://registry.npmjs.org/@storybook/csf-plugin/-/csf-plugin-9.0.0.tgz", - "integrity": "sha512-UzKl2jEMrb0RBtY44uyZXL4wrX4Q5nKcEnKsSbEADB4o7pD5lCpG9BGGL+8o02lol8I7SnSTcaZ0ByzoBdGFIA==", + "version": "0.0.0-pr-31819-sha-5b109949", + "resolved": "https://registry.npmjs.org/@storybook/csf-plugin/-/csf-plugin-0.0.0-pr-31819-sha-5b109949.tgz", + "integrity": "sha512-7jo8UWnqAC2DI4b93CG6MGXowdQZUtmIWyxb8EVskAghQAhXvHa58Sv7Xymxy8hys/NnosxuDpkZVnoBYaK9LA==", "dev": true, "license": "MIT", "dependencies": { - "unplugin": "^1.3.1" + "unplugin": "^2.3.5" }, "funding": { "type": "opencollective", "url": "https://opencollective.com/storybook" }, "peerDependencies": { - "storybook": "^9.0.0" + "esbuild": "*", + "rollup": "*", + "storybook": "^0.0.0-pr-31819-sha-5b109949", + "vite": "*", + "webpack": "*" + }, + "peerDependenciesMeta": { + "esbuild": { + "optional": true + }, + "rollup": { + "optional": true + }, + "vite": { + "optional": true + }, + "webpack": { + "optional": true + } } }, "node_modules/@storybook/global": { @@ -1773,26 +1780,23 @@ } }, "node_modules/@storybook/react": { - "version": "9.0.0", - "resolved": "https://registry.npmjs.org/@storybook/react/-/react-9.0.0.tgz", - "integrity": "sha512-GhiV7lnMOezZXUPbgxlDXK5jSQq63hgvPDku3Qw/r3w+LZUIihO8hMPK7Ml1o0BnLu6SwOh4Zp0nSyb8En1U9g==", + "version": "0.0.0-pr-31819-sha-5b109949", + "resolved": "https://registry.npmjs.org/@storybook/react/-/react-0.0.0-pr-31819-sha-5b109949.tgz", + "integrity": "sha512-X0plFCtcjWqz8VXPotrGueJIamQhmPNCQDbjaOeKx4kpYFKNg+Q/6KYrdoTE/SQkYRoz8re984GUtKiQFaFsaA==", "dev": true, "license": "MIT", "dependencies": { "@storybook/global": "^5.0.0", - "@storybook/react-dom-shim": "9.0.0" - }, - "engines": { - "node": ">=20.0.0" + "@storybook/react-dom-shim": "0.0.0-pr-31819-sha-5b109949" }, "funding": { "type": "opencollective", "url": "https://opencollective.com/storybook" }, "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta", - "storybook": "^9.0.0", + "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", + "storybook": "^0.0.0-pr-31819-sha-5b109949", "typescript": ">= 4.9.x" }, "peerDependenciesMeta": { @@ -1802,9 +1806,9 @@ } }, "node_modules/@storybook/react-dom-shim": { - "version": "9.0.0", - "resolved": "https://registry.npmjs.org/@storybook/react-dom-shim/-/react-dom-shim-9.0.0.tgz", - "integrity": "sha512-ywg3wX5MkbNBT9baV4YNh7f03l6aXdg4sPYa+DubPLfcc1EFCR88mIqMilah8KbKsgGIPZMqX7vCBJdg4e9hBQ==", + "version": "0.0.0-pr-31819-sha-5b109949", + "resolved": "https://registry.npmjs.org/@storybook/react-dom-shim/-/react-dom-shim-0.0.0-pr-31819-sha-5b109949.tgz", + "integrity": "sha512-JFS1ORfRlglmz+nql0iKoyy9InoE7ZqcMqnw2w1rnq35G8MAzSo3y9tW9e1A45UcrR5YlS5Rl6IodzMT5bXBzw==", "dev": true, "license": "MIT", "funding": { @@ -1812,61 +1816,37 @@ "url": "https://opencollective.com/storybook" }, "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta", - "storybook": "^9.0.0" + "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", + "storybook": "^0.0.0-pr-31819-sha-5b109949" } }, "node_modules/@storybook/react-vite": { - "version": "9.0.0", - "resolved": "https://registry.npmjs.org/@storybook/react-vite/-/react-vite-9.0.0.tgz", - "integrity": "sha512-kwejTvwj9gGUCKWl3FcRF/HxnVWK/sQvv7k874FvOiQGgzu/Nm9nd4Waz/0+e97K7tLO86LBlTcira0Su7eG9g==", + "version": "0.0.0-pr-31819-sha-5b109949", + "resolved": "https://registry.npmjs.org/@storybook/react-vite/-/react-vite-0.0.0-pr-31819-sha-5b109949.tgz", + "integrity": "sha512-q7VrllCfWgaPYsKm531x0WgDNCSZXYQEhlKNmEC8r/Sn021ggo3RhOYsvMt0ZeVhm53/RNkCiNPchnKNYaBIWQ==", "dev": true, "license": "MIT", "dependencies": { - "@joshwooding/vite-plugin-react-docgen-typescript": "0.6.0", + "@joshwooding/vite-plugin-react-docgen-typescript": "0.6.1", "@rollup/pluginutils": "^5.0.2", - "@storybook/builder-vite": "9.0.0", - "@storybook/react": "9.0.0", - "find-up": "^5.0.0", + "@storybook/builder-vite": "0.0.0-pr-31819-sha-5b109949", + "@storybook/react": "0.0.0-pr-31819-sha-5b109949", + "find-up": "^7.0.0", "magic-string": "^0.30.0", "react-docgen": "^8.0.0", "resolve": "^1.22.8", "tsconfig-paths": "^4.2.0" }, - "engines": { - "node": ">=20.0.0" - }, "funding": { "type": "opencollective", "url": "https://opencollective.com/storybook" }, "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta", - "storybook": "^9.0.0", - "vite": "^5.0.0 || ^6.0.0" - } - }, - "node_modules/@testing-library/dom": { - "version": "10.4.0", - "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.0.tgz", - "integrity": "sha512-pemlzrSESWbdAloYml3bAJMEfNh1Z7EduzqPKprCH5S341frlpYnUEW0H72dLxa6IsYr+mPno20GiSm+h9dEdQ==", - "dev": true, - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/code-frame": "^7.10.4", - "@babel/runtime": "^7.12.5", - "@types/aria-query": "^5.0.1", - "aria-query": "5.3.0", - "chalk": "^4.1.0", - "dom-accessibility-api": "^0.5.9", - "lz-string": "^1.5.0", - "pretty-format": "^27.0.2" - }, - "engines": { - "node": ">=18" + "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", + "storybook": "^0.0.0-pr-31819-sha-5b109949", + "vite": "^5.0.0 || ^6.0.0 || ^7.0.0" } }, "node_modules/@testing-library/jest-dom": { @@ -1953,14 +1933,6 @@ "dev": true, "license": "MIT" }, - "node_modules/@types/aria-query": { - "version": "5.0.4", - "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz", - "integrity": "sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==", - "dev": true, - "license": "MIT", - "peer": true - }, "node_modules/@types/babel__core": { "version": "7.20.5", "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz", @@ -2006,6 +1978,16 @@ "@babel/types": "^7.20.7" } }, + "node_modules/@types/chai": { + "version": "5.2.2", + "resolved": "https://registry.npmjs.org/@types/chai/-/chai-5.2.2.tgz", + "integrity": "sha512-8kB30R7Hwqf40JPiKhVzodJs2Qc1ZJ5zuT3uzw5Hq/dhNCl3G3l83jfpdI1e20BP348+fV7VIL/+FxaXkqBmWg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/deep-eql": "*" + } + }, "node_modules/@types/command-line-args": { "version": "5.2.3", "resolved": "https://registry.npmjs.org/@types/command-line-args/-/command-line-args-5.2.3.tgz", @@ -2020,6 +2002,13 @@ "dev": true, "license": "MIT" }, + "node_modules/@types/deep-eql": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/@types/deep-eql/-/deep-eql-4.0.2.tgz", + "integrity": "sha512-c9h9dVVMigMPc4bwTvC5dxqtqJZwQPePsWjPlpSOnojbor6pGqdk541lfA7AqFQr5pB1BRdq0juY9db81BwyFw==", + "dev": true, + "license": "MIT" + }, "node_modules/@types/doctrine": { "version": "0.0.9", "resolved": "https://registry.npmjs.org/@types/doctrine/-/doctrine-0.0.9.tgz", @@ -2115,14 +2104,15 @@ } }, "node_modules/@vitest/expect": { - "version": "3.0.9", - "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-3.0.9.tgz", - "integrity": "sha512-5eCqRItYgIML7NNVgJj6TVCmdzE7ZVgJhruW0ziSQV4V7PvLkDL1bBkBdcTs/VuIz0IxPb5da1IDSqc1TR9eig==", + "version": "3.2.4", + "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-3.2.4.tgz", + "integrity": "sha512-Io0yyORnB6sikFlt8QW5K7slY4OjqNX9jmJQ02QDda8lyM6B5oNgVWoSoKPac8/kgnCUzuHQKrSLtu/uOqqrig==", "dev": true, "license": "MIT", "dependencies": { - "@vitest/spy": "3.0.9", - "@vitest/utils": "3.0.9", + "@types/chai": "^5.2.2", + "@vitest/spy": "3.2.4", + "@vitest/utils": "3.2.4", "chai": "^5.2.0", "tinyrainbow": "^2.0.0" }, @@ -2130,10 +2120,47 @@ "url": "https://opencollective.com/vitest" } }, + "node_modules/@vitest/mocker": { + "version": "3.2.4", + "resolved": "https://registry.npmjs.org/@vitest/mocker/-/mocker-3.2.4.tgz", + "integrity": "sha512-46ryTE9RZO/rfDd7pEqFl7etuyzekzEhUbTW3BvmeO/BcCMEgq59BKhek3dXDWgAj4oMK6OZi+vRr1wPW6qjEQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@vitest/spy": "3.2.4", + "estree-walker": "^3.0.3", + "magic-string": "^0.30.17" + }, + "funding": { + "url": "https://opencollective.com/vitest" + }, + "peerDependencies": { + "msw": "^2.4.9", + "vite": "^5.0.0 || ^6.0.0 || ^7.0.0-0" + }, + "peerDependenciesMeta": { + "msw": { + "optional": true + }, + "vite": { + "optional": true + } + } + }, + "node_modules/@vitest/mocker/node_modules/estree-walker": { + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-3.0.3.tgz", + "integrity": "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/estree": "^1.0.0" + } + }, "node_modules/@vitest/pretty-format": { - "version": "3.0.9", - "resolved": "https://registry.npmjs.org/@vitest/pretty-format/-/pretty-format-3.0.9.tgz", - "integrity": "sha512-OW9F8t2J3AwFEwENg3yMyKWweF7oRJlMyHOMIhO5F3n0+cgQAJZBjNgrF8dLwFTEXl5jUqBLXd9QyyKv8zEcmA==", + "version": "3.2.4", + "resolved": "https://registry.npmjs.org/@vitest/pretty-format/-/pretty-format-3.2.4.tgz", + "integrity": "sha512-IVNZik8IVRJRTr9fxlitMKeJeXFFFN0JaB9PHPGQ8NKQbGpfjlTx9zO4RefN8gp7eqjNy8nyK3NZmBzOPeIxtA==", "dev": true, "license": "MIT", "dependencies": { @@ -2144,27 +2171,27 @@ } }, "node_modules/@vitest/spy": { - "version": "3.0.9", - "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-3.0.9.tgz", - "integrity": "sha512-/CcK2UDl0aQ2wtkp3YVWldrpLRNCfVcIOFGlVGKO4R5eajsH393Z1yiXLVQ7vWsj26JOEjeZI0x5sm5P4OGUNQ==", + "version": "3.2.4", + "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-3.2.4.tgz", + "integrity": "sha512-vAfasCOe6AIK70iP5UD11Ac4siNUNJ9i/9PZ3NKx07sG6sUxeag1LWdNrMWeKKYBLlzuK+Gn65Yd5nyL6ds+nw==", "dev": true, "license": "MIT", "dependencies": { - "tinyspy": "^3.0.2" + "tinyspy": "^4.0.3" }, "funding": { "url": "https://opencollective.com/vitest" } }, "node_modules/@vitest/utils": { - "version": "3.0.9", - "resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-3.0.9.tgz", - "integrity": "sha512-ilHM5fHhZ89MCp5aAaM9uhfl1c2JdxVxl3McqsdVyVNN6JffnEen8UMCdRTzOhGXNQGo5GNL9QugHrz727Wnng==", + "version": "3.2.4", + "resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-3.2.4.tgz", + "integrity": "sha512-fB2V0JFrQSMsCo9HiSq3Ezpdv4iYaXRG1Sx8edX3MwxfyNn83mKiGzOcH+Fkxt4MHxr3y42fQi1oeAInqgX2QA==", "dev": true, "license": "MIT", "dependencies": { - "@vitest/pretty-format": "3.0.9", - "loupe": "^3.1.3", + "@vitest/pretty-format": "3.2.4", + "loupe": "^3.1.4", "tinyrainbow": "^2.0.0" }, "funding": { @@ -2638,9 +2665,9 @@ "license": "CC-BY-4.0" }, "node_modules/chai": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/chai/-/chai-5.2.0.tgz", - "integrity": "sha512-mCuXncKXk5iCLhfhwTc0izo0gtEmpz5CtG2y8GiOINBlMVS6v8TMRc5TaLWKS6692m9+dVVfzgeVxR5UxWHTYw==", + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/chai/-/chai-5.2.1.tgz", + "integrity": "sha512-5nFxhUrX0PqtyogoYOA8IPswy5sZFTOsBFl/9bNsmDLgsxYTzSZQJDPppDnZPTQbzSEm0hqGjWPzRemQCYbD6A==", "dev": true, "license": "MIT", "dependencies": { @@ -2651,7 +2678,7 @@ "pathval": "^2.0.0" }, "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/chalk": { @@ -3160,14 +3187,6 @@ "node": ">=6.0.0" } }, - "node_modules/dom-accessibility-api": { - "version": "0.5.16", - "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz", - "integrity": "sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==", - "dev": true, - "license": "MIT", - "peer": true - }, "node_modules/dotenv": { "version": "8.6.0", "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.6.0.tgz", @@ -3298,19 +3317,6 @@ "@esbuild/win32-x64": "0.25.5" } }, - "node_modules/esbuild-register": { - "version": "3.6.0", - "resolved": "https://registry.npmjs.org/esbuild-register/-/esbuild-register-3.6.0.tgz", - "integrity": "sha512-H2/S7Pm8a9CL1uhp9OvjwrBh5Pvx0H8qVOxNu8Wed9Y7qv56MPtq+GGM8RJpq6glYJn9Wspr8uw7l55uyinNeg==", - "dev": true, - "license": "MIT", - "dependencies": { - "debug": "^4.3.4" - }, - "peerDependencies": { - "esbuild": ">=0.12 <1" - } - }, "node_modules/escalade": { "version": "3.2.0", "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz", @@ -3475,17 +3481,18 @@ } }, "node_modules/find-up": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", - "integrity": "sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==", + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/find-up/-/find-up-7.0.0.tgz", + "integrity": "sha512-YyZM99iHrqLKjmt4LJDj58KI+fYyufRLBSYcqycxf//KpBk9FoewoGX0450m9nB44qrZnovzC2oeP5hUibxc/g==", "dev": true, "license": "MIT", "dependencies": { - "locate-path": "^6.0.0", - "path-exists": "^4.0.0" + "locate-path": "^7.2.0", + "path-exists": "^5.0.0", + "unicorn-magic": "^0.1.0" }, "engines": { - "node": ">=10" + "node": ">=18" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" @@ -4094,6 +4101,7 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==", + "dev": true, "license": "MIT" }, "node_modules/jsesc": { @@ -4207,16 +4215,16 @@ } }, "node_modules/locate-path": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz", - "integrity": "sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==", + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-7.2.0.tgz", + "integrity": "sha512-gvVijfZvn7R+2qyPX8mAuKcFGDf6Nc61GdvGafQsHL0sBIxfKzA+usWn4GFC/bk+QdwPUD4kWFJLhElipq+0VA==", "dev": true, "license": "MIT", "dependencies": { - "p-locate": "^5.0.0" + "p-locate": "^6.0.0" }, "engines": { - "node": ">=10" + "node": "^12.20.0 || ^14.13.1 || >=16.0.0" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" @@ -4279,6 +4287,7 @@ "version": "1.4.0", "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", + "dev": true, "license": "MIT", "dependencies": { "js-tokens": "^3.0.0 || ^4.0.0" @@ -4288,9 +4297,9 @@ } }, "node_modules/loupe": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/loupe/-/loupe-3.1.3.tgz", - "integrity": "sha512-kkIp7XSkP78ZxJEsSxW3712C6teJVoeHHwgo9zJ380de7IYyJ2ISlxojcH2pC5OFLewESmnRi/+XCDIEEVyoug==", + "version": "3.1.4", + "resolved": "https://registry.npmjs.org/loupe/-/loupe-3.1.4.tgz", + "integrity": "sha512-wJzkKwJrheKtknCOKNEtDK4iqg/MxmZheEMtSTYvnzRdEYaZzmgH976nenp8WdJRdx5Vc1X/9MO0Oszl6ezeXg==", "dev": true, "license": "MIT" }, @@ -4304,17 +4313,6 @@ "yallist": "^3.0.2" } }, - "node_modules/lz-string": { - "version": "1.5.0", - "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz", - "integrity": "sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==", - "dev": true, - "license": "MIT", - "peer": true, - "bin": { - "lz-string": "bin/bin.js" - } - }, "node_modules/magic-string": { "version": "0.30.17", "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.17.tgz", @@ -4692,32 +4690,32 @@ } }, "node_modules/p-limit": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz", - "integrity": "sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==", + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-4.0.0.tgz", + "integrity": "sha512-5b0R4txpzjPWVw/cXXUResoD4hb6U/x9BH08L7nw+GN1sezDzPdxeRvpc9c433fZhBan/wusjbCsqwqm4EIBIQ==", "dev": true, "license": "MIT", "dependencies": { - "yocto-queue": "^0.1.0" + "yocto-queue": "^1.0.0" }, "engines": { - "node": ">=10" + "node": "^12.20.0 || ^14.13.1 || >=16.0.0" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" } }, "node_modules/p-locate": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-5.0.0.tgz", - "integrity": "sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==", + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-6.0.0.tgz", + "integrity": "sha512-wPrq66Llhl7/4AGC6I+cqxT07LhXvWL08LNXz1fENOw0Ap4sRZZ/gZpTTJ5jpurzzzfS2W/Ge9BY3LgLjCShcw==", "dev": true, "license": "MIT", "dependencies": { - "p-limit": "^3.0.2" + "p-limit": "^4.0.0" }, "engines": { - "node": ">=10" + "node": "^12.20.0 || ^14.13.1 || >=16.0.0" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" @@ -4809,13 +4807,13 @@ } }, "node_modules/path-exists": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz", - "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==", + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-5.0.0.tgz", + "integrity": "sha512-RjhtfwJOxzcFmNOi6ltcbcu4Iu+FL3zEj83dk4kAS+fVpTxXLO1b38RvJgT/0QwvV/L3aY9TAnyv0EOqW4GoMQ==", "dev": true, "license": "MIT", "engines": { - "node": ">=8" + "node": "^12.20.0 || ^14.13.1 || >=16.0.0" } }, "node_modules/path-is-absolute": { @@ -4887,9 +4885,9 @@ "license": "MIT" }, "node_modules/pathval": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/pathval/-/pathval-2.0.0.tgz", - "integrity": "sha512-vE7JKRyES09KiunauX7nd2Q9/L7lhok4smP9RZTDeD4MVs72Dp2qNFVz39Nz5a0FVEW0BJR6C0DYrq6unoziZA==", + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/pathval/-/pathval-2.0.1.tgz", + "integrity": "sha512-//nshmD55c46FuFw26xV/xFAaB5HF9Xdap7HJBBnrKdAd6/GxDBaNA1870O79+9ueg61cZLSVc+OaFlfmObYVQ==", "dev": true, "license": "MIT", "engines": { @@ -5083,36 +5081,6 @@ "url": "https://github.com/prettier/prettier?sponsor=1" } }, - "node_modules/pretty-format": { - "version": "27.5.1", - "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz", - "integrity": "sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==", - "dev": true, - "license": "MIT", - "peer": true, - "dependencies": { - "ansi-regex": "^5.0.1", - "ansi-styles": "^5.0.0", - "react-is": "^17.0.1" - }, - "engines": { - "node": "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0" - } - }, - "node_modules/pretty-format/node_modules/ansi-styles": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz", - "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==", - "dev": true, - "license": "MIT", - "peer": true, - "engines": { - "node": ">=10" - }, - "funding": { - "url": "https://github.com/chalk/ansi-styles?sponsor=1" - } - }, "node_modules/pretty-ms": { "version": "7.0.1", "resolved": "https://registry.npmjs.org/pretty-ms/-/pretty-ms-7.0.1.tgz", @@ -5194,6 +5162,7 @@ "version": "18.3.1", "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz", "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==", + "dev": true, "license": "MIT", "dependencies": { "loose-envify": "^1.1.0" @@ -5225,9 +5194,9 @@ } }, "node_modules/react-docgen-typescript": { - "version": "2.2.2", - "resolved": "https://registry.npmjs.org/react-docgen-typescript/-/react-docgen-typescript-2.2.2.tgz", - "integrity": "sha512-tvg2ZtOpOi6QDwsb3GZhOjDkkX0h8Z2gipvTg6OVMUyoYoURhEiRNePT8NZItTVCDh39JJHnLdfCOkzoLbFnTg==", + "version": "2.4.0", + "resolved": "https://registry.npmjs.org/react-docgen-typescript/-/react-docgen-typescript-2.4.0.tgz", + "integrity": "sha512-ZtAp5XTO5HRzQctjPU0ybY0RRCQO19X/8fxn3w7y2VVTUbGHDKULPTL4ky3vB05euSgG5NpALhEhDPvQ56wvXg==", "dev": true, "license": "MIT", "peerDependencies": { @@ -5238,6 +5207,7 @@ "version": "18.3.1", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==", + "dev": true, "license": "MIT", "dependencies": { "loose-envify": "^1.1.0", @@ -5247,14 +5217,6 @@ "react": "^18.3.1" } }, - "node_modules/react-is": { - "version": "17.0.2", - "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", - "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==", - "dev": true, - "license": "MIT", - "peer": true - }, "node_modules/react-refresh": { "version": "0.17.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.17.0.tgz", @@ -5511,6 +5473,7 @@ "version": "0.23.2", "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz", "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==", + "dev": true, "license": "MIT", "dependencies": { "loose-envify": "^1.1.0" @@ -5701,26 +5664,27 @@ } }, "node_modules/storybook": { - "version": "9.0.0", - "resolved": "https://registry.npmjs.org/storybook/-/storybook-9.0.0.tgz", - "integrity": "sha512-/deRNPirp/q2JIZVXrgO4YtzCSvOXTKat4mYn76vqElwwN7GcD87ELNMm99SJIvghX+Ed/AfyR30Mf37B3E4/A==", + "version": "0.0.0-pr-31819-sha-5b109949", + "resolved": "https://registry.npmjs.org/storybook/-/storybook-0.0.0-pr-31819-sha-5b109949.tgz", + "integrity": "sha512-mdFfRfD5VU33mqduxB0wK2cOprAq/MJDNWxaCRJBu+YiDuyN9KAQemGaMBPPskcohfNryG4G3v7c1QotPZSxkA==", "dev": true, "license": "MIT", "dependencies": { "@storybook/global": "^5.0.0", + "@storybook/icons": "^1.4.0", "@testing-library/jest-dom": "^6.6.3", "@testing-library/user-event": "^14.6.1", - "@vitest/expect": "3.0.9", - "@vitest/spy": "3.0.9", + "@vitest/expect": "3.2.4", + "@vitest/mocker": "3.2.4", + "@vitest/spy": "3.2.4", "better-opn": "^3.0.2", "esbuild": "^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0 || ^0.24.0 || ^0.25.0", - "esbuild-register": "^3.5.0", "recast": "^0.23.5", "semver": "^7.6.2", "ws": "^8.18.0" }, "bin": { - "storybook": "bin/index.cjs" + "storybook": "dist/bin/dispatcher.js" }, "funding": { "type": "opencollective", @@ -6089,9 +6053,9 @@ } }, "node_modules/tinyspy": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/tinyspy/-/tinyspy-3.0.2.tgz", - "integrity": "sha512-n1cw8k1k0x4pgA2+9XrOkFydTerNcJ1zWCO5Nn9scWHTD+5tp8dghT2x1uduQePZTZgd3Tupf+x9BxJjeJi77Q==", + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/tinyspy/-/tinyspy-4.0.3.tgz", + "integrity": "sha512-t2T/WLB2WRgZ9EpE4jgPJ9w+i66UZfDc8wHh0xrwiRNN+UwH98GIJkTeZqX9rg0i0ptwzqW+uYeIF0T4F8LR7A==", "dev": true, "license": "MIT", "engines": { @@ -6359,21 +6323,6 @@ "webidl-conversions": "^4.0.2" } }, - "node_modules/tsup/node_modules/yaml": { - "version": "2.8.0", - "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.0.tgz", - "integrity": "sha512-4lLa/EcQCB0cJkyts+FpIRx5G/llPxfP6VQU5KByHEhLxY3IJCH0f0Hy1MHI8sClTvsIb8qwRJ6R/ZdlDJ/leQ==", - "dev": true, - "license": "ISC", - "optional": true, - "peer": true, - "bin": { - "yaml": "bin.mjs" - }, - "engines": { - "node": ">= 14.6" - } - }, "node_modules/type-fest": { "version": "0.21.3", "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz", @@ -6432,6 +6381,19 @@ "dev": true, "license": "MIT" }, + "node_modules/unicorn-magic": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/unicorn-magic/-/unicorn-magic-0.1.0.tgz", + "integrity": "sha512-lRfVq8fE8gz6QMBuDM6a+LO3IAzTi05H6gCVaUpir2E1Rwpo4ZUog45KpNXKC/Mn3Yb9UDuHumeFTo9iV/D9FQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/universal-user-agent": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/universal-user-agent/-/universal-user-agent-6.0.1.tgz", @@ -6440,17 +6402,18 @@ "license": "ISC" }, "node_modules/unplugin": { - "version": "1.16.1", - "resolved": "https://registry.npmjs.org/unplugin/-/unplugin-1.16.1.tgz", - "integrity": "sha512-4/u/j4FrCKdi17jaxuJA0jClGxB1AvU2hw/IuayPc4ay1XGaJs/rbb4v5WKwAjNifjmXK9PIFyuPiaK8azyR9w==", + "version": "2.3.5", + "resolved": "https://registry.npmjs.org/unplugin/-/unplugin-2.3.5.tgz", + "integrity": "sha512-RyWSb5AHmGtjjNQ6gIlA67sHOsWpsbWpwDokLwTcejVdOjEkJZh7QKu14J00gDDVSh8kGH4KYC/TNBceXFZhtw==", "dev": true, "license": "MIT", "dependencies": { - "acorn": "^8.14.0", + "acorn": "^8.14.1", + "picomatch": "^4.0.2", "webpack-virtual-modules": "^0.6.2" }, "engines": { - "node": ">=14.0.0" + "node": ">=18.12.0" } }, "node_modules/update-browserslist-db": { @@ -7240,13 +7203,13 @@ } }, "node_modules/yocto-queue": { - "version": "0.1.0", - "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz", - "integrity": "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==", + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-1.2.1.tgz", + "integrity": "sha512-AyeEbWOu/TAXdxlV9wmGcR0+yh2j3vYPGOECcIj2S7MkrLyC7ne+oye2BKTItt0ii2PHk4cDy+95+LshzbXnGg==", "dev": true, "license": "MIT", "engines": { - "node": ">=10" + "node": ">=12.20" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" diff --git a/package.json b/package.json index 227659e..1bb6493 100644 --- a/package.json +++ b/package.json @@ -34,6 +34,7 @@ "*.d.ts" ], "scripts": { + "prebuild": "node -e \"fs.rmSync('./dist', { recursive: true, force: true })\"", "postinstall": "node scripts/welcome.js", "build": "tsup", "build:watch": "npm run build -- --watch", @@ -49,8 +50,8 @@ "@storybook/icons": "^1.4.0" }, "devDependencies": { - "@storybook/addon-docs": "^9.0.0", - "@storybook/react-vite": "^9.0.0", + "@storybook/addon-docs": "0.0.0-pr-31819-sha-5b109949", + "@storybook/react-vite": "0.0.0-pr-31819-sha-5b109949", "@types/node": "^22", "@types/react": "^18.2.65", "@types/react-dom": "^18.2.21", @@ -62,7 +63,7 @@ "prompts": "^2.4.2", "react": "^18.2.0", "react-dom": "^18.2.0", - "storybook": "^9.0.0", + "storybook": "0.0.0-pr-31819-sha-5b109949", "ts-dedent": "^2.2.0", "tsup": "^8.2.4", "typescript": "^5.8.2", @@ -70,15 +71,12 @@ "zx": "^8.4.1" }, "peerDependencies": { - "storybook": "^9.0.0" + "storybook": "*" }, "publishConfig": { "access": "public" }, "bundler": { - "exportEntries": [ - "src/index.ts" - ], "managerEntries": [ "src/manager.tsx" ], diff --git a/src/components/Panel.tsx b/src/components/Panel.tsx index b0c6e2d..0ec1225 100644 --- a/src/components/Panel.tsx +++ b/src/components/Panel.tsx @@ -1,5 +1,5 @@ import React, { Fragment, memo, useCallback, useState } from "react"; -import { Result } from "src/types"; +import type { Result } from "src/types"; import { AddonPanel } from "storybook/internal/components"; import { Button, Placeholder, TabsState } from "storybook/internal/components"; import { useChannel } from "storybook/manager-api"; @@ -9,7 +9,7 @@ import { EVENTS } from "../constants"; import { List } from "./List"; interface PanelProps { - active: boolean; + active?: boolean; } export const RequestDataButton = styled(Button)({ @@ -37,7 +37,7 @@ export const Panel: React.FC = memo(function MyPanel(props) { }, [emit]); return ( - + ({ diff --git a/tsconfig.json b/tsconfig.json index 577c57a..cfe56f0 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -7,7 +7,7 @@ "resolveJsonModule": true, "moduleDetection": "force", "moduleResolution": "bundler", - "module": "preserve", + "module": "esnext", "jsx": "react", "isolatedModules": true, "verbatimModuleSyntax": true, @@ -15,9 +15,9 @@ "noUncheckedIndexedAccess": true, "noImplicitOverride": true, "noImplicitAny": true, - "lib": ["es2023", "dom", "dom.iterable"], + "lib": ["esnext", "dom", "dom.iterable"], "baseUrl": ".", "rootDir": "./src" }, - "include": ["src/**/*"] + "include": ["src/**/*", "tsup.config.ts"] } diff --git a/tsup.config.ts b/tsup.config.ts index 117ce8f..04057ef 100644 --- a/tsup.config.ts +++ b/tsup.config.ts @@ -1,73 +1,37 @@ -import { readFile } from "node:fs/promises"; - import { defineConfig, type Options } from "tsup"; -import { globalPackages as globalManagerPackages } from "storybook/internal/manager/globals"; -import { globalPackages as globalPreviewPackages } from "storybook/internal/preview/globals"; - const NODE_TARGET: Options["target"] = "node20"; -type BundlerConfig = { - bundler?: { - exportEntries?: string[]; - nodeEntries?: string[]; - managerEntries?: string[]; - previewEntries?: string[]; - }; -}; - export default defineConfig(async (options) => { // reading the three types of entries from package.json, which has the following structure: // { // ... // "bundler": { - // "exportEntries": ["./src/index.ts"], // "managerEntries": ["./src/manager.ts"], // "previewEntries": ["./src/preview.ts"] // "nodeEntries": ["./src/preset.ts"] // } // } - const packageJson = (await readFile("./package.json", "utf8").then( - JSON.parse, - )) as BundlerConfig; + const packageJson = ( + await import("./package.json", { with: { type: "json" } }) + ).default; + const { - bundler: { - exportEntries = [], - managerEntries = [], - previewEntries = [], - nodeEntries = [], - } = {}, + bundler: { managerEntries = [], previewEntries = [], nodeEntries = [] }, } = packageJson; const commonConfig: Options = { - splitting: false, - minify: !options.watch, - treeshake: true, - sourcemap: true, // keep this line commented until https://github.com/egoist/tsup/issues/1270 is resolved // clean: options.watch ? false : true, clean: false, + format: ["esm"], + treeshake: true, + splitting: true, + external: ["react", "react-dom", "@storybook/icons"], }; const configs: Options[] = []; - // export entries are entries meant to be manually imported by the user - // they are not meant to be loaded by the manager or preview - // they'll be usable in both node and browser environments, depending on which features and modules they depend on - if (exportEntries.length) { - configs.push({ - ...commonConfig, - entry: exportEntries, - dts: { - resolve: true, - }, - format: ["esm", "cjs"], - platform: "neutral", - target: NODE_TARGET, - external: [...globalManagerPackages, ...globalPreviewPackages], - }); - } - // manager entries are entries meant to be loaded into the manager UI // they'll have manager-specific packages externalized and they won't be usable in node // they won't have types generated for them as they're usually loaded automatically by Storybook @@ -75,9 +39,8 @@ export default defineConfig(async (options) => { configs.push({ ...commonConfig, entry: managerEntries, - format: ["esm"], platform: "browser", - external: globalManagerPackages, + target: "esnext", }); } @@ -88,12 +51,9 @@ export default defineConfig(async (options) => { configs.push({ ...commonConfig, entry: previewEntries, - dts: { - resolve: true, - }, - format: ["esm", "cjs"], platform: "browser", - external: globalPreviewPackages, + target: "esnext", + dts: true, }); } @@ -104,8 +64,8 @@ export default defineConfig(async (options) => { configs.push({ ...commonConfig, entry: nodeEntries, - format: ["cjs"], platform: "node", + target: NODE_TARGET, }); } From ade228b6dbc6d427ac6e59099c3d7aa8cfc72cac Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Mon, 21 Jul 2025 16:04:00 +0200 Subject: [PATCH 02/26] update export map, move @storybook/icons to devDependency, upgrade dependencies --- package-lock.json | 925 +++++++++++++++++----------------------------- package.json | 46 +-- 2 files changed, 348 insertions(+), 623 deletions(-) diff --git a/package-lock.json b/package-lock.json index c1a8425..0ca8a0e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,23 +15,23 @@ "devDependencies": { "@storybook/addon-docs": "0.0.0-pr-31819-sha-5b109949", "@storybook/react-vite": "0.0.0-pr-31819-sha-5b109949", - "@types/node": "^22", + "@types/node": "^20", "@types/react": "^18.2.65", "@types/react-dom": "^18.2.21", - "@vitejs/plugin-react": "^4.2.1", - "auto": "^11.1.1", - "boxen": "^7.1.1", - "npm-run-all2": "^6.2.3", - "prettier": "^3.3.3", + "@vitejs/plugin-react": "^4.7.0", + "auto": "^11.3.0", + "boxen": "^8.0.1", + "npm-run-all2": "^8.0.4", + "prettier": "^3.6.2", "prompts": "^2.4.2", "react": "^18.2.0", "react-dom": "^18.2.0", "storybook": "0.0.0-pr-31819-sha-5b109949", "ts-dedent": "^2.2.0", - "tsup": "^8.2.4", - "typescript": "^5.8.2", - "vite": "^5.3.5", - "zx": "^8.4.1" + "tsup": "^8.5.0", + "typescript": "^5.8.3", + "vite": "^7.0.5", + "zx": "^8.7.1" }, "peerDependencies": { "storybook": "*" @@ -263,22 +263,22 @@ } }, "node_modules/@babel/core": { - "version": "7.27.3", - "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.27.3.tgz", - "integrity": "sha512-hyrN8ivxfvJ4i0fIJuV4EOlV0WDMz5Ui4StRTgVaAvWeiRCilXgwVvxJKtFQ3TKtHgJscB2YiXKGNJuVwhQMtA==", + "version": "7.28.0", + "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.28.0.tgz", + "integrity": "sha512-UlLAnTPrFdNGoFtbSXwcGFQBtQZJCNjaN6hQNP3UPvuNXT1i82N26KL3dZeIpNalWywr9IuQuncaAfUaS1g6sQ==", "dev": true, "license": "MIT", "dependencies": { "@ampproject/remapping": "^2.2.0", "@babel/code-frame": "^7.27.1", - "@babel/generator": "^7.27.3", + "@babel/generator": "^7.28.0", "@babel/helper-compilation-targets": "^7.27.2", "@babel/helper-module-transforms": "^7.27.3", - "@babel/helpers": "^7.27.3", - "@babel/parser": "^7.27.3", + "@babel/helpers": "^7.27.6", + "@babel/parser": "^7.28.0", "@babel/template": "^7.27.2", - "@babel/traverse": "^7.27.3", - "@babel/types": "^7.27.3", + "@babel/traverse": "^7.28.0", + "@babel/types": "^7.28.0", "convert-source-map": "^2.0.0", "debug": "^4.1.0", "gensync": "^1.0.0-beta.2", @@ -294,16 +294,16 @@ } }, "node_modules/@babel/generator": { - "version": "7.27.3", - "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.27.3.tgz", - "integrity": "sha512-xnlJYj5zepml8NXtjkG0WquFUv8RskFqyFcVgTBp5k+NaA/8uw/K+OSVf8AMGw5e9HKP2ETd5xpK5MLZQD6b4Q==", + "version": "7.28.0", + "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.28.0.tgz", + "integrity": "sha512-lJjzvrbEeWrhB4P3QBsH7tey117PjLZnDbLiQEKjQ/fNJTjuq4HSqgFA+UNSwZT8D7dxxbnuSBMsa1lrWzKlQg==", "dev": true, "license": "MIT", "dependencies": { - "@babel/parser": "^7.27.3", - "@babel/types": "^7.27.3", - "@jridgewell/gen-mapping": "^0.3.5", - "@jridgewell/trace-mapping": "^0.3.25", + "@babel/parser": "^7.28.0", + "@babel/types": "^7.28.0", + "@jridgewell/gen-mapping": "^0.3.12", + "@jridgewell/trace-mapping": "^0.3.28", "jsesc": "^3.0.2" }, "engines": { @@ -327,6 +327,16 @@ "node": ">=6.9.0" } }, + "node_modules/@babel/helper-globals": { + "version": "7.28.0", + "resolved": "https://registry.npmjs.org/@babel/helper-globals/-/helper-globals-7.28.0.tgz", + "integrity": "sha512-+W6cISkXFa1jXsDEdYA8HeevQT/FULhxzR99pxphltZcVaugps53THCeiWA8SguxxpSp3gKPiuYfSWopkLQ4hw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=6.9.0" + } + }, "node_modules/@babel/helper-module-imports": { "version": "7.27.1", "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.27.1.tgz", @@ -400,27 +410,27 @@ } }, "node_modules/@babel/helpers": { - "version": "7.27.3", - "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.27.3.tgz", - "integrity": "sha512-h/eKy9agOya1IGuLaZ9tEUgz+uIRXcbtOhRtUyyMf8JFmn1iT13vnl/IGVWSkdOCG/pC57U4S1jnAabAavTMwg==", + "version": "7.27.6", + "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.27.6.tgz", + "integrity": "sha512-muE8Tt8M22638HU31A3CgfSUciwz1fhATfoVai05aPXGor//CdWDCbnlY1yvBPo07njuVOCNGCSp/GTt12lIug==", "dev": true, "license": "MIT", "dependencies": { "@babel/template": "^7.27.2", - "@babel/types": "^7.27.3" + "@babel/types": "^7.27.6" }, "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/parser": { - "version": "7.27.3", - "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.27.3.tgz", - "integrity": "sha512-xyYxRj6+tLNDTWi0KCBcZ9V7yg3/lwL9DWh9Uwh/RIVlIfFidggcgxKX3GCXwCiswwcGRawBKbEg2LG/Y8eJhw==", + "version": "7.28.0", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.28.0.tgz", + "integrity": "sha512-jVZGvOxOuNSsuQuLRTh13nU0AogFlw32w/MT+LV6D3sP5WdbW61E77RnkbaO2dUvmPAYrBDJXGn5gGS6tH4j8g==", "dev": true, "license": "MIT", "dependencies": { - "@babel/types": "^7.27.3" + "@babel/types": "^7.28.0" }, "bin": { "parser": "bin/babel-parser.js" @@ -477,28 +487,28 @@ } }, "node_modules/@babel/traverse": { - "version": "7.27.3", - "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.27.3.tgz", - "integrity": "sha512-lId/IfN/Ye1CIu8xG7oKBHXd2iNb2aW1ilPszzGcJug6M8RCKfVNcYhpI5+bMvFYjK7lXIM0R+a+6r8xhHp2FQ==", + "version": "7.28.0", + "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.28.0.tgz", + "integrity": "sha512-mGe7UK5wWyh0bKRfupsUchrQGqvDbZDbKJw+kcRGSmdHVYrv+ltd0pnpDTVpiTqnaBru9iEvA8pz8W46v0Amwg==", "dev": true, "license": "MIT", "dependencies": { "@babel/code-frame": "^7.27.1", - "@babel/generator": "^7.27.3", - "@babel/parser": "^7.27.3", + "@babel/generator": "^7.28.0", + "@babel/helper-globals": "^7.28.0", + "@babel/parser": "^7.28.0", "@babel/template": "^7.27.2", - "@babel/types": "^7.27.3", - "debug": "^4.3.1", - "globals": "^11.1.0" + "@babel/types": "^7.28.0", + "debug": "^4.3.1" }, "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/types": { - "version": "7.27.3", - "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.27.3.tgz", - "integrity": "sha512-Y1GkI4ktrtvmawoSq+4FCVHNryea6uR+qUQy0AGxLSsjCX0nVmkYQMBLHDkXZuo5hGx7eYdnIaslsdBFm7zbUw==", + "version": "7.28.1", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.28.1.tgz", + "integrity": "sha512-x0LvFTekgSX+83TI28Y9wYPUfzrnl2aT5+5QLnO6v7mSJYtEEevuDRN0F0uSHRk1G1IWZC43o00Y0xDDrpBGPQ==", "dev": true, "license": "MIT", "dependencies": { @@ -1073,18 +1083,14 @@ } }, "node_modules/@jridgewell/gen-mapping": { - "version": "0.3.8", - "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.8.tgz", - "integrity": "sha512-imAbBGkb+ebQyxKgzv5Hu2nmROxoDOXHh80evxdoXNOrvAnVx7zimzc1Oo5h9RlfV4vPXaE2iM5pOFbvOCClWA==", + "version": "0.3.12", + "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.12.tgz", + "integrity": "sha512-OuLGC46TjB5BbN1dH8JULVVZY4WTdkF7tV9Ys6wLL1rubZnCMstOhNHueU5bLCrnRuDhKPDM4g6sw4Bel5Gzqg==", "dev": true, "license": "MIT", "dependencies": { - "@jridgewell/set-array": "^1.2.1", - "@jridgewell/sourcemap-codec": "^1.4.10", + "@jridgewell/sourcemap-codec": "^1.5.0", "@jridgewell/trace-mapping": "^0.3.24" - }, - "engines": { - "node": ">=6.0.0" } }, "node_modules/@jridgewell/resolve-uri": { @@ -1097,16 +1103,6 @@ "node": ">=6.0.0" } }, - "node_modules/@jridgewell/set-array": { - "version": "1.2.1", - "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz", - "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=6.0.0" - } - }, "node_modules/@jridgewell/sourcemap-codec": { "version": "1.5.0", "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz", @@ -1115,9 +1111,9 @@ "license": "MIT" }, "node_modules/@jridgewell/trace-mapping": { - "version": "0.3.25", - "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz", - "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==", + "version": "0.3.29", + "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.29.tgz", + "integrity": "sha512-uw6guiW/gcAGPDhLmd77/6lW8QLeiV5RUTsAX46Db6oLhGaVj4lhnPwb184s1bkc8kdVg/+h988dro8GRDpmYQ==", "dev": true, "license": "MIT", "dependencies": { @@ -1373,9 +1369,9 @@ } }, "node_modules/@rolldown/pluginutils": { - "version": "1.0.0-beta.9", - "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-beta.9.tgz", - "integrity": "sha512-e9MeMtVWo186sgvFFJOPGy7/d2j2mZhLJIdVW0C/xDluuOvymEATqz6zKsP0ZmXGzQtqlyjz5sC1sYQUoJG98w==", + "version": "1.0.0-beta.27", + "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-beta.27.tgz", + "integrity": "sha512-+d0F4MKMCbeVUJwG96uQ4SgAznZNSq93I3V+9NHA4OpvqG8mRCpGdKmK8l/dl02h2CCDHwW2FqilnTyDcAnqjA==", "dev": true, "license": "MIT" }, @@ -2031,9 +2027,9 @@ "license": "MIT" }, "node_modules/@types/node": { - "version": "22.15.23", - "resolved": "https://registry.npmjs.org/@types/node/-/node-22.15.23.tgz", - "integrity": "sha512-7Ec1zaFPF4RJ0eXu1YT/xgiebqwqoJz8rYPDi/O2BcZ++Wpt0Kq9cl0eg6NN6bYbPnR67ZLo7St5Q3UK0SnARw==", + "version": "20.19.9", + "resolved": "https://registry.npmjs.org/@types/node/-/node-20.19.9.tgz", + "integrity": "sha512-cuVNgarYWZqxRJDQHEB58GEONhOK79QVR/qYx4S7kcUObQvUwvFnYxJuuHUKm2aieN9X3yZB4LZsuYNU1Qphsw==", "dev": true, "license": "MIT", "dependencies": { @@ -2083,16 +2079,16 @@ "license": "MIT" }, "node_modules/@vitejs/plugin-react": { - "version": "4.5.0", - "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.5.0.tgz", - "integrity": "sha512-JuLWaEqypaJmOJPLWwO335Ig6jSgC1FTONCWAxnqcQthLTK/Yc9aH6hr9z/87xciejbQcnP3GnA1FWUSWeXaeg==", + "version": "4.7.0", + "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.7.0.tgz", + "integrity": "sha512-gUu9hwfWvvEDBBmgtAowQCojwZmJ5mcLn3aufeCsitijs3+f2NsrPtlAWIR6OPiqljl96GVCUbLe0HyqIpVaoA==", "dev": true, "license": "MIT", "dependencies": { - "@babel/core": "^7.26.10", - "@babel/plugin-transform-react-jsx-self": "^7.25.9", - "@babel/plugin-transform-react-jsx-source": "^7.25.9", - "@rolldown/pluginutils": "1.0.0-beta.9", + "@babel/core": "^7.28.0", + "@babel/plugin-transform-react-jsx-self": "^7.27.1", + "@babel/plugin-transform-react-jsx-source": "^7.27.1", + "@rolldown/pluginutils": "1.0.0-beta.27", "@types/babel__core": "^7.20.5", "react-refresh": "^0.17.0" }, @@ -2100,7 +2096,7 @@ "node": "^14.18.0 || >=16.0.0" }, "peerDependencies": { - "vite": "^4.2.0 || ^5.0.0 || ^6.0.0" + "vite": "^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0" } }, "node_modules/@vitest/expect": { @@ -2483,28 +2479,54 @@ "license": "MIT" }, "node_modules/boxen": { - "version": "7.1.1", - "resolved": "https://registry.npmjs.org/boxen/-/boxen-7.1.1.tgz", - "integrity": "sha512-2hCgjEmP8YLWQ130n2FerGv7rYpfBmnmp9Uy2Le1vge6X3gZIfSmEzP5QTDElFxcvVcXlEn8Aq6MU/PZygIOog==", + "version": "8.0.1", + "resolved": "https://registry.npmjs.org/boxen/-/boxen-8.0.1.tgz", + "integrity": "sha512-F3PH5k5juxom4xktynS7MoFY+NUWH5LC4CnH11YB8NPew+HLpmBLCybSAEyb2F+4pRXhuhWqFesoQd6DAyc2hw==", "dev": true, "license": "MIT", "dependencies": { "ansi-align": "^3.0.1", - "camelcase": "^7.0.1", - "chalk": "^5.2.0", + "camelcase": "^8.0.0", + "chalk": "^5.3.0", "cli-boxes": "^3.0.0", - "string-width": "^5.1.2", - "type-fest": "^2.13.0", - "widest-line": "^4.0.1", - "wrap-ansi": "^8.1.0" + "string-width": "^7.2.0", + "type-fest": "^4.21.0", + "widest-line": "^5.0.0", + "wrap-ansi": "^9.0.0" }, "engines": { - "node": ">=14.16" + "node": ">=18" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/boxen/node_modules/ansi-regex": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.1.0.tgz", + "integrity": "sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/chalk/ansi-regex?sponsor=1" + } + }, + "node_modules/boxen/node_modules/ansi-styles": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz", + "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/chalk/ansi-styles?sponsor=1" + } + }, "node_modules/boxen/node_modules/chalk": { "version": "5.4.1", "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.4.1.tgz", @@ -2518,19 +2540,78 @@ "url": "https://github.com/chalk/chalk?sponsor=1" } }, + "node_modules/boxen/node_modules/emoji-regex": { + "version": "10.4.0", + "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.4.0.tgz", + "integrity": "sha512-EC+0oUMY1Rqm4O6LLrgjtYDvcVYTy7chDnM4Q7030tP4Kwj3u/pR6gP9ygnp2CJMK5Gq+9Q2oqmrFJAz01DXjw==", + "dev": true, + "license": "MIT" + }, + "node_modules/boxen/node_modules/string-width": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-7.2.0.tgz", + "integrity": "sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "emoji-regex": "^10.3.0", + "get-east-asian-width": "^1.0.0", + "strip-ansi": "^7.1.0" + }, + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/boxen/node_modules/strip-ansi": { + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz", + "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "ansi-regex": "^6.0.1" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/chalk/strip-ansi?sponsor=1" + } + }, "node_modules/boxen/node_modules/type-fest": { - "version": "2.19.0", - "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-2.19.0.tgz", - "integrity": "sha512-RAH822pAdBgcNMAfWnCBU3CFZcfZ/i1eZjwFU/dsLKumyuuP3niueg2UAukXYF0E2AAoc82ZSSf9J0WQBinzHA==", + "version": "4.41.0", + "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.41.0.tgz", + "integrity": "sha512-TeTSQ6H5YHvpqVwBRcnLDCBnDOHWYu7IvGbHT6N8AOymcr9PJGjc1GTtiWZTYg0NCgYwvnYWEkVChQAr9bjfwA==", "dev": true, "license": "(MIT OR CC0-1.0)", "engines": { - "node": ">=12.20" + "node": ">=16" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/boxen/node_modules/wrap-ansi": { + "version": "9.0.0", + "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-9.0.0.tgz", + "integrity": "sha512-G8ura3S+3Z2G+mkgNRq8dqaFZAuxfsxpBB8OCTGRTCtp+l/v9nbFNmCUP1BZMts3G1142MsZfn6eeUKrr4PD1Q==", + "dev": true, + "license": "MIT", + "dependencies": { + "ansi-styles": "^6.2.1", + "string-width": "^7.0.0", + "strip-ansi": "^7.1.0" + }, + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/chalk/wrap-ansi?sponsor=1" + } + }, "node_modules/brace-expansion": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz", @@ -2631,13 +2712,13 @@ } }, "node_modules/camelcase": { - "version": "7.0.1", - "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-7.0.1.tgz", - "integrity": "sha512-xlx1yCK2Oc1APsPXDL2LdlNP6+uu8OCDdhOBSVT279M/S+y75O30C2VuD8T2ogdePBBl7PfPF4504tnLgX3zfw==", + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-8.0.0.tgz", + "integrity": "sha512-8WB3Jcas3swSvjIeA2yvCJ+Miyz5l1ZmB6HFb9R1317dt9LCQoswg/BGrmAmkWVEszSrrg4RwmO46qIm2OEnSA==", "dev": true, "license": "MIT", "engines": { - "node": ">=14.16" + "node": ">=16" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" @@ -3427,9 +3508,9 @@ } }, "node_modules/fdir": { - "version": "6.4.5", - "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.5.tgz", - "integrity": "sha512-4BG7puHpVsIYxZUbiUE3RqGloLaSSwzYie5jvasC4LWuBWzZawynvYouhjbQKw2JuIGYdm0DzIxl8iVidKlUEw==", + "version": "6.4.6", + "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.6.tgz", + "integrity": "sha512-hiFoqpyZcfNm1yc4u8oWCf9A2c4D3QjCrks3zmoVKVxpQRzmPNar1hUJcBG2RQHvEVGDN+Jm81ZheVLAQMK6+w==", "dev": true, "license": "MIT", "peerDependencies": { @@ -3610,6 +3691,19 @@ "node": ">=6.9.0" } }, + "node_modules/get-east-asian-width": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/get-east-asian-width/-/get-east-asian-width-1.3.0.tgz", + "integrity": "sha512-vpeMIQKxczTD/0s2CdEWHcb0eeJe6TFjxb+J5xgX7hScxqrGuyjmv4c1D4A/gelKfyox0gJJwIHF+fLjeaM8kQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/get-monorepo-packages": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/get-monorepo-packages/-/get-monorepo-packages-1.3.0.tgz", @@ -3689,16 +3783,6 @@ "node": ">= 6" } }, - "node_modules/globals": { - "version": "11.12.0", - "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz", - "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=4" - } - }, "node_modules/globby": { "version": "7.1.1", "resolved": "https://registry.npmjs.org/globby/-/globby-7.1.1.tgz", @@ -4540,30 +4624,30 @@ "license": "MIT" }, "node_modules/npm-normalize-package-bin": { - "version": "3.0.1", - "resolved": "https://registry.npmjs.org/npm-normalize-package-bin/-/npm-normalize-package-bin-3.0.1.tgz", - "integrity": "sha512-dMxCf+zZ+3zeQZXKxmyuCKlIDPGuv8EF940xbkC4kQVDTtqoh6rJFO+JTKSA6/Rwi0getWmtuy4Itup0AMcaDQ==", + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/npm-normalize-package-bin/-/npm-normalize-package-bin-4.0.0.tgz", + "integrity": "sha512-TZKxPvItzai9kN9H/TkmCtx/ZN/hvr3vUycjlfmH0ootY9yFBzNOpiXAdIn1Iteqsvk4lQn6B5PTrt+n6h8k/w==", "dev": true, "license": "ISC", "engines": { - "node": "^14.17.0 || ^16.13.0 || >=18.0.0" + "node": "^18.17.0 || >=20.5.0" } }, "node_modules/npm-run-all2": { - "version": "6.2.6", - "resolved": "https://registry.npmjs.org/npm-run-all2/-/npm-run-all2-6.2.6.tgz", - "integrity": "sha512-tkyb4pc0Zb0oOswCb5tORPk9MvVL6gcDq1cMItQHmsbVk1skk7YF6cH+UU2GxeNLHMuk6wFEOSmEmJ2cnAK1jg==", + "version": "8.0.4", + "resolved": "https://registry.npmjs.org/npm-run-all2/-/npm-run-all2-8.0.4.tgz", + "integrity": "sha512-wdbB5My48XKp2ZfJUlhnLVihzeuA1hgBnqB2J9ahV77wLS+/YAJAlN8I+X3DIFIPZ3m5L7nplmlbhNiFDmXRDA==", "dev": true, "license": "MIT", "dependencies": { "ansi-styles": "^6.2.1", - "cross-spawn": "^7.0.3", + "cross-spawn": "^7.0.6", "memorystream": "^0.3.1", - "minimatch": "^9.0.0", + "picomatch": "^4.0.2", "pidtree": "^0.6.0", - "read-package-json-fast": "^3.0.2", + "read-package-json-fast": "^4.0.0", "shell-quote": "^1.7.3", - "which": "^3.0.1" + "which": "^5.0.0" }, "bin": { "npm-run-all": "bin/npm-run-all/index.js", @@ -4572,8 +4656,8 @@ "run-s": "bin/run-s/index.js" }, "engines": { - "node": "^14.18.0 || ^16.13.0 || >=18.0.0", - "npm": ">= 8" + "node": "^20.5.0 || >=22.0.0", + "npm": ">= 10" } }, "node_modules/npm-run-all2/node_modules/ansi-styles": { @@ -4589,20 +4673,30 @@ "url": "https://github.com/chalk/ansi-styles?sponsor=1" } }, + "node_modules/npm-run-all2/node_modules/isexe": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/isexe/-/isexe-3.1.1.tgz", + "integrity": "sha512-LpB/54B+/2J5hqQ7imZHfdU31OlgQqx7ZicVlkm9kzg9/w8GKLEcFfJl/t7DCEDueOyBAD6zCCwTO6Fzs0NoEQ==", + "dev": true, + "license": "ISC", + "engines": { + "node": ">=16" + } + }, "node_modules/npm-run-all2/node_modules/which": { - "version": "3.0.1", - "resolved": "https://registry.npmjs.org/which/-/which-3.0.1.tgz", - "integrity": "sha512-XA1b62dzQzLfaEOSQFTCOd5KFf/1VSzZo7/7TUjnya6u0vGGKzU96UQBZTAThCb2j4/xjBAyii1OhRLJEivHvg==", + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/which/-/which-5.0.0.tgz", + "integrity": "sha512-JEdGzHwwkrbWoGOlIHqQ5gtprKGOenpDHpxE9zVR1bWbOtYRyPPHMe9FaP6x61CmNaTThSkb0DAJte5jD+DmzQ==", "dev": true, "license": "ISC", "dependencies": { - "isexe": "^2.0.0" + "isexe": "^3.1.1" }, "bin": { "node-which": "bin/which.js" }, "engines": { - "node": "^14.17.0 || ^16.13.0 || >=18.0.0" + "node": "^18.17.0 || >=20.5.0" } }, "node_modules/npm-run-path": { @@ -5037,9 +5131,9 @@ } }, "node_modules/postcss": { - "version": "8.5.3", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.3.tgz", - "integrity": "sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==", + "version": "8.5.6", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz", + "integrity": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==", "dev": true, "funding": [ { @@ -5057,7 +5151,7 @@ ], "license": "MIT", "dependencies": { - "nanoid": "^3.3.8", + "nanoid": "^3.3.11", "picocolors": "^1.1.1", "source-map-js": "^1.2.1" }, @@ -5066,9 +5160,9 @@ } }, "node_modules/prettier": { - "version": "3.5.3", - "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.5.3.tgz", - "integrity": "sha512-QQtaxnoDJeAkDvDKWCLiwIXkTgRhwYDEQCghU9Z6q03iyek/rxRh/2lC3HB7P8sWT2xC/y5JDctPLBIGzHKbhw==", + "version": "3.6.2", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.6.2.tgz", + "integrity": "sha512-I7AIg5boAr5R0FFtJ6rCfD+LFsWHp81dolrFD8S79U9tb8Az2nGrJncnMSnys+bpQJfRUzqs9hnA81OAA3hCuQ==", "dev": true, "license": "MIT", "bin": { @@ -5228,27 +5322,27 @@ } }, "node_modules/read-package-json-fast": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/read-package-json-fast/-/read-package-json-fast-3.0.2.tgz", - "integrity": "sha512-0J+Msgym3vrLOUB3hzQCuZHII0xkNGCtz/HJH9xZshwv9DbDwkw1KaE3gx/e2J5rpEY5rtOy6cyhKOPrkP7FZw==", + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/read-package-json-fast/-/read-package-json-fast-4.0.0.tgz", + "integrity": "sha512-qpt8EwugBWDw2cgE2W+/3oxC+KTez2uSVR8JU9Q36TXPAGCaozfQUs59v4j4GFpWTaw0i6hAZSvOmu1J0uOEUg==", "dev": true, "license": "ISC", "dependencies": { - "json-parse-even-better-errors": "^3.0.0", - "npm-normalize-package-bin": "^3.0.0" + "json-parse-even-better-errors": "^4.0.0", + "npm-normalize-package-bin": "^4.0.0" }, "engines": { - "node": "^14.17.0 || ^16.13.0 || >=18.0.0" + "node": "^18.17.0 || >=20.5.0" } }, "node_modules/read-package-json-fast/node_modules/json-parse-even-better-errors": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-3.0.2.tgz", - "integrity": "sha512-fi0NG4bPjCHunUJffmLd0gxssIgkNmArMvis4iNah6Owg1MCJjWhEcDLmsK6iGkJq3tHwbDkTlce70/tmXN4cQ==", + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-4.0.0.tgz", + "integrity": "sha512-lR4MXjGNgkJc7tkQ97kb2nuEMnNCyU//XYVH0MKTGcXEiSudQ5MKGKen3C5QubYy0vmq+JGitUg92uuywGEwIA==", "dev": true, "license": "MIT", "engines": { - "node": "^14.17.0 || ^16.13.0 || >=18.0.0" + "node": "^18.17.0 || >=20.5.0" } }, "node_modules/readdirp": { @@ -6475,21 +6569,24 @@ "license": "MIT" }, "node_modules/vite": { - "version": "5.4.19", - "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.19.tgz", - "integrity": "sha512-qO3aKv3HoQC8QKiNSTuUM1l9o/XX3+c+VTgLHbJWHZGeTPVAg2XwazI9UWzoxjIJCGCV2zU60uqMzjeLZuULqA==", + "version": "7.0.5", + "resolved": "https://registry.npmjs.org/vite/-/vite-7.0.5.tgz", + "integrity": "sha512-1mncVwJxy2C9ThLwz0+2GKZyEXuC3MyWtAAlNftlZZXZDP3AJt5FmwcMit/IGGaNZ8ZOB2BNO/HFUB+CpN0NQw==", "dev": true, "license": "MIT", "dependencies": { - "esbuild": "^0.21.3", - "postcss": "^8.4.43", - "rollup": "^4.20.0" + "esbuild": "^0.25.0", + "fdir": "^6.4.6", + "picomatch": "^4.0.2", + "postcss": "^8.5.6", + "rollup": "^4.40.0", + "tinyglobby": "^0.2.14" }, "bin": { "vite": "bin/vite.js" }, "engines": { - "node": "^18.0.0 || >=20.0.0" + "node": "^20.19.0 || >=22.12.0" }, "funding": { "url": "https://github.com/vitejs/vite?sponsor=1" @@ -6498,19 +6595,25 @@ "fsevents": "~2.3.3" }, "peerDependencies": { - "@types/node": "^18.0.0 || >=20.0.0", - "less": "*", + "@types/node": "^20.19.0 || >=22.12.0", + "jiti": ">=1.21.0", + "less": "^4.0.0", "lightningcss": "^1.21.0", - "sass": "*", - "sass-embedded": "*", - "stylus": "*", - "sugarss": "*", - "terser": "^5.4.0" + "sass": "^1.70.0", + "sass-embedded": "^1.70.0", + "stylus": ">=0.54.8", + "sugarss": "^5.0.0", + "terser": "^5.16.0", + "tsx": "^4.8.1", + "yaml": "^2.4.2" }, "peerDependenciesMeta": { "@types/node": { "optional": true }, + "jiti": { + "optional": true + }, "less": { "optional": true }, @@ -6531,439 +6634,15 @@ }, "terser": { "optional": true + }, + "tsx": { + "optional": true + }, + "yaml": { + "optional": true } } }, - "node_modules/vite/node_modules/@esbuild/aix-ppc64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz", - "integrity": "sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==", - "cpu": [ - "ppc64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "aix" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/android-arm": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.21.5.tgz", - "integrity": "sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==", - "cpu": [ - "arm" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "android" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/android-arm64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.21.5.tgz", - "integrity": "sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A==", - "cpu": [ - "arm64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "android" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/android-x64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.21.5.tgz", - "integrity": "sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA==", - "cpu": [ - "x64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "android" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/darwin-arm64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.21.5.tgz", - "integrity": "sha512-DwqXqZyuk5AiWWf3UfLiRDJ5EDd49zg6O9wclZ7kUMv2WRFr4HKjXp/5t8JZ11QbQfUS6/cRCKGwYhtNAY88kQ==", - "cpu": [ - "arm64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "darwin" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/darwin-x64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.21.5.tgz", - "integrity": "sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw==", - "cpu": [ - "x64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "darwin" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/freebsd-arm64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.21.5.tgz", - "integrity": "sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g==", - "cpu": [ - "arm64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "freebsd" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/freebsd-x64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.21.5.tgz", - "integrity": "sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ==", - "cpu": [ - "x64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "freebsd" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/linux-arm": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.21.5.tgz", - "integrity": "sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA==", - "cpu": [ - "arm" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/linux-arm64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.21.5.tgz", - "integrity": "sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q==", - "cpu": [ - "arm64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/linux-ia32": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.21.5.tgz", - "integrity": "sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg==", - "cpu": [ - "ia32" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/linux-loong64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.21.5.tgz", - "integrity": "sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==", - "cpu": [ - "loong64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/linux-mips64el": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.21.5.tgz", - "integrity": "sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg==", - "cpu": [ - "mips64el" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/linux-ppc64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.21.5.tgz", - "integrity": "sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w==", - "cpu": [ - "ppc64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/linux-riscv64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.21.5.tgz", - "integrity": "sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA==", - "cpu": [ - "riscv64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/linux-s390x": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.21.5.tgz", - "integrity": "sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A==", - "cpu": [ - "s390x" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/linux-x64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.21.5.tgz", - "integrity": "sha512-1rYdTpyv03iycF1+BhzrzQJCdOuAOtaqHTWJZCWvijKD2N5Xu0TtVC8/+1faWqcP9iBCWOmjmhoH94dH82BxPQ==", - "cpu": [ - "x64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/netbsd-x64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.21.5.tgz", - "integrity": "sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg==", - "cpu": [ - "x64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "netbsd" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/openbsd-x64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.21.5.tgz", - "integrity": "sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow==", - "cpu": [ - "x64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "openbsd" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/sunos-x64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.21.5.tgz", - "integrity": "sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg==", - "cpu": [ - "x64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "sunos" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/win32-arm64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.21.5.tgz", - "integrity": "sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A==", - "cpu": [ - "arm64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "win32" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/win32-ia32": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.21.5.tgz", - "integrity": "sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA==", - "cpu": [ - "ia32" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "win32" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/@esbuild/win32-x64": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.21.5.tgz", - "integrity": "sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw==", - "cpu": [ - "x64" - ], - "dev": true, - "license": "MIT", - "optional": true, - "os": [ - "win32" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/vite/node_modules/esbuild": { - "version": "0.21.5", - "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.21.5.tgz", - "integrity": "sha512-mg3OPMV4hXywwpoDxu3Qda5xCKQi+vCTZq8S9J/EpkhB2HzKXq4SNFZE3+NK93JYxc8VMSep+lOUSC/RVKaBqw==", - "dev": true, - "hasInstallScript": true, - "license": "MIT", - "bin": { - "esbuild": "bin/esbuild" - }, - "engines": { - "node": ">=12" - }, - "optionalDependencies": { - "@esbuild/aix-ppc64": "0.21.5", - "@esbuild/android-arm": "0.21.5", - "@esbuild/android-arm64": "0.21.5", - "@esbuild/android-x64": "0.21.5", - "@esbuild/darwin-arm64": "0.21.5", - "@esbuild/darwin-x64": "0.21.5", - "@esbuild/freebsd-arm64": "0.21.5", - "@esbuild/freebsd-x64": "0.21.5", - "@esbuild/linux-arm": "0.21.5", - "@esbuild/linux-arm64": "0.21.5", - "@esbuild/linux-ia32": "0.21.5", - "@esbuild/linux-loong64": "0.21.5", - "@esbuild/linux-mips64el": "0.21.5", - "@esbuild/linux-ppc64": "0.21.5", - "@esbuild/linux-riscv64": "0.21.5", - "@esbuild/linux-s390x": "0.21.5", - "@esbuild/linux-x64": "0.21.5", - "@esbuild/netbsd-x64": "0.21.5", - "@esbuild/openbsd-x64": "0.21.5", - "@esbuild/sunos-x64": "0.21.5", - "@esbuild/win32-arm64": "0.21.5", - "@esbuild/win32-ia32": "0.21.5", - "@esbuild/win32-x64": "0.21.5" - } - }, "node_modules/webidl-conversions": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz", @@ -7006,21 +6685,75 @@ } }, "node_modules/widest-line": { - "version": "4.0.1", - "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-4.0.1.tgz", - "integrity": "sha512-o0cyEG0e8GPzT4iGHphIOh0cJOV8fivsXxddQasHPHfoZf1ZexrfeA21w2NaEN1RHE+fXlfISmOE8R9N3u3Qig==", + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-5.0.0.tgz", + "integrity": "sha512-c9bZp7b5YtRj2wOe6dlj32MK+Bx/M/d+9VB2SHM1OtsUHR0aV0tdP6DWh/iMt0kWi1t5g1Iudu6hQRNd1A4PVA==", "dev": true, "license": "MIT", "dependencies": { - "string-width": "^5.0.1" + "string-width": "^7.0.0" }, + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/widest-line/node_modules/ansi-regex": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.1.0.tgz", + "integrity": "sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==", + "dev": true, + "license": "MIT", "engines": { "node": ">=12" }, + "funding": { + "url": "https://github.com/chalk/ansi-regex?sponsor=1" + } + }, + "node_modules/widest-line/node_modules/emoji-regex": { + "version": "10.4.0", + "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.4.0.tgz", + "integrity": "sha512-EC+0oUMY1Rqm4O6LLrgjtYDvcVYTy7chDnM4Q7030tP4Kwj3u/pR6gP9ygnp2CJMK5Gq+9Q2oqmrFJAz01DXjw==", + "dev": true, + "license": "MIT" + }, + "node_modules/widest-line/node_modules/string-width": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-7.2.0.tgz", + "integrity": "sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "emoji-regex": "^10.3.0", + "get-east-asian-width": "^1.0.0", + "strip-ansi": "^7.1.0" + }, + "engines": { + "node": ">=18" + }, "funding": { "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/widest-line/node_modules/strip-ansi": { + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz", + "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "ansi-regex": "^6.0.1" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/chalk/strip-ansi?sponsor=1" + } + }, "node_modules/wordwrapjs": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/wordwrapjs/-/wordwrapjs-4.0.1.tgz", @@ -7216,9 +6949,9 @@ } }, "node_modules/zx": { - "version": "8.5.4", - "resolved": "https://registry.npmjs.org/zx/-/zx-8.5.4.tgz", - "integrity": "sha512-44oKea9Sa8ZnOkTnS6fRJpg3quzgnbB43nLrVfYnqE86J4sxgZMUDLezzKET/FdOAVkF4X+Alm9Bume+W+RW9Q==", + "version": "8.7.1", + "resolved": "https://registry.npmjs.org/zx/-/zx-8.7.1.tgz", + "integrity": "sha512-28u1w2LlIfvyvJvYe6pmCipesk8oL5AFMVp+P/U445LcaPgzrU5lNDtAPd6nJvWmoCNyXZz37R/xKOGokccjsw==", "dev": true, "license": "Apache-2.0", "bin": { diff --git a/package.json b/package.json index 1bb6493..a9e2c95 100644 --- a/package.json +++ b/package.json @@ -9,21 +9,15 @@ "type": "git", "url": "https://github.com/storybookjs/storybook-addon-kit" }, - "type": "module", "license": "MIT", "author": "package-author", + "type": "module", "exports": { - ".": { - "types": "./dist/index.d.ts", - "import": "./dist/index.js", - "require": "./dist/index.cjs" - }, "./preview": { "types": "./dist/index.d.ts", - "import": "./dist/preview.js", - "require": "./dist/preview.cjs" + "default": "./dist/preview.js" }, - "./preset": "./dist/preset.cjs", + "./preset": "./dist/preset.js", "./manager": "./dist/manager.js", "./package.json": "./package.json" }, @@ -35,40 +29,38 @@ ], "scripts": { "prebuild": "node -e \"fs.rmSync('./dist', { recursive: true, force: true })\"", - "postinstall": "node scripts/welcome.js", "build": "tsup", + "build-storybook": "storybook build", "build:watch": "npm run build -- --watch", - "test": "echo \"Error: no test specified\" && exit 1", - "start": "run-p build:watch \"storybook --quiet\"", + "eject-ts": "zx scripts/eject-typescript.js", + "postinstall": "node scripts/welcome.js", "prerelease": "zx scripts/prepublish-checks.js", "release": "npm run build && auto shipit", - "eject-ts": "zx scripts/eject-typescript.js", + "start": "run-p build:watch \"storybook --quiet\"", "storybook": "storybook dev -p 6006", - "build-storybook": "storybook build" - }, - "dependencies": { - "@storybook/icons": "^1.4.0" + "test": "echo \"Error: no test specified\" && exit 1" }, "devDependencies": { "@storybook/addon-docs": "0.0.0-pr-31819-sha-5b109949", + "@storybook/icons": "^1.4.0", "@storybook/react-vite": "0.0.0-pr-31819-sha-5b109949", - "@types/node": "^22", + "@types/node": "^20", "@types/react": "^18.2.65", "@types/react-dom": "^18.2.21", - "@vitejs/plugin-react": "^4.2.1", - "auto": "^11.1.1", - "boxen": "^7.1.1", - "npm-run-all2": "^6.2.3", - "prettier": "^3.3.3", + "@vitejs/plugin-react": "^4.7.0", + "auto": "^11.3.0", + "boxen": "^8.0.1", + "npm-run-all2": "^8.0.4", + "prettier": "^3.6.2", "prompts": "^2.4.2", "react": "^18.2.0", "react-dom": "^18.2.0", "storybook": "0.0.0-pr-31819-sha-5b109949", "ts-dedent": "^2.2.0", - "tsup": "^8.2.4", - "typescript": "^5.8.2", - "vite": "^5.3.5", - "zx": "^8.4.1" + "tsup": "^8.5.0", + "typescript": "^5.8.3", + "vite": "^7.0.5", + "zx": "^8.7.1" }, "peerDependencies": { "storybook": "*" From e1cd97aa761cf5b564bf88b77df1924daf86c9f4 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Mon, 21 Jul 2025 16:10:43 +0200 Subject: [PATCH 03/26] cleanup comments --- tsup.config.ts | 34 +++++++++++++++++++++++----------- 1 file changed, 23 insertions(+), 11 deletions(-) diff --git a/tsup.config.ts b/tsup.config.ts index 04057ef..23a2d85 100644 --- a/tsup.config.ts +++ b/tsup.config.ts @@ -21,20 +21,28 @@ export default defineConfig(async (options) => { } = packageJson; const commonConfig: Options = { - // keep this line commented until https://github.com/egoist/tsup/issues/1270 is resolved - // clean: options.watch ? false : true, + /* + keep this line commented until https://github.com/egoist/tsup/issues/1270 is resolved + clean: options.watch ? false : true, + */ clean: false, format: ["esm"], treeshake: true, splitting: true, + /* + The following packages are provided by Storybook and should always be externalized + Meaning they shouldn't be bundled with the addon, and they shouldn't be regular dependencies either + */ external: ["react", "react-dom", "@storybook/icons"], }; const configs: Options[] = []; - // manager entries are entries meant to be loaded into the manager UI - // they'll have manager-specific packages externalized and they won't be usable in node - // they won't have types generated for them as they're usually loaded automatically by Storybook + /* + manager entries are entries meant to be loaded into the manager UI + they'll have manager-specific packages externalized and they won't be usable in node + they won't have types generated for them as they're usually loaded automatically by Storybook + */ if (managerEntries.length) { configs.push({ ...commonConfig, @@ -44,9 +52,11 @@ export default defineConfig(async (options) => { }); } - // preview entries are entries meant to be loaded into the preview iframe - // they'll have preview-specific packages externalized and they won't be usable in node - // they'll have types generated for them so they can be imported when setting up Portable Stories + /* + preview entries are entries meant to be loaded into the preview iframe + they'll have preview-specific packages externalized and they won't be usable in node + they'll have types generated for them so they can be imported by users when setting up Portable Stories or using CSF factories + */ if (previewEntries.length) { configs.push({ ...commonConfig, @@ -57,9 +67,11 @@ export default defineConfig(async (options) => { }); } - // node entries are entries meant to be used in node-only - // this is useful for presets, which are loaded by Storybook when setting up configurations - // they won't have types generated for them as they're usually loaded automatically by Storybook + /* + node entries are entries meant to be used in node-only + this is useful for presets, which are loaded by Storybook when setting up configurations + they won't have types generated for them as they're usually loaded automatically by Storybook + */ if (nodeEntries.length) { configs.push({ ...commonConfig, From 44a02a4405b9c5bc6535848147b0aa323d01c2a8 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Thu, 21 Aug 2025 20:52:29 +0200 Subject: [PATCH 04/26] CJS > ESM in root preset.js --- preset.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/preset.js b/preset.js index bd94354..f1e533a 100644 --- a/preset.js +++ b/preset.js @@ -1,4 +1 @@ -// this file is slightly misleading. It needs to be CJS, and thus in this "type": "module" package it should be named preset.cjs -// but Storybook won't pick that filename up so we have to name it preset.js instead - -module.exports = require('./dist/preset.cjs'); +export * from "./dist/preset.js"; From 1e3259dbb1efad868511ca16fa3218fa6376464c Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Tue, 16 Sep 2025 21:59:10 -0700 Subject: [PATCH 05/26] Fix default keywords --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index fac9b2c..78d2b4f 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "0.0.0", "description": "everything you need to build a Storybook addon", "keywords": [ - "storybook-addons" + "storybook-addon" ], "repository": { "type": "git", From 6aec678692f1716b3763bc378962d7ad3a30fcb9 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Thu, 25 Sep 2025 21:24:26 +0200 Subject: [PATCH 06/26] add index entry for CSF Factories support --- package.json | 9 +++++++-- src/index.ts | 7 +++++-- 2 files changed, 12 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index 9d8cec7..8b98b28 100644 --- a/package.json +++ b/package.json @@ -13,8 +13,12 @@ "author": "package-author", "type": "module", "exports": { - "./preview": { + ".": { "types": "./dist/index.d.ts", + "default": "./dist/index.js" + }, + "./preview": { + "types": "./dist/preview.d.ts", "default": "./dist/preview.js" }, "./preset": "./dist/preset.js", @@ -73,7 +77,8 @@ "src/manager.tsx" ], "previewEntries": [ - "src/preview.ts" + "src/preview.ts", + "src/index.ts" ], "nodeEntries": [ "src/preset.ts" diff --git a/src/index.ts b/src/index.ts index dafa948..8269168 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,2 +1,5 @@ -// make it work with --isolatedModules -export default {}; +import { definePreviewAddon } from "storybook/internal/csf"; + +import addonAnnotations from "./preview"; + +export default () => definePreviewAddon(addonAnnotations); From 1adaa6c882191c2aeb7d7b3e6a03e7b96cbd7213 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Thu, 25 Sep 2025 21:24:41 +0200 Subject: [PATCH 07/26] fix build targets --- tsup.config.ts | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/tsup.config.ts b/tsup.config.ts index cb2c49c..295178f 100644 --- a/tsup.config.ts +++ b/tsup.config.ts @@ -1,8 +1,6 @@ import { defineConfig, type Options } from "tsup"; -import { - BROWSER_TARGETS, - NODE_TARGET, -} from "storybook/internal/builder-manager"; + +const NODE_TARGET = "node20.19"; // Minimum Node version supported by Storybook 10 export default defineConfig(async (options) => { // reading the three types of entries from package.json, which has the following structure: @@ -50,7 +48,7 @@ export default defineConfig(async (options) => { ...commonConfig, entry: managerEntries, platform: "browser", - target: BROWSER_TARGETS, + target: "esnext", // we can use esnext for manager entries since Storybook will bundle the addon's manager entries again anyway }); } @@ -64,7 +62,7 @@ export default defineConfig(async (options) => { ...commonConfig, entry: previewEntries, platform: "browser", - target: BROWSER_TARGETS, + target: "esnext", // we can use esnext for preview entries since the builders will bundle the addon's preview entries again anyway dts: true, }); } From 2976b5008bfac3254940ea25e02dc64d746155cb Mon Sep 17 00:00:00 2001 From: Yann Braga Date: Mon, 6 Oct 2025 09:58:13 +0200 Subject: [PATCH 08/26] reintroduce presets --- .storybook/local-preset.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.storybook/local-preset.ts b/.storybook/local-preset.ts index 310aafe..8518be7 100644 --- a/.storybook/local-preset.ts +++ b/.storybook/local-preset.ts @@ -10,3 +10,5 @@ export function previewAnnotations(entry = []) { export function managerEntries(entry = []) { return [...entry, fileURLToPath(import.meta.resolve("../dist/manager.js"))]; } + +export * from "../src/preset.ts"; From 096b3c7ee74d4d5edd7eeb1d57088adb5514bdda Mon Sep 17 00:00:00 2001 From: Yann Braga Date: Mon, 6 Oct 2025 10:09:14 +0200 Subject: [PATCH 09/26] fix exports again --- .storybook/local-preset.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.storybook/local-preset.ts b/.storybook/local-preset.ts index 8518be7..cb11ba2 100644 --- a/.storybook/local-preset.ts +++ b/.storybook/local-preset.ts @@ -11,4 +11,4 @@ export function managerEntries(entry = []) { return [...entry, fileURLToPath(import.meta.resolve("../dist/manager.js"))]; } -export * from "../src/preset.ts"; +export * from "../dist/preset.js"; From 5d605afaed8b55319f70651b9ce0c60f9c8fc24d Mon Sep 17 00:00:00 2001 From: Steve Dodier-Lazaro Date: Mon, 20 Oct 2025 11:22:51 +0200 Subject: [PATCH 10/26] Add manager-helpers example --- .storybook/manager.ts | 15 +++++++++++++++ package.json | 4 +++- src/manager-helpers.tsx | 20 ++++++++++++++++++++ 3 files changed, 38 insertions(+), 1 deletion(-) create mode 100644 .storybook/manager.ts create mode 100644 src/manager-helpers.tsx diff --git a/.storybook/manager.ts b/.storybook/manager.ts new file mode 100644 index 0000000..c4b2d88 --- /dev/null +++ b/.storybook/manager.ts @@ -0,0 +1,15 @@ +import { addons } from "storybook/manager-api"; + +import { renderLabel } from "../dist/manager-helpers.js"; + +/* + * This is an example of opt-in usage of addon exports. Your users can choose to + * import and use this helper, or not. Opt-in helpers should be exported in their + * own file rather than in `manager.tsx`, because importing `manager.tsx` multiple + * times can cause the addon registration code to run multiple times. + */ +addons.setConfig({ + sidebar: { + renderLabel, + }, +}); diff --git a/package.json b/package.json index 8b98b28..2a6ddc1 100644 --- a/package.json +++ b/package.json @@ -23,6 +23,7 @@ }, "./preset": "./dist/preset.js", "./manager": "./dist/manager.js", + "./manager-helpers": "./dist/manager-helpers.js", "./package.json": "./package.json" }, "files": [ @@ -74,7 +75,8 @@ }, "bundler": { "managerEntries": [ - "src/manager.tsx" + "src/manager.tsx", + "src/manager-helpers.tsx" ], "previewEntries": [ "src/preview.ts", diff --git a/src/manager-helpers.tsx b/src/manager-helpers.tsx new file mode 100644 index 0000000..358329d --- /dev/null +++ b/src/manager-helpers.tsx @@ -0,0 +1,20 @@ +import React from "react"; +import type { API_HashEntry } from 'storybook/internal/types' +import { ADDON_ID } from "./constants"; + +/** + * This opt-in helper can be manually imported by your users who want to + * use it, and ignored by those who don't. + */ +export function renderLabel(item: API_HashEntry) { + if ( + item.type !== 'story' && + item.type !== 'docs' + ) { + return + } + + if (item.title.startsWith(ADDON_ID)) { + return 🌟 {item.name} + } +} \ No newline at end of file From ada12ff17593ab8ccfd8591eed62aa1514fef7e1 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Tue, 21 Oct 2025 17:12:10 +0200 Subject: [PATCH 11/26] Update package dependencies to use 'next' versions and add new devDependencies in package-lock.json --- package-lock.json | 127 +++++++++++++++++++++++++++++++++++++++++++--- package.json | 6 +-- 2 files changed, 122 insertions(+), 11 deletions(-) diff --git a/package-lock.json b/package-lock.json index cdf332a..71747d6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -7,12 +7,11 @@ "": { "name": "storybook-addon-kit", "version": "0.0.0", - "hasInstallScript": true, "license": "MIT", "devDependencies": { - "@storybook/addon-docs": "^10.0.0-beta.0", + "@storybook/addon-docs": "next", "@storybook/icons": "^1.4.0", - "@storybook/react-vite": "^10.0.0-beta.0", + "@storybook/react-vite": "next", "@types/node": "^20", "@types/react": "^18.2.65", "@types/react-dom": "^18.2.21", @@ -24,7 +23,7 @@ "prompts": "^2.4.2", "react": "^18.2.0", "react-dom": "^18.2.0", - "storybook": "^10.0.0-beta.0", + "storybook": "next", "ts-dedent": "^2.2.0", "tsup": "^8.5.0", "typescript": "^5.8.3", @@ -469,6 +468,17 @@ "@babel/core": "^7.0.0-0" } }, + "node_modules/@babel/runtime": { + "version": "7.28.4", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.4.tgz", + "integrity": "sha512-Q/N6JNWvIvPnLDvjlE1OUBLPQHH6l3CltCEsHIujp45zQUSSh8K+gHnaEX45yAT1nyngnINhvWtzN+Nb9D8RAQ==", + "dev": true, + "license": "MIT", + "peer": true, + "engines": { + "node": ">=6.9.0" + } + }, "node_modules/@babel/template": { "version": "7.27.2", "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.2.tgz", @@ -1181,6 +1191,27 @@ "vite": "^5.0.0 || ^6.0.0 || ^7.0.0" } }, + "node_modules/@testing-library/dom": { + "version": "10.4.1", + "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.1.tgz", + "integrity": "sha512-o4PXJQidqJl82ckFaXUeoAW+XysPLauYI43Abki5hABd853iMhitooc6znOnczgbTYmEP6U6/y1ZyKAIsvMKGg==", + "dev": true, + "license": "MIT", + "peer": true, + "dependencies": { + "@babel/code-frame": "^7.10.4", + "@babel/runtime": "^7.12.5", + "@types/aria-query": "^5.0.1", + "aria-query": "5.3.0", + "dom-accessibility-api": "^0.5.9", + "lz-string": "^1.5.0", + "picocolors": "1.1.1", + "pretty-format": "^27.0.2" + }, + "engines": { + "node": ">=18" + } + }, "node_modules/@testing-library/jest-dom": { "version": "6.6.3", "resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-6.6.3.tgz", @@ -1265,6 +1296,14 @@ "dev": true, "license": "MIT" }, + "node_modules/@types/aria-query": { + "version": "5.0.4", + "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz", + "integrity": "sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==", + "dev": true, + "license": "MIT", + "peer": true + }, "node_modules/@types/babel__core": { "version": "7.20.5", "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz", @@ -2431,6 +2470,16 @@ "node": ">=10" } }, + "node_modules/cosmiconfig/node_modules/yaml": { + "version": "1.10.2", + "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz", + "integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==", + "dev": true, + "license": "ISC", + "engines": { + "node": ">= 6" + } + }, "node_modules/create-require": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz", @@ -2581,6 +2630,14 @@ "node": ">=6.0.0" } }, + "node_modules/dom-accessibility-api": { + "version": "0.5.16", + "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz", + "integrity": "sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==", + "dev": true, + "license": "MIT", + "peer": true + }, "node_modules/dotenv": { "version": "8.6.0", "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.6.0.tgz", @@ -3657,6 +3714,17 @@ "yallist": "^3.0.2" } }, + "node_modules/lz-string": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz", + "integrity": "sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==", + "dev": true, + "license": "MIT", + "peer": true, + "bin": { + "lz-string": "bin/bin.js" + } + }, "node_modules/magic-string": { "version": "0.30.17", "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.17.tgz", @@ -4375,6 +4443,36 @@ "url": "https://github.com/prettier/prettier?sponsor=1" } }, + "node_modules/pretty-format": { + "version": "27.5.1", + "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz", + "integrity": "sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==", + "dev": true, + "license": "MIT", + "peer": true, + "dependencies": { + "ansi-regex": "^5.0.1", + "ansi-styles": "^5.0.0", + "react-is": "^17.0.1" + }, + "engines": { + "node": "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0" + } + }, + "node_modules/pretty-format/node_modules/ansi-styles": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz", + "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==", + "dev": true, + "license": "MIT", + "peer": true, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/chalk/ansi-styles?sponsor=1" + } + }, "node_modules/pretty-ms": { "version": "7.0.1", "resolved": "https://registry.npmjs.org/pretty-ms/-/pretty-ms-7.0.1.tgz", @@ -4511,6 +4609,14 @@ "react": "^18.3.1" } }, + "node_modules/react-is": { + "version": "17.0.2", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", + "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==", + "dev": true, + "license": "MIT", + "peer": true + }, "node_modules/react-refresh": { "version": "0.17.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.17.0.tgz", @@ -6103,13 +6209,18 @@ "license": "ISC" }, "node_modules/yaml": { - "version": "1.10.2", - "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz", - "integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==", + "version": "2.8.1", + "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.1.tgz", + "integrity": "sha512-lcYcMxX2PO9XMGvAJkJ3OsNMw+/7FKes7/hgerGUYWIoWu5j/+YQqcZr5JnPZWzOsEBgMbSbiSTn/dv/69Mkpw==", "dev": true, "license": "ISC", + "optional": true, + "peer": true, + "bin": { + "yaml": "bin.mjs" + }, "engines": { - "node": ">= 6" + "node": ">= 14.6" } }, "node_modules/yn": { diff --git a/package.json b/package.json index 8b98b28..0cc8c6b 100644 --- a/package.json +++ b/package.json @@ -45,9 +45,9 @@ "test": "echo \"Error: no test specified\" && exit 1" }, "devDependencies": { - "@storybook/addon-docs": "^10.0.0-beta.0", + "@storybook/addon-docs": "next", "@storybook/icons": "^1.4.0", - "@storybook/react-vite": "^10.0.0-beta.0", + "@storybook/react-vite": "next", "@types/node": "^20", "@types/react": "^18.2.65", "@types/react-dom": "^18.2.21", @@ -59,7 +59,7 @@ "prompts": "^2.4.2", "react": "^18.2.0", "react-dom": "^18.2.0", - "storybook": "^10.0.0-beta.0", + "storybook": "next", "ts-dedent": "^2.2.0", "tsup": "^8.5.0", "typescript": "^5.8.3", From 3115ec88c8f9d080340c472ba582b24d47345a14 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Tue, 21 Oct 2025 17:16:58 +0200 Subject: [PATCH 12/26] Update GitHub Actions workflows to install dependencies without ignoring scripts --- .github/workflows/build.yml | 2 +- .github/workflows/release.yml | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml index 29d37dc..da56c1c 100644 --- a/.github/workflows/build.yml +++ b/.github/workflows/build.yml @@ -18,7 +18,7 @@ jobs: node-version: 20.x - name: Install dependencies - run: npm install --ignore-scripts + run: npm install - name: Build run: | diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index 28baba7..1acfb8c 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -18,7 +18,7 @@ jobs: node-version: 20.x - name: Install dependencies - run: npm install --ignore-scripts + run: npm install - name: Create Release env: From ee26c8cf1738ecbda8fee55d2adf167af3508073 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Tue, 21 Oct 2025 17:25:19 +0200 Subject: [PATCH 13/26] Refactor welcome.js for improved readability and consistency in formatting --- .prettierrc | 9 ++- .storybook/local-preset.ts | 8 +-- .storybook/main.ts | 8 +-- .storybook/preview.ts | 4 +- .vscode/settings.json | 3 + README.md | 10 +-- package.json | 1 + preset.js | 2 +- scripts/eject-typescript.js | 2 +- scripts/prepublish-checks.js | 28 ++++---- scripts/welcome.js | 129 +++++++++++++++++----------------- src/components/List.tsx | 40 +++++------ src/components/Panel.tsx | 44 ++++-------- src/components/Tab.tsx | 40 +++++------ src/components/Tool.tsx | 24 +++---- src/constants.ts | 2 +- src/index.ts | 4 +- src/manager.tsx | 23 +++--- src/preset.ts | 4 +- src/preview.ts | 8 +-- src/stories/Button.stories.ts | 24 +++---- src/stories/Button.tsx | 8 +-- src/stories/Header.stories.ts | 10 +-- src/stories/Header.tsx | 15 +--- src/stories/Introduction.mdx | 51 ++++---------- src/stories/Page.stories.ts | 12 ++-- src/stories/Page.tsx | 12 ++-- src/withGlobals.ts | 29 +++----- src/withRoundTrip.ts | 14 ++-- tsconfig.json | 4 +- tsup.config.ts | 22 +++--- vite.config.ts | 4 +- 32 files changed, 266 insertions(+), 332 deletions(-) create mode 100644 .vscode/settings.json diff --git a/.prettierrc b/.prettierrc index 0967ef4..e121685 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1 +1,8 @@ -{} +{ + "singleQuote": true, + "trailingComma": "all", + "arrowParens": "always", + "printWidth": 120, + "tabWidth": 2, + "useTabs": false +} diff --git a/.storybook/local-preset.ts b/.storybook/local-preset.ts index cb11ba2..e05d51b 100644 --- a/.storybook/local-preset.ts +++ b/.storybook/local-preset.ts @@ -1,14 +1,14 @@ -import { fileURLToPath } from "node:url"; +import { fileURLToPath } from 'node:url'; /** * to load the built addon in this test Storybook */ export function previewAnnotations(entry = []) { - return [...entry, fileURLToPath(import.meta.resolve("../dist/preview.js"))]; + return [...entry, fileURLToPath(import.meta.resolve('../dist/preview.js'))]; } export function managerEntries(entry = []) { - return [...entry, fileURLToPath(import.meta.resolve("../dist/manager.js"))]; + return [...entry, fileURLToPath(import.meta.resolve('../dist/manager.js'))]; } -export * from "../dist/preset.js"; +export * from '../dist/preset.js'; diff --git a/.storybook/main.ts b/.storybook/main.ts index 9516632..c99ba48 100644 --- a/.storybook/main.ts +++ b/.storybook/main.ts @@ -1,9 +1,9 @@ -import { defineMain } from "@storybook/react-vite/node"; +import { defineMain } from '@storybook/react-vite/node'; const config = defineMain({ - stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"], - addons: ["@storybook/addon-docs", import.meta.resolve("./local-preset.ts")], - framework: "@storybook/react-vite", + stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'], + addons: ['@storybook/addon-docs', import.meta.resolve('./local-preset.ts')], + framework: '@storybook/react-vite', }); export default config; diff --git a/.storybook/preview.ts b/.storybook/preview.ts index cbc7355..416ea7b 100644 --- a/.storybook/preview.ts +++ b/.storybook/preview.ts @@ -1,4 +1,4 @@ -import type { Preview } from "@storybook/react-vite"; +import type { Preview } from '@storybook/react-vite'; const preview: Preview = { parameters: { @@ -10,7 +10,7 @@ const preview: Preview = { }, }, initialGlobals: { - background: { value: "light" }, + background: { value: 'light' }, }, }; diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..25fa621 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "typescript.tsdk": "node_modules/typescript/lib" +} diff --git a/README.md b/README.md index 8bbafce..2a789c3 100644 --- a/README.md +++ b/README.md @@ -151,8 +151,8 @@ const meta: Meta = { myAddon: { exampleParameter: true, // See API section below for available parameters - } - } + }, + }, }; export default meta; @@ -183,14 +183,14 @@ registering the addon, like so: // .storybook/main.ts // Replace your-framework with the framework you are using (e.g., react-webpack5, vue3-vite) -import type { StorybookConfig } from "@storybook/your-framework"; +import type { StorybookConfig } from '@storybook/your-framework'; const config: StorybookConfig = { // ...rest of config addons: [ - "@storybook/addon-docs", + '@storybook/addon-docs', { - name: "my-addon", + name: 'my-addon', options: { // 👈 options for my-addon go here }, diff --git a/package.json b/package.json index 0cc8c6b..5a250e9 100644 --- a/package.json +++ b/package.json @@ -38,6 +38,7 @@ "build:watch": "npm run build -- --watch", "eject-ts": "zx scripts/eject-typescript.js", "postinstall": "node scripts/welcome.js", + "format": "prettier --write .", "prerelease": "zx scripts/prepublish-checks.js", "release": "npm run build && auto shipit", "start": "run-p build:watch \"storybook --quiet\"", diff --git a/preset.js b/preset.js index f1e533a..4bd63d3 100644 --- a/preset.js +++ b/preset.js @@ -1 +1 @@ -export * from "./dist/preset.js"; +export * from './dist/preset.js'; diff --git a/scripts/eject-typescript.js b/scripts/eject-typescript.js index 4c28094..aeb2ec6 100644 --- a/scripts/eject-typescript.js +++ b/scripts/eject-typescript.js @@ -51,5 +51,5 @@ console.log( TypeScript Ejection complete!`, chalk.green` Addon code converted with JS. The TypeScript build setup is still available in case you want to adopt TypeScript in the future. -` +`, ); diff --git a/scripts/prepublish-checks.js b/scripts/prepublish-checks.js index 59152c0..f025e0b 100644 --- a/scripts/prepublish-checks.js +++ b/scripts/prepublish-checks.js @@ -1,12 +1,12 @@ #!/usr/bin/env zx -import boxen from "boxen"; -import { dedent } from "ts-dedent"; -import { readFile } from "node:fs/promises"; -import { globalPackages as globalManagerPackages } from "storybook/internal/manager/globals"; -import { globalPackages as globalPreviewPackages } from "storybook/internal/preview/globals"; +import boxen from 'boxen'; +import { dedent } from 'ts-dedent'; +import { readFile } from 'node:fs/promises'; +import { globalPackages as globalManagerPackages } from 'storybook/internal/manager/globals'; +import { globalPackages as globalPreviewPackages } from 'storybook/internal/preview/globals'; -const packageJson = await readFile("./package.json", "utf8").then(JSON.parse); +const packageJson = await readFile('./package.json', 'utf8').then(JSON.parse); const name = packageJson.name; const displayName = packageJson.storybook.displayName; @@ -17,18 +17,18 @@ $.verbose = false; /** * Check that meta data has been updated */ -if (name.includes("addon-kit") || displayName.includes("Addon Kit")) { +if (name.includes('addon-kit') || displayName.includes('Addon Kit')) { console.error( boxen( dedent` - ${chalk.red.bold("Missing metadata")} + ${chalk.red.bold('Missing metadata')} ${chalk.red(dedent`Your package name and/or displayName includes default values from the Addon Kit. The addon gallery filters out all such addons. Please configure appropriate metadata before publishing your addon. For more info, see: https://storybook.js.org/docs/react/addons/addon-catalog#addon-metadata`)}`, - { padding: 1, borderColor: "red" }, + { padding: 1, borderColor: 'red' }, ), ); @@ -39,18 +39,18 @@ if (name.includes("addon-kit") || displayName.includes("Addon Kit")) { * Check that README has been updated */ const readmeTestStrings = - "# Storybook Addon Kit|Click the \\*\\*Use this template\\*\\* button to get started.|https://user-images.githubusercontent.com/42671/106809879-35b32000-663a-11eb-9cdc-89f178b5273f.gif"; + '# Storybook Addon Kit|Click the \\*\\*Use this template\\*\\* button to get started.|https://user-images.githubusercontent.com/42671/106809879-35b32000-663a-11eb-9cdc-89f178b5273f.gif'; if ((await $`cat README.md | grep -E ${readmeTestStrings}`.exitCode) == 0) { console.error( boxen( dedent` - ${chalk.red.bold("README not updated")} + ${chalk.red.bold('README not updated')} ${chalk.red(dedent`You are using the default README.md file that comes with the addon kit. Please update it to provide info on what your addon does and how to use it.`)} `, - { padding: 1, borderColor: "red" }, + { padding: 1, borderColor: 'red' }, ), ); @@ -67,14 +67,14 @@ peerDependencies.forEach((dependency) => { console.error( boxen( dedent` - ${chalk.red.bold("Unnecessary peer dependency")} + ${chalk.red.bold('Unnecessary peer dependency')} ${chalk.red(dedent`You have a peer dependency on ${chalk.bold(dependency)} which is most likely unnecessary as that is provided by Storybook directly. Check the "bundling" section in README.md for more information. If you are absolutely sure you are doing it correct, you should remove this check from scripts/prepublish-checks.js.`)} `, - { padding: 1, borderColor: "red" }, + { padding: 1, borderColor: 'red' }, ), ); diff --git a/scripts/welcome.js b/scripts/welcome.js index 845c9d0..d647597 100644 --- a/scripts/welcome.js +++ b/scripts/welcome.js @@ -13,84 +13,81 @@ const __dirname = dirname(__filename); // CLI questions const questions = [ { - type: "text", - name: "authorName", - initial: "", - message: "What is the package author name?*", - validate: (name) => (name === "" ? "Name can't be empty" : true), + type: 'text', + name: 'authorName', + initial: '', + message: 'What is the package author name?*', + validate: (name) => (name === '' ? "Name can't be empty" : true), }, { - type: "text", - name: "authorEmail", - initial: "", - message: "What is the package author email?", + type: 'text', + name: 'authorEmail', + initial: '', + message: 'What is the package author email?', }, { - type: "text", - name: "packageName", - message: "What is the addon package name (eg: storybook-addon-something)?*", - validate: (name) => (name === "" ? "Package name can't be empty" : true), + type: 'text', + name: 'packageName', + message: 'What is the addon package name (eg: storybook-addon-something)?*', + validate: (name) => (name === '' ? "Package name can't be empty" : true), }, { - type: "text", - name: "displayName", - message: - "What is the addon display name (this will be used in the addon catalog)?*", + type: 'text', + name: 'displayName', + message: 'What is the addon display name (this will be used in the addon catalog)?*', validate: (name) => - name === "" + name === '' ? "Display name can't be empty. For more info, see: https://storybook.js.org/docs/react/addons/addon-catalog#addon-metadata" : true, }, { - type: "text", - name: "addonDescription", - initial: "", - message: "Write a short description of the addon*", - validate: (name) => (name === "" ? "Description can't be empty" : true), + type: 'text', + name: 'addonDescription', + initial: '', + message: 'Write a short description of the addon*', + validate: (name) => (name === '' ? "Description can't be empty" : true), }, { - type: "text", - name: "repoUrl", - message: "Git repo URL for your addon package (https://github.com/...)*", - validate: (url) => (url === "" ? "URL can't be empty" : true), + type: 'text', + name: 'repoUrl', + message: 'Git repo URL for your addon package (https://github.com/...)*', + validate: (url) => (url === '' ? "URL can't be empty" : true), }, { - type: "text", - name: "addonIcon", - initial: - "https://user-images.githubusercontent.com/321738/63501763-88dbf600-c4cc-11e9-96cd-94adadc2fd72.png", - message: "URL of your addon icon", + type: 'text', + name: 'addonIcon', + initial: 'https://user-images.githubusercontent.com/321738/63501763-88dbf600-c4cc-11e9-96cd-94adadc2fd72.png', + message: 'URL of your addon icon', }, { - type: "list", - name: "keywords", - initial: "storybook-addons", - message: "Enter addon keywords (comma separated)", - separator: ",", + type: 'list', + name: 'keywords', + initial: 'storybook-addons', + message: 'Enter addon keywords (comma separated)', + separator: ',', format: (keywords) => keywords - .concat(["storybook-addons"]) + .concat(['storybook-addons']) .map((k) => `"${k}"`) - .join(", "), + .join(', '), }, { - type: "list", - name: "supportedFrameworks", - initial: - "react, vue, angular, web-components, ember, html, svelte, preact, react-native", - message: "List of frameworks you support (comma separated)?", - separator: ",", - format: (frameworks) => frameworks.map((k) => `"${k}"`).join(", "), + type: 'list', + name: 'supportedFrameworks', + initial: 'react, vue, angular, web-components, ember, html, svelte, preact, react-native', + message: 'List of frameworks you support (comma separated)?', + separator: ',', + format: (frameworks) => frameworks.map((k) => `"${k}"`).join(', '), }, ]; const REPLACE_TEMPLATES = { - packageName: "storybook-addon-kit", - addonDescription: "everything you need to build a Storybook addon", - packageAuthor: "package-author", - repoUrl: "https://github.com/storybookjs/storybook-addon-kit", + packageName: 'storybook-addon-kit', + addonDescription: 'everything you need to build a Storybook addon', + packageAuthor: 'package-author', + repoUrl: 'https://github.com/storybookjs/storybook-addon-kit', keywords: `"storybook-addons"`, - displayName: "Addon Kit", + displayName: 'Addon Kit', supportedFrameworks: `"supported-frameworks"`, }; @@ -105,9 +102,9 @@ const main = async () => { dedent` Welcome to Storybook addon-kit! Please answer the following questions while we prepare this project for you:\n - ` - ) - ) + `, + ), + ), ); const { @@ -124,18 +121,18 @@ const main = async () => { if (!authorName || !packageName) { console.log( `\nProcess canceled by the user. Feel free to run ${bold( - "npm run postinstall" - )} to execute the installation steps again!` + 'npm run postinstall', + )} to execute the installation steps again!`, ); process.exit(0); } - const authorField = authorName + (authorEmail ? ` <${authorEmail}>` : ""); + const authorField = authorName + (authorEmail ? ` <${authorEmail}>` : ''); const packageJson = resolve(__dirname, `../package.json`); console.log(`\n👷 Updating package.json...`); - let packageJsonContents = await readFile(packageJson, "utf-8"); + let packageJsonContents = await readFile(packageJson, 'utf-8'); packageJsonContents = packageJsonContents .replace(REPLACE_TEMPLATES.packageName, packageName) @@ -149,9 +146,9 @@ const main = async () => { await writeFile(packageJson, packageJsonContents); - console.log("📝 Updating the README..."); + console.log('📝 Updating the README...'); const readme = resolve(__dirname, `../README.md`); - let readmeContents = await readFile(readme, "utf-8"); + let readmeContents = await readFile(readme, 'utf-8'); const regex = /<\!-- README START -->([\s\S]*)<\!-- README END -->/g; @@ -160,7 +157,7 @@ const main = async () => { dedent` # Storybook Addon ${displayName} ${addonDescription} - ` + `, ); await writeFile(readme, readmeContents); @@ -172,13 +169,15 @@ const main = async () => { dedent`\n 🚀 All done! Run \`npm run start\` to get started. - Thanks for using this template, ${authorName.split(" ")[0]}! ❤️ + Thanks for using this template, ${authorName.split(' ')[0]}! ❤️ Feel free to open issues in case there are bugs/feature requests at: - ${bold(blue("https://github.com/storybookjs/addon-kit"))}\n - ` + ${bold(blue('https://github.com/storybookjs/addon-kit'))}\n + `, ); }; -main().catch((e) => console.log(`Something went wrong: ${e}`)); +if (!process.env.CI) { + main().catch((e) => console.log(`Something went wrong: ${e}`)); +} diff --git a/src/components/List.tsx b/src/components/List.tsx index 1b817d6..4f0d888 100644 --- a/src/components/List.tsx +++ b/src/components/List.tsx @@ -1,6 +1,6 @@ -import { ArrowDownIcon } from "@storybook/icons"; -import React, { Fragment, useState } from "react"; -import { styled } from "storybook/theming"; +import { ArrowDownIcon } from '@storybook/icons'; +import React, { Fragment, useState } from 'react'; +import { styled } from 'storybook/theming'; type Item = { title: string; @@ -16,17 +16,17 @@ interface ListProps { } const ListWrapper = styled.ul({ - listStyle: "none", + listStyle: 'none', fontSize: 14, padding: 0, margin: 0, }); const Wrapper = styled.div(({ theme }) => ({ - display: "flex", - width: "100%", + display: 'flex', + width: '100%', borderBottom: `1px solid ${theme.appBorderColor}`, - "&:hover": { + '&:hover': { background: theme.background.hoverable, }, })); @@ -37,23 +37,23 @@ const Icon = styled(ArrowDownIcon)(({ theme }) => ({ minWidth: 10, color: theme.color.mediumdark, marginRight: 10, - transition: "transform 0.1s ease-in-out", - alignSelf: "center", - display: "inline-flex", + transition: 'transform 0.1s ease-in-out', + alignSelf: 'center', + display: 'inline-flex', })); const HeaderBar = styled.div(({ theme }) => ({ padding: theme.layoutMargin, paddingLeft: theme.layoutMargin - 3, - background: "none", - color: "inherit", - textAlign: "left", - cursor: "pointer", - borderLeft: "3px solid transparent", - width: "100%", + background: 'none', + color: 'inherit', + textAlign: 'left', + cursor: 'pointer', + borderLeft: '3px solid transparent', + width: '100%', - "&:focus": { - outline: "0 none", + '&:focus': { + outline: '0 none', borderLeft: `3px solid ${theme.color.secondary}`, }, })); @@ -62,8 +62,8 @@ const Description = styled.div(({ theme }) => ({ padding: theme.layoutMargin, background: theme.background.content, fontFamily: theme.typography.fonts.mono, - whiteSpace: "pre-wrap", - textAlign: "left", + whiteSpace: 'pre-wrap', + textAlign: 'left', })); export const ListItem: React.FC = ({ item }) => { diff --git a/src/components/Panel.tsx b/src/components/Panel.tsx index 0ec1225..7ba839c 100644 --- a/src/components/Panel.tsx +++ b/src/components/Panel.tsx @@ -1,19 +1,19 @@ -import React, { Fragment, memo, useCallback, useState } from "react"; -import type { Result } from "src/types"; -import { AddonPanel } from "storybook/internal/components"; -import { Button, Placeholder, TabsState } from "storybook/internal/components"; -import { useChannel } from "storybook/manager-api"; -import { styled, useTheme } from "storybook/theming"; +import React, { Fragment, memo, useCallback, useState } from 'react'; +import type { Result } from 'src/types'; +import { AddonPanel } from 'storybook/internal/components'; +import { Button, Placeholder, TabsState } from 'storybook/internal/components'; +import { useChannel } from 'storybook/manager-api'; +import { styled, useTheme } from 'storybook/theming'; -import { EVENTS } from "../constants"; -import { List } from "./List"; +import { EVENTS } from '../constants'; +import { List } from './List'; interface PanelProps { active?: boolean; } export const RequestDataButton = styled(Button)({ - marginTop: "1rem", + marginTop: '1rem', }); export const Panel: React.FC = memo(function MyPanel(props) { @@ -38,29 +38,19 @@ export const Panel: React.FC = memo(function MyPanel(props) { return ( - +
- Addons can gather details about how a story is rendered. This is - panel uses a tab pattern. Click the button below to fetch data for - the other two tabs. + Addons can gather details about how a story is rendered. This is panel uses a tab pattern. Click the + button below to fetch data for the other two tabs. - - Request data - + Request data
-
+
{divs.length > 0 ? (

The following divs have less than 2 childNodes

@@ -77,11 +67,7 @@ export const Panel: React.FC = memo(function MyPanel(props) { )}
-
+
{styled.length > 0 ? (

The following elements have a style attribute

diff --git a/src/components/Tab.tsx b/src/components/Tab.tsx index ca14ed5..76dffa9 100644 --- a/src/components/Tab.tsx +++ b/src/components/Tab.tsx @@ -1,10 +1,10 @@ -import { LightningIcon } from "@storybook/icons"; -import React, { useCallback } from "react"; -import { Code, H1, IconButton, Link } from "storybook/internal/components"; -import { useGlobals, useParameter } from "storybook/manager-api"; -import { styled } from "storybook/theming"; +import { LightningIcon } from '@storybook/icons'; +import React, { useCallback } from 'react'; +import { Code, H1, IconButton, Link } from 'storybook/internal/components'; +import { useGlobals, useParameter } from 'storybook/manager-api'; +import { styled } from 'storybook/theming'; -import { KEY } from "../constants"; +import { KEY } from '../constants'; interface TabProps { active?: boolean; @@ -12,23 +12,20 @@ interface TabProps { const TabWrapper = styled.div(({ theme }) => ({ background: theme.background.content, - padding: "4rem 20px", - minHeight: "100vh", - boxSizing: "border-box", + padding: '4rem 20px', + minHeight: '100vh', + boxSizing: 'border-box', })); const TabInner = styled.div({ maxWidth: 768, - marginLeft: "auto", - marginRight: "auto", + marginLeft: 'auto', + marginRight: 'auto', }); export const Tab: React.FC = ({ active }) => { // https://storybook.js.org/docs/react/addons/addons-api#useparameter - const config = useParameter( - KEY, - "fallback value of config from parameter", - ); + const config = useParameter(KEY, 'fallback value of config from parameter'); // https://storybook.js.org/docs/addons/addons-api#useglobals const [globals, updateGlobals] = useGlobals(); @@ -50,19 +47,16 @@ export const Tab: React.FC = ({ active }) => {

My Addon ({KEY})

Your addon can create a custom tab in Storybook.

- You have full control over what content is being rendered here. You - can use components from{" "} + You have full control over what content is being rendered here. You can use components from{' '} storybook/internal/components - {" "} - to match the look and feel of Storybook, for example the{" "} - <Code /> component below. Or build a completely - custom UI. + {' '} + to match the look and feel of Storybook, for example the <Code /> component below. Or build + a completely custom UI.

{config}

- You can also have interactive UI here, like a button that updates a - global:{" "} + You can also have interactive UI here, like a button that updates a global:{' '} { diff --git a/src/components/Tool.tsx b/src/components/Tool.tsx index 082bba9..e908a97 100644 --- a/src/components/Tool.tsx +++ b/src/components/Tool.tsx @@ -1,8 +1,8 @@ -import React, { memo, useCallback, useEffect } from "react"; -import { useGlobals, type API } from "storybook/manager-api"; -import { IconButton } from "storybook/internal/components"; -import { ADDON_ID, KEY, TOOL_ID } from "../constants"; -import { LightningIcon } from "@storybook/icons"; +import React, { memo, useCallback, useEffect } from 'react'; +import { useGlobals, type API } from 'storybook/manager-api'; +import { IconButton } from 'storybook/internal/components'; +import { ADDON_ID, KEY, TOOL_ID } from '../constants'; +import { LightningIcon } from '@storybook/icons'; export const Tool = memo(function MyAddonSelector({ api }: { api: API }) { const [globals, updateGlobals, storyGlobals] = useGlobals(); @@ -18,22 +18,16 @@ export const Tool = memo(function MyAddonSelector({ api }: { api: API }) { useEffect(() => { api.setAddonShortcut(ADDON_ID, { - label: "Toggle Measure [O]", - defaultShortcut: ["O"], - actionName: "outline", + label: 'Toggle Measure [O]', + defaultShortcut: ['O'], + actionName: 'outline', showInMenu: false, action: toggle, }); }, [toggle, api]); return ( - + ); diff --git a/src/constants.ts b/src/constants.ts index 72e975a..6a7c974 100644 --- a/src/constants.ts +++ b/src/constants.ts @@ -1,4 +1,4 @@ -export const ADDON_ID = "my-addon"; +export const ADDON_ID = 'my-addon'; export const TOOL_ID = `${ADDON_ID}/tool`; export const PANEL_ID = `${ADDON_ID}/panel`; export const TAB_ID = `${ADDON_ID}/tab`; diff --git a/src/index.ts b/src/index.ts index 8269168..33db1c1 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,5 @@ -import { definePreviewAddon } from "storybook/internal/csf"; +import { definePreviewAddon } from 'storybook/internal/csf'; -import addonAnnotations from "./preview"; +import addonAnnotations from './preview'; export default () => definePreviewAddon(addonAnnotations); diff --git a/src/manager.tsx b/src/manager.tsx index db55a1f..79fec63 100644 --- a/src/manager.tsx +++ b/src/manager.tsx @@ -1,10 +1,10 @@ -import React from "react"; -import { addons, types } from "storybook/manager-api"; +import React from 'react'; +import { addons, types } from 'storybook/manager-api'; -import { Panel } from "./components/Panel"; -import { Tab } from "./components/Tab"; -import { Tool } from "./components/Tool"; -import { ADDON_ID, PANEL_ID, TAB_ID, TOOL_ID } from "./constants"; +import { Panel } from './components/Panel'; +import { Tab } from './components/Tab'; +import { Tool } from './components/Tool'; +import { ADDON_ID, PANEL_ID, TAB_ID, TOOL_ID } from './constants'; /** * Note: if you want to use JSX in this file, rename it to `manager.tsx` @@ -16,24 +16,23 @@ addons.register(ADDON_ID, (api) => { // Register a tool addons.add(TOOL_ID, { type: types.TOOL, - title: "My addon", - match: ({ viewMode, tabId }) => - !!((viewMode && viewMode.match(/^(story)$/)) || tabId === TAB_ID), + title: 'My addon', + match: ({ viewMode, tabId }) => !!((viewMode && viewMode.match(/^(story)$/)) || tabId === TAB_ID), render: () => , }); // Register a panel addons.add(PANEL_ID, { type: types.PANEL, - title: "My addon", - match: ({ viewMode }) => viewMode === "story", + title: 'My addon', + match: ({ viewMode }) => viewMode === 'story', render: ({ active }) => , }); // Register a tab addons.add(TAB_ID, { type: types.TAB, - title: "My addon", + title: 'My addon', render: ({ active }) => , }); }); diff --git a/src/preset.ts b/src/preset.ts index a92f950..9538358 100644 --- a/src/preset.ts +++ b/src/preset.ts @@ -4,11 +4,11 @@ // Read more about presets at https://storybook.js.org/docs/addons/writing-presets export const viteFinal = async (config: any) => { - console.log("This addon is augmenting the Vite config"); + console.log('This addon is augmenting the Vite config'); return config; }; export const webpack = async (config: any) => { - console.log("This addon is augmenting the Webpack config"); + console.log('This addon is augmenting the Webpack config'); return config; }; diff --git a/src/preview.ts b/src/preview.ts index b71d09f..56001b2 100644 --- a/src/preview.ts +++ b/src/preview.ts @@ -8,11 +8,11 @@ * * https://storybook.js.org/docs/react/writing-stories/decorators */ -import type { ProjectAnnotations, Renderer } from "storybook/internal/types"; +import type { ProjectAnnotations, Renderer } from 'storybook/internal/types'; -import { KEY } from "./constants"; -import { withGlobals } from "./withGlobals"; -import { withRoundTrip } from "./withRoundTrip"; +import { KEY } from './constants'; +import { withGlobals } from './withGlobals'; +import { withRoundTrip } from './withRoundTrip'; /** * Note: if you want to use JSX in this file, rename it to `preview.tsx` diff --git a/src/stories/Button.stories.ts b/src/stories/Button.stories.ts index 38c379d..8def24d 100644 --- a/src/stories/Button.stories.ts +++ b/src/stories/Button.stories.ts @@ -1,20 +1,20 @@ -import type { Meta, StoryObj } from "@storybook/react-vite"; +import type { Meta, StoryObj } from '@storybook/react-vite'; -import { Button } from "./Button"; -import { fn } from "storybook/test"; +import { Button } from './Button'; +import { fn } from 'storybook/test'; // More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export const meta: Meta = { - title: "Example/Button", + title: 'Example/Button', component: Button, // More on argTypes: https://storybook.js.org/docs/react/api/argtypes argTypes: { - backgroundColor: { control: "color" }, + backgroundColor: { control: 'color' }, }, args: { onClick: fn(), }, - tags: ["autodocs"], + tags: ['autodocs'], parameters: { myAddonParameter: ` @@ -32,26 +32,26 @@ export const Primary: Story = { // More on args: https://storybook.js.org/docs/react/writing-stories/args args: { primary: true, - label: "Button", + label: 'Button', }, }; export const Secondary: Story = { args: { - label: "Button", + label: 'Button', }, }; export const Large: Story = { args: { - size: "large", - label: "Button", + size: 'large', + label: 'Button', }, }; export const Small: Story = { args: { - size: "small", - label: "Button", + size: 'small', + label: 'Button', }, }; diff --git a/src/stories/Button.tsx b/src/stories/Button.tsx index c33be6e..66f8fd3 100644 --- a/src/stories/Button.tsx +++ b/src/stories/Button.tsx @@ -27,13 +27,7 @@ interface ButtonProps { /** * Primary UI component for user interaction */ -export const Button = ({ - primary = false, - size = 'medium', - backgroundColor, - label, - ...props -}: ButtonProps) => { +export const Button = ({ primary = false, size = 'medium', backgroundColor, label, ...props }: ButtonProps) => { const mode = primary ? 'storybook-button--primary' : 'storybook-button--secondary'; return (