diff --git a/code/.eslintrc.js b/code/.eslintrc.js index c764d4b28d83..1c1b173ad3b1 100644 --- a/code/.eslintrc.js +++ b/code/.eslintrc.js @@ -1,7 +1,20 @@ const path = require('path'); +const fs = require('fs'); +const { join } = require('path'); const scriptPath = path.join(__dirname, '..', 'scripts'); +const addonsPackages = fs + .readdirSync(path.join(__dirname, 'addons')) + .filter((p) => fs.statSync(join(__dirname, 'addons', p)).isDirectory()); +const libPackages = fs + .readdirSync(path.join(__dirname, 'lib')) + .filter((p) => fs.statSync(join(__dirname, 'lib', p)).isDirectory()); +const uiPackages = fs + .readdirSync(path.join(__dirname, 'ui')) + .filter((p) => fs.statSync(join(__dirname, 'ui', p)).isDirectory()) + .filter((p) => !p.startsWith('.')); + module.exports = { root: true, extends: [path.join(scriptPath, '.eslintrc.js')], @@ -52,32 +65,15 @@ module.exports = { project: null, }, rules: { - // '@typescript-eslint/no-var-requires': 'off', '@typescript-eslint/dot-notation': 'off', '@typescript-eslint/no-implied-eval': 'off', '@typescript-eslint/no-throw-literal': 'off', '@typescript-eslint/return-await': 'off', }, }, - { - // this package depends on a lot of peerDependencies we don't want to specify, because npm would install them - files: ['**/*.ts', '**/*.tsx'], - rules: { - 'no-shadow': 'off', - '@typescript-eslint/ban-types': 'warn', // should become error, in the future - }, - }, { // these packages use pre-bundling, dependencies will be bundled, and will be in devDepenencies - files: [ - 'addons/**/*', - 'frameworks/**/*', - 'lib/**/*', - 'builders/**/*', - 'deprecated/**/*', - 'renderers/**/*', - 'ui/**/*', - ], + files: ['frameworks/**/*', 'builders/**/*', 'deprecated/**/*', 'renderers/**/*'], excludedFiles: ['frameworks/angular/**/*', 'frameworks/ember/**/*', 'lib/core-server/**/*'], rules: { 'import/no-extraneous-dependencies': [ @@ -87,11 +83,41 @@ module.exports = { }, }, { - files: ['**/ui/*', '**/ui/.storybook/*'], + files: ['**/ui/.storybook/**'], rules: { - 'import/no-extraneous-dependencies': ['error', { packageDir: __dirname }], + 'import/no-extraneous-dependencies': [ + 'error', + { packageDir: [__dirname], devDependencies: true }, + ], }, }, + ...addonsPackages.map((directory) => ({ + files: [join('**', 'addons', directory, '**', '*.*')], + rules: { + 'import/no-extraneous-dependencies': [ + 'error', + { packageDir: [__dirname, join(__dirname, 'addons', directory)], devDependencies: true }, + ], + }, + })), + ...uiPackages.map((directory) => ({ + files: [join('**', 'ui', directory, '**', '*.*')], + rules: { + 'import/no-extraneous-dependencies': [ + 'error', + { packageDir: [__dirname, join(__dirname, 'ui', directory)], devDependencies: true }, + ], + }, + })), + ...libPackages.map((directory) => ({ + files: [join('**', 'lib', directory, '**', '*.*')], + rules: { + 'import/no-extraneous-dependencies': [ + 'error', + { packageDir: [__dirname, join(__dirname, 'lib', directory)], devDependencies: true }, + ], + }, + })), { files: [ '**/__tests__/**', @@ -113,7 +139,6 @@ module.exports = { 'react/require-default-props': 'off', }, }, - { files: '**/.storybook/config.js', rules: { 'global-require': 'off' } }, { files: ['**/*.stories.*'], rules: { @@ -123,6 +148,8 @@ module.exports = { { files: ['**/*.tsx', '**/*.ts'], rules: { + 'no-shadow': 'off', + '@typescript-eslint/ban-types': 'warn', // should become error, in the future 'react/require-default-props': 'off', 'react/prop-types': 'off', // we should use types 'react/forbid-prop-types': 'off', // we should use types diff --git a/code/addons/a11y/package.json b/code/addons/a11y/package.json index 612a0d5ff0a5..cbc566d0b865 100644 --- a/code/addons/a11y/package.json +++ b/code/addons/a11y/package.json @@ -32,21 +32,9 @@ "require": "./dist/index.js", "import": "./dist/index.mjs" }, - "./manager": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, - "./preview": { - "types": "./dist/preview.d.ts", - "require": "./dist/preview.js", - "import": "./dist/preview.mjs" - }, - "./register": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, + "./manager": "./dist/manager.js", + "./preview": "./dist/preview.js", + "./register": "./dist/manager.js", "./package.json": "./package.json" }, "main": "dist/index.js", @@ -60,10 +48,14 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, "dependencies": { "@storybook/addon-highlight": "7.1.0", + "@storybook/types": "7.1.0", + "axe-core": "^4.2.0" + }, + "devDependencies": { "@storybook/channels": "7.1.0", "@storybook/client-logger": "7.1.0", "@storybook/components": "7.1.0", @@ -72,35 +64,23 @@ "@storybook/manager-api": "7.1.0", "@storybook/preview-api": "7.1.0", "@storybook/theming": "7.1.0", - "@storybook/types": "7.1.0", - "axe-core": "^4.2.0", - "lodash": "^4.17.21", - "react-resize-detector": "^7.1.2" - }, - "devDependencies": { "@testing-library/react": "^11.2.2", + "lodash": "^4.17.21", + "react-resize-detector": "^7.1.2", "resize-observer-polyfill": "^1.5.1", "typescript": "~4.9.3" }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "react": { - "optional": true - }, - "react-dom": { - "optional": true - } - }, "publishConfig": { "access": "public" }, "bundler": { - "entries": [ - "./src/index.ts", - "./src/manager.tsx", + "interfaceEntries": [ + "./src/index.ts" + ], + "managerEntries": [ + "./src/manager.tsx" + ], + "previewEntries": [ "./src/preview.tsx" ] }, diff --git a/code/addons/actions/package.json b/code/addons/actions/package.json index 04b698d8f97d..4920b24d8b6b 100644 --- a/code/addons/actions/package.json +++ b/code/addons/actions/package.json @@ -33,21 +33,9 @@ "require": "./dist/decorator.js", "import": "./dist/decorator.mjs" }, - "./manager": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, - "./preview": { - "types": "./dist/preview.d.ts", - "require": "./dist/preview.js", - "import": "./dist/preview.mjs" - }, - "./register.js": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, + "./manager": "./dist/manager.js", + "./preview": "./dist/preview.js", + "./register.js": "./dist/manager.js", "./package.json": "./package.json" }, "main": "dist/index.js", @@ -58,14 +46,8 @@ "*": [ "dist/index.d.ts" ], - "manager": [ - "dist/manager.d.ts" - ], "decorator": [ "dist/decorator.d.ts" - ], - "preview": [ - "dist/preview.d.ts" ] } }, @@ -77,51 +59,39 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, "dependencies": { + "@storybook/global": "^5.0.0", + "@storybook/types": "7.1.0", + "polished": "^4.2.2", + "telejson": "^7.0.3" + }, + "devDependencies": { "@storybook/client-logger": "7.1.0", "@storybook/components": "7.1.0", "@storybook/core-events": "7.1.0", - "@storybook/global": "^5.0.0", "@storybook/manager-api": "7.1.0", "@storybook/preview-api": "7.1.0", "@storybook/theming": "7.1.0", - "@storybook/types": "7.1.0", + "@types/uuid": "^9.0.1", "dequal": "^2.0.2", - "lodash": "^4.17.21", - "polished": "^4.2.2", - "prop-types": "^15.7.2", "react-inspector": "^6.0.0", - "telejson": "^7.0.3", - "ts-dedent": "^2.0.0", + "typescript": "~4.9.3", "uuid": "^9.0.0" }, - "devDependencies": { - "@types/lodash": "^4.14.167", - "@types/uuid": "^9.0.1", - "typescript": "~4.9.3" - }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "react": { - "optional": true - }, - "react-dom": { - "optional": true - } - }, "publishConfig": { "access": "public" }, "bundler": { - "entries": [ - "./src/index.ts", + "interfaceEntries": [ "./src/decorator.ts", - "./src/manager.tsx", + "./src/index.ts" + ], + "managerEntries": [ + "./src/manager.tsx" + ], + "previewEntries": [ "./src/preview.ts" ] }, diff --git a/code/addons/backgrounds/package.json b/code/addons/backgrounds/package.json index 26128a713df0..71529cbd6e56 100644 --- a/code/addons/backgrounds/package.json +++ b/code/addons/backgrounds/package.json @@ -5,7 +5,6 @@ "keywords": [ "addon", "background", - "react", "storybook", "essentials", "design" @@ -32,39 +31,14 @@ "require": "./dist/index.js", "import": "./dist/index.mjs" }, - "./manager": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, - "./preview": { - "types": "./dist/preview.d.ts", - "require": "./dist/preview.js", - "import": "./dist/preview.mjs" - }, - "./register": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, + "./manager": "./dist/manager.js", + "./preview": "./dist/preview.js", + "./register": "./dist/manager.js", "./package.json": "./package.json" }, "main": "dist/index.js", "module": "dist/index.mjs", "types": "dist/index.d.ts", - "typesVersions": { - "*": { - "*": [ - "dist/index.d.ts" - ], - "manager": [ - "dist/manager.d.ts" - ], - "preview": [ - "dist/preview.d.ts" - ] - } - }, "files": [ "dist/**/*", "README.md", @@ -73,9 +47,14 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, "dependencies": { + "@storybook/types": "7.1.0", + "memoizerific": "^1.11.3", + "ts-dedent": "^2.0.0" + }, + "devDependencies": { "@storybook/client-logger": "7.1.0", "@storybook/components": "7.1.0", "@storybook/core-events": "7.1.0", @@ -83,32 +62,19 @@ "@storybook/manager-api": "7.1.0", "@storybook/preview-api": "7.1.0", "@storybook/theming": "7.1.0", - "@storybook/types": "7.1.0", - "memoizerific": "^1.11.3", - "ts-dedent": "^2.0.0" - }, - "devDependencies": { "typescript": "~4.9.3" }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "react": { - "optional": true - }, - "react-dom": { - "optional": true - } - }, "publishConfig": { "access": "public" }, "bundler": { - "entries": [ - "./src/index.ts", - "./src/manager.tsx", + "interfaceEntries": [ + "./src/index.ts" + ], + "managerEntries": [ + "./src/manager.tsx" + ], + "previewEntries": [ "./src/preview.tsx" ] }, diff --git a/code/addons/controls/package.json b/code/addons/controls/package.json index e76a33702e1c..de26a8868fb8 100644 --- a/code/addons/controls/package.json +++ b/code/addons/controls/package.json @@ -32,31 +32,13 @@ "require": "./dist/index.js", "import": "./dist/index.mjs" }, - "./manager": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, - "./register": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, + "./manager": "./dist/manager.js", + "./register": "./dist/manager.js", "./package.json": "./package.json" }, "main": "dist/index.js", "module": "dist/index.mjs", "types": "dist/index.d.ts", - "typesVersions": { - "*": { - "*": [ - "dist/index.d.ts" - ], - "manager": [ - "dist/manager.d.ts" - ] - } - }, "files": [ "dist/**/*", "README.md", @@ -65,9 +47,13 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, "dependencies": { + "@storybook/types": "7.1.0", + "ts-dedent": "^2.0.0" + }, + "devDependencies": { "@storybook/blocks": "7.1.0", "@storybook/client-logger": "7.1.0", "@storybook/components": "7.1.0", @@ -75,32 +61,18 @@ "@storybook/manager-api": "7.1.0", "@storybook/node-logger": "7.1.0", "@storybook/preview-api": "7.1.0", - "@storybook/theming": "7.1.0", - "@storybook/types": "7.1.0", - "lodash": "^4.17.21", - "ts-dedent": "^2.0.0" - }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "react": { - "optional": true - }, - "react-dom": { - "optional": true - } + "@storybook/theming": "7.1.0" }, "publishConfig": { "access": "public" }, "bundler": { - "entries": [ - "./src/index.ts", - "./src/manager.tsx" + "interfaceEntries": [ + "./src/index.ts" ], - "platform": "browser" + "managerEntries": [ + "./src/manager.tsx" + ] }, "gitHead": "e6a7fd8a655c69780bc20b9749c2699e44beae17", "storybook": { diff --git a/code/addons/docs/package.json b/code/addons/docs/package.json index d27003bf434d..734c41f43abc 100644 --- a/code/addons/docs/package.json +++ b/code/addons/docs/package.json @@ -31,29 +31,11 @@ "require": "./dist/index.js", "import": "./dist/index.mjs" }, - "./preview": { - "types": "./dist/preview.d.ts", - "require": "./dist/preview.js", - "import": "./dist/preview.mjs" - }, - "./preset": { - "types": "./dist/preset.d.ts", - "require": "./dist/preset.js" - }, "./blocks": { "types": "./dist/blocks.d.ts", "require": "./dist/blocks.js", "import": "./dist/blocks.mjs" }, - "./dist/preview": { - "types": "./dist/preview.d.ts", - "require": "./dist/preview.js", - "import": "./dist/preview.mjs" - }, - "./dist/preset": { - "types": "./dist/preset.d.ts", - "require": "./dist/preset.js" - }, "./dist/shims/mdx-react-shim": { "types": "./dist/shims/mdx-react-shim.d.ts", "require": "./dist/shims/mdx-react-shim.js", @@ -64,6 +46,10 @@ "require": "./dist/shims/mdx-react-shim.js", "import": "./dist/shims/mdx-react-shim.mjs" }, + "./preview": "./dist/preview.js", + "./dist/preview": "./dist/preview.js", + "./preset": "./dist/preset.js", + "./dist/preset": "./dist/preset.js", "./svelte/HOC.svelte": "./svelte/HOC.svelte", "./ember": "./ember/index.js", "./ember/index.js": "./ember/index.js", @@ -94,7 +80,7 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, "dependencies": { "@jest/transform": "^29.3.1", @@ -130,13 +116,17 @@ "access": "public" }, "bundler": { - "entries": [ - "./src/index.ts", - "./src/preset.ts", - "./src/preview.ts", + "interfaceEntries": [ "./src/blocks.ts", + "./src/index.ts", "./src/shims/mdx-react-shim.ts" ], + "previewEntries": [ + "./src/preview.ts" + ], + "nodeEntries": [ + "./src/preset.ts" + ], "externals": [ "@storybook/mdx1-csf" ] diff --git a/code/addons/docs/preview.js b/code/addons/docs/preview.js index a0c1fa6da40c..49ad602f79f4 100644 --- a/code/addons/docs/preview.js +++ b/code/addons/docs/preview.js @@ -1,2 +1 @@ -// eslint-disable-next-line import/export export * from './dist/preview'; diff --git a/code/addons/essentials/package.json b/code/addons/essentials/package.json index af88d22a5757..19b21522945e 100644 --- a/code/addons/essentials/package.json +++ b/code/addons/essentials/package.json @@ -41,7 +41,7 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, "dependencies": { "@storybook/addon-actions": "7.1.0", @@ -59,18 +59,13 @@ "devDependencies": { "typescript": "^4.9.3" }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, "publishConfig": { "access": "public" }, "bundler": { - "entries": [ + "nodeEntries": [ "./src/index.ts" - ], - "platform": "node" + ] }, "gitHead": "e6a7fd8a655c69780bc20b9749c2699e44beae17" } diff --git a/code/addons/gfm/package.json b/code/addons/gfm/package.json index bc607631eec0..e95b4cde012c 100644 --- a/code/addons/gfm/package.json +++ b/code/addons/gfm/package.json @@ -25,16 +25,8 @@ }, "license": "MIT", "exports": { - ".": { - "types": "./dist/index.d.ts", - "node": "./dist/index.js", - "require": "./dist/index.js" - }, - "./preset": { - "types": "./dist/index.d.ts", - "node": "./dist/index.js", - "require": "./dist/index.js" - }, + ".": "./dist/index.js", + "./preset": "./dist/index.js", "./package.json": "./package.json" }, "main": "dist/index.js", @@ -48,7 +40,7 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, "dependencies": { "@storybook/node-logger": "7.1.0", @@ -62,11 +54,8 @@ "access": "public" }, "bundler": { - "entries": [ + "nodeEntries": [ "./src/index.ts" - ], - "formats": [ - "cjs" ] }, "gitHead": "e6a7fd8a655c69780bc20b9749c2699e44beae17" diff --git a/code/addons/highlight/package.json b/code/addons/highlight/package.json index 38b1300a7d80..8c2dfb243096 100644 --- a/code/addons/highlight/package.json +++ b/code/addons/highlight/package.json @@ -30,26 +30,12 @@ "require": "./dist/index.js", "import": "./dist/index.mjs" }, - "./preview": { - "types": "./dist/preview.d.ts", - "require": "./dist/preview.js", - "import": "./dist/preview.mjs" - }, + "./preview": "./dist/preview.js", "./package.json": "./package.json" }, "main": "dist/index.js", "module": "dist/index.mjs", "types": "dist/index.d.ts", - "typesVersions": { - "*": { - "*": [ - "dist/index.d.ts" - ], - "preview": [ - "dist/preview.d.ts" - ] - } - }, "files": [ "dist/**/*", "README.md", @@ -58,14 +44,14 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, "dependencies": { - "@storybook/core-events": "7.1.0", - "@storybook/global": "^5.0.0", - "@storybook/preview-api": "7.1.0" + "@storybook/global": "^5.0.0" }, "devDependencies": { + "@storybook/core-events": "7.1.0", + "@storybook/preview-api": "7.1.0", "@types/webpack-env": "^1.16.0", "typescript": "~4.9.3" }, @@ -73,8 +59,10 @@ "access": "public" }, "bundler": { - "entries": [ - "./src/index.ts", + "interfaceEntries": [ + "./src/index.ts" + ], + "previewEntries": [ "./src/preview.ts" ] }, diff --git a/code/addons/interactions/package.json b/code/addons/interactions/package.json index b3d131ffbb74..95e1373b302d 100644 --- a/code/addons/interactions/package.json +++ b/code/addons/interactions/package.json @@ -28,39 +28,14 @@ "require": "./dist/index.js", "import": "./dist/index.mjs" }, - "./manager": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, - "./preview": { - "types": "./dist/preview.d.ts", - "require": "./dist/preview.js", - "import": "./dist/preview.mjs" - }, - "./register.js": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, + "./manager": "./dist/manager.js", + "./preview": "./dist/preview.js", + "./register.js": "./dist/manager.js", "./package.json": "./package.json" }, "main": "dist/index.js", "module": "dist/index.mjs", "types": "dist/index.d.ts", - "typesVersions": { - "*": { - "*": [ - "dist/index.d.ts" - ], - "manager": [ - "dist/manager.d.ts" - ], - "preview": [ - "dist/preview.d.ts" - ] - } - }, "files": [ "dist/**/*", "README.md", @@ -69,18 +44,9 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, "dependencies": { - "@storybook/client-logger": "7.1.0", - "@storybook/components": "7.1.0", - "@storybook/core-common": "7.1.0", - "@storybook/core-events": "7.1.0", - "@storybook/global": "^5.0.0", - "@storybook/instrumenter": "7.1.0", - "@storybook/manager-api": "7.1.0", - "@storybook/preview-api": "7.1.0", - "@storybook/theming": "7.1.0", "@storybook/types": "7.1.0", "jest-mock": "^29.5.0", "polished": "^4.2.2", @@ -88,32 +54,35 @@ }, "devDependencies": { "@devtools-ds/object-inspector": "^1.1.2", + "@storybook/client-logger": "7.1.0", + "@storybook/components": "7.1.0", + "@storybook/core-common": "7.1.0", + "@storybook/core-events": "7.1.0", + "@storybook/global": "^5.0.0", + "@storybook/instrumenter": "7.1.0", "@storybook/jest": "next", + "@storybook/manager-api": "7.1.0", + "@storybook/preview-api": "7.1.0", "@storybook/testing-library": "next", + "@storybook/theming": "7.1.0", "@types/node": "^16.0.0", "formik": "^2.2.9", "typescript": "~4.9.3" }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "react": { - "optional": true - }, - "react-dom": { - "optional": true - } - }, "publishConfig": { "access": "public" }, "bundler": { - "entries": [ - "./src/index.ts", - "./src/manager.tsx", - "./src/preview.ts", + "interfaceEntries": [ + "./src/index.ts" + ], + "managerEntries": [ + "./src/manager.tsx" + ], + "previewEntries": [ + "./src/preview.ts" + ], + "nodeEntries": [ "./src/preset.ts" ] }, diff --git a/code/addons/interactions/src/Panel.tsx b/code/addons/interactions/src/Panel.tsx index 0bf1111fca01..24d357d42c8f 100644 --- a/code/addons/interactions/src/Panel.tsx +++ b/code/addons/interactions/src/Panel.tsx @@ -9,7 +9,8 @@ import { STORY_THREW_EXCEPTION, PLAY_FUNCTION_THREW_EXCEPTION, } from '@storybook/core-events'; -import { EVENTS, type Call, CallStates, type LogItem } from '@storybook/instrumenter'; +import type { Call, LogItem } from '@storybook/instrumenter'; +import { EVENTS, CallStates } from '@storybook/instrumenter/events'; import { InteractionsPanel } from './components/InteractionsPanel'; import { ADDON_ID } from './constants'; diff --git a/code/addons/interactions/src/components/InteractionsPanel.tsx b/code/addons/interactions/src/components/InteractionsPanel.tsx index 6fad03daaf48..936ee3937626 100644 --- a/code/addons/interactions/src/components/InteractionsPanel.tsx +++ b/code/addons/interactions/src/components/InteractionsPanel.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { Link, Placeholder } from '@storybook/components'; -import { type Call, CallStates, type ControlStates } from '@storybook/instrumenter'; +import { type Call, type ControlStates } from '@storybook/instrumenter'; +import { CallStates } from '@storybook/instrumenter/events'; import { styled } from '@storybook/theming'; import { transparentize } from 'polished'; diff --git a/code/addons/interactions/src/manager.tsx b/code/addons/interactions/src/manager.tsx index 9de823628efa..4e4efdb672c6 100644 --- a/code/addons/interactions/src/manager.tsx +++ b/code/addons/interactions/src/manager.tsx @@ -2,7 +2,7 @@ import React, { useCallback } from 'react'; import type { Combo } from '@storybook/manager-api'; import { addons, Consumer, types, useAddonState } from '@storybook/manager-api'; import { AddonPanel, Badge, Spaced } from '@storybook/components'; -import { CallStates } from '@storybook/instrumenter'; +import { CallStates } from '@storybook/instrumenter/events'; import { ADDON_ID, PANEL_ID } from './constants'; import { Panel } from './Panel'; import { TabIcon } from './components/TabStatus'; diff --git a/code/addons/jest/package.json b/code/addons/jest/package.json index 506d4881525a..278455e9aa46 100644 --- a/code/addons/jest/package.json +++ b/code/addons/jest/package.json @@ -5,7 +5,6 @@ "keywords": [ "addon", "jest", - "react", "report", "results", "storybook", @@ -34,31 +33,13 @@ "require": "./dist/index.js", "import": "./dist/index.mjs" }, - "./manager": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, - "./register": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, + "./manager": "./dist/manager.js", + "./register": "./dist/manager.js", "./package.json": "./package.json" }, "main": "dist/index.js", "module": "dist/index.mjs", "types": "dist/index.d.ts", - "typesVersions": { - "*": { - "*": [ - "dist/index.d.ts" - ], - "manager": [ - "dist/manager.d.ts" - ] - } - }, "files": [ "dist/**/*", "README.md", @@ -67,9 +48,12 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, "dependencies": { + "upath": "^2.0.1" + }, + "devDependencies": { "@storybook/client-logger": "7.1.0", "@storybook/components": "7.1.0", "@storybook/core-events": "7.1.0", @@ -79,32 +63,18 @@ "@storybook/theming": "7.1.0", "react-resize-detector": "^7.1.2", "tiny-invariant": "^1.3.1", - "upath": "^2.0.1" - }, - "devDependencies": { "typescript": "~4.9.3" }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "react": { - "optional": true - }, - "react-dom": { - "optional": true - } - }, "publishConfig": { "access": "public" }, "bundler": { - "entries": [ - "./src/index.ts", - "./src/manager.tsx" + "interfaceEntries": [ + "./src/index.ts" ], - "platform": "browser" + "managerEntries": [ + "./src/manager.tsx" + ] }, "gitHead": "e6a7fd8a655c69780bc20b9749c2699e44beae17", "storybook": { diff --git a/code/addons/links/package.json b/code/addons/links/package.json index 94f818a247df..74d0e7f9bb4c 100644 --- a/code/addons/links/package.json +++ b/code/addons/links/package.json @@ -28,26 +28,15 @@ "require": "./dist/index.js", "import": "./dist/index.mjs" }, - "./manager": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, - "./preview": { - "types": "./dist/preview.d.ts", - "require": "./dist/preview.js", - "import": "./dist/preview.mjs" - }, "./react": { "types": "./dist/react/index.d.ts", + "node": "./dist/react/index.js", "require": "./dist/react/index.js", "import": "./dist/react/index.mjs" }, - "./register": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, + "./manager": "./dist/manager.js", + "./preview": "./dist/preview.js", + "./register": "./dist/manager.js", "./package.json": "./package.json" }, "main": "dist/index.js", @@ -58,12 +47,6 @@ "*": [ "dist/index.d.ts" ], - "manager": [ - "dist/manager.d.ts" - ], - "preview": [ - "dist/preview.d.ts" - ], "react": [ "dist/react/index.d.ts" ] @@ -77,7 +60,7 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, "dependencies": { "@storybook/client-logger": "7.1.0", @@ -96,26 +79,26 @@ "typescript": "~4.9.3" }, "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + "react": "^16.8.0 || ^17.0.0 || ^18.0.0" }, "peerDependenciesMeta": { "react": { "optional": true - }, - "react-dom": { - "optional": true } }, "publishConfig": { "access": "public" }, "bundler": { - "entries": [ - "./src/index.ts", - "./src/manager.ts", - "./src/preview.ts", - "./src/react/index.ts" + "interfaceEntries": [ + "./src/react/index.ts", + "./src/index.ts" + ], + "managerEntries": [ + "./src/manager.ts" + ], + "previewEntries": [ + "./src/preview.ts" ], "post": "./scripts/fix-preview-api-reference.ts" }, diff --git a/code/addons/measure/package.json b/code/addons/measure/package.json index d640f1b8eabe..5411855f3d42 100644 --- a/code/addons/measure/package.json +++ b/code/addons/measure/package.json @@ -31,21 +31,9 @@ "require": "./dist/index.js", "import": "./dist/index.mjs" }, - "./manager": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, - "./preview": { - "types": "./dist/preview.d.ts", - "require": "./dist/preview.js", - "import": "./dist/preview.mjs" - }, - "./register": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, + "./manager": "./dist/manager.js", + "./preview": "./dist/preview.js", + "./register": "./dist/manager.js", "./package.json": "./package.json" }, "main": "dist/index.js", @@ -72,40 +60,32 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, "dependencies": { + "@storybook/types": "7.1.0" + }, + "devDependencies": { "@storybook/client-logger": "7.1.0", "@storybook/components": "7.1.0", "@storybook/core-events": "7.1.0", "@storybook/global": "^5.0.0", "@storybook/manager-api": "7.1.0", "@storybook/preview-api": "7.1.0", - "@storybook/types": "7.1.0", - "tiny-invariant": "^1.3.1" - }, - "devDependencies": { + "tiny-invariant": "^1.3.1", "typescript": "~4.9.3" }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "react": { - "optional": true - }, - "react-dom": { - "optional": true - } - }, "publishConfig": { "access": "public" }, "bundler": { - "entries": [ - "./src/index.ts", - "./src/manager.tsx", + "interfaceEntries": [ + "./src/index.ts" + ], + "managerEntries": [ + "./src/manager.tsx" + ], + "previewEntries": [ "./src/preview.tsx" ] }, diff --git a/code/addons/outline/package.json b/code/addons/outline/package.json index 0d8ea3410553..4989f37307f2 100644 --- a/code/addons/outline/package.json +++ b/code/addons/outline/package.json @@ -34,39 +34,14 @@ "require": "./dist/index.js", "import": "./dist/index.mjs" }, - "./manager": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, - "./preview": { - "types": "./dist/preview.d.ts", - "require": "./dist/preview.js", - "import": "./dist/preview.mjs" - }, - "./register": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, + "./manager": "./dist/manager.js", + "./preview": "./dist/preview.js", + "./register": "./dist/manager.js", "./package.json": "./package.json" }, "main": "dist/index.js", "module": "dist/index.mjs", "types": "dist/index.d.ts", - "typesVersions": { - "*": { - "*": [ - "dist/index.d.ts" - ], - "manager": [ - "dist/manager.d.ts" - ], - "preview": [ - "dist/preview.d.ts" - ] - } - }, "files": [ "dist/**/*", "README.md", @@ -75,40 +50,32 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, "dependencies": { + "@storybook/types": "7.1.0" + }, + "devDependencies": { "@storybook/client-logger": "7.1.0", "@storybook/components": "7.1.0", "@storybook/core-events": "7.1.0", "@storybook/global": "^5.0.0", "@storybook/manager-api": "7.1.0", "@storybook/preview-api": "7.1.0", - "@storybook/types": "7.1.0", - "ts-dedent": "^2.0.0" - }, - "devDependencies": { + "ts-dedent": "^2.0.0", "typescript": "~4.9.3" }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "react": { - "optional": true - }, - "react-dom": { - "optional": true - } - }, "publishConfig": { "access": "public" }, "bundler": { - "entries": [ - "./src/index.ts", - "./src/manager.tsx", + "interfaceEntries": [ + "./src/index.ts" + ], + "managerEntries": [ + "./src/manager.tsx" + ], + "previewEntries": [ "./src/preview.tsx" ] }, diff --git a/code/addons/storyshots-core/tsconfig.build.json b/code/addons/storyshots-core/tsconfig.build.json index dae6c1e39197..3e6d5bba939e 100644 --- a/code/addons/storyshots-core/tsconfig.build.json +++ b/code/addons/storyshots-core/tsconfig.build.json @@ -2,7 +2,7 @@ "extends": "./tsconfig.json", "compileOnSave": false, "compilerOptions": { - "target": "ES2020", + "target": "ES2022", "module": "CommonJS", "lib": ["es2020", "dom"], "esModuleInterop": true, diff --git a/code/addons/storyshots-puppeteer/tsconfig.build.json b/code/addons/storyshots-puppeteer/tsconfig.build.json index dae6c1e39197..3e6d5bba939e 100644 --- a/code/addons/storyshots-puppeteer/tsconfig.build.json +++ b/code/addons/storyshots-puppeteer/tsconfig.build.json @@ -2,7 +2,7 @@ "extends": "./tsconfig.json", "compileOnSave": false, "compilerOptions": { - "target": "ES2020", + "target": "ES2022", "module": "CommonJS", "lib": ["es2020", "dom"], "esModuleInterop": true, diff --git a/code/addons/storysource/package.json b/code/addons/storysource/package.json index 392d06446a5b..cd4163dabc18 100644 --- a/code/addons/storysource/package.json +++ b/code/addons/storysource/package.json @@ -28,15 +28,8 @@ "require": "./dist/index.js", "import": "./dist/index.mjs" }, - "./preset": { - "types": "./dist/preset.d.ts", - "require": "./dist/preset.js" - }, - "./manager": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, + "./preset": "./dist/preset.js", + "./manager": "./dist/manager.js", "./package.json": "./package.json" }, "main": "dist/index.js", @@ -50,9 +43,12 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, "dependencies": { + "estraverse": "^5.2.0" + }, + "devDependencies": { "@storybook/client-logger": "7.1.0", "@storybook/components": "7.1.0", "@storybook/manager-api": "7.1.0", @@ -60,35 +56,23 @@ "@storybook/router": "7.1.0", "@storybook/source-loader": "7.1.0", "@storybook/theming": "7.1.0", - "estraverse": "^5.2.0", - "prop-types": "^15.7.2", - "react-syntax-highlighter": "^15.5.0", - "tiny-invariant": "^1.3.1" - }, - "devDependencies": { "@types/react": "^16.14.34", "@types/react-syntax-highlighter": "11.0.5", + "react-syntax-highlighter": "^15.5.0", + "tiny-invariant": "^1.3.1", "typescript": "~4.9.3" }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "react": { - "optional": true - }, - "react-dom": { - "optional": true - } - }, "publishConfig": { "access": "public" }, "bundler": { - "entries": [ - "./src/index.ts", - "./src/manager.tsx", + "interfaceEntries": [ + "./src/index.ts" + ], + "managerEntries": [ + "./src/manager.tsx" + ], + "nodeEntries": [ "./src/preset.ts" ] }, diff --git a/code/addons/toolbars/package.json b/code/addons/toolbars/package.json index f431300582db..2478f66271cf 100644 --- a/code/addons/toolbars/package.json +++ b/code/addons/toolbars/package.json @@ -32,31 +32,13 @@ "require": "./dist/index.js", "import": "./dist/index.mjs" }, - "./manager": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, - "./register": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, + "./manager": "./dist/manager.js", + "./register": "./dist/manager.js", "./package.json": "./package.json" }, "main": "dist/index.js", "module": "dist/index.mjs", "types": "dist/index.d.ts", - "typesVersions": { - "*": { - "*": [ - "dist/index.d.ts" - ], - "manager": [ - "dist/manager.d.ts" - ] - } - }, "files": [ "dist/**/*", "README.md", @@ -65,39 +47,26 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, - "dependencies": { + "devDependencies": { "@storybook/client-logger": "7.1.0", "@storybook/components": "7.1.0", "@storybook/manager-api": "7.1.0", "@storybook/preview-api": "7.1.0", - "@storybook/theming": "7.1.0" - }, - "devDependencies": { + "@storybook/theming": "7.1.0", "typescript": "~4.9.3" }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "react": { - "optional": true - }, - "react-dom": { - "optional": true - } - }, "publishConfig": { "access": "public" }, "bundler": { - "entries": [ - "./src/index.ts", - "./src/manager.tsx" + "interfaceEntries": [ + "./src/index.ts" ], - "platform": "browser" + "managerEntries": [ + "./src/manager.tsx" + ] }, "gitHead": "e6a7fd8a655c69780bc20b9749c2699e44beae17", "storybook": { diff --git a/code/addons/viewport/package.json b/code/addons/viewport/package.json index e1a658fe67c5..18016e937644 100644 --- a/code/addons/viewport/package.json +++ b/code/addons/viewport/package.json @@ -29,39 +29,14 @@ "require": "./dist/index.js", "import": "./dist/index.mjs" }, - "./manager": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, - "./preview": { - "types": "./dist/preview.d.ts", - "require": "./dist/preview.ts", - "import": "./dist/preview.mjs" - }, - "./register": { - "types": "./dist/manager.d.ts", - "require": "./dist/manager.js", - "import": "./dist/manager.mjs" - }, + "./manager": "./dist/manager.js", + "./preview": "./dist/preview.ts", + "./register": "./dist/manager.js", "./package.json": "./package.json" }, "main": "dist/index.js", "module": "dist/index.mjs", "types": "dist/index.d.ts", - "typesVersions": { - "*": { - "*": [ - "dist/index.d.ts" - ], - "manager": [ - "dist/manager.d.ts" - ], - "preview": [ - "dist/preview.d.ts" - ] - } - }, "files": [ "dist/**/*", "README.md", @@ -70,9 +45,9 @@ ], "scripts": { "check": "../../../scripts/prepare/check.ts", - "prep": "../../../scripts/prepare/bundle.ts" + "prep": "../../../scripts/prepare/addon-bundle.ts" }, - "dependencies": { + "devDependencies": { "@storybook/client-logger": "7.1.0", "@storybook/components": "7.1.0", "@storybook/core-events": "7.1.0", @@ -81,31 +56,20 @@ "@storybook/preview-api": "7.1.0", "@storybook/theming": "7.1.0", "memoizerific": "^1.11.3", - "prop-types": "^15.7.2" - }, - "devDependencies": { "typescript": "~4.9.3" }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "react": { - "optional": true - }, - "react-dom": { - "optional": true - } - }, "publishConfig": { "access": "public" }, "bundler": { - "entries": [ - "./src/index.ts", + "interfaceEntries": [ "./src/models/index.ts", - "./src/manager.tsx", + "./src/index.ts" + ], + "managerEntries": [ + "./src/manager.tsx" + ], + "previewEntries": [ "./src/preview.ts" ] }, diff --git a/code/builders/builder-webpack5/package.json b/code/builders/builder-webpack5/package.json index 4b835f82677b..cb82aef37efe 100644 --- a/code/builders/builder-webpack5/package.json +++ b/code/builders/builder-webpack5/package.json @@ -56,22 +56,14 @@ }, "dependencies": { "@babel/core": "^7.22.0", - "@storybook/addons": "7.1.0", "@storybook/channels": "7.1.0", - "@storybook/client-api": "7.1.0", "@storybook/client-logger": "7.1.0", - "@storybook/components": "7.1.0", "@storybook/core-common": "7.1.0", "@storybook/core-events": "7.1.0", "@storybook/core-webpack": "7.1.0", - "@storybook/global": "^5.0.0", - "@storybook/manager-api": "7.1.0", "@storybook/node-logger": "7.1.0", "@storybook/preview": "7.1.0", "@storybook/preview-api": "7.1.0", - "@storybook/router": "7.1.0", - "@storybook/store": "7.1.0", - "@storybook/theming": "7.1.0", "@swc/core": "^1.3.49", "@types/node": "^16.0.0", "@types/semver": "^7.3.4", @@ -109,10 +101,6 @@ "slash": "^5.0.0", "typescript": "~4.9.3" }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, "peerDependenciesMeta": { "typescript": { "optional": true diff --git a/code/builders/builder-webpack5/src/preview/iframe-webpack.config.ts b/code/builders/builder-webpack5/src/preview/iframe-webpack.config.ts index 44ec4e92c8e5..a29d936975bc 100644 --- a/code/builders/builder-webpack5/src/preview/iframe-webpack.config.ts +++ b/code/builders/builder-webpack5/src/preview/iframe-webpack.config.ts @@ -31,19 +31,29 @@ const wrapForPnP = (input: string) => dirname(require.resolve(join(input, 'packa const storybookPaths: Record = { ...[ - // these packages are not pre-bundled because of react dependencies + // these packages are not pre-bundled because of react dependencies. + // these are not dependencies of the builder anymore, thus resolving them can fail. + // we should remove the aliases in 8.0, I'm not sure why they are here in the first place. 'components', 'global', 'manager-api', 'router', 'theming', - ].reduce( - (acc, sbPackage) => ({ - ...acc, - [`@storybook/${sbPackage}`]: wrapForPnP(`@storybook/${sbPackage}`), - }), - {} - ), + ].reduce((acc, sbPackage) => { + let packagePath; + try { + packagePath = wrapForPnP(`@storybook/${sbPackage}`); + } catch (e) { + // ignore + } + if (packagePath) { + return { + ...acc, + [`@storybook/${sbPackage}`]: wrapForPnP(`@storybook/${sbPackage}`), + }; + } + return acc; + }, {}), // deprecated, remove in 8.0 [`@storybook/api`]: wrapForPnP(`@storybook/manager-api`), }; diff --git a/code/deprecated/manager-api-shim/package.json b/code/deprecated/manager-api-shim/package.json index 45e71ba4e257..002f60f7217f 100644 --- a/code/deprecated/manager-api-shim/package.json +++ b/code/deprecated/manager-api-shim/package.json @@ -45,18 +45,6 @@ "@storybook/client-logger": "7.1.0", "@storybook/manager-api": "7.1.0" }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "react": { - "optional": true - }, - "react-dom": { - "optional": true - } - }, "publishConfig": { "access": "public" }, diff --git a/code/frameworks/angular/package.json b/code/frameworks/angular/package.json index 2fbfa9d325d7..25421a98e8e9 100644 --- a/code/frameworks/angular/package.json +++ b/code/frameworks/angular/package.json @@ -101,8 +101,6 @@ "@angular/platform-browser": ">=14.1.0 < 17.0.0", "@angular/platform-browser-dynamic": ">=14.1.0 < 17.0.0", "@babel/core": "*", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0", "rxjs": "^6.0.0 || ^7.4.0", "typescript": "^4.0.0 || ^5.0.0", "zone.js": "^0.8.29 || >= 0.9.0 < 1.0.0" diff --git a/code/frameworks/angular/src/client/angular-beta/utils/NgComponentAnalyzer.test.ts b/code/frameworks/angular/src/client/angular-beta/utils/NgComponentAnalyzer.test.ts index 2da24f4ef0ce..d3ad13029e69 100644 --- a/code/frameworks/angular/src/client/angular-beta/utils/NgComponentAnalyzer.test.ts +++ b/code/frameworks/angular/src/client/angular-beta/utils/NgComponentAnalyzer.test.ts @@ -155,7 +155,7 @@ describe('getComponentInputsOutputs', () => { }) class FooComponent extends BarComponent { @Input() - public b: string; + public b = ''; @Input() public c: string; diff --git a/code/frameworks/angular/tsconfig.build.json b/code/frameworks/angular/tsconfig.build.json index 75efd9abab35..1c46bbda0d20 100644 --- a/code/frameworks/angular/tsconfig.build.json +++ b/code/frameworks/angular/tsconfig.build.json @@ -2,7 +2,7 @@ "extends": "../../tsconfig.json", "compileOnSave": false, "compilerOptions": { - "target": "ES2020", + "target": "ES2022", "module": "CommonJS", "lib": ["es2020", "dom", "dom.iterable"], "experimentalDecorators": true, diff --git a/code/frameworks/ember/package.json b/code/frameworks/ember/package.json index 6d46043864bf..e5d5c502c60e 100644 --- a/code/frameworks/ember/package.json +++ b/code/frameworks/ember/package.json @@ -48,9 +48,7 @@ "@types/ember__component": "4.0.8", "babel-plugin-ember-modules-api-polyfill": "^2.12.0", "babel-plugin-htmlbars-inline-precompile": "2 || 3", - "ember-source": "~3.28.1", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + "ember-source": "~3.28.1" }, "engines": { "node": ">=16.0.0" diff --git a/code/frameworks/html-webpack5/package.json b/code/frameworks/html-webpack5/package.json index d971e2c4e966..5a5a228cfb70 100644 --- a/code/frameworks/html-webpack5/package.json +++ b/code/frameworks/html-webpack5/package.json @@ -58,9 +58,7 @@ "typescript": "~4.9.3" }, "peerDependencies": { - "@babel/core": "*", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + "@babel/core": "*" }, "engines": { "node": ">=16.0.0" @@ -69,6 +67,10 @@ "access": "public" }, "bundler": { + "externals": [ + "react", + "react-dom" + ], "entries": [ "./src/index.ts", "./src/preset.ts" diff --git a/code/frameworks/nextjs/tsconfig.json b/code/frameworks/nextjs/tsconfig.json index 26be65113f88..c68d607def51 100644 --- a/code/frameworks/nextjs/tsconfig.json +++ b/code/frameworks/nextjs/tsconfig.json @@ -2,6 +2,7 @@ "extends": "../../tsconfig.json", "compilerOptions": { "strict": true, + "module": "CommonJS", "resolveJsonModule": true, "skipLibCheck": true }, diff --git a/code/frameworks/preact-webpack5/package.json b/code/frameworks/preact-webpack5/package.json index e994102da998..7176dd022eb2 100644 --- a/code/frameworks/preact-webpack5/package.json +++ b/code/frameworks/preact-webpack5/package.json @@ -59,9 +59,7 @@ }, "peerDependencies": { "@babel/core": "*", - "preact": "^8.0.0||^10.0.0", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + "preact": "^8.0.0||^10.0.0" }, "engines": { "node": ">=16.0.0" @@ -70,6 +68,10 @@ "access": "public" }, "bundler": { + "externals": [ + "react", + "react-dom" + ], "entries": [ "./src/index.ts", "./src/preset.ts" diff --git a/code/frameworks/react-webpack5/package.json b/code/frameworks/react-webpack5/package.json index 0547c32c072b..d0b916acca71 100644 --- a/code/frameworks/react-webpack5/package.json +++ b/code/frameworks/react-webpack5/package.json @@ -76,6 +76,10 @@ "access": "public" }, "bundler": { + "externals": [ + "react", + "react-dom" + ], "entries": [ "./src/index.ts", "./src/preset.ts" diff --git a/code/frameworks/server-webpack5/package.json b/code/frameworks/server-webpack5/package.json index e2bb618fcf4c..522db7dc3717 100644 --- a/code/frameworks/server-webpack5/package.json +++ b/code/frameworks/server-webpack5/package.json @@ -56,10 +56,6 @@ "devDependencies": { "typescript": "~4.9.3" }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, "engines": { "node": ">=16.0.0" }, @@ -67,6 +63,10 @@ "access": "public" }, "bundler": { + "externals": [ + "react", + "react-dom" + ], "entries": [ "./src/index.ts", "./src/preset.ts" diff --git a/code/frameworks/svelte-webpack5/package.json b/code/frameworks/svelte-webpack5/package.json index 4b46ec53c038..44f31ea6d2e9 100644 --- a/code/frameworks/svelte-webpack5/package.json +++ b/code/frameworks/svelte-webpack5/package.json @@ -59,8 +59,6 @@ }, "peerDependencies": { "@babel/core": "*", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0", "svelte": "^3.48.0 || ^4.0.0", "svelte-loader": "*" }, @@ -71,6 +69,10 @@ "access": "public" }, "bundler": { + "externals": [ + "react", + "react-dom" + ], "entries": [ "./src/index.ts", "./src/preset.ts" diff --git a/code/frameworks/vue-vite/package.json b/code/frameworks/vue-vite/package.json index 5c8159b0d32f..429cc5dd0afc 100644 --- a/code/frameworks/vue-vite/package.json +++ b/code/frameworks/vue-vite/package.json @@ -60,8 +60,6 @@ "vue": "^2.7.10" }, "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0", "vite": "^3.0.0 || ^4.0.0", "vue": "^2.7.0" }, @@ -72,6 +70,10 @@ "access": "public" }, "bundler": { + "externals": [ + "react", + "react-dom" + ], "entries": [ "./src/index.ts", "./src/preset.ts" diff --git a/code/frameworks/vue-webpack5/package.json b/code/frameworks/vue-webpack5/package.json index c34a564037dc..ce1b1cc0470c 100644 --- a/code/frameworks/vue-webpack5/package.json +++ b/code/frameworks/vue-webpack5/package.json @@ -63,8 +63,6 @@ "@babel/core": "*", "babel-loader": "^7.0.0 || ^8.0.0 || ^9.0.0", "css-loader": "*", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0", "vue": "^2.6.8", "vue-loader": "^15.7.0", "vue-template-compiler": "^2.6.8" @@ -76,6 +74,10 @@ "access": "public" }, "bundler": { + "externals": [ + "react", + "react-dom" + ], "entries": [ "./src/index.ts", "./src/preset.ts" diff --git a/code/frameworks/vue3-vite/package.json b/code/frameworks/vue3-vite/package.json index 269facaf2121..26ddc178972a 100644 --- a/code/frameworks/vue3-vite/package.json +++ b/code/frameworks/vue3-vite/package.json @@ -60,8 +60,6 @@ "vite": "^4.0.0" }, "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0", "vite": "^3.0.0 || ^4.0.0" }, "engines": { @@ -71,6 +69,10 @@ "access": "public" }, "bundler": { + "externals": [ + "react", + "react-dom" + ], "entries": [ "./src/index.ts", "./src/preset.ts" diff --git a/code/frameworks/vue3-webpack5/package.json b/code/frameworks/vue3-webpack5/package.json index cbf532add8ff..cb99b2c267b8 100644 --- a/code/frameworks/vue3-webpack5/package.json +++ b/code/frameworks/vue3-webpack5/package.json @@ -62,8 +62,6 @@ "@babel/core": "*", "@vue/compiler-sfc": "^3.0.0", "babel-loader": "^7.0.0 || ^8.0.0 || ^9.0.0", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0", "vue": "^3.0.0" }, "engines": { @@ -73,6 +71,10 @@ "access": "public" }, "bundler": { + "externals": [ + "react", + "react-dom" + ], "entries": [ "./src/index.ts", "./src/preset.ts" diff --git a/code/frameworks/web-components-vite/package.json b/code/frameworks/web-components-vite/package.json index 2f1b85942297..d91d98f5b79f 100644 --- a/code/frameworks/web-components-vite/package.json +++ b/code/frameworks/web-components-vite/package.json @@ -57,10 +57,6 @@ "@types/node": "^16.0.0", "typescript": "~4.9.3" }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, "engines": { "node": "^14.18 || >=16" }, @@ -68,6 +64,10 @@ "access": "public" }, "bundler": { + "externals": [ + "react", + "react-dom" + ], "entries": [ "./src/index.ts", "./src/preset.ts" diff --git a/code/frameworks/web-components-webpack5/package.json b/code/frameworks/web-components-webpack5/package.json index 0cb3e19f7358..1c48da9a1905 100644 --- a/code/frameworks/web-components-webpack5/package.json +++ b/code/frameworks/web-components-webpack5/package.json @@ -62,9 +62,7 @@ "typescript": "~4.9.3" }, "peerDependencies": { - "lit": "^2.0.0", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + "lit": "^2.0.0" }, "engines": { "node": ">=16.0.0" @@ -73,6 +71,10 @@ "access": "public" }, "bundler": { + "externals": [ + "react", + "react-dom" + ], "entries": [ "./src/index.ts", "./src/preset.ts" diff --git a/code/lib/instrumenter/package.json b/code/lib/instrumenter/package.json index f31671949df3..140454fd9703 100644 --- a/code/lib/instrumenter/package.json +++ b/code/lib/instrumenter/package.json @@ -27,11 +27,27 @@ "require": "./dist/index.js", "import": "./dist/index.mjs" }, + "./events": { + "types": "./dist/events.d.ts", + "node": "./dist/events.js", + "require": "./dist/events.js", + "import": "./dist/events.mjs" + }, "./package.json": "./package.json" }, "main": "dist/index.js", "module": "dist/index.mjs", "types": "dist/index.d.ts", + "typesVersions": { + "*": { + "*": [ + "dist/index.d.ts" + ], + "events": [ + "dist/events.d.ts" + ] + } + }, "files": [ "dist/**/*", "README.md", @@ -57,7 +73,8 @@ }, "bundler": { "entries": [ - "./src/index.ts" + "./src/index.ts", + "./src/events.ts" ] }, "gitHead": "e6a7fd8a655c69780bc20b9749c2699e44beae17" diff --git a/code/lib/instrumenter/src/events.ts b/code/lib/instrumenter/src/events.ts new file mode 100644 index 000000000000..b52504561527 --- /dev/null +++ b/code/lib/instrumenter/src/events.ts @@ -0,0 +1,16 @@ +export const EVENTS = { + CALL: 'storybook/instrumenter/call', + SYNC: 'storybook/instrumenter/sync', + START: 'storybook/instrumenter/start', + BACK: 'storybook/instrumenter/back', + GOTO: 'storybook/instrumenter/goto', + NEXT: 'storybook/instrumenter/next', + END: 'storybook/instrumenter/end', +}; + +export enum CallStates { + DONE = 'done', + ERROR = 'error', + ACTIVE = 'active', + WAITING = 'waiting', +} diff --git a/code/lib/instrumenter/src/index.ts b/code/lib/instrumenter/src/index.ts index 5e739304b4f9..89bec9d53ce1 100644 --- a/code/lib/instrumenter/src/index.ts +++ b/code/lib/instrumenter/src/index.ts @@ -1,3 +1,4 @@ -export { EVENTS, instrument } from './instrumenter'; +export { instrument } from './instrumenter'; +export { EVENTS, CallStates } from './events'; export * from './types'; diff --git a/code/lib/instrumenter/src/instrumenter.test.ts b/code/lib/instrumenter/src/instrumenter.test.ts index eadb1f7d5c84..7e28b0e6966e 100644 --- a/code/lib/instrumenter/src/instrumenter.test.ts +++ b/code/lib/instrumenter/src/instrumenter.test.ts @@ -10,7 +10,8 @@ import { } from '@storybook/core-events'; import { global } from '@storybook/global'; -import { EVENTS, Instrumenter } from './instrumenter'; +import { Instrumenter } from './instrumenter'; +import { EVENTS } from './events'; import type { Options } from './types'; jest.mock('@storybook/client-logger'); diff --git a/code/lib/instrumenter/src/instrumenter.ts b/code/lib/instrumenter/src/instrumenter.ts index 357b9df52817..0ca88b91a7b4 100644 --- a/code/lib/instrumenter/src/instrumenter.ts +++ b/code/lib/instrumenter/src/instrumenter.ts @@ -12,17 +12,7 @@ import { import { global } from '@storybook/global'; import type { Call, CallRef, ControlStates, LogItem, Options, State, SyncPayload } from './types'; -import { CallStates } from './types'; - -export const EVENTS = { - CALL: 'storybook/instrumenter/call', - SYNC: 'storybook/instrumenter/sync', - START: 'storybook/instrumenter/start', - BACK: 'storybook/instrumenter/back', - GOTO: 'storybook/instrumenter/goto', - NEXT: 'storybook/instrumenter/next', - END: 'storybook/instrumenter/end', -}; +import { CallStates, EVENTS } from './events'; type PatchedObj = { [Property in keyof TObj]: TObj[Property] & { __originalFn__: PatchedObj }; diff --git a/code/lib/instrumenter/src/types.ts b/code/lib/instrumenter/src/types.ts index 1076d4dd3a1d..cad214294bb2 100644 --- a/code/lib/instrumenter/src/types.ts +++ b/code/lib/instrumenter/src/types.ts @@ -1,4 +1,5 @@ import type { StoryId } from '@storybook/types'; +import type { CallStates } from './events'; export interface Call { id: string; @@ -19,13 +20,6 @@ export interface Call { }; } -export enum CallStates { - DONE = 'done', - ERROR = 'error', - ACTIVE = 'active', - WAITING = 'waiting', -} - export interface CallRef { __callId__: Call['id']; } diff --git a/code/lib/manager-api/package.json b/code/lib/manager-api/package.json index 39e84326daf2..0b85fea42e6b 100644 --- a/code/lib/manager-api/package.json +++ b/code/lib/manager-api/package.json @@ -67,8 +67,12 @@ "typescript": "~4.9.3" }, "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + "react": "^16.8.0 || ^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "react": { + "optional": true + } }, "publishConfig": { "access": "public" diff --git a/code/lib/preview-api/package.json b/code/lib/preview-api/package.json index 9838ce29c4a7..fc27e0f0be62 100644 --- a/code/lib/preview-api/package.json +++ b/code/lib/preview-api/package.json @@ -93,6 +93,10 @@ "access": "public" }, "bundler": { + "externals": [ + "react", + "react-dom" + ], "entries": [ "./src/index.ts", "./src/addons.ts", diff --git a/code/lib/preview/package.json b/code/lib/preview/package.json index 7edc4bbc4e83..d67dbebf0e5b 100644 --- a/code/lib/preview/package.json +++ b/code/lib/preview/package.json @@ -55,16 +55,20 @@ "prep": "../../../scripts/prepare/esm-bundle.ts" }, "devDependencies": { + "@fal-works/esbuild-plugin-global-externals": "^2.1.2", "@storybook/channels": "7.1.0", "@storybook/client-logger": "7.1.0", "@storybook/core-events": "7.1.0", "@storybook/preview-api": "7.1.0", + "fs-extra": "^11.1.0", + "ts-dedent": "^2.0.0", "typescript": "~4.9.3" }, "publishConfig": { "access": "public" }, "bundler": { + "pre": "./scripts/generate-exports-file.ts", "browserEntries": [ "./src/runtime.ts" ], diff --git a/code/lib/preview/scripts/generate-exports-file.ts b/code/lib/preview/scripts/generate-exports-file.ts new file mode 100644 index 000000000000..afdbea8ff6e6 --- /dev/null +++ b/code/lib/preview/scripts/generate-exports-file.ts @@ -0,0 +1,71 @@ +/* eslint-disable no-console */ +import fs from 'fs-extra'; +import path from 'path'; +import { dedent } from 'ts-dedent'; +import { ESLint } from '../../../../scripts/node_modules/eslint'; +import { values } from '../src/globals/runtime'; + +const location = path.join(__dirname, '..', 'src', 'globals', 'exports.ts'); +let attempts = 0; + +function removeDefault(input: string) { + return input !== 'default'; +} + +const wait = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms)); + +async function generate(text: string) { + console.log('Linting...'); + + const eslint = new ESLint({ + cwd: path.join(__dirname, '..'), + fix: true, + }); + const output = await eslint.lintText(text, { filePath: location }); + + console.log('Writing...'); + + await fs.writeFile(location, output[0].output); +} + +const run = async () => { + const data = Object.entries(values).reduce>((acc, [key, value]) => { + acc[key] = Object.keys(value).filter(removeDefault); + return acc; + }, {}); + + console.log('Generating...'); + + const text = dedent` + // this file is generated by generate-exports-file.ts + // this is done to prevent runtime dependencies from making it's way into the build/start script of the manager + // the manager builder needs to know which dependencies are 'globalized' in the ui + + export default ${JSON.stringify(data, null, 2)} as const;`; + + await fs.ensureFile(location); + + const tryGenerate = async () => { + attempts += 1; + + await generate(text).catch(async (e) => { + if (attempts > 5) { + throw e; + } + + console.log('Retrying...'); + + await wait(1000); + await tryGenerate(); + }); + }; + + await tryGenerate(); + + console.log('Done!'); +}; + +run().catch((e) => { + console.error(e); + process.exitCode = 1; +}); diff --git a/code/lib/preview/src/globals/definitions.ts b/code/lib/preview/src/globals/definitions.ts new file mode 100644 index 000000000000..9122fca70262 --- /dev/null +++ b/code/lib/preview/src/globals/definitions.ts @@ -0,0 +1,35 @@ +import type { ModuleInfo } from '@fal-works/esbuild-plugin-global-externals'; +import Exports from './exports'; +import { Keys } from './types'; +import type { Definitions } from './types'; + +/* + * We create a map of a module's name to a ModuleInfo. + * Which is a config object for a esbuild-plugin, to swap a import of a module to a reference of a global variable. + * To get this plugin to do the best job it can, it needs to know all the exports in the ModuleInfo config object. + * We generate this information via a script into `exports.ts`. + * + * It's really important that there are no actual to the runtime of the modules, hence the cumbersome generation. + * But we also want to ensure we don't miss any exports, or globals. + * + * So in order to add additional modules to be swapped for globals, you need to add them to: + * - `Keys` in `types.ts` + * - `values` in `runtime.ts`. + * + * If you forget to do either, TypeScript will complain. + * + * This `definitions.ts` file is consumed by the `builder-manager` package, + * The `runtime.ts` file is used inside the manager's browser code runtime. + */ + +const createModuleInfo = (m: keyof typeof Keys): Required => ({ + type: 'esm', + varName: Keys[m], + namedExports: Exports[m], + defaultExport: true, +}); + +export const definitions = Object.keys(Keys).reduce((acc, key) => { + acc[key as keyof typeof Keys] = createModuleInfo(key as keyof typeof Keys); + return acc; +}, {} as Definitions); diff --git a/code/lib/preview/src/globals/exports.ts b/code/lib/preview/src/globals/exports.ts new file mode 100644 index 000000000000..1f9ff0b0f087 --- /dev/null +++ b/code/lib/preview/src/globals/exports.ts @@ -0,0 +1,274 @@ +// this file is generated by generate-exports-file.ts +// this is done to prevent runtime dependencies from making it's way into the build/start script of the manager +// the manager builder needs to know which dependencies are 'globalized' in the ui + +export default { + '@storybook/channel-postmessage': [ + 'KEY', + 'PostMessageTransport', + 'PostmsgTransport', + 'createChannel', + ], + '@storybook/channel-websocket': ['WebsocketTransport', 'createChannel'], + '@storybook/channels': [ + 'Channel', + 'PostMessageTransport', + 'WebsocketTransport', + 'createBrowserChannel', + 'createPostMessageChannel', + 'createWebSocketChannel', + ], + '@storybook/client-logger': ['deprecate', 'logger', 'once', 'pretty'], + '@storybook/core-events': [ + 'CHANNEL_CREATED', + 'CONFIG_ERROR', + 'CURRENT_STORY_WAS_SET', + 'DOCS_PREPARED', + 'DOCS_RENDERED', + 'FORCE_REMOUNT', + 'FORCE_RE_RENDER', + 'GLOBALS_UPDATED', + 'IGNORED_EXCEPTION', + 'NAVIGATE_URL', + 'PLAY_FUNCTION_THREW_EXCEPTION', + 'PRELOAD_ENTRIES', + 'PREVIEW_BUILDER_PROGRESS', + 'PREVIEW_KEYDOWN', + 'REGISTER_SUBSCRIPTION', + 'REQUEST_WHATS_NEW_DATA', + 'RESET_STORY_ARGS', + 'RESULT_WHATS_NEW_DATA', + 'SELECT_STORY', + 'SET_CONFIG', + 'SET_CURRENT_STORY', + 'SET_GLOBALS', + 'SET_INDEX', + 'SET_STORIES', + 'SET_WHATS_NEW_CACHE', + 'SHARED_STATE_CHANGED', + 'SHARED_STATE_SET', + 'STORIES_COLLAPSE_ALL', + 'STORIES_EXPAND_ALL', + 'STORY_ARGS_UPDATED', + 'STORY_CHANGED', + 'STORY_ERRORED', + 'STORY_INDEX_INVALIDATED', + 'STORY_MISSING', + 'STORY_PREPARED', + 'STORY_RENDERED', + 'STORY_RENDER_PHASE_CHANGED', + 'STORY_SPECIFIED', + 'STORY_THREW_EXCEPTION', + 'STORY_UNCHANGED', + 'TOGGLE_WHATS_NEW_NOTIFICATIONS', + 'UPDATE_GLOBALS', + 'UPDATE_QUERY_PARAMS', + 'UPDATE_STORY_ARGS', + ], + '@storybook/preview-api': [ + 'ClientApi', + 'DocsContext', + 'HooksContext', + 'Preview', + 'PreviewWeb', + 'StoryStore', + 'addArgTypes', + 'addArgTypesEnhancer', + 'addArgs', + 'addArgsEnhancer', + 'addDecorator', + 'addLoader', + 'addParameters', + 'addStepRunner', + 'addons', + 'applyHooks', + 'combineArgs', + 'combineParameters', + 'composeConfigs', + 'composeStepRunners', + 'composeStories', + 'composeStory', + 'decorateStory', + 'defaultDecorateStory', + 'filterArgTypes', + 'getQueryParam', + 'getQueryParams', + 'inferControls', + 'makeDecorator', + 'mockChannel', + 'normalizeStory', + 'prepareMeta', + 'prepareStory', + 'sanitizeStoryContextUpdate', + 'setGlobalRender', + 'setProjectAnnotations', + 'simulateDOMContentLoaded', + 'simulatePageLoad', + 'sortStoriesV7', + 'start', + 'useArgs', + 'useCallback', + 'useChannel', + 'useEffect', + 'useGlobals', + 'useMemo', + 'useParameter', + 'useReducer', + 'useRef', + 'useState', + 'useStoryContext', + 'userOrAutoTitle', + 'userOrAutoTitleFromSpecifier', + ], + '@storybook/addons': [ + 'AddonStore', + 'HooksContext', + 'addons', + 'applyHooks', + 'makeDecorator', + 'mockChannel', + 'useArgs', + 'useCallback', + 'useChannel', + 'useEffect', + 'useGlobals', + 'useMemo', + 'useParameter', + 'useReducer', + 'useRef', + 'useState', + 'useStoryContext', + ], + '@storybook/client-api': [ + 'ClientApi', + 'DEEPLY_EQUAL', + 'HooksContext', + 'StoryStore', + 'UNTARGETED', + 'addArgTypes', + 'addArgTypesEnhancer', + 'addArgs', + 'addArgsEnhancer', + 'addDecorator', + 'addLoader', + 'addParameters', + 'addStepRunner', + 'applyHooks', + 'combineArgs', + 'combineParameters', + 'composeConfigs', + 'composeStepRunners', + 'composeStories', + 'composeStory', + 'decorateStory', + 'deepDiff', + 'defaultDecorateStory', + 'filterArgTypes', + 'getArrayField', + 'getField', + 'getObjectField', + 'getQueryParam', + 'getQueryParams', + 'getSingletonField', + 'getValuesFromArgTypes', + 'groupArgsByTarget', + 'inferControls', + 'mapArgsToTypes', + 'noTargetArgs', + 'normalizeComponentAnnotations', + 'normalizeInputType', + 'normalizeInputTypes', + 'normalizeProjectAnnotations', + 'normalizeStory', + 'prepareContext', + 'prepareMeta', + 'prepareStory', + 'processCSFFile', + 'sanitizeStoryContextUpdate', + 'setGlobalRender', + 'setProjectAnnotations', + 'sortStoriesV6', + 'sortStoriesV7', + 'useAddonState', + 'useArgs', + 'useCallback', + 'useChannel', + 'useEffect', + 'useGlobals', + 'useMemo', + 'useParameter', + 'useReducer', + 'useRef', + 'useSharedState', + 'useState', + 'useStoryContext', + 'userOrAutoTitle', + 'userOrAutoTitleFromSpecifier', + 'validateOptions', + ], + '@storybook/core-client': ['ClientApi', 'StoryStore', 'start'], + '@storybook/preview-web': [ + 'DocsContext', + 'Preview', + 'PreviewWeb', + 'PreviewWithSelection', + 'composeConfigs', + 'simulateDOMContentLoaded', + 'simulatePageLoad', + ], + '@storybook/store': [ + 'DEEPLY_EQUAL', + 'HooksContext', + 'StoryStore', + 'UNTARGETED', + 'applyHooks', + 'combineArgs', + 'combineParameters', + 'composeConfigs', + 'composeStepRunners', + 'composeStories', + 'composeStory', + 'decorateStory', + 'deepDiff', + 'defaultDecorateStory', + 'filterArgTypes', + 'getArrayField', + 'getField', + 'getObjectField', + 'getSingletonField', + 'getValuesFromArgTypes', + 'groupArgsByTarget', + 'inferControls', + 'mapArgsToTypes', + 'noTargetArgs', + 'normalizeComponentAnnotations', + 'normalizeInputType', + 'normalizeInputTypes', + 'normalizeProjectAnnotations', + 'normalizeStory', + 'prepareContext', + 'prepareMeta', + 'prepareStory', + 'processCSFFile', + 'sanitizeStoryContextUpdate', + 'setProjectAnnotations', + 'sortStoriesV6', + 'sortStoriesV7', + 'useAddonState', + 'useArgs', + 'useCallback', + 'useChannel', + 'useEffect', + 'useGlobals', + 'useMemo', + 'useParameter', + 'useReducer', + 'useRef', + 'useSharedState', + 'useState', + 'useStoryContext', + 'userOrAutoTitle', + 'userOrAutoTitleFromSpecifier', + 'validateOptions', + ], +} as const; diff --git a/code/lib/preview/src/globals/types.ts b/code/lib/preview/src/globals/types.ts index afd90b8bf564..37ac5a49203c 100644 --- a/code/lib/preview/src/globals/types.ts +++ b/code/lib/preview/src/globals/types.ts @@ -1,4 +1,6 @@ // Here we map the name of a module to their NAME in the global scope. +import type { ModuleInfo } from '@fal-works/esbuild-plugin-global-externals'; + export const globals = { '@storybook/addons': '__STORYBOOK_MODULE_ADDONS__', '@storybook/channel-postmessage': '__STORYBOOK_MODULE_CHANNEL_POSTMESSAGE__', // @deprecated: remove in 8.0 @@ -12,3 +14,20 @@ export const globals = { '@storybook/preview-api': '__STORYBOOK_MODULE_PREVIEW_API__', '@storybook/store': '__STORYBOOK_MODULE_STORE__', }; + +// Here we map the name of a module to their NAME in the global scope. +export enum Keys { + '@storybook/addons' = '__STORYBOOK_MODULE_ADDONS__', + '@storybook/channel-postmessage' = '__STORYBOOK_MODULE_CHANNEL_POSTMESSAGE__', + '@storybook/channel-websocket' = '__STORYBOOK_MODULE_CHANNEL_WEBSOCKET__', + '@storybook/channels' = '__STORYBOOK_MODULE_CHANNELS__', + '@storybook/client-api' = '__STORYBOOK_MODULE_CLIENT_API__', + '@storybook/client-logger' = '__STORYBOOK_MODULE_CLIENT_LOGGER__', + '@storybook/core-client' = '__STORYBOOK_MODULE_CORE_CLIENT__', + '@storybook/core-events' = '__STORYBOOK_MODULE_CORE_EVENTS__', + '@storybook/preview-web' = '__STORYBOOK_MODULE_PREVIEW_WEB__', + '@storybook/preview-api' = '__STORYBOOK_MODULE_PREVIEW_API__', + '@storybook/store' = '__STORYBOOK_MODULE_STORE__', +} + +export type Definitions = Required>>; diff --git a/code/lib/router/package.json b/code/lib/router/package.json index c9e3388b5568..37a21ba1dea4 100644 --- a/code/lib/router/package.json +++ b/code/lib/router/package.json @@ -61,8 +61,12 @@ "typescript": "~4.9.3" }, "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + "react": "^16.8.0 || ^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "react": { + "optional": true + } }, "publishConfig": { "access": "public" diff --git a/code/lib/theming/package.json b/code/lib/theming/package.json index cb6af6c14bb9..79990b4a107c 100644 --- a/code/lib/theming/package.json +++ b/code/lib/theming/package.json @@ -67,8 +67,12 @@ "typescript": "~4.9.3" }, "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + "react": "^16.8.0 || ^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "react": { + "optional": true + } }, "publishConfig": { "access": "public" diff --git a/code/tsconfig.json b/code/tsconfig.json index 26de1b5ba684..ba84c8a722a2 100644 --- a/code/tsconfig.json +++ b/code/tsconfig.json @@ -8,7 +8,7 @@ "forceConsistentCasingInFileNames": true, "jsx": "react", "moduleResolution": "Node", - "target": "ES2020", + "target": "ES2022", "module": "CommonJS", "skipLibCheck": true, "allowSyntheticDefaultImports": true, diff --git a/code/ui/manager/src/globals/types.ts b/code/ui/manager/src/globals/types.ts index a499ea31bfaf..ba9c7fc93799 100644 --- a/code/ui/manager/src/globals/types.ts +++ b/code/ui/manager/src/globals/types.ts @@ -4,16 +4,16 @@ import type { ModuleInfo } from '@fal-works/esbuild-plugin-global-externals'; export enum Keys { 'react' = '__REACT__', 'react-dom' = '__REACTDOM__', - '@storybook/components' = '__STORYBOOKCOMPONENTS__', - '@storybook/components/experimental' = '__STORYBOOKCOMPONENTSEXPERIMENTAL__', - '@storybook/channels' = '__STORYBOOKCHANNELS__', - '@storybook/core-events' = '__STORYBOOKCOREEVENTS__', - '@storybook/router' = '__STORYBOOKROUTER__', - '@storybook/theming' = '__STORYBOOKTHEMING__', - '@storybook/api' = '__STORYBOOKAPI__', // deprecated, remove in 8.0 - '@storybook/manager-api' = '__STORYBOOKAPI__', - '@storybook/addons' = '__STORYBOOKADDONS__', - '@storybook/client-logger' = '__STORYBOOKCLIENTLOGGER__', + '@storybook/components' = '__STORYBOOK_MODULE_COMPONENTS__', + '@storybook/components/experimental' = '__STORYBOOK_MODULE_COMPONENTS_EXPERIMENTAL__', + '@storybook/channels' = '__STORYBOOK_MODULE_CHANNELS__', + '@storybook/core-events' = '__STORYBOOK_MODULE_CORE_EVENTS__', + '@storybook/router' = '__STORYBOOK_MODULE_ROUTER__', + '@storybook/theming' = '__STORYBOOK_MODULE_THEMING__', + '@storybook/api' = '__STORYBOOK_MODULE_API__', // deprecated, remove in 8.0 + '@storybook/manager-api' = '__STORYBOOK_MODULE_API__', + '@storybook/addons' = '__STORYBOOK_MODULE_ADDONS__', + '@storybook/client-logger' = '__STORYBOOK_MODULE_CLIENT_LOGGER__', } export type Definitions = Required>>; diff --git a/code/ui/manager/src/typings.d.ts b/code/ui/manager/src/typings.d.ts index f46c49b91852..62fc03b7b247 100644 --- a/code/ui/manager/src/typings.d.ts +++ b/code/ui/manager/src/typings.d.ts @@ -16,12 +16,12 @@ declare var LOGLEVEL: 'trace' | 'debug' | 'info' | 'warn' | 'error' | 'silent' | declare var __REACT__: any; declare var __REACTDOM__: any; -declare var __STORYBOOKCOMPONENTS__: any; -declare var __STORYBOOKCOMPONENTSEXPERIMENTAL__: any; -declare var __STORYBOOKCHANNELS__: any; -declare var __STORYBOOKCOREEVENTS__: any; -declare var __STORYBOOKROUTER__: any; -declare var __STORYBOOKTHEMING__: any; -declare var __STORYBOOKAPI__: any; -declare var __STORYBOOKADDONS__: any; -declare var __STORYBOOKCLIENTLOGGER__: any; +declare var __STORYBOOK_MODULE_COMPONENTS__: any; +declare var __STORYBOOK_MODULE_COMPONENTS_EXPERIMENTAL__: any; +declare var __STORYBOOK_MODULE_CHANNELS__: any; +declare var __STORYBOOK_MODULE_CORE_EVENTS__: any; +declare var __STORYBOOK_MODULE_ROUTER__: any; +declare var __STORYBOOK_MODULE_THEMING__: any; +declare var __STORYBOOK_MODULE_API__: any; +declare var __STORYBOOK_MODULE_ADDONS__: any; +declare var __STORYBOOK_MODULE_CLIENT_LOGGER__: any; diff --git a/code/yarn.lock b/code/yarn.lock index 226179647946..755d0a9e1b6d 100644 --- a/code/yarn.lock +++ b/code/yarn.lock @@ -5552,14 +5552,6 @@ __metadata: react-resize-detector: ^7.1.2 resize-observer-polyfill: ^1.5.1 typescript: ~4.9.3 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - react: - optional: true - react-dom: - optional: true languageName: unknown linkType: soft @@ -5575,25 +5567,13 @@ __metadata: "@storybook/preview-api": 7.1.0 "@storybook/theming": 7.1.0 "@storybook/types": 7.1.0 - "@types/lodash": ^4.14.167 "@types/uuid": ^9.0.1 dequal: ^2.0.2 - lodash: ^4.17.21 polished: ^4.2.2 - prop-types: ^15.7.2 react-inspector: ^6.0.0 telejson: ^7.0.3 - ts-dedent: ^2.0.0 typescript: ~4.9.3 uuid: ^9.0.0 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - react: - optional: true - react-dom: - optional: true languageName: unknown linkType: soft @@ -5612,14 +5592,6 @@ __metadata: memoizerific: ^1.11.3 ts-dedent: ^2.0.0 typescript: ~4.9.3 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - react: - optional: true - react-dom: - optional: true languageName: unknown linkType: soft @@ -5636,16 +5608,7 @@ __metadata: "@storybook/preview-api": 7.1.0 "@storybook/theming": 7.1.0 "@storybook/types": 7.1.0 - lodash: ^4.17.21 ts-dedent: ^2.0.0 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - react: - optional: true - react-dom: - optional: true languageName: unknown linkType: soft @@ -5720,9 +5683,6 @@ __metadata: "@storybook/node-logger": 7.1.0 ts-dedent: ^2.0.0 typescript: ^4.9.3 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 languageName: unknown linkType: soft @@ -5761,14 +5721,6 @@ __metadata: polished: ^4.2.2 ts-dedent: ^2.2.0 typescript: ~4.9.3 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - react: - optional: true - react-dom: - optional: true languageName: unknown linkType: soft @@ -5787,14 +5739,6 @@ __metadata: tiny-invariant: ^1.3.1 typescript: ~4.9.3 upath: ^2.0.1 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - react: - optional: true - react-dom: - optional: true languageName: unknown linkType: soft @@ -5816,12 +5760,9 @@ __metadata: typescript: ~4.9.3 peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 peerDependenciesMeta: react: optional: true - react-dom: - optional: true languageName: unknown linkType: soft @@ -5849,14 +5790,6 @@ __metadata: "@storybook/types": 7.1.0 tiny-invariant: ^1.3.1 typescript: ~4.9.3 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - react: - optional: true - react-dom: - optional: true languageName: unknown linkType: soft @@ -5873,14 +5806,6 @@ __metadata: "@storybook/types": 7.1.0 ts-dedent: ^2.0.0 typescript: ~4.9.3 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - react: - optional: true - react-dom: - optional: true languageName: unknown linkType: soft @@ -6008,18 +5933,9 @@ __metadata: "@types/react": ^16.14.34 "@types/react-syntax-highlighter": 11.0.5 estraverse: ^5.2.0 - prop-types: ^15.7.2 react-syntax-highlighter: ^15.5.0 tiny-invariant: ^1.3.1 typescript: ~4.9.3 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - react: - optional: true - react-dom: - optional: true languageName: unknown linkType: soft @@ -6033,14 +5949,6 @@ __metadata: "@storybook/preview-api": 7.1.0 "@storybook/theming": 7.1.0 typescript: ~4.9.3 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - react: - optional: true - react-dom: - optional: true languageName: unknown linkType: soft @@ -6056,16 +5964,7 @@ __metadata: "@storybook/preview-api": 7.1.0 "@storybook/theming": 7.1.0 memoizerific: ^1.11.3 - prop-types: ^15.7.2 typescript: ~4.9.3 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - react: - optional: true - react-dom: - optional: true languageName: unknown linkType: soft @@ -6147,8 +6046,6 @@ __metadata: "@angular/platform-browser": ">=14.1.0 < 17.0.0" "@angular/platform-browser-dynamic": ">=14.1.0 < 17.0.0" "@babel/core": "*" - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 rxjs: ^6.0.0 || ^7.4.0 typescript: ^4.0.0 || ^5.0.0 zone.js: ^0.8.29 || >= 0.9.0 < 1.0.0 @@ -6164,14 +6061,6 @@ __metadata: dependencies: "@storybook/client-logger": 7.1.0 "@storybook/manager-api": 7.1.0 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - react: - optional: true - react-dom: - optional: true languageName: unknown linkType: soft @@ -6316,22 +6205,14 @@ __metadata: resolution: "@storybook/builder-webpack5@workspace:builders/builder-webpack5" dependencies: "@babel/core": ^7.22.0 - "@storybook/addons": 7.1.0 "@storybook/channels": 7.1.0 - "@storybook/client-api": 7.1.0 "@storybook/client-logger": 7.1.0 - "@storybook/components": 7.1.0 "@storybook/core-common": 7.1.0 "@storybook/core-events": 7.1.0 "@storybook/core-webpack": 7.1.0 - "@storybook/global": ^5.0.0 - "@storybook/manager-api": 7.1.0 "@storybook/node-logger": 7.1.0 "@storybook/preview": 7.1.0 "@storybook/preview-api": 7.1.0 - "@storybook/router": 7.1.0 - "@storybook/store": 7.1.0 - "@storybook/theming": 7.1.0 "@swc/core": ^1.3.49 "@types/node": ^16.0.0 "@types/pretty-hrtime": ^1.0.0 @@ -6366,9 +6247,6 @@ __metadata: webpack-dev-middleware: ^6.1.1 webpack-hot-middleware: ^2.25.1 webpack-virtual-modules: ^0.5.0 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 peerDependenciesMeta: typescript: optional: true @@ -6770,8 +6648,6 @@ __metadata: babel-plugin-ember-modules-api-polyfill: ^2.12.0 babel-plugin-htmlbars-inline-precompile: 2 || 3 ember-source: ~3.28.1 - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 languageName: unknown linkType: soft @@ -6830,8 +6706,6 @@ __metadata: typescript: ~4.9.3 peerDependencies: "@babel/core": "*" - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 languageName: unknown linkType: soft @@ -6929,7 +6803,9 @@ __metadata: typescript: ~4.9.3 peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 + peerDependenciesMeta: + react: + optional: true languageName: unknown linkType: soft @@ -7104,8 +6980,6 @@ __metadata: peerDependencies: "@babel/core": "*" preact: ^8.0.0||^10.0.0 - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 languageName: unknown linkType: soft @@ -7350,10 +7224,13 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/preview@workspace:lib/preview" dependencies: + "@fal-works/esbuild-plugin-global-externals": ^2.1.2 "@storybook/channels": 7.1.0 "@storybook/client-logger": 7.1.0 "@storybook/core-events": 7.1.0 "@storybook/preview-api": 7.1.0 + fs-extra: ^11.1.0 + ts-dedent: ^2.0.0 typescript: ~4.9.3 languageName: unknown linkType: soft @@ -7678,7 +7555,9 @@ __metadata: typescript: ~4.9.3 peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 + peerDependenciesMeta: + react: + optional: true languageName: unknown linkType: soft @@ -7692,9 +7571,6 @@ __metadata: "@storybook/server": 7.1.0 "@types/node": ^16.0.0 typescript: ~4.9.3 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 languageName: unknown linkType: soft @@ -7733,7 +7609,7 @@ __metadata: languageName: unknown linkType: soft -"@storybook/store@7.1.0, @storybook/store@workspace:*, @storybook/store@workspace:deprecated/store": +"@storybook/store@workspace:*, @storybook/store@workspace:deprecated/store": version: 0.0.0-use.local resolution: "@storybook/store@workspace:deprecated/store" dependencies: @@ -7776,8 +7652,6 @@ __metadata: typescript: ~4.9.3 peerDependencies: "@babel/core": "*" - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 svelte: ^3.48.0 || ^4.0.0 svelte-loader: "*" languageName: unknown @@ -7871,7 +7745,9 @@ __metadata: typescript: ~4.9.3 peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 + peerDependenciesMeta: + react: + optional: true languageName: unknown linkType: soft @@ -7903,8 +7779,6 @@ __metadata: vue: ^2.7.10 vue-docgen-api: ^4.40.0 peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 vite: ^3.0.0 || ^4.0.0 vue: ^2.7.0 languageName: unknown @@ -7927,8 +7801,6 @@ __metadata: "@babel/core": "*" babel-loader: ^7.0.0 || ^8.0.0 || ^9.0.0 css-loader: "*" - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 vue: ^2.6.8 vue-loader: ^15.7.0 vue-template-compiler: ^2.6.8 @@ -7949,8 +7821,6 @@ __metadata: vite: ^4.0.0 vue-docgen-api: ^4.40.0 peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 vite: ^3.0.0 || ^4.0.0 languageName: unknown linkType: soft @@ -7971,8 +7841,6 @@ __metadata: "@babel/core": "*" "@vue/compiler-sfc": ^3.0.0 babel-loader: ^7.0.0 || ^8.0.0 || ^9.0.0 - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 vue: ^3.0.0 languageName: unknown linkType: soft @@ -8040,9 +7908,6 @@ __metadata: "@types/node": ^16.0.0 magic-string: ^0.30.0 typescript: ~4.9.3 - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 languageName: unknown linkType: soft @@ -8060,8 +7925,6 @@ __metadata: typescript: ~4.9.3 peerDependencies: lit: ^2.0.0 - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 languageName: unknown linkType: soft diff --git a/scripts/package.json b/scripts/package.json index 041e6b1b04e9..cedfc45fc272 100644 --- a/scripts/package.json +++ b/scripts/package.json @@ -67,6 +67,7 @@ "@babel/preset-typescript": "^7.21.0", "@babel/types": "^7.22.0", "@emotion/jest": "^11.10.5", + "@fal-works/esbuild-plugin-global-externals": "^2.1.2", "@google-cloud/bigquery": "^6.2.0", "@jest/globals": "^29.3.1", "@nx/workspace": "16.2.1", @@ -105,6 +106,7 @@ "babel-eslint": "^10.1.0", "babel-loader": "^9.1.2", "boxen": "^5.1.2", + "browser-assert": "^1.2.1", "chalk": "^4.1.0", "codecov": "^3.8.1", "commander": "^6.2.1", diff --git a/scripts/prepare/addon-bundle.ts b/scripts/prepare/addon-bundle.ts new file mode 100755 index 000000000000..ddad847a699c --- /dev/null +++ b/scripts/prepare/addon-bundle.ts @@ -0,0 +1,328 @@ +#!/usr/bin/env ../../node_modules/.bin/ts-node + +import * as fs from 'fs-extra'; +import path, { join, dirname, relative } from 'path'; +import type { PackageJson } from 'type-fest'; +import { build } from 'tsup'; +import aliasPlugin from 'esbuild-plugin-alias'; +import { globalExternals } from '@fal-works/esbuild-plugin-global-externals'; + +import slash from 'slash'; +import type { Options } from 'tsup'; +import dedent from 'ts-dedent'; +import { exec } from '../utils/exec'; + +import { definitions as previewGlobalsDefinitions } from '../../code/lib/preview/src/globals/definitions'; +import { definitions as managerGlobalsDefinitions } from '../../code/ui/manager/src/globals/definitions'; + +/* TYPES */ + +type Formats = 'esm' | 'cjs'; +type BundlerConfig = { + previewEntries: string[]; + managerEntries: string[]; + nodeEntries: string[]; + interfaceEntries: string[]; + externals: string[]; + platform: Options['platform']; + pre: string; + post: string; + formats: Formats[]; +}; +type PackageJsonWithBundlerConfig = PackageJson & { + bundler: BundlerConfig; +}; +type DtsConfigSection = Pick; + +/* MAIN */ + +const run = async ({ cwd, flags }: { cwd: string; flags: string[] }) => { + const { + name, + dependencies, + peerDependencies, + bundler: { + previewEntries = [], + managerEntries = [], + nodeEntries = [], + externals: extraExternals = [], + interfaceEntries = [], + pre, + post, + }, + } = (await fs.readJson(join(cwd, 'package.json'))) as PackageJsonWithBundlerConfig; + + const reset = hasFlag(flags, 'reset'); + const watch = hasFlag(flags, 'watch'); + const optimized = hasFlag(flags, 'optimized'); + const globals: Parameters[0] = { + ...managerGlobalsDefinitions, + ...previewGlobalsDefinitions, + }; + + if (reset) { + await fs.emptyDir(join(process.cwd(), 'dist')); + } + + if (pre) { + await exec(`node -r ${__dirname}/../node_modules/esbuild-register/register.js ${pre}`, { cwd }); + } + + const tasks: Promise[] = []; + + const outDir = join(process.cwd(), 'dist'); + const externals = [ + name, + ...extraExternals, + ...Object.keys(dependencies || {}), + ...Object.keys(peerDependencies || {}), + ]; + + if (interfaceEntries.length > 0) { + const { dtsConfig, tsConfigExists } = await getDTSConfigs({ + entries: interfaceEntries, + }); + + tasks.push( + build({ + silent: true, + treeshake: true, + entry: interfaceEntries, + shims: false, + watch, + outDir, + format: ['esm'], + target: 'chrome100', + clean: false, + ...(optimized ? dtsConfig : {}), + platform: 'browser', + esbuildPlugins: [ + aliasPlugin({ + process: require.resolve('../node_modules/process/browser.js'), + util: require.resolve('../node_modules/util/util.js'), + assert: require.resolve('browser-assert'), + }), + globalExternals(globals), + ], + // noExternal: deps, + external: externals, + + esbuildOptions: (c) => { + /* eslint-disable no-param-reassign */ + c.conditions = ['module']; + c.platform = 'browser'; + Object.assign(c, getESBuildOptions(optimized)); + /* eslint-enable no-param-reassign */ + }, + }) + ); + tasks.push( + build({ + silent: true, + treeshake: true, + entry: interfaceEntries, + shims: false, + watch, + outDir, + format: ['cjs'], + target: 'node16', + clean: false, + ...(optimized ? dtsConfig : {}), + platform: 'node', + external: externals, + + esbuildOptions: (c) => { + /* eslint-disable no-param-reassign */ + c.conditions = ['module']; + c.platform = 'node'; + Object.assign(c, getESBuildOptions(optimized)); + /* eslint-enable no-param-reassign */ + }, + }) + ); + + if (tsConfigExists && !optimized) { + tasks.push(...interfaceEntries.map(generateDTSMapperFile)); + } + } + + if (managerEntries.length > 0) { + const allEntries = managerEntries.map((e: string) => slash(join(cwd, e))); + + tasks.push( + build({ + silent: true, + entry: allEntries, + treeshake: true, + watch, + outDir, + outExtension: () => ({ + js: '.js', + }), + format: ['esm'], + target: 'chrome100', + clean: false, + platform: 'browser', + esbuildPlugins: [ + aliasPlugin({ + process: require.resolve('../node_modules/process/browser.js'), + util: require.resolve('../node_modules/util/util.js'), + assert: require.resolve('browser-assert'), + }), + globalExternals(managerGlobalsDefinitions), + ], + external: externals, + + esbuildOptions: (c) => { + /* eslint-disable no-param-reassign */ + c.conditions = ['module']; + c.platform = 'browser'; + Object.assign(c, getESBuildOptions(optimized)); + /* eslint-enable no-param-reassign */ + }, + }) + ); + } + if (previewEntries.length > 0) { + const allEntries = previewEntries.map((e: string) => slash(join(cwd, e))); + + tasks.push( + build({ + silent: true, + entry: allEntries, + treeshake: true, + watch, + outDir, + outExtension: () => ({ + js: '.js', + }), + format: ['esm'], + target: 'chrome100', + clean: false, + platform: 'browser', + esbuildPlugins: [ + aliasPlugin({ + process: require.resolve('../node_modules/process/browser.js'), + util: require.resolve('../node_modules/util/util.js'), + assert: require.resolve('browser-assert'), + }), + globalExternals(previewGlobalsDefinitions), + ], + external: externals, + + esbuildOptions: (c) => { + /* eslint-disable no-param-reassign */ + c.conditions = ['module']; + c.platform = 'browser'; + Object.assign(c, getESBuildOptions(optimized)); + /* eslint-enable no-param-reassign */ + }, + }) + ); + } + + if (nodeEntries.length > 0) { + const allEntries = nodeEntries.map((e: string) => slash(join(cwd, e))); + + tasks.push( + build({ + silent: true, + entry: allEntries, + watch, + outDir, + format: ['cjs'], + target: 'node16', + clean: false, + platform: 'node', + esbuildPlugins: [ + aliasPlugin({ + process: require.resolve('../node_modules/process/browser.js'), + util: require.resolve('../node_modules/util/util.js'), + }), + ], + external: externals, + + esbuildOptions: (c) => { + /* eslint-disable no-param-reassign */ + c.platform = 'node'; + Object.assign(c, getESBuildOptions(optimized)); + /* eslint-enable no-param-reassign */ + }, + }) + ); + } + + await Promise.all(tasks); + + if (post) { + await exec( + `node -r ${__dirname}/../node_modules/esbuild-register/register.js ${post}`, + { cwd }, + { debug: true } + ); + } + + console.log('done'); +}; + +/* UTILS */ + +async function getDTSConfigs({ entries }: { entries: string[] }) { + const tsConfigPath = join(cwd, 'tsconfig.json'); + const tsConfigExists = await fs.pathExists(tsConfigPath); + + const dtsConfig: DtsConfigSection = { + tsconfig: tsConfigPath, + dts: { + entry: entries, + resolve: true, + }, + }; + + return { dtsConfig, tsConfigExists }; +} + +function getESBuildOptions(optimized: boolean) { + return { + logLevel: 'error', + legalComments: 'none', + minifyWhitespace: optimized, + minifyIdentifiers: false, + minifySyntax: optimized, + }; +} + +async function generateDTSMapperFile(file: string) { + const { name: entryName, dir } = path.parse(file); + + const pathName = join(process.cwd(), dir.replace('./src', 'dist'), `${entryName}.d.ts`); + const srcName = join(process.cwd(), file); + const rel = relative(dirname(pathName), dirname(srcName)).split(path.sep).join(path.posix.sep); + + await fs.ensureFile(pathName); + await fs.writeFile( + pathName, + dedent` + // dev-mode + export * from '${rel}/${entryName}'; + `, + { encoding: 'utf-8' } + ); +} + +const hasFlag = (flags: string[], name: string) => !!flags.find((s) => s.startsWith(`--${name}`)); + +/* SELF EXECUTION */ + +const flags = process.argv.slice(2); +const cwd = process.cwd(); + +run({ cwd, flags }).catch((err: unknown) => { + // We can't let the stack try to print, it crashes in a way that sets the exit code to 0. + // Seems to have something to do with running JSON.parse() on binary / base64 encoded sourcemaps + // in @cspotcode/source-map-support + if (err instanceof Error) { + console.error(err.stack); + } + process.exit(1); +}); diff --git a/scripts/prepare/tsc.ts b/scripts/prepare/tsc.ts index 242781a3584d..8e97a96b4907 100755 --- a/scripts/prepare/tsc.ts +++ b/scripts/prepare/tsc.ts @@ -39,7 +39,7 @@ const run = async ({ cwd, flags }: { cwd: string; flags: string[] }) => { { noEmit: false, outDir: join(process.cwd(), 'dist'), - target: ts.ScriptTarget.ES2020, + target: ts.ScriptTarget.ES2022, declaration: true, } ); @@ -54,7 +54,7 @@ const run = async ({ cwd, flags }: { cwd: string; flags: string[] }) => { } else { ts.createProgram({ rootNames: out.fileNames, - options: { ...compilerOptions, module: ts.ModuleKind.ES2020, declaration: false }, + options: { ...compilerOptions, module: ts.ModuleKind.ES2022, declaration: false }, }).emit(); const files = globSync(join(process.cwd(), 'dist', '*.js')); diff --git a/scripts/tsconfig.json b/scripts/tsconfig.json index 591055d2ab92..48a97f39e60f 100644 --- a/scripts/tsconfig.json +++ b/scripts/tsconfig.json @@ -6,7 +6,7 @@ "noImplicitAny": true, "jsx": "react", "moduleResolution": "Node", - "target": "ES2020", + "target": "ES2022", "module": "CommonJS", "skipLibCheck": false, "allowSyntheticDefaultImports": true, diff --git a/scripts/yarn.lock b/scripts/yarn.lock index 8c45344140b8..ae1a90ab8f23 100644 --- a/scripts/yarn.lock +++ b/scripts/yarn.lock @@ -1770,6 +1770,13 @@ __metadata: languageName: node linkType: hard +"@fal-works/esbuild-plugin-global-externals@npm:^2.1.2": + version: 2.1.2 + resolution: "@fal-works/esbuild-plugin-global-externals@npm:2.1.2" + checksum: 2c84a8e6121b00ac8e4eb2469ab8f188142db2f1927391758e5d0142cb684b7eb0fad0c9d6caf358616eb2a77af2c067e08b9ec8e05749b415fc4dd0ef96d0fe + languageName: node + linkType: hard + "@gitbeaker/core@npm:^21.7.0": version: 21.7.0 resolution: "@gitbeaker/core@npm:21.7.0" @@ -2924,6 +2931,7 @@ __metadata: "@babel/preset-typescript": ^7.21.0 "@babel/types": ^7.22.0 "@emotion/jest": ^11.10.5 + "@fal-works/esbuild-plugin-global-externals": ^2.1.2 "@google-cloud/bigquery": ^6.2.0 "@jest/globals": ^29.3.1 "@nx/workspace": 16.2.1 @@ -2963,6 +2971,7 @@ __metadata: babel-eslint: ^10.1.0 babel-loader: ^9.1.2 boxen: ^5.1.2 + browser-assert: ^1.2.1 chalk: ^4.1.0 codecov: ^3.8.1 commander: ^6.2.1 @@ -5244,6 +5253,13 @@ __metadata: languageName: node linkType: hard +"browser-assert@npm:^1.2.1": + version: 1.2.1 + resolution: "browser-assert@npm:1.2.1" + checksum: 902abf999f92c9c951fdb6d7352c09eea9a84706258699655f7e7906e42daa06a1ae286398a755872740e05a6a71c43c5d1a0c0431d67a8cdb66e5d859a3fc0c + languageName: node + linkType: hard + "browserslist@npm:^4.21.9": version: 4.21.9 resolution: "browserslist@npm:4.21.9"