@digigov/ui 2.0.0-113e6661 → 2.0.0-2177f152

package/navigation/Breadcrumbs/BreadcrumbsListItem.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/navigation/Breadcrumbs/BreadcrumbsListItem.tsx"],
+  "sourcesContent": ["import React from 'react';\nimport clsx from 'clsx';\nimport BreadcrumbsListItemBase, {\n  BreadcrumbsListItemBaseProps,\n} from '@digigov/react-core/BreadcrumbsListItem';\nimport Link from '@digigov/ui/navigation/Link';\n\nexport interface BreadcrumbsListItemProps extends BreadcrumbsListItemBaseProps {\n  href?: string;\n}\n\nconst BreadcrumbsListItem: React.FC<BreadcrumbsListItemProps> = ({\n  href,\n  children,\n  ...props\n}) => {\n  return (\n    <BreadcrumbsListItemBase {...props}>\n      <Link\n        href={href}\n        defaultStyle={false}\n        className={clsx({\n          'ds-breadcrumbs__link': true,\n          'ds-breadcrumbs__link--inactive': href === undefined,\n        })}\n      >\n        {children}\n      </Link>\n    </BreadcrumbsListItemBase>\n  );\n};\n\nexport { BreadcrumbsListItem };\nexport default BreadcrumbsListItem;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAClB,OAAO,UAAU;AACjB,OAAO,6BAEA;AACP,OAAO,UAAU;AAMjB,MAAM,sBAA0D,CAAC;AAAA,EAC/D;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,SACE,oCAAC,2BAAyB,GAAG,SAC3B;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,cAAc;AAAA,MACd,WAAW,KAAK;AAAA,QACd,wBAAwB;AAAA,QACxB,kCAAkC,SAAS;AAAA,MAC7C,CAAC;AAAA;AAAA,IAEA;AAAA,EACH,CACF;AAEJ;AAGA,IAAO,8BAAQ;",
+  "names": []
+}

package/navigation/Breadcrumbs/__stories__/Auto/index.js

@@ -1,13 +1,12 @@
 import React from "react";
 import { List, ListItem } from "@digigov/ui/content/List";
+import { Button } from "@digigov/ui/form/Button/";
 import {
   BreadcrumbsAuto,
   BreadcrumbsListAuto,
   useBreadcrumbsContext
 } from "@digigov/ui/navigation/Breadcrumbs/auto";
 import { Heading } from "@digigov/ui/typography";
