@digigov/ui 2.0.0-e7d30530 → 2.0.0-eaf330f5

package/navigation/NavList/__stories__/UsingHeaderButton/index.js

@@ -0,0 +1,53 @@
+import React, { useState } from "react";
+import ChevronIcon from "@digigov/react-icons/ChevronIcon";
+import {
+  Header,
+  HeaderSection,
+  HeaderContent,
+  HeaderTitle
+} from "@digigov/ui/app/Header";
+import { Button } from "@digigov/ui/form/Button";
+import { GovGRLogo } from "@digigov/ui/govgr/GovGRLogo";
+import { Top } from "@digigov/ui/layouts/Basic/Top";
+import { Link } from "@digigov/ui/navigation/Link";
+import {
+  Nav,
+  NavMenuContainer,
+  NavMenuTitle,
+  NavMenuContent,
+  NavMenuContentList,
+  NavMenuContentListItem
+} from "@digigov/ui/navigation/NavList";
+import { Paragraph } from "@digigov/ui/typography/Paragraph";
+const links = [];
+for (let index = 0; index < 14; index++) {
+  links.push({
+    name: `Nav${index}`,
+    label: `\u03C3\u03CD\u03BD\u03B4\u03B5\u03C3\u03BC\u03BF\u03C2 ${index + 1}`,
+    href: `?q=item${index + 1}`
+  });
+}
+const menuLabel = "\u0395\u03C0\u03B9\u03BB\u03BF\u03B3\u03AD\u03C2";
+const menuTitle = "\u0395\u03C0\u03B9\u03BB\u03BF\u03B3\u03AD\u03C2 \u03C4\u03B7\u03C2 \u03C5\u03C0\u03B7\u03C1\u03B5\u03C3\u03AF\u03B1\u03C2";
+const UsingHeaderButton = () => {
+  const [open, setOpen] = useState(false);
+  return /* @__PURE__ */ React.createElement(Top, null, /* @__PURE__ */ React.createElement(Header, null, /* @__PURE__ */ React.createElement(HeaderContent, null, /* @__PURE__ */ React.createElement(HeaderSection, null, /* @__PURE__ */ React.createElement(GovGRLogo, { href: "#" }), /* @__PURE__ */ React.createElement(HeaderTitle, null, "\u03A4\u03AF\u03C4\u03BB\u03BF\u03C2 \u03A5\u03C0\u03B7\u03C1\u03B5\u03C3\u03AF\u03B1\u03C2")), /* @__PURE__ */ React.createElement(HeaderSection, null, /* @__PURE__ */ React.createElement(Button, { variant: "link", onClick: () => setOpen(!open) }, menuLabel, /* @__PURE__ */ React.createElement(ChevronIcon, { direction: open ? "up" : "down" }))))), /* @__PURE__ */ React.createElement(
+    Nav,
+    {
+      open,
+      drawer: "smDown",
+      onClose: () => setOpen(false),
+      closeButtonLabel: "\u039A\u03BB\u03B5\u03AF\u03C3\u03B9\u03BC\u03BF",
+      "aria-label": "navigation list"
+    },
+    /* @__PURE__ */ React.createElement(NavMenuContainer, { active: open }, /* @__PURE__ */ React.createElement(NavMenuContent, { md: 12 }, /* @__PURE__ */ React.createElement(Paragraph, null, "\u0395\u03BE\u03B5\u03C1\u03B5\u03C5\u03BD\u03AE\u03C3\u03C4\u03B5 \u03C4\u03B9\u03C2 \u03B4\u03C5\u03BD\u03B1\u03C4\u03CC\u03C4\u03B7\u03C4\u03B5\u03C2 \u03C4\u03B7\u03C2 \u03A5\u03C0\u03B7\u03C1\u03B5\u03C3\u03AF\u03B1\u03C2, \u03B5\u03C0\u03B9\u03BB\u03AD\u03B3\u03BF\u03BD\u03C4\u03B1\u03C2 \u03B1\u03C0\u03CC \u03C4\u03BF\u03C5\u03C2 \u03C0\u03B1\u03C1\u03B1\u03BA\u03AC\u03C4\u03C9 \u03C3\u03C5\u03BD\u03B4\u03AD\u03C3\u03BC\u03BF\u03C5\u03C2:")), /* @__PURE__ */ React.createElement(NavMenuTitle, null, menuTitle || menuLabel), /* @__PURE__ */ React.createElement(NavMenuContent, null, /* @__PURE__ */ React.createElement(NavMenuContentList, { role: "menu" }, links && links.map((item, menuIndex) => {
+      return /* @__PURE__ */ React.createElement(NavMenuContentListItem, { key: menuIndex, role: "presentation" }, item?.href && /* @__PURE__ */ React.createElement(Link, { role: "menuitem", id: item.name, href: item.href }, item.label));
+    }))))
+  ));
+};
+var UsingHeaderButton_default = UsingHeaderButton;
+export {
+  UsingHeaderButton,
+  UsingHeaderButton_default as default
+};
+//# sourceMappingURL=UsingHeaderButton.js.map

package/navigation/NavList/__stories__/UsingHeaderButton/package.json

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

package/navigation/NavList/__stories__/UsingHeaderButton.d.ts

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

