diff --git a/code/lib/cli/src/generators/ANGULAR/index.ts b/code/lib/cli/src/generators/ANGULAR/index.ts index b820339d95b9..361b93107370 100644 --- a/code/lib/cli/src/generators/ANGULAR/index.ts +++ b/code/lib/cli/src/generators/ANGULAR/index.ts @@ -79,8 +79,15 @@ const generator: Generator<{ projectName: string }> = async ( }); } - const templateDir = join(getCliDir(), 'templates', 'angular', projectType || 'application'); - copyTemplate(templateDir, root || undefined); + let projectTypeValue = projectType || 'application'; + if (projectTypeValue !== 'application' && projectTypeValue !== 'library') { + projectTypeValue = 'application'; + } + + const templateDir = join(getCliDir(), 'templates', 'angular', projectTypeValue); + if (templateDir) { + copyTemplate(templateDir, root || undefined); + } return { projectName: angularProjectName, diff --git a/code/lib/cli/src/generators/AURELIA/index.ts b/code/lib/cli/src/generators/AURELIA/index.ts index bb7c66d4d0be..04101f26c857 100644 --- a/code/lib/cli/src/generators/AURELIA/index.ts +++ b/code/lib/cli/src/generators/AURELIA/index.ts @@ -25,8 +25,11 @@ const generator: Generator = async (packageManager, npmOptions, options) => { await baseGenerator(packageManager, npmOptions, options, 'aurelia', { extraPackages: ['aurelia'], }); + const templateDir = join(getCliDir(), 'templates', 'aurelia'); - copyTemplate(templateDir); + if (templateDir) { + copyTemplate(templateDir); + } }; export default generator; diff --git a/code/lib/cli/src/generators/SERVER/index.ts b/code/lib/cli/src/generators/SERVER/index.ts index 8653c25dba25..92bda9526d18 100755 --- a/code/lib/cli/src/generators/SERVER/index.ts +++ b/code/lib/cli/src/generators/SERVER/index.ts @@ -1,16 +1,10 @@ -import { join } from 'path'; import { baseGenerator } from '../baseGenerator'; import type { Generator } from '../types'; -import { copyTemplate } from '../../helpers'; -import { getCliDir } from '../../dirs'; const generator: Generator = async (packageManager, npmOptions, options) => { await baseGenerator(packageManager, npmOptions, options, 'server', { extensions: ['json'], }); - - const templateDir = join(getCliDir(), 'templates', 'server'); - copyTemplate(templateDir); }; export default generator; diff --git a/code/lib/cli/src/sandbox-templates.ts b/code/lib/cli/src/sandbox-templates.ts index 6b3bc9b96668..7d77b7c4f041 100644 --- a/code/lib/cli/src/sandbox-templates.ts +++ b/code/lib/cli/src/sandbox-templates.ts @@ -455,6 +455,17 @@ const internalTemplates = { }, }, }, + 'internal/server-webpack5': { + name: 'Server Webpack5', + script: 'yarn init -y', + expected: { + framework: '@storybook/server-webpack5', + renderer: '@storybook/server', + builder: '@storybook/builder-webpack5', + }, + isInternal: true, + inDevelopment: true, + }, // 'internal/pnp': { // ...baseTemplates['cra/default-ts'], // name: 'PNP (cra/default-ts)', diff --git a/code/renderers/server/package.json b/code/renderers/server/package.json index adf3b26be9e3..d760370a4730 100644 --- a/code/renderers/server/package.json +++ b/code/renderers/server/package.json @@ -31,6 +31,11 @@ "require": "./dist/config.js", "import": "./dist/config.mjs" }, + "./preset": { + "types": "./dist/preset.d.ts", + "require": "./dist/preset.js", + "import": "./dist/preset.mjs" + }, "./package.json": "./package.json" }, "main": "dist/index.js", @@ -49,9 +54,12 @@ }, "dependencies": { "@storybook/core-client": "7.1.0-alpha.13", + "@storybook/csf": "^0.1.0", "@storybook/global": "^5.0.0", "@storybook/preview-api": "7.1.0-alpha.13", "@storybook/types": "7.1.0-alpha.13", + "@types/fs-extra": "^11.0.1", + "fs-extra": "^11.1.0", "ts-dedent": "^2.0.0" }, "devDependencies": { @@ -66,7 +74,8 @@ "bundler": { "entries": [ "./src/index.ts", - "./src/config.ts" + "./src/config.ts", + "./src/preset.ts" ], "platform": "browser" }, diff --git a/code/renderers/server/preset.js b/code/renderers/server/preset.js new file mode 100644 index 000000000000..a83f95279e7f --- /dev/null +++ b/code/renderers/server/preset.js @@ -0,0 +1 @@ +module.exports = require('./dist/preset'); diff --git a/code/renderers/server/src/preset.ts b/code/renderers/server/src/preset.ts new file mode 100644 index 000000000000..fced651731c3 --- /dev/null +++ b/code/renderers/server/src/preset.ts @@ -0,0 +1,33 @@ +import fs from 'fs-extra'; +import { toId } from '@storybook/csf'; +import type { StaticMeta } from '@storybook/csf-tools'; +import type { IndexerOptions, IndexedStory, StoryIndexer } from '@storybook/types'; + +export const storyIndexers = (indexers: StoryIndexer[] | null) => { + const jsonIndexer = async (fileName: string, opts: IndexerOptions) => { + const json = await fs.readJson(fileName, 'utf-8'); + const meta: StaticMeta = { + title: json.title, + }; + const stories: IndexedStory[] = json.stories.map((story: { name: string }) => { + const id = toId(meta.title, story.name); + const { name } = story; + const indexedStory: IndexedStory = { + id, + name, + }; + return indexedStory; + }); + return { + meta, + stories, + }; + }; + return [ + { + test: /(stories|story)\.json$/, + indexer: jsonIndexer, + }, + ...(indexers || []), + ]; +}; diff --git a/code/renderers/server/template/cli/button.stories.json b/code/renderers/server/template/cli/button.stories.json index 3a9f73934385..f42672368f8c 100644 --- a/code/renderers/server/template/cli/button.stories.json +++ b/code/renderers/server/template/cli/button.stories.json @@ -1,7 +1,10 @@ { "title": "Example/Button", "parameters": { - "server": { "id": "button" } + "server": { + "url": "https://storybook-server-demo.netlify.app/api", + "id": "button" + } }, "args": { "label": "Button" }, "argTypes": { diff --git a/code/renderers/server/template/cli/header.stories.json b/code/renderers/server/template/cli/header.stories.json index e51cbfac7669..ee9aaae50acc 100644 --- a/code/renderers/server/template/cli/header.stories.json +++ b/code/renderers/server/template/cli/header.stories.json @@ -1,7 +1,10 @@ { "title": "Example/Header", "parameters": { - "server": { "id": "header" } + "server": { + "url": "https://storybook-server-demo.netlify.app/api", + "id": "header" + } }, "stories": [ { diff --git a/code/renderers/server/template/cli/page.stories.json b/code/renderers/server/template/cli/page.stories.json index 2245cb3f9db8..abbc4e809188 100644 --- a/code/renderers/server/template/cli/page.stories.json +++ b/code/renderers/server/template/cli/page.stories.json @@ -1,7 +1,10 @@ { "title": "Example/Page", "parameters": { - "server": { "id": "page" } + "server": { + "url": "https://storybook-server-demo.netlify.app/api", + "id": "page" + } }, "stories": [ { diff --git a/code/yarn.lock b/code/yarn.lock index 6a24df8872e0..ccbc55f99b95 100644 --- a/code/yarn.lock +++ b/code/yarn.lock @@ -7052,9 +7052,12 @@ __metadata: resolution: "@storybook/server@workspace:renderers/server" dependencies: "@storybook/core-client": 7.1.0-alpha.13 + "@storybook/csf": ^0.1.0 "@storybook/global": ^5.0.0 "@storybook/preview-api": 7.1.0-alpha.13 "@storybook/types": 7.1.0-alpha.13 + "@types/fs-extra": ^11.0.1 + fs-extra: ^11.1.0 ts-dedent: ^2.0.0 typescript: ~4.9.3 languageName: unknown diff --git a/scripts/sandbox/generate.ts b/scripts/sandbox/generate.ts index ce4d72f0001f..b74ae5a28d03 100755 --- a/scripts/sandbox/generate.ts +++ b/scripts/sandbox/generate.ts @@ -132,7 +132,9 @@ const runGenerators = async ( await Promise.all( generators.map(({ dirName, name, script, expected }) => limit(async () => { - const flags = expected.renderer === '@storybook/html' ? ['--type html'] : []; + let flags: string[] = []; + if (expected.renderer === '@storybook/html') flags = ['--type html']; + else if (expected.renderer === '@storybook/server') flags = ['--type server']; const time = process.hrtime(); console.log(`🧬 Generating ${name}`); diff --git a/scripts/tasks/sandbox-parts.ts b/scripts/tasks/sandbox-parts.ts index f20a6fe17b31..22eaf248188d 100644 --- a/scripts/tasks/sandbox-parts.ts +++ b/scripts/tasks/sandbox-parts.ts @@ -100,7 +100,9 @@ export const install: Task['run'] = async ( ); } - const extra = template.expected.renderer === '@storybook/html' ? { type: 'html' } : {}; + let extra = {}; + if (template.expected.renderer === '@storybook/html') extra = { type: 'html' }; + else if (template.expected.renderer === '@storybook/server') extra = { type: 'server' }; await executeCLIStep(steps.init, { cwd, @@ -368,7 +370,9 @@ export const addStories: Task['run'] = async ( const packageJson = await import(join(cwd, 'package.json')); updateStoriesField(mainConfig, detectLanguage(packageJson) === SupportedLanguage.JAVASCRIPT); - const isCoreRenderer = template.expected.renderer.startsWith('@storybook/'); + const isCoreRenderer = + template.expected.renderer.startsWith('@storybook/') && + template.expected.renderer !== '@storybook/server'; const sandboxSpecificStoriesFolder = key.replaceAll('/', '-'); const storiesVariantFolder = getStoriesFolderWithVariant(sandboxSpecificStoriesFolder);