Release: Prerelease 10.1.0-alpha.3

.github/workflows/cron-weekly.yml

@@ -6,6 +6,7 @@ on:
 
 jobs:
   check-links:
+    if: github.repository_owner == 'storybookjs'
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4

.github/workflows/fork-checks.yml

@@ -0,0 +1,69 @@
+name: Fork checks
+
+# This workflow is only for forks, so they can get basic checks in without a CircleCI API key
+on:
+  push:
+
+env:
+  NODE_OPTIONS: '--max_old_space_size=4096'
+
+jobs:
+  check:
+    name: Core Type Checking
+    if: github.repository_owner != 'storybookjs'
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 2
+
+      - name: Setup Node.js and Install Dependencies
+        uses: ./.github/actions/setup-node-and-install
+        with:
+          install-code-deps: true
+
+      - name: check
+        run: yarn task --task check
+
+  prettier:
+    name: Core Formatting
+    if: github.repository_owner != 'storybookjs'
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 2
+
+      - name: Setup Node.js and Install Dependencies
+        uses: ./.github/actions/setup-node-and-install
+        with:
+          install-code-deps: true
+
+      - name: prettier
+        run: cd code && yarn lint:prettier --check .
+
+  test:
+    strategy:
+      matrix:
+        os: [windows-latest, ubuntu-latest]
+    runs-on: ${{ matrix.os }}
+    name: Core Unit Tests, ${{ matrix.os }}
+    if: github.repository_owner != 'storybookjs'
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 2
+
+      - name: Setup Node.js and Install Dependencies
+        uses: ./.github/actions/setup-node-and-install
+        with:
+          install-code-deps: true
+
+      - name: compile
+        run: yarn task --task compile --start-from=compile
+
+      - name: Install Playwright Dependencies
+        run: cd code && yarn exec playwright install chromium --with-deps
+
+      - name: test
+        run: yarn test

.github/workflows/generate-sandboxes.yml

@@ -24,6 +24,7 @@ defaults:
 jobs:
   generate-next:
     name: Generate to next
+    if: github.repository_owner == 'storybookjs'
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
@@ -76,6 +77,7 @@ jobs:
 
   generate-main:
     name: Generate to main
+    if: github.repository_owner == 'storybookjs'
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4

.github/workflows/handle-release-branches.yml

@@ -5,6 +5,7 @@ on:
 
 jobs:
   branch-checks:
+    if: github.repository_owner == 'storybookjs'
     runs-on: ubuntu-latest
     steps:
       - id: get-branch
@@ -68,7 +69,7 @@ jobs:
       branch: ${{ needs.get-next-release-branch.outputs.branch }}
 
   next-release-branch-check:
-    if: ${{ always() }}
+    if: ${{ always() && github.repository_owner == 'storybookjs' }}
     needs: [branch-checks, get-next-release-branch]
     runs-on: ubuntu-latest
     steps:
@@ -87,7 +88,7 @@ jobs:
       check: ${{ env.is-next-release-branch }}
 
   request-create-frontpage-branch:
-    if: ${{ always() }}
+    if: ${{ always() && github.repository_owner == 'storybookjs' }}
     needs:
       [branch-checks, next-release-branch-check, create-next-release-branch]
     runs-on: ubuntu-latest

.github/workflows/prepare-non-patch-release.yml

@@ -36,6 +36,7 @@ concurrency:
 jobs:
   prepare-non-patch-pull-request:
     name: Prepare non-patch pull request
+    if: github.repository_owner == 'storybookjs'
     runs-on: ubuntu-latest
     environment: Release
     defaults:

.github/workflows/prepare-patch-release.yml

@@ -18,6 +18,7 @@ concurrency:
 jobs:
   prepare-patch-pull-request:
     name: Prepare patch pull request
+    if: github.repository_owner == 'storybookjs'
     runs-on: ubuntu-latest
     environment: Release
     defaults:

.github/workflows/publish.yml

@@ -39,6 +39,7 @@ jobs:
     name: Publish normal version
     runs-on: ubuntu-latest
     if: |
+      github.repository_owner == 'storybookjs' &&
       github.event_name == 'push' &&
       (github.ref_name == 'latest-release' || github.ref_name == 'next-release') &&
       contains(github.event.head_commit.message, '[skip ci]') != true
@@ -221,6 +222,7 @@ jobs:
     name: Publish canary version
     runs-on: ubuntu-latest
     if: |