package/navigation/NavList/__stories__/UsingHeaderButton.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/navigation/NavList/__stories__/UsingHeaderButton.tsx"],
+  "sourcesContent": ["import React, { useState } from 'react';\nimport ChevronIcon from '@digigov/react-icons/ChevronIcon';\nimport {\n  Header,\n  HeaderSection,\n  HeaderContent,\n  HeaderTitle,\n} from '@digigov/ui/app/Header';\nimport { Button } from '@digigov/ui/form/Button';\nimport { GovGRLogo } from '@digigov/ui/govgr/GovGRLogo';\nimport { Top } from '@digigov/ui/layouts/Basic/Top';\nimport { Link } from '@digigov/ui/navigation/Link';\nimport {\n  Nav,\n  NavMenuContainer,\n  NavMenuTitle,\n  NavMenuContent,\n  NavMenuContentList,\n  NavMenuContentListItem,\n} from '@digigov/ui/navigation/NavList';\nimport { Paragraph } from '@digigov/ui/typography/Paragraph';\n\nconst links: any = [];\nfor (let index = 0; index < 14; index++) {\n  links.push({\n    name: `Nav${index}`,\n    label: `\u03C3\u03CD\u03BD\u03B4\u03B5\u03C3\u03BC\u03BF\u03C2 ${index + 1}`,\n    href: `?q=item${index + 1}`,\n  });\n}\n\nconst menuLabel = '\u0395\u03C0\u03B9\u03BB\u03BF\u03B3\u03AD\u03C2';\nconst menuTitle = '\u0395\u03C0\u03B9\u03BB\u03BF\u03B3\u03AD\u03C2 \u03C4\u03B7\u03C2 \u03C5\u03C0\u03B7\u03C1\u03B5\u03C3\u03AF\u03B1\u03C2';\n\nexport const UsingHeaderButton = () => {\n  const [open, setOpen] = useState(false);\n\n  return (\n    <Top>\n      <Header>\n        <HeaderContent>\n          <HeaderSection>\n            <GovGRLogo href=\"#\" />\n            <HeaderTitle>\u03A4\u03AF\u03C4\u03BB\u03BF\u03C2 \u03A5\u03C0\u03B7\u03C1\u03B5\u03C3\u03AF\u03B1\u03C2</HeaderTitle>\n          </HeaderSection>\n          <HeaderSection>\n            <Button variant=\"link\" onClick={() => setOpen(!open)}>\n              {menuLabel}\n              <ChevronIcon direction={open ? 'up' : 'down'} />\n            </Button>\n          </HeaderSection>\n        </HeaderContent>\n      </Header>\n      <Nav\n        open={open}\n        drawer=\"smDown\"\n        onClose={() => setOpen(false)}\n        closeButtonLabel=\"\u039A\u03BB\u03B5\u03AF\u03C3\u03B9\u03BC\u03BF\"\n        aria-label=\"navigation list\"\n      >\n        <NavMenuContainer active={open}>\n          <NavMenuContent md={12}>\n            <Paragraph>\n              \u0395\u03BE\u03B5\u03C1\u03B5\u03C5\u03BD\u03AE\u03C3\u03C4\u03B5 \u03C4\u03B9\u03C2 \u03B4\u03C5\u03BD\u03B1\u03C4\u03CC\u03C4\u03B7\u03C4\u03B5\u03C2 \u03C4\u03B7\u03C2 \u03A5\u03C0\u03B7\u03C1\u03B5\u03C3\u03AF\u03B1\u03C2, \u03B5\u03C0\u03B9\u03BB\u03AD\u03B3\u03BF\u03BD\u03C4\u03B1\u03C2 \u03B1\u03C0\u03CC \u03C4\u03BF\u03C5\u03C2\n              \u03C0\u03B1\u03C1\u03B1\u03BA\u03AC\u03C4\u03C9 \u03C3\u03C5\u03BD\u03B4\u03AD\u03C3\u03BC\u03BF\u03C5\u03C2:\n            </Paragraph>\n          </NavMenuContent>\n          <NavMenuTitle>{menuTitle || menuLabel}</NavMenuTitle>\n          <NavMenuContent>\n            <NavMenuContentList role=\"menu\">\n              {links &&\n                links.map((item, menuIndex) => {\n                  return (\n                    <NavMenuContentListItem key={menuIndex} role=\"presentation\">\n                      {item?.href && (\n                        <Link role=\"menuitem\" id={item.name} href={item.href}>\n                          {item.label}\n                        </Link>\n                      )}\n                    </NavMenuContentListItem>\n                  );\n                })}\n            </NavMenuContentList>\n          </NavMenuContent>\n        </NavMenuContainer>\n      </Nav>\n    </Top>\n  );\n};\n\nexport default UsingHeaderButton;\n"],
+  "mappings": "AAAA,OAAO,SAAS,gBAAgB;AAChC,OAAO,iBAAiB;AACxB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,SAAS,WAAW;AACpB,SAAS,YAAY;AACrB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,iBAAiB;AAE1B,MAAM,QAAa,CAAC;AACpB,SAAS,QAAQ,GAAG,QAAQ,IAAI,SAAS;AACvC,QAAM,KAAK;AAAA,IACT,MAAM,MAAM,KAAK;AAAA,IACjB,OAAO,0DAAa,QAAQ,CAAC;AAAA,IAC7B,MAAM,UAAU,QAAQ,CAAC;AAAA,EAC3B,CAAC;AACH;AAEA,MAAM,YAAY;AAClB,MAAM,YAAY;AAEX,MAAM,oBAAoB,MAAM;AACrC,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AAEtC,SACE,oCAAC,WACC,oCAAC,cACC,oCAAC,qBACC,oCAAC,qBACC,oCAAC,aAAU,MAAK,KAAI,GACpB,oCAAC,mBAAY,6FAAgB,CAC/B,GACA,oCAAC,qBACC,oCAAC,UAAO,SAAQ,QAAO,SAAS,MAAM,QAAQ,CAAC,IAAI,KAChD,WACD,oCAAC,eAAY,WAAW,OAAO,OAAO,QAAQ,CAChD,CACF,CACF,CACF,GACA;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,QAAO;AAAA,MACP,SAAS,MAAM,QAAQ,KAAK;AAAA,MAC5B,kBAAiB;AAAA,MACjB,cAAW;AAAA;AAAA,IAEX,oCAAC,oBAAiB,QAAQ,QACxB,oCAAC,kBAAe,IAAI,MAClB,oCAAC,iBAAU,mcAGX,CACF,GACA,oCAAC,oBAAc,aAAa,SAAU,GACtC,oCAAC,sBACC,oCAAC,sBAAmB,MAAK,UACtB,SACC,MAAM,IAAI,CAAC,MAAM,cAAc;AAC7B,aACE,oCAAC,0BAAuB,KAAK,WAAW,MAAK,kBAC1C,MAAM,QACL,oCAAC,QAAK,MAAK,YAAW,IAAI,KAAK,MAAM,MAAM,KAAK,QAC7C,KAAK,KACR,CAEJ;AAAA,IAEJ,CAAC,CACL,CACF,CACF;AAAA,EACF,CACF;AAEJ;AAEA,IAAO,4BAAQ;",
+  "names": []
+}

package/navigation/NavList/__stories__/UsingNavListAuto/index.js

