@rws-aoa/react-library 3.6.5 → 3.6.6

package/dist/_constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"_constants.js","sources":["../src/_constants.ts"],"sourcesContent":["import type { SxProps } from \"@mui/material\";\n\nexport const FontNormalSxProps = {\n  fontFamily: \"var(--font-text)\",\n  fontSize: \"var(--font-size-text)\",\n  lineHeight: \"var(--font-lineheight-text)\",\n  fontStyle: \"normal\",\n  fontWeight: \"normal\"\n} satisfies SxProps;\n\nexport function isExtensionAllowed(regExp: RegExp, fileName: string) {\n  return regExp.test(fileName);\n}\n"],"names":["FontNormalSxProps","isExtensionAllowed","regExp","fileName"],"mappings":"AAEO,MAAMA,IAAoB;AAAA,EAC/B,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AACd;AAEgB,SAAAC,EAAmBC,GAAgBC,GAAkB;AAC5D,SAAAD,EAAO,KAAKC,CAAQ;AAC7B;"}
+{"version":3,"file":"_constants.js","sources":["../src/_constants.ts"],"sourcesContent":["import type { SxProps } from '@mui/material';\n\nexport const FontNormalSxProps = {\n  fontFamily: 'var(--font-text)',\n  fontSize: 'var(--font-size-text)',\n  lineHeight: 'var(--font-lineheight-text)',\n  fontStyle: 'normal',\n  fontWeight: 'normal'\n} satisfies SxProps;\n\nexport function isExtensionAllowed(regExp: RegExp, fileName: string) {\n  return regExp.test(fileName);\n}\n"],"names":["FontNormalSxProps","isExtensionAllowed","regExp","fileName"],"mappings":"AAEO,MAAMA,IAAoB;AAAA,EAC/B,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AACd;AAEgB,SAAAC,EAAmBC,GAAgBC,GAAkB;AAC5D,SAAAD,EAAO,KAAKC,CAAQ;AAC7B;"}