-import { slug } from "@digigov/ui/navigation/Breadcrumbs/slug";
-import { Button } from "@digigov/ui/form/Button/";
 const items = [
   {
     title: "\u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2",
@@ -137,18 +136,34 @@ const items = [
   }
 ];
 const getListChild = (item, setActive) => {
-  return item.children ? /* @__PURE__ */ React.createElement(List, { listStyle: "number" }, /* @__PURE__ */ React.createElement(ListItem, null, /* @__PURE__ */ React.createElement(Heading, { size: "md" }, item.title), item.children?.map((subMenu, key) => /* @__PURE__ */ React.createElement(ListItem, { key }, getListChild(subMenu, setActive))))) : /* @__PURE__ */ React.createElement(Button, { variant: "link", role: "menuitem", id: item.title, onClick: (e) => {
-    e.preventDefault(), setActive(item);
-  } }, item.title);
+  return item.children ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Heading, { size: "sm", mb: 0 }, item.title), /* @__PURE__ */ React.createElement(List, { listStyle: "number" }, item.children?.map((subMenu, key) => /* @__PURE__ */ React.createElement(ListItem, { key }, getListChild(subMenu, setActive))))) : /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      variant: "link",
+      role: "menuitem",
+      id: item.title,
+      onClick: (e) => {
+        e.preventDefault();
+        setActive(item);
+      }
+    },
+    item.title
+  );
 };
 const Auto = () => {
-  return /* @__PURE__ */ React.createElement(BreadcrumbsAuto, { items, hrefGenerator: (item) => {
-    return item.href ? item.href : slug(item.title, 100);
-  } }, /* @__PURE__ */ React.createElement(BreadcrumbsListAuto, null), /* @__PURE__ */ React.createElement(ContentRoutes, null));
+  return /* @__PURE__ */ React.createElement(
+    BreadcrumbsAuto,
+    {
+      items,
+      initialUrlRoute: "/nomothesia-pyroprostasias/odigies-epi-protypon-pyroprostasias"
+    },
+    /* @__PURE__ */ React.createElement(BreadcrumbsListAuto, { mb: 8 }),
+    /* @__PURE__ */ React.createElement(ContentRoutes, null)
+  );
 };
 const ContentRoutes = () => {
-  const { active, setActive } = useBreadcrumbsContext();
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Heading, { size: "xl" }, active?.title), items.map((item) => getListChild(item, setActive)));
+  const { breadcrumbs, setActiveItem } = useBreadcrumbsContext();
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, breadcrumbs.length > 0 && /* @__PURE__ */ React.createElement(Heading, { size: "xl" }, breadcrumbs[breadcrumbs.length - 1]?.title), items.map((item) => getListChild(item, setActiveItem)));
 };
 var Auto_default = Auto;
 export {

package/navigation/Breadcrumbs/__stories__/Auto.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/navigation/Breadcrumbs/__stories__/Auto.tsx"],
-  "sourcesContent": ["import React from 'react';\nimport { List, ListItem } from '@digigov/ui/content/List';\nimport {\n  BreadcrumbsAuto,\n  BreadcrumbsListAuto,\n  useBreadcrumbsContext,\n} from '@digigov/ui/navigation/Breadcrumbs/auto';\nimport { Heading } from '@digigov/ui/typography';\nimport { slug } from '@digigov/ui/navigation/Breadcrumbs/slug';\nimport { Button } from '@digigov/ui/form/Button/';\nimport { ConfigData, } from '@digigov/ui/navigation/Breadcrumbs/hooks';\n\nconst items: ConfigData[] = [\n  {\n    title: '\u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2',\n    children: [\n      { title: '\u0395\u03B3\u03C7\u03B5\u03B9\u03C1\u03AF\u03B4\u03B9\u03B1 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1\u03C2 \u03A0\u03C5\u03C1\u03B1\u03C3\u03C6\u03AC\u03BB\u03B5\u03B9\u03B1\u03C2', pdf: '#' },\n      { title: '\u0394\u03B9\u03AC\u03B3\u03C1\u03B1\u03BC\u03BC\u03B1 \u0399\u03C3\u03C7\u03CD\u03BF\u03C5\u03C3\u03B1\u03C2 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1\u03C2' },\n      { title: '\u039F\u03B4\u03B7\u03B3\u03AF\u03B5\u03C2 \u0395\u03C0\u03AF \u03A0\u03C1\u03BF\u03C4\u03CD\u03C0\u03C9\u03BD \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2' },\n      { title: '\u0391\u03C0\u03BB\u03BF\u03C5\u03C3\u03C4\u03B5\u03CD\u03C3\u03B5\u03B9\u03C2 \u0394\u03B9\u03B1\u03B4\u03B9\u03BA\u03B1\u03C3\u03B9\u03CE\u03BD' },\n      { title: '\u03A7\u03C1\u03AE\u03C3\u03B9\u03BC\u03B1 \u0388\u03B3\u03B3\u03C1\u03B1\u03C6\u03B1' },\n      {\n        title: '\u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1 \u03A0\u03C5\u03C1\u03B1\u03C3\u03C6\u03AC\u03BB\u03B5\u03B9\u03B1\u03C2',\n        children: [\n          {\n            title: '\u039B\u03BF\u03B9\u03C0\u03AD\u03C2 \u0394\u03C1\u03B1\u03C3\u03C4\u03B7\u03C1\u03B9\u03CC\u03C4\u03B7\u03C4\u03B5\u03C2 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2',\n          },\n          {\n            title:\n              '\u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2 \u03A0\u03B5\u03C4\u03C1\u03B5\u03BB\u03B1\u03B9\u03BF\u03B5\u03B9\u03B4\u03CE\u03BD \u03A0\u03C1\u03BF\u03CA\u03CC\u03BD\u03C4\u03C9\u03BD \u2013 \u03A5\u03B3\u03C1\u03B1\u03B5\u03C1\u03AF\u03BF\u03C5 \u2013 \u03A6\u03C5\u03C3\u03B9\u03BA\u03BF\u03CD \u0391\u03B5\u03C1\u03AF\u03BF\u03C5',\n          },\n          { title: '\u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2 \u03A0\u03C1\u03BF\u03BB\u03B7\u03C0\u03C4\u03B9\u03BA\u03AE\u03C2 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2' },\n          { title: '\u03A3\u03C5\u03BD\u03B4\u03C1\u03BF\u03BC\u03B7\u03C4\u03B9\u03BA\u03AE \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2' },\n          {\n            title:\n              '\u0394\u03C1\u03B1\u03C3\u03C4\u03B7\u03C1\u03B9\u03CC\u03C4\u03B7\u03C4\u03B5\u03C2 \u2013 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2 \u03C0\u03BF\u03C5 \u03B4\u03B5\u03BD \u03C5\u03C0\u03AC\u03B3\u03BF\u03BD\u03C4\u03B1\u03B9 \u03C3\u03B5 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C4\u03B9\u03BA\u03CC \u03A0\u03BB\u03B1\u03AF\u03C3\u03B9\u03BF',\n          },\n          {\n            title: '\u039A\u03B1\u03BD\u03BF\u03BD\u03B9\u03C3\u03BC\u03BF\u03AF \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2 \u039A\u03C4\u03B9\u03C1\u03AF\u03C9\u03BD',\n            // href: '/kanonismoi-pyroprostasias',\n            children: [\n              {\n                title: '\u039A\u03B1\u03C4\u03BF\u03B9\u03BA\u03AF\u03B5\u03C2',\n              },\n              {\n                title: '\u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2 \u039A\u03B5\u03BD\u03C4\u03C1\u03B9\u03BA\u03AE\u03C2 \u0398\u03AD\u03C1\u03BC\u03B1\u03BD\u03C3\u03B7\u03C2',\n              },\n              {\n                title: '\u03A0\u03C1\u03BF\u03C3\u03C9\u03C1\u03B9\u03BD\u03AE \u0394\u03B9\u03B1\u03BC\u03BF\u03BD\u03AE (\u039E\u03B5\u03BD/\u03C7\u03B5\u03AF\u03B1-\u039A\u03B1\u03C4/\u03C3\u03B5\u03B9\u03C2)',\n              },\n              {\n                title: '\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03AE\u03C1\u03B9\u03B1',\n              },\n              {\n                title: '\u0393\u03C1\u03B1\u03C6\u03B5\u03AF\u03B1',\n              },\n              {\n                title: '\u0395\u03BC\u03C0\u03CC\u03C1\u03B9\u03BF (\u039A\u03B1\u03C4\u03B1\u03C3\u03C4\u03AE\u03BC\u03B1\u03C4\u03B1)',\n              },\n              {\n                title: '\u03A3\u03C5\u03BD\u03AC\u03B8\u03C1\u03BF\u03B9\u03C3\u03B7 \u039A\u03BF\u03B9\u03BD\u03BF\u03CD',\n              },\n              {\n                title: '\u03A5\u03B3\u03B5\u03AF\u03B1 & \u039A\u03BF\u03B9\u03BD\u03C9\u03BD\u03B9\u03BA\u03AE \u03A0\u03C1\u03CC\u03BD\u03BF\u03B9\u03B1',\n              },\n              {\n                title: '\u03A3\u03C9\u03C6\u03C1\u03BF\u03BD\u03B9\u03C3\u03BC\u03CC\u03C2',\n              },\n              {\n                title: '\u03A3\u03C4\u03AC\u03B8\u03BC\u03B5\u03C5\u03C3\u03B7 \u0391\u03C5\u03C4\u03BF\u03BA\u03B9\u03BD\u03AE\u03C4\u03C9\u03BD',\n              },\n\n              {\n                title: '\u039B\u03BF\u03B9\u03C0\u03AD\u03C2 \u0392\u03B9\u03BF\u03BC\u03B7\u03C7\u03B1\u03BD\u03B9\u03BA\u03AD\u03C2 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2',\n              },\n              {\n                title: '\u0391\u03C0\u03BF\u03B8\u03AE\u03BA\u03B5\u03C5\u03C3\u03B7',\n              },\n              {\n                title: '\u03A3\u03C5\u03BD\u03B5\u03C1\u03B3\u03B5\u03AF\u03B1, \u0399\u039A\u03C4\u03AD\u03BF, \u0395\u03BC\u03C0.\u03A3\u03C4\u03B1\u03B8\u03BC\u03BF\u03AF, \u039A\u03C4\u03B5\u03BB, \u03A0\u03BB\u03C5\u03BD\u03C4.-\u039B\u03B9\u03C0\u03B1\u03BD\u03C4.',\n              },\n              {\n                title: '\u03A0\u03C1\u03B1\u03C4\u03AE\u03C1\u03B9\u03B1 \u03A5\u03B3\u03C1\u03CE\u03BD \u039A\u03B1\u03C5\u03C3\u03AF\u03BC\u03C9\u03BD',\n              },\n              {\n                title: '\u03A0\u03C1\u03B1\u03C4\u03AE\u03C1\u03B9\u03B1 \u0391\u03B5\u03C1\u03AF\u03C9\u03BD \u039A\u03B1\u03C5\u03C3\u03AF\u03BC\u03C9\u03BD',\n              },\n              {\n                title: '\u039C\u03B5\u03C4\u03B1\u03C0\u03BF\u03B9\u03B7\u03C4\u03B9\u03BA\u03AD\u03C2 & \u03A3\u03C5\u03BD\u03B1\u03C6\u03B5\u03AF\u03C2 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2',\n                // href: '/metapoiitikes-egkatastaseis',\n                children: [\n                  {\n                    title: '\u03A0\u0394 41/2018 & \u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018',\n                  },\n                  {\n                    title: '\u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018',\n                  },\n                  {\n                    title: '\u03A0\u0394 71/1988 \u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018',\n                    children: [\n                      { title: '\u0393\u03B5\u03BD\u03B9\u03BA\u03AD\u03C2 \u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2 \u03A0\u0394 41/2018' },\n                      { title: '\u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018' },\n                      {\n                        title: '\u0393\u03B5\u03BD\u03B9\u03BA\u03AD\u03C2 \u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2 \u03A0\u0394 71/2018',\n                        children: [\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 1: \u039F\u03C1\u03B9\u03C3\u03BC\u03BF\u03AF \u2013 \u03A4\u03B1\u03BE\u03B9\u03BD\u03CC\u03BC\u03B7\u03C3\u03B7 \u039A\u03C4\u03B9\u03C1\u03AF\u03C9\u03BD',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 2: \u039F\u03B4\u03B5\u03CD\u03C3\u03B5\u03B9\u03C2 \u0394\u03B9\u03B1\u03C6\u03C5\u03B3\u03AE\u03C2',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 3: \u0394\u03BF\u03BC\u03B9\u03BA\u03AE \u03A0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 4: \u0395\u03BD\u03B5\u03C1\u03B3\u03B7\u03C4\u03B9\u03BA\u03AC \u039C\u03AD\u03C4\u03C1\u03B1 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2',\n                            pdf: '#pdf',\n                          },\n                          {\n                            title:\n                              '\u0386\u03C1\u03B8\u03C1\u03BF 14: \u03A0\u03B1\u03C1\u03AC\u03C1\u03C4\u03B7\u03BC\u03B1 \u0391 - \u0394\u03B5\u03AF\u03BA\u03C4\u03B5\u03C2 \u03A0\u03C5\u03C1\u03B1\u03BD\u03C4\u03AF\u03C3\u03C4\u03B1\u03C3\u03B7\u03C2',\n                          },\n                          {\n                            title:\n                              '\u0386\u03C1\u03B8\u03C1\u03BF 14: \u03A0\u03B1\u03C1\u03AC\u03C1\u03C4\u03B7\u03BC\u03B1 \u0392 \u2013 \u0395\u03C3\u03C9\u03C4\u03B5\u03C1\u03B9\u03BA\u03AC \u03A4\u03B5\u03BB\u03B5\u03B9\u03CE\u03BC\u03B1\u03C4\u03B1',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 15: \u0395\u03C6\u03B1\u03C1\u03BC\u03BF\u03B3\u03AE \u03A0\u0394 71/1988',\n                          },\n                          {\n                            title:\n                              '\u0386\u03C1\u03B8\u03C1\u03BF 23-24: \u0388\u03BD\u03B1\u03C1\u03BE\u03B7 \u0395\u03C6\u03B1\u03C1\u03BC\u03BF\u03B3\u03AE\u03C2 \u2013 \u039A\u03B1\u03C4\u03B1\u03C1\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03B5\u03C2 \u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2',\n                          },\n                        ],\n                      },\n                    ],\n                  },\n                ],\n              },\n            ],\n          },\n        ],\n      },\n    ],\n  },\n];\n\nconst getListChild = (item, setActive) => {\n  return item.children ? (\n    <List listStyle=\"number\">\n      <ListItem>\n        <Heading size=\"md\">{item.title}</Heading>\n        {item.children?.map((subMenu, key) => (\n          <ListItem key={key}>{getListChild(subMenu, setActive)}</ListItem>\n        ))}\n      </ListItem>\n    </List>\n  ) : (\n    <Button variant='link' role=\"menuitem\" id={item.title} onClick={(e) => { e.preventDefault(), setActive(item) }}>\n      {item.title}\n    </Button>\n  );\n};\n\nexport const Auto = () => {\n  return (\n    <BreadcrumbsAuto items={items} hrefGenerator={(item) => { return item.href ? item.href : slug(item.title, 100) }}>\n      <BreadcrumbsListAuto />\n      <ContentRoutes />\n    </BreadcrumbsAuto>\n  );\n};\n\nconst ContentRoutes = () => {\n  const { active, setActive } = useBreadcrumbsContext();\n\n  return <>\n    <Heading size=\"xl\">\n      {active?.title}\n    </Heading>\n    {items.map((item) => getListChild(item, setActive))}\n  </>;\n};\n\nexport default Auto;"],
-  "mappings": "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",
+  "sourcesContent": ["import React from 'react';\nimport { List, ListItem } from '@digigov/ui/content/List';\nimport { Button } from '@digigov/ui/form/Button/';\nimport {\n  BreadcrumbsAuto,\n  BreadcrumbsListAuto,\n  useBreadcrumbsContext,\n} from '@digigov/ui/navigation/Breadcrumbs/auto';\nimport { BreadcrumbItem } from '@digigov/ui/navigation/Breadcrumbs/hooks';\nimport { Heading } from '@digigov/ui/typography';\n\nconst items: BreadcrumbItem[] = [\n  {\n    title: '\u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2',\n    children: [\n      { title: '\u0395\u03B3\u03C7\u03B5\u03B9\u03C1\u03AF\u03B4\u03B9\u03B1 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1\u03C2 \u03A0\u03C5\u03C1\u03B1\u03C3\u03C6\u03AC\u03BB\u03B5\u03B9\u03B1\u03C2', pdf: '#' },\n      { title: '\u0394\u03B9\u03AC\u03B3\u03C1\u03B1\u03BC\u03BC\u03B1 \u0399\u03C3\u03C7\u03CD\u03BF\u03C5\u03C3\u03B1\u03C2 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1\u03C2' },\n      { title: '\u039F\u03B4\u03B7\u03B3\u03AF\u03B5\u03C2 \u0395\u03C0\u03AF \u03A0\u03C1\u03BF\u03C4\u03CD\u03C0\u03C9\u03BD \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2' },\n      { title: '\u0391\u03C0\u03BB\u03BF\u03C5\u03C3\u03C4\u03B5\u03CD\u03C3\u03B5\u03B9\u03C2 \u0394\u03B9\u03B1\u03B4\u03B9\u03BA\u03B1\u03C3\u03B9\u03CE\u03BD' },\n      { title: '\u03A7\u03C1\u03AE\u03C3\u03B9\u03BC\u03B1 \u0388\u03B3\u03B3\u03C1\u03B1\u03C6\u03B1' },\n      {\n        title: '\u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1 \u03A0\u03C5\u03C1\u03B1\u03C3\u03C6\u03AC\u03BB\u03B5\u03B9\u03B1\u03C2',\n        children: [\n          {\n            title: '\u039B\u03BF\u03B9\u03C0\u03AD\u03C2 \u0394\u03C1\u03B1\u03C3\u03C4\u03B7\u03C1\u03B9\u03CC\u03C4\u03B7\u03C4\u03B5\u03C2 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2',\n          },\n          {\n            title:\n              '\u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2 \u03A0\u03B5\u03C4\u03C1\u03B5\u03BB\u03B1\u03B9\u03BF\u03B5\u03B9\u03B4\u03CE\u03BD \u03A0\u03C1\u03BF\u03CA\u03CC\u03BD\u03C4\u03C9\u03BD \u2013 \u03A5\u03B3\u03C1\u03B1\u03B5\u03C1\u03AF\u03BF\u03C5 \u2013 \u03A6\u03C5\u03C3\u03B9\u03BA\u03BF\u03CD \u0391\u03B5\u03C1\u03AF\u03BF\u03C5',\n          },\n          { title: '\u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2 \u03A0\u03C1\u03BF\u03BB\u03B7\u03C0\u03C4\u03B9\u03BA\u03AE\u03C2 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2' },\n          { title: '\u03A3\u03C5\u03BD\u03B4\u03C1\u03BF\u03BC\u03B7\u03C4\u03B9\u03BA\u03AE \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2' },\n          {\n            title:\n              '\u0394\u03C1\u03B1\u03C3\u03C4\u03B7\u03C1\u03B9\u03CC\u03C4\u03B7\u03C4\u03B5\u03C2 \u2013 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2 \u03C0\u03BF\u03C5 \u03B4\u03B5\u03BD \u03C5\u03C0\u03AC\u03B3\u03BF\u03BD\u03C4\u03B1\u03B9 \u03C3\u03B5 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C4\u03B9\u03BA\u03CC \u03A0\u03BB\u03B1\u03AF\u03C3\u03B9\u03BF',\n          },\n          {\n            title: '\u039A\u03B1\u03BD\u03BF\u03BD\u03B9\u03C3\u03BC\u03BF\u03AF \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2 \u039A\u03C4\u03B9\u03C1\u03AF\u03C9\u03BD',\n            // href: '/kanonismoi-pyroprostasias',\n            children: [\n              {\n                title: '\u039A\u03B1\u03C4\u03BF\u03B9\u03BA\u03AF\u03B5\u03C2',\n              },\n              {\n                title: '\u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2 \u039A\u03B5\u03BD\u03C4\u03C1\u03B9\u03BA\u03AE\u03C2 \u0398\u03AD\u03C1\u03BC\u03B1\u03BD\u03C3\u03B7\u03C2',\n              },\n              {\n                title: '\u03A0\u03C1\u03BF\u03C3\u03C9\u03C1\u03B9\u03BD\u03AE \u0394\u03B9\u03B1\u03BC\u03BF\u03BD\u03AE (\u039E\u03B5\u03BD/\u03C7\u03B5\u03AF\u03B1-\u039A\u03B1\u03C4/\u03C3\u03B5\u03B9\u03C2)',\n              },\n              {\n                title: '\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03AE\u03C1\u03B9\u03B1',\n              },\n              {\n                title: '\u0393\u03C1\u03B1\u03C6\u03B5\u03AF\u03B1',\n              },\n              {\n                title: '\u0395\u03BC\u03C0\u03CC\u03C1\u03B9\u03BF (\u039A\u03B1\u03C4\u03B1\u03C3\u03C4\u03AE\u03BC\u03B1\u03C4\u03B1)',\n              },\n              {\n                title: '\u03A3\u03C5\u03BD\u03AC\u03B8\u03C1\u03BF\u03B9\u03C3\u03B7 \u039A\u03BF\u03B9\u03BD\u03BF\u03CD',\n              },\n              {\n                title: '\u03A5\u03B3\u03B5\u03AF\u03B1 & \u039A\u03BF\u03B9\u03BD\u03C9\u03BD\u03B9\u03BA\u03AE \u03A0\u03C1\u03CC\u03BD\u03BF\u03B9\u03B1',\n              },\n              {\n                title: '\u03A3\u03C9\u03C6\u03C1\u03BF\u03BD\u03B9\u03C3\u03BC\u03CC\u03C2',\n              },\n              {\n                title: '\u03A3\u03C4\u03AC\u03B8\u03BC\u03B5\u03C5\u03C3\u03B7 \u0391\u03C5\u03C4\u03BF\u03BA\u03B9\u03BD\u03AE\u03C4\u03C9\u03BD',\n              },\n\n              {\n                title: '\u039B\u03BF\u03B9\u03C0\u03AD\u03C2 \u0392\u03B9\u03BF\u03BC\u03B7\u03C7\u03B1\u03BD\u03B9\u03BA\u03AD\u03C2 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2',\n              },\n              {\n                title: '\u0391\u03C0\u03BF\u03B8\u03AE\u03BA\u03B5\u03C5\u03C3\u03B7',\n              },\n              {\n                title: '\u03A3\u03C5\u03BD\u03B5\u03C1\u03B3\u03B5\u03AF\u03B1, \u0399\u039A\u03C4\u03AD\u03BF, \u0395\u03BC\u03C0.\u03A3\u03C4\u03B1\u03B8\u03BC\u03BF\u03AF, \u039A\u03C4\u03B5\u03BB, \u03A0\u03BB\u03C5\u03BD\u03C4.-\u039B\u03B9\u03C0\u03B1\u03BD\u03C4.',\n              },\n              {\n                title: '\u03A0\u03C1\u03B1\u03C4\u03AE\u03C1\u03B9\u03B1 \u03A5\u03B3\u03C1\u03CE\u03BD \u039A\u03B1\u03C5\u03C3\u03AF\u03BC\u03C9\u03BD',\n              },\n              {\n                title: '\u03A0\u03C1\u03B1\u03C4\u03AE\u03C1\u03B9\u03B1 \u0391\u03B5\u03C1\u03AF\u03C9\u03BD \u039A\u03B1\u03C5\u03C3\u03AF\u03BC\u03C9\u03BD',\n              },\n              {\n                title: '\u039C\u03B5\u03C4\u03B1\u03C0\u03BF\u03B9\u03B7\u03C4\u03B9\u03BA\u03AD\u03C2 & \u03A3\u03C5\u03BD\u03B1\u03C6\u03B5\u03AF\u03C2 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2',\n                // href: '/metapoiitikes-egkatastaseis',\n                children: [\n                  {\n                    title: '\u03A0\u0394 41/2018 & \u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018',\n                  },\n                  {\n                    title: '\u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018',\n                  },\n                  {\n                    title: '\u03A0\u0394 71/1988 \u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018',\n                    children: [\n                      { title: '\u0393\u03B5\u03BD\u03B9\u03BA\u03AD\u03C2 \u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2 \u03A0\u0394 41/2018' },\n                      { title: '\u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018' },\n                      {\n                        title: '\u0393\u03B5\u03BD\u03B9\u03BA\u03AD\u03C2 \u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2 \u03A0\u0394 71/2018',\n                        children: [\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 1: \u039F\u03C1\u03B9\u03C3\u03BC\u03BF\u03AF \u2013 \u03A4\u03B1\u03BE\u03B9\u03BD\u03CC\u03BC\u03B7\u03C3\u03B7 \u039A\u03C4\u03B9\u03C1\u03AF\u03C9\u03BD',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 2: \u039F\u03B4\u03B5\u03CD\u03C3\u03B5\u03B9\u03C2 \u0394\u03B9\u03B1\u03C6\u03C5\u03B3\u03AE\u03C2',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 3: \u0394\u03BF\u03BC\u03B9\u03BA\u03AE \u03A0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 4: \u0395\u03BD\u03B5\u03C1\u03B3\u03B7\u03C4\u03B9\u03BA\u03AC \u039C\u03AD\u03C4\u03C1\u03B1 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2',\n                            pdf: '#pdf',\n                          },\n                          {\n                            title:\n                              '\u0386\u03C1\u03B8\u03C1\u03BF 14: \u03A0\u03B1\u03C1\u03AC\u03C1\u03C4\u03B7\u03BC\u03B1 \u0391 - \u0394\u03B5\u03AF\u03BA\u03C4\u03B5\u03C2 \u03A0\u03C5\u03C1\u03B1\u03BD\u03C4\u03AF\u03C3\u03C4\u03B1\u03C3\u03B7\u03C2',\n                          },\n                          {\n                            title:\n                              '\u0386\u03C1\u03B8\u03C1\u03BF 14: \u03A0\u03B1\u03C1\u03AC\u03C1\u03C4\u03B7\u03BC\u03B1 \u0392 \u2013 \u0395\u03C3\u03C9\u03C4\u03B5\u03C1\u03B9\u03BA\u03AC \u03A4\u03B5\u03BB\u03B5\u03B9\u03CE\u03BC\u03B1\u03C4\u03B1',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 15: \u0395\u03C6\u03B1\u03C1\u03BC\u03BF\u03B3\u03AE \u03A0\u0394 71/1988',\n                          },\n                          {\n                            title:\n                              '\u0386\u03C1\u03B8\u03C1\u03BF 23-24: \u0388\u03BD\u03B1\u03C1\u03BE\u03B7 \u0395\u03C6\u03B1\u03C1\u03BC\u03BF\u03B3\u03AE\u03C2 \u2013 \u039A\u03B1\u03C4\u03B1\u03C1\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03B5\u03C2 \u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2',\n                          },\n                        ],\n                      },\n                    ],\n                  },\n                ],\n              },\n            ],\n          },\n        ],\n      },\n    ],\n  },\n];\n\nconst getListChild = (item, setActive) => {\n  return item.children ? (\n    <>\n      <Heading size=\"sm\" mb={0}>\n        {item.title}\n      </Heading>\n      <List listStyle=\"number\">\n        {item.children?.map((subMenu, key) => (\n          <ListItem key={key}>{getListChild(subMenu, setActive)}</ListItem>\n        ))}\n      </List>\n    </>\n  ) : (\n    <Button\n      variant=\"link\"\n      role=\"menuitem\"\n      id={item.title}\n      onClick={(e) => {\n        e.preventDefault();\n        setActive(item);\n      }}\n    >\n      {item.title}\n    </Button>\n  );\n};\n\nexport const Auto = () => {\n  return (\n    <BreadcrumbsAuto\n      items={items}\n      initialUrlRoute=\"/nomothesia-pyroprostasias/odigies-epi-protypon-pyroprostasias\"\n    >\n      <BreadcrumbsListAuto mb={8} />\n      <ContentRoutes />\n    </BreadcrumbsAuto>\n  );\n};\n\nconst ContentRoutes = () => {\n  const { breadcrumbs, setActiveItem } = useBreadcrumbsContext();\n\n  return (\n    <>\n      {breadcrumbs.length > 0 && (\n        <Heading size=\"xl\">\n          {breadcrumbs[breadcrumbs.length - 1]?.title}\n        </Heading>\n      )}\n      {items.map((item) => getListChild(item, setActiveItem))}\n    </>\n  );\n};\n\nexport default Auto;\n"],
+  "mappings": "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",
   "names": []
 }

