npm - @rws-aoa/react-library - Versions diffs - 3.6.5 → 4.0.0 - Mend

@rws-aoa/react-library 3.6.5 → 4.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (88) hide show

package/dist/_constants.js.map CHANGED Viewed

	@@ -1 +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;"}
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;"}

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

	@@ -1 +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"}
1	+ {"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/_menu/menu-item/MenuItem.tsx"],"names":[],"mappings":"AAWA,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 CHANGED Viewed

@@ -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 { 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";
-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);
+import { jsxs as c, jsx as r } from "react/jsx-runtime";
+import { memo as w, useState as u, createElement as I } from "react";
+import { Home as M, KeyboardArrowDown as S } from "@mui/icons-material";
+import { MenuItem as x, Link as B, menuItemClasses as b, Typography as $, svgIconClasses as h, Popper as E } from "@mui/material";
+import { Link as p } from "@tanstack/react-router";
+import { m as v } from "../../../../chunks/index.DJYQ_-zP.js";
+import { FontNormalSxProps as f } from "../../../../_constants.js";
+const F = w((e) => {
+  var i, d, g, m, s;
+  const [k, a] = u(null), [t, n] = u(!1);
+  function y(o) {
+    n(!0), a(o.currentTarget);
   }
-  function i() {
-    a(!1), n(null);
+  function l() {
+    n(!1), a(null);
   }
-  function k() {
+  function C() {
     return e.page.externalPath ? { href: e.page.to } : { to: e.page.to };
   }
   return /* @__PURE__ */ I(
     x,
     {
-      ...k(),
-      "aria-controls": (l = e.page.subItems) != null && l.length && t ? "submenu" : void 0,
+      ...C(),
+      "aria-controls": (i = e.page.subItems) != null && i.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",
-      component: e.page.to && !e.page.externalPath ? b : j,
+      "aria-label": e.page.label,
+      component: e.page.to && !e.page.externalPath ? p : B,
       key: e.index,
       onClick: () => e.setSelectedPage(e.index),
-      onMouseEnter: (o) => v(o),
-      onMouseLeave: () => i(),
+      onMouseEnter: (o) => y(o),
+      onMouseLeave: () => l(),
+      role: "menuitem",
       selected: e.selectedPage === e.index,
       sx: {
         height: "100%",
@@ -40,44 +42,47 @@ const O = C((e) => {
             textDecoration: "underline"
           }
         },
-        "&.Mui-selected": {
+        [`&.${b.selected}`]: {
           backgroundColor: "var(--color-rijks-yellow-light)",
           borderBottomColor: "var(--color-rijks-skyblue)",
           ":hover": {
             backgroundColor: "var(--color-rijks-yellow-hover)"
           }
         }
-      }
+      },
+      title: e.page.label
     },
-    /* @__PURE__ */ u(
-      w,
+    /* @__PURE__ */ c(
+      $,
       {
+        "aria-hidden": !0,
         component: "span",
-        sx: p(
+        sx: v(
           {
             display: "flex",
             alignItems: "center",
-            "&.MuiSvgIcon-root": {
+            [`&.${h.root}`]: {
               marginRight: "5px"
             }
           },
-          h
+          f
         ),
         variant: "body1",
         children: [
-          e.index === 0 && /* @__PURE__ */ r(P, {}),
+          e.index === 0 && /* @__PURE__ */ r(M, {}),
           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,
+      E,
       {
-        anchorEl: f,
+        anchorEl: k,
         id: "submenu",
         open: t,
         placement: "bottom-start",
+        role: "menu",
         sx: {
           backgroundColor: "var(--color-bg-light)",
           padding: "4px 0",
@@ -92,21 +97,22 @@ 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: (s = e.page.subItems) == null ? void 0 : s.map((o, P) => /* @__PURE__ */ c(
           x,
           {
-            component: b,
+            "aria-label": o.label,
+            component: p,
             disableRipple: !0,
             divider: o.divider ?? !1,
-            onClick: (M) => {
-              M.stopPropagation(), e.setSelectedPage(e.index), i();
+            onClick: (j) => {
+              j.stopPropagation(), e.setSelectedPage(e.index), l();
             },
-            sx: p(
+            sx: v(
               {
                 ":active": {
                   backgroundColor: "var(--color-bg-light)"
                 },
-                "&.MuiMenuItem-divider": {
+                [`&.${b.divider}`]: {
                   borderBottom: "transparent",
                   position: "relative",
                   marginBottom: "16px",
@@ -119,13 +125,13 @@ const O = C((e) => {
                     borderBottom: "1px solid rgba(0, 0, 0, 0.12)"
                   }
                 },
-                "&.MuiSvgIcon-root": {
+                [`&.${h.root}`]: {
                   fontSize: "var(--font-size-text)",
                   color: "var(--color-rijks-grey-7)",
                   marginRight: "12px"
                 }
               },
-              h
+              f
             ),
             to: o.to,
             children: [
@@ -133,13 +139,13 @@ const O = C((e) => {
               o.label
             ]
           },
-          y
+          P
         ))
       }
     )
   );
 });
 export {
-  O as AoaMenuItem
+  F as AoaMenuItem
 };
 //# sourceMappingURL=MenuItem.js.map

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

	@@ -1 +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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"}
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 {\n Link as MUILink,\n MenuItem as MUIMenuItem,\n menuItemClasses,\n svgIconClasses,\n Popper,\n Typography\n} 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 [`&.${menuItemClasses.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 [`&.${svgIconClasses.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 [`&.${menuItemClasses.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 [`&.${svgIconClasses.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","menuItemClasses","jsxs","Typography","merge","svgIconClasses","FontNormalSxProps","jsx","HomeIcon","_d","KeyboardArrowDownIcon","Popper","subItem","index"],"mappings":"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"}

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

@@ -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 CHANGED Viewed

	@@ -1 +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"}
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,CAiF/D,CAAC"}

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

@@ -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 CHANGED Viewed

	@@ -1 +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;"}
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 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 CHANGED Viewed

@@ -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 CHANGED Viewed

	@@ -1 +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"}
1	+ {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/button/Button.tsx"],"names":[],"mappings":"AACA,OAAO,EAGL,KAAK,aAAa,EAClB,KAAK,WAAW,IAAI,cAAc,EACnC,MAAM,eAAe,CAAC;AAEvB,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"}