@gusto/embedded-react-sdk 0.8.0 → 0.8.1

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # Changelog
 
+## 0.8.1
+
+- Replaced Valibot with Zod for bundle size reduction. Also included zod as a dependency
+- Updated package.json to fix an issue with types being unavailable for consumers
+- Misc style corrections and consistency fixes
+- Updated component adapter documentation to include generated props
+- bug: GWS-4966 headers not being set properly for requests when configured in GustoProvider
+- moved APIProvider into `embedded-react-sdk` from `embedded-api` package
+
 ## 0.8.0
 
 - Company Onboarding flow improvements and fixes:

package/dist/components/Common/DataView/DataCards/DataCards.module.scss.js

@@ -1,8 +1,10 @@
-const t = "_columnTitle_1t032_1", l = {
-  columnTitle: t
+const t = "_columnTitle_1djp5_1", l = "_columnData_1djp5_8", o = {
+  columnTitle: t,
+  columnData: l
 };
 export {
+  l as columnData,
   t as columnTitle,
-  l as default
+  o as default
 };
 //# sourceMappingURL=DataCards.module.scss.js.map

package/dist/components/Common/DataView/DataCards/DataCards.module.scss.js.map

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

package/dist/components/Common/FadeIn/FadeIn.module.scss.js

@@ -1,10 +1,10 @@
-const e = "_fade_4tpvm_1", a = "_fadeIn_4tpvm_7", t = {
+const e = "_fade_6tfn1_1", f = "_fadeIn_6tfn1_8", a = {
   fade: e,
-  fadeIn: a
+  fadeIn: f
 };
 export {
-  t as default,
+  a as default,
   e as fade,
-  a as fadeIn
+  f as fadeIn
 };
 //# sourceMappingURL=FadeIn.module.scss.js.map

package/dist/components/Common/{UI/FieldCaption → FieldCaption}/FieldCaption.js

@@ -2,7 +2,7 @@ import { jsxs as c, jsx as l } from "react/jsx-runtime";
 import { useTranslation as p } from "react-i18next";
 import d from "classnames";
 import n from "./FieldCaption.module.scss.js";
-import { VisuallyHidden as f } from "../../VisuallyHidden/VisuallyHidden.js";
+import { VisuallyHidden as f } from "../VisuallyHidden/VisuallyHidden.js";
 const j = ({
   children: e,
   as: o = "label",

package/dist/components/Common/FieldCaption/FieldCaption.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldCaption.js","sources":["../../../../src/components/Common/FieldCaption/FieldCaption.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport { VisuallyHidden } from '../VisuallyHidden'\nimport styles from './FieldCaption.module.scss'\n\nexport interface FieldCaptionProps {\n  children: React.ReactNode\n  as?: 'label' | 'legend'\n  htmlFor?: string\n  isRequired?: boolean\n  isVisuallyHidden?: boolean\n  className?: string\n}\n\nexport const FieldCaption: React.FC<FieldCaptionProps> = ({\n  children,\n  as = 'label',\n  htmlFor,\n  isRequired = false,\n  isVisuallyHidden = false,\n  className,\n}: FieldCaptionProps) => {\n  const { t } = useTranslation('common')\n  const Component = as\n\n  const content = (\n    <Component\n      className={classNames(styles.root, className)}\n      htmlFor={as === 'label' ? htmlFor : undefined}\n    >\n      {children}\n      {!isRequired && <span className={styles.optionalLabel}>{t('optionalLabel')}</span>}\n    </Component>\n  )\n\n  return isVisuallyHidden ? <VisuallyHidden>{content}</VisuallyHidden> : content\n}\n"],"names":["FieldCaption","children","as","htmlFor","isRequired","isVisuallyHidden","className","t","useTranslation","content","jsxs","classNames","styles","jsx","VisuallyHidden"],"mappings":";;;;;AAcO,MAAMA,IAA4C,CAAC;AAAA,EACxD,UAAAC;AAAA,EACA,IAAAC,IAAK;AAAA,EACL,SAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,kBAAAC,IAAmB;AAAA,EACnB,WAAAC;AACF,MAAyB;AACvB,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,QAAQ,GAG/BC,IACJ,gBAAAC;AAAA,IAHgBR;AAAA,IAGf;AAAA,MACC,WAAWS,EAAWC,EAAO,MAAMN,CAAS;AAAA,MAC5C,SAASJ,MAAO,UAAUC,IAAU;AAAA,MAEnC,UAAA;AAAA,QAAAF;AAAA,QACA,CAACG,KAAe,gBAAAS,EAAA,QAAA,EAAK,WAAWD,EAAO,eAAgB,UAAEL,EAAA,eAAe,EAAE,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAC7E;AAGF,SAAOF,IAAmB,gBAAAQ,EAACC,GAAgB,EAAA,UAAAL,EAAQ,CAAA,IAAoBA;AACzE;"}

package/dist/components/Common/{UI/FieldDescription → FieldDescription}/FieldDescription.js

@@ -1,7 +1,7 @@
 import { jsx as t } from "react/jsx-runtime";
 import e from "classnames";
 import p from "./FieldDescription.module.scss.js";
-import { createMarkup as a } from "../../../../helpers/formattedStrings.js";
+import { createMarkup as a } from "../../../helpers/formattedStrings.js";
 const u = ({
   children: o,
   className: s,

package/dist/components/Common/FieldDescription/FieldDescription.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldDescription.js","sources":["../../../../src/components/Common/FieldDescription/FieldDescription.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport styles from './FieldDescription.module.scss'\nimport { createMarkup } from '@/helpers/formattedStrings'\n\ninterface FieldDescriptionProps {\n  children: React.ReactNode\n  className?: string\n  id?: string\n}\n\nexport const FieldDescription: React.FC<FieldDescriptionProps> = ({\n  children,\n  className,\n  id,\n}: FieldDescriptionProps) => {\n  const commonProps = {\n    className: classNames(styles.root, className),\n    id,\n  }\n\n  return (\n    children &&\n    (typeof children === 'string' ? (\n      <div {...commonProps} dangerouslySetInnerHTML={createMarkup(children)} />\n    ) : (\n      <div {...commonProps}>{children}</div>\n    ))\n  )\n}\n"],"names":["FieldDescription","children","className","id","commonProps","classNames","styles","jsx","createMarkup"],"mappings":";;;;AAUO,MAAMA,IAAoD,CAAC;AAAA,EAChE,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,IAAAC;AACF,MAA6B;AAC3B,QAAMC,IAAc;AAAA,IAClB,WAAWC,EAAWC,EAAO,MAAMJ,CAAS;AAAA,IAC5C,IAAAC;AAAA,EACF;AAEA,SACEF,MACC,OAAOA,KAAa,WACnB,gBAAAM,EAAC,SAAK,GAAGH,GAAa,yBAAyBI,EAAaP,CAAQ,EAAG,CAAA,sBAEtE,OAAK,EAAA,GAAGG,GAAc,UAAAH,EAAS,CAAA;AAGtC;"}

package/dist/components/Common/{UI/FieldErrorMessage → FieldErrorMessage}/FieldErrorMessage.js

@@ -1,7 +1,7 @@
 import { jsx as i } from "react/jsx-runtime";
 import p from "classnames";
 import r from "./FieldErrorMessage.module.scss.js";
-import { useComponentContext as a } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useComponentContext as a } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 function l({
   children: o,
   id: t,

package/dist/components/Common/FieldErrorMessage/FieldErrorMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldErrorMessage.js","sources":["../../../../src/components/Common/FieldErrorMessage/FieldErrorMessage.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react'\nimport classNames from 'classnames'\nimport styles from './FieldErrorMessage.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\ninterface FieldErrorMessageProps extends HTMLAttributes<HTMLParagraphElement> {\n  withErrorIcon?: boolean\n}\n\nexport function FieldErrorMessage({\n  children,\n  id,\n  className,\n  withErrorIcon = true,\n  ...props\n}: FieldErrorMessageProps) {\n  const { Text } = useComponentContext()\n\n  return (\n    children && (\n      <Text\n        id={id}\n        className={classNames(styles.root, className, {\n          [styles.withErrorIcon as string]: withErrorIcon,\n        })}\n        {...props}\n      >\n        {children}\n      </Text>\n    )\n  )\n}\n"],"names":["FieldErrorMessage","children","id","className","withErrorIcon","props","Text","useComponentContext","jsx","classNames","styles"],"mappings":";;;;AASO,SAASA,EAAkB;AAAA,EAChC,UAAAC;AAAA,EACA,IAAAC;AAAA,EACA,WAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,GAAGC;AACL,GAA2B;AACnB,QAAA,EAAE,MAAAC,EAAK,IAAIC,EAAoB;AAErC,SACEN,KACE,gBAAAO;AAAA,IAACF;AAAA,IAAA;AAAA,MACC,IAAAJ;AAAA,MACA,WAAWO,EAAWC,EAAO,MAAMP,GAAW;AAAA,QAC5C,CAACO,EAAO,aAAuB,GAAGN;AAAA,MAAA,CACnC;AAAA,MACA,GAAGC;AAAA,MAEH,UAAAJ;AAAA,IAAA;AAAA,EACH;AAGN;"}

package/dist/components/Common/{UI/FieldLayout → FieldLayout}/FieldLayout.js

@@ -2,7 +2,7 @@ import { jsxs as s, jsx as e } from "react/jsx-runtime";
 import t from "classnames";
 import { FieldCaption as F } from "../FieldCaption/FieldCaption.js";
 import r from "./FieldLayout.module.scss.js";
-import { getDataProps as N } from "../../../../helpers/getDataProps.js";
+import { getDataProps as N } from "../../../helpers/getDataProps.js";
 import { FieldDescription as g } from "../FieldDescription/FieldDescription.js";
 import { FieldErrorMessage as x } from "../FieldErrorMessage/FieldErrorMessage.js";
 const A = ({

package/dist/components/Common/FieldLayout/FieldLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldLayout.js","sources":["../../../../src/components/Common/FieldLayout/FieldLayout.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { FieldDescription } from '../FieldDescription'\nimport { FieldErrorMessage } from '../FieldErrorMessage'\nimport { FieldCaption } from '../FieldCaption/FieldCaption'\nimport styles from './FieldLayout.module.scss'\nimport type { FieldLayoutProps } from './FieldLayoutTypes'\nimport { getDataProps } from '@/helpers/getDataProps'\n\nexport const FieldLayout: React.FC<FieldLayoutProps> = ({\n  label,\n  description,\n  descriptionId,\n  errorMessage,\n  errorMessageId,\n  children,\n  isRequired = false,\n  htmlFor,\n  shouldVisuallyHideLabel = false,\n  className,\n  withErrorIcon = true,\n  ...props\n}: FieldLayoutProps) => {\n  return (\n    <div className={classNames(styles.root, className)} {...getDataProps(props)}>\n      <div\n        className={classNames(styles.labelAndDescription, {\n          [styles.withVisibleLabel as string]: !shouldVisuallyHideLabel,\n          [styles.withDescription as string]: Boolean(description),\n        })}\n      >\n        <FieldCaption\n          htmlFor={htmlFor}\n          isRequired={isRequired}\n          isVisuallyHidden={shouldVisuallyHideLabel}\n        >\n          {label}\n        </FieldCaption>\n        <FieldDescription id={descriptionId}>{description}</FieldDescription>\n      </div>\n      {children}\n      <FieldErrorMessage\n        id={errorMessageId}\n        className={styles.errorMessage}\n        withErrorIcon={withErrorIcon}\n      >\n        {errorMessage}\n      </FieldErrorMessage>\n    </div>\n  )\n}\n"],"names":["FieldLayout","label","description","descriptionId","errorMessage","errorMessageId","children","isRequired","htmlFor","shouldVisuallyHideLabel","className","withErrorIcon","props","jsxs","classNames","styles","getDataProps","jsx","FieldCaption","FieldDescription","FieldErrorMessage"],"mappings":";;;;;;;AAQO,MAAMA,IAA0C,CAAC;AAAA,EACtD,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,cAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,SAAAC;AAAA,EACA,yBAAAC,IAA0B;AAAA,EAC1B,WAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,GAAGC;AACL,MAEI,gBAAAC,EAAC,OAAI,EAAA,WAAWC,EAAWC,EAAO,MAAML,CAAS,GAAI,GAAGM,EAAaJ,CAAK,GACxE,UAAA;AAAA,EAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAWC,EAAO,qBAAqB;AAAA,QAChD,CAACA,EAAO,gBAA0B,GAAG,CAACN;AAAA,QACtC,CAACM,EAAO,eAAyB,GAAG,EAAQb;AAAA,MAAW,CACxD;AAAA,MAED,UAAA;AAAA,QAAA,gBAAAe;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,SAAAV;AAAA,YACA,YAAAD;AAAA,YACA,kBAAkBE;AAAA,YAEjB,UAAAR;AAAA,UAAA;AAAA,QACH;AAAA,QACC,gBAAAgB,EAAAE,GAAA,EAAiB,IAAIhB,GAAgB,UAAYD,EAAA,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACpD;AAAA,EACCI;AAAA,EACD,gBAAAW;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,IAAIf;AAAA,MACJ,WAAWU,EAAO;AAAA,MAClB,eAAAJ;AAAA,MAEC,UAAAP;AAAA,IAAA;AAAA,EAAA;AACH,GACF;"}

package/dist/components/Common/FieldLayout/FieldLayoutTypes.d.ts

@@ -0,0 +1,52 @@
+import { ReactNode } from 'react';
+import { DataAttributes } from '../../../types/Helpers';
+export interface SharedFieldLayoutProps extends DataAttributes {
+    /**
+     * Optional description text for the field
+     */
+    description?: ReactNode;
+    /**
+     * Error message to display when the field is invalid
+     */
+    errorMessage?: string;
+    /**
+     * Indicates if the field is required
+     */
+    isRequired?: boolean;
+    /**
+     * Label text for the field
+     */
+    label: ReactNode;
+    /**
+     * Hides the label visually while keeping it accessible to screen readers
+     */
+    shouldVisuallyHideLabel?: boolean;
+}
+export interface InternalFieldLayoutProps {
+    /**
+     * Content to be rendered inside the field layout
+     */
+    children: React.ReactNode;
+    /**
+     * ID of the form control that this label is associated with
+     */
+    htmlFor: string;
+    /**
+     * ID of the error message element
+     */
+    errorMessageId: string;
+    /**
+     * ID of the description element
+     */
+    descriptionId: string;
+    /**
+     * Additional CSS class name
+     */
+    className?: string;
+    /**
+     * Whether to show the error icon
+     */
+    withErrorIcon?: boolean;
+}
+export interface FieldLayoutProps extends SharedFieldLayoutProps, InternalFieldLayoutProps {
+}

package/dist/components/Common/{UI/Fieldset → Fieldset}/Fieldset.js

@@ -2,7 +2,7 @@ import { jsxs as a, jsx as r } from "react/jsx-runtime";
 import { useId as f } from "react";
 import l from "classnames";
 import e from "./Fieldset.module.scss.js";
-import { getDataProps as g } from "../../../../helpers/getDataProps.js";
+import { getDataProps as g } from "../../../helpers/getDataProps.js";
 import { FieldCaption as h } from "../FieldCaption/FieldCaption.js";
 import { FieldDescription as D } from "../FieldDescription/FieldDescription.js";
 import { FieldErrorMessage as F } from "../FieldErrorMessage/FieldErrorMessage.js";

package/dist/components/Common/Fieldset/Fieldset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Fieldset.js","sources":["../../../../src/components/Common/Fieldset/Fieldset.tsx"],"sourcesContent":["import { useId } from 'react'\nimport classNames from 'classnames'\nimport { FieldDescription } from '../FieldDescription'\nimport { FieldErrorMessage } from '../FieldErrorMessage'\nimport { FieldCaption } from '../FieldCaption'\nimport type { SharedFieldLayoutProps } from '../FieldLayout/FieldLayoutTypes'\nimport styles from './Fieldset.module.scss'\nimport { getDataProps } from '@/helpers/getDataProps'\n\nexport interface FieldsetProps\n  extends Omit<SharedFieldLayoutProps, 'label' | 'shouldVisuallyHideLabel'> {\n  children: React.ReactNode\n  description?: React.ReactNode\n  errorMessage?: string\n  isRequired?: boolean\n  legend: React.ReactNode\n  shouldVisuallyHideLegend?: boolean\n  className?: string\n}\n\nexport const Fieldset: React.FC<FieldsetProps> = ({\n  children,\n  description,\n  errorMessage,\n  isRequired = false,\n  legend,\n  shouldVisuallyHideLegend = false,\n  className,\n  ...props\n}: FieldsetProps) => {\n  const generatedErrorMessageId = useId()\n  const errorMessageId = `error-message-${generatedErrorMessageId}`\n\n  return (\n    <fieldset\n      className={classNames(styles.root, className)}\n      aria-describedby={errorMessage ? errorMessageId : undefined}\n      {...getDataProps(props)}\n    >\n      <div\n        className={classNames(styles.legendAndDescription, {\n          [styles.withVisibleLegend as string]: !shouldVisuallyHideLegend,\n          [styles.withDescription as string]: Boolean(description),\n        })}\n      >\n        <FieldCaption\n          as=\"legend\"\n          isRequired={isRequired}\n          isVisuallyHidden={shouldVisuallyHideLegend}\n        >\n          {legend}\n        </FieldCaption>\n        <FieldDescription>{description}</FieldDescription>\n      </div>\n      {children}\n      <FieldErrorMessage\n        id={errorMessageId}\n        className={styles.errorMessage}\n        aria-live=\"polite\"\n        role=\"alert\"\n      >\n        {errorMessage}\n      </FieldErrorMessage>\n    </fieldset>\n  )\n}\n"],"names":["Fieldset","children","description","errorMessage","isRequired","legend","shouldVisuallyHideLegend","className","props","errorMessageId","useId","jsxs","classNames","styles","getDataProps","jsx","FieldCaption","FieldDescription","FieldErrorMessage"],"mappings":";;;;;;;;AAoBO,MAAMA,IAAoC,CAAC;AAAA,EAChD,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,QAAAC;AAAA,EACA,0BAAAC,IAA2B;AAAA,EAC3B,WAAAC;AAAA,EACA,GAAGC;AACL,MAAqB;AAEb,QAAAC,IAAiB,iBADSC,EAAM,CACyB;AAG7D,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAWC,EAAO,MAAMN,CAAS;AAAA,MAC5C,oBAAkBJ,IAAeM,IAAiB;AAAA,MACjD,GAAGK,EAAaN,CAAK;AAAA,MAEtB,UAAA;AAAA,QAAA,gBAAAG;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWC,EAAWC,EAAO,sBAAsB;AAAA,cACjD,CAACA,EAAO,iBAA2B,GAAG,CAACP;AAAA,cACvC,CAACO,EAAO,eAAyB,GAAG,EAAQX;AAAA,YAAW,CACxD;AAAA,YAED,UAAA;AAAA,cAAA,gBAAAa;AAAA,gBAACC;AAAA,gBAAA;AAAA,kBACC,IAAG;AAAA,kBACH,YAAAZ;AAAA,kBACA,kBAAkBE;AAAA,kBAEjB,UAAAD;AAAA,gBAAA;AAAA,cACH;AAAA,cACA,gBAAAU,EAACE,KAAkB,UAAYf,EAAA,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACjC;AAAA,QACCD;AAAA,QACD,gBAAAc;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,IAAIT;AAAA,YACJ,WAAWI,EAAO;AAAA,YAClB,aAAU;AAAA,YACV,MAAK;AAAA,YAEJ,UAAAV;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EACF;AAEJ;"}

package/dist/components/Common/{UI/HorizontalFieldLayout → HorizontalFieldLayout}/HorizontalFieldLayout.js

@@ -1,8 +1,8 @@
 import { jsxs as f, jsx as e } from "react/jsx-runtime";
 import N from "classnames";
 import r from "./HorizontalFieldLayout.module.scss.js";
-import { getDataProps as b } from "../../../../helpers/getDataProps.js";
-import { VisuallyHidden as g } from "../../VisuallyHidden/VisuallyHidden.js";
+import { getDataProps as b } from "../../../helpers/getDataProps.js";
+import { VisuallyHidden as g } from "../VisuallyHidden/VisuallyHidden.js";
 import { FieldDescription as w } from "../FieldDescription/FieldDescription.js";
 import { FieldErrorMessage as x } from "../FieldErrorMessage/FieldErrorMessage.js";
 const M = ({

package/dist/components/Common/HorizontalFieldLayout/HorizontalFieldLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HorizontalFieldLayout.js","sources":["../../../../src/components/Common/HorizontalFieldLayout/HorizontalFieldLayout.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { VisuallyHidden } from '../VisuallyHidden'\nimport { FieldErrorMessage } from '../FieldErrorMessage'\nimport { FieldDescription } from '../FieldDescription'\nimport styles from './HorizontalFieldLayout.module.scss'\nimport type { HorizontalFieldLayoutProps } from './HorizontalFieldLayoutTypes'\nimport { getDataProps } from '@/helpers/getDataProps'\n\nexport const HorizontalFieldLayout: React.FC<HorizontalFieldLayoutProps> = ({\n  label,\n  description,\n  descriptionId,\n  errorMessage,\n  errorMessageId,\n  children,\n  htmlFor,\n  className,\n  shouldVisuallyHideLabel,\n  ...props\n}: HorizontalFieldLayoutProps) => {\n  const labelContent = (\n    <label className={styles.label} htmlFor={htmlFor}>\n      {label}\n    </label>\n  )\n\n  const withDescriptionOrErrorMessage = description || errorMessage\n\n  return (\n    <div\n      className={classNames(\n        styles.root,\n        {\n          [styles.withoutVisibleLabel as string]:\n            shouldVisuallyHideLabel && withDescriptionOrErrorMessage,\n          [styles.withOnlyChildren as string]:\n            shouldVisuallyHideLabel && !withDescriptionOrErrorMessage,\n        },\n        className,\n      )}\n      {...getDataProps(props)}\n    >\n      <div className={styles.children}>{children}</div>\n      {shouldVisuallyHideLabel ? <VisuallyHidden>{labelContent}</VisuallyHidden> : labelContent}\n      <FieldDescription id={descriptionId} className={styles.description}>\n        {description}\n      </FieldDescription>\n      <FieldErrorMessage id={errorMessageId} className={styles.errorMessage}>\n        {errorMessage}\n      </FieldErrorMessage>\n    </div>\n  )\n}\n"],"names":["HorizontalFieldLayout","label","description","descriptionId","errorMessage","errorMessageId","children","htmlFor","className","shouldVisuallyHideLabel","props","labelContent","jsx","styles","withDescriptionOrErrorMessage","jsxs","classNames","getDataProps","VisuallyHidden","FieldDescription","FieldErrorMessage"],"mappings":";;;;;;;AAQO,MAAMA,IAA8D,CAAC;AAAA,EAC1E,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,cAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,yBAAAC;AAAA,EACA,GAAGC;AACL,MAAkC;AAChC,QAAMC,IACH,gBAAAC,EAAA,SAAA,EAAM,WAAWC,EAAO,OAAO,SAAAN,GAC7B,UACHN,GAAA,GAGIa,IAAgCZ,KAAeE;AAGnD,SAAA,gBAAAW;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACTH,EAAO;AAAA,QACP;AAAA,UACE,CAACA,EAAO,mBAA6B,GACnCJ,KAA2BK;AAAA,UAC7B,CAACD,EAAO,gBAA0B,GAChCJ,KAA2B,CAACK;AAAA,QAChC;AAAA,QACAN;AAAA,MACF;AAAA,MACC,GAAGS,EAAaP,CAAK;AAAA,MAEtB,UAAA;AAAA,QAAA,gBAAAE,EAAC,OAAI,EAAA,WAAWC,EAAO,UAAW,UAAAP,GAAS;AAAA,QAC1CG,IAA0B,gBAAAG,EAACM,GAAgB,EAAA,UAAAP,EAAa,CAAA,IAAoBA;AAAA,0BAC5EQ,GAAiB,EAAA,IAAIhB,GAAe,WAAWU,EAAO,aACpD,UACHX,GAAA;AAAA,0BACCkB,GAAkB,EAAA,IAAIf,GAAgB,WAAWQ,EAAO,cACtD,UACHT,EAAA,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACF;AAEJ;"}

package/dist/components/Common/SignatureForm/SignatureForm.d.ts

@@ -1,10 +1,16 @@
+import { z } from 'zod';
 import { UseFormProps } from 'react-hook-form';
-import * as v from 'valibot';
-export declare const SignatureFormSchema: v.ObjectSchema<{
-    readonly signature: v.SchemaWithPipe<[v.StringSchema<undefined>, v.NonEmptyAction<string, undefined>]>;
-    readonly confirmSignature: v.LiteralSchema<true, undefined>;
-}, undefined>;
-export type SignatureFormInputs = v.InferInput<typeof SignatureFormSchema>;
+export declare const SignatureFormSchema: z.ZodObject<{
+    signature: z.ZodString;
+    confirmSignature: z.ZodLiteral<true>;
+}, "strip", z.ZodTypeAny, {
+    signature: string;
+    confirmSignature: true;
+}, {
+    signature: string;
+    confirmSignature: true;
+}>;
+export type SignatureFormInputs = z.infer<typeof SignatureFormSchema>;
 interface SignatureFormProps {
     onSubmit: (data: SignatureFormInputs) => void | Promise<void>;
     children?: React.ReactNode;

package/dist/components/Common/SignatureForm/SignatureForm.js

@@ -1,23 +1,23 @@
-import { jsx as o } from "react/jsx-runtime";
-import * as r from "valibot";
+import { jsx as r } from "react/jsx-runtime";
+import { z as o } from "zod";
 import { useForm as s, FormProvider as a } from "react-hook-form";
-import { valibotResolver as l } from "@hookform/resolvers/valibot";
+import { zodResolver as l } from "@hookform/resolvers/zod";
 import t from "./SignatureForm.module.scss.js";
 import { Form as u } from "../Form/Form.js";
 import { Flex as c } from "../Flex/Flex.js";
-const f = r.object({
-  signature: r.pipe(r.string(), r.nonEmpty()),
-  confirmSignature: r.literal(!0)
-}), p = {
+const f = o.object({
+  signature: o.string().min(1),
+  confirmSignature: o.literal(!0)
+}), d = {
   signature: ""
 };
-function b({ onSubmit: i, children: m, formProps: n }) {
+function b({ onSubmit: m, children: i, formProps: n }) {
   const e = s({
     resolver: l(f),
-    defaultValues: p,
+    defaultValues: d,
     ...n
   });
-  return /* @__PURE__ */ o(a, { ...e, children: /* @__PURE__ */ o(u, { onSubmit: e.handleSubmit(i), className: t.container, children: /* @__PURE__ */ o("div", { className: t.formFields, children: /* @__PURE__ */ o(c, { flexDirection: "column", gap: 20, children: m }) }) }) });
+  return /* @__PURE__ */ r(a, { ...e, children: /* @__PURE__ */ r(u, { onSubmit: e.handleSubmit(m), className: t.container, children: /* @__PURE__ */ r("div", { className: t.formFields, children: /* @__PURE__ */ r(c, { flexDirection: "column", gap: 20, children: i }) }) }) });
 }
 export {
   b as SignatureForm,

package/dist/components/Common/SignatureForm/SignatureForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SignatureForm.js","sources":["../../../../src/components/Common/SignatureForm/SignatureForm.tsx"],"sourcesContent":["import * as v from 'valibot'\nimport { FormProvider, useForm, type UseFormProps } from 'react-hook-form'\nimport { valibotResolver } from '@hookform/resolvers/valibot'\nimport styles from './SignatureForm.module.scss'\nimport { Form } from '@/components/Common/Form'\nimport { Flex } from '@/components/Common'\n\nexport const SignatureFormSchema = v.object({\n  signature: v.pipe(v.string(), v.nonEmpty()),\n  confirmSignature: v.literal(true),\n})\n\nconst signatureFormDefaultValues = {\n  signature: '',\n}\n\nexport type SignatureFormInputs = v.InferInput<typeof SignatureFormSchema>\n\ninterface SignatureFormProps {\n  onSubmit: (data: SignatureFormInputs) => void | Promise<void>\n  children?: React.ReactNode\n  formProps?: Partial<UseFormProps<SignatureFormInputs>>\n}\n\nexport function SignatureForm({ onSubmit, children, formProps }: SignatureFormProps) {\n  const methods = useForm<SignatureFormInputs>({\n    resolver: valibotResolver(SignatureFormSchema),\n    defaultValues: signatureFormDefaultValues,\n    ...formProps,\n  })\n\n  return (\n    <FormProvider {...methods}>\n      <Form onSubmit={methods.handleSubmit(onSubmit)} className={styles.container}>\n        <div className={styles.formFields}>\n          <Flex flexDirection=\"column\" gap={20}>\n            {children}\n          </Flex>\n        </div>\n      </Form>\n    </FormProvider>\n  )\n}\n"],"names":["SignatureFormSchema","v","signatureFormDefaultValues","SignatureForm","onSubmit","children","formProps","methods","useForm","valibotResolver","jsx","FormProvider","Form","styles","Flex"],"mappings":";;;;;;;AAOa,MAAAA,IAAsBC,EAAE,OAAO;AAAA,EAC1C,WAAWA,EAAE,KAAKA,EAAE,UAAUA,EAAE,UAAU;AAAA,EAC1C,kBAAkBA,EAAE,QAAQ,EAAI;AAClC,CAAC,GAEKC,IAA6B;AAAA,EACjC,WAAW;AACb;AAUO,SAASC,EAAc,EAAE,UAAAC,GAAU,UAAAC,GAAU,WAAAC,KAAiC;AACnF,QAAMC,IAAUC,EAA6B;AAAA,IAC3C,UAAUC,EAAgBT,CAAmB;AAAA,IAC7C,eAAeE;AAAA,IACf,GAAGI;AAAA,EAAA,CACJ;AAED,SACG,gBAAAI,EAAAC,GAAA,EAAc,GAAGJ,GAChB,UAAC,gBAAAG,EAAAE,GAAA,EAAK,UAAUL,EAAQ,aAAaH,CAAQ,GAAG,WAAWS,EAAO,WAChE,UAAC,gBAAAH,EAAA,OAAA,EAAI,WAAWG,EAAO,YACrB,UAAA,gBAAAH,EAACI,GAAK,EAAA,eAAc,UAAS,KAAK,IAC/B,UAAAT,EACH,CAAA,EACF,CAAA,EACF,CAAA,GACF;AAEJ;"}
+{"version":3,"file":"SignatureForm.js","sources":["../../../../src/components/Common/SignatureForm/SignatureForm.tsx"],"sourcesContent":["import { z } from 'zod'\nimport { FormProvider, useForm, type UseFormProps } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport styles from './SignatureForm.module.scss'\nimport { Form } from '@/components/Common/Form'\nimport { Flex } from '@/components/Common'\n\nexport const SignatureFormSchema = z.object({\n  signature: z.string().min(1),\n  confirmSignature: z.literal(true),\n})\n\nconst signatureFormDefaultValues = {\n  signature: '',\n}\n\nexport type SignatureFormInputs = z.infer<typeof SignatureFormSchema>\n\ninterface SignatureFormProps {\n  onSubmit: (data: SignatureFormInputs) => void | Promise<void>\n  children?: React.ReactNode\n  formProps?: Partial<UseFormProps<SignatureFormInputs>>\n}\n\nexport function SignatureForm({ onSubmit, children, formProps }: SignatureFormProps) {\n  const methods = useForm<SignatureFormInputs>({\n    resolver: zodResolver(SignatureFormSchema),\n    defaultValues: signatureFormDefaultValues,\n    ...formProps,\n  })\n\n  return (\n    <FormProvider {...methods}>\n      <Form onSubmit={methods.handleSubmit(onSubmit)} className={styles.container}>\n        <div className={styles.formFields}>\n          <Flex flexDirection=\"column\" gap={20}>\n            {children}\n          </Flex>\n        </div>\n      </Form>\n    </FormProvider>\n  )\n}\n"],"names":["SignatureFormSchema","z","signatureFormDefaultValues","SignatureForm","onSubmit","children","formProps","methods","useForm","zodResolver","jsx","FormProvider","Form","styles","Flex"],"mappings":";;;;;;;AAOa,MAAAA,IAAsBC,EAAE,OAAO;AAAA,EAC1C,WAAWA,EAAE,SAAS,IAAI,CAAC;AAAA,EAC3B,kBAAkBA,EAAE,QAAQ,EAAI;AAClC,CAAC,GAEKC,IAA6B;AAAA,EACjC,WAAW;AACb;AAUO,SAASC,EAAc,EAAE,UAAAC,GAAU,UAAAC,GAAU,WAAAC,KAAiC;AACnF,QAAMC,IAAUC,EAA6B;AAAA,IAC3C,UAAUC,EAAYT,CAAmB;AAAA,IACzC,eAAeE;AAAA,IACf,GAAGI;AAAA,EAAA,CACJ;AAED,SACG,gBAAAI,EAAAC,GAAA,EAAc,GAAGJ,GAChB,UAAC,gBAAAG,EAAAE,GAAA,EAAK,UAAUL,EAAQ,aAAaH,CAAQ,GAAG,WAAWS,EAAO,WAChE,UAAC,gBAAAH,EAAA,OAAA,EAAI,WAAWG,EAAO,YACrB,UAAA,gBAAAH,EAACI,GAAK,EAAA,eAAc,UAAS,KAAK,IAC/B,UAAAT,EACH,CAAA,EACF,CAAA,EACF,CAAA,GACF;AAEJ;"}

package/dist/components/Common/UI/Alert/Alert.d.ts

@@ -1,2 +1,2 @@
 import { AlertProps } from './AlertTypes';
-export declare function Alert({ label, children, status, icon }: AlertProps): import("react/jsx-runtime").JSX.Element;
+export declare function Alert({ label, children, status, icon, className }: AlertProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Common/UI/Alert/Alert.js

@@ -1,15 +1,16 @@
-import { jsx as r, jsxs as d } from "react/jsx-runtime";
-import { useId as s, useRef as m, useEffect as f } from "react";
+import { jsx as r, jsxs as m } from "react/jsx-runtime";
+import { useId as d, useRef as f, useEffect as h } from "react";
+import u from "classnames";
 import i from "./Alert.module.scss.js";
-import h from "../../../../assets/icons/info.svg.js";
-import u from "../../../../assets/icons/success_check.svg.js";
-import v from "../../../../assets/icons/warning.svg.js";
-import p from "../../../../assets/icons/error.svg.js";
-function w({ label: a, children: t, status: e = "info", icon: c }) {
-  const n = s(), o = m(null), l = e === "info" ? /* @__PURE__ */ r(h, { "aria-hidden": !0 }) : e === "success" ? /* @__PURE__ */ r(u, { "aria-hidden": !0 }) : e === "warning" ? /* @__PURE__ */ r(v, { "aria-hidden": !0 }) : /* @__PURE__ */ r(p, { "aria-hidden": !0 });
-  return f(() => {
+import v from "../../../../assets/icons/info.svg.js";
+import p from "../../../../assets/icons/success_check.svg.js";
+import g from "../../../../assets/icons/warning.svg.js";
+import N from "../../../../assets/icons/error.svg.js";
+function R({ label: a, children: t, status: e = "info", icon: c, className: l }) {
+  const n = d(), o = f(null), s = e === "info" ? /* @__PURE__ */ r(v, { "aria-hidden": !0 }) : e === "success" ? /* @__PURE__ */ r(p, { "aria-hidden": !0 }) : e === "warning" ? /* @__PURE__ */ r(g, { "aria-hidden": !0 }) : /* @__PURE__ */ r(N, { "aria-hidden": !0 });
+  return h(() => {
     o.current && o.current.scrollIntoView({ behavior: "smooth" });
-  }, []), /* @__PURE__ */ r("div", { className: i.root, children: /* @__PURE__ */ d(
+  }, []), /* @__PURE__ */ r("div", { className: u(i.root, l), children: /* @__PURE__ */ m(
     "div",
     {
       className: i.alert,
@@ -18,7 +19,7 @@ function w({ label: a, children: t, status: e = "info", icon: c }) {
       "data-variant": e,
       ref: o,
       children: [
-        /* @__PURE__ */ r("div", { className: i.icon, children: c || l }),
+        /* @__PURE__ */ r("div", { className: i.icon, children: c || s }),
         /* @__PURE__ */ r("h6", { id: n, children: a }),
         /* @__PURE__ */ r("div", { className: i.content, children: t })
       ]
@@ -26,6 +27,6 @@ function w({ label: a, children: t, status: e = "info", icon: c }) {
   ) });
 }
 export {
-  w as Alert
+  R as Alert
 };
 //# sourceMappingURL=Alert.js.map

package/dist/components/Common/UI/Alert/Alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.js","sources":["../../../../../src/components/Common/UI/Alert/Alert.tsx"],"sourcesContent":["import { useEffect, useId, useRef } from 'react'\nimport { type AlertProps } from './AlertTypes'\nimport styles from './Alert.module.scss'\nimport InfoIcon from '@/assets/icons/info.svg?react'\nimport SuccessIcon from '@/assets/icons/success_check.svg?react'\nimport WarningIcon from '@/assets/icons/warning.svg?react'\nimport ErrorIcon from '@/assets/icons/error.svg?react'\n\nexport function Alert({ label, children, status = 'info', icon }: AlertProps) {\n  const id = useId()\n  const alertRef = useRef<HTMLDivElement>(null)\n  const defaultIcon =\n    status === 'info' ? (\n      <InfoIcon aria-hidden />\n    ) : status === 'success' ? (\n      <SuccessIcon aria-hidden />\n    ) : status === 'warning' ? (\n      <WarningIcon aria-hidden />\n    ) : (\n      <ErrorIcon aria-hidden />\n    )\n\n  useEffect(() => {\n    if (alertRef.current) alertRef.current.scrollIntoView({ behavior: 'smooth' })\n  }, [])\n\n  return (\n    <div className={styles.root}>\n      <div\n        className={styles.alert}\n        role=\"alert\"\n        aria-labelledby={id}\n        data-variant={status}\n        ref={alertRef}\n      >\n        <div className={styles.icon}>{icon || defaultIcon}</div>\n        <h6 id={id}>{label}</h6>\n        <div className={styles.content}>{children}</div>\n      </div>\n    </div>\n  )\n}\n"],"names":["Alert","label","children","status","icon","id","useId","alertRef","useRef","defaultIcon","jsx","InfoIcon","SuccessIcon","WarningIcon","ErrorIcon","useEffect","styles","jsxs"],"mappings":";;;;;;;AAQO,SAASA,EAAM,EAAE,OAAAC,GAAO,UAAAC,GAAU,QAAAC,IAAS,QAAQ,MAAAC,KAAoB;AAC5E,QAAMC,IAAKC,EAAM,GACXC,IAAWC,EAAuB,IAAI,GACtCC,IACJN,MAAW,SACR,gBAAAO,EAAAC,GAAA,EAAS,eAAW,GAAC,CAAA,IACpBR,MAAW,YACZ,gBAAAO,EAAAE,GAAA,EAAY,eAAW,GAAC,CAAA,IACvBT,MAAW,YACZ,gBAAAO,EAAAG,GAAA,EAAY,eAAW,GAAC,CAAA,IAEzB,gBAAAH,EAACI,GAAU,EAAA,eAAW,GAAC,CAAA;AAG3B,SAAAC,EAAU,MAAM;AACV,IAAAR,EAAS,WAAkBA,EAAA,QAAQ,eAAe,EAAE,UAAU,UAAU;AAAA,EAC9E,GAAG,EAAE,GAGF,gBAAAG,EAAA,OAAA,EAAI,WAAWM,EAAO,MACrB,UAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWD,EAAO;AAAA,MAClB,MAAK;AAAA,MACL,mBAAiBX;AAAA,MACjB,gBAAcF;AAAA,MACd,KAAKI;AAAA,MAEL,UAAA;AAAA,QAAA,gBAAAG,EAAC,OAAI,EAAA,WAAWM,EAAO,MAAO,eAAQP,GAAY;AAAA,QAClD,gBAAAC,EAAC,MAAG,EAAA,IAAAL,GAAS,UAAMJ,EAAA,CAAA;AAAA,QAClB,gBAAAS,EAAA,OAAA,EAAI,WAAWM,EAAO,SAAU,UAAAd,EAAS,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAE9C;AAEJ;"}
+{"version":3,"file":"Alert.js","sources":["../../../../../src/components/Common/UI/Alert/Alert.tsx"],"sourcesContent":["import { useEffect, useId, useRef } from 'react'\nimport classNames from 'classnames'\nimport { type AlertProps } from './AlertTypes'\nimport styles from './Alert.module.scss'\nimport InfoIcon from '@/assets/icons/info.svg?react'\nimport SuccessIcon from '@/assets/icons/success_check.svg?react'\nimport WarningIcon from '@/assets/icons/warning.svg?react'\nimport ErrorIcon from '@/assets/icons/error.svg?react'\n\nexport function Alert({ label, children, status = 'info', icon, className }: AlertProps) {\n  const id = useId()\n  const alertRef = useRef<HTMLDivElement>(null)\n  const defaultIcon =\n    status === 'info' ? (\n      <InfoIcon aria-hidden />\n    ) : status === 'success' ? (\n      <SuccessIcon aria-hidden />\n    ) : status === 'warning' ? (\n      <WarningIcon aria-hidden />\n    ) : (\n      <ErrorIcon aria-hidden />\n    )\n\n  useEffect(() => {\n    if (alertRef.current) alertRef.current.scrollIntoView({ behavior: 'smooth' })\n  }, [])\n\n  return (\n    <div className={classNames(styles.root, className)}>\n      <div\n        className={styles.alert}\n        role=\"alert\"\n        aria-labelledby={id}\n        data-variant={status}\n        ref={alertRef}\n      >\n        <div className={styles.icon}>{icon || defaultIcon}</div>\n        <h6 id={id}>{label}</h6>\n        <div className={styles.content}>{children}</div>\n      </div>\n    </div>\n  )\n}\n"],"names":["Alert","label","children","status","icon","className","id","useId","alertRef","useRef","defaultIcon","jsx","InfoIcon","SuccessIcon","WarningIcon","ErrorIcon","useEffect","classNames","styles","jsxs"],"mappings":";;;;;;;;AASgB,SAAAA,EAAM,EAAE,OAAAC,GAAO,UAAAC,GAAU,QAAAC,IAAS,QAAQ,MAAAC,GAAM,WAAAC,KAAyB;AACvF,QAAMC,IAAKC,EAAM,GACXC,IAAWC,EAAuB,IAAI,GACtCC,IACJP,MAAW,SACR,gBAAAQ,EAAAC,GAAA,EAAS,eAAW,GAAC,CAAA,IACpBT,MAAW,YACZ,gBAAAQ,EAAAE,GAAA,EAAY,eAAW,GAAC,CAAA,IACvBV,MAAW,YACZ,gBAAAQ,EAAAG,GAAA,EAAY,eAAW,GAAC,CAAA,IAEzB,gBAAAH,EAACI,GAAU,EAAA,eAAW,GAAC,CAAA;AAG3B,SAAAC,EAAU,MAAM;AACV,IAAAR,EAAS,WAAkBA,EAAA,QAAQ,eAAe,EAAE,UAAU,UAAU;AAAA,EAC9E,GAAG,EAAE,qBAGF,OAAI,EAAA,WAAWS,EAAWC,EAAO,MAAMb,CAAS,GAC/C,UAAA,gBAAAc;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWD,EAAO;AAAA,MAClB,MAAK;AAAA,MACL,mBAAiBZ;AAAA,MACjB,gBAAcH;AAAA,MACd,KAAKK;AAAA,MAEL,UAAA;AAAA,QAAA,gBAAAG,EAAC,OAAI,EAAA,WAAWO,EAAO,MAAO,eAAQR,GAAY;AAAA,QAClD,gBAAAC,EAAC,MAAG,EAAA,IAAAL,GAAS,UAAML,EAAA,CAAA;AAAA,QAClB,gBAAAU,EAAA,OAAA,EAAI,WAAWO,EAAO,SAAU,UAAAhB,EAAS,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAE9C;AAEJ;"}

package/dist/components/Common/UI/Alert/AlertTypes.d.ts

@@ -1,11 +1,23 @@
 import { ReactNode } from 'react';
 export interface AlertProps {
-    /** The variant of the alert */
+    /**
+     * The visual status that the alert should convey
+     */
     status?: 'info' | 'success' | 'warning' | 'error';
-    /** The label text for the alert */
+    /**
+     * The label text for the alert
+     */
     label: string;
-    /** Optional children to be rendered inside the alert */
+    /**
+     * Optional children to be rendered inside the alert
+     */
     children?: ReactNode;
-    /** Optional custom icon component to override the default icon */
+    /**
+     * Optional custom icon component to override the default icon
+     */
     icon?: ReactNode;
+    /**
+     * CSS className to be applied
+     */
+    className?: string;
 }

package/dist/components/Common/UI/Badge/BadgeTypes.d.ts

@@ -1,5 +1,11 @@
 import { HTMLAttributes, ReactNode } from 'react';
 export interface BadgeProps extends Pick<HTMLAttributes<HTMLSpanElement>, 'className' | 'id' | 'aria-label'> {
+    /**
+     * Content to be displayed inside the badge
+     */
     children: ReactNode;
+    /**
+     * Visual style variant of the badge
+     */
     status?: 'success' | 'warning' | 'error' | 'info';
 }

package/dist/components/Common/UI/Button/Button.js

@@ -1,39 +1,40 @@
-import { jsx as t } from "react/jsx-runtime";
-import { Button as p } from "react-aria-components";
-import u from "./Button.module.scss.js";
-function x({
+import { jsx as p } from "react/jsx-runtime";
+import { Button as u } from "react-aria-components";
+import v from "classnames";
+import c from "./Button.module.scss.js";
+function N({
   isError: o = !1,
-  isLoading: a = !1,
+  isLoading: r = !1,
   isDisabled: s = !1,
-  variant: e = "primary",
-  ref: n,
-  className: c,
+  variant: t = "primary",
+  ref: e,
+  className: m,
   children: i,
-  onBlur: d,
-  onFocus: l,
-  onClick: r,
-  ...m
+  onBlur: n,
+  onFocus: d,
+  onClick: a,
+  ...l
 }) {
-  const f = r ? () => {
-    r({});
-  } : void 0;
-  return /* @__PURE__ */ t("span", { className: u.root, children: /* @__PURE__ */ t(
-    p,
+  return /* @__PURE__ */ p(
+    u,
     {
-      ...m,
-      ref: n,
-      onBlur: d,
-      onFocus: l,
-      isDisabled: s || a,
-      "data-variant": e,
-      "data-loading": a || void 0,
+      ...l,
+      className: ({ defaultClassName: f }) => v(c.root, f, m),
+      ref: e,
+      onBlur: n,
+      onFocus: d,
+      isDisabled: s || r,
+      "data-variant": t,
+      "data-loading": r || void 0,
       "data-error": o || void 0,
-      onPress: f,
+      onPress: a ? () => {
+        a({});
+      } : void 0,
       children: i
     }
-  ) });
+  );
 }
 export {
-  x as Button
+  N as Button
 };
 //# sourceMappingURL=Button.js.map

package/dist/components/Common/UI/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../../../src/components/Common/UI/Button/Button.tsx"],"sourcesContent":["import { Button as AriaButton } from 'react-aria-components'\nimport { type ButtonProps } from './ButtonTypes'\nimport styles from './Button.module.scss'\n\nexport function Button({\n  isError = false,\n  isLoading = false,\n  isDisabled = false,\n  variant = 'primary',\n  ref,\n  className,\n  children,\n  onBlur,\n  onFocus,\n  onClick,\n  ...props\n}: ButtonProps) {\n  const handlePress = onClick\n    ? () => {\n        onClick({} as React.MouseEvent<HTMLButtonElement>)\n      }\n    : undefined\n\n  return (\n    <span className={styles.root}>\n      <AriaButton\n        {...props}\n        ref={ref}\n        onBlur={onBlur}\n        onFocus={onFocus}\n        isDisabled={isDisabled || isLoading}\n        data-variant={variant}\n        data-loading={isLoading || undefined}\n        data-error={isError || undefined}\n        onPress={handlePress}\n      >\n        {children}\n      </AriaButton>\n    </span>\n  )\n}\n"],"names":["Button","isError","isLoading","isDisabled","variant","ref","className","children","onBlur","onFocus","onClick","props","handlePress","jsx","styles","AriaButton"],"mappings":";;;AAIO,SAASA,EAAO;AAAA,EACrB,SAAAC,IAAU;AAAA,EACV,WAAAC,IAAY;AAAA,EACZ,YAAAC,IAAa;AAAA,EACb,SAAAC,IAAU;AAAA,EACV,KAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,GAAgB;AACR,QAAAC,IAAcF,IAChB,MAAM;AACJ,IAAAA,EAAQ,CAAA,CAAyC;AAAA,EAAA,IAEnD;AAEJ,SACG,gBAAAG,EAAA,QAAA,EAAK,WAAWC,EAAO,MACtB,UAAA,gBAAAD;AAAA,IAACE;AAAAA,IAAA;AAAA,MACE,GAAGJ;AAAA,MACJ,KAAAN;AAAA,MACA,QAAAG;AAAA,MACA,SAAAC;AAAA,MACA,YAAYN,KAAcD;AAAA,MAC1B,gBAAcE;AAAA,MACd,gBAAcF,KAAa;AAAA,MAC3B,cAAYD,KAAW;AAAA,MACvB,SAASW;AAAA,MAER,UAAAL;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ;"}
+{"version":3,"file":"Button.js","sources":["../../../../../src/components/Common/UI/Button/Button.tsx"],"sourcesContent":["import { Button as AriaButton } from 'react-aria-components'\nimport classNames from 'classnames'\nimport { type ButtonProps } from './ButtonTypes'\nimport styles from './Button.module.scss'\n\nexport function Button({\n  isError = false,\n  isLoading = false,\n  isDisabled = false,\n  variant = 'primary',\n  ref,\n  className,\n  children,\n  onBlur,\n  onFocus,\n  onClick,\n  ...props\n}: ButtonProps) {\n  const handlePress = onClick\n    ? () => {\n        onClick({} as React.MouseEvent<HTMLButtonElement>)\n      }\n    : undefined\n\n  return (\n    <AriaButton\n      {...props}\n      className={({ defaultClassName }) => classNames(styles.root, defaultClassName, className)}\n      ref={ref}\n      onBlur={onBlur}\n      onFocus={onFocus}\n      isDisabled={isDisabled || isLoading}\n      data-variant={variant}\n      data-loading={isLoading || undefined}\n      data-error={isError || undefined}\n      onPress={handlePress}\n    >\n      {children}\n    </AriaButton>\n  )\n}\n"],"names":["Button","isError","isLoading","isDisabled","variant","ref","className","children","onBlur","onFocus","onClick","props","jsx","AriaButton","defaultClassName","classNames","styles"],"mappings":";;;;AAKO,SAASA,EAAO;AAAA,EACrB,SAAAC,IAAU;AAAA,EACV,WAAAC,IAAY;AAAA,EACZ,YAAAC,IAAa;AAAA,EACb,SAAAC,IAAU;AAAA,EACV,KAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,GAAgB;AAQZ,SAAA,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,WAAW,CAAC,EAAE,kBAAAG,QAAuBC,EAAWC,EAAO,MAAMF,GAAkBR,CAAS;AAAA,MACxF,KAAAD;AAAA,MACA,QAAAG;AAAA,MACA,SAAAC;AAAA,MACA,YAAYN,KAAcD;AAAA,MAC1B,gBAAcE;AAAA,MACd,gBAAcF,KAAa;AAAA,MAC3B,cAAYD,KAAW;AAAA,MACvB,SAjBgBS,IAChB,MAAM;AACJ,QAAAA,EAAQ,CAAA,CAAyC;AAAA,MAAA,IAEnD;AAAA,MAeC,UAAAH;AAAA,IAAA;AAAA,EACH;AAEJ;"}

package/dist/components/Common/UI/Button/Button.module.scss.js

@@ -1,4 +1,4 @@
-const o = "_root_1co44_1", t = {
+const o = "_root_1p4kg_1", t = {
   root: o
 };
 export {

package/dist/components/Common/UI/Button/ButtonTypes.d.ts

@@ -1,16 +1,41 @@
 import { Ref, ButtonHTMLAttributes, ReactNode, FocusEvent } from 'react';
-type ButtonFocusHandler = (e: FocusEvent) => void;
 export interface ButtonProps extends Pick<ButtonHTMLAttributes<HTMLButtonElement>, 'name' | 'id' | 'className' | 'type' | 'onClick' | 'onKeyDown' | 'onKeyUp' | 'aria-label' | 'aria-labelledby' | 'aria-describedby' | 'form' | 'title' | 'tabIndex'> {
+    /**
+     * React ref for the button element
+     */
     ref?: Ref<HTMLButtonElement>;
+    /**
+     * Visual style variant of the button
+     */
     variant?: 'primary' | 'secondary' | 'tertiary' | 'icon';
+    /**
+     * Indicates if the button is in an error state
+     */
     isError?: boolean;
+    /**
+     * Shows a loading spinner and disables the button
+     */
     isLoading?: boolean;
+    /**
+     * Disables the button and prevents interaction
+     */
     isDisabled?: boolean;
+    /**
+     * Content to be rendered inside the button
+     */
     children?: ReactNode;
-    onBlur?: ButtonFocusHandler;
-    onFocus?: ButtonFocusHandler;
+    /**
+     * Handler for blur events
+     */
+    onBlur?: (e: FocusEvent) => void;
+    /**
+     * Handler for focus events
+     */
+    onFocus?: (e: FocusEvent) => void;
 }
 export type ButtonIconProps = Omit<ButtonProps, 'variant'> & {
+    /**
+     * Required aria-label for icon buttons to ensure accessibility
+     */
     'aria-label': string;
 };
-export {};

package/dist/components/Common/UI/CalendarPreview/CalendarPreviewTypes.d.ts

@@ -1,12 +1,36 @@
 export type CalendarPreviewProps = {
+    /**
+     * Array of dates to highlight with custom colors and labels
+     */
     highlightDates?: Array<{
+        /**
+         * Date to highlight
+         */
         date: Date;
+        /**
+         * Color to use for highlighting
+         */
         highlightColor: 'primary' | 'secondary';
+        /**
+         * Label text for the highlighted date
+         */
         label: string;
     }>;
+    /**
+     * Date range to display in the calendar preview
+     */
     dateRange: {
+        /**
+         * Start date of the range
+         */
         start: Date;
+        /**
+         * End date of the range
+         */
         end: Date;
+        /**
+         * Label text for the date range
+         */
         label: string;
     };
 };

package/dist/components/Common/UI/Card/Card.module.scss.js

@@ -1,4 +1,4 @@
-const a = "_cardContainer_ycbrf_1", n = {
+const a = "_cardContainer_baj0w_1", n = {
   cardContainer: a
 };
 export {

package/dist/components/Common/UI/Card/CardTypes.d.ts

@@ -1,11 +1,19 @@
 import { ReactNode } from 'react';
 export interface CardProps {
-    /** Callback function when the card is selected */
+    /**
+     * Callback function when the card is selected
+     */
     onSelect?: (checked: boolean) => void;
-    /** Content to be displayed inside the card */
+    /**
+     * Content to be displayed inside the card
+     */
     children: ReactNode;
-    /** Optional menu component to be displayed on the right side of the card */
+    /**
+     * Optional menu component to be displayed on the right side of the card
+     */
     menu?: ReactNode;
-    /** Additional CSS class name */
+    /**
+     * CSS className to be applied
+     */
     className?: string;
 }