@@ -0,0 +1,64 @@
+import React, { useState } from "react";
+import { Button } from "@digigov/ui/form/Button";
+import { BurgerIcon } from "@digigov/ui/icons";
+import { NavListAuto } from "@digigov/ui/navigation/NavList";
+const links = [
+  { name: "home", href: "#home", label: "\u0391\u03C1\u03C7\u03B9\u03BA\u03AE" },
+  {
+    name: "educational",
+    label: "\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03CC \u03C5\u03BB\u03B9\u03BA\u03CC",
+    subMenuHeading: "\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03CC \u03C5\u03BB\u03B9\u03BA\u03CC",
+    subMenu: [
+      {
+        name: "elearning",
+        href: "#elearning",
+        label: "\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03AE \u03C0\u03BB\u03B1\u03C4\u03C6\u03CC\u03C1\u03BC\u03B1"
+      },
+      {
+        name: "videos",
+        href: "#videos",
+        label: "\u0392\u03AF\u03BD\u03C4\u03B5\u03BF"
+      },
+      {
+        name: "presentations",
+        href: "#presentations",
+        label: "\u03A0\u03B1\u03C1\u03BF\u03C5\u03C3\u03B9\u03AC\u03C3\u03B5\u03B9\u03C2"
+      },
+      {
+        name: "promoting",
+        href: "#promoting",
+        label: "\u03A0\u03C1\u03BF\u03C9\u03B8\u03CE\u03BD\u03C4\u03B1\u03C2 \u03C4\u03B7\u03BD \u03B1\u03B8\u03BB\u03B7\u03C4\u03B9\u03BA\u03AE \u03B1\u03BA\u03B5\u03C1\u03B1\u03B9\u03CC\u03C4\u03B7\u03C4\u03B1 \u03C3\u03C4\u03B7\u03BD \u03BD\u03AD\u03B1 \u03B3\u03B5\u03BD\u03B9\u03AC"
+      },
+      {
+        name: "other-texts",
+        href: "#other-texts",
+        label: "\u0386\u03BB\u03BB\u03B1 \u03BA\u03B5\u03AF\u03BC\u03B5\u03BD\u03B1"
+      }
+    ]
+  },
+  { name: "news", href: "#news", label: "\u039D\u03AD\u03B1" }
+];
+const UsingNavListAuto = () => {
+  const layout = "horizontal";
+  const drawer = "smDown";
+  const border = true;
+  const [open, setOpen] = useState(false);
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Button, { color: "secondary", onClick: () => setOpen(!open), smUpHidden: true }, "\u0395\u03C0\u03B9\u03BB\u03BF\u03B3\u03AD\u03C2 ", /* @__PURE__ */ React.createElement(BurgerIcon, null)), /* @__PURE__ */ React.createElement(
+    NavListAuto,
+    {
+      layout,
+      border,
+      drawer,
+      open,
+      links,
+      onClose: () => setOpen(false),
+      "aria-label": "Nav list"
+    }
+  ));
+};
+var UsingNavListAuto_default = UsingNavListAuto;
+export {
+  UsingNavListAuto,
+  UsingNavListAuto_default as default
+};
+//# sourceMappingURL=UsingNavListAuto.js.map

package/navigation/NavList/__stories__/UsingNavListAuto/package.json

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

package/navigation/NavList/__stories__/UsingNavListAuto.d.ts

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

package/navigation/NavList/__stories__/UsingNavListAuto.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/navigation/NavList/__stories__/UsingNavListAuto.tsx"],
+  "sourcesContent": ["import React, { useState } from 'react';\nimport { Button } from '@digigov/ui/form/Button';\nimport { BurgerIcon } from '@digigov/ui/icons';\nimport { NavListAuto } from '@digigov/ui/navigation/NavList';\n\nconst links = [\n  { name: 'home', href: '#home', label: '\u0391\u03C1\u03C7\u03B9\u03BA\u03AE' },\n  {\n    name: 'educational',\n    label: '\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03CC \u03C5\u03BB\u03B9\u03BA\u03CC',\n    subMenuHeading: '\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03CC \u03C5\u03BB\u03B9\u03BA\u03CC',\n    subMenu: [\n      {\n        name: 'elearning',\n        href: '#elearning',\n        label: '\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03AE \u03C0\u03BB\u03B1\u03C4\u03C6\u03CC\u03C1\u03BC\u03B1',\n      },\n      {\n        name: 'videos',\n        href: '#videos',\n        label: '\u0392\u03AF\u03BD\u03C4\u03B5\u03BF',\n      },\n      {\n        name: 'presentations',\n        href: '#presentations',\n        label: '\u03A0\u03B1\u03C1\u03BF\u03C5\u03C3\u03B9\u03AC\u03C3\u03B5\u03B9\u03C2',\n      },\n      {\n        name: 'promoting',\n        href: '#promoting',\n        label: '\u03A0\u03C1\u03BF\u03C9\u03B8\u03CE\u03BD\u03C4\u03B1\u03C2 \u03C4\u03B7\u03BD \u03B1\u03B8\u03BB\u03B7\u03C4\u03B9\u03BA\u03AE \u03B1\u03BA\u03B5\u03C1\u03B1\u03B9\u03CC\u03C4\u03B7\u03C4\u03B1 \u03C3\u03C4\u03B7\u03BD \u03BD\u03AD\u03B1 \u03B3\u03B5\u03BD\u03B9\u03AC',\n      },\n      {\n        name: 'other-texts',\n        href: '#other-texts',\n        label: '\u0386\u03BB\u03BB\u03B1 \u03BA\u03B5\u03AF\u03BC\u03B5\u03BD\u03B1',\n      },\n    ],\n  },\n  { name: 'news', href: '#news', label: '\u039D\u03AD\u03B1' },\n];\n\nexport const UsingNavListAuto = () => {\n  const layout = 'horizontal';\n  const drawer = 'smDown';\n  const border = true;\n  const [open, setOpen] = useState(false);\n  return (\n    <>\n      <Button color=\"secondary\" onClick={() => setOpen(!open)} smUpHidden>\n        \u0395\u03C0\u03B9\u03BB\u03BF\u03B3\u03AD\u03C2 <BurgerIcon />\n      </Button>\n      <NavListAuto\n        layout={layout}\n        border={border}\n        drawer={drawer}\n        open={open}\n        links={links}\n        onClose={() => setOpen(false)}\n        aria-label=\"Nav list\"\n      ></NavListAuto>\n    </>\n  );\n};\n\nexport default UsingNavListAuto;\n"],
+  "mappings": "AAAA,OAAO,SAAS,gBAAgB;AAChC,SAAS,cAAc;AACvB,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AAE5B,MAAM,QAAQ;AAAA,EACZ,EAAE,MAAM,QAAQ,MAAM,SAAS,OAAO,uCAAS;AAAA,EAC/C;AAAA,IACE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,gBAAgB;AAAA,IAChB,SAAS;AAAA,MACP;AAAA,QACE,MAAM;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,IACF;AAAA,EACF;AAAA,EACA,EAAE,MAAM,QAAQ,MAAM,SAAS,OAAO,qBAAM;AAC9C;AAEO,MAAM,mBAAmB,MAAM;AACpC,QAAM,SAAS;AACf,QAAM,SAAS;AACf,QAAM,SAAS;AACf,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AACtC,SACE,0DACE,oCAAC,UAAO,OAAM,aAAY,SAAS,MAAM,QAAQ,CAAC,IAAI,GAAG,YAAU,QAAC,qDACzD,oCAAC,gBAAW,CACvB,GACA;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAS,MAAM,QAAQ,KAAK;AAAA,MAC5B,cAAW;AAAA;AAAA,EACZ,CACH;AAEJ;AAEA,IAAO,2BAAQ;",
+  "names": []
+}

package/navigation/NavList/__stories__/Vertical/index.js

