feat: expose docs file in storybook

sbb-design-systems · Apr 24, 2024 · 255dfae · 255dfae
1 parent cf97ecd
commit 255dfae
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 12 deletions.
diff --git a/.storybook/main.ts b/.storybook/main.ts
@@ -2,7 +2,7 @@ import type { StorybookConfig } from '@storybook/web-components-vite';
 import { type BuildOptions, type UserConfig, mergeConfig } from 'vite';
 
 const config: StorybookConfig = {
-  stories: ['../src/**/*.stories.ts'],
+  stories: ['../docs/**/*.mdx', '../src/**/*.stories.ts'],
   addons: ['@storybook/addon-essentials', '@storybook/addon-a11y', '@storybook/addon-interactions'],
   framework: {
     name: '@storybook/web-components-vite',

diff --git a/.storybook/preview.ts b/.storybook/preview.ts
@@ -65,15 +65,7 @@ export const parameters = {
     storySort: {
       // Story section order.
       // https://storybook.js.org/docs/react/writing-stories/naming-components-and-hierarchy#sorting-stories
-      order: [
-        'pages',
-        ['home', 'home personalized'],
-        'components',
-        ['*', 'form elements', 'cards', 'layout'],
-        'styles',
-        'timetable',
-        'internals',
-      ],
+      order: ['Introduction', 'Pages', 'Components', 'Styles', 'Timetable', 'Internals'],
     },
   },
 };

diff --git a/README.md b/README.md
@@ -7,7 +7,7 @@
 
 ## 🎯 Our aim
 
-To fulfill our [Vision](./docs/VISION.md), we are building and maintaining Lyne, our Design System, which is and acts
+To fulfill our [Vision](./docs/VISION.mdx), we are building and maintaining Lyne, our Design System, which is and acts
 as our common language — our Single Source of Truth.
 For this purpose we use [Design Tokens](https://github.com/lyne-design-system/lyne-design-tokens) as our design abstractions.
 Those [Design Tokens](https://github.com/lyne-design-system/lyne-design-tokens) are consumed by Lyne Components and are integrated within our documentation.
@@ -18,7 +18,7 @@ Lyne Design Tokens and Lyne Components are available for developers and designer
 
 - General docs: [digital.sbb.ch](https://digital.sbb.ch)
 - Component docs: [Storybook](https://lyne-storybook.app.sbb.ch)
-- [Getting started guide](./docs/GETTING_STARTED.md)
+- [Getting started guide](./docs/GETTING_STARTED.mdx)
 
 ## 🔗 Packages
 

diff --git a/docs/GETTING_STARTED.md → docs/GETTING_STARTED.mdx b/docs/GETTING_STARTED.md → docs/GETTING_STARTED.mdx
@@ -1,3 +1,7 @@
+import { Meta } from '@storybook/blocks';
+
+<Meta title="Introduction/Getting started" />
+
 # Getting Started
 
 Basic steps to integrate the lyne components into your project.

diff --git a/docs/VISION.md → docs/VISION.mdx b/docs/VISION.md → docs/VISION.mdx
@@ -1,3 +1,7 @@
+import { Meta } from '@storybook/blocks';
+
+<Meta title="Introduction/Vision" />
+
 # Lyne Design System — Vision
 
 ## What _Lyne_ is and why we need it