@gusto/embedded-react-sdk 0.36.0 → 0.37.0-rc.2

package/dist/components/Base/useBaseSubmit.js

@@ -1,73 +1,50 @@
-import { useState as u, useCallback as c } from "react";
-import { APIError as p } from "@gusto/embedded-api/models/errors/apierror";
-import { GustoEmbeddedError as g } from "@gusto/embedded-api/models/errors/gustoembeddederror";
-import { SDKValidationError as h } from "@gusto/embedded-api/models/errors/sdkvalidationerror";
-import { UnprocessableEntityErrorObject as b } from "@gusto/embedded-api/models/errors/unprocessableentityerrorobject";
-import { useAsyncError as v } from "../../hooks/useAsyncError.js";
-import { useObservability as w } from "../../contexts/ObservabilityProvider/useObservability.js";
-import { createObservabilityError as S } from "../../contexts/ObservabilityProvider/observabilityUtils.js";
-import { getFieldErrors as A } from "../../helpers/apiErrorToList.js";
-const B = (o) => {
-  const [E, i] = u(null), [y, a] = u(null), f = v(), { observability: n } = w(), d = c((t) => {
-    i(t), t || a(null);
-  }, []), m = c(
-    (t) => {
-      i(t);
-      const e = S(t);
-      if (e && n?.onError?.({
-        ...e,
-        context: {
-          ...e.context,
-          componentName: o
-        }
-      }), t instanceof b && Array.isArray(t.errors)) {
-        const l = t.errors.flatMap((s) => A(s));
-        if (l.length > 0)
-          a(l);
-        else {
-          const s = t.errors.filter((r) => r.message).map((r) => ({
-            errorKey: r.errorKey,
-            message: r.message ?? "",
-            category: r.category
-          }));
-          s.length > 0 && a(s);
-        }
-      }
+import { useState as f, useCallback as m } from "react";
+import { APIError as b } from "@gusto/embedded-api/models/errors/apierror";
+import { GustoEmbeddedError as E } from "@gusto/embedded-api/models/errors/gustoembeddederror";
+import { SDKValidationError as d } from "@gusto/embedded-api/models/errors/sdkvalidationerror";
+import { UnprocessableEntityErrorObject as p } from "@gusto/embedded-api/models/errors/unprocessableentityerrorobject";
+import { useAsyncError as y } from "../../hooks/useAsyncError.js";
+import { useObservability as D } from "../../contexts/ObservabilityProvider/useObservability.js";
+import { normalizeToSDKError as S, SDKInternalError as w } from "../../types/sdkError.js";
+const g = (t) => {
+  const [u, o] = f(null), a = y(), { observability: s } = D(), i = m(
+    (n) => {
+      const e = S(n);
+      o(e), s?.onError?.({ ...e, timestamp: Date.now(), componentName: t });
     },
-    [n, o]
+    [s, t]
   );
   return {
-    baseSubmitHandler: c(
-      async (t, e) => {
+    baseSubmitHandler: m(
+      async (n, e) => {
         const l = Date.now();
-        i(null), a(null);
-        let s = !1;
+        o(null);
+        let c = !1;
         try {
-          await e(t), s = !0;
+          await e(n), c = !0;
         } catch (r) {
-          r instanceof p || r instanceof h || r instanceof b || r instanceof g ? m(r) : f(r);
+          r instanceof b || r instanceof d || r instanceof p || r instanceof E || r instanceof w ? i(r) : a(r);
         } finally {
           const r = Date.now() - l;
-          n?.onMetric?.({
+          s?.onMetric?.({
             name: "sdk.form.submit_duration",
             value: r,
             unit: "ms",
             tags: {
-              status: s ? "success" : "error",
-              ...o && { component: o }
+              status: c ? "success" : "error",
+              ...t && { component: t }
             },
             timestamp: Date.now()
           });
         }
       },
-      [i, f, n, o, m]
+      [o, a, s, t, i]
     ),
-    error: E,
-    fieldErrors: y,
-    setError: d
+    error: u,
+    setError: o
   };
 };
 export {
-  B as useBaseSubmit
+  g as useBaseSubmit
 };
 //# sourceMappingURL=useBaseSubmit.js.map

package/dist/components/Base/useBaseSubmit.js.map

@@ -1 +1 @@
-{"version":3,"file":"useBaseSubmit.js","sources":["../../../src/components/Base/useBaseSubmit.ts"],"sourcesContent":["import { useState, useCallback } from 'react'\nimport type { EntityErrorObject } from '@gusto/embedded-api/models/components/entityerrorobject'\nimport { APIError } from '@gusto/embedded-api/models/errors/apierror'\nimport { GustoEmbeddedError } from '@gusto/embedded-api/models/errors/gustoembeddederror'\nimport { SDKValidationError } from '@gusto/embedded-api/models/errors/sdkvalidationerror'\nimport { UnprocessableEntityErrorObject } from '@gusto/embedded-api/models/errors/unprocessableentityerrorobject'\nimport type { KnownErrors } from './useBase'\nimport { useAsyncError } from '@/hooks/useAsyncError'\nimport { useObservability } from '@/contexts/ObservabilityProvider/useObservability'\nimport { createObservabilityError } from '@/contexts/ObservabilityProvider/observabilityUtils'\nimport { getFieldErrors } from '@/helpers/apiErrorToList'\n\ntype SubmitHandler<T> = (data: T) => Promise<void>\n\nexport const useBaseSubmit = (componentName?: string) => {\n  const [error, setError] = useState<KnownErrors | null>(null)\n  const [fieldErrors, setFieldErrors] = useState<EntityErrorObject[] | null>(null)\n  const throwError = useAsyncError()\n  const { observability } = useObservability()\n\n  // Enhanced setError that also clears fieldErrors when error is cleared\n  const setErrorWithFieldsClear = useCallback((error: KnownErrors | null) => {\n    setError(error)\n    if (!error) {\n      setFieldErrors(null)\n    }\n  }, [])\n\n  const processError = useCallback(\n    (error: KnownErrors) => {\n      setError(error)\n\n      // Report error to observability\n      const observabilityError = createObservabilityError(error)\n      if (observabilityError) {\n        observability?.onError?.({\n          ...observabilityError,\n          context: {\n            ...observabilityError.context,\n            componentName,\n          },\n        })\n      }\n\n      if (error instanceof UnprocessableEntityErrorObject && Array.isArray(error.errors)) {\n        const parsed = error.errors.flatMap(err => getFieldErrors(err))\n        if (parsed.length > 0) {\n          setFieldErrors(parsed)\n        } else {\n          const fallbackErrors: EntityErrorObject[] = error.errors\n            .filter(err => err.message)\n            .map(err => ({\n              errorKey: err.errorKey,\n              message: err.message ?? '',\n              category: err.category,\n            }))\n          if (fallbackErrors.length > 0) {\n            setFieldErrors(fallbackErrors)\n          }\n        }\n      }\n    },\n    [observability, componentName],\n  )\n\n  const baseSubmitHandler = useCallback(\n    async <T>(data: T, componentHandler: SubmitHandler<T>) => {\n      const startTime = Date.now()\n      setError(null)\n      setFieldErrors(null)\n\n      let success = false\n\n      try {\n        await componentHandler(data)\n        success = true\n      } catch (err) {\n        if (\n          err instanceof APIError ||\n          err instanceof SDKValidationError ||\n          err instanceof UnprocessableEntityErrorObject ||\n          err instanceof GustoEmbeddedError\n        ) {\n          processError(err)\n        } else throwError(err)\n      } finally {\n        const duration = Date.now() - startTime\n        observability?.onMetric?.({\n          name: 'sdk.form.submit_duration',\n          value: duration,\n          unit: 'ms',\n          tags: {\n            status: success ? 'success' : 'error',\n            ...(componentName && { component: componentName }),\n          },\n          timestamp: Date.now(),\n        })\n      }\n    },\n    [setError, throwError, observability, componentName, processError],\n  )\n\n  return {\n    baseSubmitHandler,\n    error,\n    fieldErrors,\n    setError: setErrorWithFieldsClear,\n  }\n}\n"],"names":["useBaseSubmit","componentName","error","setError","useState","fieldErrors","setFieldErrors","throwError","useAsyncError","observability","useObservability","setErrorWithFieldsClear","useCallback","processError","observabilityError","createObservabilityError","UnprocessableEntityErrorObject","parsed","err","getFieldErrors","fallbackErrors","data","componentHandler","startTime","success","APIError","SDKValidationError","GustoEmbeddedError","duration"],"mappings":";;;;;;;;;AAcO,MAAMA,IAAgB,CAACC,MAA2B;AACvD,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAA6B,IAAI,GACrD,CAACC,GAAaC,CAAc,IAAIF,EAAqC,IAAI,GACzEG,IAAaC,EAAA,GACb,EAAE,eAAAC,EAAA,IAAkBC,EAAA,GAGpBC,IAA0BC,EAAY,CAACV,MAA8B;AACzE,IAAAC,EAASD,CAAK,GACTA,KACHI,EAAe,IAAI;AAAA,EAEvB,GAAG,CAAA,CAAE,GAECO,IAAeD;AAAA,IACnB,CAACV,MAAuB;AACtB,MAAAC,EAASD,CAAK;AAGd,YAAMY,IAAqBC,EAAyBb,CAAK;AAWzD,UAVIY,KACFL,GAAe,UAAU;AAAA,QACvB,GAAGK;AAAA,QACH,SAAS;AAAA,UACP,GAAGA,EAAmB;AAAA,UACtB,eAAAb;AAAA,QAAA;AAAA,MACF,CACD,GAGCC,aAAiBc,KAAkC,MAAM,QAAQd,EAAM,MAAM,GAAG;AAClF,cAAMe,IAASf,EAAM,OAAO,QAAQ,CAAAgB,MAAOC,EAAeD,CAAG,CAAC;AAC9D,YAAID,EAAO,SAAS;AAClB,UAAAX,EAAeW,CAAM;AAAA,aAChB;AACL,gBAAMG,IAAsClB,EAAM,OAC/C,OAAO,OAAOgB,EAAI,OAAO,EACzB,IAAI,CAAAA,OAAQ;AAAA,YACX,UAAUA,EAAI;AAAA,YACd,SAASA,EAAI,WAAW;AAAA,YACxB,UAAUA,EAAI;AAAA,UAAA,EACd;AACJ,UAAIE,EAAe,SAAS,KAC1Bd,EAAec,CAAc;AAAA,QAEjC;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAACX,GAAeR,CAAa;AAAA,EAAA;AAwC/B,SAAO;AAAA,IACL,mBAtCwBW;AAAA,MACxB,OAAUS,GAASC,MAAuC;AACxD,cAAMC,IAAY,KAAK,IAAA;AACvB,QAAApB,EAAS,IAAI,GACbG,EAAe,IAAI;AAEnB,YAAIkB,IAAU;AAEd,YAAI;AACF,gBAAMF,EAAiBD,CAAI,GAC3BG,IAAU;AAAA,QACZ,SAASN,GAAK;AACZ,UACEA,aAAeO,KACfP,aAAeQ,KACfR,aAAeF,KACfE,aAAeS,IAEfd,EAAaK,CAAG,MACAA,CAAG;AAAA,QACvB,UAAA;AACE,gBAAMU,IAAW,KAAK,IAAA,IAAQL;AAC9B,UAAAd,GAAe,WAAW;AAAA,YACxB,MAAM;AAAA,YACN,OAAOmB;AAAA,YACP,MAAM;AAAA,YACN,MAAM;AAAA,cACJ,QAAQJ,IAAU,YAAY;AAAA,cAC9B,GAAIvB,KAAiB,EAAE,WAAWA,EAAA;AAAA,YAAc;AAAA,YAElD,WAAW,KAAK,IAAA;AAAA,UAAI,CACrB;AAAA,QACH;AAAA,MACF;AAAA,MACA,CAACE,GAAUI,GAAYE,GAAeR,GAAeY,CAAY;AAAA,IAAA;AAAA,IAKjE,OAAAX;AAAA,IACA,aAAAG;AAAA,IACA,UAAUM;AAAA,EAAA;AAEd;"}
+{"version":3,"file":"useBaseSubmit.js","sources":["../../../src/components/Base/useBaseSubmit.ts"],"sourcesContent":["import { useState, useCallback } from 'react'\nimport { APIError } from '@gusto/embedded-api/models/errors/apierror'\nimport { GustoEmbeddedError } from '@gusto/embedded-api/models/errors/gustoembeddederror'\nimport { SDKValidationError } from '@gusto/embedded-api/models/errors/sdkvalidationerror'\nimport { UnprocessableEntityErrorObject } from '@gusto/embedded-api/models/errors/unprocessableentityerrorobject'\nimport { useAsyncError } from '@/hooks/useAsyncError'\nimport { useObservability } from '@/contexts/ObservabilityProvider/useObservability'\nimport { type SDKError, SDKInternalError, normalizeToSDKError } from '@/types/sdkError'\n\ntype SubmitHandler<T> = (data: T) => Promise<void>\n\nexport const useBaseSubmit = (componentName?: string) => {\n  const [error, setError] = useState<SDKError | null>(null)\n  const throwError = useAsyncError()\n  const { observability } = useObservability()\n\n  const processError = useCallback(\n    (caughtError: GustoEmbeddedError | SDKValidationError | SDKInternalError) => {\n      const sdkError = normalizeToSDKError(caughtError)\n\n      setError(sdkError)\n\n      observability?.onError?.({ ...sdkError, timestamp: Date.now(), componentName })\n    },\n    [observability, componentName],\n  )\n\n  const baseSubmitHandler = useCallback(\n    async <T>(data: T, componentHandler: SubmitHandler<T>) => {\n      const startTime = Date.now()\n      setError(null)\n\n      let success = false\n\n      try {\n        await componentHandler(data)\n        success = true\n      } catch (err) {\n        if (\n          err instanceof APIError ||\n          err instanceof SDKValidationError ||\n          err instanceof UnprocessableEntityErrorObject ||\n          err instanceof GustoEmbeddedError ||\n          err instanceof SDKInternalError\n        ) {\n          processError(err)\n        } else throwError(err)\n      } finally {\n        const duration = Date.now() - startTime\n        observability?.onMetric?.({\n          name: 'sdk.form.submit_duration',\n          value: duration,\n          unit: 'ms',\n          tags: {\n            status: success ? 'success' : 'error',\n            ...(componentName && { component: componentName }),\n          },\n          timestamp: Date.now(),\n        })\n      }\n    },\n    [setError, throwError, observability, componentName, processError],\n  )\n\n  return {\n    baseSubmitHandler,\n    error,\n    setError,\n  }\n}\n"],"names":["useBaseSubmit","componentName","error","setError","useState","throwError","useAsyncError","observability","useObservability","processError","useCallback","caughtError","sdkError","normalizeToSDKError","data","componentHandler","startTime","success","err","APIError","SDKValidationError","UnprocessableEntityErrorObject","GustoEmbeddedError","SDKInternalError","duration"],"mappings":";;;;;;;;AAWO,MAAMA,IAAgB,CAACC,MAA2B;AACvD,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAA0B,IAAI,GAClDC,IAAaC,EAAA,GACb,EAAE,eAAAC,EAAA,IAAkBC,EAAA,GAEpBC,IAAeC;AAAA,IACnB,CAACC,MAA4E;AAC3E,YAAMC,IAAWC,EAAoBF,CAAW;AAEhD,MAAAR,EAASS,CAAQ,GAEjBL,GAAe,UAAU,EAAE,GAAGK,GAAU,WAAW,KAAK,OAAO,eAAAX,GAAe;AAAA,IAChF;AAAA,IACA,CAACM,GAAeN,CAAa;AAAA,EAAA;AAwC/B,SAAO;AAAA,IACL,mBAtCwBS;AAAA,MACxB,OAAUI,GAASC,MAAuC;AACxD,cAAMC,IAAY,KAAK,IAAA;AACvB,QAAAb,EAAS,IAAI;AAEb,YAAIc,IAAU;AAEd,YAAI;AACF,gBAAMF,EAAiBD,CAAI,GAC3BG,IAAU;AAAA,QACZ,SAASC,GAAK;AACZ,UACEA,aAAeC,KACfD,aAAeE,KACfF,aAAeG,KACfH,aAAeI,KACfJ,aAAeK,IAEfd,EAAaS,CAAG,MACAA,CAAG;AAAA,QACvB,UAAA;AACE,gBAAMM,IAAW,KAAK,IAAA,IAAQR;AAC9B,UAAAT,GAAe,WAAW;AAAA,YACxB,MAAM;AAAA,YACN,OAAOiB;AAAA,YACP,MAAM;AAAA,YACN,MAAM;AAAA,cACJ,QAAQP,IAAU,YAAY;AAAA,cAC9B,GAAIhB,KAAiB,EAAE,WAAWA,EAAA;AAAA,YAAc;AAAA,YAElD,WAAW,KAAK,IAAA;AAAA,UAAI,CACrB;AAAA,QACH;AAAA,MACF;AAAA,MACA,CAACE,GAAUE,GAAYE,GAAeN,GAAeQ,CAAY;AAAA,IAAA;AAAA,IAKjE,OAAAP;AAAA,IACA,UAAAC;AAAA,EAAA;AAEJ;"}

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

@@ -1,61 +1,67 @@
-import { jsxs as a, jsx as l } from "react/jsx-runtime";
-import { useId as g } from "react";
-import { useTranslation as x } from "react-i18next";
-import s from "./DataCards.module.scss.js";
-import { Flex as L } from "../../Flex/Flex.js";
-import { useComponentContext as N } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-const H = ({
-  data: d,
-  columns: p,
-  itemMenu: c,
-  onSelect: o,
-  isItemSelected: f,
-  emptyState: m,
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+import { useId as N } from "react";
+import { useTranslation as D } from "react-i18next";
+import a from "./DataCards.module.scss.js";
+import { Flex as C } from "../../Flex/Flex.js";
+import { useComponentContext as I } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+const V = ({
+  data: c,
+  columns: d,
+  itemMenu: m,
+  onSelect: s,
+  isItemSelected: v,
+  emptyState: u,
   footer: h,
-  selectionMode: C = "multiple"
+  selectionMode: b = "multiple"
 }) => {
-  const i = N(), { t: u } = x("common"), v = g(), b = (e, t) => {
-    if (!o) return;
-    const r = f?.(e, t) ?? !1;
-    return C === "single" ? /* @__PURE__ */ l(
+  const i = I(), { t: p } = D("common"), x = N(), g = (r, t) => {
+    if (!s) return;
+    const l = v?.(r, t) ?? !1;
+    return b === "single" ? /* @__PURE__ */ e(
       i.Radio,
       {
-        name: v,
-        value: r,
+        name: x,
+        value: l,
         onChange: () => {
-          o(e, !0);
+          s(r, !0);
         },
-        label: u("card.selectRowLabel"),
+        label: p("card.selectRowLabel"),
         shouldVisuallyHideLabel: !0
       }
-    ) : /* @__PURE__ */ l(
+    ) : /* @__PURE__ */ e(
       i.Checkbox,
       {
-        value: r,
+        value: l,
         onChange: (n) => {
-          o(e, n);
+          s(r, n);
         },
-        label: u("card.selectRowLabel"),
+        label: p("card.selectRowLabel"),
         shouldVisuallyHideLabel: !0
       }
     );
   };
-  return /* @__PURE__ */ a("div", { role: "list", "data-testid": "data-cards", children: [
-    d.length === 0 && m && /* @__PURE__ */ l("div", { role: "listitem", children: /* @__PURE__ */ l(i.Card, { children: m() }) }),
-    d.map((e, t) => /* @__PURE__ */ l("div", { role: "listitem", children: /* @__PURE__ */ l(i.Card, { menu: c && c(e), action: b(e, t), children: p.map((r, n) => /* @__PURE__ */ a(L, { flexDirection: "column", gap: 0, children: [
-      r.title && /* @__PURE__ */ l("h5", { className: s.columnTitle, children: r.title }),
-      /* @__PURE__ */ a("div", { className: s.columnData, children: [
+  return /* @__PURE__ */ o("div", { role: "list", "data-testid": "data-cards", children: [
+    c.length === 0 && u && /* @__PURE__ */ e("div", { role: "listitem", children: /* @__PURE__ */ e(i.Card, { children: u() }) }),
+    c.map((r, t) => /* @__PURE__ */ e("div", { role: "listitem", children: /* @__PURE__ */ e(i.Card, { menu: m && m(r), action: g(r, t), children: d.map((l, n) => /* @__PURE__ */ o(C, { flexDirection: "column", gap: 0, children: [
+      l.title && /* @__PURE__ */ e("h5", { className: a.columnTitle, children: l.title }),
+      /* @__PURE__ */ o("div", { className: a.columnData, children: [
         " ",
-        r.render ? r.render(e) : String(e[r.key])
+        l.render ? l.render(r) : String(r[l.key])
       ] })
     ] }, n)) }) }, t)),
-    h && /* @__PURE__ */ l("div", { role: "listitem", children: /* @__PURE__ */ l(i.Card, { children: (() => {
-      const e = h();
-      return Object.entries(e).map(([t, r]) => /* @__PURE__ */ l("div", { className: s.footerItem, children: r }, t));
+    h && /* @__PURE__ */ e("div", { role: "listitem", children: /* @__PURE__ */ e(i.Card, { children: (() => {
+      const r = h();
+      return Object.entries(r).map(([t, l]) => {
+        const n = t.startsWith("column-") ? parseInt(t.replace("column-", ""), 10) : -1, f = n >= 0 ? d[n]?.title : void 0;
+        return /* @__PURE__ */ o(C, { flexDirection: "column", gap: 0, children: [
+          f && /* @__PURE__ */ e("h5", { className: a.columnTitle, children: f }),
+          /* @__PURE__ */ e("div", { className: a.footerItem, children: l })
+        ] }, t);
+      });
     })() }) })
   ] });
 };
 export {
-  H as DataCards
+  V as DataCards
 };
 //# sourceMappingURL=DataCards.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DataCards.js","sources":["../../../../../src/components/Common/DataView/DataCards/DataCards.tsx"],"sourcesContent":["import { useId } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport styles from './DataCards.module.scss'\nimport type { useDataViewPropReturn, SelectionMode } from '@/components/Common/DataView/useDataView'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nexport type DataCardsProps<T> = {\n  columns: useDataViewPropReturn<T>['columns']\n  data: useDataViewPropReturn<T>['data']\n  itemMenu?: useDataViewPropReturn<T>['itemMenu']\n  onSelect?: useDataViewPropReturn<T>['onSelect']\n  isItemSelected?: useDataViewPropReturn<T>['isItemSelected']\n  emptyState?: useDataViewPropReturn<T>['emptyState']\n  footer?: useDataViewPropReturn<T>['footer']\n  selectionMode?: SelectionMode\n}\n\nexport const DataCards = <T,>({\n  data,\n  columns,\n  itemMenu,\n  onSelect,\n  isItemSelected,\n  emptyState,\n  footer,\n  selectionMode = 'multiple',\n}: DataCardsProps<T>) => {\n  const Components = useComponentContext()\n  const { t } = useTranslation('common')\n  const radioGroupName = useId()\n\n  const renderAction = (item: T, index: number) => {\n    if (!onSelect) return undefined\n\n    const isSelected = isItemSelected?.(item, index) ?? false\n\n    if (selectionMode === 'single') {\n      return (\n        <Components.Radio\n          name={radioGroupName}\n          value={isSelected}\n          onChange={() => {\n            onSelect(item, true)\n          }}\n          label={t('card.selectRowLabel')}\n          shouldVisuallyHideLabel\n        />\n      )\n    }\n\n    return (\n      <Components.Checkbox\n        value={isSelected}\n        onChange={(checked: boolean) => {\n          onSelect(item, checked)\n        }}\n        label={t('card.selectRowLabel')}\n        shouldVisuallyHideLabel\n      />\n    )\n  }\n\n  return (\n    <div role=\"list\" data-testid=\"data-cards\">\n      {data.length === 0 && emptyState && (\n        <div role=\"listitem\">\n          <Components.Card>{emptyState()}</Components.Card>\n        </div>\n      )}\n      {data.map((item, index) => (\n        <div role=\"listitem\" key={index}>\n          <Components.Card menu={itemMenu && itemMenu(item)} action={renderAction(item, index)}>\n            {columns.map((column, colIndex) => (\n              <Flex key={colIndex} flexDirection=\"column\" gap={0}>\n                {column.title && <h5 className={styles.columnTitle}>{column.title}</h5>}\n                <div className={styles.columnData}>\n                  {' '}\n                  {column.render ? column.render(item) : String(item[column.key as keyof T])}\n                </div>\n              </Flex>\n            ))}\n          </Components.Card>\n        </div>\n      ))}\n      {footer && (\n        <div role=\"listitem\">\n          <Components.Card>\n            {(() => {\n              const footerContent = footer()\n\n              return Object.entries(footerContent).map(([key, content]) => (\n                <div key={key} className={styles.footerItem}>\n                  {content}\n                </div>\n              ))\n            })()}\n          </Components.Card>\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["DataCards","data","columns","itemMenu","onSelect","isItemSelected","emptyState","footer","selectionMode","Components","useComponentContext","t","useTranslation","radioGroupName","useId","renderAction","item","index","isSelected","jsx","checked","jsxs","column","colIndex","Flex","styles","footerContent","key","content"],"mappings":";;;;;;AAkBO,MAAMA,IAAY,CAAK;AAAA,EAC5B,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,QAAAC;AAAA,EACA,eAAAC,IAAgB;AAClB,MAAyB;AACvB,QAAMC,IAAaC,EAAA,GACb,EAAE,GAAAC,EAAA,IAAMC,EAAe,QAAQ,GAC/BC,IAAiBC,EAAA,GAEjBC,IAAe,CAACC,GAASC,MAAkB;AAC/C,QAAI,CAACb,EAAU;AAEf,UAAMc,IAAab,IAAiBW,GAAMC,CAAK,KAAK;AAEpD,WAAIT,MAAkB,WAElB,gBAAAW;AAAA,MAACV,EAAW;AAAA,MAAX;AAAA,QACC,MAAMI;AAAA,QACN,OAAOK;AAAA,QACP,UAAU,MAAM;AACd,UAAAd,EAASY,GAAM,EAAI;AAAA,QACrB;AAAA,QACA,OAAOL,EAAE,qBAAqB;AAAA,QAC9B,yBAAuB;AAAA,MAAA;AAAA,IAAA,IAM3B,gBAAAQ;AAAA,MAACV,EAAW;AAAA,MAAX;AAAA,QACC,OAAOS;AAAA,QACP,UAAU,CAACE,MAAqB;AAC9B,UAAAhB,EAASY,GAAMI,CAAO;AAAA,QACxB;AAAA,QACA,OAAOT,EAAE,qBAAqB;AAAA,QAC9B,yBAAuB;AAAA,MAAA;AAAA,IAAA;AAAA,EAG7B;AAEA,SACE,gBAAAU,EAAC,OAAA,EAAI,MAAK,QAAO,eAAY,cAC1B,UAAA;AAAA,IAAApB,EAAK,WAAW,KAAKK,KACpB,gBAAAa,EAAC,OAAA,EAAI,MAAK,YACR,UAAA,gBAAAA,EAACV,EAAW,MAAX,EAAiB,UAAAH,EAAA,GAAa,GACjC;AAAA,IAEDL,EAAK,IAAI,CAACe,GAAMC,MACf,gBAAAE,EAAC,OAAA,EAAI,MAAK,YACR,UAAA,gBAAAA,EAACV,EAAW,MAAX,EAAgB,MAAMN,KAAYA,EAASa,CAAI,GAAG,QAAQD,EAAaC,GAAMC,CAAK,GAChF,UAAAf,EAAQ,IAAI,CAACoB,GAAQC,MACpB,gBAAAF,EAACG,GAAA,EAAoB,eAAc,UAAS,KAAK,GAC9C,UAAA;AAAA,MAAAF,EAAO,SAAS,gBAAAH,EAAC,MAAA,EAAG,WAAWM,EAAO,aAAc,YAAO,MAAA,CAAM;AAAA,MAClE,gBAAAJ,EAAC,OAAA,EAAI,WAAWI,EAAO,YACpB,UAAA;AAAA,QAAA;AAAA,QACAH,EAAO,SAASA,EAAO,OAAON,CAAI,IAAI,OAAOA,EAAKM,EAAO,GAAc,CAAC;AAAA,MAAA,EAAA,CAC3E;AAAA,IAAA,EAAA,GALSC,CAMX,CACD,EAAA,CACH,EAAA,GAXwBN,CAY1B,CACD;AAAA,IACAV,uBACE,OAAA,EAAI,MAAK,YACR,UAAA,gBAAAY,EAACV,EAAW,MAAX,EACG,WAAA,MAAM;AACN,YAAMiB,IAAgBnB,EAAA;AAEtB,aAAO,OAAO,QAAQmB,CAAa,EAAE,IAAI,CAAC,CAACC,GAAKC,CAAO,wBACpD,OAAA,EAAc,WAAWH,EAAO,YAC9B,UAAAG,EAAA,GADOD,CAEV,CACD;AAAA,IACH,GAAA,GACF,EAAA,CACF;AAAA,EAAA,GAEJ;AAEJ;"}
+{"version":3,"file":"DataCards.js","sources":["../../../../../src/components/Common/DataView/DataCards/DataCards.tsx"],"sourcesContent":["import { useId } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport styles from './DataCards.module.scss'\nimport type { useDataViewPropReturn, SelectionMode } from '@/components/Common/DataView/useDataView'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nexport type DataCardsProps<T> = {\n  columns: useDataViewPropReturn<T>['columns']\n  data: useDataViewPropReturn<T>['data']\n  itemMenu?: useDataViewPropReturn<T>['itemMenu']\n  onSelect?: useDataViewPropReturn<T>['onSelect']\n  isItemSelected?: useDataViewPropReturn<T>['isItemSelected']\n  emptyState?: useDataViewPropReturn<T>['emptyState']\n  footer?: useDataViewPropReturn<T>['footer']\n  selectionMode?: SelectionMode\n}\n\nexport const DataCards = <T,>({\n  data,\n  columns,\n  itemMenu,\n  onSelect,\n  isItemSelected,\n  emptyState,\n  footer,\n  selectionMode = 'multiple',\n}: DataCardsProps<T>) => {\n  const Components = useComponentContext()\n  const { t } = useTranslation('common')\n  const radioGroupName = useId()\n\n  const renderAction = (item: T, index: number) => {\n    if (!onSelect) return undefined\n\n    const isSelected = isItemSelected?.(item, index) ?? false\n\n    if (selectionMode === 'single') {\n      return (\n        <Components.Radio\n          name={radioGroupName}\n          value={isSelected}\n          onChange={() => {\n            onSelect(item, true)\n          }}\n          label={t('card.selectRowLabel')}\n          shouldVisuallyHideLabel\n        />\n      )\n    }\n\n    return (\n      <Components.Checkbox\n        value={isSelected}\n        onChange={(checked: boolean) => {\n          onSelect(item, checked)\n        }}\n        label={t('card.selectRowLabel')}\n        shouldVisuallyHideLabel\n      />\n    )\n  }\n\n  return (\n    <div role=\"list\" data-testid=\"data-cards\">\n      {data.length === 0 && emptyState && (\n        <div role=\"listitem\">\n          <Components.Card>{emptyState()}</Components.Card>\n        </div>\n      )}\n      {data.map((item, index) => (\n        <div role=\"listitem\" key={index}>\n          <Components.Card menu={itemMenu && itemMenu(item)} action={renderAction(item, index)}>\n            {columns.map((column, colIndex) => (\n              <Flex key={colIndex} flexDirection=\"column\" gap={0}>\n                {column.title && <h5 className={styles.columnTitle}>{column.title}</h5>}\n                <div className={styles.columnData}>\n                  {' '}\n                  {column.render ? column.render(item) : String(item[column.key as keyof T])}\n                </div>\n              </Flex>\n            ))}\n          </Components.Card>\n        </div>\n      ))}\n      {footer && (\n        <div role=\"listitem\">\n          <Components.Card>\n            {(() => {\n              const footerContent = footer()\n\n              return Object.entries(footerContent).map(([key, content]) => {\n                const columnIndex = key.startsWith('column-')\n                  ? parseInt(key.replace('column-', ''), 10)\n                  : -1\n                const columnTitle = columnIndex >= 0 ? columns[columnIndex]?.title : undefined\n\n                return (\n                  <Flex key={key} flexDirection=\"column\" gap={0}>\n                    {columnTitle && <h5 className={styles.columnTitle}>{columnTitle}</h5>}\n                    <div className={styles.footerItem}>{content}</div>\n                  </Flex>\n                )\n              })\n            })()}\n          </Components.Card>\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["DataCards","data","columns","itemMenu","onSelect","isItemSelected","emptyState","footer","selectionMode","Components","useComponentContext","t","useTranslation","radioGroupName","useId","renderAction","item","index","isSelected","jsx","checked","jsxs","column","colIndex","Flex","styles","footerContent","key","content","columnIndex","columnTitle"],"mappings":";;;;;;AAkBO,MAAMA,IAAY,CAAK;AAAA,EAC5B,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,QAAAC;AAAA,EACA,eAAAC,IAAgB;AAClB,MAAyB;AACvB,QAAMC,IAAaC,EAAA,GACb,EAAE,GAAAC,EAAA,IAAMC,EAAe,QAAQ,GAC/BC,IAAiBC,EAAA,GAEjBC,IAAe,CAACC,GAASC,MAAkB;AAC/C,QAAI,CAACb,EAAU;AAEf,UAAMc,IAAab,IAAiBW,GAAMC,CAAK,KAAK;AAEpD,WAAIT,MAAkB,WAElB,gBAAAW;AAAA,MAACV,EAAW;AAAA,MAAX;AAAA,QACC,MAAMI;AAAA,QACN,OAAOK;AAAA,QACP,UAAU,MAAM;AACd,UAAAd,EAASY,GAAM,EAAI;AAAA,QACrB;AAAA,QACA,OAAOL,EAAE,qBAAqB;AAAA,QAC9B,yBAAuB;AAAA,MAAA;AAAA,IAAA,IAM3B,gBAAAQ;AAAA,MAACV,EAAW;AAAA,MAAX;AAAA,QACC,OAAOS;AAAA,QACP,UAAU,CAACE,MAAqB;AAC9B,UAAAhB,EAASY,GAAMI,CAAO;AAAA,QACxB;AAAA,QACA,OAAOT,EAAE,qBAAqB;AAAA,QAC9B,yBAAuB;AAAA,MAAA;AAAA,IAAA;AAAA,EAG7B;AAEA,SACE,gBAAAU,EAAC,OAAA,EAAI,MAAK,QAAO,eAAY,cAC1B,UAAA;AAAA,IAAApB,EAAK,WAAW,KAAKK,KACpB,gBAAAa,EAAC,OAAA,EAAI,MAAK,YACR,UAAA,gBAAAA,EAACV,EAAW,MAAX,EAAiB,UAAAH,EAAA,GAAa,GACjC;AAAA,IAEDL,EAAK,IAAI,CAACe,GAAMC,MACf,gBAAAE,EAAC,OAAA,EAAI,MAAK,YACR,UAAA,gBAAAA,EAACV,EAAW,MAAX,EAAgB,MAAMN,KAAYA,EAASa,CAAI,GAAG,QAAQD,EAAaC,GAAMC,CAAK,GAChF,UAAAf,EAAQ,IAAI,CAACoB,GAAQC,MACpB,gBAAAF,EAACG,GAAA,EAAoB,eAAc,UAAS,KAAK,GAC9C,UAAA;AAAA,MAAAF,EAAO,SAAS,gBAAAH,EAAC,MAAA,EAAG,WAAWM,EAAO,aAAc,YAAO,MAAA,CAAM;AAAA,MAClE,gBAAAJ,EAAC,OAAA,EAAI,WAAWI,EAAO,YACpB,UAAA;AAAA,QAAA;AAAA,QACAH,EAAO,SAASA,EAAO,OAAON,CAAI,IAAI,OAAOA,EAAKM,EAAO,GAAc,CAAC;AAAA,MAAA,EAAA,CAC3E;AAAA,IAAA,EAAA,GALSC,CAMX,CACD,EAAA,CACH,EAAA,GAXwBN,CAY1B,CACD;AAAA,IACAV,uBACE,OAAA,EAAI,MAAK,YACR,UAAA,gBAAAY,EAACV,EAAW,MAAX,EACG,WAAA,MAAM;AACN,YAAMiB,IAAgBnB,EAAA;AAEtB,aAAO,OAAO,QAAQmB,CAAa,EAAE,IAAI,CAAC,CAACC,GAAKC,CAAO,MAAM;AAC3D,cAAMC,IAAcF,EAAI,WAAW,SAAS,IACxC,SAASA,EAAI,QAAQ,WAAW,EAAE,GAAG,EAAE,IACvC,IACEG,IAAcD,KAAe,IAAI3B,EAAQ2B,CAAW,GAAG,QAAQ;AAErE,eACE,gBAAAR,EAACG,GAAA,EAAe,eAAc,UAAS,KAAK,GACzC,UAAA;AAAA,UAAAM,KAAe,gBAAAX,EAAC,MAAA,EAAG,WAAWM,EAAO,aAAc,UAAAK,GAAY;AAAA,UAChE,gBAAAX,EAAC,OAAA,EAAI,WAAWM,EAAO,YAAa,UAAAG,EAAA,CAAQ;AAAA,QAAA,EAAA,GAFnCD,CAGX;AAAA,MAEJ,CAAC;AAAA,IACH,GAAA,GACF,EAAA,CACF;AAAA,EAAA,GAEJ;AAEJ;"}

package/dist/components/Common/Fields/CheckboxField/CheckboxField.d.ts

@@ -1,5 +1,7 @@
+import { ComponentType } from 'react';
 import { UseFieldProps } from '../hooks/useField';
 import { CheckboxProps } from '../../UI/Checkbox/CheckboxTypes';
 export interface CheckboxFieldProps extends Omit<CheckboxProps, 'name' | 'value' | 'isInvalid'>, UseFieldProps<boolean> {
+    FieldComponent?: ComponentType<CheckboxProps>;
 }
 export declare const CheckboxField: React.FC<CheckboxFieldProps>;

package/dist/components/Common/Fields/CheckboxField/CheckboxField.js

@@ -1,34 +1,37 @@
-import { jsx as d } from "react/jsx-runtime";
-import { useField as l } from "../hooks/useField.js";
-import { useComponentContext as u } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-const F = ({
+import { jsx as b } from "react/jsx-runtime";
+import { useField as h } from "../hooks/useField.js";
+import { useComponentContext as k } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+const R = ({
   rules: o,
   defaultValue: e,
   name: t,
+  control: n,
   errorMessage: r,
-  isRequired: n,
-  onChange: m,
-  transform: s,
-  description: p,
+  isRequired: m,
+  onChange: s,
+  transform: p,
+  description: c,
   onBlur: i,
-  inputRef: c,
-  ...x
+  inputRef: C,
+  FieldComponent: x,
+  ...d
 }) => {
-  const C = u(), f = l({
+  const f = k(), l = h({
     name: t,
+    control: n,
     rules: o,
     defaultValue: e,
     errorMessage: r,
-    isRequired: n,
-    onChange: m,
-    transform: s,
-    description: p,
+    isRequired: m,
+    onChange: s,
+    transform: p,
+    description: c,
     onBlur: i,
-    inputRef: c
-  });
-  return /* @__PURE__ */ d(C.Checkbox, { ...x, ...f });
+    inputRef: C
+  }), u = x ?? f.Checkbox;
+  return /* @__PURE__ */ b(u, { ...d, ...l });
 };
 export {
-  F as CheckboxField
+  R as CheckboxField
 };
 //# sourceMappingURL=CheckboxField.js.map

package/dist/components/Common/Fields/CheckboxField/CheckboxField.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxField.js","sources":["../../../../../src/components/Common/Fields/CheckboxField/CheckboxField.tsx"],"sourcesContent":["import { useField, type UseFieldProps } from '@/components/Common/Fields/hooks/useField'\nimport type { CheckboxProps } from '@/components/Common/UI/Checkbox/CheckboxTypes'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nexport interface CheckboxFieldProps\n  extends Omit<CheckboxProps, 'name' | 'value' | 'isInvalid'>, UseFieldProps<boolean> {}\n\nexport const CheckboxField: React.FC<CheckboxFieldProps> = ({\n  rules,\n  defaultValue,\n  name,\n  errorMessage,\n  isRequired,\n  onChange,\n  transform,\n  description,\n  onBlur,\n  inputRef,\n  ...checkboxProps\n}: CheckboxFieldProps) => {\n  const Components = useComponentContext()\n  const fieldProps = useField({\n    name,\n    rules,\n    defaultValue,\n    errorMessage,\n    isRequired,\n    onChange,\n    transform,\n    description,\n    onBlur,\n    inputRef,\n  })\n\n  return <Components.Checkbox {...checkboxProps} {...fieldProps} />\n}\n"],"names":["CheckboxField","rules","defaultValue","name","errorMessage","isRequired","onChange","transform","description","onBlur","inputRef","checkboxProps","Components","useComponentContext","fieldProps","useField"],"mappings":";;;AAOO,MAAMA,IAA8C,CAAC;AAAA,EAC1D,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAA0B;AACxB,QAAMC,IAAaC,EAAA,GACbC,IAAaC,EAAS;AAAA,IAC1B,MAAAZ;AAAA,IACA,OAAAF;AAAA,IACA,cAAAC;AAAA,IACA,cAAAE;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,aAAAC;AAAA,IACA,QAAAC;AAAA,IACA,UAAAC;AAAA,EAAA,CACD;AAED,2BAAQE,EAAW,UAAX,EAAqB,GAAGD,GAAgB,GAAGG,GAAY;AACjE;"}
+{"version":3,"file":"CheckboxField.js","sources":["../../../../../src/components/Common/Fields/CheckboxField/CheckboxField.tsx"],"sourcesContent":["import type { ComponentType } from 'react'\nimport { useField, type UseFieldProps } from '@/components/Common/Fields/hooks/useField'\nimport type { CheckboxProps } from '@/components/Common/UI/Checkbox/CheckboxTypes'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nexport interface CheckboxFieldProps\n  extends Omit<CheckboxProps, 'name' | 'value' | 'isInvalid'>, UseFieldProps<boolean> {\n  FieldComponent?: ComponentType<CheckboxProps>\n}\n\nexport const CheckboxField: React.FC<CheckboxFieldProps> = ({\n  rules,\n  defaultValue,\n  name,\n  control,\n  errorMessage,\n  isRequired,\n  onChange,\n  transform,\n  description,\n  onBlur,\n  inputRef,\n  FieldComponent,\n  ...checkboxProps\n}: CheckboxFieldProps) => {\n  const Components = useComponentContext()\n  const fieldProps = useField({\n    name,\n    control,\n    rules,\n    defaultValue,\n    errorMessage,\n    isRequired,\n    onChange,\n    transform,\n    description,\n    onBlur,\n    inputRef,\n  })\n\n  const RenderComponent = FieldComponent ?? Components.Checkbox\n  return <RenderComponent {...checkboxProps} {...fieldProps} />\n}\n"],"names":["CheckboxField","rules","defaultValue","name","control","errorMessage","isRequired","onChange","transform","description","onBlur","inputRef","FieldComponent","checkboxProps","Components","useComponentContext","fieldProps","useField","RenderComponent","jsx"],"mappings":";;;AAUO,MAAMA,IAA8C,CAAC;AAAA,EAC1D,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,GAAGC;AACL,MAA0B;AACxB,QAAMC,IAAaC,EAAA,GACbC,IAAaC,EAAS;AAAA,IAC1B,MAAAd;AAAA,IACA,SAAAC;AAAA,IACA,OAAAH;AAAA,IACA,cAAAC;AAAA,IACA,cAAAG;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,aAAAC;AAAA,IACA,QAAAC;AAAA,IACA,UAAAC;AAAA,EAAA,CACD,GAEKO,IAAkBN,KAAkBE,EAAW;AACrD,SAAO,gBAAAK,EAACD,GAAA,EAAiB,GAAGL,GAAgB,GAAGG,EAAA,CAAY;AAC7D;"}

package/dist/components/Common/Fields/CheckboxGroupField/CheckboxGroupField.d.ts

@@ -6,5 +6,5 @@ export interface CheckboxGroupFieldProps<TValue> extends Omit<CheckboxGroupProps
     options: GenericCheckboxGroupOption<TValue>[];
     convertValueToString?: (value: TValue) => string;
 }
-export declare const CheckboxGroupField: <TValue = string>({ rules, defaultValue, name, errorMessage, isRequired, onChange: onChangeFromProps, transform, options, description, onBlur, inputRef, convertValueToString, ...checkboxGroupProps }: CheckboxGroupFieldProps<TValue>) => import("react/jsx-runtime").JSX.Element;
+export declare const CheckboxGroupField: <TValue = string>({ rules, defaultValue, name, control, errorMessage, isRequired, onChange: onChangeFromProps, transform, options, description, onBlur, inputRef, convertValueToString, ...checkboxGroupProps }: CheckboxGroupFieldProps<TValue>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Common/Fields/CheckboxGroupField/CheckboxGroupField.js

@@ -1,42 +1,44 @@
-import { jsx as x } from "react/jsx-runtime";
-import { useField as F } from "../hooks/useField.js";
-import { useComponentContext as G } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useStringifyGenericFieldValueArray as b } from "../hooks/useStringifyGenericFieldValue.js";
-const v = ({
+import { jsx as F } from "react/jsx-runtime";
+import { useField as G } from "../hooks/useField.js";
+import { useComponentContext as b } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useStringifyGenericFieldValueArray as k } from "../hooks/useStringifyGenericFieldValue.js";
+const A = ({
   rules: o,
   defaultValue: e,
   name: r,
-  errorMessage: n,
-  isRequired: t,
-  onChange: i,
-  transform: s,
-  options: p,
-  description: m,
-  onBlur: u,
-  inputRef: C,
-  convertValueToString: c,
-  ...l
+  control: n,
+  errorMessage: t,
+  isRequired: i,
+  onChange: s,
+  transform: p,
+  options: m,
+  description: u,
+  onBlur: C,
+  inputRef: c,
+  convertValueToString: l,
+  ...a
 }) => {
-  const a = G(), { value: f, onChange: d, ...g } = F({
+  const f = b(), { value: d, onChange: g, ...h } = G({
     name: r,
+    control: n,
     rules: o,
     defaultValue: e,
-    errorMessage: n,
-    isRequired: t,
-    onChange: i,
-    transform: s,
-    description: m,
-    onBlur: u,
-    inputRef: C
-  }), h = b({
-    options: p,
-    value: f,
-    onChange: d,
-    convertValueToString: c
+    errorMessage: t,
+    isRequired: i,
+    onChange: s,
+    transform: p,
+    description: u,
+    onBlur: C,
+    inputRef: c
+  }), x = k({
+    options: m,
+    value: d,
+    onChange: g,
+    convertValueToString: l
   });
-  return /* @__PURE__ */ x(a.CheckboxGroup, { ...l, ...g, ...h });
+  return /* @__PURE__ */ F(f.CheckboxGroup, { ...a, ...h, ...x });
 };
 export {
-  v as CheckboxGroupField
+  A as CheckboxGroupField
 };
 //# sourceMappingURL=CheckboxGroupField.js.map

package/dist/components/Common/Fields/CheckboxGroupField/CheckboxGroupField.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroupField.js","sources":["../../../../../src/components/Common/Fields/CheckboxGroupField/CheckboxGroupField.tsx"],"sourcesContent":["import { useField, type UseFieldProps } from '@/components/Common/Fields/hooks/useField'\nimport type { CheckboxGroupProps } from '@/components/Common/UI/CheckboxGroup/CheckboxGroupTypes'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport type { CheckboxGroupOption } from '@/components/Common/UI/CheckboxGroup/CheckboxGroupTypes'\nimport {\n  useStringifyGenericFieldValueArray,\n  type OptionWithGenericValue,\n} from '@/components/Common/Fields/hooks/useStringifyGenericFieldValue'\n\ntype GenericCheckboxGroupOption<TValue> = OptionWithGenericValue<TValue, CheckboxGroupOption>\n\nexport interface CheckboxGroupFieldProps<TValue>\n  extends\n    Omit<CheckboxGroupProps, 'value' | 'onChange' | 'options' | 'isInvalid'>,\n    UseFieldProps<TValue[]> {\n  options: GenericCheckboxGroupOption<TValue>[]\n  convertValueToString?: (value: TValue) => string\n}\n\nexport const CheckboxGroupField = <TValue = string,>({\n  rules,\n  defaultValue,\n  name,\n  errorMessage,\n  isRequired,\n  onChange: onChangeFromProps,\n  transform,\n  options,\n  description,\n  onBlur,\n  inputRef,\n  convertValueToString,\n  ...checkboxGroupProps\n}: CheckboxGroupFieldProps<TValue>) => {\n  const Components = useComponentContext()\n  const { value, onChange, ...fieldProps } = useField({\n    name,\n    rules,\n    defaultValue,\n    errorMessage,\n    isRequired,\n    onChange: onChangeFromProps,\n    transform,\n    description,\n    onBlur,\n    inputRef,\n  })\n\n  const stringFieldProps = useStringifyGenericFieldValueArray<TValue, CheckboxGroupOption>({\n    options,\n    value,\n    onChange,\n    convertValueToString,\n  })\n\n  return <Components.CheckboxGroup {...checkboxGroupProps} {...fieldProps} {...stringFieldProps} />\n}\n"],"names":["CheckboxGroupField","rules","defaultValue","name","errorMessage","isRequired","onChangeFromProps","transform","options","description","onBlur","inputRef","convertValueToString","checkboxGroupProps","Components","useComponentContext","value","onChange","fieldProps","useField","stringFieldProps","useStringifyGenericFieldValueArray","jsx"],"mappings":";;;;AAmBO,MAAMA,IAAqB,CAAmB;AAAA,EACnD,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAUC;AAAA,EACV,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,aAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,GAAGC;AACL,MAAuC;AACrC,QAAMC,IAAaC,EAAA,GACb,EAAE,OAAAC,GAAO,UAAAC,GAAU,GAAGC,EAAA,IAAeC,EAAS;AAAA,IAClD,MAAAhB;AAAA,IACA,OAAAF;AAAA,IACA,cAAAC;AAAA,IACA,cAAAE;AAAA,IACA,YAAAC;AAAA,IACA,UAAUC;AAAA,IACV,WAAAC;AAAA,IACA,aAAAE;AAAA,IACA,QAAAC;AAAA,IACA,UAAAC;AAAA,EAAA,CACD,GAEKS,IAAmBC,EAAgE;AAAA,IACvF,SAAAb;AAAA,IACA,OAAAQ;AAAA,IACA,UAAAC;AAAA,IACA,sBAAAL;AAAA,EAAA,CACD;AAED,SAAO,gBAAAU,EAACR,EAAW,eAAX,EAA0B,GAAGD,GAAqB,GAAGK,GAAa,GAAGE,GAAkB;AACjG;"}
+{"version":3,"file":"CheckboxGroupField.js","sources":["../../../../../src/components/Common/Fields/CheckboxGroupField/CheckboxGroupField.tsx"],"sourcesContent":["import { useField, type UseFieldProps } from '@/components/Common/Fields/hooks/useField'\nimport type { CheckboxGroupProps } from '@/components/Common/UI/CheckboxGroup/CheckboxGroupTypes'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport type { CheckboxGroupOption } from '@/components/Common/UI/CheckboxGroup/CheckboxGroupTypes'\nimport {\n  useStringifyGenericFieldValueArray,\n  type OptionWithGenericValue,\n} from '@/components/Common/Fields/hooks/useStringifyGenericFieldValue'\n\ntype GenericCheckboxGroupOption<TValue> = OptionWithGenericValue<TValue, CheckboxGroupOption>\n\nexport interface CheckboxGroupFieldProps<TValue>\n  extends\n    Omit<CheckboxGroupProps, 'value' | 'onChange' | 'options' | 'isInvalid'>,\n    UseFieldProps<TValue[]> {\n  options: GenericCheckboxGroupOption<TValue>[]\n  convertValueToString?: (value: TValue) => string\n}\n\nexport const CheckboxGroupField = <TValue = string,>({\n  rules,\n  defaultValue,\n  name,\n  control,\n  errorMessage,\n  isRequired,\n  onChange: onChangeFromProps,\n  transform,\n  options,\n  description,\n  onBlur,\n  inputRef,\n  convertValueToString,\n  ...checkboxGroupProps\n}: CheckboxGroupFieldProps<TValue>) => {\n  const Components = useComponentContext()\n  const { value, onChange, ...fieldProps } = useField({\n    name,\n    control,\n    rules,\n    defaultValue,\n    errorMessage,\n    isRequired,\n    onChange: onChangeFromProps,\n    transform,\n    description,\n    onBlur,\n    inputRef,\n  })\n\n  const stringFieldProps = useStringifyGenericFieldValueArray<TValue, CheckboxGroupOption>({\n    options,\n    value,\n    onChange,\n    convertValueToString,\n  })\n\n  return <Components.CheckboxGroup {...checkboxGroupProps} {...fieldProps} {...stringFieldProps} />\n}\n"],"names":["CheckboxGroupField","rules","defaultValue","name","control","errorMessage","isRequired","onChangeFromProps","transform","options","description","onBlur","inputRef","convertValueToString","checkboxGroupProps","Components","useComponentContext","value","onChange","fieldProps","useField","stringFieldProps","useStringifyGenericFieldValueArray","jsx"],"mappings":";;;;AAmBO,MAAMA,IAAqB,CAAmB;AAAA,EACnD,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAUC;AAAA,EACV,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,aAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,GAAGC;AACL,MAAuC;AACrC,QAAMC,IAAaC,EAAA,GACb,EAAE,OAAAC,GAAO,UAAAC,GAAU,GAAGC,EAAA,IAAeC,EAAS;AAAA,IAClD,MAAAjB;AAAA,IACA,SAAAC;AAAA,IACA,OAAAH;AAAA,IACA,cAAAC;AAAA,IACA,cAAAG;AAAA,IACA,YAAAC;AAAA,IACA,UAAUC;AAAA,IACV,WAAAC;AAAA,IACA,aAAAE;AAAA,IACA,QAAAC;AAAA,IACA,UAAAC;AAAA,EAAA,CACD,GAEKS,IAAmBC,EAAgE;AAAA,IACvF,SAAAb;AAAA,IACA,OAAAQ;AAAA,IACA,UAAAC;AAAA,IACA,sBAAAL;AAAA,EAAA,CACD;AAED,SAAO,gBAAAU,EAACR,EAAW,eAAX,EAA0B,GAAGD,GAAqB,GAAGK,GAAa,GAAGE,GAAkB;AACjG;"}

package/dist/components/Common/Fields/ComboBoxField/ComboBoxField.d.ts

@@ -7,5 +7,5 @@ export interface ComboBoxFieldProps<TValue> extends Omit<ComboBoxProps, 'name' |
     convertValueToString?: (value: TValue) => string;
     allowsCustomValue?: TValue extends string ? boolean : never;
 }
-export declare const ComboBoxField: <TValue = string>({ rules, defaultValue, name, errorMessage, isRequired, onChange: onChangeFromProps, transform, options, convertValueToString, description, onBlur, inputRef, ...comboBoxProps }: ComboBoxFieldProps<TValue>) => import("react/jsx-runtime").JSX.Element;
+export declare const ComboBoxField: <TValue = string>({ rules, defaultValue, name, control, errorMessage, isRequired, onChange: onChangeFromProps, transform, options, convertValueToString, description, onBlur, inputRef, ...comboBoxProps }: ComboBoxFieldProps<TValue>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Common/Fields/ComboBoxField/ComboBoxField.js

@@ -1,54 +1,56 @@
-import { jsx as v } from "react/jsx-runtime";
-import { useField as V } from "../hooks/useField.js";
-import { useComponentContext as b } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useStringifyGenericFieldValue as j } from "../hooks/useStringifyGenericFieldValue.js";
-const O = ({
+import { jsx as V } from "react/jsx-runtime";
+import { useField as b } from "../hooks/useField.js";
+import { useComponentContext as j } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useStringifyGenericFieldValue as w } from "../hooks/useStringifyGenericFieldValue.js";
+const P = ({
   rules: n,
   defaultValue: r,
   name: t,
-  errorMessage: i,
-  isRequired: s,
-  onChange: m,
-  transform: l,
-  options: C,
-  convertValueToString: a,
-  description: f,
-  onBlur: p,
-  inputRef: u,
+  control: i,
+  errorMessage: s,
+  isRequired: m,
+  onChange: l,
+  transform: C,
+  options: a,
+  convertValueToString: f,
+  description: p,
+  onBlur: u,
+  inputRef: d,
   ...o
 }) => {
-  const d = b(), { value: g, onChange: e, ...c } = V({
+  const g = j(), { value: c, onChange: e, ...h } = b({
     name: t,
+    control: i,
     rules: n,
     defaultValue: r,
-    errorMessage: i,
-    isRequired: s,
-    onChange: m,
-    transform: l,
-    description: f,
-    onBlur: p,
-    inputRef: u
-  }), h = j({
-    options: C,
-    value: g,
+    errorMessage: s,
+    isRequired: m,
+    onChange: l,
+    transform: C,
+    description: p,
+    onBlur: u,
+    inputRef: d
+  }), x = w({
+    options: a,
+    value: c,
     onChange: e,
-    convertValueToString: a
-  }), x = o.allowsCustomValue ? {
-    onChange: (F) => {
-      e(F);
+    convertValueToString: f
+  }), F = o.allowsCustomValue ? {
+    onChange: (v) => {
+      e(v);
     }
   } : {};
-  return /* @__PURE__ */ v(
-    d.ComboBox,
+  return /* @__PURE__ */ V(
+    g.ComboBox,
     {
       ...o,
-      ...c,
       ...h,
-      ...x
+      ...x,
+      ...F
     }
   );
 };
 export {
-  O as ComboBoxField
+  P as ComboBoxField
 };
 //# sourceMappingURL=ComboBoxField.js.map

package/dist/components/Common/Fields/ComboBoxField/ComboBoxField.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboBoxField.js","sources":["../../../../../src/components/Common/Fields/ComboBoxField/ComboBoxField.tsx"],"sourcesContent":["import { useField, type UseFieldProps } from '@/components/Common/Fields/hooks/useField'\nimport type { ComboBoxProps, ComboBoxOption } from '@/components/Common/UI/ComboBox/ComboBoxTypes'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport {\n  useStringifyGenericFieldValue,\n  type OptionWithGenericValue,\n} from '@/components/Common/Fields/hooks/useStringifyGenericFieldValue'\n\ntype GenericComboBoxOption<TValue> = OptionWithGenericValue<TValue, ComboBoxOption>\n\nexport interface ComboBoxFieldProps<TValue>\n  extends\n    Omit<\n      ComboBoxProps,\n      'name' | 'value' | 'onChange' | 'options' | 'isInvalid' | 'allowsCustomValue'\n    >,\n    UseFieldProps<TValue> {\n  options: GenericComboBoxOption<TValue>[]\n  convertValueToString?: (value: TValue) => string\n  allowsCustomValue?: TValue extends string ? boolean : never\n}\n\nexport const ComboBoxField = <TValue = string,>({\n  rules,\n  defaultValue,\n  name,\n  errorMessage,\n  isRequired,\n  onChange: onChangeFromProps,\n  transform,\n  options,\n  convertValueToString,\n  description,\n  onBlur,\n  inputRef,\n  ...comboBoxProps\n}: ComboBoxFieldProps<TValue>) => {\n  const Components = useComponentContext()\n  const { value, onChange, ...fieldProps } = useField<TValue>({\n    name,\n    rules,\n    defaultValue,\n    errorMessage,\n    isRequired,\n    onChange: onChangeFromProps,\n    transform,\n    description,\n    onBlur,\n    inputRef,\n  })\n\n  const stringFieldProps = useStringifyGenericFieldValue<TValue, ComboBoxOption>({\n    options,\n    value,\n    onChange,\n    convertValueToString,\n  })\n\n  // useStringifyGenericFieldValue's onChange only fires for matched options, dropping freeform input.\n  // Override with a direct pass-through. Cast is safe: allowsCustomValue constrains TValue extends string.\n  const freeformOverride = comboBoxProps.allowsCustomValue\n    ? {\n        onChange: (val: string) => {\n          onChange(val as TValue)\n        },\n      }\n    : {}\n\n  return (\n    <Components.ComboBox\n      {...comboBoxProps}\n      {...fieldProps}\n      {...stringFieldProps}\n      {...freeformOverride}\n    />\n  )\n}\n"],"names":["ComboBoxField","rules","defaultValue","name","errorMessage","isRequired","onChangeFromProps","transform","options","convertValueToString","description","onBlur","inputRef","comboBoxProps","Components","useComponentContext","value","onChange","fieldProps","useField","stringFieldProps","useStringifyGenericFieldValue","freeformOverride","val","jsx"],"mappings":";;;;AAsBO,MAAMA,IAAgB,CAAmB;AAAA,EAC9C,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAUC;AAAA,EACV,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAAkC;AAChC,QAAMC,IAAaC,EAAA,GACb,EAAE,OAAAC,GAAO,UAAAC,GAAU,GAAGC,EAAA,IAAeC,EAAiB;AAAA,IAC1D,MAAAhB;AAAA,IACA,OAAAF;AAAA,IACA,cAAAC;AAAA,IACA,cAAAE;AAAA,IACA,YAAAC;AAAA,IACA,UAAUC;AAAA,IACV,WAAAC;AAAA,IACA,aAAAG;AAAA,IACA,QAAAC;AAAA,IACA,UAAAC;AAAA,EAAA,CACD,GAEKQ,IAAmBC,EAAsD;AAAA,IAC7E,SAAAb;AAAA,IACA,OAAAQ;AAAA,IACA,UAAAC;AAAA,IACA,sBAAAR;AAAA,EAAA,CACD,GAIKa,IAAmBT,EAAc,oBACnC;AAAA,IACE,UAAU,CAACU,MAAgB;AACzB,MAAAN,EAASM,CAAa;AAAA,IACxB;AAAA,EAAA,IAEF,CAAA;AAEJ,SACE,gBAAAC;AAAA,IAACV,EAAW;AAAA,IAAX;AAAA,MACE,GAAGD;AAAA,MACH,GAAGK;AAAA,MACH,GAAGE;AAAA,MACH,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGV;"}
+{"version":3,"file":"ComboBoxField.js","sources":["../../../../../src/components/Common/Fields/ComboBoxField/ComboBoxField.tsx"],"sourcesContent":["import { useField, type UseFieldProps } from '@/components/Common/Fields/hooks/useField'\nimport type { ComboBoxProps, ComboBoxOption } from '@/components/Common/UI/ComboBox/ComboBoxTypes'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport {\n  useStringifyGenericFieldValue,\n  type OptionWithGenericValue,\n} from '@/components/Common/Fields/hooks/useStringifyGenericFieldValue'\n\ntype GenericComboBoxOption<TValue> = OptionWithGenericValue<TValue, ComboBoxOption>\n\nexport interface ComboBoxFieldProps<TValue>\n  extends\n    Omit<\n      ComboBoxProps,\n      'name' | 'value' | 'onChange' | 'options' | 'isInvalid' | 'allowsCustomValue'\n    >,\n    UseFieldProps<TValue> {\n  options: GenericComboBoxOption<TValue>[]\n  convertValueToString?: (value: TValue) => string\n  allowsCustomValue?: TValue extends string ? boolean : never\n}\n\nexport const ComboBoxField = <TValue = string,>({\n  rules,\n  defaultValue,\n  name,\n  control,\n  errorMessage,\n  isRequired,\n  onChange: onChangeFromProps,\n  transform,\n  options,\n  convertValueToString,\n  description,\n  onBlur,\n  inputRef,\n  ...comboBoxProps\n}: ComboBoxFieldProps<TValue>) => {\n  const Components = useComponentContext()\n  const { value, onChange, ...fieldProps } = useField<TValue>({\n    name,\n    control,\n    rules,\n    defaultValue,\n    errorMessage,\n    isRequired,\n    onChange: onChangeFromProps,\n    transform,\n    description,\n    onBlur,\n    inputRef,\n  })\n\n  const stringFieldProps = useStringifyGenericFieldValue<TValue, ComboBoxOption>({\n    options,\n    value,\n    onChange,\n    convertValueToString,\n  })\n\n  // useStringifyGenericFieldValue's onChange only fires for matched options, dropping freeform input.\n  // Override with a direct pass-through. Cast is safe: allowsCustomValue constrains TValue extends string.\n  const freeformOverride = comboBoxProps.allowsCustomValue\n    ? {\n        onChange: (val: string) => {\n          onChange(val as TValue)\n        },\n      }\n    : {}\n\n  return (\n    <Components.ComboBox\n      {...comboBoxProps}\n      {...fieldProps}\n      {...stringFieldProps}\n      {...freeformOverride}\n    />\n  )\n}\n"],"names":["ComboBoxField","rules","defaultValue","name","control","errorMessage","isRequired","onChangeFromProps","transform","options","convertValueToString","description","onBlur","inputRef","comboBoxProps","Components","useComponentContext","value","onChange","fieldProps","useField","stringFieldProps","useStringifyGenericFieldValue","freeformOverride","val","jsx"],"mappings":";;;;AAsBO,MAAMA,IAAgB,CAAmB;AAAA,EAC9C,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAUC;AAAA,EACV,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAAkC;AAChC,QAAMC,IAAaC,EAAA,GACb,EAAE,OAAAC,GAAO,UAAAC,GAAU,GAAGC,EAAA,IAAeC,EAAiB;AAAA,IAC1D,MAAAjB;AAAA,IACA,SAAAC;AAAA,IACA,OAAAH;AAAA,IACA,cAAAC;AAAA,IACA,cAAAG;AAAA,IACA,YAAAC;AAAA,IACA,UAAUC;AAAA,IACV,WAAAC;AAAA,IACA,aAAAG;AAAA,IACA,QAAAC;AAAA,IACA,UAAAC;AAAA,EAAA,CACD,GAEKQ,IAAmBC,EAAsD;AAAA,IAC7E,SAAAb;AAAA,IACA,OAAAQ;AAAA,IACA,UAAAC;AAAA,IACA,sBAAAR;AAAA,EAAA,CACD,GAIKa,IAAmBT,EAAc,oBACnC;AAAA,IACE,UAAU,CAACU,MAAgB;AACzB,MAAAN,EAASM,CAAa;AAAA,IACxB;AAAA,EAAA,IAEF,CAAA;AAEJ,SACE,gBAAAC;AAAA,IAACV,EAAW;AAAA,IAAX;AAAA,MACE,GAAGD;AAAA,MACH,GAAGK;AAAA,MACH,GAAGE;AAAA,MACH,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/components/Common/Fields/DatePickerField/DatePickerField.d.ts

@@ -1,7 +1,9 @@
-import { default as React } from 'react';
+import { ComponentType } from 'react';
 import { UseFieldProps } from '../hooks/useField';
 import { DatePickerProps } from '../../UI/DatePicker/DatePickerTypes';
-interface DatePickerFieldProps extends Omit<DatePickerProps, 'name' | 'onChange' | 'isInvalid'>, UseFieldProps<Date | null> {
+type DateFieldValue = string | Date | null;
+export interface DatePickerFieldProps<TValue extends DateFieldValue = Date | null> extends Omit<DatePickerProps, 'name' | 'onChange' | 'isInvalid'>, UseFieldProps<TValue> {
+    FieldComponent?: ComponentType<DatePickerProps>;
 }
-export declare const DatePickerField: React.FC<DatePickerFieldProps>;
+export declare const DatePickerField: <TValue extends DateFieldValue = Date | null>({ rules, defaultValue, name, control, errorMessage, isRequired, onChange, transform, description, onBlur, inputRef, FieldComponent, ...datePickerProps }: DatePickerFieldProps<TValue>) => import("react/jsx-runtime").JSX.Element;
 export {};