@uva-glass/component-library 1.12.0 → 1.14.0

package/dist/assets/InputField.css

@@ -1 +1 @@
-.form{width:20%}.form-field{display:flex;flex-direction:column;gap:.5rem 1rem}
+._input-field_16tae_1{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:1px solid;border-radius:.5rem;color:var(--color-black);font-family:inherit;font-size:inherit;height:2.75rem;margin:0;padding:0 .5rem;text-align:inherit}._input-field--large_16tae_15{height:3rem}._input-field_16tae_1:disabled{color:var(--color-scarpa-flow)}

package/dist/assets/InputField2.css

@@ -1 +1 @@
-._input-field_16tae_1{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:1px solid;border-radius:.5rem;color:var(--color-black);font-family:inherit;font-size:inherit;height:2.75rem;margin:0;padding:0 .5rem;text-align:inherit}._input-field--large_16tae_15{height:3rem}._input-field_16tae_1:disabled{color:var(--color-scarpa-flow)}
+.form{width:20%}.form-field{display:flex;flex-direction:column;gap:.5rem 1rem}

package/dist/assets/OverlayCloseButton.css

@@ -0,0 +1 @@
+.btn-container{height:100px;position:relative;width:100px}

package/dist/assets/OverlayCloseButton2.css

@@ -0,0 +1 @@
+._overlay-close-button_1uqum_1{align-items:center;background-color:transparent;border:1px solid transparent;border-radius:.25rem;color:var(--color-black);display:inline-flex;height:1.5rem;justify-content:center;position:absolute;right:.125rem;top:.125rem;transition:var(--transition-colors);width:1.5rem}._overlay-close-button_1uqum_1:focus-visible{outline:.125rem dotted var(--color-cobalt);outline-offset:.125rem}._overlay-close-button_1uqum_1:hover{background-color:var(--color-lavender);cursor:pointer;outline:0}._overlay-close-button_1uqum_1:after{bottom:-.625rem;content:" ";left:-.625rem;position:absolute;right:-.625rem;top:-.625rem}@media (min-width: 28rem) and (min-height: 28rem){._overlay-close-button--padded_1uqum_39{right:1rem;top:1rem}}

package/dist/components/{InputField/components → FieldHint}/FieldHint.d.ts

