chore: add developing/testing component docs to Storybook

nl-design-system · Jun 4, 2024 · 00327ee · 00327ee
1 parent 469be75
commit 00327ee
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 4 deletions.
diff --git a/packages/storybook-react/config/preview.tsx b/packages/storybook-react/config/preview.tsx
@@ -11,7 +11,7 @@ import '@utrecht/storybook-helpers/src/storybook-docs.scss';
 import '@nl-design-system-unstable/amsterdam-design-tokens/dist/index.css';
 import '@nl-design-system-unstable/rotterdam-design-tokens/dist/index.css';
 import '@gemeente-denhaag/design-tokens-components/dist/theme/index.css';
-console.log(results);
+
 const preview: Preview = {
   decorators: [
     (Story: any) => <div className="utrecht-document">{Story()}</div>,
@@ -44,6 +44,11 @@ const preview: Preview = {
         );
       },
     },
+    options: {
+      storySort: {
+        order: ['React Component', ['Component Introduction', 'Developing components', 'Testing components']],
+      },
+    },
     ...addonStatus,
     ...addonThemes,
     ...addonViewport,

diff --git a/packages/storybook-react/src/stories/Introduction.stories.mdx b/packages/storybook-react/src/stories/Introduction.stories.mdx
@@ -1,8 +1,8 @@
-import { Description, Meta } from "@storybook/addon-docs";
-import README from "@utrecht/component-library-react/README.md?raw";
+import { Markdown, Meta } from "@storybook/blocks";
+import document from "@utrecht/component-library-react/README.md?raw";
 
 <Meta id="react--readme" title="React Component/Component Introduction" />
 
 {/* @license CC0-1.0 */}
 
-<Description markdown={README} />
+<Markdown>{document}</Markdown>
diff --git a/packages/storybook-react/src/stories/contributing.stories.mdx b/packages/storybook-react/src/stories/contributing.stories.mdx
@@ -0,0 +1,8 @@
+import { Markdown, Meta } from "@storybook/blocks";
+import document from "@utrecht/component-library-react/CONTRIBUTING.md?raw";
+
+<Meta id="react--contributing" title="React Component/Developing components" />
+
+{/* @license CC0-1.0 */}
+
+<Markdown>{document}</Markdown>
diff --git a/packages/storybook-react/src/stories/testing.stories.mdx b/packages/storybook-react/src/stories/testing.stories.mdx
@@ -0,0 +1,8 @@
+import { Markdown, Meta } from "@storybook/blocks";
+import document from "@utrecht/component-library-react/TESTING.md?raw";
+
+<Meta id="react--testing" title="React Component/Testing components" />
+
+{/* @license CC0-1.0 */}
+
+<Markdown>{document}</Markdown>