@@ -0,0 +1,53 @@
+import React, { useState } from "react";
+import {
+  Nav,
+  NavList,
+  NavListItemAction,
+  useNavList
+} from "@digigov/ui/navigation/NavList";
+const links = [
+  {
+    name: "home",
+    href: "#home",
+    label: "\u0391\u03C1\u03C7\u03B9\u03BA\u03AE"
+  },
+  {
+    name: "educational",
+    label: "\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03CC \u03C5\u03BB\u03B9\u03BA\u03CC",
+    href: "#educational"
+  },
+  {
+    name: "news",
+    href: "#news",
+    label: "\u039D\u03AD\u03B1"
+  }
+];
+const Vertical = () => {
+  const layout = "vertical";
+  const { registerNavItem } = useNavList();
+  const [useActive, setUseActive] = useState("");
+  return /* @__PURE__ */ React.createElement(
+    Nav,
+    {
+      "aria-orientation": layout || "horizontal",
+      "aria-label": "navigation list",
+      border: false
+    },
+    /* @__PURE__ */ React.createElement(NavList, { layout }, links.map((item, key) => /* @__PURE__ */ React.createElement(
+      NavListItemAction,
+      {
+        ...registerNavItem(item),
+        key,
+        active: item.name === useActive,
+        onClick: () => setUseActive(item.name)
+      },
+      item.label
+    )))
+  );
+};
+var Vertical_default = Vertical;
+export {
+  Vertical,
+  Vertical_default as default
+};
+//# sourceMappingURL=Vertical.js.map

package/navigation/NavList/__stories__/Vertical/package.json

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

package/navigation/NavList/__stories__/Vertical.d.ts

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

package/navigation/NavList/__stories__/Vertical.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/navigation/NavList/__stories__/Vertical.tsx"],
+  "sourcesContent": ["import React, { useState } from 'react';\nimport {\n  Nav,\n  NavList,\n  NavListItemAction,\n  useNavList,\n} from '@digigov/ui/navigation/NavList';\n\nconst links = [\n  {\n    name: 'home',\n    href: '#home',\n    label: '\u0391\u03C1\u03C7\u03B9\u03BA\u03AE',\n  },\n  {\n    name: 'educational',\n    label: '\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03CC \u03C5\u03BB\u03B9\u03BA\u03CC',\n    href: '#educational',\n  },\n  {\n    name: 'news',\n    href: '#news',\n    label: '\u039D\u03AD\u03B1',\n  },\n];\n\nexport const Vertical = () => {\n  const layout = 'vertical';\n  const { registerNavItem } = useNavList();\n  const [useActive, setUseActive] = useState('');\n\n  return (\n    <Nav\n      aria-orientation={layout || 'horizontal'}\n      aria-label=\"navigation list\"\n      border={false}\n    >\n      <NavList layout={layout}>\n        {links.map((item, key) => (\n          <NavListItemAction\n            {...registerNavItem(item)}\n            key={key}\n            active={item.name === useActive}\n            onClick={() => setUseActive(item.name)}\n          >\n            {item.label}\n          </NavListItemAction>\n        ))}\n      </NavList>\n    </Nav>\n  );\n};\n\nexport default Vertical;\n"],
+  "mappings": "AAAA,OAAO,SAAS,gBAAgB;AAChC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,MAAM,QAAQ;AAAA,EACZ;AAAA,IACE,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,EACT;AACF;AAEO,MAAM,WAAW,MAAM;AAC5B,QAAM,SAAS;AACf,QAAM,EAAE,gBAAgB,IAAI,WAAW;AACvC,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,EAAE;AAE7C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,oBAAkB,UAAU;AAAA,MAC5B,cAAW;AAAA,MACX,QAAQ;AAAA;AAAA,IAER,oCAAC,WAAQ,UACN,MAAM,IAAI,CAAC,MAAM,QAChB;AAAA,MAAC;AAAA;AAAA,QACE,GAAG,gBAAgB,IAAI;AAAA,QACxB;AAAA,QACA,QAAQ,KAAK,SAAS;AAAA,QACtB,SAAS,MAAM,aAAa,KAAK,IAAI;AAAA;AAAA,MAEpC,KAAK;AAAA,IACR,CACD,CACH;AAAA,EACF;AAEJ;AAEA,IAAO,mBAAQ;",
+  "names": []
+}

package/navigation/NavList/__stories__/VerticalWithoutDrawer/index.js

@@ -0,0 +1,96 @@
+import React from "react";
+import Link from "@digigov/ui/navigation/Link";
+import {
+  Nav,
+  NavList,
+  NavListItemAction,
+  NavMenuContainer,
+  NavMenuContent,
+  NavMenuContentList,
+  NavMenuContentListItem,
+  NavMenuTitle
+} from "@digigov/ui/navigation/NavList";
+import { useNavList } from "@digigov/ui/navigation/NavList/hooks/useNavList";
+const links = [
+  { name: "home", href: "#home", label: "\u0391\u03C1\u03C7\u03B9\u03BA\u03AE" },
+  {
+    name: "educational",
+    label: "\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03CC \u03C5\u03BB\u03B9\u03BA\u03CC",
+    subMenuHeading: "\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03CC \u03C5\u03BB\u03B9\u03BA\u03CC",
+    subMenu: [
+      {
+        name: "elearning",
+        href: "#elearning",
+        label: "\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03AE \u03C0\u03BB\u03B1\u03C4\u03C6\u03CC\u03C1\u03BC\u03B1"
+      },
+      {
+        name: "videos",
+        href: "#videos",
+        label: "\u0392\u03AF\u03BD\u03C4\u03B5\u03BF"
+      },
+      {
+        name: "presentations",
+        href: "#presentations",
+        label: "\u03A0\u03B1\u03C1\u03BF\u03C5\u03C3\u03B9\u03AC\u03C3\u03B5\u03B9\u03C2"
+      },
+      {
+        name: "promoting",
+        href: "#promoting",
+        label: "\u03A0\u03C1\u03BF\u03C9\u03B8\u03CE\u03BD\u03C4\u03B1\u03C2 \u03C4\u03B7\u03BD \u03B1\u03B8\u03BB\u03B7\u03C4\u03B9\u03BA\u03AE \u03B1\u03BA\u03B5\u03C1\u03B1\u03B9\u03CC\u03C4\u03B7\u03C4\u03B1 \u03C3\u03C4\u03B7\u03BD \u03BD\u03AD\u03B1 \u03B3\u03B5\u03BD\u03B9\u03AC"
+      },
+      {
+        name: "other-texts",
+        href: "#other-texts",
+        label: "\u0386\u03BB\u03BB\u03B1 \u03BA\u03B5\u03AF\u03BC\u03B5\u03BD\u03B1"
+      }
+    ]
+  },
+  { name: "news", href: "#news", label: "\u039D\u03AD\u03B1" }
+];
+const VerticalWithoutDrawer = () => {
+  const layout = "vertical";
+  const border = false;
+  const { registerNavItemMenu, registerNavItem } = useNavList();
+  return /* @__PURE__ */ React.createElement(
+    Nav,
+    {
+      border,
+      "aria-orientation": layout || "horizontal",
+      "aria-label": "navigation list"
+    },
+    /* @__PURE__ */ React.createElement(NavList, { layout }, links.map((item, key) => /* @__PURE__ */ React.createElement(React.Fragment, { key }, /* @__PURE__ */ React.createElement(NavListItemAction, { ...registerNavItem(item) }, item.label), item.subMenu && /* @__PURE__ */ React.createElement(
+      NavMenuContainer,
+      {
+        layout,
+        paddingLeft: 5,
+        paddingRight: 5,
+        ...registerNavItemMenu(item.name)
+      },
+      /* @__PURE__ */ React.createElement(NavMenuTitle, null, item.label),
+      /* @__PURE__ */ React.createElement(NavMenuContent, null, /* @__PURE__ */ React.createElement(NavMenuContentList, { role: "menu" }, item.subMenu?.map((subMenu, menuIndex) => {
+        return subMenu?.href && /* @__PURE__ */ React.createElement(
+          NavMenuContentListItem,
+          {
+            key: menuIndex,
+            role: "presentation"
+          },
+          /* @__PURE__ */ React.createElement(
+            Link,
+            {
+              role: "menuitem",
+              id: subMenu.name,
+              href: subMenu.href
+            },
+            subMenu.label
+          )
+        );
+      })))
+    ))))
+  );
+};
+var VerticalWithoutDrawer_default = VerticalWithoutDrawer;
+export {
+  VerticalWithoutDrawer,
+  VerticalWithoutDrawer_default as default
+};
+//# sourceMappingURL=VerticalWithoutDrawer.js.map

