refactor: move Link component docs to Storybook

nl-design-system · Sep 18, 2023 · c4ae427 · c4ae427
1 parent 21d409e
commit c4ae427
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 23 deletions.
diff --git a/packages/component-library-react/src/BreadcrumbNav.tsx b/packages/component-library-react/src/BreadcrumbNav.tsx
@@ -69,25 +69,6 @@ export interface BreadcrumbLinkProps extends HTMLAttributes<HTMLElement> {
   href: string;
   rel?: string;
   index?: number;
-  /**
-   * This property is used to override the default Link component.
-   * @example  The Nextjs Link component can be used as a custom component.
-   *
-   * ```jsx
-   * import { BreadcrumbLink } from '@utrecht/design-system';
-   * import Link from 'next/link';
-   *
-   * const DemoComponent = () => {
-   * return (
-   *  <BreadcrumbNav>
-   *    <BreadcrumbLink Link={Link} className="utrecht-link"  rel="home" href="/" index={0}>Home</BreadcrumbLink>
-   *    <BreadcrumbLink Link={Link} className="utrecht-link" rel="products"  href="/products" index={1} >Products</BreadcrumbLink>
-   * </BreadcrumbNav>
-   *   )
-   *  }
-   *
-   * ```
-   */
   Link?: ComponentType<any>;
 }
 

diff --git a/packages/storybook-react/src/stories/BreadcrumbNav.stories.tsx b/packages/storybook-react/src/stories/BreadcrumbNav.stories.tsx
@@ -80,17 +80,24 @@ export const Current: Story = {
 export const CustomLink: Story = {
   args: {
     children: [
-      <BreadcrumbLink Link={ExampleCustomLink} className="utrecht-link" href="/" rel="home" index={0}>
+      <BreadcrumbLink Link={ExampleCustomLink} href="/" rel="home" index={0}>
         Home
       </BreadcrumbLink>,
-      <BreadcrumbLink Link={ExampleCustomLink} className="utrecht-link" href="/a/" index={1}>
+      <BreadcrumbLink Link={ExampleCustomLink} href="/a/" index={1}>
         Niveau 1
       </BreadcrumbLink>,
-      <BreadcrumbLink Link={ExampleCustomLink} className="utrecht-link" href="/a/b/" rel="up" index={2} current>
-        Niveau 2
+      <BreadcrumbLink Link={ExampleCustomLink} href="/a/b/" index={2} current>
+        Huidige pagina
       </BreadcrumbLink>,
     ],
   },
+  parameters: {
+    docs: {
+      description: {
+        story: 'The `Link` property is used to override the default link component.',
+      },
+    },
+  },
 };
 
 export const DesignTokens = designTokenStory(meta);