package/navigation/Breadcrumbs/__stories__/WithHook/index.js

@@ -1,19 +1,24 @@
 import React from "react";
 import { List, ListItem } from "@digigov/ui/content/List";
+import { Button } from "@digigov/ui/form/Button";
 import {
   Breadcrumbs,
   BreadcrumbsList,
   BreadcrumbsListItem
 } from "@digigov/ui/navigation/Breadcrumbs";
-import { Button } from "@digigov/ui/form/Button";
+import {
+  useBreadcrumbs
+} from "@digigov/ui/navigation/Breadcrumbs/hooks";
 import { Heading } from "@digigov/ui/typography";
-import { useBreadcrumbs } from "@digigov/ui/navigation/Breadcrumbs/hooks";
-import { slug } from "@digigov/ui/navigation/Breadcrumbs/slug";
 const items = [
   {
     title: "\u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2",
     children: [
-      { title: "\u0395\u03B3\u03C7\u03B5\u03B9\u03C1\u03AF\u03B4\u03B9\u03B1 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1\u03C2 \u03A0\u03C5\u03C1\u03B1\u03C3\u03C6\u03AC\u03BB\u03B5\u03B9\u03B1\u03C2", pdf: "#", href: "echiridia-nomothesia-pyroprostasias" },
+      {
+        title: "\u0395\u03B3\u03C7\u03B5\u03B9\u03C1\u03AF\u03B4\u03B9\u03B1 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1\u03C2 \u03A0\u03C5\u03C1\u03B1\u03C3\u03C6\u03AC\u03BB\u03B5\u03B9\u03B1\u03C2",
+        pdf: "#",
+        href: "echiridia-nomothesia-pyroprostasias"
+      },
       { title: "\u0394\u03B9\u03AC\u03B3\u03C1\u03B1\u03BC\u03BC\u03B1 \u0399\u03C3\u03C7\u03CD\u03BF\u03C5\u03C3\u03B1\u03C2 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1\u03C2" },
       { title: "\u039F\u03B4\u03B7\u03B3\u03AF\u03B5\u03C2 \u0395\u03C0\u03AF \u03A0\u03C1\u03BF\u03C4\u03CD\u03C0\u03C9\u03BD \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2" },
       { title: "\u0391\u03C0\u03BB\u03BF\u03C5\u03C3\u03C4\u03B5\u03CD\u03C3\u03B5\u03B9\u03C2 \u0394\u03B9\u03B1\u03B4\u03B9\u03BA\u03B1\u03C3\u03B9\u03CE\u03BD" },
@@ -138,24 +143,35 @@ const items = [
   }
 ];
 const getListChild = (item, setActive) => {
-  return item.children ? /* @__PURE__ */ React.createElement(List, { listStyle: "number" }, /* @__PURE__ */ React.createElement(ListItem, null, /* @__PURE__ */ React.createElement(Heading, { size: "md" }, item.title), item.children?.map((subMenu, key) => /* @__PURE__ */ React.createElement(ListItem, { key }, getListChild(subMenu, setActive))))) : /* @__PURE__ */ React.createElement(Button, { variant: "link", role: "menuitem", id: item.title, onClick: (e) => {
-    e.preventDefault();
-    setActive(item);
-  } }, item.title);
+  return item.children ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Heading, { size: "sm", mb: 0 }, item.title), /* @__PURE__ */ React.createElement(List, { listStyle: "number" }, item.children?.map((subMenu, key) => /* @__PURE__ */ React.createElement(ListItem, { key }, getListChild(subMenu, setActive))))) : /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      variant: "link",
+      role: "menuitem",
+      id: item.title,
+      onClick: (e) => {
+        e.preventDefault();
+        setActive(item);
+      }
+    },
+    item.title
+  );
 };
 const WithHook = () => {
-  const { breadcrumbs, setActive } = useBreadcrumbs(items, (item) => {
-    return item.href ? item.href : slug(item.title, 100);
-  });
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, breadcrumbs.length > 0 && /* @__PURE__ */ React.createElement(Breadcrumbs, { marginBottom: 8 }, /* @__PURE__ */ React.createElement(BreadcrumbsList, null, breadcrumbs.map((breadcrumb, index) => /* @__PURE__ */ React.createElement(
+  const { breadcrumbs, setActiveItem } = useBreadcrumbs(
+    items,
+    "/nomothesia-pyroprostasias/odigies-epi-protypon-pyroprostasias"
+  );
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, breadcrumbs.length > 1 && /* @__PURE__ */ React.createElement(Breadcrumbs, { mb: 8 }, /* @__PURE__ */ React.createElement(BreadcrumbsList, null, breadcrumbs.map((breadcrumb, index) => /* @__PURE__ */ React.createElement(
     BreadcrumbsListItem,
     {
       key: index,
-      href: breadcrumb.href,
-      "aria-current": breadcrumb.active ? "page" : void 0
+      href: breadcrumbs.length - 1 === index ? void 0 : "#",
+      onClick: () => setActiveItem(breadcrumb),
+      "aria-current": breadcrumbs.length - 1 === index ? "page" : void 0
     },
     breadcrumb.title
-  )))), breadcrumbs.length > 0 && /* @__PURE__ */ React.createElement(Heading, { size: "xl" }, breadcrumbs[breadcrumbs.length - 1]?.title), items.map((item) => getListChild(item, setActive)));
+  )))), breadcrumbs.length > 0 && /* @__PURE__ */ React.createElement(Heading, { size: "xl" }, breadcrumbs[breadcrumbs.length - 1]?.title), items.map((item) => getListChild(item, setActiveItem)));
 };
 var WithHook_default = WithHook;
 export {

package/navigation/Breadcrumbs/__stories__/WithHook.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/navigation/Breadcrumbs/__stories__/WithHook.tsx"],
-  "sourcesContent": ["import React from 'react';\nimport { List, ListItem } from '@digigov/ui/content/List';\nimport {\n  Breadcrumbs,\n  BreadcrumbsList,\n  BreadcrumbsListItem,\n} from '@digigov/ui/navigation/Breadcrumbs';\nimport { Button } from '@digigov/ui/form/Button';\nimport { Heading } from '@digigov/ui/typography';\nimport { useBreadcrumbs } from '@digigov/ui/navigation/Breadcrumbs/hooks';\nimport { slug } from '@digigov/ui/navigation/Breadcrumbs/slug';\nimport { ConfigData, } from '@digigov/ui/navigation/Breadcrumbs/hooks';\n\nconst items: ConfigData[] = [\n  {\n    title: '\u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2',\n    children: [\n      { title: '\u0395\u03B3\u03C7\u03B5\u03B9\u03C1\u03AF\u03B4\u03B9\u03B1 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1\u03C2 \u03A0\u03C5\u03C1\u03B1\u03C3\u03C6\u03AC\u03BB\u03B5\u03B9\u03B1\u03C2', pdf: '#', href: \"echiridia-nomothesia-pyroprostasias\" },\n      { title: '\u0394\u03B9\u03AC\u03B3\u03C1\u03B1\u03BC\u03BC\u03B1 \u0399\u03C3\u03C7\u03CD\u03BF\u03C5\u03C3\u03B1\u03C2 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1\u03C2' },\n      { title: '\u039F\u03B4\u03B7\u03B3\u03AF\u03B5\u03C2 \u0395\u03C0\u03AF \u03A0\u03C1\u03BF\u03C4\u03CD\u03C0\u03C9\u03BD \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2' },\n      { title: '\u0391\u03C0\u03BB\u03BF\u03C5\u03C3\u03C4\u03B5\u03CD\u03C3\u03B5\u03B9\u03C2 \u0394\u03B9\u03B1\u03B4\u03B9\u03BA\u03B1\u03C3\u03B9\u03CE\u03BD' },\n      { title: '\u03A7\u03C1\u03AE\u03C3\u03B9\u03BC\u03B1 \u0388\u03B3\u03B3\u03C1\u03B1\u03C6\u03B1' },\n      {\n        title: '\u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1 \u03A0\u03C5\u03C1\u03B1\u03C3\u03C6\u03AC\u03BB\u03B5\u03B9\u03B1\u03C2',\n        children: [\n          {\n            title: '\u039B\u03BF\u03B9\u03C0\u03AD\u03C2 \u0394\u03C1\u03B1\u03C3\u03C4\u03B7\u03C1\u03B9\u03CC\u03C4\u03B7\u03C4\u03B5\u03C2 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2',\n          },\n          {\n            title:\n              '\u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2 \u03A0\u03B5\u03C4\u03C1\u03B5\u03BB\u03B1\u03B9\u03BF\u03B5\u03B9\u03B4\u03CE\u03BD \u03A0\u03C1\u03BF\u03CA\u03CC\u03BD\u03C4\u03C9\u03BD \u2013 \u03A5\u03B3\u03C1\u03B1\u03B5\u03C1\u03AF\u03BF\u03C5 \u2013 \u03A6\u03C5\u03C3\u03B9\u03BA\u03BF\u03CD \u0391\u03B5\u03C1\u03AF\u03BF\u03C5',\n          },\n          { title: '\u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2 \u03A0\u03C1\u03BF\u03BB\u03B7\u03C0\u03C4\u03B9\u03BA\u03AE\u03C2 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2' },\n          { title: '\u03A3\u03C5\u03BD\u03B4\u03C1\u03BF\u03BC\u03B7\u03C4\u03B9\u03BA\u03AE \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2' },\n          {\n            title:\n              '\u0394\u03C1\u03B1\u03C3\u03C4\u03B7\u03C1\u03B9\u03CC\u03C4\u03B7\u03C4\u03B5\u03C2 \u2013 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2 \u03C0\u03BF\u03C5 \u03B4\u03B5\u03BD \u03C5\u03C0\u03AC\u03B3\u03BF\u03BD\u03C4\u03B1\u03B9 \u03C3\u03B5 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C4\u03B9\u03BA\u03CC \u03A0\u03BB\u03B1\u03AF\u03C3\u03B9\u03BF',\n          },\n          {\n            title: '\u039A\u03B1\u03BD\u03BF\u03BD\u03B9\u03C3\u03BC\u03BF\u03AF \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2 \u039A\u03C4\u03B9\u03C1\u03AF\u03C9\u03BD',\n            // href: '/kanonismoi-pyroprostasias',\n            children: [\n              {\n                title: '\u039A\u03B1\u03C4\u03BF\u03B9\u03BA\u03AF\u03B5\u03C2',\n              },\n              {\n                title: '\u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2 \u039A\u03B5\u03BD\u03C4\u03C1\u03B9\u03BA\u03AE\u03C2 \u0398\u03AD\u03C1\u03BC\u03B1\u03BD\u03C3\u03B7\u03C2',\n              },\n              {\n                title: '\u03A0\u03C1\u03BF\u03C3\u03C9\u03C1\u03B9\u03BD\u03AE \u0394\u03B9\u03B1\u03BC\u03BF\u03BD\u03AE (\u039E\u03B5\u03BD/\u03C7\u03B5\u03AF\u03B1-\u039A\u03B1\u03C4/\u03C3\u03B5\u03B9\u03C2)',\n              },\n              {\n                title: '\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03AE\u03C1\u03B9\u03B1',\n              },\n              {\n                title: '\u0393\u03C1\u03B1\u03C6\u03B5\u03AF\u03B1',\n              },\n              {\n                title: '\u0395\u03BC\u03C0\u03CC\u03C1\u03B9\u03BF (\u039A\u03B1\u03C4\u03B1\u03C3\u03C4\u03AE\u03BC\u03B1\u03C4\u03B1)',\n              },\n              {\n                title: '\u03A3\u03C5\u03BD\u03AC\u03B8\u03C1\u03BF\u03B9\u03C3\u03B7 \u039A\u03BF\u03B9\u03BD\u03BF\u03CD',\n              },\n              {\n                title: '\u03A5\u03B3\u03B5\u03AF\u03B1 & \u039A\u03BF\u03B9\u03BD\u03C9\u03BD\u03B9\u03BA\u03AE \u03A0\u03C1\u03CC\u03BD\u03BF\u03B9\u03B1',\n              },\n              {\n                title: '\u03A3\u03C9\u03C6\u03C1\u03BF\u03BD\u03B9\u03C3\u03BC\u03CC\u03C2',\n              },\n              {\n                title: '\u03A3\u03C4\u03AC\u03B8\u03BC\u03B5\u03C5\u03C3\u03B7 \u0391\u03C5\u03C4\u03BF\u03BA\u03B9\u03BD\u03AE\u03C4\u03C9\u03BD',\n              },\n\n              {\n                title: '\u039B\u03BF\u03B9\u03C0\u03AD\u03C2 \u0392\u03B9\u03BF\u03BC\u03B7\u03C7\u03B1\u03BD\u03B9\u03BA\u03AD\u03C2 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2',\n              },\n              {\n                title: '\u0391\u03C0\u03BF\u03B8\u03AE\u03BA\u03B5\u03C5\u03C3\u03B7',\n              },\n              {\n                title: '\u03A3\u03C5\u03BD\u03B5\u03C1\u03B3\u03B5\u03AF\u03B1, \u0399\u039A\u03C4\u03AD\u03BF, \u0395\u03BC\u03C0.\u03A3\u03C4\u03B1\u03B8\u03BC\u03BF\u03AF, \u039A\u03C4\u03B5\u03BB, \u03A0\u03BB\u03C5\u03BD\u03C4.-\u039B\u03B9\u03C0\u03B1\u03BD\u03C4.',\n              },\n              {\n                title: '\u03A0\u03C1\u03B1\u03C4\u03AE\u03C1\u03B9\u03B1 \u03A5\u03B3\u03C1\u03CE\u03BD \u039A\u03B1\u03C5\u03C3\u03AF\u03BC\u03C9\u03BD',\n              },\n              {\n                title: '\u03A0\u03C1\u03B1\u03C4\u03AE\u03C1\u03B9\u03B1 \u0391\u03B5\u03C1\u03AF\u03C9\u03BD \u039A\u03B1\u03C5\u03C3\u03AF\u03BC\u03C9\u03BD',\n              },\n              {\n                title: '\u039C\u03B5\u03C4\u03B1\u03C0\u03BF\u03B9\u03B7\u03C4\u03B9\u03BA\u03AD\u03C2 & \u03A3\u03C5\u03BD\u03B1\u03C6\u03B5\u03AF\u03C2 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2',\n                // href: '/metapoiitikes-egkatastaseis',\n                children: [\n                  {\n                    title: '\u03A0\u0394 41/2018 & \u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018',\n                  },\n                  {\n                    title: '\u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018',\n                  },\n                  {\n                    title: '\u03A0\u0394 71/1988 \u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018',\n                    children: [\n                      { title: '\u0393\u03B5\u03BD\u03B9\u03BA\u03AD\u03C2 \u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2 \u03A0\u0394 41/2018' },\n                      { title: '\u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018' },\n                      {\n                        title: '\u0393\u03B5\u03BD\u03B9\u03BA\u03AD\u03C2 \u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2 \u03A0\u0394 71/2018',\n                        children: [\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 1: \u039F\u03C1\u03B9\u03C3\u03BC\u03BF\u03AF \u2013 \u03A4\u03B1\u03BE\u03B9\u03BD\u03CC\u03BC\u03B7\u03C3\u03B7 \u039A\u03C4\u03B9\u03C1\u03AF\u03C9\u03BD',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 2: \u039F\u03B4\u03B5\u03CD\u03C3\u03B5\u03B9\u03C2 \u0394\u03B9\u03B1\u03C6\u03C5\u03B3\u03AE\u03C2',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 3: \u0394\u03BF\u03BC\u03B9\u03BA\u03AE \u03A0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 4: \u0395\u03BD\u03B5\u03C1\u03B3\u03B7\u03C4\u03B9\u03BA\u03AC \u039C\u03AD\u03C4\u03C1\u03B1 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2',\n                            pdf: '#pdf',\n                          },\n                          {\n                            title:\n                              '\u0386\u03C1\u03B8\u03C1\u03BF 14: \u03A0\u03B1\u03C1\u03AC\u03C1\u03C4\u03B7\u03BC\u03B1 \u0391 - \u0394\u03B5\u03AF\u03BA\u03C4\u03B5\u03C2 \u03A0\u03C5\u03C1\u03B1\u03BD\u03C4\u03AF\u03C3\u03C4\u03B1\u03C3\u03B7\u03C2',\n                          },\n                          {\n                            title:\n                              '\u0386\u03C1\u03B8\u03C1\u03BF 14: \u03A0\u03B1\u03C1\u03AC\u03C1\u03C4\u03B7\u03BC\u03B1 \u0392 \u2013 \u0395\u03C3\u03C9\u03C4\u03B5\u03C1\u03B9\u03BA\u03AC \u03A4\u03B5\u03BB\u03B5\u03B9\u03CE\u03BC\u03B1\u03C4\u03B1',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 15: \u0395\u03C6\u03B1\u03C1\u03BC\u03BF\u03B3\u03AE \u03A0\u0394 71/1988',\n                          },\n                          {\n                            title:\n                              '\u0386\u03C1\u03B8\u03C1\u03BF 23-24: \u0388\u03BD\u03B1\u03C1\u03BE\u03B7 \u0395\u03C6\u03B1\u03C1\u03BC\u03BF\u03B3\u03AE\u03C2 \u2013 \u039A\u03B1\u03C4\u03B1\u03C1\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03B5\u03C2 \u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2',\n                          },\n                        ],\n                      },\n                    ],\n                  },\n                ],\n              },\n            ],\n          },\n        ],\n      },\n    ],\n  },\n];\n// creates the ol>li lists for the items data\nconst getListChild = (item, setActive) => {\n  return item.children ? (\n    <List listStyle=\"number\">\n      <ListItem>\n        <Heading size=\"md\">{item.title}</Heading>\n        {item.children?.map((subMenu, key) => (\n          <ListItem key={key}>{getListChild(subMenu, setActive)}</ListItem>\n        ))}\n      </ListItem>\n    </List>\n  ) : (\n    <Button variant=\"link\" role=\"menuitem\" id={item.title} onClick={(e) => { e.preventDefault(); setActive(item) }}>\n      {item.title}\n    </Button>\n  );\n};\n\nexport const WithHook = () => {\n  const { breadcrumbs, setActive } = useBreadcrumbs(items, (item) => { return item.href ? item.href : slug(item.title, 100) });\n  return (\n    <>\n      {breadcrumbs.length > 0 && (\n        <Breadcrumbs marginBottom={8}>\n          <BreadcrumbsList>\n            {breadcrumbs.map((breadcrumb, index) => (\n              <BreadcrumbsListItem\n                key={index}\n                href={breadcrumb.href}\n                aria-current={breadcrumb.active ? \"page\" : undefined}\n              >\n                {breadcrumb.title}\n              </BreadcrumbsListItem>\n            ))}\n          </BreadcrumbsList>\n        </Breadcrumbs>\n      )}\n      {breadcrumbs.length > 0 && (\n        <Heading size=\"xl\">\n          {breadcrumbs[breadcrumbs.length - 1]?.title}\n        </Heading>\n      )}\n      {items.map((item) => getListChild(item, setActive))}\n    </>\n  );\n};\n\nexport default WithHook;"],
-  "mappings": "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",
+  "sourcesContent": ["import React from 'react';\nimport { List, ListItem } from '@digigov/ui/content/List';\nimport { Button } from '@digigov/ui/form/Button';\nimport {\n  Breadcrumbs,\n  BreadcrumbsList,\n  BreadcrumbsListItem,\n} from '@digigov/ui/navigation/Breadcrumbs';\nimport {\n  useBreadcrumbs,\n  BreadcrumbItem,\n} from '@digigov/ui/navigation/Breadcrumbs/hooks';\nimport { Heading } from '@digigov/ui/typography';\n\nconst items: BreadcrumbItem[] = [\n  {\n    title: '\u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2',\n    children: [\n      {\n        title: '\u0395\u03B3\u03C7\u03B5\u03B9\u03C1\u03AF\u03B4\u03B9\u03B1 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1\u03C2 \u03A0\u03C5\u03C1\u03B1\u03C3\u03C6\u03AC\u03BB\u03B5\u03B9\u03B1\u03C2',\n        pdf: '#',\n        href: 'echiridia-nomothesia-pyroprostasias',\n      },\n      { title: '\u0394\u03B9\u03AC\u03B3\u03C1\u03B1\u03BC\u03BC\u03B1 \u0399\u03C3\u03C7\u03CD\u03BF\u03C5\u03C3\u03B1\u03C2 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1\u03C2' },\n      { title: '\u039F\u03B4\u03B7\u03B3\u03AF\u03B5\u03C2 \u0395\u03C0\u03AF \u03A0\u03C1\u03BF\u03C4\u03CD\u03C0\u03C9\u03BD \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2' },\n      { title: '\u0391\u03C0\u03BB\u03BF\u03C5\u03C3\u03C4\u03B5\u03CD\u03C3\u03B5\u03B9\u03C2 \u0394\u03B9\u03B1\u03B4\u03B9\u03BA\u03B1\u03C3\u03B9\u03CE\u03BD' },\n      { title: '\u03A7\u03C1\u03AE\u03C3\u03B9\u03BC\u03B1 \u0388\u03B3\u03B3\u03C1\u03B1\u03C6\u03B1' },\n      {\n        title: '\u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1 \u03A0\u03C5\u03C1\u03B1\u03C3\u03C6\u03AC\u03BB\u03B5\u03B9\u03B1\u03C2',\n        children: [\n          {\n            title: '\u039B\u03BF\u03B9\u03C0\u03AD\u03C2 \u0394\u03C1\u03B1\u03C3\u03C4\u03B7\u03C1\u03B9\u03CC\u03C4\u03B7\u03C4\u03B5\u03C2 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2',\n          },\n          {\n            title:\n              '\u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2 \u03A0\u03B5\u03C4\u03C1\u03B5\u03BB\u03B1\u03B9\u03BF\u03B5\u03B9\u03B4\u03CE\u03BD \u03A0\u03C1\u03BF\u03CA\u03CC\u03BD\u03C4\u03C9\u03BD \u2013 \u03A5\u03B3\u03C1\u03B1\u03B5\u03C1\u03AF\u03BF\u03C5 \u2013 \u03A6\u03C5\u03C3\u03B9\u03BA\u03BF\u03CD \u0391\u03B5\u03C1\u03AF\u03BF\u03C5',\n          },\n          { title: '\u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2 \u03A0\u03C1\u03BF\u03BB\u03B7\u03C0\u03C4\u03B9\u03BA\u03AE\u03C2 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2' },\n          { title: '\u03A3\u03C5\u03BD\u03B4\u03C1\u03BF\u03BC\u03B7\u03C4\u03B9\u03BA\u03AE \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C3\u03AF\u03B1 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2' },\n          {\n            title:\n              '\u0394\u03C1\u03B1\u03C3\u03C4\u03B7\u03C1\u03B9\u03CC\u03C4\u03B7\u03C4\u03B5\u03C2 \u2013 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2 \u03C0\u03BF\u03C5 \u03B4\u03B5\u03BD \u03C5\u03C0\u03AC\u03B3\u03BF\u03BD\u03C4\u03B1\u03B9 \u03C3\u03B5 \u039D\u03BF\u03BC\u03BF\u03B8\u03B5\u03C4\u03B9\u03BA\u03CC \u03A0\u03BB\u03B1\u03AF\u03C3\u03B9\u03BF',\n          },\n          {\n            title: '\u039A\u03B1\u03BD\u03BF\u03BD\u03B9\u03C3\u03BC\u03BF\u03AF \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2 \u039A\u03C4\u03B9\u03C1\u03AF\u03C9\u03BD',\n            // href: '/kanonismoi-pyroprostasias',\n            children: [\n              {\n                title: '\u039A\u03B1\u03C4\u03BF\u03B9\u03BA\u03AF\u03B5\u03C2',\n              },\n              {\n                title: '\u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2 \u039A\u03B5\u03BD\u03C4\u03C1\u03B9\u03BA\u03AE\u03C2 \u0398\u03AD\u03C1\u03BC\u03B1\u03BD\u03C3\u03B7\u03C2',\n              },\n              {\n                title: '\u03A0\u03C1\u03BF\u03C3\u03C9\u03C1\u03B9\u03BD\u03AE \u0394\u03B9\u03B1\u03BC\u03BF\u03BD\u03AE (\u039E\u03B5\u03BD/\u03C7\u03B5\u03AF\u03B1-\u039A\u03B1\u03C4/\u03C3\u03B5\u03B9\u03C2)',\n              },\n              {\n                title: '\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03AE\u03C1\u03B9\u03B1',\n              },\n              {\n                title: '\u0393\u03C1\u03B1\u03C6\u03B5\u03AF\u03B1',\n              },\n              {\n                title: '\u0395\u03BC\u03C0\u03CC\u03C1\u03B9\u03BF (\u039A\u03B1\u03C4\u03B1\u03C3\u03C4\u03AE\u03BC\u03B1\u03C4\u03B1)',\n              },\n              {\n                title: '\u03A3\u03C5\u03BD\u03AC\u03B8\u03C1\u03BF\u03B9\u03C3\u03B7 \u039A\u03BF\u03B9\u03BD\u03BF\u03CD',\n              },\n              {\n                title: '\u03A5\u03B3\u03B5\u03AF\u03B1 & \u039A\u03BF\u03B9\u03BD\u03C9\u03BD\u03B9\u03BA\u03AE \u03A0\u03C1\u03CC\u03BD\u03BF\u03B9\u03B1',\n              },\n              {\n                title: '\u03A3\u03C9\u03C6\u03C1\u03BF\u03BD\u03B9\u03C3\u03BC\u03CC\u03C2',\n              },\n              {\n                title: '\u03A3\u03C4\u03AC\u03B8\u03BC\u03B5\u03C5\u03C3\u03B7 \u0391\u03C5\u03C4\u03BF\u03BA\u03B9\u03BD\u03AE\u03C4\u03C9\u03BD',\n              },\n\n              {\n                title: '\u039B\u03BF\u03B9\u03C0\u03AD\u03C2 \u0392\u03B9\u03BF\u03BC\u03B7\u03C7\u03B1\u03BD\u03B9\u03BA\u03AD\u03C2 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2',\n              },\n              {\n                title: '\u0391\u03C0\u03BF\u03B8\u03AE\u03BA\u03B5\u03C5\u03C3\u03B7',\n              },\n              {\n                title: '\u03A3\u03C5\u03BD\u03B5\u03C1\u03B3\u03B5\u03AF\u03B1, \u0399\u039A\u03C4\u03AD\u03BF, \u0395\u03BC\u03C0.\u03A3\u03C4\u03B1\u03B8\u03BC\u03BF\u03AF, \u039A\u03C4\u03B5\u03BB, \u03A0\u03BB\u03C5\u03BD\u03C4.-\u039B\u03B9\u03C0\u03B1\u03BD\u03C4.',\n              },\n              {\n                title: '\u03A0\u03C1\u03B1\u03C4\u03AE\u03C1\u03B9\u03B1 \u03A5\u03B3\u03C1\u03CE\u03BD \u039A\u03B1\u03C5\u03C3\u03AF\u03BC\u03C9\u03BD',\n              },\n              {\n                title: '\u03A0\u03C1\u03B1\u03C4\u03AE\u03C1\u03B9\u03B1 \u0391\u03B5\u03C1\u03AF\u03C9\u03BD \u039A\u03B1\u03C5\u03C3\u03AF\u03BC\u03C9\u03BD',\n              },\n              {\n                title: '\u039C\u03B5\u03C4\u03B1\u03C0\u03BF\u03B9\u03B7\u03C4\u03B9\u03BA\u03AD\u03C2 & \u03A3\u03C5\u03BD\u03B1\u03C6\u03B5\u03AF\u03C2 \u0395\u03B3\u03BA\u03B1\u03C4\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2',\n                // href: '/metapoiitikes-egkatastaseis',\n                children: [\n                  {\n                    title: '\u03A0\u0394 41/2018 & \u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018',\n                  },\n                  {\n                    title: '\u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018',\n                  },\n                  {\n                    title: '\u03A0\u0394 71/1988 \u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018',\n                    children: [\n                      { title: '\u0393\u03B5\u03BD\u03B9\u03BA\u03AD\u03C2 \u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2 \u03A0\u0394 41/2018' },\n                      { title: '\u039A\u03A5\u0391 \u0391\u03A0-136860-1673-\u03A615-2018' },\n                      {\n                        title: '\u0393\u03B5\u03BD\u03B9\u03BA\u03AD\u03C2 \u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2 \u03A0\u0394 71/2018',\n                        children: [\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 1: \u039F\u03C1\u03B9\u03C3\u03BC\u03BF\u03AF \u2013 \u03A4\u03B1\u03BE\u03B9\u03BD\u03CC\u03BC\u03B7\u03C3\u03B7 \u039A\u03C4\u03B9\u03C1\u03AF\u03C9\u03BD',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 2: \u039F\u03B4\u03B5\u03CD\u03C3\u03B5\u03B9\u03C2 \u0394\u03B9\u03B1\u03C6\u03C5\u03B3\u03AE\u03C2',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 3: \u0394\u03BF\u03BC\u03B9\u03BA\u03AE \u03A0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 4: \u0395\u03BD\u03B5\u03C1\u03B3\u03B7\u03C4\u03B9\u03BA\u03AC \u039C\u03AD\u03C4\u03C1\u03B1 \u03A0\u03C5\u03C1\u03BF\u03C0\u03C1\u03BF\u03C3\u03C4\u03B1\u03C3\u03AF\u03B1\u03C2',\n                            pdf: '#pdf',\n                          },\n                          {\n                            title:\n                              '\u0386\u03C1\u03B8\u03C1\u03BF 14: \u03A0\u03B1\u03C1\u03AC\u03C1\u03C4\u03B7\u03BC\u03B1 \u0391 - \u0394\u03B5\u03AF\u03BA\u03C4\u03B5\u03C2 \u03A0\u03C5\u03C1\u03B1\u03BD\u03C4\u03AF\u03C3\u03C4\u03B1\u03C3\u03B7\u03C2',\n                          },\n                          {\n                            title:\n                              '\u0386\u03C1\u03B8\u03C1\u03BF 14: \u03A0\u03B1\u03C1\u03AC\u03C1\u03C4\u03B7\u03BC\u03B1 \u0392 \u2013 \u0395\u03C3\u03C9\u03C4\u03B5\u03C1\u03B9\u03BA\u03AC \u03A4\u03B5\u03BB\u03B5\u03B9\u03CE\u03BC\u03B1\u03C4\u03B1',\n                          },\n                          {\n                            title: '\u0386\u03C1\u03B8\u03C1\u03BF 15: \u0395\u03C6\u03B1\u03C1\u03BC\u03BF\u03B3\u03AE \u03A0\u0394 71/1988',\n                          },\n                          {\n                            title:\n                              '\u0386\u03C1\u03B8\u03C1\u03BF 23-24: \u0388\u03BD\u03B1\u03C1\u03BE\u03B7 \u0395\u03C6\u03B1\u03C1\u03BC\u03BF\u03B3\u03AE\u03C2 \u2013 \u039A\u03B1\u03C4\u03B1\u03C1\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03B5\u03C2 \u0394\u03B9\u03B1\u03C4\u03AC\u03BE\u03B5\u03B9\u03C2',\n                          },\n                        ],\n                      },\n                    ],\n                  },\n                ],\n              },\n            ],\n          },\n        ],\n      },\n    ],\n  },\n];\n\n// creates the ol>li lists for the items data\nconst getListChild = (item, setActive) => {\n  return item.children ? (\n    <>\n      <Heading size=\"sm\" mb={0}>\n        {item.title}\n      </Heading>\n      <List listStyle=\"number\">\n        {item.children?.map((subMenu, key) => (\n          <ListItem key={key}>{getListChild(subMenu, setActive)}</ListItem>\n        ))}\n      </List>\n    </>\n  ) : (\n    <Button\n      variant=\"link\"\n      role=\"menuitem\"\n      id={item.title}\n      onClick={(e) => {\n        e.preventDefault();\n        setActive(item);\n      }}\n    >\n      {item.title}\n    </Button>\n  );\n};\n\nexport const WithHook = () => {\n  // initialUrlRoute: '/nomothesia-pyroprostasias/odigies-epi-protypon-pyroprostasias'\n  // is to simulate that the user lands to a specific url\n  const { breadcrumbs, setActiveItem } = useBreadcrumbs(\n    items,\n    '/nomothesia-pyroprostasias/odigies-epi-protypon-pyroprostasias'\n  );\n  return (\n    <>\n      {breadcrumbs.length > 1 && (\n        <Breadcrumbs mb={8}>\n          <BreadcrumbsList>\n            {breadcrumbs.map((breadcrumb, index) => (\n              <BreadcrumbsListItem\n                key={index}\n                href={breadcrumbs.length - 1 === index ? undefined : '#'}\n                onClick={() => setActiveItem(breadcrumb)}\n                aria-current={\n                  breadcrumbs.length - 1 === index ? 'page' : undefined\n                }\n              >\n                {breadcrumb.title}\n              </BreadcrumbsListItem>\n            ))}\n          </BreadcrumbsList>\n        </Breadcrumbs>\n      )}\n      {breadcrumbs.length > 0 && (\n        <Heading size=\"xl\">\n          {breadcrumbs[breadcrumbs.length - 1]?.title}\n        </Heading>\n      )}\n      {items.map((item) => getListChild(item, setActiveItem))}\n    </>\n  );\n};\n\nexport default WithHook;\n"],
+  "mappings": "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",
   "names": []
 }

