@storybook/cli 8.5.0-beta.9 → 8.6.0-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bin/index.cjs +45 -37
- package/dist/bin/index.js +36 -28
- package/package.json +4 -4
package/dist/bin/index.cjs
CHANGED
|
@@ -99,35 +99,43 @@ ${packageVersions.join(", ")}`),acc},{critical:[],trivial:[]});return critical.l
|
|
|
99
99
|
|
|
100
100
|
`));else{let list=installationMetadata?getDuplicatedDepsWarnings(installationMetadata):getDuplicatedDepsWarnings();Array.isArray(list)&&list.length>0&&logDiagnostic("Duplicated dependencies found",list?.join(`
|
|
101
101
|
`))}}let commandMessage=`You can always recheck the health of your project by running:
|
|
102
|
-
${import_picocolors5.default.cyan("npx storybook doctor")}`;logger2.info(),foundIssues?(logger2.info(commandMessage),logger2.info(),logger2.info(`Full logs are available in ${import_picocolors5.default.cyan(LOG_FILE_PATH)}`),await(0,import_promises.rename)(TEMP_LOG_FILE_PATH,(0,import_node_path3.join)(process.cwd(),LOG_FILE_NAME))):(logger2.info("\u{1F973} Your Storybook project looks good!"),logger2.info(commandMessage),await(0,import_promises.rm)(TEMP_LOG_FILE_PATH,{recursive:!0,force:!0})),logger2.info(),cleanup()};var import_common8=require("storybook/internal/common"),import_fs=require("fs"),jscodeshift=__toESM(require("jscodeshift"),1),import_path=__toESM(require("path"),1),import_picocolors6=__toESM(require_picocolors(),1),import_ts_dedent4=require("ts-dedent");var ADDON_ID="storybook/test",TEST_PROVIDER_ID=`${ADDON_ID}/test-provider`,PANEL_ID=`${ADDON_ID}/panel`;var DOCUMENTATION_LINK="writing-tests/test-addon",DOCUMENTATION_DISCREPANCY_LINK=`${DOCUMENTATION_LINK}#what-happens-when-there-are-different-test-results-in-multiple-environments`,DOCUMENTATION_FATAL_ERROR_LINK=`${DOCUMENTATION_LINK}#what-happens-if-vitest-itself-has-an-error`;var SUPPORTED_FRAMEWORKS=["@storybook/nextjs","@storybook/experimental-nextjs-vite","@storybook/sveltekit"],SUPPORTED_RENDERERS=["@storybook/react","@storybook/svelte","@storybook/vue3"];var
|
|
102
|
+
${import_picocolors5.default.cyan("npx storybook doctor")}`;logger2.info(),foundIssues?(logger2.info(commandMessage),logger2.info(),logger2.info(`Full logs are available in ${import_picocolors5.default.cyan(LOG_FILE_PATH)}`),await(0,import_promises.rename)(TEMP_LOG_FILE_PATH,(0,import_node_path3.join)(process.cwd(),LOG_FILE_NAME))):(logger2.info("\u{1F973} Your Storybook project looks good!"),logger2.info(commandMessage),await(0,import_promises.rm)(TEMP_LOG_FILE_PATH,{recursive:!0,force:!0})),logger2.info(),cleanup()};var import_common8=require("storybook/internal/common"),import_csf_tools3=require("storybook/internal/csf-tools"),import_fs=require("fs"),jscodeshift=__toESM(require("jscodeshift"),1),import_path=__toESM(require("path"),1),import_picocolors6=__toESM(require_picocolors(),1),import_ts_dedent4=require("ts-dedent");var ADDON_ID="storybook/test",TEST_PROVIDER_ID=`${ADDON_ID}/test-provider`,PANEL_ID=`${ADDON_ID}/panel`;var DOCUMENTATION_LINK="writing-tests/test-addon",DOCUMENTATION_DISCREPANCY_LINK=`${DOCUMENTATION_LINK}#what-happens-when-there-are-different-test-results-in-multiple-environments`,DOCUMENTATION_FATAL_ERROR_LINK=`${DOCUMENTATION_LINK}#what-happens-if-vitest-itself-has-an-error`;var SUPPORTED_FRAMEWORKS=["@storybook/nextjs","@storybook/experimental-nextjs-vite","@storybook/sveltekit"],SUPPORTED_RENDERERS=["@storybook/react","@storybook/svelte","@storybook/vue3"];var fileExtensions=[".js",".ts",".cts",".mts",".cjs",".mjs",".jsx",".tsx"],addonA11yAddonTest={id:"addonA11yAddonTest",versionRange:["<8.5.0",">=8.5.0"],promptType(result){return result.setupFile===null&&result.previewFile===null?"manual":"auto"},async check({mainConfig,configDir}){let addons=getAddonNames(mainConfig),frameworkPackageName=getFrameworkPackageName(mainConfig),rendererPackageName=getRendererName(mainConfig),hasA11yAddon=!!addons.find(addon=>addon.includes("@storybook/addon-a11y")),hasTestAddon=!!addons.find(addon=>addon.includes("@storybook/experimental-addon-test"));if(!SUPPORTED_FRAMEWORKS.find(framework=>frameworkPackageName?.includes(framework))&&!SUPPORTED_RENDERERS.find(renderer=>rendererPackageName?.includes(import_common8.rendererPackages[renderer]))||!hasA11yAddon||!hasTestAddon||!configDir)return null;let vitestSetupFile=fileExtensions.map(ext=>import_path.default.join(configDir,`vitest.setup${ext}`)).find(filePath=>(0,import_fs.existsSync)(filePath))??null,previewFile=fileExtensions.map(ext=>import_path.default.join(configDir,`preview${ext}`)).find(filePath=>(0,import_fs.existsSync)(filePath))??null,skipVitestSetupTransformation=!1,skipPreviewTransformation=!0;if(vitestSetupFile&&previewFile&&(skipVitestSetupTransformation=(0,import_fs.readFileSync)(vitestSetupFile,"utf8").includes("@storybook/addon-a11y"),skipVitestSetupTransformation&&skipPreviewTransformation))return null;let getTransformedSetupCode=()=>{if(!vitestSetupFile||skipVitestSetupTransformation)return null;try{let vitestSetupSource=(0,import_fs.readFileSync)(vitestSetupFile,"utf8");return transformSetupFile(vitestSetupSource)}catch{return null}},getTransformedPreviewCode=async()=>{if(!previewFile||skipPreviewTransformation)return null;try{let previewSetupSource=(0,import_fs.readFileSync)(previewFile,"utf8");return await transformPreviewFile(previewSetupSource,previewFile)}catch{return null}};return{setupFile:vitestSetupFile,previewFile,transformedSetupCode:getTransformedSetupCode(),transformedPreviewCode:await getTransformedPreviewCode(),skipVitestSetupTransformation,skipPreviewTransformation}},prompt({setupFile,previewFile,transformedSetupCode,transformedPreviewCode,skipPreviewTransformation,skipVitestSetupTransformation}){let prompt2=[import_ts_dedent4.dedent`
|
|
103
103
|
We have detected that you have ${import_picocolors6.default.magenta("@storybook/addon-a11y")} and ${import_picocolors6.default.magenta("@storybook/experimental-addon-test")} installed.
|
|
104
104
|
|
|
105
|
-
${import_picocolors6.default.magenta("@storybook/addon-a11y")} integrates
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
105
|
+
${import_picocolors6.default.magenta("@storybook/addon-a11y")} now integrates with ${import_picocolors6.default.magenta("@storybook/experimental-addon-test")} to provide automatic accessibility checks for your stories, powered by Axe and Vitest.
|
|
106
|
+
`],counter=1;if(!skipVitestSetupTransformation)if(transformedSetupCode===null)prompt2.push(import_ts_dedent4.dedent`
|
|
107
|
+
${counter++}) We couldn't find or automatically update ${import_picocolors6.default.cyan(".storybook/vitest.setup.<ts|js>")} in your project to smoothly set up project annotations from ${import_picocolors6.default.magenta("@storybook/addon-a11y")}.
|
|
108
|
+
Please manually update your ${import_picocolors6.default.cyan("vitest.setup.ts")} file to include the following:
|
|
109
|
+
|
|
110
|
+
${import_picocolors6.default.gray("...")}
|
|
111
|
+
${import_picocolors6.default.green('+ import * as a11yAddonAnnotations from "@storybook/addon-a11y/preview";')}
|
|
112
|
+
|
|
113
|
+
${import_picocolors6.default.gray("const annotations = setProjectAnnotations([")}
|
|
114
|
+
${import_picocolors6.default.gray(" ...")}
|
|
115
|
+
${import_picocolors6.default.green("+ a11yAddonAnnotations,")}
|
|
116
|
+
${import_picocolors6.default.gray("]);")}
|
|
117
|
+
|
|
118
|
+
${import_picocolors6.default.gray("beforeAll(annotations.beforeAll);")}
|
|
119
|
+
`);else{let fileExtensionSetupFile=import_path.default.extname(setupFile);prompt2.push(import_ts_dedent4.dedent`${counter++}) We have to update your ${import_picocolors6.default.cyan(`.storybook/vitest.setup${fileExtensionSetupFile}`)} file to set up project annotations from ${import_picocolors6.default.magenta("@storybook/addon-a11y")}.`)}if(!skipPreviewTransformation)if(transformedPreviewCode===null)prompt2.push(import_ts_dedent4.dedent`
|
|
120
|
+
${counter++}) We couldn't find or automatically update your ${import_picocolors6.default.cyan(".storybook/preview.<ts|js>")} in your project to smoothly set up tags from ${import_picocolors6.default.magenta("@storybook/addon-a11y")}.
|
|
121
|
+
Please manually update your ${import_picocolors6.default.cyan(".storybook/preview.<ts|js>")} file to include the following:
|
|
122
|
+
|
|
123
|
+
${import_picocolors6.default.gray("export default {")}
|
|
124
|
+
${import_picocolors6.default.gray("...")}
|
|
125
|
+
${import_picocolors6.default.green('+ tags: ["a11y-test"],')}
|
|
126
|
+
${import_picocolors6.default.gray("}")}
|
|
127
|
+
`);else{let fileExtensionPreviewFile=import_path.default.extname(previewFile);prompt2.push(import_ts_dedent4.dedent`
|
|
128
|
+
${counter++}) We have to update your ${import_picocolors6.default.cyan(`.storybook/preview${fileExtensionPreviewFile}`)} file to set up tags from ${import_picocolors6.default.magenta("@storybook/addon-a11y")}.
|
|
129
|
+
`)}return(transformedPreviewCode===null||transformedSetupCode===null)&&prompt2.push(import_ts_dedent4.dedent`
|
|
130
|
+
For more information, please refer to the accessibility addon documentation:
|
|
131
|
+
${import_picocolors6.default.cyan("https://storybook.js.org/docs/writing-tests/accessibility-testing#test-addon-integration")}
|
|
132
|
+
`),prompt2.join(`
|
|
133
|
+
|
|
134
|
+
`)},async run({result}){let{setupFile,transformedSetupCode,transformedPreviewCode,previewFile}=result;transformedSetupCode&&setupFile&&(0,import_fs.writeFileSync)(setupFile,transformedSetupCode,"utf8"),transformedPreviewCode&&previewFile&&(0,import_fs.writeFileSync)(previewFile,transformedPreviewCode,"utf8")}};function transformSetupFile(source){let j=jscodeshift.withParser("ts"),root=j(source),importDeclaration=j.importDeclaration([j.importNamespaceSpecifier(j.identifier("a11yAddonAnnotations"))],j.literal("@storybook/addon-a11y/preview")),setProjectAnnotationsCall=root.find(j.CallExpression,{callee:{type:"Identifier",name:"setProjectAnnotations"}});if(setProjectAnnotationsCall.length===0)throw new Error("Could not find setProjectAnnotations call in vitest.setup file");return setProjectAnnotationsCall.forEach(p=>{if(p.value.arguments.length===1&&p.value.arguments[0].type==="ArrayExpression")p.value.arguments[0].elements.unshift(j.identifier("a11yAddonAnnotations"));else if(p.value.arguments.length===1&&p.value.arguments[0].type==="Identifier"){let arg=p.value.arguments[0];p.value.arguments[0]=j.arrayExpression([j.identifier("a11yAddonAnnotations"),arg])}}),root.get().node.program.body.unshift(importDeclaration),root.toSource()}async function transformPreviewFile(source,filePath){let previewConfig=(0,import_csf_tools3.loadConfig)(source).parse(),tags=previewConfig.getFieldNode(["tags"]),tagsNode=previewConfig.getFieldNode(["tags"]),tagsValue=previewConfig.getFieldValue(["tags"])??[];if(tags&&tagsValue&&(tagsValue.includes("a11y-test")||tagsValue.includes("!a11y-test")))return source;if(tagsNode){let tagsElementsLength=tagsNode.elements.length,lastTagElement=tagsNode.elements[tagsElementsLength-1];lastTagElement&&(lastTagElement.comments=[{type:"CommentBlock",leading:!1,trailing:!0,value:', "a11y-test"'}],previewConfig.setFieldNode(["tags"],tagsNode))}else previewConfig.setFieldValue(["tags"],["a11y-test"]);let formattedPreviewConfig=(0,import_csf_tools3.formatConfig)(previewConfig),lines=formattedPreviewConfig.split(`
|
|
135
|
+
`),tagsLineIndex=lines.findIndex(line=>line.includes("tags: ["));if(tagsLineIndex===-1)return formattedPreviewConfig;lines[tagsLineIndex]=lines[tagsLineIndex].replace("['a11y-test']","[/*'a11y-test'*/]"),lines[tagsLineIndex]=lines[tagsLineIndex].replace('["a11y-test"]','[/*"a11y-test"*/]');let indentation=lines[tagsLineIndex]?.match(/^\s*/)?.[0],comment=`${indentation}// The \`a11y-test\` tag controls whether accessibility tests are run as part of a standalone Vitest test run
|
|
136
|
+
${indentation}// The tag and its behavior are experimental and subject to change.
|
|
137
|
+
${indentation}// For more information please see: https://storybook.js.org/docs/writing-tests/accessibility-testing#configure-accessibility-tests-with-the-test-addon`;return lines.splice(tagsLineIndex,0,comment),(0,import_common8.formatFileContent)(filePath,lines.join(`
|
|
138
|
+
`))}var import_picocolors7=__toESM(require_picocolors(),1),import_ts_dedent5=require("ts-dedent");var addonPostCSS={id:"addon-postcss",versionRange:["*","*"],promptType:"notification",async check({mainConfig}){return!getAddonNames(mainConfig).find(addon=>addon.includes("@storybook/addon-postcss"))?null:{hasAddonPostcss:!0}},prompt(){return import_ts_dedent5.dedent`
|
|
131
139
|
${import_picocolors7.default.bold("Attention")}: We've detected that you're using the following package which is incompatible with Storybook 8 and beyond:
|
|
132
140
|
|
|
133
141
|
- ${import_picocolors7.default.cyan("@storybook/addon-postcss")}
|
|
@@ -154,7 +162,7 @@ ${import_picocolors5.default.cyan("npx storybook doctor")}`;logger2.info(),found
|
|
|
154
162
|
In Storybook 6.4 we have deprecated calling Storybook directly (npm run storybook) for Angular. In Storybook 7.0, we've removed it entirely. Instead you have to set up the Storybook builder in your ${import_picocolors10.default.yellow("angular.json")} and execute ${import_picocolors10.default.yellow("ng run <your-project>:storybook")} to start Storybook.
|
|
155
163
|
|
|
156
164
|
❌ Your Angular workspace uses multiple projects defined in the ${import_picocolors10.default.yellow("angular.json")} file and we were not able to detect a root project. Therefore we are not able to automigrate to use Angular Storybook builder. Instead, please visit ${import_picocolors10.default.yellow("https://github.com/storybookjs/storybook/tree/next/code/frameworks/angular")} to do the migration manually.
|
|
157
|
-
`}};var
|
|
165
|
+
`}};var import_csf_tools4=require("storybook/internal/csf-tools"),import_picocolors11=__toESM(require_picocolors(),1),import_ts_dedent9=require("ts-dedent");var logger3=console,MIGRATION="https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#mainjs-docsautodocs-is-deprecated",autodocsTags={id:"autodocs-tags",versionRange:["*.*.*",">=8.0.*"],async check({mainConfig,mainConfigPath,previewConfigPath}){let autodocs=mainConfig?.docs?.autodocs;if(autodocs===void 0)return null;if(autodocs===!0&&!previewConfigPath)throw Error(import_ts_dedent9.dedent`
|
|
158
166
|
❌ Failed to remove the deprecated ${import_picocolors11.default.cyan("docs.autodocs")} setting from ${import_picocolors11.default.cyan(mainConfigPath)}.
|
|
159
167
|
|
|
160
168
|
There is no preview config file in which to add the ${import_picocolors11.default.cyan("autodocs")} tag.
|
|
@@ -171,7 +179,7 @@ ${import_picocolors5.default.cyan("npx storybook doctor")}`;logger2.info(),found
|
|
|
171
179
|
Learn more: ${import_picocolors11.default.yellow(MIGRATION)}
|
|
172
180
|
|
|
173
181
|
Remove ${import_picocolors11.default.cyan("docs.autodocs")}${trueMessage}?
|
|
174
|
-
`},async run({dryRun,mainConfigPath,result}){if(!dryRun){if(result.autodocs===!0){logger3.info(`\u2705 Adding "autodocs" tag to ${result.previewConfigPath}`);let previewConfig=await(0,
|
|
182
|
+
`},async run({dryRun,mainConfigPath,result}){if(!dryRun){if(result.autodocs===!0){logger3.info(`\u2705 Adding "autodocs" tag to ${result.previewConfigPath}`);let previewConfig=await(0,import_csf_tools4.readConfig)(result.previewConfigPath);previewConfig.getFieldNode(["tags"])?previewConfig.appendValueToArray(["tags"],"autodocs"):previewConfig.setFieldValue(["tags"],["autodocs"]),await(0,import_csf_tools4.writeConfig)(previewConfig)}await updateMainConfig({mainConfigPath,dryRun:!!dryRun},async main=>{logger3.info(`\u2705 Removing "docs.autodocs" from ${mainConfigPath}`),main.removeField(["docs","autodocs"])})}}};var import_picocolors12=__toESM(require_picocolors(),1),import_ts_dedent10=require("ts-dedent");var logger4=console,autodocsTrue={id:"autodocsTrue",versionRange:["<7",">=7"],async check({mainConfig}){let{docs}=mainConfig,docsPageToAutodocsMapping={true:"tag",automatic:!0,false:!1};if(docs?.docsPage){let oldValue=docs?.docsPage.toString();if(!(oldValue in docsPageToAutodocsMapping))throw new Error(`Unexpected value for docs.docsPage: ${oldValue}`);return{value:docsPageToAutodocsMapping[oldValue]}}return docs?.autodocs===void 0?{value:!0}:null},prompt({value}){let autodocsFormatted=import_picocolors12.default.cyan(`docs: { autodocs: ${JSON.stringify(value??!0)} }`),tagWarning=import_ts_dedent10.dedent`
|
|
175
183
|
NOTE: if you're upgrading from an older 7.0-beta using the 'docsPage' tag,
|
|
176
184
|
please update your story files to use the 'autodocs' tag instead.
|
|
177
185
|
`;return value?import_ts_dedent10.dedent`
|
|
@@ -193,7 +201,7 @@ ${import_picocolors5.default.cyan("npx storybook doctor")}`;logger2.info(),found
|
|
|
193
201
|
${autodocsFormatted}
|
|
194
202
|
|
|
195
203
|
More info: ${import_picocolors12.default.yellow("https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#autodocs-changes")}
|
|
196
|
-
`},async run({result:{value},dryRun,mainConfigPath}){logger4.info("\u2705 Setting 'docs.autodocs' to true in main.js"),dryRun||await updateMainConfig({mainConfigPath,dryRun:!!dryRun},async main=>{main.removeField(["docs","docsPage"]),main.setFieldValue(["docs","autodocs"],value??!0)})}};var import_cli4=require("storybook/internal/cli"),
|
|
204
|
+
`},async run({result:{value},dryRun,mainConfigPath}){logger4.info("\u2705 Setting 'docs.autodocs' to true in main.js"),dryRun||await updateMainConfig({mainConfigPath,dryRun:!!dryRun},async main=>{main.removeField(["docs","docsPage"]),main.setFieldValue(["docs","autodocs"],value??!0)})}};var import_cli4=require("storybook/internal/cli"),import_csf_tools5=require("storybook/internal/csf-tools"),import_picocolors13=__toESM(require_picocolors(),1),import_ts_dedent11=require("ts-dedent");var logger5=console,builderVite={id:"builder-vite",versionRange:["<7",">=7"],async check({packageManager,mainConfig}){let packageJson=await packageManager.retrievePackageJson(),builder=mainConfig.core?.builder;return(typeof builder=="string"?builder:builder?.name)!=="storybook-builder-vite"?null:{builder,packageJson}},prompt({builder}){let builderFormatted=import_picocolors13.default.cyan(JSON.stringify(builder,null,2));return import_ts_dedent11.dedent`
|
|
197
205
|
We've detected you're using the community vite builder: ${builderFormatted}
|
|
198
206
|
|
|
199
207
|
'storybook-builder-vite' is deprecated and now located at ${import_picocolors13.default.cyan("@storybook/builder-vite")}.
|
|
@@ -201,7 +209,7 @@ ${import_picocolors5.default.cyan("npx storybook doctor")}`;logger2.info(),found
|
|
|
201
209
|
We can upgrade your project to use the new builder automatically.
|
|
202
210
|
|
|
203
211
|
More info: ${import_picocolors13.default.yellow("https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#vite-builder-renamed")}
|
|
204
|
-
`},async run({result:{builder,packageJson},packageManager,dryRun,mainConfigPath}){let{dependencies={},devDependencies={}}=packageJson;if(logger5.info("\u2705 Removing existing 'storybook-builder-vite' dependency"),dryRun||(delete dependencies["storybook-builder-vite"],delete devDependencies["storybook-builder-vite"],await packageManager.writePackageJson(packageJson)),logger5.info("\u2705 Adding '@storybook/builder-vite' as dev dependency"),!dryRun){let versionToInstall=(0,import_cli4.getStorybookVersionSpecifier)(await packageManager.retrievePackageJson());await packageManager.addDependencies({installAsDevDependencies:!0},[`@storybook/builder-vite@${versionToInstall}`])}logger5.info("\u2705 Updating main.js to use vite builder"),dryRun||await updateMainConfig({dryRun:!!dryRun,mainConfigPath},async main=>{let updatedBuilder=typeof builder=="string"?"@storybook/builder-vite":{name:"@storybook/builder-vite",options:builder.options};main.setFieldValue(["core","builder"],updatedBuilder),await(0,
|
|
212
|
+
`},async run({result:{builder,packageJson},packageManager,dryRun,mainConfigPath}){let{dependencies={},devDependencies={}}=packageJson;if(logger5.info("\u2705 Removing existing 'storybook-builder-vite' dependency"),dryRun||(delete dependencies["storybook-builder-vite"],delete devDependencies["storybook-builder-vite"],await packageManager.writePackageJson(packageJson)),logger5.info("\u2705 Adding '@storybook/builder-vite' as dev dependency"),!dryRun){let versionToInstall=(0,import_cli4.getStorybookVersionSpecifier)(await packageManager.retrievePackageJson());await packageManager.addDependencies({installAsDevDependencies:!0},[`@storybook/builder-vite@${versionToInstall}`])}logger5.info("\u2705 Updating main.js to use vite builder"),dryRun||await updateMainConfig({dryRun:!!dryRun,mainConfigPath},async main=>{let updatedBuilder=typeof builder=="string"?"@storybook/builder-vite":{name:"@storybook/builder-vite",options:builder.options};main.setFieldValue(["core","builder"],updatedBuilder),await(0,import_csf_tools5.writeConfig)(main)})}};var import_picocolors16=__toESM(require_picocolors(),1),import_semver8=__toESM(require("semver"),1),import_ts_dedent14=require("ts-dedent");var import_picocolors14=__toESM(require_picocolors(),1),import_semver6=__toESM(require("semver"),1),import_ts_dedent12=require("ts-dedent");var logger6=console,checkWebpack5Builder=async({mainConfig,storybookVersion})=>{if(import_semver6.default.lt(storybookVersion,"6.3.0"))return logger6.warn(import_ts_dedent12.dedent`
|
|
205
213
|
Detected SB 6.3 or below, please upgrade storybook to use webpack5.
|
|
206
214
|
|
|
207
215
|
To upgrade to the latest stable release, run this from your project directory:
|
|
@@ -238,14 +246,14 @@ ${import_picocolors5.default.cyan("npx storybook doctor")}`;logger2.info(),found
|
|
|
238
246
|
The supported formats for this automigration are: ${import_cli5.SUPPORTED_ESLINT_EXTENSIONS.join(", ")}.
|
|
239
247
|
|
|
240
248
|
Please refer to https://github.com/storybookjs/eslint-plugin-storybook#usage to finish setting up the plugin manually.
|
|
241
|
-
`);return}dryRun||await(0,import_cli5.configureEslintPlugin)(eslintFile,packageManager)}};var import_promises2=require("fs/promises"),
|
|
249
|
+
`);return}dryRun||await(0,import_cli5.configureEslintPlugin)(eslintFile,packageManager)}};var import_promises2=require("fs/promises"),import_csf_tools6=require("storybook/internal/csf-tools"),import_picocolors18=__toESM(require_picocolors(),1),import_ts_dedent16=require("ts-dedent"),MIGRATION2="https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#previewjs-globals-renamed-to-initialglobals",initialGlobals={id:"initial-globals",versionRange:["*.*.*",">=8.0.*"],async check({previewConfigPath}){if(!previewConfigPath)return null;let previewConfig=(0,import_csf_tools6.loadConfig)((await(0,import_promises2.readFile)(previewConfigPath)).toString()).parse(),globals=previewConfig.getFieldNode(["globals"]);return globals?{globals,previewConfig,previewConfigPath}:null},prompt({previewConfigPath}){return import_ts_dedent16.dedent`
|
|
242
250
|
The ${import_picocolors18.default.cyan("globals")} setting in ${import_picocolors18.default.cyan(previewConfigPath)} is deprecated
|
|
243
251
|
and has been renamed to ${import_picocolors18.default.cyan("initialGlobals")}.
|
|
244
252
|
|
|
245
253
|
Learn more: ${import_picocolors18.default.yellow(MIGRATION2)}
|
|
246
254
|
|
|
247
255
|
Rename ${import_picocolors18.default.cyan("globals")} to ${import_picocolors18.default.cyan("initalGlobals")}?
|
|
248
|
-
`},async run({dryRun,result}){result.previewConfig.removeField(["globals"]),result.previewConfig.setFieldNode(["initialGlobals"],result.globals),dryRun||await(0,import_promises2.writeFile)(result.previewConfigPath,(0,
|
|
256
|
+
`},async run({dryRun,result}){result.previewConfig.removeField(["globals"]),result.previewConfig.setFieldNode(["initialGlobals"],result.globals),dryRun||await(0,import_promises2.writeFile)(result.previewConfigPath,(0,import_csf_tools6.formatConfig)(result.previewConfig))}};var import_promises3=require("fs/promises"),import_node_path4=require("path"),import_picocolors19=__toESM(require_picocolors(),1),import_ts_dedent17=require("ts-dedent"),MDX1_STYLE_START=/<style>{`/g,MDX1_STYLE_END=/`}<\/style>/g,MDX1_COMMENT=/<!--(.+)-->/g,MDX1_CODEBLOCK=/(?:\n~~~(?:\n|.)*?\n~~~)|(?:\n```(?:\n|.)*?\n```)/g,fixMdxStyleTags=mdx=>mdx.replace(MDX1_STYLE_START,"<style>\n {`").replace(MDX1_STYLE_END," `}\n</style>"),fixMdxComments=mdx=>{let codeblocks=mdx.matchAll(MDX1_CODEBLOCK);return mdx.split(MDX1_CODEBLOCK).map(v=>v.replace(MDX1_COMMENT,(original,group)=>`{/*${group}*/}`)).reduce((acc,item,i)=>{let next=codeblocks.next();return next.done?acc+item:acc+item+next.value[0]},"")},logger9=console,mdx1to3={id:"mdx1to3",versionRange:["<7.0.0",">=8.0.0-alpha.0"],async check(){let{globby}=await import("globby"),storiesMdxFiles=await globby("./!(node_modules)**/*.(story|stories).mdx");return storiesMdxFiles.length?{storiesMdxFiles}:null},prompt({storiesMdxFiles}){return import_ts_dedent17.dedent`
|
|
249
257
|
We've found ${import_picocolors19.default.yellow(storiesMdxFiles.length)} '.stories.mdx' files in your project.
|
|
250
258
|
|
|
251
259
|
Storybook has upgraded to MDX3 (https://mdxjs.com/blog/v3/). MDX3 itself doesn't contain disruptive breaking changes, whereas the transition from MDX1 to MDX2 was a significant change.
|
|
@@ -397,7 +405,7 @@ ${import_picocolors5.default.cyan("npx storybook doctor")}`;logger2.info(),found
|
|
|
397
405
|
${import_picocolors23.default.yellow("https://github.com/storybookjs/storybook/issues/26606")}
|
|
398
406
|
|
|
399
407
|
Press Y to revert to ${import_picocolors23.default.cyan("react-docgen-typescript")}, press N to use ${import_picocolors23.default.cyan("react-docgen")}
|
|
400
|
-
`},async run({dryRun,mainConfigPath,result}){dryRun||await updateMainConfig({mainConfigPath,dryRun:!!dryRun},async main=>{logger15.info("\u2705 Setting typescript.reactDocgen"),main.setFieldValue(["typescript","reactDocgen"],"react-docgen-typescript")})}};var import_promises5=require("fs/promises"),
|
|
408
|
+
`},async run({dryRun,mainConfigPath,result}){dryRun||await updateMainConfig({mainConfigPath,dryRun:!!dryRun},async main=>{logger15.info("\u2705 Setting typescript.reactDocgen"),main.setFieldValue(["typescript","reactDocgen"],"react-docgen-typescript")})}};var import_promises5=require("fs/promises"),import_csf_tools7=require("storybook/internal/csf-tools"),babel=__toESM(require("@babel/core"),1),import_picocolors24=__toESM(require_picocolors(),1),import_ts_dedent24=require("ts-dedent"),removeArgtypesRegex={id:"remove-argtypes-regex",promptType:"manual",versionRange:["<8.0.0-alpha.0",">=8.0.0-alpha.0"],async check({previewConfigPath}){if(!previewConfigPath)return null;let previewFile=await(0,import_promises5.readFile)(previewConfigPath,{encoding:"utf-8"}),file=new babel.File({filename:previewConfigPath},{code:previewFile,ast:(0,import_csf_tools7.babelParse)(previewFile)}),argTypesRegex;return file.path.traverse({Identifier:path2=>{path2.node.name==="argTypesRegex"&&(argTypesRegex=path2)}}),argTypesRegex?{argTypesRegex,previewConfigPath}:null},prompt({argTypesRegex,previewConfigPath}){return import_ts_dedent24.dedent`
|
|
401
409
|
${import_picocolors24.default.bold("Attention")}: We've detected that you're using argTypesRegex:
|
|
402
410
|
|
|
403
411
|
${argTypesRegex.buildCodeFrameError(`${previewConfigPath}`).message}
|
|
@@ -434,11 +442,11 @@ ${import_picocolors5.default.cyan("npx storybook doctor")}`;logger2.info(),found
|
|
|
434
442
|
We will uninstall them for you and install ${import_picocolors26.default.cyan("@storybook/test")} instead.
|
|
435
443
|
|
|
436
444
|
Also, we can help you migrate your stories to use the new package.
|
|
437
|
-
`},async run({packageManager,dryRun}){if(!dryRun){let packageJson=await packageManager.retrievePackageJson();await packageManager.removeDependencies({skipInstall:!0,packageJson},["@storybook/jest","@storybook/testing-library"]);let versionToInstall=(0,import_cli9.getStorybookVersionSpecifier)(packageJson);await packageManager.addDependencies({installAsDevDependencies:!0,packageJson},[`@storybook/test@${versionToInstall}`]);let{glob:globString}=await(0,import_prompts5.default)({type:"text",name:"glob",message:"Please enter the glob for your stories to migrate to @storybook/test",initial:"./src/**/*.stories.*"});globString&&await(0,import_codemod2.runCodemod)("migrate-to-test-package",{glob:globString,dryRun,logger:logger16})}}};var
|
|
445
|
+
`},async run({packageManager,dryRun}){if(!dryRun){let packageJson=await packageManager.retrievePackageJson();await packageManager.removeDependencies({skipInstall:!0,packageJson},["@storybook/jest","@storybook/testing-library"]);let versionToInstall=(0,import_cli9.getStorybookVersionSpecifier)(packageJson);await packageManager.addDependencies({installAsDevDependencies:!0,packageJson},[`@storybook/test@${versionToInstall}`]);let{glob:globString}=await(0,import_prompts5.default)({type:"text",name:"glob",message:"Please enter the glob for your stories to migrate to @storybook/test",initial:"./src/**/*.stories.*"});globString&&await(0,import_codemod2.runCodemod)("migrate-to-test-package",{glob:globString,dryRun,logger:logger16})}}};var import_csf_tools8=require("storybook/internal/csf-tools"),import_ts_dedent27=require("ts-dedent");var logger17=console,removeLegacyMDX1={id:"remove-legacy-mdx1",versionRange:["<8.0.0-alpha.0",">=8.0.0-alpha.0"],async check({mainConfig}){return mainConfig.features&&Object.hasOwn(mainConfig.features,"legacyMdx1")?{hasFeature:!0}:null},prompt({}){return import_ts_dedent27.dedent`
|
|
438
446
|
You have features.legacyMdx1 in your Storybook main config file. This feature has been removed. Shall we remove it from your Storybook main config file?
|
|
439
447
|
|
|
440
448
|
Link: https://storybook.js.org/docs/8.0/migration-guide
|
|
441
|
-
`},async run({dryRun,mainConfigPath,skipInstall,packageManager}){if(logger17.info("\u2705 Removing legacyMdx1 feature"),!dryRun){await updateMainConfig({dryRun:!!dryRun,mainConfigPath},async main=>{main.removeField(["features","legacyMdx1"]),await(0,
|
|
449
|
+
`},async run({dryRun,mainConfigPath,skipInstall,packageManager}){if(logger17.info("\u2705 Removing legacyMdx1 feature"),!dryRun){await updateMainConfig({dryRun:!!dryRun,mainConfigPath},async main=>{main.removeField(["features","legacyMdx1"]),await(0,import_csf_tools8.writeConfig)(main)});let packageJson=await packageManager.retrievePackageJson();await packageManager.removeDependencies({skipInstall,packageJson},["@storybook/mdx1-csf"])}}};var import_cli10=require("storybook/internal/cli"),import_picocolors27=__toESM(require_picocolors(),1),import_ts_dedent28=require("ts-dedent"),logger18=console,sbBinary={id:"storybook-binary",versionRange:["*","*"],async check({packageManager,storybookVersion}){let packageJson=await packageManager.retrievePackageJson(),sbBinaryVersion=await packageManager.getPackageVersion("sb"),storybookBinaryVersion=await packageManager.getPackageVersion("storybook"),hasSbBinary=!!sbBinaryVersion,hasStorybookBinary=!!storybookBinaryVersion;return!hasSbBinary&&hasStorybookBinary?null:{hasSbBinary,hasStorybookBinary,storybookVersion,packageJson}},prompt({storybookVersion,hasSbBinary,hasStorybookBinary}){let sbFormatted=import_picocolors27.default.cyan(`Storybook ${storybookVersion}`),storybookBinaryMessage=hasStorybookBinary?"":`We've detected you are using ${sbFormatted} without Storybook's ${import_picocolors27.default.magenta("storybook")} binary. Starting in Storybook 7.0, it has to be installed.`;return import_ts_dedent28.dedent`
|
|
442
450
|
${storybookBinaryMessage}
|
|
443
451
|
${hasSbBinary?`You're using the 'sb' binary and it should be replaced, as 'storybook' is the recommended way to run Storybook.
|
|
444
452
|
`:""}
|
|
@@ -535,7 +543,7 @@ ${import_picocolors5.default.cyan("npx storybook doctor")}`;logger2.info(),found
|
|
|
535
543
|
You can find more information here: ${import_picocolors33.default.yellow("https://storybook.js.org/docs/builders/webpack#compiler-support")}
|
|
536
544
|
`),message.join(`
|
|
537
545
|
|
|
538
|
-
`)},async run({result,mainConfigPath,packageManager,skipInstall,dryRun}){let{defaultCompiler,shouldRemoveSWCFlag,isNextJs}=result;if(shouldRemoveSWCFlag&&await updateMainConfig({mainConfigPath,dryRun:!!dryRun},main=>{main.removeField(["framework","options","builder","useSWC"])}),!isNextJs){let compiler=defaultCompiler===import_cli13.CoreWebpackCompilers.Babel?await askUserForCompilerChoice():import_cli13.CoreWebpackCompilers.SWC,compilerPackageName=Object.entries(import_cli13.compilerNameToCoreCompiler).find(([,coreCompiler])=>coreCompiler===compiler)[0];await add(compilerPackageName,{packageManager:packageManager.type,skipPostinstall:!!skipInstall})}}};async function askUserForCompilerChoice(){return(await(0,import_prompts6.default)({type:"select",name:"compiler",message:"Which compiler would you like to use?",choices:[{title:"Babel",description:"Choose Babel for a vast ecosystem and battle-tested reliability.",value:import_cli13.CoreWebpackCompilers.Babel},{title:"SWC",description:"Choose SWC for fast builds and simple configuration.",value:import_cli13.CoreWebpackCompilers.SWC}],initial:0})).compiler}var import_cli14=require("storybook/internal/cli"),
|
|
546
|
+
`)},async run({result,mainConfigPath,packageManager,skipInstall,dryRun}){let{defaultCompiler,shouldRemoveSWCFlag,isNextJs}=result;if(shouldRemoveSWCFlag&&await updateMainConfig({mainConfigPath,dryRun:!!dryRun},main=>{main.removeField(["framework","options","builder","useSWC"])}),!isNextJs){let compiler=defaultCompiler===import_cli13.CoreWebpackCompilers.Babel?await askUserForCompilerChoice():import_cli13.CoreWebpackCompilers.SWC,compilerPackageName=Object.entries(import_cli13.compilerNameToCoreCompiler).find(([,coreCompiler])=>coreCompiler===compiler)[0];await add(compilerPackageName,{packageManager:packageManager.type,skipPostinstall:!!skipInstall})}}};async function askUserForCompilerChoice(){return(await(0,import_prompts6.default)({type:"select",name:"compiler",message:"Which compiler would you like to use?",choices:[{title:"Babel",description:"Choose Babel for a vast ecosystem and battle-tested reliability.",value:import_cli13.CoreWebpackCompilers.Babel},{title:"SWC",description:"Choose SWC for fast builds and simple configuration.",value:import_cli13.CoreWebpackCompilers.SWC}],initial:0})).compiler}var import_cli14=require("storybook/internal/cli"),import_csf_tools9=require("storybook/internal/csf-tools"),import_picocolors34=__toESM(require_picocolors(),1),import_ts_dedent36=require("ts-dedent");var wrapRequire={id:"wrap-require",versionRange:["*","*"],async check({packageManager,storybookVersion,mainConfigPath}){let isStorybookInMonorepo=await packageManager.isStorybookInMonorepo(),isPnp=await(0,import_cli14.detectPnp)();if(!mainConfigPath)return null;let config=await(0,import_csf_tools9.readConfig)(mainConfigPath);if(!isStorybookInMonorepo&&!isPnp||!getFieldsForRequireWrapper(config).some(node=>isRequireWrapperNecessary(node)))return null;let isConfigTypescript=mainConfigPath.endsWith(".ts")||mainConfigPath.endsWith(".tsx");return{storybookVersion,isStorybookInMonorepo,isPnp,isConfigTypescript}},prompt({storybookVersion,isStorybookInMonorepo}){let sbFormatted=import_picocolors34.default.cyan(`Storybook ${storybookVersion}`);return import_ts_dedent36.dedent`We have detected that you're using ${sbFormatted} in a ${isStorybookInMonorepo?"monorepo":"PnP"} project.
|
|
539
547
|
For Storybook to work correctly, some fields in your main config must be updated. We can do this for you automatically.
|
|
540
548
|
|
|
541
549
|
More info: https://storybook.js.org/docs/faq#how-do-i-fix-module-resolution-in-special-environments`},async run({dryRun,mainConfigPath,result}){return new Promise((resolve,reject)=>{updateMainConfig({dryRun:!!dryRun,mainConfigPath},mainConfig=>{try{getFieldsForRequireWrapper(mainConfig).forEach(node=>{wrapValueWithRequireWrapper(mainConfig,node)}),getRequireWrapperName(mainConfig)===null&&(mainConfig?.fileName?.endsWith(".cjs")||mainConfig?.fileName?.endsWith(".cts")||mainConfig?.fileName?.endsWith(".cjsx")||mainConfig?.fileName?.endsWith(".ctsx")?mainConfig.setRequireImport(["dirname","join"],"path"):mainConfig.setImport(["dirname","join"],"path"),mainConfig.setBodyDeclaration(getRequireWrapperAsCallExpression(result.isConfigTypescript))),resolve()}catch(e){reject(e)}})})}};var allFixes=[missingStorybookDependencies,addonsAPI,newFrameworks,cra5,webpack5,vue3,addonPostCSS,viteConfigFile,eslintPlugin,builderVite,sbBinary,sbScripts,removeJestTestingLibrary,removeArgtypesRegex,removedGlobalClientAPIs,mdxgfm,mdxToCSF,autodocsTrue,angularBuildersMultiproject,angularBuilders,wrapRequire,reactDocgen,storyshotsMigration,removeReactDependency,removeLegacyMDX1,webpack5CompilerSetup,mdx1to3,upgradeStorybookRelatedDependencies,vta,autodocsTags,initialGlobals,addonA11yAddonTest];var import_picocolors35=__toESM(require_picocolors(),1),import_ts_dedent37=require("ts-dedent");var messageDivider2=`
|
package/dist/bin/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { __commonJS, __toESM, require_picocolors, __require } from '../chunk-3VVDG2YT.js';
|
|
2
|
-
import { versions, removeAddon, JsPackageManagerFactory, getStorybookInfo, getCoercedStorybookVersion, serverRequire, loadMainConfig, frameworkPackages, temporaryFile, isCorePackage, rendererPackages, commonGlobOptions, extractProperFrameworkName, builderPackages } from 'storybook/internal/common';
|
|
2
|
+
import { versions, removeAddon, JsPackageManagerFactory, getStorybookInfo, getCoercedStorybookVersion, serverRequire, loadMainConfig, frameworkPackages, temporaryFile, isCorePackage, rendererPackages, commonGlobOptions, extractProperFrameworkName, builderPackages, formatFileContent } from 'storybook/internal/common';
|
|
3
3
|
import { withTelemetry } from 'storybook/internal/core-server';
|
|
4
4
|
import { logger as logger$1 } from 'storybook/internal/node-logger';
|
|
5
5
|
import { addToGlobalContext, telemetry } from 'storybook/internal/telemetry';
|
|
@@ -84,35 +84,43 @@ ${packageVersions.join(", ")}`),acc},{critical:[],trivial:[]});return critical.l
|
|
|
84
84
|
|
|
85
85
|
`));else {let list=installationMetadata?getDuplicatedDepsWarnings(installationMetadata):getDuplicatedDepsWarnings();Array.isArray(list)&&list.length>0&&logDiagnostic("Duplicated dependencies found",list?.join(`
|
|
86
86
|
`));}}let commandMessage=`You can always recheck the health of your project by running:
|
|
87
|
-
${import_picocolors5.default.cyan("npx storybook doctor")}`;logger2.info(),foundIssues?(logger2.info(commandMessage),logger2.info(),logger2.info(`Full logs are available in ${import_picocolors5.default.cyan(LOG_FILE_PATH)}`),await rename(TEMP_LOG_FILE_PATH,join(process.cwd(),LOG_FILE_NAME))):(logger2.info("\u{1F973} Your Storybook project looks good!"),logger2.info(commandMessage),await rm(TEMP_LOG_FILE_PATH,{recursive:!0,force:!0})),logger2.info(),cleanup();};var import_picocolors6=__toESM(require_picocolors(),1);var SUPPORTED_FRAMEWORKS=["@storybook/nextjs","@storybook/experimental-nextjs-vite","@storybook/sveltekit"],SUPPORTED_RENDERERS=["@storybook/react","@storybook/svelte","@storybook/vue3"];var
|
|
87
|
+
${import_picocolors5.default.cyan("npx storybook doctor")}`;logger2.info(),foundIssues?(logger2.info(commandMessage),logger2.info(),logger2.info(`Full logs are available in ${import_picocolors5.default.cyan(LOG_FILE_PATH)}`),await rename(TEMP_LOG_FILE_PATH,join(process.cwd(),LOG_FILE_NAME))):(logger2.info("\u{1F973} Your Storybook project looks good!"),logger2.info(commandMessage),await rm(TEMP_LOG_FILE_PATH,{recursive:!0,force:!0})),logger2.info(),cleanup();};var import_picocolors6=__toESM(require_picocolors(),1);var SUPPORTED_FRAMEWORKS=["@storybook/nextjs","@storybook/experimental-nextjs-vite","@storybook/sveltekit"],SUPPORTED_RENDERERS=["@storybook/react","@storybook/svelte","@storybook/vue3"];var fileExtensions=[".js",".ts",".cts",".mts",".cjs",".mjs",".jsx",".tsx"],addonA11yAddonTest={id:"addonA11yAddonTest",versionRange:["<8.5.0",">=8.5.0"],promptType(result){return result.setupFile===null&&result.previewFile===null?"manual":"auto"},async check({mainConfig,configDir}){let addons=getAddonNames(mainConfig),frameworkPackageName=getFrameworkPackageName(mainConfig),rendererPackageName=getRendererName(mainConfig),hasA11yAddon=!!addons.find(addon=>addon.includes("@storybook/addon-a11y")),hasTestAddon=!!addons.find(addon=>addon.includes("@storybook/experimental-addon-test"));if(!SUPPORTED_FRAMEWORKS.find(framework=>frameworkPackageName?.includes(framework))&&!SUPPORTED_RENDERERS.find(renderer=>rendererPackageName?.includes(rendererPackages[renderer]))||!hasA11yAddon||!hasTestAddon||!configDir)return null;let vitestSetupFile=fileExtensions.map(ext=>path.join(configDir,`vitest.setup${ext}`)).find(filePath=>existsSync$1(filePath))??null,previewFile=fileExtensions.map(ext=>path.join(configDir,`preview${ext}`)).find(filePath=>existsSync$1(filePath))??null,skipVitestSetupTransformation=!1,skipPreviewTransformation=!0;if(vitestSetupFile&&previewFile&&(skipVitestSetupTransformation=readFileSync(vitestSetupFile,"utf8").includes("@storybook/addon-a11y"),skipVitestSetupTransformation&&skipPreviewTransformation))return null;let getTransformedSetupCode=()=>{if(!vitestSetupFile||skipVitestSetupTransformation)return null;try{let vitestSetupSource=readFileSync(vitestSetupFile,"utf8");return transformSetupFile(vitestSetupSource)}catch{return null}},getTransformedPreviewCode=async()=>{if(!previewFile||skipPreviewTransformation)return null;try{let previewSetupSource=readFileSync(previewFile,"utf8");return await transformPreviewFile(previewSetupSource,previewFile)}catch{return null}};return {setupFile:vitestSetupFile,previewFile,transformedSetupCode:getTransformedSetupCode(),transformedPreviewCode:await getTransformedPreviewCode(),skipVitestSetupTransformation,skipPreviewTransformation}},prompt({setupFile,previewFile,transformedSetupCode,transformedPreviewCode,skipPreviewTransformation,skipVitestSetupTransformation}){let prompt2=[dedent`
|
|
88
88
|
We have detected that you have ${import_picocolors6.default.magenta("@storybook/addon-a11y")} and ${import_picocolors6.default.magenta("@storybook/experimental-addon-test")} installed.
|
|
89
89
|
|
|
90
|
-
${import_picocolors6.default.magenta("@storybook/addon-a11y")} integrates
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
90
|
+
${import_picocolors6.default.magenta("@storybook/addon-a11y")} now integrates with ${import_picocolors6.default.magenta("@storybook/experimental-addon-test")} to provide automatic accessibility checks for your stories, powered by Axe and Vitest.
|
|
91
|
+
`],counter=1;if(!skipVitestSetupTransformation)if(transformedSetupCode===null)prompt2.push(dedent`
|
|
92
|
+
${counter++}) We couldn't find or automatically update ${import_picocolors6.default.cyan(".storybook/vitest.setup.<ts|js>")} in your project to smoothly set up project annotations from ${import_picocolors6.default.magenta("@storybook/addon-a11y")}.
|
|
93
|
+
Please manually update your ${import_picocolors6.default.cyan("vitest.setup.ts")} file to include the following:
|
|
94
|
+
|
|
95
|
+
${import_picocolors6.default.gray("...")}
|
|
96
|
+
${import_picocolors6.default.green('+ import * as a11yAddonAnnotations from "@storybook/addon-a11y/preview";')}
|
|
97
|
+
|
|
98
|
+
${import_picocolors6.default.gray("const annotations = setProjectAnnotations([")}
|
|
99
|
+
${import_picocolors6.default.gray(" ...")}
|
|
100
|
+
${import_picocolors6.default.green("+ a11yAddonAnnotations,")}
|
|
101
|
+
${import_picocolors6.default.gray("]);")}
|
|
102
|
+
|
|
103
|
+
${import_picocolors6.default.gray("beforeAll(annotations.beforeAll);")}
|
|
104
|
+
`);else {let fileExtensionSetupFile=path.extname(setupFile);prompt2.push(dedent`${counter++}) We have to update your ${import_picocolors6.default.cyan(`.storybook/vitest.setup${fileExtensionSetupFile}`)} file to set up project annotations from ${import_picocolors6.default.magenta("@storybook/addon-a11y")}.`);}if(!skipPreviewTransformation)if(transformedPreviewCode===null)prompt2.push(dedent`
|
|
105
|
+
${counter++}) We couldn't find or automatically update your ${import_picocolors6.default.cyan(".storybook/preview.<ts|js>")} in your project to smoothly set up tags from ${import_picocolors6.default.magenta("@storybook/addon-a11y")}.
|
|
106
|
+
Please manually update your ${import_picocolors6.default.cyan(".storybook/preview.<ts|js>")} file to include the following:
|
|
107
|
+
|
|
108
|
+
${import_picocolors6.default.gray("export default {")}
|
|
109
|
+
${import_picocolors6.default.gray("...")}
|
|
110
|
+
${import_picocolors6.default.green('+ tags: ["a11y-test"],')}
|
|
111
|
+
${import_picocolors6.default.gray("}")}
|
|
112
|
+
`);else {let fileExtensionPreviewFile=path.extname(previewFile);prompt2.push(dedent`
|
|
113
|
+
${counter++}) We have to update your ${import_picocolors6.default.cyan(`.storybook/preview${fileExtensionPreviewFile}`)} file to set up tags from ${import_picocolors6.default.magenta("@storybook/addon-a11y")}.
|
|
114
|
+
`);}return (transformedPreviewCode===null||transformedSetupCode===null)&&prompt2.push(dedent`
|
|
115
|
+
For more information, please refer to the accessibility addon documentation:
|
|
116
|
+
${import_picocolors6.default.cyan("https://storybook.js.org/docs/writing-tests/accessibility-testing#test-addon-integration")}
|
|
117
|
+
`),prompt2.join(`
|
|
118
|
+
|
|
119
|
+
`)},async run({result}){let{setupFile,transformedSetupCode,transformedPreviewCode,previewFile}=result;transformedSetupCode&&setupFile&&writeFileSync(setupFile,transformedSetupCode,"utf8"),transformedPreviewCode&&previewFile&&writeFileSync(previewFile,transformedPreviewCode,"utf8");}};function transformSetupFile(source){let j=jscodeshift.withParser("ts"),root=j(source),importDeclaration=j.importDeclaration([j.importNamespaceSpecifier(j.identifier("a11yAddonAnnotations"))],j.literal("@storybook/addon-a11y/preview")),setProjectAnnotationsCall=root.find(j.CallExpression,{callee:{type:"Identifier",name:"setProjectAnnotations"}});if(setProjectAnnotationsCall.length===0)throw new Error("Could not find setProjectAnnotations call in vitest.setup file");return setProjectAnnotationsCall.forEach(p=>{if(p.value.arguments.length===1&&p.value.arguments[0].type==="ArrayExpression")p.value.arguments[0].elements.unshift(j.identifier("a11yAddonAnnotations"));else if(p.value.arguments.length===1&&p.value.arguments[0].type==="Identifier"){let arg=p.value.arguments[0];p.value.arguments[0]=j.arrayExpression([j.identifier("a11yAddonAnnotations"),arg]);}}),root.get().node.program.body.unshift(importDeclaration),root.toSource()}async function transformPreviewFile(source,filePath){let previewConfig=loadConfig(source).parse(),tags=previewConfig.getFieldNode(["tags"]),tagsNode=previewConfig.getFieldNode(["tags"]),tagsValue=previewConfig.getFieldValue(["tags"])??[];if(tags&&tagsValue&&(tagsValue.includes("a11y-test")||tagsValue.includes("!a11y-test")))return source;if(tagsNode){let tagsElementsLength=tagsNode.elements.length,lastTagElement=tagsNode.elements[tagsElementsLength-1];lastTagElement&&(lastTagElement.comments=[{type:"CommentBlock",leading:!1,trailing:!0,value:', "a11y-test"'}],previewConfig.setFieldNode(["tags"],tagsNode));}else previewConfig.setFieldValue(["tags"],["a11y-test"]);let formattedPreviewConfig=formatConfig(previewConfig),lines=formattedPreviewConfig.split(`
|
|
120
|
+
`),tagsLineIndex=lines.findIndex(line=>line.includes("tags: ["));if(tagsLineIndex===-1)return formattedPreviewConfig;lines[tagsLineIndex]=lines[tagsLineIndex].replace("['a11y-test']","[/*'a11y-test'*/]"),lines[tagsLineIndex]=lines[tagsLineIndex].replace('["a11y-test"]','[/*"a11y-test"*/]');let indentation=lines[tagsLineIndex]?.match(/^\s*/)?.[0],comment=`${indentation}// The \`a11y-test\` tag controls whether accessibility tests are run as part of a standalone Vitest test run
|
|
121
|
+
${indentation}// The tag and its behavior are experimental and subject to change.
|
|
122
|
+
${indentation}// For more information please see: https://storybook.js.org/docs/writing-tests/accessibility-testing#configure-accessibility-tests-with-the-test-addon`;return lines.splice(tagsLineIndex,0,comment),formatFileContent(filePath,lines.join(`
|
|
123
|
+
`))}var import_picocolors7=__toESM(require_picocolors(),1);var addonPostCSS={id:"addon-postcss",versionRange:["*","*"],promptType:"notification",async check({mainConfig}){return !getAddonNames(mainConfig).find(addon=>addon.includes("@storybook/addon-postcss"))?null:{hasAddonPostcss:!0}},prompt(){return dedent`
|
|
116
124
|
${import_picocolors7.default.bold("Attention")}: We've detected that you're using the following package which is incompatible with Storybook 8 and beyond:
|
|
117
125
|
|
|
118
126
|
- ${import_picocolors7.default.cyan("@storybook/addon-postcss")}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@storybook/cli",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.6.0-alpha.0",
|
|
4
4
|
"description": "Storybook CLI",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"storybook"
|
|
@@ -42,10 +42,10 @@
|
|
|
42
42
|
"dependencies": {
|
|
43
43
|
"@babel/core": "^7.24.4",
|
|
44
44
|
"@babel/types": "^7.24.0",
|
|
45
|
-
"@storybook/codemod": "8.
|
|
45
|
+
"@storybook/codemod": "8.6.0-alpha.0",
|
|
46
46
|
"@types/semver": "^7.3.4",
|
|
47
47
|
"commander": "^12.1.0",
|
|
48
|
-
"create-storybook": "8.
|
|
48
|
+
"create-storybook": "8.6.0-alpha.0",
|
|
49
49
|
"cross-spawn": "^7.0.3",
|
|
50
50
|
"envinfo": "^7.7.3",
|
|
51
51
|
"fd-package-json": "^1.2.0",
|
|
@@ -57,7 +57,7 @@
|
|
|
57
57
|
"leven": "^3.1.0",
|
|
58
58
|
"prompts": "^2.4.0",
|
|
59
59
|
"semver": "^7.3.7",
|
|
60
|
-
"storybook": "8.
|
|
60
|
+
"storybook": "8.6.0-alpha.0",
|
|
61
61
|
"tiny-invariant": "^1.3.1",
|
|
62
62
|
"ts-dedent": "^2.0.0"
|
|
63
63
|
},
|