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/components/atoms/button/Button.js CHANGED Viewed

@@ -1,139 +1,141 @@
-import { jsx as t } from "react/jsx-runtime";
-import { ChevronRight as c } from "@mui/icons-material";
-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)",
+import { jsx as l } from "react/jsx-runtime";
+import { ChevronRight as d } from "@mui/icons-material";
+import { Button as v, buttonClasses as r } from "@mui/material";
+import { m as b } from "../../../chunks/index.DJYQ_-zP.js";
+import { memo as s } from "react";
+import { FontNormalSxProps as m } from "../../../_constants.js";
+const C = s(
+  ({ type: o, startIcon: t, "data-qa": i, children: c, buttonType: n, ...a }) => {
+    let e = "contained";
+    return o === "text" && (e = "text"), o === "secondary" && (e = "outlined"), /* @__PURE__ */ l(
+      v,
+      {
+        ...a,
+        "data-qa": i,
+        disableElevation: !0,
+        endIcon: o === "text" && /* @__PURE__ */ l(d, {}),
+        startIcon: o !== "text" && t,
+        sx: b(
+          {
+            // 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)
+            [`&.${r.contained}`]: {
+              [`&.${r.colorPrimary}`]: {
+                backgroundColor: "var(--color-primary)",
+                borderColor: "var(--color-primary)",
+                ":hover, :active, :focus": {
+                  backgroundColor: "var(--color-primary-hover)"
+                }
+              },
+              [`&.${r.colorError}`]: {
+                backgroundColor: "var(--color-error)",
+                borderColor: "var(--color-error)",
+                ":hover, :active, :focus": {
+                  backgroundColor: "var(--color-error-hover)"
+                }
+              },
+              [`&.${r.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)
+            [`&.${r.outlined}`]: {
+              background: "none",
+              border: "1px solid var(--color-primary)",
+              boxSizing: "border-box",
+              [`&.${r.colorPrimary}`]: {
+                color: "var(--color-primary)",
+                borderColor: "var(--color-primary)",
+                ":hover, :active, :focus": {
+                  borderColor: "var(--color-primary-hover)",
+                  color: "var(--color-primary-hover)"
+                }
+              },
+              [`&.${r.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)",
-              ".MuiButton-endIcon": {
-                fill: "var(--color-text-disabled)"
+            // Styles that apply to text (type === text)
+            [`&.${r.text}`]: {
+              background: "none",
+              borderColor: "transparent",
+              display: "inline-block",
+              textTransform: "uppercase",
+              fontWeight: "bold",
+              fontSize: "1.075rem",
+              verticalAlign: "middle",
+              [`&.${r.colorPrimary}`]: {
+                color: "var(--color-primary)",
+                ":hover": {
+                  backgroundColor: "var(--color-rijks-skyblue-light)"
+                }
+              },
+              [`&.${r.colorError}`]: {
+                color: "var(--color-error)",
+                ":hover": {
+                  backgroundColor: "var(--color-rijks-red-1-light)"
+                }
+              },
+              [`&.${r.endIcon}`]: {
+                width: "1rem",
+                height: "1rem",
+                verticalAlign: "text-top"
+              },
+              ":disabled": {
+                backgroundColor: "transparent",
+                color: "var(--color-text-disabled)",
+                [`&.${r.endIcon}`]: {
+                  fill: "var(--color-text-disabled)"
+                }
               }
             }
-          }
-        },
-        e.sx,
-        b
-      ),
-      type: n,
-      variant: r,
-      children: i
-    }
-  );
-});
+          },
+          a.sx,
+          m
+        ),
+        type: n,
+        variant: e,
+        children: c
+      }
+    );
+  }
+);
 export {
-  f as AoaButton
+  C as AoaButton
 };
 //# sourceMappingURL=Button.js.map