package/navigation/NavList/__stories__/VerticalWithoutDrawer/package.json

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

package/navigation/NavList/__stories__/VerticalWithoutDrawer.d.ts

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

package/navigation/NavList/__stories__/VerticalWithoutDrawer.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/navigation/NavList/__stories__/VerticalWithoutDrawer.tsx"],
+  "sourcesContent": ["import React from 'react';\nimport Link from '@digigov/ui/navigation/Link';\nimport {\n  Nav,\n  NavList,\n  NavListItemAction,\n  NavMenuContainer,\n  NavMenuContent,\n  NavMenuContentList,\n  NavMenuContentListItem,\n  NavMenuTitle,\n} from '@digigov/ui/navigation/NavList';\nimport { useNavList } from '@digigov/ui/navigation/NavList/hooks/useNavList';\n\nconst links = [\n  { name: 'home', href: '#home', label: '\u0391\u03C1\u03C7\u03B9\u03BA\u03AE' },\n  {\n    name: 'educational',\n    label: '\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03CC \u03C5\u03BB\u03B9\u03BA\u03CC',\n    subMenuHeading: '\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03CC \u03C5\u03BB\u03B9\u03BA\u03CC',\n    subMenu: [\n      {\n        name: 'elearning',\n        href: '#elearning',\n        label: '\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03AE \u03C0\u03BB\u03B1\u03C4\u03C6\u03CC\u03C1\u03BC\u03B1',\n      },\n      {\n        name: 'videos',\n        href: '#videos',\n        label: '\u0392\u03AF\u03BD\u03C4\u03B5\u03BF',\n      },\n      {\n        name: 'presentations',\n        href: '#presentations',\n        label: '\u03A0\u03B1\u03C1\u03BF\u03C5\u03C3\u03B9\u03AC\u03C3\u03B5\u03B9\u03C2',\n      },\n      {\n        name: 'promoting',\n        href: '#promoting',\n        label: '\u03A0\u03C1\u03BF\u03C9\u03B8\u03CE\u03BD\u03C4\u03B1\u03C2 \u03C4\u03B7\u03BD \u03B1\u03B8\u03BB\u03B7\u03C4\u03B9\u03BA\u03AE \u03B1\u03BA\u03B5\u03C1\u03B1\u03B9\u03CC\u03C4\u03B7\u03C4\u03B1 \u03C3\u03C4\u03B7\u03BD \u03BD\u03AD\u03B1 \u03B3\u03B5\u03BD\u03B9\u03AC',\n      },\n      {\n        name: 'other-texts',\n        href: '#other-texts',\n        label: '\u0386\u03BB\u03BB\u03B1 \u03BA\u03B5\u03AF\u03BC\u03B5\u03BD\u03B1',\n      },\n    ],\n  },\n  { name: 'news', href: '#news', label: '\u039D\u03AD\u03B1' },\n];\n\nexport const VerticalWithoutDrawer = () => {\n  const layout = 'vertical';\n  const border = false;\n  const { registerNavItemMenu, registerNavItem } = useNavList();\n\n  return (\n    <Nav\n      border={border}\n      aria-orientation={layout || 'horizontal'}\n      aria-label=\"navigation list\"\n    >\n      <NavList layout={layout}>\n        {links.map((item, key) => (\n          <React.Fragment key={key}>\n            <NavListItemAction {...registerNavItem(item)}>\n              {item.label}\n            </NavListItemAction>\n            {item.subMenu && (\n              <NavMenuContainer\n                layout={layout}\n                paddingLeft={5}\n                paddingRight={5}\n                {...registerNavItemMenu(item.name)}\n              >\n                <NavMenuTitle>{item.label}</NavMenuTitle>\n                <NavMenuContent>\n                  <NavMenuContentList role=\"menu\">\n                    {item.subMenu?.map((subMenu, menuIndex) => {\n                      return (\n                        subMenu?.href && (\n                          <NavMenuContentListItem\n                            key={menuIndex}\n                            role=\"presentation\"\n                          >\n                            <Link\n                              role=\"menuitem\"\n                              id={subMenu.name}\n                              href={subMenu.href}\n                            >\n                              {subMenu.label}\n                            </Link>\n                          </NavMenuContentListItem>\n                        )\n                      );\n                    })}\n                  </NavMenuContentList>\n                </NavMenuContent>\n              </NavMenuContainer>\n            )}\n          </React.Fragment>\n        ))}\n      </NavList>\n    </Nav>\n  );\n};\n\nexport default VerticalWithoutDrawer;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAClB,OAAO,UAAU;AACjB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,kBAAkB;AAE3B,MAAM,QAAQ;AAAA,EACZ,EAAE,MAAM,QAAQ,MAAM,SAAS,OAAO,uCAAS;AAAA,EAC/C;AAAA,IACE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,gBAAgB;AAAA,IAChB,SAAS;AAAA,MACP;AAAA,QACE,MAAM;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,IACF;AAAA,EACF;AAAA,EACA,EAAE,MAAM,QAAQ,MAAM,SAAS,OAAO,qBAAM;AAC9C;AAEO,MAAM,wBAAwB,MAAM;AACzC,QAAM,SAAS;AACf,QAAM,SAAS;AACf,QAAM,EAAE,qBAAqB,gBAAgB,IAAI,WAAW;AAE5D,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,oBAAkB,UAAU;AAAA,MAC5B,cAAW;AAAA;AAAA,IAEX,oCAAC,WAAQ,UACN,MAAM,IAAI,CAAC,MAAM,QAChB,oCAAC,MAAM,UAAN,EAAe,OACd,oCAAC,qBAAmB,GAAG,gBAAgB,IAAI,KACxC,KAAK,KACR,GACC,KAAK,WACJ;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,aAAa;AAAA,QACb,cAAc;AAAA,QACb,GAAG,oBAAoB,KAAK,IAAI;AAAA;AAAA,MAEjC,oCAAC,oBAAc,KAAK,KAAM;AAAA,MAC1B,oCAAC,sBACC,oCAAC,sBAAmB,MAAK,UACtB,KAAK,SAAS,IAAI,CAAC,SAAS,cAAc;AACzC,eACE,SAAS,QACP;AAAA,UAAC;AAAA;AAAA,YACC,KAAK;AAAA,YACL,MAAK;AAAA;AAAA,UAEL;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,IAAI,QAAQ;AAAA,cACZ,MAAM,QAAQ;AAAA;AAAA,YAEb,QAAQ;AAAA,UACX;AAAA,QACF;AAAA,MAGN,CAAC,CACH,CACF;AAAA,IACF,CAEJ,CACD,CACH;AAAA,EACF;AAEJ;AAEA,IAAO,gCAAQ;",
+  "names": []
+}