package/navigation/Breadcrumbs/__stories__/WithProvider/index.js

@@ -0,0 +1,17 @@
+import React from "react";
+import {
+  Breadcrumbs,
+  BreadcrumbsList,
+  BreadcrumbsListItem
+} from "@digigov/ui/navigation/Breadcrumbs";
+import { LinkProvider } from "@digigov/ui/navigation/Link";
+const CustomLink = (props) => {
+  return /* @__PURE__ */ React.createElement("div", null, "custom link: ", props.children);
+};
+const WithProvider = () => /* @__PURE__ */ React.createElement(LinkProvider, { component: CustomLink }, /* @__PURE__ */ React.createElement(Breadcrumbs, { role: "navigation" }, /* @__PURE__ */ React.createElement(BreadcrumbsList, null, /* @__PURE__ */ React.createElement(BreadcrumbsListItem, { href: "#" }, "\u0391\u03C1\u03C7\u03B9\u03BA\u03AE"), /* @__PURE__ */ React.createElement(BreadcrumbsListItem, { href: "#" }, "\u03A5\u03B3\u03B5\u03AF\u03B1 \u03BA\u03B1\u03B9 \u03C0\u03C1\u03CC\u03BD\u03BF\u03B9\u03B1"), /* @__PURE__ */ React.createElement(BreadcrumbsListItem, { href: "#" }, "\u03A6\u03AC\u03BA\u03B5\u03BB\u03BF\u03C2 \u03C5\u03B3\u03B5\u03AF\u03B1\u03C2"), /* @__PURE__ */ React.createElement(BreadcrumbsListItem, { "aria-current": "page" }, "\u0386\u03C5\u03BB\u03B7 \u03C3\u03C5\u03BD\u03C4\u03B1\u03B3\u03BF\u03B3\u03C1\u03AC\u03C6\u03B7\u03C3\u03B7"))));
+var WithProvider_default = WithProvider;
+export {
+  WithProvider,
+  WithProvider_default as default
+};
+//# sourceMappingURL=WithProvider.js.map