package/dist/components/atoms/button/Button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.js","sources":["../../../../src/components/atoms/button/Button.tsx"],"sourcesContent":["import { ChevronRight } from \"@mui/icons-material\";\nimport { Button as MUIButton, type ButtonTypeMap, type ButtonProps as MUIButtonProps } from \"@mui/material\";\nimport merge from \"lodash.merge\";\nimport { memo, type ButtonHTMLAttributes, type ReactNode } from \"react\";\nimport { FontNormalSxProps } from \"../../../_constants\";\n\ninterface CommonProps {\n /*\n Data-qa tag for E2E test purposes\n /\n \"data-qa\"?: string;\n /\n Defines the colour and style of the button\n /\n type: \"primary\" \| \"secondary\" \| \"text\";\n}\n\nexport type AoaButtonProps = Omit<MUIButtonProps<ButtonTypeMap[\"defaultComponent\"], CommonProps>, \"variant\"> & {\n readonly buttonType?: ButtonHTMLAttributes<HTMLButtonElement>[\"type\"];\n};\n\n/\n Constructs a button using pre-defined Rijks styling\n \n @param props - Props to pass to the button\n * @example\n * ```jsx\n * <AoaButton onClick={() => console.log()} type='primary'>button</AoaButton>\n * ```\n */\n\nexport const AoaButton = memo(({ type, startIcon, \"data-qa\": dataQa, children, buttonType, ...props }: AoaButtonProps): ReactNode => {\n let variant: \"contained\" \| \"outlined\" \| \"text\" = \"contained\";\n\n if (type === \"text\") {\n variant = \"text\";\n }\n\n if (type === \"secondary\") {\n variant = \"outlined\";\n }\n\n return (\n <MUIButton\n {...props}\n data-qa={dataQa}\n disableElevation\n endIcon={type === \"text\" && <ChevronRight />}\n startIcon={type !== \"text\" && startIcon}\n sx={merge(\n {\n // Styles that apply to all button types and colors\n appearance: \"none\",\n border: \"1px solid\",\n borderRadius: 0,\n boxSizing: \"border-box\",\n color: \"var(--color-text-light)\",\n cursor: \"pointer\",\n display: \"inline-flex\",\n lineHeight: \"var(--font-lineheight-text)\",\n minHeight: 20,\n padding: \"12px 16px\",\n position: \"relative\",\n textDecoration: \"none\",\n textShadow: \"none\",\n textTransform: \"none\",\n verticalAlign: \"middle\",\n\n \":focus\": {\n outline: \"2px dashed var(--color-text)\",\n outlineOffset: \"3px\",\n boxShadow: \"none\"\n },\n\n // Styles that apply to contained (type === primary)\n ~~\"&.MuiButton-~~contained\": {\n ~~\"&.MuiButton-~~colorPrimary\": {\n backgroundColor: \"var(--color-primary)\",\n borderColor: \"var(--color-primary)\",\n\n \":hover, :active, :focus\": {\n backgroundColor: \"var(--color-primary-hover)\"\n }\n },\n\n ~~\"&.MuiButton-~~colorError\": {\n backgroundColor: \"var(--color-error)\",\n borderColor: \"var(--color-error)\",\n\n \":hover, :active, :focus\": {\n backgroundColor: \"var(--color-error-hover)\"\n }\n },\n\n ~~\"&.Mui-~~disabled\": {\n backgroundColor: \"var(--color-disabled)\",\n borderColor: \"var(--color-disabled)\",\n color: \"var(--color-text-disabled)\"\n },\n\n \":hover, :active, :focus\": {\n color: \"var(--color-text-light)\"\n }\n },\n\n // Styles that apply to outlined (type === secondary)\n ~~\"&.MuiButton-~~outlined\": {\n background: \"none\",\n border: \"1px solid var(--color-primary)\",\n boxSizing: \"border-box\",\n\n ~~\"&.MuiButton-~~colorPrimary\": {\n color: \"var(--color-primary)\",\n borderColor: \"var(--color-primary)\",\n\n \":hover, :active, :focus\": {\n borderColor: \"var(--color-primary-hover)\",\n color: \"var(--color-primary-hover)\"\n }\n },\n\n ~~\"&.MuiButton-~~colorError\": {\n color: \"var(--color-error)\",\n borderColor: \"var(--color-error)\",\n\n \":hover, :active, :focus\": {\n borderColor: \"var(--color-error-hover)\",\n color: \"var(--color-error-hover)\"\n }\n },\n\n \":disabled\": {\n backgroundColor: \"transparent\",\n borderColor: \"var(--color-text-disabled)\",\n color: \"var(--color-text-disabled)\"\n }\n },\n\n // Styles that apply to text (type === text)\n ~~\"&.MuiButton-~~text\": {\n background: \"none\",\n borderColor: \"transparent\",\n display: \"inline-block\",\n textTransform: \"uppercase\",\n fontWeight: \"bold\",\n fontSize: \"1.075rem\",\n verticalAlign: \"middle\",\n\n ~~\"&.MuiButton-~~colorPrimary\": {\n color: \"var(--color-primary)\",\n\n \":hover\": {\n backgroundColor: \"var(--color-rijks-skyblue-light)\"\n }\n },\n\n ~~\"&.MuiButton-~~colorError\": {\n color: \"var(--color-error)\",\n\n \":hover\": {\n backgroundColor: \"var(--color-rijks-red-1-light)\"\n }\n },\n\n \".~~MuiButton-~~endIcon\": {\n width: \"1rem\",\n height: \"1rem\",\n verticalAlign: \"text-top\"\n },\n\n \":disabled\": {\n backgroundColor: \"transparent\",\n color: \"var(--color-text-disabled)\",\n\n \".~~MuiButton-~~endIcon\": {\n fill: \"var(--color-text-disabled)\"\n }\n }\n }~~\n }~~,\n props.sx,\n FontNormalSxProps\n )}\n type={buttonType}\n variant={variant}\n >\n {children}\n </MUIButton>\n );\n});\n"],"names":["AoaButton","memo","type","startIcon","dataQa","children","buttonType","props","variant","jsx","MUIButton","ChevronRight","merge","FontNormalSxProps"],"mappings":";;;;;;~~AA+BO~~,MAAMA,IAAYC,~~EAAK~~,CAAC,EAAE,MAAAC,GAAM,WAAAC,GAAW,WAAWC,GAAQ,UAAAC,GAAU,YAAAC,GAAY,GAAGC,~~EAAA,MAAuC~~;~~AACnI~~,~~MAAIC~~,IAA6C;AAEjD,~~SAAIN~~,MAAS,WACDM,IAAA,SAGRN,MAAS,gBACDM,IAAA,aAIV,gBAAAC;AAAA,~~IAACC~~;AAAAA,~~IAAA~~;AAAA,~~MACE~~,GAAGH;AAAA,~~MACJ~~,WAASH;AAAA,~~MACT~~,kBAAgB;AAAA,~~MAChB~~,SAASF,MAAS,UAAU,gBAAAO,EAACE,GAAa,CAAA,CAAA;AAAA,~~MAC1C~~,WAAWT,MAAS,UAAUC;AAAA,~~MAC9B~~,IAAIS;AAAA,~~QACF~~;AAAA;AAAA,~~UAEE~~,YAAY;AAAA,~~UACZ~~,QAAQ;AAAA,~~UACR~~,cAAc;AAAA,~~UACd~~,WAAW;AAAA,~~UACX~~,OAAO;AAAA,~~UACP~~,QAAQ;AAAA,~~UACR~~,SAAS;AAAA,~~UACT~~,YAAY;AAAA,~~UACZ~~,WAAW;AAAA,~~UACX~~,SAAS;AAAA,~~UACT~~,UAAU;AAAA,~~UACV~~,gBAAgB;AAAA,~~UAChB~~,YAAY;AAAA,~~UACZ~~,eAAe;AAAA,~~UACf~~,eAAe;AAAA,~~UAEf~~,UAAU;AAAA,~~YACR~~,SAAS;AAAA,~~YACT~~,eAAe;AAAA,~~YACf~~,WAAW;AAAA,~~UACb~~;AAAA;AAAA,~~UAGA~~,~~yBAAyB~~;AAAA,~~YACvB~~,~~4BAA4B~~;AAAA,~~cAC1B~~,iBAAiB;AAAA,~~cACjB~~,aAAa;AAAA,~~cAEb~~,2BAA2B;AAAA,~~gBACzB~~,iBAAiB;AAAA,~~cAAA~~;AAAA,~~YAErB~~;AAAA,~~YAEA~~,~~0BAA0B~~;AAAA,~~cACxB~~,iBAAiB;AAAA,~~cACjB~~,aAAa;AAAA,~~cAEb~~,2BAA2B;AAAA,~~gBACzB~~,iBAAiB;AAAA,~~cAAA~~;AAAA,~~YAErB~~;AAAA,~~YAEA~~,~~kBAAkB~~;AAAA,~~cAChB~~,iBAAiB;AAAA,~~cACjB~~,aAAa;AAAA,~~cACb~~,OAAO;AAAA,~~YACT~~;AAAA,~~YAEA~~,2BAA2B;AAAA,~~cACzB~~,OAAO;AAAA,~~YAAA~~;AAAA,~~UAEX~~;AAAA;AAAA,~~UAGA~~,~~wBAAwB~~;AAAA,~~YACtB~~,YAAY;AAAA,~~YACZ~~,QAAQ;AAAA,~~YACR~~,WAAW;AAAA,~~YAEX~~,~~4BAA4B~~;AAAA,~~cAC1B~~,OAAO;AAAA,~~cACP~~,aAAa;AAAA,~~cAEb~~,2BAA2B;AAAA,~~gBACzB~~,aAAa;AAAA,~~gBACb~~,OAAO;AAAA,~~cAAA~~;AAAA,~~YAEX~~;AAAA,~~YAEA~~,~~0BAA0B~~;AAAA,~~cACxB~~,OAAO;AAAA,~~cACP~~,aAAa;AAAA,~~cAEb~~,2BAA2B;AAAA,~~gBACzB~~,aAAa;AAAA,~~gBACb~~,OAAO;AAAA,~~cAAA~~;AAAA,~~YAEX~~;AAAA,~~YAEA~~,aAAa;AAAA,~~cACX~~,iBAAiB;AAAA,~~cACjB~~,aAAa;AAAA,~~cACb~~,OAAO;AAAA,~~YAAA~~;AAAA,~~UAEX~~;AAAA;AAAA,~~UAGA~~,~~oBAAoB~~;AAAA,~~YAClB~~,YAAY;AAAA,~~YACZ~~,aAAa;AAAA,~~YACb~~,SAAS;AAAA,~~YACT~~,eAAe;AAAA,~~YACf~~,YAAY;AAAA,~~YACZ~~,UAAU;AAAA,~~YACV~~,eAAe;AAAA,~~YAEf~~,~~4BAA4B~~;AAAA,~~cAC1B~~,OAAO;AAAA,~~cAEP~~,UAAU;AAAA,~~gBACR~~,iBAAiB;AAAA,~~cAAA~~;AAAA,~~YAErB~~;AAAA,~~YAEA~~,~~0BAA0B~~;AAAA,~~cACxB~~,OAAO;AAAA,~~cAEP~~,UAAU;AAAA,~~gBACR~~,iBAAiB;AAAA,~~cAAA~~;AAAA,~~YAErB~~;AAAA,~~YAEA~~,~~sBAAsB~~;AAAA,~~cACpB~~,OAAO;AAAA,~~cACP~~,QAAQ;AAAA,~~cACR~~,eAAe;AAAA,~~YACjB~~;AAAA,~~YAEA~~,aAAa;AAAA,~~cACX~~,iBAAiB;AAAA,~~cACjB~~,OAAO;AAAA,~~cAEP~~,~~sBAAsB~~;AAAA,~~gBACpB~~,MAAM;AAAA,~~cAAA~~;AAAA,~~YACR~~;AAAA,~~UACF~~;AAAA,~~QAEJ~~;AAAA,~~QACAL~~,EAAM;AAAA,~~QACNM~~;AAAA,~~MACF~~;AAAA,~~MACA~~,~~MAAMP~~;AAAA,~~MACN~~,SAAAE;AAAA,~~MAEC~~,UAAAH;AAAA,~~IAAA~~;AAAA,~~EACH~~;~~AAEJ~~,~~CAAC~~;"}
1	+ {"version":3,"file":"Button.js","sources":["../../../../src/components/atoms/button/Button.tsx"],"sourcesContent":["import { ChevronRight } from '@mui/icons-material';\nimport {\n Button as MUIButton,\n buttonClasses,\n type ButtonTypeMap,\n type ButtonProps as MUIButtonProps\n} from '@mui/material';\nimport merge from 'lodash.merge';\nimport { memo, type ButtonHTMLAttributes, type ReactNode } from 'react';\nimport { FontNormalSxProps } from '../../../_constants';\n\ninterface CommonProps {\n /*\n Data-qa tag for E2E test purposes\n /\n 'data-qa'?: string;\n /\n Defines the colour and style of the button\n /\n type: 'primary' \| 'secondary' \| 'text';\n}\n\nexport type AoaButtonProps = Omit<MUIButtonProps<ButtonTypeMap['defaultComponent'], CommonProps>, 'variant'> & {\n readonly buttonType?: ButtonHTMLAttributes<HTMLButtonElement>['type'];\n};\n\n/\n Constructs a button using pre-defined Rijks styling\n \n @param props - Props to pass to the button\n * @example\n * ```jsx\n * <AoaButton onClick={() => console.log()} type='primary'>button</AoaButton>\n * ```\n */\n\nexport const AoaButton = memo(\n ({ type, startIcon, 'data-qa': dataQa, children, buttonType, ...props }: AoaButtonProps): ReactNode => {\n let variant: 'contained' \| 'outlined' \| 'text' = 'contained';\n\n if (type === 'text') {\n variant = 'text';\n }\n\n if (type === 'secondary') {\n variant = 'outlined';\n }\n\n return (\n <MUIButton\n {...props}\n data-qa={dataQa}\n disableElevation\n endIcon={type === 'text' && <ChevronRight />}\n startIcon={type !== 'text' && startIcon}\n sx={merge(\n {\n // Styles that apply to all button types and colors\n appearance: 'none',\n border: '1px solid',\n borderRadius: 0,\n boxSizing: 'border-box',\n color: 'var(--color-text-light)',\n cursor: 'pointer',\n display: 'inline-flex',\n lineHeight: 'var(--font-lineheight-text)',\n minHeight: 20,\n padding: '12px 16px',\n position: 'relative',\n textDecoration: 'none',\n textShadow: 'none',\n textTransform: 'none',\n verticalAlign: 'middle',\n\n ':focus': {\n outline: '2px dashed var(--color-text)',\n outlineOffset: '3px',\n boxShadow: 'none'\n },\n\n // Styles that apply to contained (type === primary)\n [`&.${buttonClasses.contained}`]: {\n [`&.${buttonClasses.colorPrimary}`]: {\n backgroundColor: 'var(--color-primary)',\n borderColor: 'var(--color-primary)',\n\n ':hover, :active, :focus': {\n backgroundColor: 'var(--color-primary-hover)'\n }\n },\n\n [`&.${buttonClasses.colorError}`]: {\n backgroundColor: 'var(--color-error)',\n borderColor: 'var(--color-error)',\n\n ':hover, :active, :focus': {\n backgroundColor: 'var(--color-error-hover)'\n }\n },\n\n [`&.${buttonClasses.disabled}`]: {\n backgroundColor: 'var(--color-disabled)',\n borderColor: 'var(--color-disabled)',\n color: 'var(--color-text-disabled)'\n },\n\n ':hover, :active, :focus': {\n color: 'var(--color-text-light)'\n }\n },\n\n // Styles that apply to outlined (type === secondary)\n [`&.${buttonClasses.outlined}`]: {\n background: 'none',\n border: '1px solid var(--color-primary)',\n boxSizing: 'border-box',\n\n [`&.${buttonClasses.colorPrimary}`]: {\n color: 'var(--color-primary)',\n borderColor: 'var(--color-primary)',\n\n ':hover, :active, :focus': {\n borderColor: 'var(--color-primary-hover)',\n color: 'var(--color-primary-hover)'\n }\n },\n\n [`&.${buttonClasses.colorError}`]: {\n color: 'var(--color-error)',\n borderColor: 'var(--color-error)',\n\n ':hover, :active, :focus': {\n borderColor: 'var(--color-error-hover)',\n color: 'var(--color-error-hover)'\n }\n },\n\n ':disabled': {\n backgroundColor: 'transparent',\n borderColor: 'var(--color-text-disabled)',\n color: 'var(--color-text-disabled)'\n }\n },\n\n // Styles that apply to text (type === text)\n [`&.${buttonClasses.text}`]: {\n background: 'none',\n borderColor: 'transparent',\n display: 'inline-block',\n textTransform: 'uppercase',\n fontWeight: 'bold',\n fontSize: '1.075rem',\n verticalAlign: 'middle',\n\n [`&.${buttonClasses.colorPrimary}`]: {\n color: 'var(--color-primary)',\n\n ':hover': {\n backgroundColor: 'var(--color-rijks-skyblue-light)'\n }\n },\n\n [`&.${buttonClasses.colorError}`]: {\n color: 'var(--color-error)',\n\n ':hover': {\n backgroundColor: 'var(--color-rijks-red-1-light)'\n }\n },\n\n [`&.${buttonClasses.endIcon}`]: {\n width: '1rem',\n height: '1rem',\n verticalAlign: 'text-top'\n },\n\n ':disabled': {\n backgroundColor: 'transparent',\n color: 'var(--color-text-disabled)',\n\n [`&.${buttonClasses.endIcon}`]: {\n fill: 'var(--color-text-disabled)'\n }\n }\n }\n },\n props.sx,\n FontNormalSxProps\n )}\n type={buttonType}\n variant={variant}\n >\n {children}\n </MUIButton>\n );\n }\n);\n"],"names":["AoaButton","memo","type","startIcon","dataQa","children","buttonType","props","variant","jsx","MUIButton","ChevronRight","merge","buttonClasses","FontNormalSxProps"],"mappings":";;;;;;AAoCO,MAAMA,IAAYC;AAAA,EACvB,CAAC,EAAE,MAAAC,GAAM,WAAAC,GAAW,WAAWC,GAAQ,UAAAC,GAAU,YAAAC,GAAY,GAAGC,QAAuC;AACrG,QAAIC,IAA6C;AAEjD,WAAIN,MAAS,WACDM,IAAA,SAGRN,MAAS,gBACDM,IAAA,aAIV,gBAAAC;AAAA,MAACC;AAAAA,MAAA;AAAA,QACE,GAAGH;AAAA,QACJ,WAASH;AAAA,QACT,kBAAgB;AAAA,QAChB,SAASF,MAAS,UAAU,gBAAAO,EAACE,GAAa,CAAA,CAAA;AAAA,QAC1C,WAAWT,MAAS,UAAUC;AAAA,QAC9B,IAAIS;AAAA,UACF;AAAA;AAAA,YAEE,YAAY;AAAA,YACZ,QAAQ;AAAA,YACR,cAAc;AAAA,YACd,WAAW;AAAA,YACX,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,YAAY;AAAA,YACZ,WAAW;AAAA,YACX,SAAS;AAAA,YACT,UAAU;AAAA,YACV,gBAAgB;AAAA,YAChB,YAAY;AAAA,YACZ,eAAe;AAAA,YACf,eAAe;AAAA,YAEf,UAAU;AAAA,cACR,SAAS;AAAA,cACT,eAAe;AAAA,cACf,WAAW;AAAA,YACb;AAAA;AAAA,YAGA,CAAC,KAAKC,EAAc,SAAS,EAAE,GAAG;AAAA,cAChC,CAAC,KAAKA,EAAc,YAAY,EAAE,GAAG;AAAA,gBACnC,iBAAiB;AAAA,gBACjB,aAAa;AAAA,gBAEb,2BAA2B;AAAA,kBACzB,iBAAiB;AAAA,gBAAA;AAAA,cAErB;AAAA,cAEA,CAAC,KAAKA,EAAc,UAAU,EAAE,GAAG;AAAA,gBACjC,iBAAiB;AAAA,gBACjB,aAAa;AAAA,gBAEb,2BAA2B;AAAA,kBACzB,iBAAiB;AAAA,gBAAA;AAAA,cAErB;AAAA,cAEA,CAAC,KAAKA,EAAc,QAAQ,EAAE,GAAG;AAAA,gBAC/B,iBAAiB;AAAA,gBACjB,aAAa;AAAA,gBACb,OAAO;AAAA,cACT;AAAA,cAEA,2BAA2B;AAAA,gBACzB,OAAO;AAAA,cAAA;AAAA,YAEX;AAAA;AAAA,YAGA,CAAC,KAAKA,EAAc,QAAQ,EAAE,GAAG;AAAA,cAC/B,YAAY;AAAA,cACZ,QAAQ;AAAA,cACR,WAAW;AAAA,cAEX,CAAC,KAAKA,EAAc,YAAY,EAAE,GAAG;AAAA,gBACnC,OAAO;AAAA,gBACP,aAAa;AAAA,gBAEb,2BAA2B;AAAA,kBACzB,aAAa;AAAA,kBACb,OAAO;AAAA,gBAAA;AAAA,cAEX;AAAA,cAEA,CAAC,KAAKA,EAAc,UAAU,EAAE,GAAG;AAAA,gBACjC,OAAO;AAAA,gBACP,aAAa;AAAA,gBAEb,2BAA2B;AAAA,kBACzB,aAAa;AAAA,kBACb,OAAO;AAAA,gBAAA;AAAA,cAEX;AAAA,cAEA,aAAa;AAAA,gBACX,iBAAiB;AAAA,gBACjB,aAAa;AAAA,gBACb,OAAO;AAAA,cAAA;AAAA,YAEX;AAAA;AAAA,YAGA,CAAC,KAAKA,EAAc,IAAI,EAAE,GAAG;AAAA,cAC3B,YAAY;AAAA,cACZ,aAAa;AAAA,cACb,SAAS;AAAA,cACT,eAAe;AAAA,cACf,YAAY;AAAA,cACZ,UAAU;AAAA,cACV,eAAe;AAAA,cAEf,CAAC,KAAKA,EAAc,YAAY,EAAE,GAAG;AAAA,gBACnC,OAAO;AAAA,gBAEP,UAAU;AAAA,kBACR,iBAAiB;AAAA,gBAAA;AAAA,cAErB;AAAA,cAEA,CAAC,KAAKA,EAAc,UAAU,EAAE,GAAG;AAAA,gBACjC,OAAO;AAAA,gBAEP,UAAU;AAAA,kBACR,iBAAiB;AAAA,gBAAA;AAAA,cAErB;AAAA,cAEA,CAAC,KAAKA,EAAc,OAAO,EAAE,GAAG;AAAA,gBAC9B,OAAO;AAAA,gBACP,QAAQ;AAAA,gBACR,eAAe;AAAA,cACjB;AAAA,cAEA,aAAa;AAAA,gBACX,iBAAiB;AAAA,gBACjB,OAAO;AAAA,gBAEP,CAAC,KAAKA,EAAc,OAAO,EAAE,GAAG;AAAA,kBAC9B,MAAM;AAAA,gBAAA;AAAA,cACR;AAAA,YACF;AAAA,UAEJ;AAAA,UACAN,EAAM;AAAA,UACNO;AAAA,QACF;AAAA,QACA,MAAMR;AAAA,QACN,SAAAE;AAAA,QAEC,UAAAH;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN;"}

