diff --git a/.circleci/config.yml b/.circleci/config.yml index 2cc4eda78dc1..965667ecc0b3 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -1172,7 +1172,7 @@ workflows: requires: - build - create-sandboxes: - parallelism: 38 + parallelism: 39 requires: - build - check-sandboxes: @@ -1180,7 +1180,7 @@ workflows: requires: - create-sandboxes - chromatic-sandboxes: - parallelism: 35 + parallelism: 36 requires: - create-sandboxes - e2e-production: @@ -1192,7 +1192,7 @@ workflows: requires: - create-sandboxes - test-runner-production: - parallelism: 33 + parallelism: 34 requires: - create-sandboxes - vitest-integration: @@ -1286,11 +1286,11 @@ workflows: requires: - unit-tests - create-sandboxes: - parallelism: 21 + parallelism: 22 requires: - build - chromatic-sandboxes: - parallelism: 18 + parallelism: 19 requires: - create-sandboxes - e2e-production: @@ -1302,7 +1302,7 @@ workflows: requires: - create-sandboxes - test-runner-production: - parallelism: 16 + parallelism: 17 requires: - create-sandboxes - vitest-integration: diff --git a/.circleci/src/workflows/daily.yml b/.circleci/src/workflows/daily.yml index 7f02e5d6117e..e16835808ae4 100644 --- a/.circleci/src/workflows/daily.yml +++ b/.circleci/src/workflows/daily.yml @@ -31,7 +31,7 @@ jobs: requires: - build - create-sandboxes: - parallelism: 38 + parallelism: 39 requires: - build - check-sandboxes: @@ -42,7 +42,7 @@ jobs: # requires: # - create-sandboxes - chromatic-sandboxes: - parallelism: 35 + parallelism: 36 requires: - create-sandboxes - e2e-production: @@ -54,7 +54,7 @@ jobs: requires: - create-sandboxes - test-runner-production: - parallelism: 33 + parallelism: 34 requires: - create-sandboxes - vitest-integration: diff --git a/.circleci/src/workflows/merged.yml b/.circleci/src/workflows/merged.yml index b0ae80bb63ea..cf0078883d76 100644 --- a/.circleci/src/workflows/merged.yml +++ b/.circleci/src/workflows/merged.yml @@ -34,11 +34,11 @@ jobs: requires: - unit-tests - create-sandboxes: - parallelism: 21 + parallelism: 22 requires: - build - chromatic-sandboxes: - parallelism: 18 + parallelism: 19 requires: - create-sandboxes - e2e-production: @@ -50,7 +50,7 @@ jobs: requires: - create-sandboxes - test-runner-production: - parallelism: 16 + parallelism: 17 requires: - create-sandboxes - vitest-integration: diff --git a/CHANGELOG.md b/CHANGELOG.md index 353282e47845..689a89960bc8 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,9 @@ +## 10.1.1 + +- Core: Improve globbing using dynamic CWD (REVERT) - [#33201](https://github.com/storybookjs/storybook/pull/33201), thanks @ndelangen! +- Solid: Add Solid to the list of supported frameworks for addon-vitest - [#33084](https://github.com/storybookjs/storybook/pull/33084), thanks @valentinpalkovic! +- UI: Fix excessive height in TabbedArgsTable - [#33205](https://github.com/storybookjs/storybook/pull/33205), thanks @Sidnioulz! + ## 10.1.0 > _Easier to setup, more accessible to use_ diff --git a/code/addons/docs/src/blocks/components/ArgsTable/TabbedArgsTable.stories.tsx b/code/addons/docs/src/blocks/components/ArgsTable/TabbedArgsTable.stories.tsx index e8b97cb78520..2b8fb49dc55d 100644 --- a/code/addons/docs/src/blocks/components/ArgsTable/TabbedArgsTable.stories.tsx +++ b/code/addons/docs/src/blocks/components/ArgsTable/TabbedArgsTable.stories.tsx @@ -1,11 +1,20 @@ +import { TabsView } from 'storybook/internal/components'; + +import type { Meta, StoryObj } from '@storybook/react-vite'; + +import { ArgsTable } from './ArgsTable'; import { Compact, Normal, Sections } from './ArgsTable.stories'; import { TabbedArgsTable } from './TabbedArgsTable'; -export default { +const meta = { component: TabbedArgsTable, -}; + tags: ['autodocs'], + subcomponents: { TabbedArgsTable: TabbedArgsTable, ArgsTable, TabsView }, +} satisfies Meta; + +export default meta; -export const Tabs = { +export const Tabs: StoryObj = { args: { tabs: { Normal: Normal.args, @@ -15,7 +24,7 @@ export const Tabs = { }, }; -export const TabsInAddonPanel = { +export const TabsInAddonPanel: StoryObj = { args: { tabs: { Normal: Normal.args, @@ -26,8 +35,25 @@ export const TabsInAddonPanel = { }, }; -export const Empty = { +export const Empty: StoryObj = { args: { tabs: {}, }, }; + +export const WithContentAround: StoryObj = { + args: { + tabs: { + Normal: Normal.args, + Compact: Compact.args, + Sections: Sections.args, + }, + }, + render: (args) => ( + <> +

