Merge branch 'next' of github.com:storybookjs/storybook into revert-2…

…4832-revert-24676-experiment-addon-peer-dep
storybookjs · Nov 15, 2023 · 9b33681 · 9b33681
2 parents c5cddf6 + e559a1e
commit 9b33681
Show file tree

Hide file tree

Showing 166 changed files with 735 additions and 657 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -322,7 +322,7 @@ jobs:
           at: .
       - run:
           name: Starting Event Collector
-          command: yarn ts-node ./event-log-collector.ts
+          command: node --loader esbuild-register/loader -r esbuild-register ./event-log-collector.ts
           working_directory: scripts
           background: true
       - run:
@@ -334,7 +334,7 @@ jobs:
             TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task build)
             if [[ $TEMPLATE != bench/* ]]
             then
-              yarn ts-node ./event-log-checker build $TEMPLATE
+              node --loader esbuild-register/loader -r esbuild-register ./event-log-checker build $TEMPLATE
             fi
           working_directory: scripts
       - report-workflow-on-failure:
@@ -645,4 +645,3 @@ workflows:
       #     parallelism: 4
       #     requires:
       #       - create-sandboxes
-
diff --git a/code/.eslintrc.js b/code/.eslintrc.js
@@ -16,7 +16,7 @@ const uiPackages = fs
 
 module.exports = {
   root: true,
-  extends: [path.join(scriptPath, '.eslintrc.js')],
+  extends: [path.join(scriptPath, '.eslintrc.cjs')],
   parserOptions: {
     tsconfigRootDir: __dirname,
     project: ['./tsconfig.json'],

diff --git a/code/addons/a11y/package.json b/code/addons/a11y/package.json
@@ -48,8 +48,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "@storybook/addon-highlight": "workspace:*",

diff --git a/code/addons/actions/package.json b/code/addons/actions/package.json
@@ -59,8 +59,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "@storybook/global": "^5.0.0",

diff --git a/code/addons/backgrounds/package.json b/code/addons/backgrounds/package.json
@@ -48,8 +48,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "@storybook/global": "^5.0.0",

diff --git a/code/addons/controls/package.json b/code/addons/controls/package.json
@@ -47,8 +47,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "@storybook/blocks": "workspace:*",

diff --git a/code/addons/docs/package.json b/code/addons/docs/package.json
@@ -94,8 +94,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/bundle.ts"
   },
   "dependencies": {
     "@jest/transform": "^29.3.1",

diff --git a/code/addons/essentials/package.json b/code/addons/essentials/package.json
@@ -56,8 +56,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "@storybook/addon-actions": "workspace:*",

diff --git a/code/addons/gfm/package.json b/code/addons/gfm/package.json
@@ -40,8 +40,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "@storybook/node-logger": "workspace:*",

diff --git a/code/addons/highlight/package.json b/code/addons/highlight/package.json
@@ -44,8 +44,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "@storybook/global": "^5.0.0"

diff --git a/code/addons/interactions/package.json b/code/addons/interactions/package.json
@@ -44,8 +44,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "@storybook/global": "^5.0.0",

diff --git a/code/addons/jest/package.json b/code/addons/jest/package.json
@@ -49,8 +49,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "@storybook/global": "^5.0.0",

diff --git a/code/addons/links/package.json b/code/addons/links/package.json
@@ -59,8 +59,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "@storybook/csf": "^0.1.0",

diff --git a/code/addons/measure/package.json b/code/addons/measure/package.json
@@ -60,8 +60,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "@storybook/global": "^5.0.0",

diff --git a/code/addons/outline/package.json b/code/addons/outline/package.json
@@ -50,8 +50,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "@storybook/global": "^5.0.0",

diff --git a/code/addons/storyshots-core/package.json b/code/addons/storyshots-core/package.json
@@ -33,8 +33,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/tsc.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/tsc.ts"
   },
   "dependencies": {
     "@jest/transform": "^29.3.1",

diff --git a/code/addons/storyshots-puppeteer/package.json b/code/addons/storyshots-puppeteer/package.json
@@ -32,8 +32,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/tsc.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/tsc.ts"
   },
   "dependencies": {
     "@axe-core/puppeteer": "^4.2.0",

diff --git a/code/addons/storysource/package.json b/code/addons/storysource/package.json
@@ -43,8 +43,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "estraverse": "^5.2.0",

diff --git a/code/addons/themes/package.json b/code/addons/themes/package.json
@@ -49,8 +49,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "ts-dedent": "^2.0.0"

diff --git a/code/addons/toolbars/package.json b/code/addons/toolbars/package.json
@@ -47,8 +47,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "devDependencies": {
     "@storybook/client-logger": "workspace:*",

diff --git a/code/addons/viewport/package.json b/code/addons/viewport/package.json
@@ -45,8 +45,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/addon-bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
     "memoizerific": "^1.11.3"

diff --git a/code/addons/viewport/src/defaults.ts b/code/addons/viewport/src/defaults.ts
@@ -89,6 +89,62 @@ export const INITIAL_VIEWPORTS: ViewportMap = {
     },
     type: 'mobile',
   },
+  iphoneSE3: {
+    name: 'iPhone SE 3rd generation',
+    styles: {
+      height: '667px',
+      width: '375px',
+    },
+    type: 'mobile',
+  },
+  iphone13: {
+    name: 'iPhone 13',
+    styles: {
+      height: '844px',
+      width: '390px',
+    },
+    type: 'mobile',
+  },
+  iphone13pro: {
+    name: 'iPhone 13 Pro',
+    styles: {
+      height: '844px',
+      width: '390px',
+    },
+    type: 'mobile',
+  },
+  iphone13promax: {
+    name: 'iPhone 13 Pro Max',
+    styles: {
+      height: '926px',
+      width: '428px',
+    },
+    type: 'mobile',
+  },
+  iphone14: {
+    name: 'iPhone 14',
+    styles: {
+      height: '844px',
+      width: '390px',
+    },
+    type: 'mobile',
+  },
+  iphone14pro: {
+    name: 'iPhone 14 Pro',
+    styles: {
+      height: '852px',
+      width: '393px',
+    },
+    type: 'mobile',
+  },
+  iphone14promax: {
+    name: 'iPhone 14 Pro Max',
+    styles: {
+      height: '932px',
+      width: '430px',
+    },
+    type: 'mobile',
+  },
   ipad: {
     name: 'iPad',
     styles: {
@@ -105,6 +161,14 @@ export const INITIAL_VIEWPORTS: ViewportMap = {
     },
     type: 'tablet',
   },
+  ipad11p: {
+    name: 'iPad Pro 11-in',
+    styles: {
+      height: '1194px',
+      width: '834px',
+    },
+    type: 'tablet',
+  },
   ipad12p: {
     name: 'iPad Pro 12.9-in',
     styles: {

diff --git a/code/builders/builder-manager/package.json b/code/builders/builder-manager/package.json
@@ -40,8 +40,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/bundle.ts"
   },
   "dependencies": {
     "@fal-works/esbuild-plugin-global-externals": "^2.1.2",

diff --git a/code/builders/builder-vite/package.json b/code/builders/builder-vite/package.json
@@ -39,8 +39,8 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "../../../scripts/prepare/check.ts",
-    "prep": "../../../scripts/prepare/bundle.ts"
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/bundle.ts"
   },
   "dependencies": {
     "@storybook/channels": "workspace:*",

diff --git a/code/builders/builder-vite/src/list-stories.ts b/code/builders/builder-vite/src/list-stories.ts
@@ -9,21 +9,27 @@ export async function listStories(options: Options) {
   const { normalizePath } = await import('vite');
 
   return (
-    await Promise.all(
-      normalizeStories(await options.presets.apply('stories', [], options), {
-        configDir: options.configDir,
-        workingDir: options.configDir,
-      }).map(({ directory, files }) => {
-        const pattern = path.join(directory, files);
-        const absolutePattern = path.isAbsolute(pattern)
-          ? pattern
-          : path.join(options.configDir, pattern);
+    (
+      await Promise.all(
+        normalizeStories(await options.presets.apply('stories', [], options), {
+          configDir: options.configDir,
+          workingDir: options.configDir,
+        }).map(({ directory, files }) => {
+          const pattern = path.join(directory, files);
+          const absolutePattern = path.isAbsolute(pattern)
+            ? pattern
+            : path.join(options.configDir, pattern);
 
-        return glob(slash(absolutePattern), {
-          ...commonGlobOptions(absolutePattern),
-          follow: true,
-        });
-      })
+          return glob(slash(absolutePattern), {
+            ...commonGlobOptions(absolutePattern),
+            follow: true,
+          });
+        })
+      )
     )
-  ).reduce((carry, stories) => carry.concat(stories.map(normalizePath)), []);
+      .reduce((carry, stories) => carry.concat(stories.map(normalizePath)), [])
+      // Sort stories to prevent a non-deterministic build. The result of Glob is not sorted an may differ
+      // for each invocation. This results in a different bundle file hashes from one build to the next.
+      .sort()
+  );
 }
diff --git a/code/builders/builder-vite/src/transform-iframe-html.ts b/code/builders/builder-vite/src/transform-iframe-html.ts
@@ -22,7 +22,7 @@ export async function transformIframeHtml(html: string, options: Options) {
   }));
 
   const otherGlobals = {
-    ...(build?.test?.emptyBlocks ? { __STORYBOOK_BLOCKS_EMPTY_MODULE__: {} } : {}),
+    ...(build?.test?.disableBlocks ? { __STORYBOOK_BLOCKS_EMPTY_MODULE__: {} } : {}),
   };
 
   return html