+      github.repository_owner == 'storybookjs' &&
       (
         github.event_name == 'workflow_dispatch' ||
         (github.event_name == 'pull_request' && endsWith(github.head_ref, 'with-canary-release'))

.github/workflows/stale.yml

@@ -6,6 +6,7 @@ on:
 jobs:
   stale:
     runs-on: ubuntu-latest
+    if: github.repository_owner == 'storybookjs'
     steps:
       - uses: actions/stale@v9
         with:

.github/workflows/tests-unit.yml

@@ -8,11 +8,12 @@ on:
     types: [opened, synchronize, reopened]
 
 env:
-  NODE_OPTIONS: "--max_old_space_size=4096"
+  NODE_OPTIONS: '--max_old_space_size=4096'
 
 jobs:
   build:
     name: Core Unit Tests, windows-latest
+    if: github.repository_owner == 'storybookjs'
     runs-on: windows-11-arm
     steps:
       - uses: actions/checkout@v4

.github/workflows/triage.yml

@@ -15,6 +15,7 @@ permissions:
 jobs:
   triage:
     name: Nissuer
+    if: github.repository_owner == 'storybookjs'
     runs-on: ubuntu-latest
     steps:
       - uses: balazsorban44/nissuer@1.10.0

.github/workflows/trigger-circle-ci-workflow.yml

@@ -16,6 +16,7 @@ concurrency:
 
 jobs:
   get-branch:
+    if: github.repository_owner == 'storybookjs'
     runs-on: ubuntu-latest
     steps:
       - id: get-branch
@@ -37,6 +38,7 @@ jobs:
       branch: ${{ env.branch }}
 
   get-parameters:
+    if: github.repository_owner == 'storybookjs'
     runs-on: ubuntu-latest
     steps:
       - if: github.event_name == 'pull_request_target' && (contains(github.event.pull_request.labels.*.name, 'ci:normal'))
@@ -55,7 +57,7 @@ jobs:
   trigger-circle-ci-workflow:
     runs-on: ubuntu-latest
     needs: [get-branch, get-parameters]
-    if: needs.get-parameters.outputs.workflow != ''
+    if: github.repository_owner == 'storybookjs' && needs.get-parameters.outputs.workflow != ''
     steps:
       - name: Trigger Normal tests
         uses: fjogeleit/http-request-action@v1

CHANGELOG.prerelease.md

@@ -1,3 +1,7 @@
+## 10.1.0-alpha.3
+
+- React: Add manifests/components.html page - [#32905](https://github.com/storybookjs/storybook/pull/32905), thanks @kasperpeulen!
+
 ## 10.1.0-alpha.2
 
 - A11y: Add aria-selected attribute to tab buttons - [#32656](https://github.com/storybookjs/storybook/pull/32656), thanks @Nischit-Ekbote!

CONTRIBUTING.md

@@ -131,7 +131,9 @@ Here's a highlight of notable directories and files:
 
 ### Fork the repository 
 
-If you plan to contribute to Storybook's codebase, you should fork the repository to your GitHub account. This will allow you to make changes to the codebase and submit a pull request to the main repository when you're ready to contribute your changes. Once you've forked the repository, you should [disable Github Actions for your forked repository](https://docs.github.com/en/repositories/managing-your-repositorys-settings-and-features/enabling-features-for-your-repository/managing-github-actions-settings-for-a-repository) as most of them (e.g., pushing to sandbox) will fail without proper authorization. In your forked repository, go to Settings > Actions > General > set the Actions Permissions to **Disable actions**. Additionally, adding our codebase as upstream ensures you can rebase against the latest changes in the main repository. To do this, run the following commands:
+If you plan to contribute to Storybook's codebase, you should fork the repository to your GitHub account. This will allow you to make changes to the codebase and submit a pull request to the main repository when you're ready to contribute your changes.
+
+Additionally, adding our codebase as upstream ensures you can rebase against the latest changes in the main repository. To do this, run the following commands:
 
 ```shell
 git remote add upstream https://github.com/storybookjs/storybook.git

code/.prettierignore

@@ -7,4 +7,10 @@ bench
 /.nx/cache
 core/report
 
-/.nx/workspace-data
+/.nx/workspace-data
+
+# This file contains imports with an order that must be preserved.
+core/src/core-server/presets/common-manager.ts
+
+# This file is modified by build/check, causing errors when changed in CI jobs.
+lib/eslint-plugin/docs/rules/no-stories-of.md

code/core/package.json

@@ -314,6 +314,7 @@
     "react-textarea-autosize": "^8.3.0",
     "react-transition-group": "^4.4.5",
     "require-from-string": "^2.0.2",
+    "resolve": "^1.22.11",
     "resolve.exports": "^2.0.3",
     "sirv": "^2.0.4",
     "slash": "^5.0.0",

code/core/src/common/index.ts

@@ -45,6 +45,7 @@ export * from './js-package-manager';
 export * from './utils/scan-and-transform-files';
 export * from './utils/transform-imports';
 export * from '../shared/utils/module';
+export * from './utils/utils';
 
 export { versions };
 

code/core/src/common/utils/interpret-files.ts

@@ -1,18 +1,58 @@
 import { existsSync } from 'node:fs';
+import { extname } from 'node:path';
+
+import resolve from 'resolve';
 
 export const supportedExtensions = [
   '.js',
-  '.mjs',
-  '.cjs',
-  '.jsx',
   '.ts',
+  '.jsx',
+  '.tsx',
+  '.mjs',
   '.mts',
+  '.mtsx',
+  '.cjs',
   '.cts',
-  '.tsx',
+  '.ctsx',
 ] as const;
 
 export function getInterpretedFile(pathToFile: string) {
   return supportedExtensions
     .map((ext) => (pathToFile.endsWith(ext) ? pathToFile : `${pathToFile}${ext}`))
     .find((candidate) => existsSync(candidate));
 }
+
+export function resolveImport(id: string, options: resolve.SyncOpts): string {
+  const mergedOptions: resolve.SyncOpts = {
+    extensions: supportedExtensions,
+    packageFilter(pkg) {
+      // Prefer 'module' over 'main' if available
+      if (pkg.module) {
+        pkg.main = pkg.module;
+      }
+      return pkg;
+    },
+    ...options,
+  };
+
+  try {
+    return resolve.sync(id, { ...mergedOptions });
+  } catch (error) {
+    const ext = extname(id);
+
+    // if we try to import a JavaScript file it might be that we are actually pointing to
+    // a TypeScript file. This can happen in ES modules as TypeScript requires to import other
+    // TypeScript files with .js extensions
+    // https://www.typescriptlang.org/docs/handbook/esm-node.html#type-in-packagejson-and-new-extensions
+    const newId = ['.js', '.mjs', '.cjs'].includes(ext)
+      ? `${id.slice(0, -2)}ts`
+      : ext === '.jsx'
+        ? `${id.slice(0, -3)}tsx`
+        : null;
+
+    if (!newId) {
+      throw error;
+    }
+    return resolve.sync(newId, { ...mergedOptions, extensions: [] });
+  }
+}

code/core/src/common/utils/utils.ts

@@ -0,0 +1,26 @@
+// Object.groupBy polyfill
+export const groupBy = <K extends PropertyKey, T>(
+  items: T[],
+  keySelector: (item: T, index: number) => K
+) => {
+  return items.reduce<Record<K, T[]>>(
+    (acc, item, index) => {
+      const key = keySelector(item, index);
+      acc[key] ??= [];
+      acc[key].push(item);
+      return acc;
+    },
+    {} as Record<K, T[]>
+  );
+};
+
+// This invariant allows for lazy evaluation of the message, which we need to avoid excessive computation.
+export function invariant(
+  condition: unknown,
+  message?: string | (() => string)
+): asserts condition {
+  if (condition) {
+    return;
+  }
+  throw new Error((typeof message === 'function' ? message() : message) ?? 'Invariant failed');
+}

code/core/src/core-server/build-static.ts

@@ -11,14 +11,15 @@ import {
 import { logger } from 'storybook/internal/node-logger';
 import { getPrecedingUpgrade, telemetry } from 'storybook/internal/telemetry';
 import type { BuilderOptions, CLIOptions, LoadOptions, Options } from 'storybook/internal/types';
-import { type ComponentManifestGenerator } from 'storybook/internal/types';
+import { type ComponentManifestGenerator, type ComponentsManifest } from 'storybook/internal/types';
 
 import { global } from '@storybook/global';
 
 import { join, relative, resolve } from 'pathe';
 import picocolors from 'picocolors';
 
 import { resolvePackageDir } from '../shared/utils/module';
+import { renderManifestComponentsPage } from './manifest';
 import { StoryIndexGenerator } from './utils/StoryIndexGenerator';
 import { buildOrThrow } from './utils/build-or-throw';
 import { copyAllStaticFilesRelativeToMain } from './utils/copy-all-static-files';
@@ -180,6 +181,10 @@ export async function buildStaticStandalone(options: BuildStaticStandaloneOption
             join(options.outputDir, 'manifests', 'components.json'),
             JSON.stringify(manifests)
           );
+          await writeFile(
+            join(options.outputDir, 'manifests', 'components.html'),
+            renderManifestComponentsPage(manifests)
+          );
         } catch (e) {
           logger.error('Failed to generate manifests/components.json');
           logger.error(e instanceof Error ? e : String(e));