This is some content above the TabbedArgsTable.

+ +

This is some content below the TabbedArgsTable.

+ + ), +}; diff --git a/code/addons/docs/src/blocks/components/ArgsTable/TabbedArgsTable.tsx b/code/addons/docs/src/blocks/components/ArgsTable/TabbedArgsTable.tsx index dc0f6c6945e2..3fdc43484256 100644 --- a/code/addons/docs/src/blocks/components/ArgsTable/TabbedArgsTable.tsx +++ b/code/addons/docs/src/blocks/components/ArgsTable/TabbedArgsTable.tsx @@ -3,6 +3,8 @@ import React from 'react'; import { TabsView } from 'storybook/internal/components'; +import { styled } from 'storybook/theming'; + import type { ArgsTableProps } from './ArgsTable'; import { ArgsTable } from './ArgsTable'; @@ -12,6 +14,10 @@ export type TabbedArgsTableProps = DistributiveOmit & { tabs: Record; }; +const StyledTabsView = styled(TabsView)({ + height: 'fit-content', +}); + export const TabbedArgsTable: FC = ({ tabs, ...props }) => { const entries = Object.entries(tabs); @@ -34,5 +40,5 @@ export const TabbedArgsTable: FC = ({ tabs, ...props }) => }, })); - return ; + return ; }; diff --git a/code/core/src/cli/AddonVitestService.constants.ts b/code/core/src/cli/AddonVitestService.constants.ts index 238890792c99..9e5accff34f2 100644 --- a/code/core/src/cli/AddonVitestService.constants.ts +++ b/code/core/src/cli/AddonVitestService.constants.ts @@ -6,6 +6,7 @@ export const SUPPORTED_FRAMEWORKS: readonly SupportedFramework[] = [ SupportedFramework.PREACT_VITE, SupportedFramework.REACT_NATIVE_WEB_VITE, SupportedFramework.REACT_VITE, + SupportedFramework.SOLID, SupportedFramework.SVELTE_VITE, SupportedFramework.SVELTEKIT, SupportedFramework.VUE3_VITE, diff --git a/code/core/src/cli/dirs.ts b/code/core/src/cli/dirs.ts index f4b48ce76291..80fb96fedcd4 100644 --- a/code/core/src/cli/dirs.ts +++ b/code/core/src/cli/dirs.ts @@ -4,9 +4,15 @@ import { pipeline } from 'node:stream/promises'; import type { ReadableStream } from 'node:stream/web'; import { createGunzip } from 'node:zlib'; -import { temporaryDirectory, versions } from 'storybook/internal/common'; +import { + frameworkPackages, + rendererPackages, + temporaryDirectory, + versions, +} from 'storybook/internal/common'; import type { JsPackageManager } from 'storybook/internal/common'; -import { SupportedFramework, type SupportedRenderer } from 'storybook/internal/types'; +import type { SupportedFramework } from 'storybook/internal/types'; +import { type SupportedRenderer } from 'storybook/internal/types'; import getNpmTarballUrlDefault from 'get-npm-tarball-url'; import { unpackTar } from 'modern-tar/fs'; @@ -14,29 +20,6 @@ import invariant from 'tiny-invariant'; import { resolvePackageDir } from '../shared/utils/module'; -type ExternalFramework = { - name: SupportedFramework; - packageName?: string; - frameworks?: string[]; - renderer?: string; -}; - -const externalFrameworks: ExternalFramework[] = [ - { name: SupportedFramework.QWIK, packageName: 'storybook-framework-qwik' }, - { - name: SupportedFramework.SOLID, - packageName: 'storybook-solidjs-vite', - frameworks: ['storybook-solidjs-vite'], - renderer: 'storybook-solidjs-vite', - }, - { - name: SupportedFramework.NUXT, - packageName: '@storybook-vue/nuxt', - frameworks: ['@storybook-vue/nuxt'], - renderer: '@storybook/vue3', - }, -]; - const resolveUsingBranchInstall = async (packageManager: JsPackageManager, request: string) => { const tempDirectory = await temporaryDirectory(); const name = request as keyof typeof versions; @@ -71,23 +54,28 @@ export async function getRendererDir( packageManager: JsPackageManager, renderer: SupportedFramework | SupportedRenderer ) { - const externalFramework = externalFrameworks.find((framework) => framework.name === renderer); - const frameworkPackageName = - externalFramework?.packageName || externalFramework?.renderer || `@storybook/${renderer}`; + const [externalFramework] = + Object.entries({ ...frameworkPackages, ...rendererPackages }).find( + ([key, value]) => value === renderer + ) ?? []; + + if (!externalFramework) { + return null; + } - const packageJsonPath = join(frameworkPackageName, 'package.json'); + const packageJsonPath = join(externalFramework, 'package.json'); const errors: Error[] = []; try { - return resolvePackageDir(frameworkPackageName, process.cwd()); + return resolvePackageDir(externalFramework, process.cwd()); } catch (e) { invariant(e instanceof Error); errors.push(e); } try { - return await resolveUsingBranchInstall(packageManager, frameworkPackageName); + return await resolveUsingBranchInstall(packageManager, externalFramework); } catch (e) { invariant(e instanceof Error); errors.push(e); diff --git a/code/core/src/cli/helpers.ts b/code/core/src/cli/helpers.ts index 29d8c31a47d4..aecedea634f4 100644 --- a/code/core/src/cli/helpers.ts +++ b/code/core/src/cli/helpers.ts @@ -179,6 +179,11 @@ export async function copyTemplateFiles({ }; const templatePath = async () => { const baseDir = await getRendererDir(packageManager, templateLocation); + + if (!baseDir) { + return null; + } + const assetsDir = join(baseDir, 'template', 'cli'); const assetsLanguage = join(assetsDir, languageFolderMapping[language]); @@ -209,7 +214,11 @@ export async function copyTemplateFiles({ if (commonAssetsDir) { await cp(commonAssetsDir, destinationPath, { recursive: true, filter }); } - await cp(await templatePath(), destinationPath, { recursive: true, filter }); + const tmpPath = await templatePath(); + + if (tmpPath) { + await cp(tmpPath, destinationPath, { recursive: true, filter }); + } if (commonAssetsDir && features.has(Feature.DOCS)) { const rendererType = frameworkToRenderer[templateLocation] || 'react'; diff --git a/code/core/src/core-server/utils/StoryIndexGenerator.ts b/code/core/src/core-server/utils/StoryIndexGenerator.ts index 72ceb343de58..6cb2ae2ad8a6 100644 --- a/code/core/src/core-server/utils/StoryIndexGenerator.ts +++ b/code/core/src/core-server/utils/StoryIndexGenerator.ts @@ -161,19 +161,16 @@ export class StoryIndexGenerator { const pathToSubIndex = {} as SpecifierStoriesCache; - // Calculate a new CWD for each glob to handle paths that go above the workingDir. - const globCwd = slash(resolve(workingDir, specifier.directory)); - const globPattern = specifier.files; + const fullGlob = slash(join(specifier.directory, specifier.files)); // Dynamically import globby because it is a pure ESM module // eslint-disable-next-line depend/ban-dependencies const { globby } = await import('globby'); - // Execute globby within the new CWD to ensure `ignore` patterns work correctly. - const files = await globby(globPattern, { + const files = await globby(fullGlob, { absolute: true, - cwd: globCwd, - ...commonGlobOptions(globPattern), + cwd: workingDir, + ...commonGlobOptions(fullGlob), }); if (files.length === 0 && !ignoreWarnings) { diff --git a/code/lib/cli-storybook/src/sandbox-templates.ts b/code/lib/cli-storybook/src/sandbox-templates.ts index 3fa386712eed..0f1c2281a403 100644 --- a/code/lib/cli-storybook/src/sandbox-templates.ts +++ b/code/lib/cli-storybook/src/sandbox-templates.ts @@ -247,8 +247,10 @@ export const baseTemplates = { }, 'nextjs/prerelease': { name: 'Next.js Prerelease (Webpack | TypeScript)', + // TODO: use @canary once the issue with NPM is fixed. + // Nextjs 16.1.0-canary.5 is a bad release. script: - 'npx create-next-app@canary {{beforeDir}} --eslint --tailwind --app --import-alias="@/*" --src-dir', + 'npx create-next-app@16.1.0-canary.4 {{beforeDir}} --eslint --tailwind --app --import-alias="@/*" --src-dir', expected: { framework: '@storybook/nextjs', renderer: '@storybook/react', @@ -502,25 +504,15 @@ export const baseTemplates = { }, skipTasks: ['e2e-tests', 'e2e-tests-dev', 'bench', 'vitest-integration'], }, - 'solid-vite/default-js': { - name: 'SolidJS Latest (Vite | JavaScript)', - script: 'npx degit solidjs/templates/js {{beforeDir}}', - expected: { - framework: 'storybook-solidjs-vite', - renderer: 'storybook-solidjs-vite', - builder: '@storybook/builder-vite', - }, - skipTasks: ['e2e-tests', 'bench', 'vitest-integration'], - }, 'solid-vite/default-ts': { name: 'SolidJS Latest (Vite | TypeScript)', - script: 'npx degit solidjs/templates/ts {{beforeDir}}', + script: 'yarn create solid {{beforeDir}} --vanilla --ts --template=with-vitest', expected: { framework: 'storybook-solidjs-vite', renderer: 'storybook-solidjs-vite', builder: '@storybook/builder-vite', }, - skipTasks: ['e2e-tests', 'bench'], + skipTasks: ['e2e-tests', 'e2e-tests-dev', 'bench', 'vitest-integration'], }, 'vue3-vite/default-js': { name: 'Vue v3 (Vite | JavaScript)', @@ -639,9 +631,7 @@ export const baseTemplates = { script: 'npx -p @angular/cli@next ng new angular-v16 --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn --ssr', modifications: { - // Angular 21 has introduced a peer dependency requirement on standard-schema via @angular/forms` - // TODO: use @angular/forms@next as soon as @angular/cli@next points to the same version - extraDependencies: ['@standard-schema/spec@^1', '@angular/forms@^21.0.0'], + extraDependencies: ['@standard-schema/spec@^1', '@angular/forms@next'], }, expected: { framework: '@storybook/angular', @@ -1020,6 +1010,7 @@ export const merged: TemplateKey[] = [ 'nextjs-vite/15-ts', 'preact-vite/default-ts', 'html-vite/default-ts', + 'solid-vite/default-ts', 'vue3-rsbuild/default-ts', ]; diff --git a/code/lib/create-storybook/src/generators/SOLID/index.ts b/code/lib/create-storybook/src/generators/SOLID/index.ts index a91eae9d2893..44c95ff08134 100644 --- a/code/lib/create-storybook/src/generators/SOLID/index.ts +++ b/code/lib/create-storybook/src/generators/SOLID/index.ts @@ -12,7 +12,7 @@ export default defineGeneratorModule({ }, configure: async () => { return { - addComponents: false, + addComponents: true, }; }, }); diff --git a/code/lib/create-storybook/src/generators/baseGenerator.ts b/code/lib/create-storybook/src/generators/baseGenerator.ts index ce681f875f59..66c3a738a7f1 100644 --- a/code/lib/create-storybook/src/generators/baseGenerator.ts +++ b/code/lib/create-storybook/src/generators/baseGenerator.ts @@ -116,6 +116,7 @@ const hasFrameworkTemplates = (framework?: string) => { SupportedFramework.REACT_VITE, SupportedFramework.REACT_WEBPACK5, SupportedFramework.SERVER_WEBPACK5, + SupportedFramework.SOLID, SupportedFramework.SVELTE_VITE, SupportedFramework.SVELTEKIT, SupportedFramework.VUE3_VITE, diff --git a/code/package.json b/code/package.json index dc97774e690d..5d9e74e5038f 100644 --- a/code/package.json +++ b/code/package.json @@ -286,5 +286,6 @@ "Dependency Upgrades" ] ] - } + }, + "deferredNextVersion": "10.1.1" } diff --git a/code/sandbox/solid-vite-default-js/project.json b/code/sandbox/solid-vite-default-js/project.json deleted file mode 100644 index d153483bb96d..000000000000 --- a/code/sandbox/solid-vite-default-js/project.json +++ /dev/null @@ -1,12 +0,0 @@ -{ - "name": "solid-vite/default-js", - "$schema": "../../node_modules/nx/schemas/project-schema.json", - "projectType": "application", - "implicitDependencies": ["core", "addon-links", "addon-onboarding"], - "targets": { - "sandbox": {}, - "sb:dev": {}, - "sb:build": {} - }, - "tags": [] -} diff --git a/docs/versions/latest.json b/docs/versions/latest.json index 6ab139c9a777..c3cd3087b0a1 100644 --- a/docs/versions/latest.json +++ b/docs/versions/latest.json @@ -1 +1 @@ -{"version":"10.1.0","info":{"plain":""}} \ No newline at end of file +{"version":"10.1.1","info":{"plain":"- Core: Improve globbing using dynamic CWD (REVERT) - [#33201](https://github.com/storybookjs/storybook/pull/33201), thanks @ndelangen!\n- Solid: Add Solid to the list of supported frameworks for addon-vitest - [#33084](https://github.com/storybookjs/storybook/pull/33084), thanks @valentinpalkovic!\n- UI: Fix excessive height in TabbedArgsTable - [#33205](https://github.com/storybookjs/storybook/pull/33205), thanks @Sidnioulz!"}} \ No newline at end of file diff --git a/docs/versions/next.json b/docs/versions/next.json index 696ce4ddcd88..cefcff7e9a98 100644 --- a/docs/versions/next.json +++ b/docs/versions/next.json @@ -1 +1 @@ -{"version":"10.1.0-beta.6","info":{"plain":"- Angular: Don't kill dev command by using observables - [#33185](https://github.com/storybookjs/storybook/pull/33185), thanks @valentinpalkovic!\n- Angular: Replace deprecated import of ApplicationConfig - [#33125](https://github.com/storybookjs/storybook/pull/33125), thanks @EtiennePasteur!\n- CLI: Fix passing flags for bun users during init - [#33166](https://github.com/storybookjs/storybook/pull/33166), thanks @valentinpalkovic!\n- CLI: Minor improvements - [#33180](https://github.com/storybookjs/storybook/pull/33180), thanks @valentinpalkovic!\n- CLI: Update upgrade message - [#33182](https://github.com/storybookjs/storybook/pull/33182), thanks @yannbf!"}} \ No newline at end of file +{"version":"10.2.0-alpha.1","info":{"plain":"- Core: Improve globbing using dynamic CWD (REVERT) - [#33201](https://github.com/storybookjs/storybook/pull/33201), thanks @ndelangen!"}} \ No newline at end of file