package/navigation/NavList/__stories__/WithBadge/index.js

@@ -0,0 +1,54 @@
+import React, { useState } from "react";
+import {
+  Nav,
+  NavList,
+  NavListItemAction,
+  useNavList
+} from "@digigov/ui/navigation/NavList";
+const links = [
+  {
+    name: "home",
+    href: "#home",
+    label: "\u0391\u03C1\u03C7\u03B9\u03BA\u03AE"
+  },
+  {
+    name: "educational",
+    label: "\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03CC \u03C5\u03BB\u03B9\u03BA\u03CC",
+    href: "#educational"
+  },
+  {
+    name: "news",
+    href: "#news",
+    label: "\u039D\u03AD\u03B1",
+    badge: "2"
+  }
+];
+const WithBadge = () => {
+  const { registerNavItem } = useNavList();
+  const [useActive, setUseActive] = useState("");
+  return /* @__PURE__ */ React.createElement(
+    Nav,
+    {
+      "aria-orientation": "horizontal",
+      role: "menubar",
+      "aria-label": "navigation list"
+    },
+    /* @__PURE__ */ React.createElement(NavList, null, links.map((item, key) => /* @__PURE__ */ React.createElement(
+      NavListItemAction,
+      {
+        ...registerNavItem(item),
+        badgeText: item.badge,
+        key,
+        active: item.name === useActive,
+        onClick: () => setUseActive(item.name)
+      },
+      item.label
+    )))
+  );
+};
+var WithBadge_default = WithBadge;
+export {
+  WithBadge,
+  WithBadge_default as default
+};
+//# sourceMappingURL=WithBadge.js.map

package/navigation/NavList/__stories__/WithBadge/package.json

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

package/navigation/NavList/__stories__/WithBadge.d.ts

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

package/navigation/NavList/__stories__/WithBadge.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/navigation/NavList/__stories__/WithBadge.tsx"],
+  "sourcesContent": ["import React, { useState } from 'react';\nimport {\n  Nav,\n  NavList,\n  NavListItemAction,\n  useNavList,\n} from '@digigov/ui/navigation/NavList';\n\nconst links = [\n  {\n    name: 'home',\n    href: '#home',\n    label: '\u0391\u03C1\u03C7\u03B9\u03BA\u03AE',\n  },\n  {\n    name: 'educational',\n    label: '\u0395\u03BA\u03C0\u03B1\u03B9\u03B4\u03B5\u03C5\u03C4\u03B9\u03BA\u03CC \u03C5\u03BB\u03B9\u03BA\u03CC',\n    href: '#educational',\n  },\n  {\n    name: 'news',\n    href: '#news',\n    label: '\u039D\u03AD\u03B1',\n    badge: '2',\n  },\n];\n\nexport const WithBadge = () => {\n  const { registerNavItem } = useNavList();\n  const [useActive, setUseActive] = useState('');\n\n  return (\n    <Nav\n      aria-orientation=\"horizontal\"\n      role=\"menubar\"\n      aria-label=\"navigation list\"\n    >\n      <NavList>\n        {links.map((item, key) => (\n          <NavListItemAction\n            {...registerNavItem(item)}\n            badgeText={item.badge}\n            key={key}\n            active={item.name === useActive}\n            onClick={() => setUseActive(item.name)}\n          >\n            {item.label}\n          </NavListItemAction>\n        ))}\n      </NavList>\n    </Nav>\n  );\n};\n\nexport default WithBadge;\n"],
+  "mappings": "AAAA,OAAO,SAAS,gBAAgB;AAChC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,MAAM,QAAQ;AAAA,EACZ;AAAA,IACE,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AACF;AAEO,MAAM,YAAY,MAAM;AAC7B,QAAM,EAAE,gBAAgB,IAAI,WAAW;AACvC,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,EAAE;AAE7C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,oBAAiB;AAAA,MACjB,MAAK;AAAA,MACL,cAAW;AAAA;AAAA,IAEX,oCAAC,eACE,MAAM,IAAI,CAAC,MAAM,QAChB;AAAA,MAAC;AAAA;AAAA,QACE,GAAG,gBAAgB,IAAI;AAAA,QACxB,WAAW,KAAK;AAAA,QAChB;AAAA,QACA,QAAQ,KAAK,SAAS;AAAA,QACtB,SAAS,MAAM,aAAa,KAAK,IAAI;AAAA;AAAA,MAEpC,KAAK;AAAA,IACR,CACD,CACH;AAAA,EACF;AAEJ;AAEA,IAAO,oBAAQ;",
+  "names": []
+}

package/navigation/Pagination/Pagination.stories/index.js

@@ -0,0 +1,26 @@
+import Pagination from "@digigov/ui/navigation/Pagination";
+var Pagination_stories_default = {
+  title: "Digigov UI/navigation/Pagination",
+  description: "Use the pagination component to let users browse through a long list.",
+  link: "https://guide.services.gov.gr/docs/patterns/admin-pages/components/pagination",
+  component: Pagination,
+  displayName: "Pagination"
+};
+import { Default } from "@digigov/ui/navigation/Pagination/__stories__/Default";
+import { WithInactiveValues } from "@digigov/ui/navigation/Pagination/__stories__/WithInactiveValues";
+import { WithResultsPerPage } from "@digigov/ui/navigation/Pagination/__stories__/WithResultsPerPage";
+import { PaginationSmall } from "@digigov/ui/navigation/Pagination/__stories__/PaginationSmall";
+import { PaginationWithSmallFont } from "@digigov/ui/navigation/Pagination/__stories__/PaginationWithSmallFont";
+import { WithHook } from "@digigov/ui/navigation/Pagination/__stories__/WithHook";
+import { Auto } from "@digigov/ui/navigation/Pagination/__stories__/Auto";
+export {
+  Auto,
+  Default,
+  PaginationSmall,
+  PaginationWithSmallFont,
+  WithHook,
+  WithInactiveValues,
+  WithResultsPerPage,
+  Pagination_stories_default as default
+};
+//# sourceMappingURL=Pagination.stories.js.map