package/dist/components/atoms/_menu/menu-item/MenuItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/_menu/menu-item/MenuItem.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAkB,KAAK,QAAQ,EAAmB,KAAK,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAG5G,UAAU,OAAO;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACnB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,KAAK,IAAI;AACP;;GAEG;AACD;IAAE,QAAQ,EAAE,OAAO,EAAE,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE;AACrC;;GAEG;GACD;IAAE,QAAQ,EAAE,OAAO,EAAE,CAAC;IAAC,EAAE,CAAC,EAAE,KAAK,CAAA;CAAE;AACrC;;GAEG;GACD;IAAE,QAAQ,CAAC,EAAE,KAAK,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,CAAC;AAErC,MAAM,MAAM,OAAO,GAAG,IAAI,GAAG;IAC3B;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,UAAU,aAAa;IACrB;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;IAC9B;;OAEG;IACH,QAAQ,CAAC,eAAe,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;CAC5D;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,WAAW,8CAAgB,aAAa,KAAG,SAAS,CAiJ/D,CAAC"}
+{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/_menu/menu-item/MenuItem.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAkB,KAAK,QAAQ,EAAmB,KAAK,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAG5G,UAAU,OAAO;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACnB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,KAAK,IAAI;AACP;;GAEG;AACD;IAAE,QAAQ,EAAE,OAAO,EAAE,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE;AACrC;;GAEG;GACD;IAAE,QAAQ,EAAE,OAAO,EAAE,CAAC;IAAC,EAAE,CAAC,EAAE,KAAK,CAAA;CAAE;AACrC;;GAEG;GACD;IAAE,QAAQ,CAAC,EAAE,KAAK,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,CAAC;AAErC,MAAM,MAAM,OAAO,GAAG,IAAI,GAAG;IAC3B;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,UAAU,aAAa;IACrB;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;IAC9B;;OAEG;IACH,QAAQ,CAAC,eAAe,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;CAC5D;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,WAAW,8CAAgB,aAAa,KAAG,SAAS,CAuJ/D,CAAC"}

package/dist/components/atoms/_menu/menu-item/MenuItem.js

@@ -1,34 +1,36 @@
 import { jsxs as u, jsx as r } from "react/jsx-runtime";
-import { memo as C, useState as s, createElement as I } from "react";
-import { Home as P, KeyboardArrowDown as S } from "@mui/icons-material";
+import { memo as C, useState as s, createElement as P } from "react";
+import { Home as I, KeyboardArrowDown as S } from "@mui/icons-material";
 import { MenuItem as x, Link as j, Typography as w, Popper as B } from "@mui/material";
 import { Link as b } from "@tanstack/react-router";
-import { m as p } from "../../../../chunks/index.DJYQ_-zP.js";
-import { FontNormalSxProps as h } from "../../../../_constants.js";
+import { m as h } from "../../../../chunks/index.DJYQ_-zP.js";
+import { FontNormalSxProps as p } from "../../../../_constants.js";
 const O = C((e) => {
-  var l, d, g, c, m;
-  const [f, n] = s(null), [t, a] = s(!1);
-  function v(o) {
-    a(!0), n(o.currentTarget);
+  var i, g, d, m, c;
+  const [v, a] = s(null), [t, n] = s(!1);
+  function f(o) {
+    n(!0), a(o.currentTarget);
   }
-  function i() {
-    a(!1), n(null);
+  function l() {
+    n(!1), a(null);
   }
   function k() {
     return e.page.externalPath ? { href: e.page.to } : { to: e.page.to };
   }
-  return /* @__PURE__ */ I(
+  return /* @__PURE__ */ P(
     x,
     {
       ...k(),
-      "aria-controls": (l = e.page.subItems) != null && l.length && t ? "submenu" : void 0,
-      "aria-expanded": (d = e.page.subItems) != null && d.length && t ? "true" : void 0,
-      "aria-haspopup": (g = e.page.subItems) != null && g.length ? "true" : "false",
+      "aria-controls": (i = e.page.subItems) != null && i.length && t ? "submenu" : void 0,
+      "aria-expanded": (g = e.page.subItems) != null && g.length && t ? "true" : void 0,
+      "aria-haspopup": (d = e.page.subItems) != null && d.length ? "true" : "false",
+      "aria-label": e.page.label,
       component: e.page.to && !e.page.externalPath ? b : j,
       key: e.index,
       onClick: () => e.setSelectedPage(e.index),
-      onMouseEnter: (o) => v(o),
-      onMouseLeave: () => i(),
+      onMouseEnter: (o) => f(o),
+      onMouseLeave: () => l(),
+      role: "menuitem",
       selected: e.selectedPage === e.index,
       sx: {
         height: "100%",
@@ -47,13 +49,15 @@ const O = C((e) => {
             backgroundColor: "var(--color-rijks-yellow-hover)"
           }
         }
-      }
+      },
+      title: e.page.label
     },
     /* @__PURE__ */ u(
       w,
       {
+        "aria-hidden": !0,
         component: "span",
-        sx: p(
+        sx: h(
           {
             display: "flex",
             alignItems: "center",
@@ -61,23 +65,24 @@ const O = C((e) => {
               marginRight: "5px"
             }
           },
-          h
+          p
         ),
         variant: "body1",
         children: [
-          e.index === 0 && /* @__PURE__ */ r(P, {}),
+          e.index === 0 && /* @__PURE__ */ r(I, {}),
           e.page.label,
-          (c = e.page.subItems) != null && c.length ? /* @__PURE__ */ r(S, {}) : null
+          (m = e.page.subItems) != null && m.length ? /* @__PURE__ */ r(S, {}) : null
         ]
       }
     ),
     e.page.subItems && /* @__PURE__ */ r(
       B,
       {
-        anchorEl: f,
+        anchorEl: v,
         id: "submenu",
         open: t,
         placement: "bottom-start",
+        role: "menu",
         sx: {
           backgroundColor: "var(--color-bg-light)",
           padding: "4px 0",
@@ -92,16 +97,17 @@ const O = C((e) => {
               rgb(0 0 0 / 5%) 0 4px 6px -2px
             `
         },
-        children: (m = e.page.subItems) == null ? void 0 : m.map((o, y) => /* @__PURE__ */ u(
+        children: (c = e.page.subItems) == null ? void 0 : c.map((o, y) => /* @__PURE__ */ u(
           x,
           {
+            "aria-label": o.label,
             component: b,
             disableRipple: !0,
             divider: o.divider ?? !1,
             onClick: (M) => {
-              M.stopPropagation(), e.setSelectedPage(e.index), i();
+              M.stopPropagation(), e.setSelectedPage(e.index), l();
             },
-            sx: p(
+            sx: h(
               {
                 ":active": {
                   backgroundColor: "var(--color-bg-light)"
@@ -125,7 +131,7 @@ const O = C((e) => {
                   marginRight: "12px"
                 }
               },
-              h
+              p
             ),
             to: o.to,
             children: [

package/dist/components/atoms/_menu/menu-item/MenuItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.js","sources":["../../../../../src/components/atoms/_menu/menu-item/MenuItem.tsx"],"sourcesContent":["import { Home as HomeIcon, KeyboardArrowDown as KeyboardArrowDownIcon } from \"@mui/icons-material\";\nimport { Link as MUILink, MenuItem as MUIMenuItem, Popper, Typography } from \"@mui/material\";\nimport { Link } from \"@tanstack/react-router\";\nimport merge from \"lodash.merge\";\nimport { memo, useState, type Dispatch, type MouseEvent, type ReactNode, type SetStateAction } from \"react\";\nimport { FontNormalSxProps } from \"../../../../_constants\";\n\ninterface SubMenu {\n  /**\n   * Optional divider to be shown below menu item\n   */\n  divider?: boolean;\n  /**\n   * Optional icon to be displayed in front of the label\n   */\n  icon?: JSX.Element;\n  /**\n   * The label of the menu item\n   */\n  label: string;\n  /**\n   * The path that the menu item links to on click\n   */\n  to: string;\n}\n\ntype Menu =\n  /**\n   * The path that the menu item links to on click and the subitems shown on hover\n   */\n  | { subItems: SubMenu[]; to: string }\n  /**\n   * Subitems are required when there is no path that the menu item links to on click\n   */\n  | { subItems: SubMenu[]; to?: never }\n  /**\n   * The path that the menu item links to on click is required when there are no subitems on hover\n   */\n  | { subItems?: never; to: string };\n\nexport type AoaPage = Menu & {\n  /**\n   * Optional boolean to indicate if it's an external \"to\" path\n   */\n  externalPath?: boolean;\n  /**\n   * The label of the menu item\n   */\n  label: string;\n};\n\ninterface MenuItemProps {\n  /**\n   * Index of the current menu item. Home === 0\n   */\n  readonly index: number;\n  /**\n   * The Page object for this menu item\n   */\n  readonly page: AoaPage;\n  /**\n   * The currently active menu item\n   */\n  readonly selectedPage: number;\n  /**\n   * The function to update the active menu item\n   */\n  readonly setSelectedPage: Dispatch<SetStateAction<number>>;\n}\n\n/**\n * Constructs a menu item using pre-defined Rijks styling\n *\n * @param props - Props to pass to the menu item\n * @example\n * ```jsx\n * <AoaMenuItem\n *  index={index}\n *  page={{\n *    label: \"Products\",\n *    to: \"/products\",\n *    subItems: [\n *      {\n *        label: \"Books\",\n *        to: \"/books\",\n *        icon: <BookIcon />,\n *      }\n *    ]\n *  }}\n *  selectedPage={selectedPage}\n *  setSelectedPage={setSelectedPage}\n * />\n * ```\n */\nexport const AoaMenuItem = memo((props: MenuItemProps): ReactNode => {\n  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);\n  const [open, setOpen] = useState(false);\n\n  function handleMenuOpen(event: MouseEvent<HTMLAnchorElement, globalThis.MouseEvent>) {\n    setOpen(true);\n    setAnchorEl(event.currentTarget);\n  }\n\n  function handleMenuClose() {\n    setOpen(false);\n    setAnchorEl(null);\n  }\n\n  function linkProps() {\n    if (props.page.externalPath) {\n      return { href: props.page.to };\n    } else {\n      return { to: props.page.to };\n    }\n  }\n\n  return (\n    <MUIMenuItem\n      {...linkProps()}\n      aria-controls={props.page.subItems?.length && open ? \"submenu\" : undefined}\n      aria-expanded={props.page.subItems?.length && open ? \"true\" : undefined}\n      aria-haspopup={props.page.subItems?.length ? \"true\" : \"false\"}\n      component={props.page.to && !props.page.externalPath ? Link : MUILink}\n      key={props.index}\n      onClick={() => props.setSelectedPage(props.index)}\n      onMouseEnter={(event: MouseEvent<HTMLAnchorElement, globalThis.MouseEvent>) => handleMenuOpen(event)}\n      onMouseLeave={() => handleMenuClose()}\n      selected={props.selectedPage === props.index}\n      sx={{\n        height: \"100%\",\n        borderBottom: \"3px solid transparent\",\n        padding: \"6px 20px 3px\",\n\n        \":hover\": {\n          backgroundColor: \"var(--color-rijks-yellow-hover)\",\n          ...(props.page.to && {\n            textDecoration: \"underline\"\n          })\n        },\n\n        \"&.Mui-selected\": {\n          backgroundColor: \"var(--color-rijks-yellow-light)\",\n          borderBottomColor: \"var(--color-rijks-skyblue)\",\n          \":hover\": {\n            backgroundColor: \"var(--color-rijks-yellow-hover)\"\n          }\n        }\n      }}\n    >\n      <Typography\n        component=\"span\"\n        sx={merge(\n          {\n            display: \"flex\",\n            alignItems: \"center\",\n\n            \"&.MuiSvgIcon-root\": {\n              marginRight: \"5px\"\n            }\n          },\n          FontNormalSxProps\n        )}\n        variant=\"body1\"\n      >\n        {props.index === 0 && <HomeIcon />}\n        {props.page.label}\n        {props.page.subItems?.length ? <KeyboardArrowDownIcon /> : null}\n      </Typography>\n      {props.page.subItems && (\n        <Popper\n          anchorEl={anchorEl}\n          id=\"submenu\"\n          open={open}\n          placement=\"bottom-start\"\n          sx={{\n            backgroundColor: \"var(--color-bg-light)\",\n            padding: \"4px 0\",\n            borderRadius: \"6px\",\n            marginTop: \"8px\",\n            minWidth: \"180px\",\n            color: \"var(--color-text)\",\n            boxShadow: `\n              rgb(255 255 255) 0 0 0 0,\n              rgb(0 0 0 / 5%) 0 0 0 1px,\n              rgb(0 0 0 / 10%) 0 10px 15px -3px,\n              rgb(0 0 0 / 5%) 0 4px 6px -2px\n            `\n          }}\n        >\n          {props.page.subItems?.map((subItem, index) => (\n            <MUIMenuItem\n              component={Link}\n              disableRipple\n              divider={subItem.divider ?? false}\n              key={index}\n              onClick={(event) => {\n                event.stopPropagation();\n                props.setSelectedPage(props.index);\n                handleMenuClose();\n              }}\n              sx={merge(\n                {\n                  \":active\": {\n                    backgroundColor: \"var(--color-bg-light)\"\n                  },\n\n                  \"&.MuiMenuItem-divider\": {\n                    borderBottom: \"transparent\",\n                    position: \"relative\",\n                    marginBottom: \"16px\",\n\n                    \"::after\": {\n                      content: '\"\"',\n                      position: \"absolute\",\n                      bottom: \"-8px\",\n                      left: \"0\",\n                      width: \"100%\",\n                      borderBottom: \"1px solid rgba(0, 0, 0, 0.12)\"\n                    }\n                  },\n\n                  \"&.MuiSvgIcon-root\": {\n                    fontSize: \"var(--font-size-text)\",\n                    color: \"var(--color-rijks-grey-7)\",\n                    marginRight: \"12px\"\n                  }\n                },\n                FontNormalSxProps\n              )}\n              to={subItem.to}\n            >\n              {subItem.icon}\n              {subItem.label}\n            </MUIMenuItem>\n          ))}\n        </Popper>\n      )}\n    </MUIMenuItem>\n  );\n});\n"],"names":["AoaMenuItem","memo","props","anchorEl","setAnchorEl","useState","open","setOpen","handleMenuOpen","event","handleMenuClose","linkProps","createElement","MUIMenuItem","_a","_b","_c","Link","MUILink","jsxs","Typography","merge","FontNormalSxProps","jsx","HomeIcon","_d","KeyboardArrowDownIcon","Popper","subItem","index"],"mappings":"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"}
+{"version":3,"file":"MenuItem.js","sources":["../../../../../src/components/atoms/_menu/menu-item/MenuItem.tsx"],"sourcesContent":["import { Home as HomeIcon, KeyboardArrowDown as KeyboardArrowDownIcon } from '@mui/icons-material';\nimport { Link as MUILink, MenuItem as MUIMenuItem, Popper, Typography } from '@mui/material';\nimport { Link } from '@tanstack/react-router';\nimport merge from 'lodash.merge';\nimport { memo, useState, type Dispatch, type MouseEvent, type ReactNode, type SetStateAction } from 'react';\nimport { FontNormalSxProps } from '../../../../_constants';\n\ninterface SubMenu {\n  /**\n   * Optional divider to be shown below menu item\n   */\n  divider?: boolean;\n  /**\n   * Optional icon to be displayed in front of the label\n   */\n  icon?: JSX.Element;\n  /**\n   * The label of the menu item\n   */\n  label: string;\n  /**\n   * The path that the menu item links to on click\n   */\n  to: string;\n}\n\ntype Menu =\n  /**\n   * The path that the menu item links to on click and the subitems shown on hover\n   */\n  | { subItems: SubMenu[]; to: string }\n  /**\n   * Subitems are required when there is no path that the menu item links to on click\n   */\n  | { subItems: SubMenu[]; to?: never }\n  /**\n   * The path that the menu item links to on click is required when there are no subitems on hover\n   */\n  | { subItems?: never; to: string };\n\nexport type AoaPage = Menu & {\n  /**\n   * Optional boolean to indicate if it's an external \"to\" path\n   */\n  externalPath?: boolean;\n  /**\n   * The label of the menu item\n   */\n  label: string;\n};\n\ninterface MenuItemProps {\n  /**\n   * Index of the current menu item. Home === 0\n   */\n  readonly index: number;\n  /**\n   * The Page object for this menu item\n   */\n  readonly page: AoaPage;\n  /**\n   * The currently active menu item\n   */\n  readonly selectedPage: number;\n  /**\n   * The function to update the active menu item\n   */\n  readonly setSelectedPage: Dispatch<SetStateAction<number>>;\n}\n\n/**\n * Constructs a menu item using pre-defined Rijks styling\n *\n * @param props - Props to pass to the menu item\n * @example\n * ```jsx\n * <AoaMenuItem\n *  index={index}\n *  page={{\n *    label: \"Products\",\n *    to: \"/products\",\n *    subItems: [\n *      {\n *        label: \"Books\",\n *        to: \"/books\",\n *        icon: <BookIcon />,\n *      }\n *    ]\n *  }}\n *  selectedPage={selectedPage}\n *  setSelectedPage={setSelectedPage}\n * />\n * ```\n */\nexport const AoaMenuItem = memo((props: MenuItemProps): ReactNode => {\n  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);\n  const [open, setOpen] = useState(false);\n\n  function handleMenuOpen(event: MouseEvent<HTMLAnchorElement, globalThis.MouseEvent>) {\n    setOpen(true);\n    setAnchorEl(event.currentTarget);\n  }\n\n  function handleMenuClose() {\n    setOpen(false);\n    setAnchorEl(null);\n  }\n\n  function linkProps() {\n    if (props.page.externalPath) {\n      return { href: props.page.to };\n    } else {\n      return { to: props.page.to };\n    }\n  }\n\n  return (\n    <MUIMenuItem\n      {...linkProps()}\n      aria-controls={props.page.subItems?.length && open ? 'submenu' : undefined}\n      aria-expanded={props.page.subItems?.length && open ? 'true' : undefined}\n      aria-haspopup={props.page.subItems?.length ? 'true' : 'false'}\n      aria-label={props.page.label}\n      component={props.page.to && !props.page.externalPath ? Link : MUILink}\n      key={props.index}\n      onClick={() => props.setSelectedPage(props.index)}\n      onMouseEnter={(event: MouseEvent<HTMLAnchorElement, globalThis.MouseEvent>) => handleMenuOpen(event)}\n      onMouseLeave={() => handleMenuClose()}\n      role='menuitem'\n      selected={props.selectedPage === props.index}\n      sx={{\n        height: '100%',\n        borderBottom: '3px solid transparent',\n        padding: '6px 20px 3px',\n\n        ':hover': {\n          backgroundColor: 'var(--color-rijks-yellow-hover)',\n          ...(props.page.to && {\n            textDecoration: 'underline'\n          })\n        },\n\n        '&.Mui-selected': {\n          backgroundColor: 'var(--color-rijks-yellow-light)',\n          borderBottomColor: 'var(--color-rijks-skyblue)',\n          ':hover': {\n            backgroundColor: 'var(--color-rijks-yellow-hover)'\n          }\n        }\n      }}\n      title={props.page.label}\n    >\n      <Typography\n        aria-hidden\n        component='span'\n        sx={merge(\n          {\n            display: 'flex',\n            alignItems: 'center',\n\n            '&.MuiSvgIcon-root': {\n              marginRight: '5px'\n            }\n          },\n          FontNormalSxProps\n        )}\n        variant='body1'\n      >\n        {props.index === 0 && <HomeIcon />}\n        {props.page.label}\n        {props.page.subItems?.length ? <KeyboardArrowDownIcon /> : null}\n      </Typography>\n      {props.page.subItems && (\n        <Popper\n          anchorEl={anchorEl}\n          id='submenu'\n          open={open}\n          placement='bottom-start'\n          role='menu'\n          sx={{\n            backgroundColor: 'var(--color-bg-light)',\n            padding: '4px 0',\n            borderRadius: '6px',\n            marginTop: '8px',\n            minWidth: '180px',\n            color: 'var(--color-text)',\n            boxShadow: `\n              rgb(255 255 255) 0 0 0 0,\n              rgb(0 0 0 / 5%) 0 0 0 1px,\n              rgb(0 0 0 / 10%) 0 10px 15px -3px,\n              rgb(0 0 0 / 5%) 0 4px 6px -2px\n            `\n          }}\n        >\n          {props.page.subItems?.map((subItem, index) => (\n            <MUIMenuItem\n              aria-label={subItem.label}\n              component={Link}\n              disableRipple\n              divider={subItem.divider ?? false}\n              key={index}\n              onClick={(event) => {\n                event.stopPropagation();\n                props.setSelectedPage(props.index);\n                handleMenuClose();\n              }}\n              sx={merge(\n                {\n                  ':active': {\n                    backgroundColor: 'var(--color-bg-light)'\n                  },\n\n                  '&.MuiMenuItem-divider': {\n                    borderBottom: 'transparent',\n                    position: 'relative',\n                    marginBottom: '16px',\n\n                    '::after': {\n                      content: '\"\"',\n                      position: 'absolute',\n                      bottom: '-8px',\n                      left: '0',\n                      width: '100%',\n                      borderBottom: '1px solid rgba(0, 0, 0, 0.12)'\n                    }\n                  },\n\n                  '&.MuiSvgIcon-root': {\n                    fontSize: 'var(--font-size-text)',\n                    color: 'var(--color-rijks-grey-7)',\n                    marginRight: '12px'\n                  }\n                },\n                FontNormalSxProps\n              )}\n              to={subItem.to}\n            >\n              {subItem.icon}\n              {subItem.label}\n            </MUIMenuItem>\n          ))}\n        </Popper>\n      )}\n    </MUIMenuItem>\n  );\n});\n"],"names":["AoaMenuItem","memo","props","anchorEl","setAnchorEl","useState","open","setOpen","handleMenuOpen","event","handleMenuClose","linkProps","createElement","MUIMenuItem","_a","_b","_c","Link","MUILink","jsxs","Typography","merge","FontNormalSxProps","jsx","HomeIcon","_d","KeyboardArrowDownIcon","Popper","subItem","index"],"mappings":"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"}

package/dist/components/atoms/_menu/user-menu/UserMenu.d.ts

@@ -20,7 +20,7 @@ export type AoaSetting = Action & {
      */
     divider?: boolean;
     /**
-     * The lable of the menu item
+     * The label of the menu item
      */
     label: string;
 };

package/dist/components/atoms/_menu/user-menu/UserMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UserMenu.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/_menu/user-menu/UserMenu.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAmC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGxE,KAAK,MAAM;AACT;;GAEG;AACD;IAAE,OAAO,CAAC,EAAE,KAAK,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE;AACjC;;GAEG;GACD;IAAE,OAAO,IAAI,IAAI,CAAC;IAAC,EAAE,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AAEpC,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG;IAChC;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,UAAU,aAAa;IACrB;;OAEG;IACH,QAAQ,CAAC,QAAQ,EAAE,UAAU,EAAE,CAAC;IAChC;;OAEG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED;;;;;;;;;;;;GAYG;AAEH,eAAO,MAAM,WAAW,8CAAgB,aAAa,KAAG,SAAS,CAgF/D,CAAC"}
+{"version":3,"file":"UserMenu.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/_menu/user-menu/UserMenu.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAmC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGxE,KAAK,MAAM;AACT;;GAEG;AACD;IAAE,OAAO,CAAC,EAAE,KAAK,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE;AACjC;;GAEG;GACD;IAAE,OAAO,IAAI,IAAI,CAAC;IAAC,EAAE,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AAEpC,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG;IAChC;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,UAAU,aAAa;IACrB;;OAEG;IACH,QAAQ,CAAC,QAAQ,EAAE,UAAU,EAAE,CAAC;IAChC;;OAEG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED;;;;;;;;;;;;GAYG;AAEH,eAAO,MAAM,WAAW,8CAAgB,aAAa,KAAG,SAAS,CAiF/D,CAAC"}

package/dist/components/atoms/_menu/user-menu/UserMenu.js

@@ -1,26 +1,27 @@
 import { jsxs as t, jsx as o } from "react/jsx-runtime";
-import { Box as f, Typography as h, MenuItem as p, Avatar as g, Popper as b, Link as k } from "@mui/material";
-import { Link as v } from "@tanstack/react-router";
+import { Box as h, Typography as f, MenuItem as l, Avatar as g, Popper as b, Link as v } from "@mui/material";
+import { Link as k } from "@tanstack/react-router";
 import { m as C } from "../../../../chunks/index.DJYQ_-zP.js";
-import { memo as M, useState as l } from "react";
-import { FontNormalSxProps as s } from "../../../../_constants.js";
+import { memo as M, useState as p } from "react";
+import { FontNormalSxProps as m } from "../../../../_constants.js";
 const S = M((r) => {
-  const [d, i] = l(null), [n, a] = l(!1);
-  function m(e) {
+  const [s, i] = p(null), [n, a] = p(!1);
+  function d(e) {
     a(!0), i(e.currentTarget);
   }
   function u() {
     a(!1), i(null);
   }
-  return /* @__PURE__ */ t(f, { alignItems: "center", display: "flex", sx: { flexGrow: 0, minWidth: "fit-content" }, children: [
-    r.username && /* @__PURE__ */ o(h, { component: "span", sx: C({ marginRight: "16px" }, s), children: r.username }),
+  return /* @__PURE__ */ t(h, { alignItems: "center", display: "flex", role: "menu", sx: { flexGrow: 0, minWidth: "fit-content" }, children: [
+    r.username && /* @__PURE__ */ o(f, { component: "span", sx: C({ marginRight: "16px" }, m), children: r.username }),
     /* @__PURE__ */ t(
-      p,
+      l,
       {
         "aria-controls": n ? "usermenu" : void 0,
         "aria-expanded": n ? "true" : void 0,
         "aria-haspopup": "true",
-        onMouseEnter: (e) => m(e),
+        "aria-label": "User menu",
+        onMouseEnter: (e) => d(e),
         onMouseLeave: () => u(),
         sx: {
           padding: 0,
@@ -33,7 +34,7 @@ const S = M((r) => {
           /* @__PURE__ */ o(
             b,
             {
-              anchorEl: d,
+              anchorEl: s,
               id: "usermenu",
               open: n,
               placement: "bottom-end",
@@ -52,15 +53,15 @@ const S = M((r) => {
             `
               },
               children: r.settings.map((e, c) => /* @__PURE__ */ o(
-                p,
+                l,
                 {
-                  component: e.to ? v : k,
+                  component: e.to ? k : v,
                   disableRipple: !0,
                   divider: e.divider ?? !1,
                   onClick: (x) => {
                     x.stopPropagation(), e.onClick && e.onClick(), a(!1);
                   },
-                  sx: { ...s },
+                  sx: { ...m },
                   to: e.to,
                   children: e.label
                 },

package/dist/components/atoms/_menu/user-menu/UserMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserMenu.js","sources":["../../../../../src/components/atoms/_menu/user-menu/UserMenu.tsx"],"sourcesContent":["import { Avatar, Box, Link as MUILink, MenuItem as MUIMenuItem, Popper, Typography } from \"@mui/material\";\nimport { Link } from \"@tanstack/react-router\";\nimport merge from \"lodash.merge\";\nimport { memo, useState, type MouseEvent, type ReactNode } from \"react\";\nimport { FontNormalSxProps } from \"../../../../_constants\";\n\ntype Action =\n  /**\n   * The path that the menu item links to on click\n   */\n  | { onClick?: never; to: string }\n  /**\n   * The onClick function for situations where you don't want to navigate to another page (e.g. logout)\n   */\n  | { onClick(): void; to?: never };\n\nexport type AoaSetting = Action & {\n  /**\n   * Optional divider to be shown below menu item\n   */\n  divider?: boolean;\n  /**\n   * The lable of the menu item\n   */\n  label: string;\n};\n\ninterface UserMenuProps {\n  /**\n   * A list of the user menu items\n   */\n  readonly settings: AoaSetting[];\n  /**\n   * Username to be displayed on the left of the settings menu icon\n   */\n  readonly username?: string;\n}\n\n/**\n * Constructs a user menu using pre-defined Rijks styling\n *\n * @param props - Props to pass to the user menu\n * @example\n * ```jsx\n * <AoaUserMenu\n *  settings={[\n *    { label: \"Logout\", onClick: () => console.log(\"Logout\") }\n *  ]}\n * />\n * ```\n */\n\nexport const AoaUserMenu = memo((props: UserMenuProps): ReactNode => {\n  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);\n  const [open, setOpen] = useState(false);\n\n  function handleMenuOpen(event: MouseEvent<HTMLLIElement, globalThis.MouseEvent>) {\n    setOpen(true);\n    setAnchorEl(event.currentTarget);\n  }\n\n  function handleMenuClose() {\n    setOpen(false);\n    setAnchorEl(null);\n  }\n\n  return (\n    <Box alignItems=\"center\" display=\"flex\" sx={{ flexGrow: 0, minWidth: \"fit-content\" }}>\n      {props.username && (\n        <Typography component=\"span\" sx={merge({ marginRight: \"16px\" }, FontNormalSxProps)}>\n          {props.username}\n        </Typography>\n      )}\n      <MUIMenuItem\n        aria-controls={open ? \"usermenu\" : undefined}\n        aria-expanded={open ? \"true\" : undefined}\n        aria-haspopup=\"true\"\n        onMouseEnter={(event) => handleMenuOpen(event)}\n        onMouseLeave={() => handleMenuClose()}\n        sx={{\n          padding: 0,\n\n          \":hover\": {\n            backgroundColor: \"transparent\"\n          }\n        }}\n      >\n        <Avatar />\n        <Popper\n          anchorEl={anchorEl}\n          id=\"usermenu\"\n          open={open}\n          placement=\"bottom-end\"\n          sx={{\n            backgroundColor: \"var(--color-bg-light)\",\n            padding: \"4px 0\",\n            borderRadius: \"6px\",\n            marginTop: \"8px\",\n            minWidth: \"120px\",\n            color: \"var(--color-text)\",\n            boxShadow: `\n              rgb(255 255 255) 0 0 0 0,\n              rgb(0 0 0 / 5%) 0 0 0 1px,\n              rgb(0 0 0 / 10%) 0 10px 15px -3px,\n              rgb(0 0 0 / 5%) 0 4px 6px -2px\n            `\n          }}\n        >\n          {props.settings.map((setting, index) => (\n            <MUIMenuItem\n              component={setting.to ? Link : MUILink}\n              disableRipple\n              divider={setting.divider ?? false}\n              key={index}\n              onClick={(event: MouseEvent<HTMLAnchorElement, globalThis.MouseEvent>) => {\n                event.stopPropagation();\n                if (setting.onClick) {\n                  setting.onClick();\n                }\n\n                setOpen(false);\n              }}\n              sx={{ ...FontNormalSxProps }}\n              to={setting.to}\n            >\n              {setting.label}\n            </MUIMenuItem>\n          ))}\n        </Popper>\n      </MUIMenuItem>\n    </Box>\n  );\n});\n"],"names":["AoaUserMenu","memo","props","anchorEl","setAnchorEl","useState","open","setOpen","handleMenuOpen","event","handleMenuClose","jsxs","Box","jsx","Typography","merge","FontNormalSxProps","MUIMenuItem","Avatar","Popper","setting","index","Link","MUILink"],"mappings":";;;;;;AAoDa,MAAAA,IAAcC,EAAK,CAACC,MAAoC;AACnE,QAAM,CAACC,GAAUC,CAAW,IAAIC,EAA6B,IAAI,GAC3D,CAACC,GAAMC,CAAO,IAAIF,EAAS,EAAK;AAEtC,WAASG,EAAeC,GAAyD;AAC/E,IAAAF,EAAQ,EAAI,GACZH,EAAYK,EAAM,aAAa;AAAA,EAAA;AAGjC,WAASC,IAAkB;AACzB,IAAAH,EAAQ,EAAK,GACbH,EAAY,IAAI;AAAA,EAAA;AAGlB,SACG,gBAAAO,EAAAC,GAAA,EAAI,YAAW,UAAS,SAAQ,QAAO,IAAI,EAAE,UAAU,GAAG,UAAU,cAAA,GAClE,UAAA;AAAA,IAAAV,EAAM,YACL,gBAAAW,EAACC,GAAW,EAAA,WAAU,QAAO,IAAIC,EAAM,EAAE,aAAa,OAAO,GAAGC,CAAiB,GAC9E,YAAM,UACT;AAAA,IAEF,gBAAAL;AAAA,MAACM;AAAAA,MAAA;AAAA,QACC,iBAAeX,IAAO,aAAa;AAAA,QACnC,iBAAeA,IAAO,SAAS;AAAA,QAC/B,iBAAc;AAAA,QACd,cAAc,CAACG,MAAUD,EAAeC,CAAK;AAAA,QAC7C,cAAc,MAAMC,EAAgB;AAAA,QACpC,IAAI;AAAA,UACF,SAAS;AAAA,UAET,UAAU;AAAA,YACR,iBAAiB;AAAA,UAAA;AAAA,QAErB;AAAA,QAEA,UAAA;AAAA,UAAA,gBAAAG,EAACK,GAAO,EAAA;AAAA,UACR,gBAAAL;AAAA,YAACM;AAAA,YAAA;AAAA,cACC,UAAAhB;AAAA,cACA,IAAG;AAAA,cACH,MAAAG;AAAA,cACA,WAAU;AAAA,cACV,IAAI;AAAA,gBACF,iBAAiB;AAAA,gBACjB,SAAS;AAAA,gBACT,cAAc;AAAA,gBACd,WAAW;AAAA,gBACX,UAAU;AAAA,gBACV,OAAO;AAAA,gBACP,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAMb;AAAA,cAEC,UAAMJ,EAAA,SAAS,IAAI,CAACkB,GAASC,MAC5B,gBAAAR;AAAA,gBAACI;AAAAA,gBAAA;AAAA,kBACC,WAAWG,EAAQ,KAAKE,IAAOC;AAAAA,kBAC/B,eAAa;AAAA,kBACb,SAASH,EAAQ,WAAW;AAAA,kBAE5B,SAAS,CAACX,MAAgE;AACxE,oBAAAA,EAAM,gBAAgB,GAClBW,EAAQ,WACVA,EAAQ,QAAQ,GAGlBb,EAAQ,EAAK;AAAA,kBACf;AAAA,kBACA,IAAI,EAAE,GAAGS,EAAkB;AAAA,kBAC3B,IAAII,EAAQ;AAAA,kBAEX,UAAQA,EAAA;AAAA,gBAAA;AAAA,gBAZJC;AAAA,cAcR,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACH;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GACF;AAEJ,CAAC;"}
+{"version":3,"file":"UserMenu.js","sources":["../../../../../src/components/atoms/_menu/user-menu/UserMenu.tsx"],"sourcesContent":["import { Avatar, Box, Link as MUILink, MenuItem as MUIMenuItem, Popper, Typography } from '@mui/material';\nimport { Link } from '@tanstack/react-router';\nimport merge from 'lodash.merge';\nimport { memo, useState, type MouseEvent, type ReactNode } from 'react';\nimport { FontNormalSxProps } from '../../../../_constants';\n\ntype Action =\n  /**\n   * The path that the menu item links to on click\n   */\n  | { onClick?: never; to: string }\n  /**\n   * The onClick function for situations where you don't want to navigate to another page (e.g. logout)\n   */\n  | { onClick(): void; to?: never };\n\nexport type AoaSetting = Action & {\n  /**\n   * Optional divider to be shown below menu item\n   */\n  divider?: boolean;\n  /**\n   * The label of the menu item\n   */\n  label: string;\n};\n\ninterface UserMenuProps {\n  /**\n   * A list of the user menu items\n   */\n  readonly settings: AoaSetting[];\n  /**\n   * Username to be displayed on the left of the settings menu icon\n   */\n  readonly username?: string;\n}\n\n/**\n * Constructs a user menu using pre-defined Rijks styling\n *\n * @param props - Props to pass to the user menu\n * @example\n * ```jsx\n * <AoaUserMenu\n *  settings={[\n *    { label: \"Logout\", onClick: () => console.log(\"Logout\") }\n *  ]}\n * />\n * ```\n */\n\nexport const AoaUserMenu = memo((props: UserMenuProps): ReactNode => {\n  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);\n  const [open, setOpen] = useState(false);\n\n  function handleMenuOpen(event: MouseEvent<HTMLLIElement, globalThis.MouseEvent>) {\n    setOpen(true);\n    setAnchorEl(event.currentTarget);\n  }\n\n  function handleMenuClose() {\n    setOpen(false);\n    setAnchorEl(null);\n  }\n\n  return (\n    <Box alignItems='center' display='flex' role='menu' sx={{ flexGrow: 0, minWidth: 'fit-content' }}>\n      {props.username && (\n        <Typography component='span' sx={merge({ marginRight: '16px' }, FontNormalSxProps)}>\n          {props.username}\n        </Typography>\n      )}\n      <MUIMenuItem\n        aria-controls={open ? 'usermenu' : undefined}\n        aria-expanded={open ? 'true' : undefined}\n        aria-haspopup='true'\n        aria-label='User menu'\n        onMouseEnter={(event) => handleMenuOpen(event)}\n        onMouseLeave={() => handleMenuClose()}\n        sx={{\n          padding: 0,\n\n          ':hover': {\n            backgroundColor: 'transparent'\n          }\n        }}\n      >\n        <Avatar />\n        <Popper\n          anchorEl={anchorEl}\n          id='usermenu'\n          open={open}\n          placement='bottom-end'\n          sx={{\n            backgroundColor: 'var(--color-bg-light)',\n            padding: '4px 0',\n            borderRadius: '6px',\n            marginTop: '8px',\n            minWidth: '120px',\n            color: 'var(--color-text)',\n            boxShadow: `\n              rgb(255 255 255) 0 0 0 0,\n              rgb(0 0 0 / 5%) 0 0 0 1px,\n              rgb(0 0 0 / 10%) 0 10px 15px -3px,\n              rgb(0 0 0 / 5%) 0 4px 6px -2px\n            `\n          }}\n        >\n          {props.settings.map((setting, index) => (\n            <MUIMenuItem\n              component={setting.to ? Link : MUILink}\n              disableRipple\n              divider={setting.divider ?? false}\n              key={index}\n              onClick={(event: MouseEvent<HTMLAnchorElement, globalThis.MouseEvent>) => {\n                event.stopPropagation();\n                if (setting.onClick) {\n                  setting.onClick();\n                }\n\n                setOpen(false);\n              }}\n              sx={{ ...FontNormalSxProps }}\n              to={setting.to}\n            >\n              {setting.label}\n            </MUIMenuItem>\n          ))}\n        </Popper>\n      </MUIMenuItem>\n    </Box>\n  );\n});\n"],"names":["AoaUserMenu","memo","props","anchorEl","setAnchorEl","useState","open","setOpen","handleMenuOpen","event","handleMenuClose","jsxs","Box","jsx","Typography","merge","FontNormalSxProps","MUIMenuItem","Avatar","Popper","setting","index","Link","MUILink"],"mappings":";;;;;;AAoDa,MAAAA,IAAcC,EAAK,CAACC,MAAoC;AACnE,QAAM,CAACC,GAAUC,CAAW,IAAIC,EAA6B,IAAI,GAC3D,CAACC,GAAMC,CAAO,IAAIF,EAAS,EAAK;AAEtC,WAASG,EAAeC,GAAyD;AAC/E,IAAAF,EAAQ,EAAI,GACZH,EAAYK,EAAM,aAAa;AAAA,EAAA;AAGjC,WAASC,IAAkB;AACzB,IAAAH,EAAQ,EAAK,GACbH,EAAY,IAAI;AAAA,EAAA;AAGlB,SACG,gBAAAO,EAAAC,GAAA,EAAI,YAAW,UAAS,SAAQ,QAAO,MAAK,QAAO,IAAI,EAAE,UAAU,GAAG,UAAU,cAC9E,GAAA,UAAA;AAAA,IAAAV,EAAM,YACL,gBAAAW,EAACC,GAAW,EAAA,WAAU,QAAO,IAAIC,EAAM,EAAE,aAAa,OAAO,GAAGC,CAAiB,GAC9E,YAAM,UACT;AAAA,IAEF,gBAAAL;AAAA,MAACM;AAAAA,MAAA;AAAA,QACC,iBAAeX,IAAO,aAAa;AAAA,QACnC,iBAAeA,IAAO,SAAS;AAAA,QAC/B,iBAAc;AAAA,QACd,cAAW;AAAA,QACX,cAAc,CAACG,MAAUD,EAAeC,CAAK;AAAA,QAC7C,cAAc,MAAMC,EAAgB;AAAA,QACpC,IAAI;AAAA,UACF,SAAS;AAAA,UAET,UAAU;AAAA,YACR,iBAAiB;AAAA,UAAA;AAAA,QAErB;AAAA,QAEA,UAAA;AAAA,UAAA,gBAAAG,EAACK,GAAO,EAAA;AAAA,UACR,gBAAAL;AAAA,YAACM;AAAA,YAAA;AAAA,cACC,UAAAhB;AAAA,cACA,IAAG;AAAA,cACH,MAAAG;AAAA,cACA,WAAU;AAAA,cACV,IAAI;AAAA,gBACF,iBAAiB;AAAA,gBACjB,SAAS;AAAA,gBACT,cAAc;AAAA,gBACd,WAAW;AAAA,gBACX,UAAU;AAAA,gBACV,OAAO;AAAA,gBACP,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAMb;AAAA,cAEC,UAAMJ,EAAA,SAAS,IAAI,CAACkB,GAASC,MAC5B,gBAAAR;AAAA,gBAACI;AAAAA,gBAAA;AAAA,kBACC,WAAWG,EAAQ,KAAKE,IAAOC;AAAAA,kBAC/B,eAAa;AAAA,kBACb,SAASH,EAAQ,WAAW;AAAA,kBAE5B,SAAS,CAACX,MAAgE;AACxE,oBAAAA,EAAM,gBAAgB,GAClBW,EAAQ,WACVA,EAAQ,QAAQ,GAGlBb,EAAQ,EAAK;AAAA,kBACf;AAAA,kBACA,IAAI,EAAE,GAAGS,EAAkB;AAAA,kBAC3B,IAAII,EAAQ;AAAA,kBAEX,UAAQA,EAAA;AAAA,gBAAA;AAAA,gBAZJC;AAAA,cAcR,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACH;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GACF;AAEJ,CAAC;"}

package/dist/components/atoms/button/Button.d.ts

@@ -4,14 +4,14 @@ interface CommonProps {
     /**
      * Data-qa tag for E2E test purposes
      */
-    "data-qa"?: string;
+    'data-qa'?: string;
     /**
      * Defines the colour and style of the button
      */
-    type: "primary" | "secondary" | "text";
+    type: 'primary' | 'secondary' | 'text';
 }
-export type AoaButtonProps = Omit<MUIButtonProps<ButtonTypeMap["defaultComponent"], CommonProps>, "variant"> & {
-    readonly buttonType?: ButtonHTMLAttributes<HTMLButtonElement>["type"];
+export type AoaButtonProps = Omit<MUIButtonProps<ButtonTypeMap['defaultComponent'], CommonProps>, 'variant'> & {
+    readonly buttonType?: ButtonHTMLAttributes<HTMLButtonElement>['type'];
 };
 /**
  * Constructs a button using pre-defined Rijks styling

package/dist/components/atoms/button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/button/Button.tsx"],"names":[],"mappings":"AACA,OAAO,EAAuB,KAAK,aAAa,EAAE,KAAK,WAAW,IAAI,cAAc,EAAE,MAAM,eAAe,CAAC;AAE5G,OAAO,EAAQ,KAAK,oBAAoB,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGxE,UAAU,WAAW;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,IAAI,EAAE,SAAS,GAAG,WAAW,GAAG,MAAM,CAAC;CACxC;AAED,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,kBAAkB,CAAC,EAAE,WAAW,CAAC,EAAE,SAAS,CAAC,GAAG;IAC7G,QAAQ,CAAC,UAAU,CAAC,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,CAAC,MAAM,CAAC,CAAC;CACvE,CAAC;AAEF;;;;;;;;GAQG;AAEH,eAAO,MAAM,SAAS,+GAAiF,cAAc,KAAG,SAAS,CA8J/H,CAAC"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/button/Button.tsx"],"names":[],"mappings":"AACA,OAAO,EAAuB,KAAK,aAAa,EAAE,KAAK,WAAW,IAAI,cAAc,EAAE,MAAM,eAAe,CAAC;AAE5G,OAAO,EAAQ,KAAK,oBAAoB,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGxE,UAAU,WAAW;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,IAAI,EAAE,SAAS,GAAG,WAAW,GAAG,MAAM,CAAC;CACxC;AAED,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,kBAAkB,CAAC,EAAE,WAAW,CAAC,EAAE,SAAS,CAAC,GAAG;IAC7G,QAAQ,CAAC,UAAU,CAAC,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,CAAC,MAAM,CAAC,CAAC;CACvE,CAAC;AAEF;;;;;;;;GAQG;AAEH,eAAO,MAAM,SAAS,+GACqD,cAAc,KAAG,SAAS,CA+JpG,CAAC"}

package/dist/components/atoms/button/Button.js

@@ -4,135 +4,137 @@ import { Button as d } from "@mui/material";
 import { m as v } from "../../../chunks/index.DJYQ_-zP.js";
 import { memo as u } from "react";
 import { FontNormalSxProps as b } from "../../../_constants.js";
-const f = u(({ type: o, startIcon: a, "data-qa": l, children: i, buttonType: n, ...e }) => {
-  let r = "contained";
-  return o === "text" && (r = "text"), o === "secondary" && (r = "outlined"), /* @__PURE__ */ t(
-    d,
-    {
-      ...e,
-      "data-qa": l,
-      disableElevation: !0,
-      endIcon: o === "text" && /* @__PURE__ */ t(c, {}),
-      startIcon: o !== "text" && a,
-      sx: v(
-        {
-          // Styles that apply to all button types and colors
-          appearance: "none",
-          border: "1px solid",
-          borderRadius: 0,
-          boxSizing: "border-box",
-          color: "var(--color-text-light)",
-          cursor: "pointer",
-          display: "inline-flex",
-          lineHeight: "var(--font-lineheight-text)",
-          minHeight: 20,
-          padding: "12px 16px",
-          position: "relative",
-          textDecoration: "none",
-          textShadow: "none",
-          textTransform: "none",
-          verticalAlign: "middle",
-          ":focus": {
-            outline: "2px dashed var(--color-text)",
-            outlineOffset: "3px",
-            boxShadow: "none"
-          },
-          // Styles that apply to contained (type === primary)
-          "&.MuiButton-contained": {
-            "&.MuiButton-colorPrimary": {
-              backgroundColor: "var(--color-primary)",
-              borderColor: "var(--color-primary)",
-              ":hover, :active, :focus": {
-                backgroundColor: "var(--color-primary-hover)"
-              }
-            },
-            "&.MuiButton-colorError": {
-              backgroundColor: "var(--color-error)",
-              borderColor: "var(--color-error)",
-              ":hover, :active, :focus": {
-                backgroundColor: "var(--color-error-hover)"
-              }
-            },
-            "&.Mui-disabled": {
-              backgroundColor: "var(--color-disabled)",
-              borderColor: "var(--color-disabled)",
-              color: "var(--color-text-disabled)"
-            },
-            ":hover, :active, :focus": {
-              color: "var(--color-text-light)"
-            }
-          },
-          // Styles that apply to outlined (type === secondary)
-          "&.MuiButton-outlined": {
-            background: "none",
-            border: "1px solid var(--color-primary)",
+const f = u(
+  ({ type: o, startIcon: a, "data-qa": l, children: i, buttonType: n, ...e }) => {
+    let r = "contained";
+    return o === "text" && (r = "text"), o === "secondary" && (r = "outlined"), /* @__PURE__ */ t(
+      d,
+      {
+        ...e,
+        "data-qa": l,
+        disableElevation: !0,
+        endIcon: o === "text" && /* @__PURE__ */ t(c, {}),
+        startIcon: o !== "text" && a,
+        sx: v(
+          {
+            // Styles that apply to all button types and colors
+            appearance: "none",
+            border: "1px solid",
+            borderRadius: 0,
             boxSizing: "border-box",
-            "&.MuiButton-colorPrimary": {
-              color: "var(--color-primary)",
-              borderColor: "var(--color-primary)",
-              ":hover, :active, :focus": {
-                borderColor: "var(--color-primary-hover)",
-                color: "var(--color-primary-hover)"
-              }
+            color: "var(--color-text-light)",
+            cursor: "pointer",
+            display: "inline-flex",
+            lineHeight: "var(--font-lineheight-text)",
+            minHeight: 20,
+            padding: "12px 16px",
+            position: "relative",
+            textDecoration: "none",
+            textShadow: "none",
+            textTransform: "none",
+            verticalAlign: "middle",
+            ":focus": {
+              outline: "2px dashed var(--color-text)",
+              outlineOffset: "3px",
+              boxShadow: "none"
             },
-            "&.MuiButton-colorError": {
-              color: "var(--color-error)",
-              borderColor: "var(--color-error)",
+            // Styles that apply to contained (type === primary)
+            "&.MuiButton-contained": {
+              "&.MuiButton-colorPrimary": {
+                backgroundColor: "var(--color-primary)",
+                borderColor: "var(--color-primary)",
+                ":hover, :active, :focus": {
+                  backgroundColor: "var(--color-primary-hover)"
+                }
+              },
+              "&.MuiButton-colorError": {
+                backgroundColor: "var(--color-error)",
+                borderColor: "var(--color-error)",
+                ":hover, :active, :focus": {
+                  backgroundColor: "var(--color-error-hover)"
+                }
+              },
+              "&.Mui-disabled": {
+                backgroundColor: "var(--color-disabled)",
+                borderColor: "var(--color-disabled)",
+                color: "var(--color-text-disabled)"
+              },
               ":hover, :active, :focus": {
-                borderColor: "var(--color-error-hover)",
-                color: "var(--color-error-hover)"
-              }
-            },
-            ":disabled": {
-              backgroundColor: "transparent",
-              borderColor: "var(--color-text-disabled)",
-              color: "var(--color-text-disabled)"
-            }
-          },
-          // Styles that apply to text (type === text)
-          "&.MuiButton-text": {
-            background: "none",
-            borderColor: "transparent",
-            display: "inline-block",
-            textTransform: "uppercase",
-            fontWeight: "bold",
-            fontSize: "1.075rem",
-            verticalAlign: "middle",
-            "&.MuiButton-colorPrimary": {
-              color: "var(--color-primary)",
-              ":hover": {
-                backgroundColor: "var(--color-rijks-skyblue-light)"
+                color: "var(--color-text-light)"
               }
             },
-            "&.MuiButton-colorError": {
-              color: "var(--color-error)",
-              ":hover": {
-                backgroundColor: "var(--color-rijks-red-1-light)"
+            // Styles that apply to outlined (type === secondary)
+            "&.MuiButton-outlined": {
+              background: "none",
+              border: "1px solid var(--color-primary)",
+              boxSizing: "border-box",
+              "&.MuiButton-colorPrimary": {
+                color: "var(--color-primary)",
+                borderColor: "var(--color-primary)",
+                ":hover, :active, :focus": {
+                  borderColor: "var(--color-primary-hover)",
+                  color: "var(--color-primary-hover)"
+                }
+              },
+              "&.MuiButton-colorError": {
+                color: "var(--color-error)",
+                borderColor: "var(--color-error)",
+                ":hover, :active, :focus": {
+                  borderColor: "var(--color-error-hover)",
+                  color: "var(--color-error-hover)"
+                }
+              },
+              ":disabled": {
+                backgroundColor: "transparent",
+                borderColor: "var(--color-text-disabled)",
+                color: "var(--color-text-disabled)"
               }
             },
-            ".MuiButton-endIcon": {
-              width: "1rem",
-              height: "1rem",
-              verticalAlign: "text-top"
-            },
-            ":disabled": {
-              backgroundColor: "transparent",
-              color: "var(--color-text-disabled)",
+            // Styles that apply to text (type === text)
+            "&.MuiButton-text": {
+              background: "none",
+              borderColor: "transparent",
+              display: "inline-block",
+              textTransform: "uppercase",
+              fontWeight: "bold",
+              fontSize: "1.075rem",
+              verticalAlign: "middle",
+              "&.MuiButton-colorPrimary": {
+                color: "var(--color-primary)",
+                ":hover": {
+                  backgroundColor: "var(--color-rijks-skyblue-light)"
+                }
+              },
+              "&.MuiButton-colorError": {
+                color: "var(--color-error)",
+                ":hover": {
+                  backgroundColor: "var(--color-rijks-red-1-light)"
+                }
+              },
               ".MuiButton-endIcon": {
-                fill: "var(--color-text-disabled)"
+                width: "1rem",
+                height: "1rem",
+                verticalAlign: "text-top"
+              },
+              ":disabled": {
+                backgroundColor: "transparent",
+                color: "var(--color-text-disabled)",
+                ".MuiButton-endIcon": {
+                  fill: "var(--color-text-disabled)"
+                }
               }
             }
-          }
-        },
-        e.sx,
-        b
-      ),
-      type: n,
-      variant: r,
-      children: i
-    }
-  );
-});
+          },
+          e.sx,
+          b
+        ),
+        type: n,
+        variant: r,
+        children: i
+      }
+    );
+  }
+);
 export {
   f as AoaButton
 };