diff --git a/.changeset/rotten-groups-crash.md b/.changeset/rotten-groups-crash.md new file mode 100644 index 0000000000..ffcc758045 --- /dev/null +++ b/.changeset/rotten-groups-crash.md @@ -0,0 +1,5 @@ +--- +'@swisspost/design-system-documentation': minor +--- + +Only include stories located in the `raw-components` or `health` directory in local builds. This will also prevent them from showing up in the search of the deployed version. diff --git a/packages/documentation/.storybook/main.ts b/packages/documentation/.storybook/main.ts index 40dacbc1a1..2605f1299b 100644 --- a/packages/documentation/.storybook/main.ts +++ b/packages/documentation/.storybook/main.ts @@ -4,6 +4,42 @@ import pkg from '@/../package.json'; import { mergeConfig } from 'vite'; import rehypeSlug from 'rehype-slug'; import rehypeAutolinkHeadings from 'rehype-autolink-headings'; +import fs from 'fs'; +import path from 'path'; + +const isDev = process.env.NODE_ENV === 'development'; + +// Directories to exclude (in int/prod environments) +const excludedDirs = ['health', 'raw-components']; + +const storiesBaseDir = path.resolve(__dirname, '../src/stories'); + +async function findStories(): Promise { + if (isDev) { + // In development, include all stories + return ['../src/stories/**/*.mdx', '../src/stories/**/*.stories.@(ts|tsx)']; + } else { + // In int/prod, exclude the specified directories + const storyPatterns: string[] = []; + storyPatterns.push('../src/stories/*.mdx', '../src/stories/*.stories.@(ts|tsx)'); + + const directories = fs + .readdirSync(storiesBaseDir, { withFileTypes: true }) + .filter(dirent => dirent.isDirectory()) + .map(dirent => dirent.name) + .filter(dirName => !excludedDirs.includes(dirName)); + + // Create story patterns for each allowed directory + for (const dir of directories) { + storyPatterns.push( + `../src/stories/${dir}/**/*.mdx`, + `../src/stories/${dir}/**/*.stories.@(ts|tsx)`, + ); + } + + return storyPatterns; + } +} const config: StorybookConfig = { logLevel: 'info', @@ -14,7 +50,9 @@ const config: StorybookConfig = { name: '@storybook/web-components-vite', options: {}, }, - stories: ['../src/stories/**/*.mdx', '../src/stories/**/*.stories.@(ts|tsx)'], + stories: async () => { + return await findStories(); + }, addons: [ { name: '@storybook/addon-essentials', diff --git a/packages/documentation/.storybook/styles/manager.scss b/packages/documentation/.storybook/styles/manager.scss index 74817c5858..5009a0a990 100644 --- a/packages/documentation/.storybook/styles/manager.scss +++ b/packages/documentation/.storybook/styles/manager.scss @@ -110,12 +110,6 @@ } } - #misc, - [data-item-id^='health'], - :is(#raw-components, [data-parent-id='raw-components']):where([data-env='production'] *) { - display: none; - } - #introduction--docs, [data-parent-id='misc'] a { padding-inline-start: 0.5rem; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index d35e404a61..7cbf6ec5b7 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -18854,7 +18854,7 @@ snapshots: globby@14.0.2: dependencies: '@sindresorhus/merge-streams': 2.3.0 - fast-glob: 3.3.2 + fast-glob: 3.3.3 ignore: 5.3.1 path-type: 5.0.0 slash: 5.1.0