package/navigation/Breadcrumbs/__stories__/WithProvider/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "./index.js",
+  "types": "./index.d.ts",
+  "main": "../../../../cjs/navigation/Breadcrumbs/__stories__/WithProvider/index.js"
+}

package/navigation/Breadcrumbs/__stories__/WithProvider.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const WithProvider: () => React.JSX.Element;
+export default WithProvider;

package/navigation/Breadcrumbs/__stories__/WithProvider.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/navigation/Breadcrumbs/__stories__/WithProvider.tsx"],
+  "sourcesContent": ["import React from 'react';\nimport {\n  Breadcrumbs,\n  BreadcrumbsList,\n  BreadcrumbsListItem,\n} from '@digigov/ui/navigation/Breadcrumbs';\nimport { LinkProvider } from '@digigov/ui/navigation/Link';\n\nconst CustomLink: React.FC<any> = (props) => {\n  return <div>custom link: {props.children}</div>;\n};\n\nexport const WithProvider = () => (\n  <LinkProvider component={CustomLink}>\n    <Breadcrumbs role=\"navigation\">\n      <BreadcrumbsList>\n        <BreadcrumbsListItem href=\"#\">\u0391\u03C1\u03C7\u03B9\u03BA\u03AE</BreadcrumbsListItem>\n        <BreadcrumbsListItem href=\"#\">\u03A5\u03B3\u03B5\u03AF\u03B1 \u03BA\u03B1\u03B9 \u03C0\u03C1\u03CC\u03BD\u03BF\u03B9\u03B1</BreadcrumbsListItem>\n        <BreadcrumbsListItem href=\"#\">\u03A6\u03AC\u03BA\u03B5\u03BB\u03BF\u03C2 \u03C5\u03B3\u03B5\u03AF\u03B1\u03C2</BreadcrumbsListItem>\n        <BreadcrumbsListItem aria-current=\"page\">\n          \u0386\u03C5\u03BB\u03B7 \u03C3\u03C5\u03BD\u03C4\u03B1\u03B3\u03BF\u03B3\u03C1\u03AC\u03C6\u03B7\u03C3\u03B7\n        </BreadcrumbsListItem>\n      </BreadcrumbsList>\n    </Breadcrumbs>\n  </LinkProvider>\n);\n\nexport default WithProvider;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,oBAAoB;AAE7B,MAAM,aAA4B,CAAC,UAAU;AAC3C,SAAO,oCAAC,aAAI,iBAAc,MAAM,QAAS;AAC3C;AAEO,MAAM,eAAe,MAC1B,oCAAC,gBAAa,WAAW,cACvB,oCAAC,eAAY,MAAK,gBAChB,oCAAC,uBACC,oCAAC,uBAAoB,MAAK,OAAI,sCAAM,GACpC,oCAAC,uBAAoB,MAAK,OAAI,8FAAiB,GAC/C,oCAAC,uBAAoB,MAAK,OAAI,iFAAc,GAC5C,oCAAC,uBAAoB,gBAAa,UAAO,+GAEzC,CACF,CACF,CACF;AAGF,IAAO,uBAAQ;",
+  "names": []
+}

