@storybook/cli 8.0.0-alpha.14 → 8.0.0-alpha.16
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/generate.js +23 -11
- package/dist/generate.mjs +25 -13
- package/package.json +9 -9
package/dist/generate.js
CHANGED
|
@@ -60,7 +60,7 @@ We were not able to detect the right builder for your project. Please select one
|
|
|
60
60
|
import { setCompodocJson } from "@storybook/addon-docs/angular";
|
|
61
61
|
import docJson from "../documentation.json";
|
|
62
62
|
setCompodocJson(docJson);
|
|
63
|
-
`.trimStart(),promptForCompoDocs=async()=>{let{useCompoDoc}=await(0,import_prompts3.default)({type:"confirm",name:"useCompoDoc",message:"Do you want to use Compodoc for documentation?"});return useCompoDoc},AngularJSON=class{constructor(){if(!import_fs2.default.existsSync(ANGULAR_JSON_PATH))throw new import_server_errors.MissingAngularJsonError({path:(0,import_path6.join)(process.cwd(),ANGULAR_JSON_PATH)});let jsonContent=import_fs2.default.readFileSync(ANGULAR_JSON_PATH,"utf8");this.json=JSON.parse(jsonContent)}get projects(){return this.json.projects}get projectsWithoutStorybook(){return Object.keys(this.projects).filter(projectName=>{let{architect}=this.projects[projectName];return!architect.storybook})}get hasStorybookBuilder(){return Object.keys(this.projects).some(projectName=>{let{architect}=this.projects[projectName];return Object.keys(architect).some(key=>architect[key].builder==="@storybook/angular:start-storybook")})}get rootProject(){let rootProjectName=Object.keys(this.projects).find(projectName=>{let{root}=this.projects[projectName];return root===""||root==="."});return rootProjectName?this.projects[rootProjectName]:null}getProjectSettingsByName(projectName){return this.projects[projectName]}async getProjectName(){if(this.projectsWithoutStorybook.length>1){let{projectName}=await(0,import_prompts3.default)({type:"select",name:"projectName",message:"For which project do you want to generate Storybook configuration?",choices:this.projectsWithoutStorybook.map(name=>({title:name,value:name}))});return projectName}return this.projectsWithoutStorybook[0]}addStorybookEntries({angularProjectName,storybookFolder,useCompodoc,root}){let{architect}=this.projects[angularProjectName],baseOptions={configDir:storybookFolder,browserTarget:`${angularProjectName}:build`,compodoc:useCompodoc,...useCompodoc&&{compodocArgs:["-e","json","-d",root||"."]}};architect.storybook||(architect.storybook={builder:"@storybook/angular:start-storybook",options:{...baseOptions,port:6006}}),architect["build-storybook"]||(architect["build-storybook"]={builder:"@storybook/angular:build-storybook",options:{...baseOptions,outputDir:Object.keys(this.projects).length===1?"storybook-static":`dist/storybook/${angularProjectName}`}})}write(){import_fs2.default.writeFileSync(ANGULAR_JSON_PATH,JSON.stringify(this.json,null,2))}};var generator=async(packageManager,npmOptions,options,commandOptions)=>{let angularJSON=new AngularJSON;if(!angularJSON.projects||angularJSON.projects&&Object.keys(angularJSON.projects).length===0)throw new Error("Storybook was not able to find any projects in your angular.json file. Are you sure this is an Angular CLI project?");if(angularJSON.projectsWithoutStorybook.length===0)throw new Error("Every project in your workspace is already set up with Storybook. There is nothing to do!");let angularProjectName=await angularJSON.getProjectName();(0,import_core_common6.paddedLog)(`Adding Storybook support to your "${angularProjectName}" project`);let angularProject=angularJSON.getProjectSettingsByName(angularProjectName);if(!angularProject)throw new Error(`Somehow we were not able to retrieve the "${angularProjectName}" project in your angular.json file. This is likely a bug in Storybook, please file an issue.`);let{root,projectType}=angularProject,{projects}=angularJSON,useCompodoc=commandOptions?.yes?!0:await promptForCompoDocs(),storybookFolder=root?`${root}/.storybook`:".storybook";angularJSON.addStorybookEntries({angularProjectName,storybookFolder,useCompodoc,root}),angularJSON.write(),await baseGenerator(packageManager,npmOptions,{...options,builder:"webpack5",...useCompodoc&&{frameworkPreviewParts:{prefix:compoDocPreviewPrefix}}},"angular",{...useCompodoc&&{extraPackages:["@compodoc/compodoc","@storybook/addon-docs"]},addScripts:!1,componentsDestinationPath:root?`${root}/src/stories`:void 0,storybookConfigFolder:storybookFolder,webpackCompiler:()=>{}},"angular"),Object.keys(projects).length===1&&packageManager.addScripts({storybook:`ng run ${angularProjectName}:storybook`,"build-storybook":`ng run ${angularProjectName}:build-storybook`});let projectTypeValue=projectType||"application";projectTypeValue!=="application"&&projectTypeValue!=="library"&&(projectTypeValue="application");let templateDir=(0,import_path7.join)(getCliDir(),"templates","angular",projectTypeValue);return templateDir&©Template(templateDir,root||void 0),{projectName:angularProjectName,configDir:storybookFolder}},ANGULAR_default=generator;var generator2=async(packageManager,npmOptions,options)=>{await baseGenerator(packageManager,npmOptions,{...options,builder:"webpack5"},"ember",{staticDir:"dist"},"ember")},EMBER_default=generator2;var generator3=async(packageManager,npmOptions,options)=>{let extraPackages=await detectLanguage(packageManager)==="javascript"?["prop-types"]:[];await baseGenerator(packageManager,npmOptions,options,"react",{extraPackages,webpackCompiler:({builder})=>builder==="webpack5"?"swc":void 0,extraAddons:["@storybook/addon-onboarding@^1.0.0"]})},REACT_default=generator3;var generator4=async(packageManager,npmOptions)=>{let packageJson=await packageManager.retrievePackageJson(),missingReactDom=!packageJson.dependencies["react-dom"]&&!packageJson.devDependencies["react-dom"],reactVersion=packageJson.dependencies.react,packagesToResolve=["react-native-safe-area-context","@react-native-async-storage/async-storage","@react-native-community/datetimepicker","@react-native-community/slider","@storybook/addon-ondevice-controls","@storybook/addon-ondevice-actions","@storybook/react-native"],packagesWithFixedVersion=[
|
|
63
|
+
`.trimStart(),promptForCompoDocs=async()=>{let{useCompoDoc}=await(0,import_prompts3.default)({type:"confirm",name:"useCompoDoc",message:"Do you want to use Compodoc for documentation?"});return useCompoDoc},AngularJSON=class{constructor(){if(!import_fs2.default.existsSync(ANGULAR_JSON_PATH))throw new import_server_errors.MissingAngularJsonError({path:(0,import_path6.join)(process.cwd(),ANGULAR_JSON_PATH)});let jsonContent=import_fs2.default.readFileSync(ANGULAR_JSON_PATH,"utf8");this.json=JSON.parse(jsonContent)}get projects(){return this.json.projects}get projectsWithoutStorybook(){return Object.keys(this.projects).filter(projectName=>{let{architect}=this.projects[projectName];return!architect.storybook})}get hasStorybookBuilder(){return Object.keys(this.projects).some(projectName=>{let{architect}=this.projects[projectName];return Object.keys(architect).some(key=>architect[key].builder==="@storybook/angular:start-storybook")})}get rootProject(){let rootProjectName=Object.keys(this.projects).find(projectName=>{let{root}=this.projects[projectName];return root===""||root==="."});return rootProjectName?this.projects[rootProjectName]:null}getProjectSettingsByName(projectName){return this.projects[projectName]}async getProjectName(){if(this.projectsWithoutStorybook.length>1){let{projectName}=await(0,import_prompts3.default)({type:"select",name:"projectName",message:"For which project do you want to generate Storybook configuration?",choices:this.projectsWithoutStorybook.map(name=>({title:name,value:name}))});return projectName}return this.projectsWithoutStorybook[0]}addStorybookEntries({angularProjectName,storybookFolder,useCompodoc,root}){let{architect}=this.projects[angularProjectName],baseOptions={configDir:storybookFolder,browserTarget:`${angularProjectName}:build`,compodoc:useCompodoc,...useCompodoc&&{compodocArgs:["-e","json","-d",root||"."]}};architect.storybook||(architect.storybook={builder:"@storybook/angular:start-storybook",options:{...baseOptions,port:6006}}),architect["build-storybook"]||(architect["build-storybook"]={builder:"@storybook/angular:build-storybook",options:{...baseOptions,outputDir:Object.keys(this.projects).length===1?"storybook-static":`dist/storybook/${angularProjectName}`}})}write(){import_fs2.default.writeFileSync(ANGULAR_JSON_PATH,JSON.stringify(this.json,null,2))}};var generator=async(packageManager,npmOptions,options,commandOptions)=>{let angularJSON=new AngularJSON;if(!angularJSON.projects||angularJSON.projects&&Object.keys(angularJSON.projects).length===0)throw new Error("Storybook was not able to find any projects in your angular.json file. Are you sure this is an Angular CLI project?");if(angularJSON.projectsWithoutStorybook.length===0)throw new Error("Every project in your workspace is already set up with Storybook. There is nothing to do!");let angularProjectName=await angularJSON.getProjectName();(0,import_core_common6.paddedLog)(`Adding Storybook support to your "${angularProjectName}" project`);let angularProject=angularJSON.getProjectSettingsByName(angularProjectName);if(!angularProject)throw new Error(`Somehow we were not able to retrieve the "${angularProjectName}" project in your angular.json file. This is likely a bug in Storybook, please file an issue.`);let{root,projectType}=angularProject,{projects}=angularJSON,useCompodoc=commandOptions?.yes?!0:await promptForCompoDocs(),storybookFolder=root?`${root}/.storybook`:".storybook";angularJSON.addStorybookEntries({angularProjectName,storybookFolder,useCompodoc,root}),angularJSON.write(),await baseGenerator(packageManager,npmOptions,{...options,builder:"webpack5",...useCompodoc&&{frameworkPreviewParts:{prefix:compoDocPreviewPrefix}}},"angular",{...useCompodoc&&{extraPackages:["@compodoc/compodoc","@storybook/addon-docs"]},addScripts:!1,componentsDestinationPath:root?`${root}/src/stories`:void 0,storybookConfigFolder:storybookFolder,webpackCompiler:()=>{}},"angular"),Object.keys(projects).length===1&&packageManager.addScripts({storybook:`ng run ${angularProjectName}:storybook`,"build-storybook":`ng run ${angularProjectName}:build-storybook`});let projectTypeValue=projectType||"application";projectTypeValue!=="application"&&projectTypeValue!=="library"&&(projectTypeValue="application");let templateDir=(0,import_path7.join)(getCliDir(),"templates","angular",projectTypeValue);return templateDir&©Template(templateDir,root||void 0),{projectName:angularProjectName,configDir:storybookFolder}},ANGULAR_default=generator;var generator2=async(packageManager,npmOptions,options)=>{await baseGenerator(packageManager,npmOptions,{...options,builder:"webpack5"},"ember",{staticDir:"dist"},"ember")},EMBER_default=generator2;var generator3=async(packageManager,npmOptions,options)=>{let extraPackages=await detectLanguage(packageManager)==="javascript"?["prop-types"]:[];await baseGenerator(packageManager,npmOptions,options,"react",{extraPackages,webpackCompiler:({builder})=>builder==="webpack5"?"swc":void 0,extraAddons:["@storybook/addon-onboarding@^1.0.0"]})},REACT_default=generator3;var generator4=async(packageManager,npmOptions)=>{let packageJson=await packageManager.retrievePackageJson(),missingReactDom=!packageJson.dependencies["react-dom"]&&!packageJson.devDependencies["react-dom"],reactVersion=packageJson.dependencies.react,packagesToResolve=["react-native-safe-area-context","@react-native-async-storage/async-storage","@react-native-community/datetimepicker","@react-native-community/slider","@storybook/addon-ondevice-controls","@storybook/addon-ondevice-actions","@storybook/react-native"],packagesWithFixedVersion=[],versionedPackages=await packageManager.getVersionedPackages(packagesToResolve),babelDependencies=await getBabelDependencies(packageManager,packageJson),packages=[];packages.push(...babelDependencies),packages.push(...packagesWithFixedVersion),packages.push(...versionedPackages),missingReactDom&&reactVersion&&packages.push(`react-dom@${reactVersion}`),await packageManager.addDependencies({...npmOptions,packageJson},packages),packageManager.addScripts({"storybook-generate":"sb-rn-get-stories","storybook-watch":"sb-rn-watcher"});let storybookConfigFolder=".storybook";await copyTemplateFiles({packageManager,renderer:"react-native",language:"typescript-3-8",destination:storybookConfigFolder,includeCommonAssets:!1})},REACT_NATIVE_default=generator4;var import_path8=__toESM(require("path")),import_fs3=__toESM(require("fs")),import_semver4=__toESM(require("semver")),import_ts_dedent5=__toESM(require("ts-dedent")),import_core_common7=require("@storybook/core-common");var generator5=async(packageManager,npmOptions,options)=>{let monorepoRootPath=import_path8.default.join(__dirname,"..","..","..","..","..",".."),extraMain=options.linkable?{webpackFinal:`%%(config) => {
|
|
64
64
|
// add monorepo root as a valid directory to import modules from
|
|
65
65
|
config.resolve.plugins.forEach((p) => {
|
|
66
66
|
if (Array.isArray(p.appSrcs)) {
|
|
@@ -98,13 +98,25 @@ We were not able to detect the right builder for your project. Please select one
|
|
|
98
98
|
`),prelease:import_chalk4.default.yellow("This is a pre-release version.")};logger5.log((0,import_boxen2.default)([messages.welcome].concat(isOutdated&&!isPrerelease?[messages.notLatest]:[]).concat(isPrerelease?[messages.prelease]:[]).join(`
|
|
99
99
|
`),{borderStyle:"round",padding:1,borderColor})),options.force!==!0&¤tDirectoryIsEmpty(packageManager.type)&&(await scaffoldNewProject(packageManager.type,options),(process.env.IN_STORYBOOK_SANDBOX==="true"||process.env.CI==="true")&&packageManager.addPackageResolutions({"@storybook/telemetry":import_core_common8.versions["@storybook/telemetry"]}));let projectType,projectTypeProvided=options.type,infoText=projectTypeProvided?`Installing Storybook for user specified project type: ${projectTypeProvided}`:"Detecting project type",done=(0,import_core_common8.commandLog)(infoText);if(projectTypeProvided)if(installableProjectTypes.includes(projectTypeProvided))projectType=projectTypeProvided.toUpperCase();else throw done(`The provided project type was not recognized by Storybook: ${projectTypeProvided}`),logger5.log(`
|
|
100
100
|
The project types currently supported by Storybook are:
|
|
101
|
-
`),installableProjectTypes.sort().forEach(framework=>(0,import_core_common8.paddedLog)(`- ${framework}`)),logger5.log(),new import_core_common8.HandledError(`Unknown project type supplied: ${projectTypeProvided}`);else try{projectType=await detect(packageManager,options)}catch(err){throw done(String(err)),new import_core_common8.HandledError(err)}done();let storybookInstantiated=isStorybookInstantiated();if(options.force===!1&&storybookInstantiated&&projectType!=="ANGULAR"){logger5.log();let{force}=await(0,import_prompts5.default)([{type:"confirm",name:"force",message:"We found a .storybook config directory in your project. Therefore we assume that Storybook is already instantiated for your project. Do you still want to continue and force the initialization?"}]);logger5.log(),force?options.force=!0:process.exit(0)}options.skipInstall||await packageManager.installDependencies();let installResult=await installStorybook(projectType,packageManager,options);if(options.skipInstall||await packageManager.installDependencies(),options.disableTelemetry||await(0,import_telemetry2.telemetry)("init",{projectType}),projectType==="REACT_NATIVE")return logger5.log(
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
101
|
+
`),installableProjectTypes.sort().forEach(framework=>(0,import_core_common8.paddedLog)(`- ${framework}`)),logger5.log(),new import_core_common8.HandledError(`Unknown project type supplied: ${projectTypeProvided}`);else try{projectType=await detect(packageManager,options)}catch(err){throw done(String(err)),new import_core_common8.HandledError(err)}done();let storybookInstantiated=isStorybookInstantiated();if(options.force===!1&&storybookInstantiated&&projectType!=="ANGULAR"){logger5.log();let{force}=await(0,import_prompts5.default)([{type:"confirm",name:"force",message:"We found a .storybook config directory in your project. Therefore we assume that Storybook is already instantiated for your project. Do you still want to continue and force the initialization?"}]);logger5.log(),force?options.force=!0:process.exit(0)}options.skipInstall||await packageManager.installDependencies();let installResult=await installStorybook(projectType,packageManager,options);if(options.skipInstall||await packageManager.installDependencies(),options.disableTelemetry||await(0,import_telemetry2.telemetry)("init",{projectType}),projectType==="REACT_NATIVE")return logger5.log(import_ts_dedent7.default`
|
|
102
|
+
${import_chalk4.default.yellow("NOTE: installation is not 100% automated.")}
|
|
103
|
+
|
|
104
|
+
To run Storybook, you will need to:
|
|
105
|
+
|
|
106
|
+
1. Replace the contents of your app entry with the following
|
|
107
|
+
|
|
108
|
+
${import_chalk4.default.inverse(" export {default} from './.storybook'; ")}
|
|
109
|
+
|
|
110
|
+
2. Enable transformer.unstable_allowRequireContext in your metro config
|
|
111
|
+
|
|
112
|
+
For a more detailed guide go to:
|
|
113
|
+
${import_chalk4.default.cyan("https://github.com/storybookjs/react-native#existing-project")}
|
|
114
|
+
|
|
115
|
+
Then to run your Storybook, type:
|
|
116
|
+
|
|
117
|
+
${import_chalk4.default.inverse(" "+packageManager.getRunCommand("start")+" ")}
|
|
118
|
+
|
|
119
|
+
`),{shouldRunDev:!1};let storybookCommand=projectType==="ANGULAR"?`ng run ${installResult.projectName}:storybook`:packageManager.getRunStorybookCommand();return logger5.log((0,import_boxen2.default)(import_ts_dedent7.default`
|
|
108
120
|
Storybook was successfully installed in your project! 🎉
|
|
109
121
|
To run Storybook manually, run ${import_chalk4.default.yellow(import_chalk4.default.bold(storybookCommand))}. CTRL+C to stop.
|
|
110
122
|
|
|
@@ -410,15 +422,15 @@ ${error.stack}`),fixSummary.failed[f.id]=error.message),fixResults[f.id]="check_
|
|
|
410
422
|
|
|
411
423
|
To learn more about this change, see: ${import_chalk27.default.yellow("https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#mdx-docs-files")}
|
|
412
424
|
`},async run({dryRun,mainConfigPath,result:{nextStoriesEntries}}){logger21.info(import_ts_dedent33.default`✅ Setting 'stories' config:
|
|
413
|
-
${JSON.stringify(nextStoriesEntries,null,2)}`),dryRun||await updateMainConfig({mainConfigPath,dryRun:!!dryRun},async main=>{main.setFieldValue(["stories"],nextStoriesEntries)})}};var import_core_common19=require("@storybook/core-common");var logger22=console;async function migrate(migration,{glob:glob2,dryRun,list,rename,parser}){if(list)(0,import_codemod.listCodemods)().forEach(key=>logger22.log(key));else if(migration)migration==="mdx-to-csf"&&!dryRun&&(await runFixes({fixes:[bareMdxStoriesGlob]}),await addStorybookBlocksPackage()),await(0,import_codemod.runCodemod)(migration,{glob:glob2,dryRun,logger:logger22,rename,parser});else throw new Error("Migrate: please specify a migration name or --list")}async function addStorybookBlocksPackage(){let packageManager=import_core_common19.JsPackageManagerFactory.getPackageManager(),packageJson=await packageManager.retrievePackageJson(),versionToInstall=getStorybookVersionSpecifier(await packageManager.retrievePackageJson());logger22.info('\u2705 Adding "@storybook/blocks" package'),await packageManager.addDependencies({installAsDevDependencies:!0,packageJson},[`@storybook/blocks@${versionToInstall}`])}var import_cross_spawn=require("cross-spawn"),import_telemetry3=require("@storybook/telemetry"),import_semver22=__toESM(require("semver")),import_node_logger4=require("@storybook/node-logger"),import_core_server2=require("@storybook/core-server"),import_server_errors4=require("@storybook/core-events/server-errors"),import_chalk28=__toESM(require("chalk")),import_ts_dedent34=__toESM(require("ts-dedent")),import_boxen5=__toESM(require_boxen()),import_core_common20=require("@storybook/core-common");var versionRegex=/(@storybook\/[^@]+)@(\S+)/,getStorybookVersion4=line=>{if(line.startsWith("npm "))return null;let match=versionRegex.exec(line);return!match||!import_semver22.default.clean(match[2])?null:{package:match[1],version:match[2]}},deprecatedPackages=[{minVersion:"6.0.0-alpha.0",url:"https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#60-deprecations",deprecations:["@storybook/addon-notes","@storybook/addon-info","@storybook/addon-contexts","@storybook/addon-options","@storybook/addon-centered"]}],formatPackage=pkg2=>`${pkg2.package}@${pkg2.version}`,warnPackages=pkgs=>pkgs.forEach(pkg2=>import_node_logger4.logger.warn(`- ${formatPackage(pkg2)}`)),checkVersionConsistency=()=>{let storybookPackages=(0,import_cross_spawn.sync)("npm",["ls"],{stdio:"pipe",shell:!0}).output.toString().split(`
|
|
414
|
-
`).map(getStorybookVersion4).filter(item=>!!item).filter(pkg2=>(0,import_core_common20.isCorePackage)(pkg2.package));if(!storybookPackages.length){import_node_logger4.logger.warn("No storybook core packages found."),import_node_logger4.logger.warn("'npm ls | grep storybook' can show if multiple versions are installed.");return}storybookPackages.sort((a,b)=>import_semver22.default.rcompare(a.version,b.version));let latestVersion=storybookPackages[0].version,outdated=storybookPackages.filter(pkg2=>pkg2.version!==latestVersion);outdated.length>0&&(import_node_logger4.logger.warn(`Found ${outdated.length} outdated packages (relative to '${formatPackage(storybookPackages[0])}')`),import_node_logger4.logger.warn("Please make sure your packages are updated to ensure a consistent experience."),warnPackages(outdated)),deprecatedPackages.forEach(({minVersion:minVersion2,url,deprecations})=>{if(import_semver22.default.gte(latestVersion,minVersion2)){let deprecated=storybookPackages.filter(pkg2=>deprecations.includes(pkg2.package));deprecated.length>0&&(import_node_logger4.logger.warn(`Found ${deprecated.length} deprecated packages since ${minVersion2}`),import_node_logger4.logger.warn(`See ${url}`),warnPackages(deprecated))}})},doUpgrade=async({skipCheck,packageManager:pkgMgr,dryRun,configDir,yes,...options})=>{let packageManager=import_core_common20.JsPackageManagerFactory.getPackageManager({force:pkgMgr}),beforeVersion=await(
|
|
425
|
+
${JSON.stringify(nextStoriesEntries,null,2)}`),dryRun||await updateMainConfig({mainConfigPath,dryRun:!!dryRun},async main=>{main.setFieldValue(["stories"],nextStoriesEntries)})}};var import_core_common19=require("@storybook/core-common");var logger22=console;async function migrate(migration,{glob:glob2,dryRun,list,rename,parser}){if(list)(0,import_codemod.listCodemods)().forEach(key=>logger22.log(key));else if(migration)migration==="mdx-to-csf"&&!dryRun&&(await runFixes({fixes:[bareMdxStoriesGlob]}),await addStorybookBlocksPackage()),await(0,import_codemod.runCodemod)(migration,{glob:glob2,dryRun,logger:logger22,rename,parser});else throw new Error("Migrate: please specify a migration name or --list")}async function addStorybookBlocksPackage(){let packageManager=import_core_common19.JsPackageManagerFactory.getPackageManager(),packageJson=await packageManager.retrievePackageJson(),versionToInstall=getStorybookVersionSpecifier(await packageManager.retrievePackageJson());logger22.info('\u2705 Adding "@storybook/blocks" package'),await packageManager.addDependencies({installAsDevDependencies:!0,packageJson},[`@storybook/blocks@${versionToInstall}`])}var import_cross_spawn=require("cross-spawn"),import_telemetry3=require("@storybook/telemetry"),import_semver22=__toESM(require("semver")),import_node_logger4=require("@storybook/node-logger"),import_core_server2=require("@storybook/core-server"),import_server_errors4=require("@storybook/core-events/server-errors"),import_chalk28=__toESM(require("chalk")),import_ts_dedent34=__toESM(require("ts-dedent")),import_boxen5=__toESM(require_boxen()),import_core_common20=require("@storybook/core-common");var versionRegex=/(@storybook\/[^@]+)@(\S+)/,getStorybookVersion4=line=>{if(line.startsWith("npm "))return null;let match=versionRegex.exec(line);return!match||!import_semver22.default.clean(match[2])?null:{package:match[1],version:match[2]}},getInstalledStorybookVersion=async packageManager=>{let installations=await packageManager.findInstallations(["storybook","@storybook/cli"]);if(!installations)return;let cliVersion=installations.dependencies["@storybook/cli"]?.[0].version;return cliVersion||installations.dependencies.storybook?.[0].version},deprecatedPackages=[{minVersion:"6.0.0-alpha.0",url:"https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#60-deprecations",deprecations:["@storybook/addon-notes","@storybook/addon-info","@storybook/addon-contexts","@storybook/addon-options","@storybook/addon-centered"]}],formatPackage=pkg2=>`${pkg2.package}@${pkg2.version}`,warnPackages=pkgs=>pkgs.forEach(pkg2=>import_node_logger4.logger.warn(`- ${formatPackage(pkg2)}`)),checkVersionConsistency=()=>{let storybookPackages=(0,import_cross_spawn.sync)("npm",["ls"],{stdio:"pipe",shell:!0}).output.toString().split(`
|
|
426
|
+
`).map(getStorybookVersion4).filter(item=>!!item).filter(pkg2=>(0,import_core_common20.isCorePackage)(pkg2.package));if(!storybookPackages.length){import_node_logger4.logger.warn("No storybook core packages found."),import_node_logger4.logger.warn("'npm ls | grep storybook' can show if multiple versions are installed.");return}storybookPackages.sort((a,b)=>import_semver22.default.rcompare(a.version,b.version));let latestVersion=storybookPackages[0].version,outdated=storybookPackages.filter(pkg2=>pkg2.version!==latestVersion);outdated.length>0&&(import_node_logger4.logger.warn(`Found ${outdated.length} outdated packages (relative to '${formatPackage(storybookPackages[0])}')`),import_node_logger4.logger.warn("Please make sure your packages are updated to ensure a consistent experience."),warnPackages(outdated)),deprecatedPackages.forEach(({minVersion:minVersion2,url,deprecations})=>{if(import_semver22.default.gte(latestVersion,minVersion2)){let deprecated=storybookPackages.filter(pkg2=>deprecations.includes(pkg2.package));deprecated.length>0&&(import_node_logger4.logger.warn(`Found ${deprecated.length} deprecated packages since ${minVersion2}`),import_node_logger4.logger.warn(`See ${url}`),warnPackages(deprecated))}})},doUpgrade=async({skipCheck,packageManager:pkgMgr,dryRun,configDir,yes,...options})=>{let packageManager=import_core_common20.JsPackageManagerFactory.getPackageManager({force:pkgMgr}),beforeVersion=await getInstalledStorybookVersion(packageManager)??"0.0.0",currentVersion=import_core_common20.versions["@storybook/cli"],isCanary=currentVersion.startsWith("0.0.0");if(!isCanary&&(0,import_semver22.lt)(currentVersion,beforeVersion))throw new import_server_errors4.UpgradeStorybookToLowerVersionError({beforeVersion,currentVersion});if(!isCanary&&(0,import_semver22.eq)(currentVersion,beforeVersion))throw new import_server_errors4.UpgradeStorybookToSameVersionError({beforeVersion});let latestVersion=await packageManager.latestVersion("@storybook/cli"),isOutdated=(0,import_semver22.lt)(currentVersion,latestVersion),isPrerelease=(0,import_semver22.prerelease)(currentVersion)!==null,borderColor=isOutdated?"#FC521F":"#F1618C",messages={welcome:`Upgrading Storybook from version ${import_chalk28.default.bold(beforeVersion)} to version ${import_chalk28.default.bold(currentVersion)}..`,notLatest:import_chalk28.default.red(import_ts_dedent34.default`
|
|
415
427
|
This version is behind the latest release, which is: ${import_chalk28.default.bold(latestVersion)}!
|
|
416
428
|
You likely ran the upgrade command through npx, which can use a locally cached version, to upgrade to the latest version please run:
|
|
417
429
|
${import_chalk28.default.bold("npx storybook@latest upgrade")}
|
|
418
430
|
|
|
419
431
|
You may want to CTRL+C to stop, and run with the latest version instead.
|
|
420
432
|
`),prelease:import_chalk28.default.yellow("This is a pre-release version.")};import_node_logger4.logger.plain((0,import_boxen5.default)([messages.welcome].concat(isOutdated&&!isPrerelease?[messages.notLatest]:[]).concat(isPrerelease?[messages.prelease]:[]).join(`
|
|
421
|
-
`),{borderStyle:"round",padding:1,borderColor}));let packageJson=await packageManager.retrievePackageJson(),toUpgradedDependencies=deps=>Object.keys(deps||{}).filter(dependency=>{if(dependency==="@storybook/preset-create-react-app"){let reactScriptsVersion=packageJson.dependencies["react-scripts"]??packageJson.devDependencies["react-scripts"];if(reactScriptsVersion&&(0,import_semver22.lt)(coerceSemver(reactScriptsVersion),"5.0.0"))return!1}return dependency in import_core_common20.versions}).map(dependency=>`${dependency}@${(!isOutdated||isPrerelease)&&!isCanary?"^":""}${import_core_common20.versions[dependency]}`),upgradedDependencies=toUpgradedDependencies(packageJson.dependencies),upgradedDevDependencies=toUpgradedDependencies(packageJson.devDependencies);dryRun||((0,import_core_common20.commandLog)(`Updating dependencies in ${import_chalk28.default.cyan("package.json")}..`),import_node_logger4.logger.plain(""),upgradedDependencies.length>0&&await packageManager.addDependencies({installAsDevDependencies:!1,skipInstall:!0,packageJson},upgradedDependencies),upgradedDevDependencies.length>0&&await packageManager.addDependencies({installAsDevDependencies:!0,skipInstall:!0,packageJson},upgradedDevDependencies),await packageManager.installDependencies());let automigrationResults;if(skipCheck||(checkVersionConsistency(),automigrationResults=await automigrate({dryRun,yes,packageManager:pkgMgr,configDir})),!options.disableTelemetry){let afterVersion=await(0,import_telemetry3.getStorybookCoreVersion)(),{preCheckFailure,fixResults}=automigrationResults||{};(0,import_telemetry3.telemetry)("upgrade",{beforeVersion,afterVersion,...{automigrationResults:preCheckFailure?null:fixResults,automigrationPreCheckFailure:preCheckFailure||null}})}};async function upgrade(options){await(0,import_core_server2.withTelemetry)("upgrade",{cliOptions:options},()=>doUpgrade(options))}var import_prompts9=__toESM(require("prompts")),import_path15=__toESM(require("path")),import_chalk29=__toESM(require("chalk")),import_boxen6=__toESM(require_boxen()),import_ts_dedent35=require("ts-dedent"),import_giget=require("giget"),import_fs_extra9=require("fs-extra"),import_tiny_invariant6=__toESM(require("tiny-invariant")),import_semver23=require("semver");var baseTemplates={"cra/default-js":{name:"Create React App Latest (Webpack | JavaScript)",script:"npx create-react-app {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"cra/default-ts":{name:"Create React App Latest (Webpack | TypeScript)",script:"npx create-react-app {{beforeDir}} --template typescript",skipTasks:["smoke-test","bench"],expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"}},"nextjs/13-ts":{name:"Next.js v13.5 (Webpack | TypeScript)",script:'yarn create next-app {{beforeDir}} -e https://github.com/vercel/next.js/tree/next-13/examples/hello-world && cd {{beforeDir}} && npm pkg set "dependencies.next"="^13.5.6" && yarn && git add . && git commit --amend --no-edit && cd ..',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/default-js":{name:"Next.js Latest (Webpack | JavaScript)",script:'yarn create next-app {{beforeDir}} --javascript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/default-ts":{name:"Next.js Latest (Webpack | TypeScript)",script:'yarn create next-app {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/prerelease":{name:"Next.js Prerelease (Webpack | TypeScript)",script:'npx create-next-app@canary {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"react-vite/default-js":{name:"React Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template react",expected:{framework:"@storybook/react-vite",renderer:"@storybook/react",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"react-vite/default-ts":{name:"React Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template react-ts",expected:{framework:"@storybook/react-vite",renderer:"@storybook/react",builder:"@storybook/builder-vite"},skipTasks:["bench"]},"react-webpack/18-ts":{name:"React Latest (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"react-webpack/17-ts":{name:"React v17 (Webpack | TypeScript)",script:'yarn create webpack5-react {{beforeDir}} --version-react="17" --version-react-dom="17"',expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"solid-vite/default-js":{name:"SolidJS Latest (Vite | JavaScript)",script:"npx degit solidjs/templates/js {{beforeDir}}",expected:{framework:"storybook-solidjs-vite",renderer:"storybook-solidjs",builder:"@storybook/builder-vite"},inDevelopment:!0,skipTasks:["e2e-tests-dev","bench"]},"solid-vite/default-ts":{name:"SolidJS Latest (Vite | TypeScript)",script:"npx degit solidjs/templates/ts {{beforeDir}}",expected:{framework:"storybook-solidjs-vite",renderer:"storybook-solidjs",builder:"@storybook/builder-vite"},inDevelopment:!0,skipTasks:["e2e-tests-dev","bench"]},"vue3-vite/default-js":{name:"Vue v3 (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template vue",expected:{framework:"@storybook/vue3-vite",renderer:"@storybook/vue3",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"vue3-vite/default-ts":{name:"Vue v3 (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template vue-ts",expected:{framework:"@storybook/vue3-vite",renderer:"@storybook/vue3",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"html-webpack/default":{name:"HTML Latest (Webpack | JavaScript)",script:"yarn create webpack5-html {{beforeDir}}",expected:{framework:"@storybook/html-webpack5",renderer:"@storybook/html",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"html-vite/default-js":{name:"HTML Latest (Vite | JavaScript)",script:'npm create vite --yes {{beforeDir}} -- --template vanilla && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/html-vite",renderer:"@storybook/html",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"html-vite/default-ts":{name:"HTML Latest (Vite | TypeScript)",script:'npm create vite --yes {{beforeDir}} -- --template vanilla-ts && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/html-vite",renderer:"@storybook/html",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-vite/default-js":{name:"Svelte Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template svelte",expected:{framework:"@storybook/svelte-vite",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-vite/default-ts":{name:"Svelte Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template svelte-ts",expected:{framework:"@storybook/svelte-vite",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"angular-cli/prerelease":{name:"Angular CLI Prerelease (Webpack | TypeScript)",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",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"angular-cli/default-ts":{name:"Angular CLI Latest (Webpack | TypeScript)",script:"npx -p @angular/cli ng new angular-latest --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn --ssr",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"angular-cli/15-ts":{name:"Angular CLI v15 (Webpack | TypeScript)",script:"npx -p @angular/cli@15 ng new angular-v15 --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/skeleton-js":{name:"SvelteKit Latest (Vite | JavaScript)",script:"yarn create svelte-with-args --name=svelte-kit/skeleton-js --directory={{beforeDir}} --template=skeleton --types=null --no-prettier --no-eslint --no-playwright --no-vitest --no-svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/skeleton-ts":{name:"SvelteKit Latest (Vite | TypeScript)",script:"yarn create svelte-with-args --name=svelte-kit/skeleton-ts --directory={{beforeDir}} --template=skeleton --types=typescript --no-prettier --no-eslint --no-playwright --no-vitest --no-svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/prerelease-ts":{name:"SvelteKit Prerelease (Vite | TypeScript)",script:"yarn create svelte-with-args --name=svelte-kit/prerelease-ts --directory={{beforeDir}} --template=skeleton --types=typescript --no-prettier --no-eslint --no-playwright --no-vitest --svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"lit-vite/default-js":{name:"Lit Latest (Vite | JavaScript)",script:'npm create vite --yes {{beforeDir}} -- --template lit && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/web-components-vite",renderer:"@storybook/web-components",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"lit-vite/default-ts":{name:"Lit Latest (Vite | TypeScript)",script:'npm create vite --yes {{beforeDir}} -- --template lit-ts && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/web-components-vite",renderer:"@storybook/web-components",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"vue-cli/default-js":{name:"Vue CLI v3 (Webpack | JavaScript)",script:'npx -p @vue/cli vue create {{beforeDir}} --default --packageManager=yarn --force --merge && cd {{beforeDir}} && echo "module.exports = {}" > webpack.config.js',expected:{framework:"@storybook/vue3-webpack5",renderer:"@storybook/vue3",builder:"@storybook/builder-webpack5"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"preact-vite/default-js":{name:"Preact Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template preact",expected:{framework:"@storybook/preact-vite",renderer:"@storybook/preact",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"preact-vite/default-ts":{name:"Preact Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template preact-ts",expected:{framework:"@storybook/preact-vite",renderer:"@storybook/preact",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"qwik-vite/default-ts":{name:"Qwik CLI Latest (Vite | TypeScript)",script:"yarn create qwik basic {{beforeDir}}",inDevelopment:!0,expected:{framework:"storybook-framework-qwik",renderer:"storybook-framework-qwik",builder:"storybook-framework-qwik"},skipTasks:["e2e-tests","e2e-tests-dev","bench"]},"ember/3-js":{name:"Ember v3 (Webpack | JavaScript)",script:"npx --package ember-cli@3.28.1 ember new {{beforeDir}}",inDevelopment:!0,expected:{framework:"@storybook/ember",renderer:"@storybook/ember",builder:"@storybook/builder-webpack5"}},"ember/default-js":{name:"Ember v4 (Webpack | JavaScript)",script:"npx --package ember-cli@4.12.1 ember new {{beforeDir}} --yarn && cd {{beforeDir}} && yarn add --dev @storybook/ember-cli-storybook && yarn build",inDevelopment:!0,expected:{framework:"@storybook/ember",renderer:"@storybook/ember",builder:"@storybook/builder-webpack5"}}},internalTemplates={"internal/react18-webpack-babel":{name:"React with Babel Latest (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{extraDependencies:["@storybook/addon-webpack5-compiler-babel"],editAddons:addons=>[...addons,"@storybook/addon-webpack5-compiler-babel"].filter(a=>a!=="@storybook/addon-webpack5-compiler-swc")},isInternal:!0,skipTasks:["e2e-tests-dev","bench"]},"internal/react16-webpack":{name:"React 16 (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}} --version-react=16 --version-react-dom=16 --version-@types/react=16 --version-@types/react-dom=16",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"],isInternal:!0},"internal/server-webpack5":{name:"Server Webpack5",script:'yarn init -y && echo "module.exports = {}" > webpack.config.js',expected:{framework:"@storybook/server-webpack5",renderer:"@storybook/server",builder:"@storybook/builder-webpack5"},isInternal:!0,skipTasks:["bench"]}},benchTemplates={"bench/react-vite-default-ts":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts)",isInternal:!0,modifications:{skipTemplateStories:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-webpack-18-ts":{...baseTemplates["react-webpack/18-ts"],name:"Bench (react-webpack/18-ts)",isInternal:!0,modifications:{skipTemplateStories:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-vite-default-ts-nodocs":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts, no docs)",isInternal:!0,modifications:{skipTemplateStories:!0,disableDocs:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-vite-default-ts-test-build":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts, test-build)",isInternal:!0,modifications:{skipTemplateStories:!0,testBuild:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests"]},"bench/react-webpack-18-ts-test-build":{...baseTemplates["react-webpack/18-ts"],name:"Bench (react-webpack/18-ts, test-build)",isInternal:!0,modifications:{skipTemplateStories:!0,testBuild:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests"]}},allTemplates={...baseTemplates,...internalTemplates,...benchTemplates},normal=["cra/default-ts","react-vite/default-ts","angular-cli/default-ts","vue3-vite/default-ts","lit-vite/default-ts","svelte-vite/default-ts","svelte-kit/skeleton-ts","nextjs/default-ts","bench/react-vite-default-ts","bench/react-webpack-18-ts","bench/react-vite-default-ts-nodocs","bench/react-vite-default-ts-test-build","bench/react-webpack-18-ts-test-build","ember/default-js"],merged=[...normal,"react-webpack/18-ts","react-webpack/17-ts","angular-cli/15-ts","preact-vite/default-ts","html-webpack/default","html-vite/default-ts"],daily=[...merged,"angular-cli/prerelease","cra/default-js","react-vite/default-js","vue3-vite/default-js","vue-cli/default-js","lit-vite/default-js","svelte-kit/skeleton-js","svelte-vite/default-js","nextjs/13-ts","nextjs/default-js","nextjs/prerelease","qwik-vite/default-ts","preact-vite/default-js","html-vite/default-js","internal/react16-webpack","internal/react18-webpack-babel"];var import_core_common21=require("@storybook/core-common"),import_core_common22=require("@storybook/core-common");var logger24=console,toChoices=c=>({title:allTemplates[c].name,value:c}),sandbox=async({output:outputDirectory,filterValue,init,...options},pkg2)=>{let selectedConfig=allTemplates[filterValue],templateId=selectedConfig?filterValue:null,{packageManager:pkgMgr}=options,packageManager=import_core_common21.JsPackageManagerFactory.getPackageManager({force:pkgMgr}),latestVersion=await packageManager.latestVersion("@storybook/cli"),nextVersion=await packageManager.latestVersion("@storybook/cli@next").catch(e=>"0.0.0"),currentVersion=import_core_common22.versions["@storybook/cli"],isPrerelease=(0,import_semver23.prerelease)(currentVersion),isOutdated=(0,import_semver23.lt)(currentVersion,isPrerelease?nextVersion:latestVersion),borderColor=isOutdated?"#FC521F":"#F1618C",downloadType=!isOutdated&&init?"after-storybook":"before-storybook",branch=isPrerelease?"next":"main",messages={welcome:`Creating a Storybook ${import_chalk29.default.bold(currentVersion)} sandbox..`,notLatest:import_chalk29.default.red(import_ts_dedent35.dedent`
|
|
433
|
+
`),{borderStyle:"round",padding:1,borderColor}));let packageJson=await packageManager.retrievePackageJson(),toUpgradedDependencies=deps=>Object.keys(deps||{}).filter(dependency=>{if(dependency==="@storybook/preset-create-react-app"){let reactScriptsVersion=packageJson.dependencies["react-scripts"]??packageJson.devDependencies["react-scripts"];if(reactScriptsVersion&&(0,import_semver22.lt)(coerceSemver(reactScriptsVersion),"5.0.0"))return!1}return dependency in import_core_common20.versions}).map(dependency=>`${dependency}@${(!isOutdated||isPrerelease)&&!isCanary?"^":""}${import_core_common20.versions[dependency]}`),upgradedDependencies=toUpgradedDependencies(packageJson.dependencies),upgradedDevDependencies=toUpgradedDependencies(packageJson.devDependencies);dryRun||((0,import_core_common20.commandLog)(`Updating dependencies in ${import_chalk28.default.cyan("package.json")}..`),import_node_logger4.logger.plain(""),upgradedDependencies.length>0&&await packageManager.addDependencies({installAsDevDependencies:!1,skipInstall:!0,packageJson},upgradedDependencies),upgradedDevDependencies.length>0&&await packageManager.addDependencies({installAsDevDependencies:!0,skipInstall:!0,packageJson},upgradedDevDependencies),await packageManager.installDependencies());let automigrationResults;if(skipCheck||(checkVersionConsistency(),automigrationResults=await automigrate({dryRun,yes,packageManager:pkgMgr,configDir})),!options.disableTelemetry){let afterVersion=await getInstalledStorybookVersion(packageManager),{preCheckFailure,fixResults}=automigrationResults||{};(0,import_telemetry3.telemetry)("upgrade",{beforeVersion,afterVersion,...{automigrationResults:preCheckFailure?null:fixResults,automigrationPreCheckFailure:preCheckFailure||null}})}};async function upgrade(options){await(0,import_core_server2.withTelemetry)("upgrade",{cliOptions:options},()=>doUpgrade(options))}var import_prompts9=__toESM(require("prompts")),import_path15=__toESM(require("path")),import_chalk29=__toESM(require("chalk")),import_boxen6=__toESM(require_boxen()),import_ts_dedent35=require("ts-dedent"),import_giget=require("giget"),import_fs_extra9=require("fs-extra"),import_tiny_invariant6=__toESM(require("tiny-invariant")),import_semver23=require("semver");var baseTemplates={"cra/default-js":{name:"Create React App Latest (Webpack | JavaScript)",script:"npx create-react-app {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"cra/default-ts":{name:"Create React App Latest (Webpack | TypeScript)",script:"npx create-react-app {{beforeDir}} --template typescript",skipTasks:["smoke-test","bench"],expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"}},"nextjs/13-ts":{name:"Next.js v13.5 (Webpack | TypeScript)",script:'yarn create next-app {{beforeDir}} -e https://github.com/vercel/next.js/tree/next-13/examples/hello-world && cd {{beforeDir}} && npm pkg set "dependencies.next"="^13.5.6" && yarn && git add . && git commit --amend --no-edit && cd ..',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/default-js":{name:"Next.js Latest (Webpack | JavaScript)",script:'yarn create next-app {{beforeDir}} --javascript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/default-ts":{name:"Next.js Latest (Webpack | TypeScript)",script:'yarn create next-app {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/prerelease":{name:"Next.js Prerelease (Webpack | TypeScript)",script:'npx create-next-app@canary {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"react-vite/default-js":{name:"React Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template react",expected:{framework:"@storybook/react-vite",renderer:"@storybook/react",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"react-vite/default-ts":{name:"React Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template react-ts",expected:{framework:"@storybook/react-vite",renderer:"@storybook/react",builder:"@storybook/builder-vite"},skipTasks:["bench"]},"react-webpack/18-ts":{name:"React Latest (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"react-webpack/17-ts":{name:"React v17 (Webpack | TypeScript)",script:'yarn create webpack5-react {{beforeDir}} --version-react="17" --version-react-dom="17"',expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"solid-vite/default-js":{name:"SolidJS Latest (Vite | JavaScript)",script:"npx degit solidjs/templates/js {{beforeDir}}",expected:{framework:"storybook-solidjs-vite",renderer:"storybook-solidjs",builder:"@storybook/builder-vite"},inDevelopment:!0,skipTasks:["e2e-tests-dev","bench"]},"solid-vite/default-ts":{name:"SolidJS Latest (Vite | TypeScript)",script:"npx degit solidjs/templates/ts {{beforeDir}}",expected:{framework:"storybook-solidjs-vite",renderer:"storybook-solidjs",builder:"@storybook/builder-vite"},inDevelopment:!0,skipTasks:["e2e-tests-dev","bench"]},"vue3-vite/default-js":{name:"Vue v3 (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template vue",expected:{framework:"@storybook/vue3-vite",renderer:"@storybook/vue3",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"vue3-vite/default-ts":{name:"Vue v3 (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template vue-ts",expected:{framework:"@storybook/vue3-vite",renderer:"@storybook/vue3",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"html-webpack/default":{name:"HTML Latest (Webpack | JavaScript)",script:"yarn create webpack5-html {{beforeDir}}",expected:{framework:"@storybook/html-webpack5",renderer:"@storybook/html",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"html-vite/default-js":{name:"HTML Latest (Vite | JavaScript)",script:'npm create vite --yes {{beforeDir}} -- --template vanilla && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/html-vite",renderer:"@storybook/html",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"html-vite/default-ts":{name:"HTML Latest (Vite | TypeScript)",script:'npm create vite --yes {{beforeDir}} -- --template vanilla-ts && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/html-vite",renderer:"@storybook/html",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-vite/default-js":{name:"Svelte Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template svelte",expected:{framework:"@storybook/svelte-vite",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-vite/default-ts":{name:"Svelte Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template svelte-ts",expected:{framework:"@storybook/svelte-vite",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"angular-cli/prerelease":{name:"Angular CLI Prerelease (Webpack | TypeScript)",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",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"angular-cli/default-ts":{name:"Angular CLI Latest (Webpack | TypeScript)",script:"npx -p @angular/cli ng new angular-latest --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn --ssr",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"angular-cli/15-ts":{name:"Angular CLI v15 (Webpack | TypeScript)",script:"npx -p @angular/cli@15 ng new angular-v15 --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/skeleton-js":{name:"SvelteKit Latest (Vite | JavaScript)",script:"yarn create svelte-with-args --name=svelte-kit/skeleton-js --directory={{beforeDir}} --template=skeleton --types=null --no-prettier --no-eslint --no-playwright --no-vitest --no-svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/skeleton-ts":{name:"SvelteKit Latest (Vite | TypeScript)",script:"yarn create svelte-with-args --name=svelte-kit/skeleton-ts --directory={{beforeDir}} --template=skeleton --types=typescript --no-prettier --no-eslint --no-playwright --no-vitest --no-svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/prerelease-ts":{name:"SvelteKit Prerelease (Vite | TypeScript)",script:"yarn create svelte-with-args --name=svelte-kit/prerelease-ts --directory={{beforeDir}} --template=skeleton --types=typescript --no-prettier --no-eslint --no-playwright --no-vitest --svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"lit-vite/default-js":{name:"Lit Latest (Vite | JavaScript)",script:'npm create vite --yes {{beforeDir}} -- --template lit && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/web-components-vite",renderer:"@storybook/web-components",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"lit-vite/default-ts":{name:"Lit Latest (Vite | TypeScript)",script:'npm create vite --yes {{beforeDir}} -- --template lit-ts && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/web-components-vite",renderer:"@storybook/web-components",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"vue-cli/default-js":{name:"Vue CLI v3 (Webpack | JavaScript)",script:'npx -p @vue/cli vue create {{beforeDir}} --default --packageManager=yarn --force --merge && cd {{beforeDir}} && echo "module.exports = {}" > webpack.config.js',expected:{framework:"@storybook/vue3-webpack5",renderer:"@storybook/vue3",builder:"@storybook/builder-webpack5"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"preact-vite/default-js":{name:"Preact Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template preact",expected:{framework:"@storybook/preact-vite",renderer:"@storybook/preact",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"preact-vite/default-ts":{name:"Preact Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template preact-ts",expected:{framework:"@storybook/preact-vite",renderer:"@storybook/preact",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"qwik-vite/default-ts":{name:"Qwik CLI Latest (Vite | TypeScript)",script:"yarn create qwik basic {{beforeDir}}",inDevelopment:!0,expected:{framework:"storybook-framework-qwik",renderer:"storybook-framework-qwik",builder:"storybook-framework-qwik"},skipTasks:["e2e-tests","e2e-tests-dev","bench"]},"ember/3-js":{name:"Ember v3 (Webpack | JavaScript)",script:"npx --package ember-cli@3.28.1 ember new {{beforeDir}}",inDevelopment:!0,expected:{framework:"@storybook/ember",renderer:"@storybook/ember",builder:"@storybook/builder-webpack5"}},"ember/default-js":{name:"Ember v4 (Webpack | JavaScript)",script:"npx --package ember-cli@4.12.1 ember new {{beforeDir}} --yarn && cd {{beforeDir}} && yarn add --dev @storybook/ember-cli-storybook && yarn build",inDevelopment:!0,expected:{framework:"@storybook/ember",renderer:"@storybook/ember",builder:"@storybook/builder-webpack5"}}},internalTemplates={"internal/react18-webpack-babel":{name:"React with Babel Latest (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{extraDependencies:["@storybook/addon-webpack5-compiler-babel"],editAddons:addons=>[...addons,"@storybook/addon-webpack5-compiler-babel"].filter(a=>a!=="@storybook/addon-webpack5-compiler-swc")},isInternal:!0,skipTasks:["e2e-tests-dev","bench"]},"internal/react16-webpack":{name:"React 16 (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}} --version-react=16 --version-react-dom=16 --version-@types/react=16 --version-@types/react-dom=16",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"],isInternal:!0},"internal/server-webpack5":{name:"Server Webpack5",script:'yarn init -y && echo "module.exports = {}" > webpack.config.js',expected:{framework:"@storybook/server-webpack5",renderer:"@storybook/server",builder:"@storybook/builder-webpack5"},isInternal:!0,skipTasks:["bench"]}},benchTemplates={"bench/react-vite-default-ts":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts)",isInternal:!0,modifications:{skipTemplateStories:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-webpack-18-ts":{...baseTemplates["react-webpack/18-ts"],name:"Bench (react-webpack/18-ts)",isInternal:!0,modifications:{skipTemplateStories:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-vite-default-ts-nodocs":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts, no docs)",isInternal:!0,modifications:{skipTemplateStories:!0,disableDocs:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-vite-default-ts-test-build":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts, test-build)",isInternal:!0,modifications:{skipTemplateStories:!0,testBuild:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests"]},"bench/react-webpack-18-ts-test-build":{...baseTemplates["react-webpack/18-ts"],name:"Bench (react-webpack/18-ts, test-build)",isInternal:!0,modifications:{skipTemplateStories:!0,testBuild:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests"]}},allTemplates={...baseTemplates,...internalTemplates,...benchTemplates},normal=["cra/default-ts","react-vite/default-ts","angular-cli/default-ts","vue3-vite/default-ts","lit-vite/default-ts","svelte-vite/default-ts","svelte-kit/skeleton-ts","nextjs/default-ts","bench/react-vite-default-ts","bench/react-webpack-18-ts","bench/react-vite-default-ts-nodocs","bench/react-vite-default-ts-test-build","bench/react-webpack-18-ts-test-build","ember/default-js"],merged=[...normal,"react-webpack/18-ts","react-webpack/17-ts","angular-cli/15-ts","preact-vite/default-ts","html-webpack/default","html-vite/default-ts"],daily=[...merged,"angular-cli/prerelease","cra/default-js","react-vite/default-js","vue3-vite/default-js","vue-cli/default-js","lit-vite/default-js","svelte-kit/skeleton-js","svelte-vite/default-js","nextjs/13-ts","nextjs/default-js","nextjs/prerelease","qwik-vite/default-ts","preact-vite/default-js","html-vite/default-js","internal/react16-webpack","internal/react18-webpack-babel"];var import_core_common21=require("@storybook/core-common"),import_core_common22=require("@storybook/core-common");var logger24=console,toChoices=c=>({title:allTemplates[c].name,value:c}),sandbox=async({output:outputDirectory,filterValue,init,...options},pkg2)=>{let selectedConfig=allTemplates[filterValue],templateId=selectedConfig?filterValue:null,{packageManager:pkgMgr}=options,packageManager=import_core_common21.JsPackageManagerFactory.getPackageManager({force:pkgMgr}),latestVersion=await packageManager.latestVersion("@storybook/cli"),nextVersion=await packageManager.latestVersion("@storybook/cli@next").catch(e=>"0.0.0"),currentVersion=import_core_common22.versions["@storybook/cli"],isPrerelease=(0,import_semver23.prerelease)(currentVersion),isOutdated=(0,import_semver23.lt)(currentVersion,isPrerelease?nextVersion:latestVersion),borderColor=isOutdated?"#FC521F":"#F1618C",downloadType=!isOutdated&&init?"after-storybook":"before-storybook",branch=isPrerelease?"next":"main",messages={welcome:`Creating a Storybook ${import_chalk29.default.bold(currentVersion)} sandbox..`,notLatest:import_chalk29.default.red(import_ts_dedent35.dedent`
|
|
422
434
|
This version is behind the latest release, which is: ${import_chalk29.default.bold(latestVersion)}!
|
|
423
435
|
You likely ran the init command through npx, which can use a locally cached version, to get the latest please run:
|
|
424
436
|
${import_chalk29.default.bold("npx storybook@latest sandbox")}
|
package/dist/generate.mjs
CHANGED
|
@@ -5,8 +5,8 @@ import leven from 'leven';
|
|
|
5
5
|
import { sync } from 'read-pkg-up';
|
|
6
6
|
import invariant5 from 'tiny-invariant';
|
|
7
7
|
import { logger, instance } from '@storybook/node-logger';
|
|
8
|
-
import { addToGlobalContext, telemetry
|
|
9
|
-
import { versions, removeAddon, JsPackageManagerFactory, parseList, getEnvConfig, getStorybookInfo, isCorePackage, getStorybookVersion, loadMainConfig, cache, commandLog, paddedLog, HandledError,
|
|
8
|
+
import { addToGlobalContext, telemetry } from '@storybook/telemetry';
|
|
9
|
+
import { versions, removeAddon, JsPackageManagerFactory, parseList, getEnvConfig, getStorybookInfo, isCorePackage, getStorybookVersion, loadMainConfig, cache, commandLog, paddedLog, HandledError, serverRequire, frameworkPackages, rendererPackages, commonGlobOptions, builderPackages, getPackageDetails } from '@storybook/core-common';
|
|
10
10
|
import prompts5 from 'prompts';
|
|
11
11
|
import { withTelemetry, buildDevStandalone, buildStaticStandalone } from '@storybook/core-server';
|
|
12
12
|
import { UpgradeStorybookToLowerVersionError, UpgradeStorybookToSameVersionError, GenerateNewProjectOnInitError, NxProjectDetectedError, MissingAngularJsonError } from '@storybook/core-events/server-errors';
|
|
@@ -95,7 +95,7 @@ We were not able to detect the right builder for your project. Please select one
|
|
|
95
95
|
import { setCompodocJson } from "@storybook/addon-docs/angular";
|
|
96
96
|
import docJson from "../documentation.json";
|
|
97
97
|
setCompodocJson(docJson);
|
|
98
|
-
`.trimStart(),promptForCompoDocs=async()=>{let{useCompoDoc}=await prompts5({type:"confirm",name:"useCompoDoc",message:"Do you want to use Compodoc for documentation?"});return useCompoDoc},AngularJSON=class{constructor(){if(!fs2__default.existsSync(ANGULAR_JSON_PATH))throw new MissingAngularJsonError({path:join(process.cwd(),ANGULAR_JSON_PATH)});let jsonContent=fs2__default.readFileSync(ANGULAR_JSON_PATH,"utf8");this.json=JSON.parse(jsonContent);}get projects(){return this.json.projects}get projectsWithoutStorybook(){return Object.keys(this.projects).filter(projectName=>{let{architect}=this.projects[projectName];return !architect.storybook})}get hasStorybookBuilder(){return Object.keys(this.projects).some(projectName=>{let{architect}=this.projects[projectName];return Object.keys(architect).some(key=>architect[key].builder==="@storybook/angular:start-storybook")})}get rootProject(){let rootProjectName=Object.keys(this.projects).find(projectName=>{let{root}=this.projects[projectName];return root===""||root==="."});return rootProjectName?this.projects[rootProjectName]:null}getProjectSettingsByName(projectName){return this.projects[projectName]}async getProjectName(){if(this.projectsWithoutStorybook.length>1){let{projectName}=await prompts5({type:"select",name:"projectName",message:"For which project do you want to generate Storybook configuration?",choices:this.projectsWithoutStorybook.map(name=>({title:name,value:name}))});return projectName}return this.projectsWithoutStorybook[0]}addStorybookEntries({angularProjectName,storybookFolder,useCompodoc,root}){let{architect}=this.projects[angularProjectName],baseOptions={configDir:storybookFolder,browserTarget:`${angularProjectName}:build`,compodoc:useCompodoc,...useCompodoc&&{compodocArgs:["-e","json","-d",root||"."]}};architect.storybook||(architect.storybook={builder:"@storybook/angular:start-storybook",options:{...baseOptions,port:6006}}),architect["build-storybook"]||(architect["build-storybook"]={builder:"@storybook/angular:build-storybook",options:{...baseOptions,outputDir:Object.keys(this.projects).length===1?"storybook-static":`dist/storybook/${angularProjectName}`}});}write(){fs2__default.writeFileSync(ANGULAR_JSON_PATH,JSON.stringify(this.json,null,2));}};var generator=async(packageManager,npmOptions,options,commandOptions)=>{let angularJSON=new AngularJSON;if(!angularJSON.projects||angularJSON.projects&&Object.keys(angularJSON.projects).length===0)throw new Error("Storybook was not able to find any projects in your angular.json file. Are you sure this is an Angular CLI project?");if(angularJSON.projectsWithoutStorybook.length===0)throw new Error("Every project in your workspace is already set up with Storybook. There is nothing to do!");let angularProjectName=await angularJSON.getProjectName();paddedLog(`Adding Storybook support to your "${angularProjectName}" project`);let angularProject=angularJSON.getProjectSettingsByName(angularProjectName);if(!angularProject)throw new Error(`Somehow we were not able to retrieve the "${angularProjectName}" project in your angular.json file. This is likely a bug in Storybook, please file an issue.`);let{root,projectType}=angularProject,{projects}=angularJSON,useCompodoc=commandOptions?.yes?!0:await promptForCompoDocs(),storybookFolder=root?`${root}/.storybook`:".storybook";angularJSON.addStorybookEntries({angularProjectName,storybookFolder,useCompodoc,root}),angularJSON.write(),await baseGenerator(packageManager,npmOptions,{...options,builder:"webpack5",...useCompodoc&&{frameworkPreviewParts:{prefix:compoDocPreviewPrefix}}},"angular",{...useCompodoc&&{extraPackages:["@compodoc/compodoc","@storybook/addon-docs"]},addScripts:!1,componentsDestinationPath:root?`${root}/src/stories`:void 0,storybookConfigFolder:storybookFolder,webpackCompiler:()=>{}},"angular"),Object.keys(projects).length===1&&packageManager.addScripts({storybook:`ng run ${angularProjectName}:storybook`,"build-storybook":`ng run ${angularProjectName}:build-storybook`});let projectTypeValue=projectType||"application";projectTypeValue!=="application"&&projectTypeValue!=="library"&&(projectTypeValue="application");let templateDir=join(getCliDir(),"templates","angular",projectTypeValue);return templateDir&©Template(templateDir,root||void 0),{projectName:angularProjectName,configDir:storybookFolder}},ANGULAR_default=generator;var generator2=async(packageManager,npmOptions,options)=>{await baseGenerator(packageManager,npmOptions,{...options,builder:"webpack5"},"ember",{staticDir:"dist"},"ember");},EMBER_default=generator2;var generator3=async(packageManager,npmOptions,options)=>{let extraPackages=await detectLanguage(packageManager)==="javascript"?["prop-types"]:[];await baseGenerator(packageManager,npmOptions,options,"react",{extraPackages,webpackCompiler:({builder})=>builder==="webpack5"?"swc":void 0,extraAddons:["@storybook/addon-onboarding@^1.0.0"]});},REACT_default=generator3;var generator4=async(packageManager,npmOptions)=>{let packageJson=await packageManager.retrievePackageJson(),missingReactDom=!packageJson.dependencies["react-dom"]&&!packageJson.devDependencies["react-dom"],reactVersion=packageJson.dependencies.react,packagesToResolve=["react-native-safe-area-context","@react-native-async-storage/async-storage","@react-native-community/datetimepicker","@react-native-community/slider","@storybook/addon-ondevice-controls","@storybook/addon-ondevice-actions","@storybook/react-native"],packagesWithFixedVersion=[
|
|
98
|
+
`.trimStart(),promptForCompoDocs=async()=>{let{useCompoDoc}=await prompts5({type:"confirm",name:"useCompoDoc",message:"Do you want to use Compodoc for documentation?"});return useCompoDoc},AngularJSON=class{constructor(){if(!fs2__default.existsSync(ANGULAR_JSON_PATH))throw new MissingAngularJsonError({path:join(process.cwd(),ANGULAR_JSON_PATH)});let jsonContent=fs2__default.readFileSync(ANGULAR_JSON_PATH,"utf8");this.json=JSON.parse(jsonContent);}get projects(){return this.json.projects}get projectsWithoutStorybook(){return Object.keys(this.projects).filter(projectName=>{let{architect}=this.projects[projectName];return !architect.storybook})}get hasStorybookBuilder(){return Object.keys(this.projects).some(projectName=>{let{architect}=this.projects[projectName];return Object.keys(architect).some(key=>architect[key].builder==="@storybook/angular:start-storybook")})}get rootProject(){let rootProjectName=Object.keys(this.projects).find(projectName=>{let{root}=this.projects[projectName];return root===""||root==="."});return rootProjectName?this.projects[rootProjectName]:null}getProjectSettingsByName(projectName){return this.projects[projectName]}async getProjectName(){if(this.projectsWithoutStorybook.length>1){let{projectName}=await prompts5({type:"select",name:"projectName",message:"For which project do you want to generate Storybook configuration?",choices:this.projectsWithoutStorybook.map(name=>({title:name,value:name}))});return projectName}return this.projectsWithoutStorybook[0]}addStorybookEntries({angularProjectName,storybookFolder,useCompodoc,root}){let{architect}=this.projects[angularProjectName],baseOptions={configDir:storybookFolder,browserTarget:`${angularProjectName}:build`,compodoc:useCompodoc,...useCompodoc&&{compodocArgs:["-e","json","-d",root||"."]}};architect.storybook||(architect.storybook={builder:"@storybook/angular:start-storybook",options:{...baseOptions,port:6006}}),architect["build-storybook"]||(architect["build-storybook"]={builder:"@storybook/angular:build-storybook",options:{...baseOptions,outputDir:Object.keys(this.projects).length===1?"storybook-static":`dist/storybook/${angularProjectName}`}});}write(){fs2__default.writeFileSync(ANGULAR_JSON_PATH,JSON.stringify(this.json,null,2));}};var generator=async(packageManager,npmOptions,options,commandOptions)=>{let angularJSON=new AngularJSON;if(!angularJSON.projects||angularJSON.projects&&Object.keys(angularJSON.projects).length===0)throw new Error("Storybook was not able to find any projects in your angular.json file. Are you sure this is an Angular CLI project?");if(angularJSON.projectsWithoutStorybook.length===0)throw new Error("Every project in your workspace is already set up with Storybook. There is nothing to do!");let angularProjectName=await angularJSON.getProjectName();paddedLog(`Adding Storybook support to your "${angularProjectName}" project`);let angularProject=angularJSON.getProjectSettingsByName(angularProjectName);if(!angularProject)throw new Error(`Somehow we were not able to retrieve the "${angularProjectName}" project in your angular.json file. This is likely a bug in Storybook, please file an issue.`);let{root,projectType}=angularProject,{projects}=angularJSON,useCompodoc=commandOptions?.yes?!0:await promptForCompoDocs(),storybookFolder=root?`${root}/.storybook`:".storybook";angularJSON.addStorybookEntries({angularProjectName,storybookFolder,useCompodoc,root}),angularJSON.write(),await baseGenerator(packageManager,npmOptions,{...options,builder:"webpack5",...useCompodoc&&{frameworkPreviewParts:{prefix:compoDocPreviewPrefix}}},"angular",{...useCompodoc&&{extraPackages:["@compodoc/compodoc","@storybook/addon-docs"]},addScripts:!1,componentsDestinationPath:root?`${root}/src/stories`:void 0,storybookConfigFolder:storybookFolder,webpackCompiler:()=>{}},"angular"),Object.keys(projects).length===1&&packageManager.addScripts({storybook:`ng run ${angularProjectName}:storybook`,"build-storybook":`ng run ${angularProjectName}:build-storybook`});let projectTypeValue=projectType||"application";projectTypeValue!=="application"&&projectTypeValue!=="library"&&(projectTypeValue="application");let templateDir=join(getCliDir(),"templates","angular",projectTypeValue);return templateDir&©Template(templateDir,root||void 0),{projectName:angularProjectName,configDir:storybookFolder}},ANGULAR_default=generator;var generator2=async(packageManager,npmOptions,options)=>{await baseGenerator(packageManager,npmOptions,{...options,builder:"webpack5"},"ember",{staticDir:"dist"},"ember");},EMBER_default=generator2;var generator3=async(packageManager,npmOptions,options)=>{let extraPackages=await detectLanguage(packageManager)==="javascript"?["prop-types"]:[];await baseGenerator(packageManager,npmOptions,options,"react",{extraPackages,webpackCompiler:({builder})=>builder==="webpack5"?"swc":void 0,extraAddons:["@storybook/addon-onboarding@^1.0.0"]});},REACT_default=generator3;var generator4=async(packageManager,npmOptions)=>{let packageJson=await packageManager.retrievePackageJson(),missingReactDom=!packageJson.dependencies["react-dom"]&&!packageJson.devDependencies["react-dom"],reactVersion=packageJson.dependencies.react,packagesToResolve=["react-native-safe-area-context","@react-native-async-storage/async-storage","@react-native-community/datetimepicker","@react-native-community/slider","@storybook/addon-ondevice-controls","@storybook/addon-ondevice-actions","@storybook/react-native"],packagesWithFixedVersion=[],versionedPackages=await packageManager.getVersionedPackages(packagesToResolve),babelDependencies=await getBabelDependencies(packageManager,packageJson),packages=[];packages.push(...babelDependencies),packages.push(...packagesWithFixedVersion),packages.push(...versionedPackages),missingReactDom&&reactVersion&&packages.push(`react-dom@${reactVersion}`),await packageManager.addDependencies({...npmOptions,packageJson},packages),packageManager.addScripts({"storybook-generate":"sb-rn-get-stories","storybook-watch":"sb-rn-watcher"});let storybookConfigFolder=".storybook";await copyTemplateFiles({packageManager,renderer:"react-native",language:"typescript-3-8",destination:storybookConfigFolder,includeCommonAssets:!1});},REACT_NATIVE_default=generator4;var generator5=async(packageManager,npmOptions,options)=>{let monorepoRootPath=path7.join(__dirname,"..","..","..","..","..",".."),extraMain=options.linkable?{webpackFinal:`%%(config) => {
|
|
99
99
|
// add monorepo root as a valid directory to import modules from
|
|
100
100
|
config.resolve.plugins.forEach((p) => {
|
|
101
101
|
if (Array.isArray(p.appSrcs)) {
|
|
@@ -133,13 +133,25 @@ We were not able to detect the right builder for your project. Please select one
|
|
|
133
133
|
`),prelease:chalk14.yellow("This is a pre-release version.")};logger5.log((0, import_boxen2.default)([messages.welcome].concat(isOutdated&&!isPrerelease?[messages.notLatest]:[]).concat(isPrerelease?[messages.prelease]:[]).join(`
|
|
134
134
|
`),{borderStyle:"round",padding:1,borderColor})),options.force!==!0&¤tDirectoryIsEmpty(packageManager.type)&&(await scaffoldNewProject(packageManager.type,options),(process.env.IN_STORYBOOK_SANDBOX==="true"||process.env.CI==="true")&&packageManager.addPackageResolutions({"@storybook/telemetry":versions["@storybook/telemetry"]}));let projectType,projectTypeProvided=options.type,infoText=projectTypeProvided?`Installing Storybook for user specified project type: ${projectTypeProvided}`:"Detecting project type",done=commandLog(infoText);if(projectTypeProvided)if(installableProjectTypes.includes(projectTypeProvided))projectType=projectTypeProvided.toUpperCase();else throw done(`The provided project type was not recognized by Storybook: ${projectTypeProvided}`),logger5.log(`
|
|
135
135
|
The project types currently supported by Storybook are:
|
|
136
|
-
`),installableProjectTypes.sort().forEach(framework=>paddedLog(`- ${framework}`)),logger5.log(),new HandledError(`Unknown project type supplied: ${projectTypeProvided}`);else try{projectType=await detect(packageManager,options);}catch(err){throw done(String(err)),new HandledError(err)}done();let storybookInstantiated=isStorybookInstantiated();if(options.force===!1&&storybookInstantiated&&projectType!=="ANGULAR"){logger5.log();let{force}=await prompts5([{type:"confirm",name:"force",message:"We found a .storybook config directory in your project. Therefore we assume that Storybook is already instantiated for your project. Do you still want to continue and force the initialization?"}]);logger5.log(),force?options.force=!0:process.exit(0);}options.skipInstall||await packageManager.installDependencies();let installResult=await installStorybook(projectType,packageManager,options);if(options.skipInstall||await packageManager.installDependencies(),options.disableTelemetry||await telemetry("init",{projectType}),projectType==="REACT_NATIVE")return logger5.log(
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
136
|
+
`),installableProjectTypes.sort().forEach(framework=>paddedLog(`- ${framework}`)),logger5.log(),new HandledError(`Unknown project type supplied: ${projectTypeProvided}`);else try{projectType=await detect(packageManager,options);}catch(err){throw done(String(err)),new HandledError(err)}done();let storybookInstantiated=isStorybookInstantiated();if(options.force===!1&&storybookInstantiated&&projectType!=="ANGULAR"){logger5.log();let{force}=await prompts5([{type:"confirm",name:"force",message:"We found a .storybook config directory in your project. Therefore we assume that Storybook is already instantiated for your project. Do you still want to continue and force the initialization?"}]);logger5.log(),force?options.force=!0:process.exit(0);}options.skipInstall||await packageManager.installDependencies();let installResult=await installStorybook(projectType,packageManager,options);if(options.skipInstall||await packageManager.installDependencies(),options.disableTelemetry||await telemetry("init",{projectType}),projectType==="REACT_NATIVE")return logger5.log(dedent19`
|
|
137
|
+
${chalk14.yellow("NOTE: installation is not 100% automated.")}
|
|
138
|
+
|
|
139
|
+
To run Storybook, you will need to:
|
|
140
|
+
|
|
141
|
+
1. Replace the contents of your app entry with the following
|
|
142
|
+
|
|
143
|
+
${chalk14.inverse(" export {default} from './.storybook'; ")}
|
|
144
|
+
|
|
145
|
+
2. Enable transformer.unstable_allowRequireContext in your metro config
|
|
146
|
+
|
|
147
|
+
For a more detailed guide go to:
|
|
148
|
+
${chalk14.cyan("https://github.com/storybookjs/react-native#existing-project")}
|
|
149
|
+
|
|
150
|
+
Then to run your Storybook, type:
|
|
151
|
+
|
|
152
|
+
${chalk14.inverse(" "+packageManager.getRunCommand("start")+" ")}
|
|
153
|
+
|
|
154
|
+
`),{shouldRunDev:!1};let storybookCommand=projectType==="ANGULAR"?`ng run ${installResult.projectName}:storybook`:packageManager.getRunStorybookCommand();return logger5.log((0, import_boxen2.default)(dedent19`
|
|
143
155
|
Storybook was successfully installed in your project! 🎉
|
|
144
156
|
To run Storybook manually, run ${chalk14.yellow(chalk14.bold(storybookCommand))}. CTRL+C to stop.
|
|
145
157
|
|
|
@@ -445,15 +457,15 @@ ${error.stack}`),fixSummary.failed[f.id]=error.message),fixResults[f.id]="check_
|
|
|
445
457
|
|
|
446
458
|
To learn more about this change, see: ${chalk14.yellow("https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#mdx-docs-files")}
|
|
447
459
|
`},async run({dryRun,mainConfigPath,result:{nextStoriesEntries}}){logger21.info(dedent19`✅ Setting 'stories' config:
|
|
448
|
-
${JSON.stringify(nextStoriesEntries,null,2)}`),dryRun||await updateMainConfig({mainConfigPath,dryRun:!!dryRun},async main=>{main.setFieldValue(["stories"],nextStoriesEntries);});}};var logger22=console;async function migrate(migration,{glob:glob2,dryRun,list,rename,parser}){if(list)listCodemods().forEach(key=>logger22.log(key));else if(migration)migration==="mdx-to-csf"&&!dryRun&&(await runFixes({fixes:[bareMdxStoriesGlob]}),await addStorybookBlocksPackage()),await runCodemod(migration,{glob:glob2,dryRun,logger:logger22,rename,parser});else throw new Error("Migrate: please specify a migration name or --list")}async function addStorybookBlocksPackage(){let packageManager=JsPackageManagerFactory.getPackageManager(),packageJson=await packageManager.retrievePackageJson(),versionToInstall=getStorybookVersionSpecifier(await packageManager.retrievePackageJson());logger22.info('\u2705 Adding "@storybook/blocks" package'),await packageManager.addDependencies({installAsDevDependencies:!0,packageJson},[`@storybook/blocks@${versionToInstall}`]);}var import_boxen5=__toESM(require_boxen());var versionRegex=/(@storybook\/[^@]+)@(\S+)/,getStorybookVersion4=line=>{if(line.startsWith("npm "))return null;let match=versionRegex.exec(line);return !match||!semver.clean(match[2])?null:{package:match[1],version:match[2]}},deprecatedPackages=[{minVersion:"6.0.0-alpha.0",url:"https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#60-deprecations",deprecations:["@storybook/addon-notes","@storybook/addon-info","@storybook/addon-contexts","@storybook/addon-options","@storybook/addon-centered"]}],formatPackage=pkg2=>`${pkg2.package}@${pkg2.version}`,warnPackages=pkgs=>pkgs.forEach(pkg2=>logger.warn(`- ${formatPackage(pkg2)}`)),checkVersionConsistency=()=>{let storybookPackages=sync$1("npm",["ls"],{stdio:"pipe",shell:!0}).output.toString().split(`
|
|
449
|
-
`).map(getStorybookVersion4).filter(item=>!!item).filter(pkg2=>isCorePackage(pkg2.package));if(!storybookPackages.length){logger.warn("No storybook core packages found."),logger.warn("'npm ls | grep storybook' can show if multiple versions are installed.");return}storybookPackages.sort((a,b)=>semver.rcompare(a.version,b.version));let latestVersion=storybookPackages[0].version,outdated=storybookPackages.filter(pkg2=>pkg2.version!==latestVersion);outdated.length>0&&(logger.warn(`Found ${outdated.length} outdated packages (relative to '${formatPackage(storybookPackages[0])}')`),logger.warn("Please make sure your packages are updated to ensure a consistent experience."),warnPackages(outdated)),deprecatedPackages.forEach(({minVersion:minVersion2,url,deprecations})=>{if(semver.gte(latestVersion,minVersion2)){let deprecated=storybookPackages.filter(pkg2=>deprecations.includes(pkg2.package));deprecated.length>0&&(logger.warn(`Found ${deprecated.length} deprecated packages since ${minVersion2}`),logger.warn(`See ${url}`),warnPackages(deprecated));}});},doUpgrade=async({skipCheck,packageManager:pkgMgr,dryRun,configDir,yes,...options})=>{let packageManager=JsPackageManagerFactory.getPackageManager({force:pkgMgr}),beforeVersion=await
|
|
460
|
+
${JSON.stringify(nextStoriesEntries,null,2)}`),dryRun||await updateMainConfig({mainConfigPath,dryRun:!!dryRun},async main=>{main.setFieldValue(["stories"],nextStoriesEntries);});}};var logger22=console;async function migrate(migration,{glob:glob2,dryRun,list,rename,parser}){if(list)listCodemods().forEach(key=>logger22.log(key));else if(migration)migration==="mdx-to-csf"&&!dryRun&&(await runFixes({fixes:[bareMdxStoriesGlob]}),await addStorybookBlocksPackage()),await runCodemod(migration,{glob:glob2,dryRun,logger:logger22,rename,parser});else throw new Error("Migrate: please specify a migration name or --list")}async function addStorybookBlocksPackage(){let packageManager=JsPackageManagerFactory.getPackageManager(),packageJson=await packageManager.retrievePackageJson(),versionToInstall=getStorybookVersionSpecifier(await packageManager.retrievePackageJson());logger22.info('\u2705 Adding "@storybook/blocks" package'),await packageManager.addDependencies({installAsDevDependencies:!0,packageJson},[`@storybook/blocks@${versionToInstall}`]);}var import_boxen5=__toESM(require_boxen());var versionRegex=/(@storybook\/[^@]+)@(\S+)/,getStorybookVersion4=line=>{if(line.startsWith("npm "))return null;let match=versionRegex.exec(line);return !match||!semver.clean(match[2])?null:{package:match[1],version:match[2]}},getInstalledStorybookVersion=async packageManager=>{let installations=await packageManager.findInstallations(["storybook","@storybook/cli"]);if(!installations)return;let cliVersion=installations.dependencies["@storybook/cli"]?.[0].version;return cliVersion||installations.dependencies.storybook?.[0].version},deprecatedPackages=[{minVersion:"6.0.0-alpha.0",url:"https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#60-deprecations",deprecations:["@storybook/addon-notes","@storybook/addon-info","@storybook/addon-contexts","@storybook/addon-options","@storybook/addon-centered"]}],formatPackage=pkg2=>`${pkg2.package}@${pkg2.version}`,warnPackages=pkgs=>pkgs.forEach(pkg2=>logger.warn(`- ${formatPackage(pkg2)}`)),checkVersionConsistency=()=>{let storybookPackages=sync$1("npm",["ls"],{stdio:"pipe",shell:!0}).output.toString().split(`
|
|
461
|
+
`).map(getStorybookVersion4).filter(item=>!!item).filter(pkg2=>isCorePackage(pkg2.package));if(!storybookPackages.length){logger.warn("No storybook core packages found."),logger.warn("'npm ls | grep storybook' can show if multiple versions are installed.");return}storybookPackages.sort((a,b)=>semver.rcompare(a.version,b.version));let latestVersion=storybookPackages[0].version,outdated=storybookPackages.filter(pkg2=>pkg2.version!==latestVersion);outdated.length>0&&(logger.warn(`Found ${outdated.length} outdated packages (relative to '${formatPackage(storybookPackages[0])}')`),logger.warn("Please make sure your packages are updated to ensure a consistent experience."),warnPackages(outdated)),deprecatedPackages.forEach(({minVersion:minVersion2,url,deprecations})=>{if(semver.gte(latestVersion,minVersion2)){let deprecated=storybookPackages.filter(pkg2=>deprecations.includes(pkg2.package));deprecated.length>0&&(logger.warn(`Found ${deprecated.length} deprecated packages since ${minVersion2}`),logger.warn(`See ${url}`),warnPackages(deprecated));}});},doUpgrade=async({skipCheck,packageManager:pkgMgr,dryRun,configDir,yes,...options})=>{let packageManager=JsPackageManagerFactory.getPackageManager({force:pkgMgr}),beforeVersion=await getInstalledStorybookVersion(packageManager)??"0.0.0",currentVersion=versions["@storybook/cli"],isCanary=currentVersion.startsWith("0.0.0");if(!isCanary&<(currentVersion,beforeVersion))throw new UpgradeStorybookToLowerVersionError({beforeVersion,currentVersion});if(!isCanary&&eq(currentVersion,beforeVersion))throw new UpgradeStorybookToSameVersionError({beforeVersion});let latestVersion=await packageManager.latestVersion("@storybook/cli"),isOutdated=lt(currentVersion,latestVersion),isPrerelease=prerelease(currentVersion)!==null,borderColor=isOutdated?"#FC521F":"#F1618C",messages={welcome:`Upgrading Storybook from version ${chalk14.bold(beforeVersion)} to version ${chalk14.bold(currentVersion)}..`,notLatest:chalk14.red(dedent19`
|
|
450
462
|
This version is behind the latest release, which is: ${chalk14.bold(latestVersion)}!
|
|
451
463
|
You likely ran the upgrade command through npx, which can use a locally cached version, to upgrade to the latest version please run:
|
|
452
464
|
${chalk14.bold("npx storybook@latest upgrade")}
|
|
453
465
|
|
|
454
466
|
You may want to CTRL+C to stop, and run with the latest version instead.
|
|
455
467
|
`),prelease:chalk14.yellow("This is a pre-release version.")};logger.plain((0, import_boxen5.default)([messages.welcome].concat(isOutdated&&!isPrerelease?[messages.notLatest]:[]).concat(isPrerelease?[messages.prelease]:[]).join(`
|
|
456
|
-
`),{borderStyle:"round",padding:1,borderColor}));let packageJson=await packageManager.retrievePackageJson(),toUpgradedDependencies=deps=>Object.keys(deps||{}).filter(dependency=>{if(dependency==="@storybook/preset-create-react-app"){let reactScriptsVersion=packageJson.dependencies["react-scripts"]??packageJson.devDependencies["react-scripts"];if(reactScriptsVersion&<(coerceSemver(reactScriptsVersion),"5.0.0"))return !1}return dependency in versions}).map(dependency=>`${dependency}@${(!isOutdated||isPrerelease)&&!isCanary?"^":""}${versions[dependency]}`),upgradedDependencies=toUpgradedDependencies(packageJson.dependencies),upgradedDevDependencies=toUpgradedDependencies(packageJson.devDependencies);dryRun||(commandLog(`Updating dependencies in ${chalk14.cyan("package.json")}..`),logger.plain(""),upgradedDependencies.length>0&&await packageManager.addDependencies({installAsDevDependencies:!1,skipInstall:!0,packageJson},upgradedDependencies),upgradedDevDependencies.length>0&&await packageManager.addDependencies({installAsDevDependencies:!0,skipInstall:!0,packageJson},upgradedDevDependencies),await packageManager.installDependencies());let automigrationResults;if(skipCheck||(checkVersionConsistency(),automigrationResults=await automigrate({dryRun,yes,packageManager:pkgMgr,configDir})),!options.disableTelemetry){let afterVersion=await getStorybookCoreVersion(),{preCheckFailure,fixResults}=automigrationResults||{};telemetry("upgrade",{beforeVersion,afterVersion,...{automigrationResults:preCheckFailure?null:fixResults,automigrationPreCheckFailure:preCheckFailure||null}});}};async function upgrade(options){await withTelemetry("upgrade",{cliOptions:options},()=>doUpgrade(options));}var import_boxen6=__toESM(require_boxen());var baseTemplates={"cra/default-js":{name:"Create React App Latest (Webpack | JavaScript)",script:"npx create-react-app {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"cra/default-ts":{name:"Create React App Latest (Webpack | TypeScript)",script:"npx create-react-app {{beforeDir}} --template typescript",skipTasks:["smoke-test","bench"],expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"}},"nextjs/13-ts":{name:"Next.js v13.5 (Webpack | TypeScript)",script:'yarn create next-app {{beforeDir}} -e https://github.com/vercel/next.js/tree/next-13/examples/hello-world && cd {{beforeDir}} && npm pkg set "dependencies.next"="^13.5.6" && yarn && git add . && git commit --amend --no-edit && cd ..',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/default-js":{name:"Next.js Latest (Webpack | JavaScript)",script:'yarn create next-app {{beforeDir}} --javascript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/default-ts":{name:"Next.js Latest (Webpack | TypeScript)",script:'yarn create next-app {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/prerelease":{name:"Next.js Prerelease (Webpack | TypeScript)",script:'npx create-next-app@canary {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"react-vite/default-js":{name:"React Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template react",expected:{framework:"@storybook/react-vite",renderer:"@storybook/react",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"react-vite/default-ts":{name:"React Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template react-ts",expected:{framework:"@storybook/react-vite",renderer:"@storybook/react",builder:"@storybook/builder-vite"},skipTasks:["bench"]},"react-webpack/18-ts":{name:"React Latest (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"react-webpack/17-ts":{name:"React v17 (Webpack | TypeScript)",script:'yarn create webpack5-react {{beforeDir}} --version-react="17" --version-react-dom="17"',expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"solid-vite/default-js":{name:"SolidJS Latest (Vite | JavaScript)",script:"npx degit solidjs/templates/js {{beforeDir}}",expected:{framework:"storybook-solidjs-vite",renderer:"storybook-solidjs",builder:"@storybook/builder-vite"},inDevelopment:!0,skipTasks:["e2e-tests-dev","bench"]},"solid-vite/default-ts":{name:"SolidJS Latest (Vite | TypeScript)",script:"npx degit solidjs/templates/ts {{beforeDir}}",expected:{framework:"storybook-solidjs-vite",renderer:"storybook-solidjs",builder:"@storybook/builder-vite"},inDevelopment:!0,skipTasks:["e2e-tests-dev","bench"]},"vue3-vite/default-js":{name:"Vue v3 (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template vue",expected:{framework:"@storybook/vue3-vite",renderer:"@storybook/vue3",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"vue3-vite/default-ts":{name:"Vue v3 (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template vue-ts",expected:{framework:"@storybook/vue3-vite",renderer:"@storybook/vue3",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"html-webpack/default":{name:"HTML Latest (Webpack | JavaScript)",script:"yarn create webpack5-html {{beforeDir}}",expected:{framework:"@storybook/html-webpack5",renderer:"@storybook/html",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"html-vite/default-js":{name:"HTML Latest (Vite | JavaScript)",script:'npm create vite --yes {{beforeDir}} -- --template vanilla && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/html-vite",renderer:"@storybook/html",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"html-vite/default-ts":{name:"HTML Latest (Vite | TypeScript)",script:'npm create vite --yes {{beforeDir}} -- --template vanilla-ts && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/html-vite",renderer:"@storybook/html",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-vite/default-js":{name:"Svelte Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template svelte",expected:{framework:"@storybook/svelte-vite",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-vite/default-ts":{name:"Svelte Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template svelte-ts",expected:{framework:"@storybook/svelte-vite",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"angular-cli/prerelease":{name:"Angular CLI Prerelease (Webpack | TypeScript)",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",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"angular-cli/default-ts":{name:"Angular CLI Latest (Webpack | TypeScript)",script:"npx -p @angular/cli ng new angular-latest --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn --ssr",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"angular-cli/15-ts":{name:"Angular CLI v15 (Webpack | TypeScript)",script:"npx -p @angular/cli@15 ng new angular-v15 --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/skeleton-js":{name:"SvelteKit Latest (Vite | JavaScript)",script:"yarn create svelte-with-args --name=svelte-kit/skeleton-js --directory={{beforeDir}} --template=skeleton --types=null --no-prettier --no-eslint --no-playwright --no-vitest --no-svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/skeleton-ts":{name:"SvelteKit Latest (Vite | TypeScript)",script:"yarn create svelte-with-args --name=svelte-kit/skeleton-ts --directory={{beforeDir}} --template=skeleton --types=typescript --no-prettier --no-eslint --no-playwright --no-vitest --no-svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/prerelease-ts":{name:"SvelteKit Prerelease (Vite | TypeScript)",script:"yarn create svelte-with-args --name=svelte-kit/prerelease-ts --directory={{beforeDir}} --template=skeleton --types=typescript --no-prettier --no-eslint --no-playwright --no-vitest --svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"lit-vite/default-js":{name:"Lit Latest (Vite | JavaScript)",script:'npm create vite --yes {{beforeDir}} -- --template lit && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/web-components-vite",renderer:"@storybook/web-components",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"lit-vite/default-ts":{name:"Lit Latest (Vite | TypeScript)",script:'npm create vite --yes {{beforeDir}} -- --template lit-ts && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/web-components-vite",renderer:"@storybook/web-components",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"vue-cli/default-js":{name:"Vue CLI v3 (Webpack | JavaScript)",script:'npx -p @vue/cli vue create {{beforeDir}} --default --packageManager=yarn --force --merge && cd {{beforeDir}} && echo "module.exports = {}" > webpack.config.js',expected:{framework:"@storybook/vue3-webpack5",renderer:"@storybook/vue3",builder:"@storybook/builder-webpack5"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"preact-vite/default-js":{name:"Preact Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template preact",expected:{framework:"@storybook/preact-vite",renderer:"@storybook/preact",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"preact-vite/default-ts":{name:"Preact Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template preact-ts",expected:{framework:"@storybook/preact-vite",renderer:"@storybook/preact",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"qwik-vite/default-ts":{name:"Qwik CLI Latest (Vite | TypeScript)",script:"yarn create qwik basic {{beforeDir}}",inDevelopment:!0,expected:{framework:"storybook-framework-qwik",renderer:"storybook-framework-qwik",builder:"storybook-framework-qwik"},skipTasks:["e2e-tests","e2e-tests-dev","bench"]},"ember/3-js":{name:"Ember v3 (Webpack | JavaScript)",script:"npx --package ember-cli@3.28.1 ember new {{beforeDir}}",inDevelopment:!0,expected:{framework:"@storybook/ember",renderer:"@storybook/ember",builder:"@storybook/builder-webpack5"}},"ember/default-js":{name:"Ember v4 (Webpack | JavaScript)",script:"npx --package ember-cli@4.12.1 ember new {{beforeDir}} --yarn && cd {{beforeDir}} && yarn add --dev @storybook/ember-cli-storybook && yarn build",inDevelopment:!0,expected:{framework:"@storybook/ember",renderer:"@storybook/ember",builder:"@storybook/builder-webpack5"}}},internalTemplates={"internal/react18-webpack-babel":{name:"React with Babel Latest (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{extraDependencies:["@storybook/addon-webpack5-compiler-babel"],editAddons:addons=>[...addons,"@storybook/addon-webpack5-compiler-babel"].filter(a=>a!=="@storybook/addon-webpack5-compiler-swc")},isInternal:!0,skipTasks:["e2e-tests-dev","bench"]},"internal/react16-webpack":{name:"React 16 (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}} --version-react=16 --version-react-dom=16 --version-@types/react=16 --version-@types/react-dom=16",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"],isInternal:!0},"internal/server-webpack5":{name:"Server Webpack5",script:'yarn init -y && echo "module.exports = {}" > webpack.config.js',expected:{framework:"@storybook/server-webpack5",renderer:"@storybook/server",builder:"@storybook/builder-webpack5"},isInternal:!0,skipTasks:["bench"]}},benchTemplates={"bench/react-vite-default-ts":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts)",isInternal:!0,modifications:{skipTemplateStories:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-webpack-18-ts":{...baseTemplates["react-webpack/18-ts"],name:"Bench (react-webpack/18-ts)",isInternal:!0,modifications:{skipTemplateStories:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-vite-default-ts-nodocs":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts, no docs)",isInternal:!0,modifications:{skipTemplateStories:!0,disableDocs:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-vite-default-ts-test-build":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts, test-build)",isInternal:!0,modifications:{skipTemplateStories:!0,testBuild:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests"]},"bench/react-webpack-18-ts-test-build":{...baseTemplates["react-webpack/18-ts"],name:"Bench (react-webpack/18-ts, test-build)",isInternal:!0,modifications:{skipTemplateStories:!0,testBuild:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests"]}},allTemplates={...baseTemplates,...internalTemplates,...benchTemplates};var logger24=console,toChoices=c=>({title:allTemplates[c].name,value:c}),sandbox=async({output:outputDirectory,filterValue,init,...options},pkg2)=>{let selectedConfig=allTemplates[filterValue],templateId=selectedConfig?filterValue:null,{packageManager:pkgMgr}=options,packageManager=JsPackageManagerFactory.getPackageManager({force:pkgMgr}),latestVersion=await packageManager.latestVersion("@storybook/cli"),nextVersion=await packageManager.latestVersion("@storybook/cli@next").catch(e=>"0.0.0"),currentVersion=versions["@storybook/cli"],isPrerelease=prerelease(currentVersion),isOutdated=lt(currentVersion,isPrerelease?nextVersion:latestVersion),borderColor=isOutdated?"#FC521F":"#F1618C",downloadType=!isOutdated&&init?"after-storybook":"before-storybook",branch=isPrerelease?"next":"main",messages={welcome:`Creating a Storybook ${chalk14.bold(currentVersion)} sandbox..`,notLatest:chalk14.red(dedent`
|
|
468
|
+
`),{borderStyle:"round",padding:1,borderColor}));let packageJson=await packageManager.retrievePackageJson(),toUpgradedDependencies=deps=>Object.keys(deps||{}).filter(dependency=>{if(dependency==="@storybook/preset-create-react-app"){let reactScriptsVersion=packageJson.dependencies["react-scripts"]??packageJson.devDependencies["react-scripts"];if(reactScriptsVersion&<(coerceSemver(reactScriptsVersion),"5.0.0"))return !1}return dependency in versions}).map(dependency=>`${dependency}@${(!isOutdated||isPrerelease)&&!isCanary?"^":""}${versions[dependency]}`),upgradedDependencies=toUpgradedDependencies(packageJson.dependencies),upgradedDevDependencies=toUpgradedDependencies(packageJson.devDependencies);dryRun||(commandLog(`Updating dependencies in ${chalk14.cyan("package.json")}..`),logger.plain(""),upgradedDependencies.length>0&&await packageManager.addDependencies({installAsDevDependencies:!1,skipInstall:!0,packageJson},upgradedDependencies),upgradedDevDependencies.length>0&&await packageManager.addDependencies({installAsDevDependencies:!0,skipInstall:!0,packageJson},upgradedDevDependencies),await packageManager.installDependencies());let automigrationResults;if(skipCheck||(checkVersionConsistency(),automigrationResults=await automigrate({dryRun,yes,packageManager:pkgMgr,configDir})),!options.disableTelemetry){let afterVersion=await getInstalledStorybookVersion(packageManager),{preCheckFailure,fixResults}=automigrationResults||{};telemetry("upgrade",{beforeVersion,afterVersion,...{automigrationResults:preCheckFailure?null:fixResults,automigrationPreCheckFailure:preCheckFailure||null}});}};async function upgrade(options){await withTelemetry("upgrade",{cliOptions:options},()=>doUpgrade(options));}var import_boxen6=__toESM(require_boxen());var baseTemplates={"cra/default-js":{name:"Create React App Latest (Webpack | JavaScript)",script:"npx create-react-app {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"cra/default-ts":{name:"Create React App Latest (Webpack | TypeScript)",script:"npx create-react-app {{beforeDir}} --template typescript",skipTasks:["smoke-test","bench"],expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"}},"nextjs/13-ts":{name:"Next.js v13.5 (Webpack | TypeScript)",script:'yarn create next-app {{beforeDir}} -e https://github.com/vercel/next.js/tree/next-13/examples/hello-world && cd {{beforeDir}} && npm pkg set "dependencies.next"="^13.5.6" && yarn && git add . && git commit --amend --no-edit && cd ..',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/default-js":{name:"Next.js Latest (Webpack | JavaScript)",script:'yarn create next-app {{beforeDir}} --javascript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/default-ts":{name:"Next.js Latest (Webpack | TypeScript)",script:'yarn create next-app {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/prerelease":{name:"Next.js Prerelease (Webpack | TypeScript)",script:'npx create-next-app@canary {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"react-vite/default-js":{name:"React Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template react",expected:{framework:"@storybook/react-vite",renderer:"@storybook/react",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"react-vite/default-ts":{name:"React Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template react-ts",expected:{framework:"@storybook/react-vite",renderer:"@storybook/react",builder:"@storybook/builder-vite"},skipTasks:["bench"]},"react-webpack/18-ts":{name:"React Latest (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"react-webpack/17-ts":{name:"React v17 (Webpack | TypeScript)",script:'yarn create webpack5-react {{beforeDir}} --version-react="17" --version-react-dom="17"',expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"solid-vite/default-js":{name:"SolidJS Latest (Vite | JavaScript)",script:"npx degit solidjs/templates/js {{beforeDir}}",expected:{framework:"storybook-solidjs-vite",renderer:"storybook-solidjs",builder:"@storybook/builder-vite"},inDevelopment:!0,skipTasks:["e2e-tests-dev","bench"]},"solid-vite/default-ts":{name:"SolidJS Latest (Vite | TypeScript)",script:"npx degit solidjs/templates/ts {{beforeDir}}",expected:{framework:"storybook-solidjs-vite",renderer:"storybook-solidjs",builder:"@storybook/builder-vite"},inDevelopment:!0,skipTasks:["e2e-tests-dev","bench"]},"vue3-vite/default-js":{name:"Vue v3 (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template vue",expected:{framework:"@storybook/vue3-vite",renderer:"@storybook/vue3",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"vue3-vite/default-ts":{name:"Vue v3 (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template vue-ts",expected:{framework:"@storybook/vue3-vite",renderer:"@storybook/vue3",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"html-webpack/default":{name:"HTML Latest (Webpack | JavaScript)",script:"yarn create webpack5-html {{beforeDir}}",expected:{framework:"@storybook/html-webpack5",renderer:"@storybook/html",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"html-vite/default-js":{name:"HTML Latest (Vite | JavaScript)",script:'npm create vite --yes {{beforeDir}} -- --template vanilla && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/html-vite",renderer:"@storybook/html",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"html-vite/default-ts":{name:"HTML Latest (Vite | TypeScript)",script:'npm create vite --yes {{beforeDir}} -- --template vanilla-ts && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/html-vite",renderer:"@storybook/html",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-vite/default-js":{name:"Svelte Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template svelte",expected:{framework:"@storybook/svelte-vite",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-vite/default-ts":{name:"Svelte Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template svelte-ts",expected:{framework:"@storybook/svelte-vite",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"angular-cli/prerelease":{name:"Angular CLI Prerelease (Webpack | TypeScript)",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",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"angular-cli/default-ts":{name:"Angular CLI Latest (Webpack | TypeScript)",script:"npx -p @angular/cli ng new angular-latest --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn --ssr",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"angular-cli/15-ts":{name:"Angular CLI v15 (Webpack | TypeScript)",script:"npx -p @angular/cli@15 ng new angular-v15 --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/skeleton-js":{name:"SvelteKit Latest (Vite | JavaScript)",script:"yarn create svelte-with-args --name=svelte-kit/skeleton-js --directory={{beforeDir}} --template=skeleton --types=null --no-prettier --no-eslint --no-playwright --no-vitest --no-svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/skeleton-ts":{name:"SvelteKit Latest (Vite | TypeScript)",script:"yarn create svelte-with-args --name=svelte-kit/skeleton-ts --directory={{beforeDir}} --template=skeleton --types=typescript --no-prettier --no-eslint --no-playwright --no-vitest --no-svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/prerelease-ts":{name:"SvelteKit Prerelease (Vite | TypeScript)",script:"yarn create svelte-with-args --name=svelte-kit/prerelease-ts --directory={{beforeDir}} --template=skeleton --types=typescript --no-prettier --no-eslint --no-playwright --no-vitest --svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"lit-vite/default-js":{name:"Lit Latest (Vite | JavaScript)",script:'npm create vite --yes {{beforeDir}} -- --template lit && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/web-components-vite",renderer:"@storybook/web-components",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"lit-vite/default-ts":{name:"Lit Latest (Vite | TypeScript)",script:'npm create vite --yes {{beforeDir}} -- --template lit-ts && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/web-components-vite",renderer:"@storybook/web-components",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"vue-cli/default-js":{name:"Vue CLI v3 (Webpack | JavaScript)",script:'npx -p @vue/cli vue create {{beforeDir}} --default --packageManager=yarn --force --merge && cd {{beforeDir}} && echo "module.exports = {}" > webpack.config.js',expected:{framework:"@storybook/vue3-webpack5",renderer:"@storybook/vue3",builder:"@storybook/builder-webpack5"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"preact-vite/default-js":{name:"Preact Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template preact",expected:{framework:"@storybook/preact-vite",renderer:"@storybook/preact",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"preact-vite/default-ts":{name:"Preact Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template preact-ts",expected:{framework:"@storybook/preact-vite",renderer:"@storybook/preact",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"qwik-vite/default-ts":{name:"Qwik CLI Latest (Vite | TypeScript)",script:"yarn create qwik basic {{beforeDir}}",inDevelopment:!0,expected:{framework:"storybook-framework-qwik",renderer:"storybook-framework-qwik",builder:"storybook-framework-qwik"},skipTasks:["e2e-tests","e2e-tests-dev","bench"]},"ember/3-js":{name:"Ember v3 (Webpack | JavaScript)",script:"npx --package ember-cli@3.28.1 ember new {{beforeDir}}",inDevelopment:!0,expected:{framework:"@storybook/ember",renderer:"@storybook/ember",builder:"@storybook/builder-webpack5"}},"ember/default-js":{name:"Ember v4 (Webpack | JavaScript)",script:"npx --package ember-cli@4.12.1 ember new {{beforeDir}} --yarn && cd {{beforeDir}} && yarn add --dev @storybook/ember-cli-storybook && yarn build",inDevelopment:!0,expected:{framework:"@storybook/ember",renderer:"@storybook/ember",builder:"@storybook/builder-webpack5"}}},internalTemplates={"internal/react18-webpack-babel":{name:"React with Babel Latest (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{extraDependencies:["@storybook/addon-webpack5-compiler-babel"],editAddons:addons=>[...addons,"@storybook/addon-webpack5-compiler-babel"].filter(a=>a!=="@storybook/addon-webpack5-compiler-swc")},isInternal:!0,skipTasks:["e2e-tests-dev","bench"]},"internal/react16-webpack":{name:"React 16 (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}} --version-react=16 --version-react-dom=16 --version-@types/react=16 --version-@types/react-dom=16",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"],isInternal:!0},"internal/server-webpack5":{name:"Server Webpack5",script:'yarn init -y && echo "module.exports = {}" > webpack.config.js',expected:{framework:"@storybook/server-webpack5",renderer:"@storybook/server",builder:"@storybook/builder-webpack5"},isInternal:!0,skipTasks:["bench"]}},benchTemplates={"bench/react-vite-default-ts":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts)",isInternal:!0,modifications:{skipTemplateStories:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-webpack-18-ts":{...baseTemplates["react-webpack/18-ts"],name:"Bench (react-webpack/18-ts)",isInternal:!0,modifications:{skipTemplateStories:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-vite-default-ts-nodocs":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts, no docs)",isInternal:!0,modifications:{skipTemplateStories:!0,disableDocs:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-vite-default-ts-test-build":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts, test-build)",isInternal:!0,modifications:{skipTemplateStories:!0,testBuild:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests"]},"bench/react-webpack-18-ts-test-build":{...baseTemplates["react-webpack/18-ts"],name:"Bench (react-webpack/18-ts, test-build)",isInternal:!0,modifications:{skipTemplateStories:!0,testBuild:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests"]}},allTemplates={...baseTemplates,...internalTemplates,...benchTemplates};var logger24=console,toChoices=c=>({title:allTemplates[c].name,value:c}),sandbox=async({output:outputDirectory,filterValue,init,...options},pkg2)=>{let selectedConfig=allTemplates[filterValue],templateId=selectedConfig?filterValue:null,{packageManager:pkgMgr}=options,packageManager=JsPackageManagerFactory.getPackageManager({force:pkgMgr}),latestVersion=await packageManager.latestVersion("@storybook/cli"),nextVersion=await packageManager.latestVersion("@storybook/cli@next").catch(e=>"0.0.0"),currentVersion=versions["@storybook/cli"],isPrerelease=prerelease(currentVersion),isOutdated=lt(currentVersion,isPrerelease?nextVersion:latestVersion),borderColor=isOutdated?"#FC521F":"#F1618C",downloadType=!isOutdated&&init?"after-storybook":"before-storybook",branch=isPrerelease?"next":"main",messages={welcome:`Creating a Storybook ${chalk14.bold(currentVersion)} sandbox..`,notLatest:chalk14.red(dedent`
|
|
457
469
|
This version is behind the latest release, which is: ${chalk14.bold(latestVersion)}!
|
|
458
470
|
You likely ran the init command through npx, which can use a locally cached version, to get the latest please run:
|
|
459
471
|
${chalk14.bold("npx storybook@latest sandbox")}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@storybook/cli",
|
|
3
|
-
"version": "8.0.0-alpha.
|
|
3
|
+
"version": "8.0.0-alpha.16",
|
|
4
4
|
"description": "Storybook's CLI - install, dev, build, upgrade, and more",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"cli",
|
|
@@ -58,14 +58,14 @@
|
|
|
58
58
|
"dependencies": {
|
|
59
59
|
"@babel/types": "^7.23.0",
|
|
60
60
|
"@ndelangen/get-tarball": "^3.0.7",
|
|
61
|
-
"@storybook/codemod": "8.0.0-alpha.
|
|
62
|
-
"@storybook/core-common": "8.0.0-alpha.
|
|
63
|
-
"@storybook/core-events": "8.0.0-alpha.
|
|
64
|
-
"@storybook/core-server": "8.0.0-alpha.
|
|
65
|
-
"@storybook/csf-tools": "8.0.0-alpha.
|
|
66
|
-
"@storybook/node-logger": "8.0.0-alpha.
|
|
67
|
-
"@storybook/telemetry": "8.0.0-alpha.
|
|
68
|
-
"@storybook/types": "8.0.0-alpha.
|
|
61
|
+
"@storybook/codemod": "8.0.0-alpha.16",
|
|
62
|
+
"@storybook/core-common": "8.0.0-alpha.16",
|
|
63
|
+
"@storybook/core-events": "8.0.0-alpha.16",
|
|
64
|
+
"@storybook/core-server": "8.0.0-alpha.16",
|
|
65
|
+
"@storybook/csf-tools": "8.0.0-alpha.16",
|
|
66
|
+
"@storybook/node-logger": "8.0.0-alpha.16",
|
|
67
|
+
"@storybook/telemetry": "8.0.0-alpha.16",
|
|
68
|
+
"@storybook/types": "8.0.0-alpha.16",
|
|
69
69
|
"@types/semver": "^7.3.4",
|
|
70
70
|
"@yarnpkg/fslib": "2.10.3",
|
|
71
71
|
"@yarnpkg/libzip": "2.3.0",
|