package/navigation/Pagination/Pagination.stories/package.json

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

package/navigation/Pagination/Pagination.stories.d.ts

@@ -3,8 +3,6 @@ declare namespace _default {
     export let description: string;
     export let link: string;
     export { Pagination as component };
-    export let tags: string[];
-    export { doc as markdown };
     export let displayName: string;
 }
 export default _default;

package/navigation/Pagination/Pagination.stories.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/navigation/Pagination/Pagination.stories.js"],
+  "sourcesContent": ["import Pagination from '@digigov/ui/navigation/Pagination';\nexport default {\n  title: 'Digigov UI/navigation/Pagination',\n  description:\n    'Use the pagination component to let users browse through a long list.',\n  link: 'https://guide.services.gov.gr/docs/patterns/admin-pages/components/pagination',\n  component: Pagination,\n  displayName: 'Pagination',\n};\nexport { Default } from '@digigov/ui/navigation/Pagination/__stories__/Default';\nexport { WithInactiveValues } from '@digigov/ui/navigation/Pagination/__stories__/WithInactiveValues';\nexport { WithResultsPerPage } from '@digigov/ui/navigation/Pagination/__stories__/WithResultsPerPage';\nexport { PaginationSmall } from '@digigov/ui/navigation/Pagination/__stories__/PaginationSmall';\nexport { PaginationWithSmallFont } from '@digigov/ui/navigation/Pagination/__stories__/PaginationWithSmallFont';\nexport { WithHook } from '@digigov/ui/navigation/Pagination/__stories__/WithHook';\nexport { Auto } from '@digigov/ui/navigation/Pagination/__stories__/Auto';\n"],
+  "mappings": "AAAA,OAAO,gBAAgB;AACvB,IAAO,6BAAQ;AAAA,EACb,OAAO;AAAA,EACP,aACE;AAAA,EACF,MAAM;AAAA,EACN,WAAW;AAAA,EACX,aAAa;AACf;AACA,SAAS,eAAe;AACxB,SAAS,0BAA0B;AACnC,SAAS,0BAA0B;AACnC,SAAS,uBAAuB;AAChC,SAAS,+BAA+B;AACxC,SAAS,gBAAgB;AACzB,SAAS,YAAY;",
+  "names": []
+}

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

@@ -0,0 +1,42 @@
+import React from "react";
+import Card from "@digigov/ui/content/Card";
+import Container from "@digigov/ui/layouts/Basic/Container";
+import Grid from "@digigov/ui/layouts/Grid";
+import { Pagination } from "@digigov/ui/navigation/Pagination";
+import {
+  PaginationContextAuto,
+  PaginationLabelAuto,
+  PaginationListAuto,
+  PaginationResultsPerPageSelectAuto,
+  usePaginationContext
+} from "@digigov/ui/navigation/Pagination/auto";
+const fetchedData = [];
+for (let i = 0; i < 78; i++) {
+  fetchedData.push({ id: i });
+}
+const DataGrid = ({ data }) => {
+  const { offset, limit } = usePaginationContext();
+  return /* @__PURE__ */ React.createElement(Grid, { container: true, spacing: 4, mb: { xs: 4, md: 8 } }, data.filter((_item, index) => {
+    return index > offset && index < offset + limit;
+  }).map((item, index) => {
+    return /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 4, md: 2, key: index }, /* @__PURE__ */ React.createElement(Card, { variant: "border", borderColor: "light", dense: true }, item.id));
+  }));
+};
+const Auto = () => {
+  return /* @__PURE__ */ React.createElement(
+    PaginationContextAuto,
+    {
+      total: fetchedData.length,
+      resultsPerPageOptions: [15, 25],
+      previousLabel: "\u03A0\u03C1\u03BF\u03B7\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03B7",
+      nextLabel: "\u0395\u03C0\u03CC\u03BC\u03B5\u03BD\u03B7"
+    },
+    /* @__PURE__ */ React.createElement(Container, { grid: false }, /* @__PURE__ */ React.createElement(DataGrid, { data: fetchedData }), /* @__PURE__ */ React.createElement(Pagination, null, /* @__PURE__ */ React.createElement(PaginationLabelAuto, null), /* @__PURE__ */ React.createElement(PaginationResultsPerPageSelectAuto, null, "\u0391\u03C0\u03BF\u03C4\u03B5\u03BB\u03AD\u03C3\u03BC\u03B1\u03C4\u03B1 \u03B1\u03BD\u03AC \u03C3\u03B5\u03BB\u03AF\u03B4\u03B1"), /* @__PURE__ */ React.createElement(PaginationListAuto, null)))
+  );
+};
+var Auto_default = Auto;
+export {
+  Auto,
+  Auto_default as default
+};
+//# sourceMappingURL=Auto.js.map

package/navigation/Pagination/__stories__/Auto/package.json

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