package/dist/components/atoms/icon-button/IconButton.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ export interface AoaIconButtonProps {
     /**
      * Data-qa tag for E2E test purposes
      */
-    readonly "data-qa"?: string;
+    readonly 'data-qa'?: string;
     /**
      * Whether this button should be disabled
      */

package/dist/components/atoms/icon-button/IconButton.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/icon-button/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAwC,KAAK,OAAO,EAAE,MAAM,eAAe,CAAC;AAEnF,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE7C,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,IAAI,EAAE,GAAG,CAAC,OAAO,CAAC;IAC3B;;OAEG;IACH,QAAQ,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,OAAO,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC;IAC3C;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,EAAE,OAAO,CAAC;CACvB;AAED;;;;;;;;GAQG;AAEH,eAAO,MAAM,aAAa,8CAAgB,kBAAkB,KAAG,SAAS,~~CAyCtE~~,CAAC"}
1	+ {"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/icon-button/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAwC,KAAK,OAAO,EAAE,MAAM,eAAe,CAAC;AAEnF,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE7C,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,IAAI,EAAE,GAAG,CAAC,OAAO,CAAC;IAC3B;;OAEG;IACH,QAAQ,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,OAAO,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC;IAC3C;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,EAAE,OAAO,CAAC;CACvB;AAED;;;;;;;;GAQG;AAEH,eAAO,MAAM,aAAa,8CAAgB,kBAAkB,KAAG,SAAS,CAqDtE,CAAC"}

package/dist/components/atoms/icon-button/IconButton.js CHANGED Viewed

@@ -1,17 +1,19 @@
 import { jsx as r } from "react/jsx-runtime";
 import { IconButton as a, Tooltip as l } from "@mui/material";
 import { m as i } from "../../../chunks/index.DJYQ_-zP.js";
-import { memo as d } from "react";
-const b = d((o) => {
+import { memo as t } from "react";
+const s = t((o) => {
   const e = /* @__PURE__ */ r(
     a,
     {
+      "aria-label": o.label,
       "data-qa": o["data-qa"],
       disableFocusRipple: !0,
       disableRipple: !0,
       disableTouchRipple: !0,
       disabled: o.disabled,
       onClick: o.onClick,
+      role: "button",
       sx: i(
         {
           color: "var(--color-primary)",
@@ -41,9 +43,9 @@ const b = d((o) => {
       children: o.icon
     }
   );
-  return /* @__PURE__ */ r(l, { title: o.label, children: o.disabled ? /* @__PURE__ */ r("span", { "data-testid": "disabled-span-wrapper", children: e }) : e });
+  return /* @__PURE__ */ r(l, { title: o.label, children: o.disabled ? /* @__PURE__ */ r("span", { "aria-label": o.label, "data-testid": "disabled-span-wrapper", role: "tooltip", children: e }) : e });
 });
 export {
-  b as AoaIconButton
+  s as AoaIconButton
 };
 //# sourceMappingURL=IconButton.js.map

package/dist/components/atoms/icon-button/IconButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IconButton.js","sources":["../../../../src/components/atoms/icon-button/IconButton.tsx"],"sourcesContent":["import { IconButton as MUIIconButton, Tooltip, type SxProps } from \"@mui/material\";\nimport merge from \"lodash.merge\";\nimport { memo, type ReactNode } from \"react\";\n\nexport interface AoaIconButtonProps {\n /*\n Data-qa tag for E2E test purposes\n /\n readonly \"data-qa\"?: string;\n /\n Whether this button should be disabled\n /\n readonly disabled?: boolean;\n /\n The icon to be displayed as a button\n /\n readonly icon: JSX.Element;\n /\n Whether this button is being used inline\n /\n readonly inline?: boolean;\n /\n The label that is shown on hover\n /\n readonly label: string;\n /\n The action that should be triggered when clicking the button\n /\n onClick(this: void, ..._args: any[]): void;\n /\n Material UI's property to apply styling\n /\n readonly sx?: SxProps;\n}\n\n/\n Constructs an icon button using pre-defined Rijks styling\n \n @param props - Props to pass to the icon button\n * @example\n * ```jsx\n * <AoaIconButton onClick={() => console.log()} label='Order a burger' icon={<Fastfood />} />\n * ```\n */\n\nexport const AoaIconButton = memo((props: AoaIconButtonProps): ReactNode => {\n const Button = (\n <MUIIconButton\n data-qa={props[\"data-qa\"]}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n disabled={props.disabled}\n onClick={props.onClick}\n sx={merge(\n {\n color: \"var(--color-primary)\",\n border: \"1px solid var(--color-primary)\",\n borderRadius: 0,\n \":hover, :active, :focus\": {\n color: \"var(--color-primary-hover)\",\n borderColor: \"var(--color-primary-hover)\"\n },\n \":disabled\": {\n backgroundColor: \"transparent\",\n borderColor: \"var(--color-text-disabled)\",\n color: \"var(--color-text-disabled)\"\n },\n \":focus\": {\n outline: \"2px dashed var(--color-text)\",\n outlineOffset: 3,\n boxShadow: \"none\"\n },\n ...(props.inline && {\n border: \"none\",\n padding: 0\n })\n },\n props.sx\n )}\n >\n {props.icon}\n </MUIIconButton>\n );\n\n return <Tooltip title={props.label}>{props.disabled ? <span data-testid~~=\"~~disabled-span-wrapper~~\">~~{Button}</span> : Button}</Tooltip~~>;\~~n});\n"],"names":["AoaIconButton","memo","props","Button","jsx","MUIIconButton","merge","Tooltip"],"mappings":";;;;AA6Ca,MAAAA,IAAgBC,EAAK,CAACC,MAAyC;AAC1E,QAAMC,IACJ,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,~~WAASH~~,EAAM,SAAS;AAAA,MACxB,oBAAkB;AAAA,MAClB,eAAa;AAAA,MACb,oBAAkB;AAAA,MAClB,UAAUA,EAAM;AAAA,MAChB,SAASA,EAAM;AAAA,MACf,IAAII;AAAA,QACF;AAAA,UACE,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,cAAc;AAAA,UACd,2BAA2B;AAAA,YACzB,OAAO;AAAA,YACP,aAAa;AAAA,UACf;AAAA,UACA,aAAa;AAAA,YACX,iBAAiB;AAAA,YACjB,aAAa;AAAA,YACb,OAAO;AAAA,UACT;AAAA,UACA,UAAU;AAAA,YACR,SAAS;AAAA,YACT,eAAe;AAAA,YACf,WAAW;AAAA,UACb;AAAA,UACA,GAAIJ,EAAM,UAAU;AAAA,YAClB,QAAQ;AAAA,YACR,SAAS;AAAA,UAAA;AAAA,QAEb;AAAA,QACAA,EAAM;AAAA,MACR;AAAA,MAEC,UAAMA,EAAA;AAAA,IAAA;AAAA,EACT;AAGF,~~SAAQ~~,~~gBAAAE~~,~~EAAAG~~,~~GAAA,EAAQ,~~OAAOL,EAAM,~~OAAQ~~,UAAAA,EAAM,~~WAAW~~,gBAAAE,~~EAAC~~,~~QAAK~~,~~EAAA~~,eAAY,~~yBAAyB~~,~~UAAAD~~,~~EAAO~~,~~CAAA~~,~~IAAUA~~,~~GAAO~~;~~AAC3H~~,CAAC;"}
1	+ {"version":3,"file":"IconButton.js","sources":["../../../../src/components/atoms/icon-button/IconButton.tsx"],"sourcesContent":["import { IconButton as MUIIconButton, Tooltip, type SxProps } from '@mui/material';\nimport merge from 'lodash.merge';\nimport { memo, type ReactNode } from 'react';\n\nexport interface AoaIconButtonProps {\n /*\n Data-qa tag for E2E test purposes\n /\n readonly 'data-qa'?: string;\n /\n Whether this button should be disabled\n /\n readonly disabled?: boolean;\n /\n The icon to be displayed as a button\n /\n readonly icon: JSX.Element;\n /\n Whether this button is being used inline\n /\n readonly inline?: boolean;\n /\n The label that is shown on hover\n /\n readonly label: string;\n /\n The action that should be triggered when clicking the button\n /\n onClick(this: void, ..._args: any[]): void;\n /\n Material UI's property to apply styling\n /\n readonly sx?: SxProps;\n}\n\n/\n Constructs an icon button using pre-defined Rijks styling\n \n @param props - Props to pass to the icon button\n * @example\n * ```jsx\n * <AoaIconButton onClick={() => console.log()} label='Order a burger' icon={<Fastfood />} />\n * ```\n */\n\nexport const AoaIconButton = memo((props: AoaIconButtonProps): ReactNode => {\n const Button = (\n <MUIIconButton\n aria-label={props.label}\n data-qa={props['data-qa']}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n disabled={props.disabled}\n onClick={props.onClick}\n role='button'\n sx={merge(\n {\n color: 'var(--color-primary)',\n border: '1px solid var(--color-primary)',\n borderRadius: 0,\n ':hover, :active, :focus': {\n color: 'var(--color-primary-hover)',\n borderColor: 'var(--color-primary-hover)'\n },\n ':disabled': {\n backgroundColor: 'transparent',\n borderColor: 'var(--color-text-disabled)',\n color: 'var(--color-text-disabled)'\n },\n ':focus': {\n outline: '2px dashed var(--color-text)',\n outlineOffset: 3,\n boxShadow: 'none'\n },\n ...(props.inline && {\n border: 'none',\n padding: 0\n })\n },\n props.sx\n )}\n >\n {props.icon}\n </MUIIconButton>\n );\n\n return (\n <Tooltip title={props.label}>\n {props.disabled ? (\n <span aria-label={props.label} data-testid='disabled-span-wrapper' role='tooltip'>\n {Button}\n </span>\n ) : (\n Button\n )}\n </Tooltip>\n );\n});\n"],"names":["AoaIconButton","memo","props","Button","jsx","MUIIconButton","merge","Tooltip"],"mappings":";;;;AA6Ca,MAAAA,IAAgBC,EAAK,CAACC,MAAyC;AAC1E,QAAMC,IACJ,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,cAAYH,EAAM;AAAA,MAClB,WAASA,EAAM,SAAS;AAAA,MACxB,oBAAkB;AAAA,MAClB,eAAa;AAAA,MACb,oBAAkB;AAAA,MAClB,UAAUA,EAAM;AAAA,MAChB,SAASA,EAAM;AAAA,MACf,MAAK;AAAA,MACL,IAAII;AAAA,QACF;AAAA,UACE,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,cAAc;AAAA,UACd,2BAA2B;AAAA,YACzB,OAAO;AAAA,YACP,aAAa;AAAA,UACf;AAAA,UACA,aAAa;AAAA,YACX,iBAAiB;AAAA,YACjB,aAAa;AAAA,YACb,OAAO;AAAA,UACT;AAAA,UACA,UAAU;AAAA,YACR,SAAS;AAAA,YACT,eAAe;AAAA,YACf,WAAW;AAAA,UACb;AAAA,UACA,GAAIJ,EAAM,UAAU;AAAA,YAClB,QAAQ;AAAA,YACR,SAAS;AAAA,UAAA;AAAA,QAEb;AAAA,QACAA,EAAM;AAAA,MACR;AAAA,MAEC,UAAMA,EAAA;AAAA,IAAA;AAAA,EACT;AAGF,2BACGK,GAAQ,EAAA,OAAOL,EAAM,OACnB,UAAAA,EAAM,WACJ,gBAAAE,EAAA,QAAA,EAAK,cAAYF,EAAM,OAAO,eAAY,yBAAwB,MAAK,WACrE,UAAAC,GACH,IAEAA,EAEJ,CAAA;AAEJ,CAAC;"}

package/dist/components/atoms/input/Input.d.ts CHANGED Viewed

@@ -1,10 +1,10 @@
 import { TextFieldProps } from '@mui/material';
 import { ReactNode } from 'react';
-export interface AoaInputProps extends Omit<TextFieldProps, "variant"> {
+export interface AoaInputProps extends Omit<TextFieldProps, 'variant'> {
     /**
      * Data-qa tag for E2E test purposes
      */
-    readonly "data-qa"?: string;
+    readonly 'data-qa'?: string;
     /**
      * Whether this input field is optional
      */

package/dist/components/atoms/input/Input.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,~~EAAa~~,KAAK,cAAc,~~EAAE~~,MAAM,eAAe,CAAC;~~AAE/D~~,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAG7C,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC;IACpE;;OAEG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,QAAQ,+DAAiC,aAAa,KAAG,SAAS,~~CAgE7E~~,CAAC"}
1	+ {"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,cAAc,EAIpB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAG7C,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC;IACpE;;OAEG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,QAAQ,+DAAiC,aAAa,KAAG,SAAS,CAkE7E,CAAC"}

package/dist/components/atoms/input/Input.js CHANGED Viewed

@@ -1,63 +1,68 @@
-import { jsx as t } from "react/jsx-runtime";
-import { TextField as i } from "@mui/material";
-import { m as a } from "../../../chunks/index.DJYQ_-zP.js";
-import { memo as l } from "react";
-import { FontNormalSxProps as r } from "../../../_constants.js";
-const m = l(({ optional: e, ...o }) => /* @__PURE__ */ t(
-  i,
-  {
-    ...o,
-    InputLabelProps: { shrink: !1, ...o.InputLabelProps },
-    required: !e,
-    sx: a(
-      {
-        ".MuiInputBase-root": {
-          ...r,
-          marginTop: "35px",
-          "&.MuiInputBase-multiline": {
-            padding: 0
-          },
-          ":not(.Mui-error)::after": {
-            borderColor: "var(--color-rijks-skyblue)"
+import { jsx as i } from "react/jsx-runtime";
+import { TextField as s, inputLabelClasses as n, formHelperTextClasses as o, inputBaseClasses as e } from "@mui/material";
+import { m as d } from "../../../chunks/index.DJYQ_-zP.js";
+import { memo as p } from "react";
+import { FontNormalSxProps as t } from "../../../_constants.js";
+const u = p(({ optional: a, ...r }) => {
+  var l;
+  return /* @__PURE__ */ i(
+    s,
+    {
+      ...r,
+      required: !a,
+      slotProps: {
+        inputLabel: { shrink: !1, ...(l = r.slotProps) == null ? void 0 : l.inputLabel }
+      },
+      sx: d(
+        {
+          [`.${e.root}`]: {
+            ...t,
+            marginTop: "35px",
+            [`&.${e.multiline}`]: {
+              padding: 0
+            },
+            [`:not(.${o.error})::after`]: {
+              borderColor: "var(--color-rijks-skyblue)"
+            },
+            [`.${e.input}`]: {
+              padding: "17px 12px 16px",
+              ":disabled": {
+                backgroundColor: "var(--color-disabled)",
+                borderColor: "var(--color-disabled)"
+              }
+            }
           },
-          ".MuiInputBase-input": {
-            padding: "17px 12px 16px",
+          [`.${n.root}`]: {
+            ...t,
+            marginLeft: "-14px",
+            marginTop: "-10px",
             ":disabled": {
-              backgroundColor: "var(--color-disabled)",
-              borderColor: "var(--color-disabled)"
+              color: "var(--color-text-disabled)"
+            },
+            [`:focus:not(.${o.error})`]: {
+              color: "var(--color-rijks-skyblue)"
+            },
+            [`:not(.${o.required})::after`]: {
+              content: '"(optioneel)"',
+              marginLeft: "5px",
+              fontSize: "calc(var(--font-size-text) * 0.75)"
+            },
+            [`&.${o.error}`]: {
+              ...t,
+              fontWeight: "bold"
+            },
+            [`&.${o.disabled}`]: {
+              color: "var(--color-text-disabled)"
             }
           }
         },
-        ".MuiInputLabel-root": {
-          ...r,
-          marginLeft: "-14px",
-          marginTop: "-10px",
-          ":disabled": {
-            color: "var(--color-text-disabled)"
-          },
-          ":focus:not(.Mui-error)": {
-            color: "var(--color-rijks-skyblue)"
-          },
-          ":not(.Mui-required)::after": {
-            content: '"(optioneel)"',
-            marginLeft: "5px",
-            fontSize: "calc(var(--font-size-text) * 0.75)"
-          },
-          "&.Mui-error": {
-            ...r,
-            fontWeight: "bold"
-          },
-          "&.Mui-disabled": {
-            color: "var(--color-text-disabled)"
-          }
-        }
-      },
-      o.sx
-    ),
-    variant: "outlined"
-  }
-));
+        r.sx
+      ),
+      variant: "outlined"
+    }
+  );
+});
 export {
-  m as AoaInput
+  u as AoaInput
 };
 //# sourceMappingURL=Input.js.map

package/dist/components/atoms/input/Input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.js","sources":["../../../../src/components/atoms/input/Input.tsx"],"sourcesContent":["import { TextField, type TextFieldProps } from \"@mui/material\";\nimport merge from \"lodash.merge\";\nimport { memo, type ReactNode } from \"react\";\nimport { FontNormalSxProps } from \"../../../_constants\";\n\nexport interface AoaInputProps extends Omit<TextFieldProps, \"variant\"> {\n /*\n Data-qa tag for E2E test purposes\n /\n readonly \"data-qa\"?: string;\n /\n Whether this input field is optional\n /\n readonly optional?: boolean;\n}\n\n/\n Constructs an input field using pre-defined Rijks styling\n \n @param props - Props to pass to the input field\n * @example\n * ```jsx\n * <AoaInput label=\"User name\" value={value} onChange={() => handleOnChange} />\n * ```\n /\nexport const AoaInput = memo(({ optional, ...props }: AoaInputProps): ReactNode => {\n return (\n <TextField\n {...props}\n ~~InputLabelProps~~={{ shrink: false, ...props.~~InputLabelProps~~ }}\n ~~required={!optional~~}\n sx={merge(\n {\n \".~~MuiInputBase-~~root\": {\n ...FontNormalSxProps,\n marginTop: \"35px\",\n\n ~~\"&.MuiInputBase-~~multiline\": {\n padding: 0\n },\n\n ~~\":~~not(.~~Mui-~~error)::after\": {\n borderColor: \"var(--color-rijks-skyblue)\"\n },\n\n \".~~MuiInputBase-~~input\": {\n padding: \"17px 12px 16px\",\n\n \":disabled\": {\n backgroundColor: \"var(--color-disabled)\",\n borderColor: \"var(--color-disabled)\"\n }\n }\n },\n\n \".~~MuiInputLabel-~~root\": {\n ...FontNormalSxProps,\n marginLeft: \"-14px\",\n marginTop: \"-10px\",\n\n \":disabled\": {\n color: \"var(--color-text-disabled)\"\n },\n\n ~~\":~~focus:not(.~~Mui-~~error)\": {\n color: \"var(--color-rijks-skyblue)\"\n },\n\n ~~\":~~not(.~~Mui-~~required)::after\": {\n content: '\"(optioneel)\"',\n marginLeft: \"5px\",\n fontSize: \"calc(var(--font-size-text) 0.75)\"\n },\n\n ~~\"&.Mui-~~error\": {\n ...FontNormalSxProps,\n fontWeight: \"bold\"\n },\n\n ~~\"&.Mui-~~disabled\": {\n color: \"var(--color-text-disabled)\"\n }\n }\n },\n props.sx\n )}\n variant~~=\"~~outlined\"\n />\n );\n});\n"],"names":["AoaInput","memo","optional","props","jsx","TextField","merge","FontNormalSxProps"],"mappings":";;;;;~~AAyBO~~,MAAMA,IAAWC,EAAK,CAAC,EAAE,UAAAC,GAAU,GAAGC,~~QAEzC~~,gBAAAC;AAAA,~~EAACC~~;AAAA,~~EAAA~~;AAAA,~~IACE~~,GAAGF;AAAA,~~IACJ~~,~~iBAAiB~~,EAAE,QAAQ,IAAO,~~GAAGA~~,EAAM,~~gBAAgB;AAAA~~,~~IAC3D~~,~~UAAU~~,~~CAACD~~;AAAA,~~IACX~~,~~IAAII~~;AAAA,~~MACF~~;AAAA,~~QACE~~,~~sBAAsB~~;AAAA,~~UACpB~~,GAAGC;AAAA,~~UACH~~,WAAW;AAAA,~~UAEX~~,~~4BAA4B~~;AAAA,~~YAC1B~~,SAAS;AAAA,~~UACX~~;AAAA,~~UAEA~~,~~2BAA2B~~;AAAA,~~YACzB~~,aAAa;AAAA,~~UACf~~;AAAA,~~UAEA~~,~~uBAAuB~~;AAAA,~~YACrB~~,SAAS;AAAA,~~YAET~~,aAAa;AAAA,~~cACX~~,iBAAiB;AAAA,~~cACjB~~,aAAa;AAAA,~~YAAA~~;AAAA,~~UACf~~;AAAA,~~QAEJ~~;AAAA,~~QAEA~~,~~uBAAuB~~;AAAA,~~UACrB~~,~~GAAGA~~;AAAA,~~UACH~~,YAAY;AAAA,~~UACZ~~,WAAW;AAAA,~~UAEX~~,aAAa;AAAA,~~YACX~~,OAAO;AAAA,~~UACT~~;AAAA,~~UAEA~~,~~0BAA0B~~;AAAA,~~YACxB~~,OAAO;AAAA,~~UACT~~;AAAA,~~UAEA~~,~~8BAA8B~~;AAAA,~~YAC5B~~,SAAS;AAAA,~~YACT~~,YAAY;AAAA,~~YACZ~~,UAAU;AAAA,~~UACZ~~;AAAA,~~UAEA~~,~~eAAe~~;AAAA,~~YACb~~,~~GAAGA~~;AAAA,~~YACH~~,YAAY;AAAA,~~UACd~~;AAAA,~~UAEA~~,~~kBAAkB~~;AAAA,~~YAChB~~,OAAO;AAAA,~~UAAA~~;AAAA,~~QACT~~;AAAA,~~MAEJ~~;AAAA,~~MACAJ~~,EAAM;AAAA,~~IACR~~;AAAA,~~IACA~~,SAAQ;AAAA,~~EAAA~~;~~AACV~~,~~CAEH~~;"}
1	+ {"version":3,"file":"Input.js","sources":["../../../../src/components/atoms/input/Input.tsx"],"sourcesContent":["import {\n TextField,\n type TextFieldProps,\n inputBaseClasses,\n inputLabelClasses,\n formHelperTextClasses\n} from '@mui/material';\nimport merge from 'lodash.merge';\nimport { memo, type ReactNode } from 'react';\nimport { FontNormalSxProps } from '../../../_constants';\n\nexport interface AoaInputProps extends Omit<TextFieldProps, 'variant'> {\n /*\n Data-qa tag for E2E test purposes\n /\n readonly 'data-qa'?: string;\n /\n Whether this input field is optional\n /\n readonly optional?: boolean;\n}\n\n/\n Constructs an input field using pre-defined Rijks styling\n \n @param props - Props to pass to the input field\n * @example\n * ```jsx\n * <AoaInput label=\"User name\" value={value} onChange={() => handleOnChange} />\n * ```\n /\nexport const AoaInput = memo(({ optional, ...props }: AoaInputProps): ReactNode => {\n return (\n <TextField\n {...props}\n required={!optional}\n slotProps={{\n inputLabel: { shrink: false, ...props.slotProps?.inputLabel }\n }}\n sx={merge(\n {\n [`.${inputBaseClasses.root}`]: {\n ...FontNormalSxProps,\n marginTop: '35px',\n\n [`&.${inputBaseClasses.multiline}`]: {\n padding: 0\n },\n\n [`:not(.${formHelperTextClasses.error})::after`]: {\n borderColor: 'var(--color-rijks-skyblue)'\n },\n\n [`.${inputBaseClasses.input}`]: {\n padding: '17px 12px 16px',\n\n ':disabled': {\n backgroundColor: 'var(--color-disabled)',\n borderColor: 'var(--color-disabled)'\n }\n }\n },\n\n [`.${inputLabelClasses.root}`]: {\n ...FontNormalSxProps,\n marginLeft: '-14px',\n marginTop: '-10px',\n\n ':disabled': {\n color: 'var(--color-text-disabled)'\n },\n\n [`:focus:not(.${formHelperTextClasses.error})`]: {\n color: 'var(--color-rijks-skyblue)'\n },\n\n [`:not(.${formHelperTextClasses.required})::after`]: {\n content: '\"(optioneel)\"',\n marginLeft: '5px',\n fontSize: 'calc(var(--font-size-text) 0.75)'\n },\n\n [`&.${formHelperTextClasses.error}`]: {\n ...FontNormalSxProps,\n fontWeight: 'bold'\n },\n\n [`&.${formHelperTextClasses.disabled}`]: {\n color: 'var(--color-text-disabled)'\n }\n }\n },\n props.sx\n )}\n variant='outlined'\n />\n );\n});\n"],"names":["AoaInput","memo","optional","props","jsx","TextField","_a","merge","inputBaseClasses","FontNormalSxProps","formHelperTextClasses","inputLabelClasses"],"mappings":";;;;;AA+BO,MAAMA,IAAWC,EAAK,CAAC,EAAE,UAAAC,GAAU,GAAGC,QAAsC;;AAE/E,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,UAAU,CAACD;AAAA,MACX,WAAW;AAAA,QACT,YAAY,EAAE,QAAQ,IAAO,IAAGI,IAAAH,EAAM,cAAN,gBAAAG,EAAiB,WAAW;AAAA,MAC9D;AAAA,MACA,IAAIC;AAAA,QACF;AAAA,UACE,CAAC,IAAIC,EAAiB,IAAI,EAAE,GAAG;AAAA,YAC7B,GAAGC;AAAA,YACH,WAAW;AAAA,YAEX,CAAC,KAAKD,EAAiB,SAAS,EAAE,GAAG;AAAA,cACnC,SAAS;AAAA,YACX;AAAA,YAEA,CAAC,SAASE,EAAsB,KAAK,UAAU,GAAG;AAAA,cAChD,aAAa;AAAA,YACf;AAAA,YAEA,CAAC,IAAIF,EAAiB,KAAK,EAAE,GAAG;AAAA,cAC9B,SAAS;AAAA,cAET,aAAa;AAAA,gBACX,iBAAiB;AAAA,gBACjB,aAAa;AAAA,cAAA;AAAA,YACf;AAAA,UAEJ;AAAA,UAEA,CAAC,IAAIG,EAAkB,IAAI,EAAE,GAAG;AAAA,YAC9B,GAAGF;AAAA,YACH,YAAY;AAAA,YACZ,WAAW;AAAA,YAEX,aAAa;AAAA,cACX,OAAO;AAAA,YACT;AAAA,YAEA,CAAC,eAAeC,EAAsB,KAAK,GAAG,GAAG;AAAA,cAC/C,OAAO;AAAA,YACT;AAAA,YAEA,CAAC,SAASA,EAAsB,QAAQ,UAAU,GAAG;AAAA,cACnD,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,UAAU;AAAA,YACZ;AAAA,YAEA,CAAC,KAAKA,EAAsB,KAAK,EAAE,GAAG;AAAA,cACpC,GAAGD;AAAA,cACH,YAAY;AAAA,YACd;AAAA,YAEA,CAAC,KAAKC,EAAsB,QAAQ,EAAE,GAAG;AAAA,cACvC,OAAO;AAAA,YAAA;AAAA,UACT;AAAA,QAEJ;AAAA,QACAP,EAAM;AAAA,MACR;AAAA,MACA,SAAQ;AAAA,IAAA;AAAA,EACV;AAEJ,CAAC;"}

package/dist/components/atoms/logo/Logo.d.ts CHANGED Viewed

@@ -1,10 +1,10 @@
 import { BoxProps, SxProps } from '@mui/material';
 import { ElementType, ReactNode } from 'react';
-export interface AoaLogoProps extends BoxProps<ElementType<any, "svg">> {
+export interface AoaLogoProps extends BoxProps<ElementType<any, 'svg'>> {
     /**
      * Data-qa tag to apply to the search bar and input element
      */
-    readonly "data-qa"?: string;
+    readonly 'data-qa'?: string;
     /**
      * Any additional CSSProperties to pass to the component
      */