@@ -1,7 +1,6 @@
-interface Props {
+export interface FieldHintProps {
     value?: string;
     spinnerAriaValueText: string;
     loading?: boolean;
 }
-export declare function FieldHint({ value, spinnerAriaValueText, loading }: Props): import("react/jsx-runtime").JSX.Element;
-export {};
+export declare function FieldHint({ value, spinnerAriaValueText, loading }: FieldHintProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/{InputField/components → FieldHint}/FieldHint.js

@@ -1,6 +1,6 @@
 import { jsxs as r, jsx as n, Fragment as s } from "react/jsx-runtime";
-import { Spinner as f } from "../../Spinner/Spinner.js";
-import '../../../assets/FieldHint.css';const l = {
+import { Spinner as f } from "../Spinner/Spinner.js";
+import '../../assets/FieldHint.css';const l = {
   "field-hint": "_field-hint_f5ej1_1"
 };
 function m({ value: i, spinnerAriaValueText: e, loading: t }) {

package/dist/components/FieldHint/FieldHint.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldHint.js","sources":["../../../src/components/FieldHint/FieldHint.tsx"],"sourcesContent":["import styles from './FieldHint.module.css';\n\nimport { Spinner } from 'components/Spinner/Spinner';\n\nexport interface FieldHintProps {\n  value?: string;\n  spinnerAriaValueText: string;\n  loading?: boolean;\n}\n\nexport function FieldHint({ value, spinnerAriaValueText, loading }: FieldHintProps) {\n  return (\n    <span className={styles['field-hint']}>\n      {value && <>{value}</>}\n      {!value && loading && <Spinner ariaValueText={spinnerAriaValueText} />}\n    </span>\n  );\n}\n"],"names":["FieldHint","value","spinnerAriaValueText","loading","jsxs","styles","jsx","Spinner"],"mappings":";;;;;AAUO,SAASA,EAAU,EAAE,OAAAC,GAAO,sBAAAC,GAAsB,SAAAC,KAA2B;AAClF,SACG,gBAAAC,EAAA,QAAA,EAAK,WAAWC,EAAO,YAAY,GACjC,UAAA;AAAA,IAAAJ,4BAAY,UAAMA,EAAA,CAAA;AAAA,IAClB,CAACA,KAASE,KAAY,gBAAAG,EAAAC,GAAA,EAAQ,eAAeL,GAAsB;AAAA,EACtE,EAAA,CAAA;AAEJ;"}

package/dist/components/FieldHint/FieldHint.stories.d.ts

@@ -0,0 +1,6 @@
+import { FieldHintProps } from './FieldHint';
+
+declare const _default: import('@storybook/types').ComponentAnnotations<import('@storybook/react').ReactRenderer, FieldHintProps>;
+export default _default;
+export declare const FieldHintExample: import('@storybook/types').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, FieldHintProps>;
+export declare const LoadingFieldHint: import('@storybook/types').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, FieldHintProps>;

package/dist/components/FieldHint/FieldHint.stories.js

@@ -0,0 +1,33 @@
+import { jsx as l } from "react/jsx-runtime";
+import { FieldHint as t } from "./FieldHint.js";
+const d = {
+  title: "Atoms/FieldHint",
+  component: t,
+  argTypes: {
+    value: {
+      control: "text"
+    },
+    spinnerAriaValueText: {
+      control: "text"
+    }
+  }
+}, e = (n) => /* @__PURE__ */ l(t, { ...n }), i = {
+  spinnerAriaValueText: "FieldHint Loading"
+}, o = e.bind({});
+o.args = {
+  value: "This is a FieldHint",
+  loading: !1,
+  ...i
+};
+const a = e.bind({});
+a.args = {
+  value: "",
+  loading: !0,
+  ...i
+};
+export {
+  o as FieldHintExample,
+  a as LoadingFieldHint,
+  d as default
+};
+//# sourceMappingURL=FieldHint.stories.js.map

package/dist/components/FieldHint/FieldHint.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldHint.stories.js","sources":["../../../src/components/FieldHint/FieldHint.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { FieldHintProps } from './FieldHint';\n\nimport { FieldHint } from './FieldHint';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n  title: 'Atoms/FieldHint',\n  component: FieldHint,\n  argTypes: {\n    value: {\n      control: 'text',\n    },\n    spinnerAriaValueText: {\n      control: 'text',\n    },\n  },\n} as Meta<FieldHintProps>;\n\nconst Template: StoryFn<FieldHintProps> = (args) => <FieldHint {...args} />;\n\nconst defaultArgs: Partial<FieldHintProps> = {\n  spinnerAriaValueText: 'FieldHint Loading',\n};\n\nexport const FieldHintExample = Template.bind({});\nFieldHintExample.args = {\n  value: 'This is a FieldHint',\n  loading: false,\n  ...defaultArgs,\n};\n\nexport const LoadingFieldHint = Template.bind({});\nLoadingFieldHint.args = {\n  value: '',\n  loading: true,\n  ...defaultArgs,\n};\n"],"names":["FieldHint_stories","FieldHint","Template","args","jsx","defaultArgs","FieldHintExample","LoadingFieldHint"],"mappings":";;AAMA,MAAeA,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,OAAO;AAAA,MACL,SAAS;AAAA,IACX;AAAA,IACA,sBAAsB;AAAA,MACpB,SAAS;AAAA,IACX;AAAA,EACF;AACF,GAEMC,IAAoC,CAACC,MAAU,gBAAAC,EAAAH,GAAA,EAAW,GAAGE,EAAM,CAAA,GAEnEE,IAAuC;AAAA,EAC3C,sBAAsB;AACxB,GAEaC,IAAmBJ,EAAS,KAAK,EAAE;AAChDI,EAAiB,OAAO;AAAA,EACtB,OAAO;AAAA,EACP,SAAS;AAAA,EACT,GAAGD;AACL;AAEO,MAAME,IAAmBL,EAAS,KAAK,EAAE;AAChDK,EAAiB,OAAO;AAAA,EACtB,OAAO;AAAA,EACP,SAAS;AAAA,EACT,GAAGF;AACL;"}

package/dist/components/InputField/InputField.d.ts

@@ -2,11 +2,7 @@ import { InputHTMLAttributes } from 'react';
 
 export interface InputFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'style'> {
     variant?: 'large';
-    hint?: string;
-    spinnerAriaValueText: string;
-    isHintLoading?: boolean;
     type?: 'text' | 'search' | 'password' | 'email';
-    autoComplete?: 'off';
     id: string;
 }
 export declare const InputField: import('react').ForwardRefExoticComponent<InputFieldProps & import('react').RefAttributes<HTMLInputElement>>;

package/dist/components/InputField/InputField.js

@@ -1,29 +1,25 @@
-import { jsxs as m, Fragment as s, jsx as r } from "react/jsx-runtime";
-import { forwardRef as u } from "react";
-import { c } from "../../clsx-DB4S2d7J.js";
-import { FieldHint as _ } from "./components/FieldHint.js";
-import '../../assets/InputField2.css';const i = {
+import { jsx as n } from "react/jsx-runtime";
+import { forwardRef as o } from "react";
+import { c as a } from "../../clsx-DB4S2d7J.js";
+import '../../assets/InputField.css';const e = {
   "input-field": "_input-field_16tae_1",
   "input-field--large": "_input-field--large_16tae_15"
-}, v = u(
-  ({ autoComplete: l = "off", id: f, variant: o, hint: e, isHintLoading: t, spinnerAriaValueText: p, type: a = "text", ...n }, d) => /* @__PURE__ */ m(s, { children: [
-    /* @__PURE__ */ r(
-      "input",
-      {
-        ...n,
-        autoComplete: l,
-        ref: d,
-        id: f,
-        className: c(i["input-field"], {
-          [i["input-field--large"]]: o === "large"
-        }),
-        type: a
-      }
-    ),
-    (e || t) && /* @__PURE__ */ r(_, { loading: t, spinnerAriaValueText: p, value: e })
-  ] })
+}, m = o(
+  ({ autoComplete: t = "off", id: i, variant: r, type: f = "text", ...l }, p) => /* @__PURE__ */ n(
+    "input",
+    {
+      ...l,
+      autoComplete: t,
+      ref: p,
+      id: i,
+      className: a(e["input-field"], {
+        [e["input-field--large"]]: r === "large"
+      }),
+      type: f
+    }
+  )
 );
 export {
-  v as InputField
+  m as InputField
 };
 //# sourceMappingURL=InputField.js.map

package/dist/components/InputField/InputField.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputField.js","sources":["../../../src/components/InputField/InputField.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport { clsx } from 'clsx';\n\nimport type { InputHTMLAttributes } from 'react';\n\nimport styles from './InputField.module.css';\nimport { FieldHint } from './components/FieldHint';\n\nexport interface InputFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'style'> {\n  variant?: 'large';\n  hint?: string;\n  spinnerAriaValueText: string;\n  isHintLoading?: boolean;\n  type?: 'text' | 'search' | 'password' | 'email';\n  autoComplete?: 'off'\n  id: string;\n}\n\nexport const InputField = forwardRef<HTMLInputElement, InputFieldProps>(\n  (\n    { autoComplete = 'off', id, variant, hint, isHintLoading, spinnerAriaValueText, type = 'text', ...restProps }: InputFieldProps,\n    forwardedRef\n  ) => {\n    return (\n      <>\n        <input\n          {...restProps}\n          autoComplete={autoComplete}\n          ref={forwardedRef}\n          id={id}\n          className={clsx(styles['input-field'], {\n            [styles['input-field--large']]: variant === 'large',\n          })}\n          type={type}\n        />\n        {(hint || isHintLoading) && <FieldHint loading={isHintLoading} spinnerAriaValueText={spinnerAriaValueText} value={hint} />}\n      </>\n    );\n  }\n);\n"],"names":["InputField","forwardRef","autoComplete","id","variant","hint","isHintLoading","spinnerAriaValueText","type","restProps","forwardedRef","jsxs","Fragment","jsx","clsx","styles","FieldHint"],"mappings":";;;;;;;GAkBaA,IAAaC;AAAA,EACxB,CACE,EAAE,cAAAC,IAAe,OAAO,IAAAC,GAAI,SAAAC,GAAS,MAAAC,GAAM,eAAAC,GAAe,sBAAAC,GAAsB,MAAAC,IAAO,QAAQ,GAAGC,EAAA,GAClGC,MAII,gBAAAC,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAGJ;AAAA,QACJ,cAAAP;AAAA,QACA,KAAKQ;AAAA,QACL,IAAAP;AAAA,QACA,WAAWW,EAAKC,EAAO,aAAa,GAAG;AAAA,UACrC,CAACA,EAAO,oBAAoB,CAAC,GAAGX,MAAY;AAAA,QAAA,CAC7C;AAAA,QACD,MAAAI;AAAA,MAAA;AAAA,IACF;AAAA,KACEH,KAAQC,MAAmB,gBAAAO,EAAAG,GAAA,EAAU,SAASV,GAAe,sBAAAC,GAA4C,OAAOF,GAAM;AAAA,EAC1H,EAAA,CAAA;AAGN;"}
+{"version":3,"file":"InputField.js","sources":["../../../src/components/InputField/InputField.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport { clsx } from 'clsx';\n\nimport type { InputHTMLAttributes } from 'react';\n\nimport styles from './InputField.module.css';\n\nexport interface InputFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'style'> {\n  variant?: 'large';\n  type?: 'text' | 'search' | 'password' | 'email';\n  id: string;\n}\n\nexport const InputField = forwardRef<HTMLInputElement, InputFieldProps>(\n  ({ autoComplete = 'off', id, variant, type = 'text', ...restProps }: InputFieldProps, forwardedRef) => {\n    return (\n      <input\n        {...restProps}\n        autoComplete={autoComplete}\n        ref={forwardedRef}\n        id={id}\n        className={clsx(styles['input-field'], {\n          [styles['input-field--large']]: variant === 'large',\n        })}\n        type={type}\n      />\n    );\n  }\n);\n"],"names":["InputField","forwardRef","autoComplete","id","variant","type","restProps","forwardedRef","jsx","clsx","styles"],"mappings":";;;;;;GAaaA,IAAaC;AAAA,EACxB,CAAC,EAAE,cAAAC,IAAe,OAAO,IAAAC,GAAI,SAAAC,GAAS,MAAAC,IAAO,QAAQ,GAAGC,EAAU,GAAoBC,MAElF,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,cAAAJ;AAAA,MACA,KAAKK;AAAA,MACL,IAAAJ;AAAA,MACA,WAAWM,EAAKC,EAAO,aAAa,GAAG;AAAA,QACrC,CAACA,EAAO,oBAAoB,CAAC,GAAGN,MAAY;AAAA,MAAA,CAC7C;AAAA,MACD,MAAAC;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/dist/components/InputField/InputField.stories.d.ts

@@ -3,5 +3,3 @@ import { InputFieldProps } from './InputField';
 declare const _default: import('@storybook/types').ComponentAnnotations<import('@storybook/react').ReactRenderer, InputFieldProps>;
 export default _default;
 export declare const InputFieldExample: import('@storybook/types').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, InputFieldProps>;
-export declare const WithHint: import('@storybook/types').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, InputFieldProps>;
-export declare const WithLoadingHint: import('@storybook/types').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, InputFieldProps>;

package/dist/components/InputField/InputField.stories.js

@@ -1,28 +1,16 @@
-import { jsx as o } from "react/jsx-runtime";
-import { InputField as e } from "./InputField.js";
-import '../../assets/InputField.css';const r = (t) => {
-  const a = t.variant ?? [];
-  return { ...t, variant: a.toString() };
-}, m = {
+import { jsx as e } from "react/jsx-runtime";
+import { InputField as o } from "./InputField.js";
+import '../../assets/InputField2.css';const a = (t) => {
+  const r = t.variant ?? [];
+  return { ...t, variant: r.toString() };
+}, d = {
   title: "Atoms/InputField",
-  component: e,
+  component: o,
   argTypes: {
     variant: {
       options: ["large"],
       control: "check"
     },
-    hint: {
-      control: "text"
-    },
-    spinnerAriaValueText: {
-      control: "text"
-    },
-    isHintLoading: {
-      control: Boolean,
-      table: {
-        disable: !0
-      }
-    },
     type: {
       control: "radio",
       options: ["text", "search", "password", "email"]
@@ -31,35 +19,19 @@ import '../../assets/InputField.css';const r = (t) => {
       control: "text"
     },
     autoComplete: {
-      control: "radio",
-      options: ["off"]
+      table: {
+        disable: !0
+      }
     }
   }
-}, n = (t) => /* @__PURE__ */ o("div", { className: "form", children: /* @__PURE__ */ o("div", { className: "form-field", children: /* @__PURE__ */ o(e, { ...r(t) }) }) }), i = {
+}, i = (t) => /* @__PURE__ */ e("div", { className: "form", children: /* @__PURE__ */ e("div", { className: "form-field", children: /* @__PURE__ */ e(o, { ...a(t) }) }) }), n = i.bind({});
+n.args = {
   type: "text",
   variant: void 0,
-  hint: void 0,
-  spinnerAriaValueText: "Loading",
-  autoComplete: "off",
   id: "4f9ca77d"
-}, s = n.bind({});
-s.args = {
-  ...i
-};
-const l = n.bind({});
-l.args = {
-  ...i,
-  hint: "Example hint"
-};
-const d = n.bind({});
-d.args = {
-  ...i,
-  isHintLoading: !0
 };
 export {
-  s as InputFieldExample,
-  l as WithHint,
-  d as WithLoadingHint,
-  m as default
+  n as InputFieldExample,
+  d as default
 };
 //# sourceMappingURL=InputField.stories.js.map

package/dist/components/InputField/InputField.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputField.stories.js","sources":["../../../src/components/InputField/InputField.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { InputFieldProps } from './InputField';\n\nimport './InputField.stories.css';\n\nimport { InputField } from './InputField';\n\nconst transformArgs = (args: InputFieldProps) => {\n  // args.variant is provided as an array because the control type is set to a checkbox. So this transforms the selected value into its proper value: a string\n  const variantArray = (args.variant as unknown as string[]) ?? [];\n  return { ...args, ...{ variant: variantArray.toString() } } as InputFieldProps;\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n  title: 'Atoms/InputField',\n  component: InputField,\n  argTypes: {\n    variant: {\n      options: ['large'],\n      control: 'check',\n    },\n    hint: {\n      control: 'text',\n    },\n    spinnerAriaValueText: {\n      control: 'text',\n    },\n    isHintLoading: {\n      control: Boolean,\n      table: {\n        disable: true,\n      },\n    },\n    type: {\n      control: 'radio',\n      options: ['text', 'search', 'password', 'email'],\n    },\n    id: {\n      control: 'text',\n    },\n    autoComplete: {\n      control: 'radio',\n      options: ['off'],\n    },\n  },\n} as Meta<InputFieldProps>;\n\nconst Template: StoryFn<InputFieldProps> = (args) => (\n  <div className=\"form\">\n    <div className=\"form-field\">\n      <InputField {...transformArgs(args)} />\n    </div>\n  </div>\n);\n\nconst defaultArgs: Partial<InputFieldProps> = {\n  type: 'text',\n  variant: undefined,\n  hint: undefined,\n  spinnerAriaValueText: 'Loading',\n  autoComplete: 'off',\n  id: '4f9ca77d',\n};\n\nexport const InputFieldExample = Template.bind({});\nInputFieldExample.args = {\n  ...defaultArgs,\n};\n\nexport const WithHint = Template.bind({});\nWithHint.args = {\n  ...defaultArgs,\n  hint: 'Example hint',\n};\n\nexport const WithLoadingHint = Template.bind({});\nWithLoadingHint.args = {\n  ...defaultArgs,\n  isHintLoading: true\n};\n"],"names":["transformArgs","args","variantArray","InputField_stories","InputField","Template","jsx","defaultArgs","InputFieldExample","WithHint","WithLoadingHint"],"mappings":";;AAOA,MAAMA,IAAgB,CAACC,MAA0B;AAEzC,QAAAC,IAAgBD,EAAK,WAAmC;AACvD,SAAA,EAAE,GAAGA,GAAW,SAASC,EAAa,SAAS;AACxD,GAGeC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS,CAAC,OAAO;AAAA,MACjB,SAAS;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,IACX;AAAA,IACA,sBAAsB;AAAA,MACpB,SAAS;AAAA,IACX;AAAA,IACA,eAAe;AAAA,MACb,SAAS;AAAA,MACT,OAAO;AAAA,QACL,SAAS;AAAA,MACX;AAAA,IACF;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,SAAS,CAAC,QAAQ,UAAU,YAAY,OAAO;AAAA,IACjD;AAAA,IACA,IAAI;AAAA,MACF,SAAS;AAAA,IACX;AAAA,IACA,cAAc;AAAA,MACZ,SAAS;AAAA,MACT,SAAS,CAAC,KAAK;AAAA,IACjB;AAAA,EACF;AACF,GAEMC,IAAqC,CAACJ,wBACzC,OAAI,EAAA,WAAU,QACb,UAAC,gBAAAK,EAAA,OAAA,EAAI,WAAU,cACb,4BAACF,GAAY,EAAA,GAAGJ,EAAcC,CAAI,EAAG,CAAA,GACvC,EACF,CAAA,GAGIM,IAAwC;AAAA,EAC5C,MAAM;AAAA,EACN,SAAS;AAAA,EACT,MAAM;AAAA,EACN,sBAAsB;AAAA,EACtB,cAAc;AAAA,EACd,IAAI;AACN,GAEaC,IAAoBH,EAAS,KAAK,EAAE;AACjDG,EAAkB,OAAO;AAAA,EACvB,GAAGD;AACL;AAEO,MAAME,IAAWJ,EAAS,KAAK,EAAE;AACxCI,EAAS,OAAO;AAAA,EACd,GAAGF;AAAA,EACH,MAAM;AACR;AAEO,MAAMG,IAAkBL,EAAS,KAAK,EAAE;AAC/CK,EAAgB,OAAO;AAAA,EACrB,GAAGH;AAAA,EACH,eAAe;AACjB;"}
+{"version":3,"file":"InputField.stories.js","sources":["../../../src/components/InputField/InputField.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { InputFieldProps } from './InputField';\n\nimport './InputField.stories.css';\n\nimport { InputField } from './InputField';\n\nconst transformArgs = (args: InputFieldProps) => {\n  // args.variant is provided as an array because the control type is set to a checkbox. So this transforms the selected value into its proper value: a string\n  const variantArray = (args.variant as unknown as string[]) ?? [];\n  return { ...args, ...{ variant: variantArray.toString() } } as InputFieldProps;\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n  title: 'Atoms/InputField',\n  component: InputField,\n  argTypes: {\n    variant: {\n      options: ['large'],\n      control: 'check',\n    },\n    type: {\n      control: 'radio',\n      options: ['text', 'search', 'password', 'email'],\n    },\n    id: {\n      control: 'text',\n    },\n    autoComplete: {\n      table: {\n        disable: true,\n      },\n    },\n  },\n} as Meta<InputFieldProps>;\n\nconst Template: StoryFn<InputFieldProps> = (args) => (\n  <div className=\"form\">\n    <div className=\"form-field\">\n      <InputField {...transformArgs(args)} />\n    </div>\n  </div>\n);\n\nexport const InputFieldExample = Template.bind({});\nInputFieldExample.args = {\n  type: 'text',\n  variant: undefined,\n  id: '4f9ca77d',\n};\n"],"names":["transformArgs","args","variantArray","InputField_stories","InputField","Template","jsx","InputFieldExample"],"mappings":";;AAOA,MAAMA,IAAgB,CAACC,MAA0B;AAEzC,QAAAC,IAAgBD,EAAK,WAAmC;AACvD,SAAA,EAAE,GAAGA,GAAW,SAASC,EAAa,SAAS;AACxD,GAGeC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS,CAAC,OAAO;AAAA,MACjB,SAAS;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,SAAS,CAAC,QAAQ,UAAU,YAAY,OAAO;AAAA,IACjD;AAAA,IACA,IAAI;AAAA,MACF,SAAS;AAAA,IACX;AAAA,IACA,cAAc;AAAA,MACZ,OAAO;AAAA,QACL,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AACF,GAEMC,IAAqC,CAACJ,wBACzC,OAAI,EAAA,WAAU,QACb,UAAC,gBAAAK,EAAA,OAAA,EAAI,WAAU,cACb,4BAACF,GAAY,EAAA,GAAGJ,EAAcC,CAAI,EAAG,CAAA,GACvC,EACF,CAAA,GAGWM,IAAoBF,EAAS,KAAK,EAAE;AACjDE,EAAkB,OAAO;AAAA,EACvB,MAAM;AAAA,EACN,SAAS;AAAA,EACT,IAAI;AACN;"}

package/dist/components/OverlayCloseButton/OverlayCloseButton.d.ts

@@ -0,0 +1,7 @@
+import { ButtonHTMLAttributes } from 'react';
+
+export interface OverlayCloseButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'style'> {
+    'aria-label': string;
+    paddedModal?: boolean;
+}
+export declare const OverlayCloseButton: import('react').ForwardRefExoticComponent<OverlayCloseButtonProps & import('react').RefAttributes<HTMLButtonElement>>;

package/dist/components/OverlayCloseButton/OverlayCloseButton.js

@@ -0,0 +1,25 @@
+import { jsx as o } from "react/jsx-runtime";
+import { c as l } from "../../clsx-DB4S2d7J.js";
+import { forwardRef as a } from "react";
+import { Icon as n } from "../Icon/Icon.js";
+import '../../assets/OverlayCloseButton2.css';const t = {
+  "overlay-close-button": "_overlay-close-button_1uqum_1",
+  "overlay-close-button--padded": "_overlay-close-button--padded_1uqum_39"
+}, p = a(
+  ({ paddedModal: e, ...r }, s) => /* @__PURE__ */ o(
+    "button",
+    {
+      ...r,
+      type: "button",
+      ref: s,
+      className: l(t["overlay-close-button"], {
+        [t["overlay-close-button--padded"]]: e
+      }),
+      children: /* @__PURE__ */ o(n, { name: "Cross", size: 24 })
+    }
+  )
+);
+export {
+  p as OverlayCloseButton
+};
+//# sourceMappingURL=OverlayCloseButton.js.map

package/dist/components/OverlayCloseButton/OverlayCloseButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OverlayCloseButton.js","sources":["../../../src/components/OverlayCloseButton/OverlayCloseButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { forwardRef } from 'react';\n\nimport type { ButtonHTMLAttributes } from 'react';\n\nimport styles from './OverlayCloseButton.module.css';\n\nimport { Icon } from 'components/Icon';\n\nexport interface OverlayCloseButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'style'> {\n  'aria-label': string; // mandatory\n  paddedModal?: boolean;\n}\n\nexport const OverlayCloseButton = forwardRef<HTMLButtonElement, OverlayCloseButtonProps>(\n  ({ paddedModal, ...restProps }, forwardedRef) => (\n    <button\n      {...restProps}\n      type=\"button\"\n      ref={forwardedRef}\n      className={clsx(styles['overlay-close-button'], {\n        [styles['overlay-close-button--padded']]: paddedModal,\n      })}\n    >\n      <Icon name=\"Cross\" size={24} />\n    </button>\n  )\n);\n"],"names":["OverlayCloseButton","forwardRef","paddedModal","restProps","forwardedRef","jsx","clsx","styles","Icon"],"mappings":";;;;;;;GAcaA,IAAqBC;AAAA,EAChC,CAAC,EAAE,aAAAC,GAAa,GAAGC,KAAaC,MAC9B,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,MAAK;AAAA,MACL,KAAKC;AAAA,MACL,WAAWE,EAAKC,EAAO,sBAAsB,GAAG;AAAA,QAC9C,CAACA,EAAO,8BAA8B,CAAC,GAAGL;AAAA,MAAA,CAC3C;AAAA,MAED,UAAC,gBAAAG,EAAAG,GAAA,EAAK,MAAK,SAAQ,MAAM,IAAI;AAAA,IAAA;AAAA,EAC/B;AAEJ;"}

package/dist/components/OverlayCloseButton/OverlayCloseButton.stories.d.ts

@@ -0,0 +1,5 @@
+import { OverlayCloseButtonProps } from './OverlayCloseButton';
+
+declare const _default: import('@storybook/types').ComponentAnnotations<import('@storybook/react').ReactRenderer, OverlayCloseButtonProps>;
+export default _default;
+export declare const OverlayCloseButtonExample: import('@storybook/types').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, OverlayCloseButtonProps>;

package/dist/components/OverlayCloseButton/OverlayCloseButton.stories.js

@@ -0,0 +1,25 @@
+import { jsx as o } from "react/jsx-runtime";
+import { f as a } from "../../index-Ca2Q7D5u.js";
+import { OverlayCloseButton as e } from "./OverlayCloseButton.js";
+import '../../assets/OverlayCloseButton.css';const i = {
+  title: "Atoms/OverlayCloseButton",
+  component: e,
+  argTypes: {
+    paddedModal: {
+      control: "boolean"
+    },
+    "aria-label": {
+      control: "text"
+    }
+  }
+}, l = (t) => /* @__PURE__ */ o("div", { className: "btn-container", children: /* @__PURE__ */ o(e, { ...t }) }), r = l.bind({});
+r.args = {
+  paddedModal: !1,
+  "aria-label": "Close",
+  onClick: a()
+};
+export {
+  r as OverlayCloseButtonExample,
+  i as default
+};
+//# sourceMappingURL=OverlayCloseButton.stories.js.map

package/dist/components/OverlayCloseButton/OverlayCloseButton.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OverlayCloseButton.stories.js","sources":["../../../src/components/OverlayCloseButton/OverlayCloseButton.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { OverlayCloseButtonProps } from './OverlayCloseButton';\n\nimport { OverlayCloseButton } from './OverlayCloseButton';\n\nimport './OverlayCloseButton.stories.css';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n  title: 'Atoms/OverlayCloseButton',\n  component: OverlayCloseButton,\n  argTypes: {\n    paddedModal: {\n      control: 'boolean',\n    },\n    'aria-label': {\n      control: 'text',\n    },\n  },\n} as Meta<OverlayCloseButtonProps>;\n\nconst Template: StoryFn<OverlayCloseButtonProps> = (args) => {\n  return (\n    <div className=\"btn-container\">\n      <OverlayCloseButton {...args} />\n    </div>\n  );\n};\n\nexport const OverlayCloseButtonExample = Template.bind({});\nOverlayCloseButtonExample.args = {\n  paddedModal: false,\n  'aria-label': 'Close',\n  onClick: fn(),\n};\n"],"names":["OverlayCloseButton_stories","OverlayCloseButton","Template","args","jsx","OverlayCloseButtonExample","fn"],"mappings":";;;AAUA,MAAeA,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,aAAa;AAAA,MACX,SAAS;AAAA,IACX;AAAA,IACA,cAAc;AAAA,MACZ,SAAS;AAAA,IACX;AAAA,EACF;AACF,GAEMC,IAA6C,CAACC,MAEhD,gBAAAC,EAAC,SAAI,WAAU,iBACb,4BAACH,GAAoB,EAAA,GAAGE,EAAM,CAAA,EAChC,CAAA,GAISE,IAA4BH,EAAS,KAAK,EAAE;AACzDG,EAA0B,OAAO;AAAA,EAC/B,aAAa;AAAA,EACb,cAAc;AAAA,EACd,SAASC,EAAG;AACd;"}

package/dist/components/OverlayCloseButton/index.d.ts

@@ -0,0 +1 @@
+export * from './OverlayCloseButton';

package/dist/components/OverlayCloseButton/index.js

@@ -0,0 +1,5 @@
+import { OverlayCloseButton as r } from "./OverlayCloseButton.js";
+export {
+  r as OverlayCloseButton
+};
+//# sourceMappingURL=index.js.map

package/dist/components/OverlayCloseButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/index.d.ts

@@ -7,6 +7,7 @@ export * from './InfoMessage';
 export * from './Input';
 export * from './InputField';
 export * from './Label';
+export * from './OverlayCloseButton';
 export * from './RadioButton';
 export * from './SectionNotification';
 export * from './SelectListbox';

package/dist/components/index.js

@@ -3,14 +3,15 @@ import { Button as p } from "./Button/Button.js";
 import { Card as x } from "./Card/Card.js";
 import { Icon as n } from "./Icon/Icon.js";
 import { IconButton as a } from "./IconButton/IconButton.js";
-import { InfoMessage as u } from "./InfoMessage/InfoMessage.js";
-import { Input as l } from "./Input/Input.js";
-import { InputField as I } from "./InputField/InputField.js";
-import { Label as B } from "./Label/Label.js";
+import { InfoMessage as c } from "./InfoMessage/InfoMessage.js";
+import { Input as s } from "./Input/Input.js";
+import { InputField as B } from "./InputField/InputField.js";
+import { Label as d } from "./Label/Label.js";
+import { OverlayCloseButton as v } from "./OverlayCloseButton/OverlayCloseButton.js";
 import { RadioButton as L } from "./RadioButton/RadioButton.js";
-import { SectionNotification as v } from "./SectionNotification/SectionNotification.js";
-import { SelectListbox as C } from "./SelectListbox/SelectListbox.js";
-import { SelectProvider as M, useSelect as N } from "./SelectListbox/SelectProvider.js";
+import { SectionNotification as y } from "./SectionNotification/SectionNotification.js";
+import { SelectListbox as F } from "./SelectListbox/SelectListbox.js";
+import { SelectProvider as N, useSelect as O } from "./SelectListbox/SelectProvider.js";
 import { Spinner as R } from "./Spinner/Spinner.js";
 export {
   t as AppStatusBar,
@@ -18,15 +19,16 @@ export {
   x as Card,
   n as Icon,
   a as IconButton,
-  u as InfoMessage,
-  l as Input,
-  I as InputField,
-  B as Label,
+  c as InfoMessage,
+  s as Input,
+  B as InputField,
+  d as Label,
+  v as OverlayCloseButton,
   L as RadioButton,
-  v as SectionNotification,
-  C as SelectListbox,
-  M as SelectProvider,
+  y as SectionNotification,
+  F as SelectListbox,
+  N as SelectProvider,
   R as Spinner,
-  N as useSelect
+  O as useSelect
 };
 //# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;"}