package/navigation/Pagination/__stories__/Auto.d.ts

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

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/navigation/Pagination/__stories__/Auto.tsx"],
+  "sourcesContent": ["import React from 'react';\nimport Card from '@digigov/ui/content/Card';\nimport Container from '@digigov/ui/layouts/Basic/Container';\nimport Grid from '@digigov/ui/layouts/Grid';\nimport { Pagination } from '@digigov/ui/navigation/Pagination';\nimport {\n  PaginationContextAuto,\n  PaginationLabelAuto,\n  PaginationListAuto,\n  PaginationResultsPerPageSelectAuto,\n  usePaginationContext,\n} from '@digigov/ui/navigation/Pagination/auto';\n\nconst fetchedData: { id: number }[] = [];\n\nfor (let i = 0; i < 78; i++) {\n  fetchedData.push({ id: i });\n}\n\nconst DataGrid = ({ data }) => {\n  const { offset, limit } = usePaginationContext();\n\n  return (\n    <Grid container spacing={4} mb={{ xs: 4, md: 8 }}>\n      {data\n        .filter((_item, index) => {\n          return index > offset && index < offset + limit;\n        })\n        .map((item, index) => {\n          return (\n            <Grid item xs={4} md={2} key={index}>\n              <Card variant=\"border\" borderColor=\"light\" dense>\n                {item.id}\n              </Card>\n            </Grid>\n          );\n        })}\n    </Grid>\n  );\n};\n\nexport const Auto = () => {\n  return (\n    <PaginationContextAuto\n      total={fetchedData.length}\n      resultsPerPageOptions={[15, 25]}\n      previousLabel=\"\u03A0\u03C1\u03BF\u03B7\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03B7\"\n      nextLabel=\"\u0395\u03C0\u03CC\u03BC\u03B5\u03BD\u03B7\"\n    >\n      <Container grid={false}>\n        <DataGrid data={fetchedData} />\n        <Pagination>\n          <PaginationLabelAuto />\n          <PaginationResultsPerPageSelectAuto>\n            \u0391\u03C0\u03BF\u03C4\u03B5\u03BB\u03AD\u03C3\u03BC\u03B1\u03C4\u03B1 \u03B1\u03BD\u03AC \u03C3\u03B5\u03BB\u03AF\u03B4\u03B1\n          </PaginationResultsPerPageSelectAuto>\n          <PaginationListAuto />\n        </Pagination>\n      </Container>\n    </PaginationContextAuto>\n  );\n};\nexport default Auto;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAClB,OAAO,UAAU;AACjB,OAAO,eAAe;AACtB,OAAO,UAAU;AACjB,SAAS,kBAAkB;AAC3B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,MAAM,cAAgC,CAAC;AAEvC,SAAS,IAAI,GAAG,IAAI,IAAI,KAAK;AAC3B,cAAY,KAAK,EAAE,IAAI,EAAE,CAAC;AAC5B;AAEA,MAAM,WAAW,CAAC,EAAE,KAAK,MAAM;AAC7B,QAAM,EAAE,QAAQ,MAAM,IAAI,qBAAqB;AAE/C,SACE,oCAAC,QAAK,WAAS,MAAC,SAAS,GAAG,IAAI,EAAE,IAAI,GAAG,IAAI,EAAE,KAC5C,KACE,OAAO,CAAC,OAAO,UAAU;AACxB,WAAO,QAAQ,UAAU,QAAQ,SAAS;AAAA,EAC5C,CAAC,EACA,IAAI,CAAC,MAAM,UAAU;AACpB,WACE,oCAAC,QAAK,MAAI,MAAC,IAAI,GAAG,IAAI,GAAG,KAAK,SAC5B,oCAAC,QAAK,SAAQ,UAAS,aAAY,SAAQ,OAAK,QAC7C,KAAK,EACR,CACF;AAAA,EAEJ,CAAC,CACL;AAEJ;AAEO,MAAM,OAAO,MAAM;AACxB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,YAAY;AAAA,MACnB,uBAAuB,CAAC,IAAI,EAAE;AAAA,MAC9B,eAAc;AAAA,MACd,WAAU;AAAA;AAAA,IAEV,oCAAC,aAAU,MAAM,SACf,oCAAC,YAAS,MAAM,aAAa,GAC7B,oCAAC,kBACC,oCAAC,yBAAoB,GACrB,oCAAC,0CAAmC,kIAEpC,GACA,oCAAC,wBAAmB,CACtB,CACF;AAAA,EACF;AAEJ;AACA,IAAO,eAAQ;",
+  "names": []
+}

package/navigation/Pagination/__stories__/Default/index.js

@@ -0,0 +1,18 @@
+import React from "react";
+import { I18NProvider } from "@digigov/ui/i18n";
+import { ChevronIcon } from "@digigov/ui/icons";
+import { SectionBreak } from "@digigov/ui/layouts/SectionBreak";
+import { Link } from "@digigov/ui/navigation/Link";
+import {
+  Pagination,
+  PaginationList,
+  PaginationListItem,
+  PaginationLabel
+} from "@digigov/ui/navigation/Pagination";
+const Default = () => /* @__PURE__ */ React.createElement(I18NProvider, { t: (str) => str }, /* @__PURE__ */ React.createElement(Pagination, null, /* @__PURE__ */ React.createElement(PaginationLabel, { start: 21, end: 30, total: 90 }), /* @__PURE__ */ React.createElement(PaginationList, null, /* @__PURE__ */ React.createElement(PaginationListItem, null, /* @__PURE__ */ React.createElement(Link, null, /* @__PURE__ */ React.createElement(ChevronIcon, { direction: "left" }), "\u03A0\u03C1\u03BF\u03B7\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03BF")), /* @__PURE__ */ React.createElement(PaginationListItem, null, /* @__PURE__ */ React.createElement(Link, { href: "#page1" }, "1")), /* @__PURE__ */ React.createElement(PaginationListItem, { currentPage: true }, "2"), /* @__PURE__ */ React.createElement(PaginationListItem, null, /* @__PURE__ */ React.createElement(Link, { href: "#page3" }, "3")), /* @__PURE__ */ React.createElement(PaginationListItem, { variant: "dots" }), /* @__PURE__ */ React.createElement(PaginationListItem, null, /* @__PURE__ */ React.createElement(Link, { href: "#page7" }, "7")), /* @__PURE__ */ React.createElement(PaginationListItem, null, /* @__PURE__ */ React.createElement(Link, { href: "#page8" }, "8")), /* @__PURE__ */ React.createElement(PaginationListItem, null, /* @__PURE__ */ React.createElement(Link, { href: "#page9" }, "9")), /* @__PURE__ */ React.createElement(PaginationListItem, null, /* @__PURE__ */ React.createElement(Link, null, "\u0395\u03C0\u03CC\u03BC\u03B5\u03BD\u03BF", /* @__PURE__ */ React.createElement(ChevronIcon, { direction: "right" }))))), /* @__PURE__ */ React.createElement(SectionBreak, { size: "lg" }), /* @__PURE__ */ React.createElement(Pagination, null, /* @__PURE__ */ React.createElement(PaginationLabel, { start: 81, end: 90, total: 197 }), /* @__PURE__ */ React.createElement(PaginationList, null, /* @__PURE__ */ React.createElement(PaginationListItem, null, /* @__PURE__ */ React.createElement(Link, null, /* @__PURE__ */ React.createElement(ChevronIcon, { direction: "left" }), "\u03A0\u03C1\u03BF\u03B7\u03B3\u03BF\u03CD\u03BC\u03B5\u03BD\u03BF")), /* @__PURE__ */ React.createElement(PaginationListItem, null, /* @__PURE__ */ React.createElement(Link, { href: "#page1" }, "1")), /* @__PURE__ */ React.createElement(PaginationListItem, { variant: "dots" }), /* @__PURE__ */ React.createElement(PaginationListItem, null, /* @__PURE__ */ React.createElement(Link, { href: "#page7" }, "7")), /* @__PURE__ */ React.createElement(PaginationListItem, { currentPage: true }, "8"), /* @__PURE__ */ React.createElement(PaginationListItem, null, /* @__PURE__ */ React.createElement(Link, { href: "#page9" }, "9")), /* @__PURE__ */ React.createElement(PaginationListItem, { variant: "dots" }), /* @__PURE__ */ React.createElement(PaginationListItem, null, /* @__PURE__ */ React.createElement(Link, { href: "#page20" }, "20")), /* @__PURE__ */ React.createElement(PaginationListItem, null, /* @__PURE__ */ React.createElement(Link, null, "\u0395\u03C0\u03CC\u03BC\u03B5\u03BD\u03BF", /* @__PURE__ */ React.createElement(ChevronIcon, { direction: "right" }))))));
+var Default_default = Default;
+export {
+  Default,
+  Default_default as default
+};
+//# sourceMappingURL=Default.js.map