Merge pull request #2330 from dxc-technology/PelayoFelgueroso/breadcrumbs-fix

Fix preventDefult on Breadcrumbs item

Author: Jialecl

apps/website/screens/components/breadcrumbs/code/examples/basicUsage.tsx

@@ -7,15 +7,15 @@ const code = `() => {
       href: "/components/select",
     },
     {
-      label: "Specifications",
-      href: "/components/select/specifications",
+      label: "Code",
+      href: "/components/select/code",
     },
     {
-      label: "Design Tokens",
-      href: "/components/select/specifications/#design-tokens",
+      label: "Examples",
+      href: "/components/select/code/#examples",
     },
     {
-      label: "Color",
+      label: "Uncontrolled",
     }
   ];
 

apps/website/screens/components/breadcrumbs/code/examples/nextJS.tsx

@@ -13,15 +13,15 @@ const code = `() => {
       href: "/components/select",
     },
     {
-      label: "Specifications",
-      href: "/components/select/specifications",
+      label: "Code",
+      href: "/components/select/code",
     },
     {
-      label: "Design Tokens",
-      href: "/components/select/specifications/#design-tokens",
+      label: "Examples",
+      href: "/components/select/code/#examples",
     },
     {
-      label: "Color",
+      label: "Uncontrolled",
     }
   ]; 
 

packages/lib/src/breadcrumbs/Item.tsx

@@ -48,8 +48,9 @@ const Item = ({ isCurrentPage = false, href, label, onClick }: ItemPropsType) =>
   const currentItemRef = useRef<HTMLSpanElement | null>(null);
 
   const handleOnClick = (event: MouseEvent<HTMLAnchorElement>) => {
+    if (typeof onClick !== "function") return;
     event.preventDefault();
-    if (href) onClick?.(href);
+    if (href) onClick(href);
   };
 
   const handleOnMouseEnter = (event: MouseEvent<HTMLAnchorElement>) => {