From c4ae42759255cfb1ae62f3a86c52d3caddccf34a Mon Sep 17 00:00:00 2001
From: Robbert Broersma <git@robbertbroersma.nl>
Date: Thu, 14 Sep 2023 08:14:20 +0200
Subject: [PATCH] refactor: move Link component docs to Storybook

---
 .../src/BreadcrumbNav.tsx                     | 19 -------------------
 .../src/stories/BreadcrumbNav.stories.tsx     | 15 +++++++++++----
 2 files changed, 11 insertions(+), 23 deletions(-)

diff --git a/packages/component-library-react/src/BreadcrumbNav.tsx b/packages/component-library-react/src/BreadcrumbNav.tsx
index 2cfcf1bd34f..46f555bf457 100644
--- 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
index 89ff2370343..73fd7a2a2b3 100644
--- 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);