package/navigation/Breadcrumbs/auto/index.js

@@ -1,10 +1,21 @@
 import React, { createContext, useContext } from "react";
-import { Breadcrumbs, BreadcrumbsList, BreadcrumbsListItem } from "@digigov/ui/navigation/Breadcrumbs";
-import { useBreadcrumbs } from "@digigov/ui/navigation/Breadcrumbs/hooks";
-;
-const BreadcrumbsContext = createContext(null);
-const BreadcrumbsAuto = ({ items, hrefGenerator, children }) => {
-  const breadcrumbs = useBreadcrumbs(items, hrefGenerator);
+import {
+  Breadcrumbs,
+  BreadcrumbsList,
+  BreadcrumbsListItem
+} from "@digigov/ui/navigation/Breadcrumbs";
+import {
+  useBreadcrumbs
+} from "@digigov/ui/navigation/Breadcrumbs/hooks";
+const BreadcrumbsContext = createContext(
+  null
+);
+const BreadcrumbsAuto = ({
+  items,
+  initialUrlRoute,
+  children
+}) => {
+  const breadcrumbs = useBreadcrumbs(items, initialUrlRoute);
   return /* @__PURE__ */ React.createElement(BreadcrumbsContext.Provider, { value: breadcrumbs }, children);
 };
 const useBreadcrumbsContext = () => {
@@ -16,16 +27,17 @@ const useBreadcrumbsContext = () => {
   }
   return context;
 };
-const BreadcrumbsListAuto = React.forwardRef(function(props, ref) {
-  const { breadcrumbs } = useBreadcrumbsContext();
-  return /* @__PURE__ */ React.createElement(Breadcrumbs, { ref, role: "navigation", ...props }, /* @__PURE__ */ React.createElement(BreadcrumbsList, null, breadcrumbs.map((item, index) => /* @__PURE__ */ React.createElement(
+const BreadcrumbsListAuto = React.forwardRef(function BreadcrumbsListAuto2(props, ref) {
+  const { breadcrumbs, setActiveItem } = useBreadcrumbsContext();
+  return /* @__PURE__ */ React.createElement(Breadcrumbs, { ref, role: "navigation", ...props }, /* @__PURE__ */ React.createElement(BreadcrumbsList, null, breadcrumbs.map((breadcrumb, index) => /* @__PURE__ */ React.createElement(
     BreadcrumbsListItem,
     {
       key: index,
-      href: item.href,
-      "aria-current": item.active ? "page" : void 0
+      href: breadcrumbs.length - 1 === index ? void 0 : breadcrumb.href,
+      onClick: () => setActiveItem(breadcrumb),
+      "aria-current": breadcrumbs.length - 1 === index ? "page" : void 0
     },
-    item.title
+    breadcrumb.title
   ))));
 });
 export {

package/navigation/Breadcrumbs/auto.d.ts

@@ -1,16 +1,14 @@
 import React, { ReactNode } from 'react';
 import { BreadcrumbsProps } from '@digigov/ui/navigation/Breadcrumbs';
-import { UseBreadcrumbsReturn, ConfigData, ChildrenData } from '@digigov/ui/navigation/Breadcrumbs/hooks';
+import { UseBreadcrumbsReturn, BreadcrumbItem } from '@digigov/ui/navigation/Breadcrumbs/hooks';
 export interface BreadcrumbsListAutoProps extends BreadcrumbsProps {
 }
 export interface BreadcrumbsAutoProps extends BreadcrumbsProps {
-}
-export interface BreadcrumbsAutoProps {
-    items: ConfigData[];
-    hrefGenerator: (value: ChildrenData) => string;
+    items: BreadcrumbItem[];
+    initialUrlRoute?: string;
     children: ReactNode;
 }
 export declare const BreadcrumbsContext: React.Context<UseBreadcrumbsReturn | null>;
-export declare const BreadcrumbsAuto: ({ items, hrefGenerator, children }: BreadcrumbsAutoProps) => React.JSX.Element;
+export declare const BreadcrumbsAuto: ({ items, initialUrlRoute, children, }: BreadcrumbsAutoProps) => React.JSX.Element;
 export declare const useBreadcrumbsContext: () => UseBreadcrumbsReturn;
 export declare const BreadcrumbsListAuto: React.ForwardRefExoticComponent<Omit<BreadcrumbsListAutoProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/navigation/Breadcrumbs/auto.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/navigation/Breadcrumbs/auto.tsx"],
-  "sourcesContent": ["import React, { createContext, useContext, ReactNode } from 'react';\nimport { Breadcrumbs, BreadcrumbsList, BreadcrumbsListItem, BreadcrumbsProps } from '@digigov/ui/navigation/Breadcrumbs';\nimport { useBreadcrumbs, UseBreadcrumbsReturn, ConfigData, ChildrenData } from '@digigov/ui/navigation/Breadcrumbs/hooks';\n\nexport interface BreadcrumbsListAutoProps extends BreadcrumbsProps { }\nexport interface BreadcrumbsAutoProps extends BreadcrumbsProps { }\nexport interface BreadcrumbsAutoProps {\n  items: ConfigData[];\n  hrefGenerator: (value: ChildrenData) => string;\n  children: ReactNode;\n};\nexport const BreadcrumbsContext = createContext<UseBreadcrumbsReturn | null>(null);\n\nexport const BreadcrumbsAuto = ({ items, hrefGenerator, children }: BreadcrumbsAutoProps) => {\n  const breadcrumbs = useBreadcrumbs(items, hrefGenerator);\n\n  return (\n    <BreadcrumbsContext.Provider value={breadcrumbs}>\n      {children}\n    </BreadcrumbsContext.Provider>\n  );\n};\n\nexport const useBreadcrumbsContext = (): UseBreadcrumbsReturn => {\n  const context = useContext(BreadcrumbsContext);\n  if (!context) {\n    throw new Error(\n      'BreadcrumbsContext must be used within an BreadcrumbsProvider'\n    );\n  }\n  return context;\n};\n\nexport const BreadcrumbsListAuto = React.forwardRef<\n  HTMLDivElement,\n  BreadcrumbsListAutoProps\n>(function (props, ref) {\n  const { breadcrumbs } = useBreadcrumbsContext();\n  return (\n    <Breadcrumbs ref={ref} role=\"navigation\" {...props}>\n      <BreadcrumbsList>\n        {breadcrumbs.map((item, index) => (\n          <BreadcrumbsListItem\n            key={index}\n            href={item.href}\n            aria-current={item.active ? \"page\" : undefined}\n          >\n            {item.title}\n          </BreadcrumbsListItem>\n        ))}\n      </BreadcrumbsList>\n\n    </Breadcrumbs>\n  );\n});"],
-  "mappings": "AAAA,OAAO,SAAS,eAAe,kBAA6B;AAC5D,SAAS,aAAa,iBAAiB,2BAA6C;AACpF,SAAS,sBAAsE;AAQ9E;AACM,MAAM,qBAAqB,cAA2C,IAAI;AAE1E,MAAM,kBAAkB,CAAC,EAAE,OAAO,eAAe,SAAS,MAA4B;AAC3F,QAAM,cAAc,eAAe,OAAO,aAAa;AAEvD,SACE,oCAAC,mBAAmB,UAAnB,EAA4B,OAAO,eACjC,QACH;AAEJ;AAEO,MAAM,wBAAwB,MAA4B;AAC/D,QAAM,UAAU,WAAW,kBAAkB;AAC7C,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;AAEO,MAAM,sBAAsB,MAAM,WAGvC,SAAU,OAAO,KAAK;AACtB,QAAM,EAAE,YAAY,IAAI,sBAAsB;AAC9C,SACE,oCAAC,eAAY,KAAU,MAAK,cAAc,GAAG,SAC3C,oCAAC,uBACE,YAAY,IAAI,CAAC,MAAM,UACtB;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,MAAM,KAAK;AAAA,MACX,gBAAc,KAAK,SAAS,SAAS;AAAA;AAAA,IAEpC,KAAK;AAAA,EACR,CACD,CACH,CAEF;AAEJ,CAAC;",
-  "names": []
+  "sourcesContent": ["import React, { createContext, useContext, ReactNode } from 'react';\nimport {\n  Breadcrumbs,\n  BreadcrumbsList,\n  BreadcrumbsListItem,\n  BreadcrumbsProps,\n} from '@digigov/ui/navigation/Breadcrumbs';\nimport {\n  useBreadcrumbs,\n  UseBreadcrumbsReturn,\n  BreadcrumbItem,\n} from '@digigov/ui/navigation/Breadcrumbs/hooks';\n\nexport interface BreadcrumbsListAutoProps extends BreadcrumbsProps {}\nexport interface BreadcrumbsAutoProps extends BreadcrumbsProps {\n  items: BreadcrumbItem[];\n  initialUrlRoute?: string;\n  children: ReactNode;\n}\nexport const BreadcrumbsContext = createContext<UseBreadcrumbsReturn | null>(\n  null\n);\n\nexport const BreadcrumbsAuto = ({\n  items,\n  initialUrlRoute,\n  children,\n}: BreadcrumbsAutoProps) => {\n  const breadcrumbs = useBreadcrumbs(items, initialUrlRoute);\n\n  return (\n    <BreadcrumbsContext.Provider value={breadcrumbs}>\n      {children}\n    </BreadcrumbsContext.Provider>\n  );\n};\n\nexport const useBreadcrumbsContext = (): UseBreadcrumbsReturn => {\n  const context = useContext(BreadcrumbsContext);\n  if (!context) {\n    throw new Error(\n      'BreadcrumbsContext must be used within an BreadcrumbsProvider'\n    );\n  }\n  return context;\n};\n\nexport const BreadcrumbsListAuto = React.forwardRef<\n  HTMLDivElement,\n  BreadcrumbsListAutoProps\n>(function BreadcrumbsListAuto(props, ref) {\n  const { breadcrumbs, setActiveItem } = useBreadcrumbsContext();\n  return (\n    <Breadcrumbs ref={ref} role=\"navigation\" {...props}>\n      <BreadcrumbsList>\n        {breadcrumbs.map((breadcrumb, index) => (\n          <BreadcrumbsListItem\n            key={index}\n            href={\n              breadcrumbs.length - 1 === index ? undefined : breadcrumb.href\n            }\n            onClick={() => setActiveItem(breadcrumb)}\n            aria-current={breadcrumbs.length - 1 === index ? 'page' : undefined}\n          >\n            {breadcrumb.title}\n          </BreadcrumbsListItem>\n        ))}\n      </BreadcrumbsList>\n    </Breadcrumbs>\n  );\n});\n"],
+  "mappings": "AAAA,OAAO,SAAS,eAAe,kBAA6B;AAC5D;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AACP;AAAA,EACE;AAAA,OAGK;AAQA,MAAM,qBAAqB;AAAA,EAChC;AACF;AAEO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AACF,MAA4B;AAC1B,QAAM,cAAc,eAAe,OAAO,eAAe;AAEzD,SACE,oCAAC,mBAAmB,UAAnB,EAA4B,OAAO,eACjC,QACH;AAEJ;AAEO,MAAM,wBAAwB,MAA4B;AAC/D,QAAM,UAAU,WAAW,kBAAkB;AAC7C,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;AAEO,MAAM,sBAAsB,MAAM,WAGvC,SAASA,qBAAoB,OAAO,KAAK;AACzC,QAAM,EAAE,aAAa,cAAc,IAAI,sBAAsB;AAC7D,SACE,oCAAC,eAAY,KAAU,MAAK,cAAc,GAAG,SAC3C,oCAAC,uBACE,YAAY,IAAI,CAAC,YAAY,UAC5B;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,MACE,YAAY,SAAS,MAAM,QAAQ,SAAY,WAAW;AAAA,MAE5D,SAAS,MAAM,cAAc,UAAU;AAAA,MACvC,gBAAc,YAAY,SAAS,MAAM,QAAQ,SAAS;AAAA;AAAA,IAEzD,WAAW;AAAA,EACd,CACD,CACH,CACF;AAEJ,CAAC;",
+  "names": ["BreadcrumbsListAuto"]
 }

package/navigation/Breadcrumbs/hooks/index.js

@@ -1,37 +1,48 @@
 import { useCallback, useMemo, useState } from "react";
+import { slug } from "@digigov/ui/navigation/Breadcrumbs/slug";
 import { flattenRoutes } from "@digigov/ui/navigation/Breadcrumbs/utils";
-const useBreadcrumbs = (items, hrefGenerator) => {
+const useBreadcrumbs = (items, initialUrlRoute) => {
   const routes = useMemo(() => flattenRoutes(items, 100), [items]);
-  const [currentPath, setCurrentPath] = useState("");
-  const setActive = useCallback((item) => {
-    const itemHref = item.href ?? hrefGenerator(item);
-    setCurrentPath(() => {
-      const newRoute = Object.keys(routes).find(
-        (route) => route.endsWith(itemHref)
-      );
-      return newRoute || "/";
-    });
-  }, [routes]);
-  const getParentPath = useCallback((parent) => {
-    return Object.keys(routes).find(
-      (path) => routes[path].title === parent
-    ) || "#";
-  }, [currentPath]);
-  const active = routes[currentPath.replace(/\/$/, "")];
-  const breadcrumbs = active?.parents.map((parent) => ({
-    title: parent,
-    href: `#${getParentPath(parent)}`
-  })) || [];
-  if (active?.title) {
-    breadcrumbs.push({
-      title: active.title,
-      active: true
-    });
-  }
+  const [currentRoute, setCurrentRoute] = useState(initialUrlRoute || "");
+  const setActiveItem = useCallback(
+    (item) => {
+      const itemHref = item.href ?? slug(item.title, 100);
+      setCurrentRoute(() => {
+        const selectedRoute = Object.keys(routes).find(
+          (route) => route.endsWith(itemHref)
+        );
+        return selectedRoute || "/";
+      });
+    },
+    [routes]
+  );
+  const constructBreadcrumbs = useCallback(
+    (routes2) => {
+      if (currentRoute) {
+        const selectedBreadcrumb = routes2[currentRoute];
+        return [
+          ...selectedBreadcrumb?.parents?.map((parent) => {
+            return {
+              title: parent,
+              href: Object.keys(routes2).find((route) => {
+                return routes2[route].title === parent;
+              })
+            };
+          }) || [],
+          {
+            title: selectedBreadcrumb?.title,
+            href: currentRoute
+          }
+        ];
+      }
+      return [];
+    },
+    [currentRoute]
+  );
   return {
-    breadcrumbs,
-    active,
-    setActive
+    breadcrumbs: constructBreadcrumbs(routes),
+    currentRoute,
+    setActiveItem
   };
 };
 export {

package/navigation/Breadcrumbs/hooks.d.ts

@@ -1,26 +1,11 @@
-export interface ChildrenData {
-    title: string;
-    href?: string;
-    pdf?: string;
-    children?: ChildrenData[];
-}
-export interface ConfigData {
-    title: string;
-    children?: ChildrenData[];
-}
 export interface BreadcrumbItem {
     title: string;
     href?: string;
-    active?: boolean;
-}
-export interface CurrentItem {
-    title: string;
-    children: CurrentItem[];
-    parents: string[];
+    [key: string]: unknown;
 }
 export interface UseBreadcrumbsReturn {
-    breadcrumbs: Array<BreadcrumbItem>;
-    active: CurrentItem;
-    setActive: (item: string) => void;
+    breadcrumbs: BreadcrumbItem[];
+    currentRoute: string;
+    setActiveItem: (item: BreadcrumbItem) => void;
 }
-export declare const useBreadcrumbs: (items: ConfigData[], hrefGenerator: (value: ChildrenData) => string) => UseBreadcrumbsReturn;
+export declare const useBreadcrumbs: (items: BreadcrumbItem[], initialUrlRoute?: string) => UseBreadcrumbsReturn;

package/navigation/Breadcrumbs/hooks.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/navigation/Breadcrumbs/hooks.ts"],
-  "sourcesContent": ["import { useCallback, useMemo, useState, } from 'react';\nimport { flattenRoutes } from '@digigov/ui/navigation/Breadcrumbs/utils';\n\nexport interface ChildrenData {\n  title: string;\n  href?: string;\n  pdf?: string;\n  children?: ChildrenData[];\n}\n\nexport interface ConfigData {\n  title: string;\n  children?: ChildrenData[];\n\n}\n\nexport interface BreadcrumbItem {\n  title: string;\n  href?: string;\n  active?: boolean;\n}\n\nexport interface CurrentItem {\n  title: string;\n  children: CurrentItem[];\n  parents: string[];\n}\n\nexport interface UseBreadcrumbsReturn {\n  breadcrumbs: Array<BreadcrumbItem>;\n  active: CurrentItem;\n  setActive: (item: string) => void;\n}\n\nexport const useBreadcrumbs = (\n  items: ConfigData[],\n  hrefGenerator: (value: ChildrenData) => string,\n): UseBreadcrumbsReturn => {\n  const routes = useMemo(() => flattenRoutes(items, 100), [items]);\n  const [currentPath, setCurrentPath] = useState('');\n\n  const setActive = useCallback((item) => {\n    const itemHref = item.href ?? hrefGenerator(item)\n    setCurrentPath(() => {\n      const newRoute = Object.keys(routes).find((route) =>\n        route.endsWith(itemHref)\n      );\n      return newRoute || '/';\n    });\n  }, [routes]);\n\n  const getParentPath = useCallback((parent: string): string => {\n    return Object.keys(routes).find(\n      (path) => routes[path].title === parent\n    ) || '#';\n  }, [currentPath]);\n\n  const active = routes[currentPath.replace(/\\/$/, '')];\n  const breadcrumbs = active?.parents.map((parent) => ({\n    title: parent,\n    href: `#${getParentPath(parent)}`\n  })) || [];\n  if (active?.title) {\n    breadcrumbs.push({\n      title: active.title,\n      active: true,\n    });\n  }\n\n  return {\n    breadcrumbs,\n    active,\n    setActive,\n  };\n};\n"],
-  "mappings": "AAAA,SAAS,aAAa,SAAS,gBAAiB;AAChD,SAAS,qBAAqB;AAiCvB,MAAM,iBAAiB,CAC5B,OACA,kBACyB;AACzB,QAAM,SAAS,QAAQ,MAAM,cAAc,OAAO,GAAG,GAAG,CAAC,KAAK,CAAC;AAC/D,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,EAAE;AAEjD,QAAM,YAAY,YAAY,CAAC,SAAS;AACtC,UAAM,WAAW,KAAK,QAAQ,cAAc,IAAI;AAChD,mBAAe,MAAM;AACnB,YAAM,WAAW,OAAO,KAAK,MAAM,EAAE;AAAA,QAAK,CAAC,UACzC,MAAM,SAAS,QAAQ;AAAA,MACzB;AACA,aAAO,YAAY;AAAA,IACrB,CAAC;AAAA,EACH,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,gBAAgB,YAAY,CAAC,WAA2B;AAC5D,WAAO,OAAO,KAAK,MAAM,EAAE;AAAA,MACzB,CAAC,SAAS,OAAO,IAAI,EAAE,UAAU;AAAA,IACnC,KAAK;AAAA,EACP,GAAG,CAAC,WAAW,CAAC;AAEhB,QAAM,SAAS,OAAO,YAAY,QAAQ,OAAO,EAAE,CAAC;AACpD,QAAM,cAAc,QAAQ,QAAQ,IAAI,CAAC,YAAY;AAAA,IACnD,OAAO;AAAA,IACP,MAAM,IAAI,cAAc,MAAM,CAAC;AAAA,EACjC,EAAE,KAAK,CAAC;AACR,MAAI,QAAQ,OAAO;AACjB,gBAAY,KAAK;AAAA,MACf,OAAO,OAAO;AAAA,MACd,QAAQ;AAAA,IACV,CAAC;AAAA,EACH;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
-  "names": []
+  "sourcesContent": ["import { useCallback, useMemo, useState } from 'react';\nimport { slug } from '@digigov/ui/navigation/Breadcrumbs/slug';\nimport { flattenRoutes } from '@digigov/ui/navigation/Breadcrumbs/utils';\n\nexport interface BreadcrumbItem {\n  title: string;\n  href?: string;\n  [key: string]: unknown;\n}\n\nexport interface UseBreadcrumbsReturn {\n  breadcrumbs: BreadcrumbItem[];\n  currentRoute: string;\n  setActiveItem: (item: BreadcrumbItem) => void;\n}\n\nexport const useBreadcrumbs = (\n  items: BreadcrumbItem[],\n  initialUrlRoute?: string\n): UseBreadcrumbsReturn => {\n  const routes = useMemo(() => flattenRoutes(items, 100), [items]);\n  const [currentRoute, setCurrentRoute] = useState(initialUrlRoute || '');\n\n  const setActiveItem = useCallback(\n    (item) => {\n      const itemHref = item.href ?? slug(item.title, 100);\n      setCurrentRoute(() => {\n        const selectedRoute = Object.keys(routes).find((route) =>\n          route.endsWith(itemHref)\n        );\n        return selectedRoute || '/';\n      });\n    },\n    [routes]\n  );\n\n  const constructBreadcrumbs = useCallback(\n    (routes): BreadcrumbItem[] => {\n      if (currentRoute) {\n        const selectedBreadcrumb = routes[currentRoute];\n        return [\n          ...(selectedBreadcrumb?.parents?.map((parent) => {\n            return {\n              title: parent,\n              href: Object.keys(routes).find((route) => {\n                return routes[route].title === parent;\n              }),\n            };\n          }) || []),\n          {\n            title: selectedBreadcrumb?.title,\n            href: currentRoute,\n          },\n        ];\n      }\n      return [];\n    },\n    [currentRoute]\n  );\n\n  return {\n    breadcrumbs: constructBreadcrumbs(routes),\n    currentRoute,\n    setActiveItem,\n  };\n};\n"],
+  "mappings": "AAAA,SAAS,aAAa,SAAS,gBAAgB;AAC/C,SAAS,YAAY;AACrB,SAAS,qBAAqB;AAcvB,MAAM,iBAAiB,CAC5B,OACA,oBACyB;AACzB,QAAM,SAAS,QAAQ,MAAM,cAAc,OAAO,GAAG,GAAG,CAAC,KAAK,CAAC;AAC/D,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,mBAAmB,EAAE;AAEtE,QAAM,gBAAgB;AAAA,IACpB,CAAC,SAAS;AACR,YAAM,WAAW,KAAK,QAAQ,KAAK,KAAK,OAAO,GAAG;AAClD,sBAAgB,MAAM;AACpB,cAAM,gBAAgB,OAAO,KAAK,MAAM,EAAE;AAAA,UAAK,CAAC,UAC9C,MAAM,SAAS,QAAQ;AAAA,QACzB;AACA,eAAO,iBAAiB;AAAA,MAC1B,CAAC;AAAA,IACH;AAAA,IACA,CAAC,MAAM;AAAA,EACT;AAEA,QAAM,uBAAuB;AAAA,IAC3B,CAACA,YAA6B;AAC5B,UAAI,cAAc;AAChB,cAAM,qBAAqBA,QAAO,YAAY;AAC9C,eAAO;AAAA,UACL,GAAI,oBAAoB,SAAS,IAAI,CAAC,WAAW;AAC/C,mBAAO;AAAA,cACL,OAAO;AAAA,cACP,MAAM,OAAO,KAAKA,OAAM,EAAE,KAAK,CAAC,UAAU;AACxC,uBAAOA,QAAO,KAAK,EAAE,UAAU;AAAA,cACjC,CAAC;AAAA,YACH;AAAA,UACF,CAAC,KAAK,CAAC;AAAA,UACP;AAAA,YACE,OAAO,oBAAoB;AAAA,YAC3B,MAAM;AAAA,UACR;AAAA,QACF;AAAA,MACF;AACA,aAAO,CAAC;AAAA,IACV;AAAA,IACA,CAAC,YAAY;AAAA,EACf;AAEA,SAAO;AAAA,IACL,aAAa,qBAAqB,MAAM;AAAA,IACxC;AAAA,IACA;AAAA,EACF;AACF;",
+  "names": ["routes"]
 }

package/navigation/Breadcrumbs/index.d.ts

@@ -1,6 +1,8 @@
 export * from '@digigov/react-core/Breadcrumbs';
 export * from '@digigov/react-core/BreadcrumbsList';
 export * from '@digigov/react-core/BreadcrumbsListItem';
+export * from '@digigov/react-core/BreadcrumbsListItemLink';
 import Breadcrumbs from '@digigov/react-core/Breadcrumbs';
+export * from '@digigov/ui/navigation/Breadcrumbs/BreadcrumbsListItem';
 export * from '@digigov/ui/navigation/Breadcrumbs/utils';
 export default Breadcrumbs;