@gusto/embedded-react-sdk 0.37.0-rc.1 → 0.37.0-rc.3

package/CHANGELOG.md

@@ -4,23 +4,59 @@
 
 ### Features & Enhancements
 
-- Add termination, dismissal, and transition payroll flows
-- Add UNSTABLE_Hooks with form hook infrastructure
+- Add core terminations functionality with DismissalFlow, DismissalPayPeriodSelection, and unused time off payout UI
+- Add transition payroll support with TransitionCreation component, state machine, and landing page alert
+- Embed DismissalFlow within TerminationFlow and add dismissal/transition states to payroll flows
+- Show off-cycle payrolls in history tab and add off-cycle flow support with section dividers
 - Introduce unified SDKError type and ObservabilityError extension
-- Add section dividers and headings to off-cycle and transition creation
+- Implement UNSTABLE_Hooks directory with uniform hook return types and form infrastructure
+- Add useEmployeeDetailsForm hook with configurable required fields and NAME_REGEX validation
+- Add useWorkAddressForm hook with prebuilt component
+- Implement CompensationForm with useCompensationForm hook, including start date field and composeFormSchema alignment
+- Add composeSubmitHandler for coordinated multi-form validation and cross-form focus management
+- Add error code infrastructure, HookField reference components, and errorHandling pattern with retryQueries
+- Add getFormSubmissionValues to form hooks
+- Allow requiredFields to accept flat array or per-mode object
+- Align hooks with stable component parity: optional employeeId with submit-time resolution, SwitchField FieldComponent support, requiredIf null coercion fix
+- Add partner-facing hooks documentation
 
 ### Fixes
 
-- Fix off-cycle, dismissal, and transition payroll bugs
-- Fix PayrollConfiguration calculate/polling flow
-- Fix hourly inputs visibility and payroll cache invalidation
+- Hide courtesy withholding checkbox from employee view
+- Strip finalPayoutUnusedHoursInput from PTO on non-dismissal payrolls
 - Include off-cycle and external payrolls in list and history views
+- Only show hourly inputs for primary jobs with hourly compensations
+- Fix off-cycle, dismissal, and transition payroll bugs
+- Invalidate payroll-prepare cache after editing employee hours
+- Improve PayrollConfiguration calculate/polling flow
+- Mark dismissal pay period select as required
+- Default employee selection to select-employees mode
+- Convert throw sites in new components to SDKInternalError
 
 ### Chores & Maintenance
 
-- Add E2E tests for dismissal and transition payroll flows
+- Refactor Base infrastructure for hooks compatibility
+- Payroll test infrastructure and label cleanup
+- Add E2E tests for DismissalFlow and transition payroll
+- Add Storybook stories for offcycle components
+- Add workflow_dispatch trigger and CI badge to README
+- Disable e2e tests in GitHub Actions
 - Fix minimatch ReDoS vulnerability (CVE-2026-27903)
-- Dependency bumps (storybook 10.3.1, i18next, react-i18next, msw, and more)
+- Upgrade react-robot from 1.2.0 to 1.2.1
+- Bump react-hook-form from 7.71.2 to 7.72.0
+- Bump react-i18next from 16.5.8 to 16.6.6
+- Bump i18next from 25.8.18 to 25.10.4
+- Bump @storybook/react-vite from 10.2.19 to 10.3.1
+- Bump @storybook/addon-docs from 10.2.19 to 10.3.3
+- Bump @storybook/addon-a11y from 10.2.19 to 10.3.3
+- Bump @storybook/addon-onboarding from 10.2.19 to 10.3.3
+- Bump storybook from 10.3.0 to 10.3.1
+- Bump eslint-plugin-storybook from 10.2.19 to 10.3.3
+- Bump @storybook/test-runner from 0.24.2 to 0.24.3
+- Bump @vitest/coverage-v8 from 4.1.0 to 4.1.1
+- Bump vite-plugin-stylelint from 6.0.4 to 6.1.0
+- Bump msw from 2.12.12 to 2.12.14
+- Bump flatted from 3.3.3 to 3.4.2
 
 ## 0.36.0
 

package/README.md

@@ -1,5 +1,7 @@
 # 🦎 Gusto Embedded React SDK
 
+[![CI](https://github.com/Gusto/embedded-react-sdk/actions/workflows/ci.yaml/badge.svg)](https://github.com/Gusto/embedded-react-sdk/actions/workflows/ci.yaml)
+
 To install:
 
 ```
@@ -46,3 +48,10 @@ Live documentation is available at: https://docs.gusto.com/embedded-payroll/docs
   - [Employee Onboarding](docs/workflows-overview/employee-onboarding/employee-onboarding.md)
     - [Employee Self-Onboarding](docs/workflows-overview/employee-onboarding/employee-self-onboarding.md)
   - [Run Payroll](docs/workflows-overview/run-payroll.md)
+  - [Off-Cycle Payroll (Bonus & Correction)](docs/workflows-overview/off-cycle-payroll.md)
+  - [Dismissal Payroll](docs/workflows-overview/dismissal-payroll.md)
+  - [Transition Payroll](docs/workflows-overview/transition-payroll.md)
+- [Hooks (Experimental)](docs/hooks/hooks.md)
+  - [useEmployeeDetailsForm](docs/hooks/useEmployeeDetailsForm.md)
+  - [useCompensationForm](docs/hooks/useCompensationForm.md)
+  - [useWorkAddressForm](docs/hooks/useWorkAddressForm.md)

package/dist/UNSTABLE_Hooks.d.ts

@@ -1 +1 @@
-export { useCompensationForm, type UseCompensationFormProps, type UseCompensationFormResult, type UseCompensationFormReady, type HookLoadingResult, type HookErrors, type FieldMetadata, type FieldMetadataWithOptions, useFieldsMetadata, useFieldErrorMessage, } from './components/UNSTABLE_Hooks';
+export { useCompensationForm, CompensationForm, CompensationErrorCodes, type CompensationFormProps, type CompensationSubmitCallbacks, type CompensationSubmitOptions, type CompensationRequiredFields, type UseCompensationFormProps, type UseCompensationFormResult, type UseCompensationFormReady, type CompensationFieldsMetadata, type CompensationFormFields, type CompensationErrorCode, type CompensationField, type CompensationFormData, type CompensationFormOutputs, type RequiredValidation, type RateValidation, type StartDateFieldProps, type JobTitleFieldProps, type FlsaStatusFieldProps, type RateFieldProps, type PaymentUnitFieldProps, type AdjustForMinimumWageFieldProps, type MinimumWageIdFieldProps, type TwoPercentShareholderFieldProps, type StateWcCoveredFieldProps, type StateWcClassCodeFieldProps, SDKFormProvider, FormFieldsMetadataProvider, composeSubmitHandler, useFieldsMetadata, useFieldErrorMessage, withOptions, deriveFieldsMetadata, collectErrors, TextInputHookField, SelectHookField, CheckboxHookField, NumberInputHookField, DatePickerHookField, RadioGroupHookField, useErrorHandling, type HookFormInternals, type HookLoadingResult, type HookSubmitResult, type HookErrorHandling, type BaseHookReady, type BaseFormHookReady, type FieldMetadata, type FieldMetadataWithOptions, type FieldsMetadata, type FormFieldsMetadataContextValue, type ValidationMessages, type BaseFieldProps, type TextInputHookFieldProps, type SelectHookFieldProps, type CheckboxHookFieldProps, type NumberInputHookFieldProps, type DatePickerHookFieldProps, type RadioGroupHookFieldProps, type TextInputProps, type SelectProps, type SelectOption, type CheckboxProps, type NumberInputProps, type DatePickerProps, type RadioGroupProps, type RadioGroupOption, SwitchHookField, type SwitchHookFieldProps, type SwitchProps, useEmployeeDetailsForm, EmployeeDetailsForm, EmployeeDetailsErrorCodes, type EmployeeDetailsFormProps, type EmployeeDetailsSubmitCallbacks, type EmployeeDetailsRequiredFields, type UseEmployeeDetailsFormProps, type UseEmployeeDetailsFormResult, type UseEmployeeDetailsFormReady, type EmployeeDetailsFieldsMetadata, type EmployeeDetailsFormFields, type EmployeeDetailsErrorCode, type EmployeeDetailsFormData, type EmployeeDetailsFormOutputs, type EmployeeDetailsField, type EmployeeDetailsRequiredValidation, type NameValidation, type EmailValidation, type SsnValidation, type FirstNameFieldProps, type MiddleInitialFieldProps, type LastNameFieldProps, type EmailFieldProps, type DateOfBirthFieldProps, type SsnFieldProps, type SelfOnboardingFieldProps, useWorkAddressForm, WorkAddressForm, WorkAddressErrorCodes, type WorkAddressFormProps, type WorkAddressSubmitCallbacks, type WorkAddressSubmitOptions, type WorkAddressRequiredFields, type UseWorkAddressFormProps, type UseWorkAddressFormResult, type UseWorkAddressFormReady, type WorkAddressFieldsMetadata, type WorkAddressFormFields, type WorkAddressErrorCode, type WorkAddressFormData, type WorkAddressFormOutputs, type WorkAddressField, type WorkAddressRequiredValidation, type LocationFieldProps, type EffectiveDateFieldProps, } from './components/UNSTABLE_Hooks';

package/dist/UNSTABLE_Hooks.js

@@ -1,9 +1,53 @@
-import { useCompensationForm as r } from "./components/UNSTABLE_Hooks/hooks/useCompensationForm/useCompensationForm.js";
-import { useFieldErrorMessage as t } from "./components/UNSTABLE_Hooks/form/useFieldErrorMessage.js";
-import { useFieldsMetadata as m } from "./components/UNSTABLE_Hooks/form/useFieldsMetadata.js";
+import { useErrorHandling as e } from "./components/UNSTABLE_Hooks/useErrorHandling.js";
+import { collectErrors as m } from "./components/UNSTABLE_Hooks/collectErrors.js";
+import { CheckboxHookField as d } from "./components/UNSTABLE_Hooks/form/fields/CheckboxHookField.js";
+import { CompensationErrorCodes as i } from "./components/UNSTABLE_Hooks/hooks/useCompensationForm/compensationSchema.js";
+import { CompensationForm as f } from "./components/UNSTABLE_Hooks/hooks/useCompensationForm/CompensationForm.js";
+import { DatePickerHookField as a } from "./components/UNSTABLE_Hooks/form/fields/DatePickerHookField.js";
+import { EmployeeDetailsErrorCodes as k } from "./components/UNSTABLE_Hooks/hooks/useEmployeeDetailsForm/employeeDetailsSchema.js";
+import { EmployeeDetailsForm as u } from "./components/UNSTABLE_Hooks/hooks/useEmployeeDetailsForm/EmployeeDetailsForm.js";
+import { FormFieldsMetadataProvider as H } from "./components/UNSTABLE_Hooks/form/FormFieldsMetadataProvider.js";
+import { NumberInputHookField as C } from "./components/UNSTABLE_Hooks/form/fields/NumberInputHookField.js";
+import { RadioGroupHookField as M } from "./components/UNSTABLE_Hooks/form/fields/RadioGroupHookField.js";
+import { SDKFormProvider as b } from "./components/UNSTABLE_Hooks/form/SDKFormProvider.js";
+import { SelectHookField as v } from "./components/UNSTABLE_Hooks/form/fields/SelectHookField.js";
+import { SwitchHookField as A } from "./components/UNSTABLE_Hooks/form/fields/SwitchHookField.js";
+import { TextInputHookField as W } from "./components/UNSTABLE_Hooks/form/fields/TextInputHookField.js";
+import { WorkAddressErrorCodes as w } from "./components/UNSTABLE_Hooks/hooks/useWorkAddressForm/workAddressSchema.js";
+import { WorkAddressForm as G } from "./components/UNSTABLE_Hooks/hooks/useWorkAddressForm/WorkAddressForm.js";
+import { composeSubmitHandler as N } from "./components/UNSTABLE_Hooks/form/composeSubmitHandler.js";
+import { deriveFieldsMetadata as R } from "./components/UNSTABLE_Hooks/form/deriveFieldsMetadata.js";
+import { useCompensationForm as j } from "./components/UNSTABLE_Hooks/hooks/useCompensationForm/useCompensationForm.js";
+import { useEmployeeDetailsForm as z } from "./components/UNSTABLE_Hooks/hooks/useEmployeeDetailsForm/useEmployeeDetailsForm.js";
+import { useFieldErrorMessage as J } from "./components/UNSTABLE_Hooks/form/useFieldErrorMessage.js";
+import { useFieldsMetadata as Q } from "./components/UNSTABLE_Hooks/form/useFieldsMetadata.js";
+import { useWorkAddressForm as V } from "./components/UNSTABLE_Hooks/hooks/useWorkAddressForm/useWorkAddressForm.js";
+import { withOptions as Y } from "./components/UNSTABLE_Hooks/form/withOptions.js";
 export {
-  r as useCompensationForm,
-  t as useFieldErrorMessage,
-  m as useFieldsMetadata
+  d as CheckboxHookField,
+  i as CompensationErrorCodes,
+  f as CompensationForm,
+  a as DatePickerHookField,
+  k as EmployeeDetailsErrorCodes,
+  u as EmployeeDetailsForm,
+  H as FormFieldsMetadataProvider,
+  C as NumberInputHookField,
+  M as RadioGroupHookField,
+  b as SDKFormProvider,
+  v as SelectHookField,
+  A as SwitchHookField,
+  W as TextInputHookField,
+  w as WorkAddressErrorCodes,
+  G as WorkAddressForm,
+  m as collectErrors,
+  N as composeSubmitHandler,
+  R as deriveFieldsMetadata,
+  j as useCompensationForm,
+  z as useEmployeeDetailsForm,
+  e as useErrorHandling,
+  J as useFieldErrorMessage,
+  Q as useFieldsMetadata,
+  V as useWorkAddressForm,
+  Y as withOptions
 };
 //# sourceMappingURL=UNSTABLE_Hooks.js.map

package/dist/UNSTABLE_Hooks.js.map

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

package/dist/components/Base/Base.d.ts

@@ -30,6 +30,7 @@ export interface BaseBoundariesProps {
     children?: ReactNode;
     FallbackComponent?: (props: FallbackProps) => JSX.Element;
     onErrorBoundaryError?: (error: unknown, info: ErrorInfo) => void;
+    componentName?: string;
 }
-export declare const BaseBoundaries: ({ children, FallbackComponent, onErrorBoundaryError, }: BaseBoundariesProps) => import("react/jsx-runtime").JSX.Element;
+export declare const BaseBoundaries: ({ children, FallbackComponent, onErrorBoundaryError, componentName, }: BaseBoundariesProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Base/Base.js

@@ -1,111 +1,98 @@
-import { jsx as n, jsxs as m } from "react/jsx-runtime";
-import { Suspense as v, useRef as c, useEffect as p } from "react";
+import { jsx as e, jsxs as m } from "react/jsx-runtime";
+import { Suspense as k, useRef as c, useEffect as u } from "react";
 import { ErrorBoundary as B } from "react-error-boundary";
-import { useTranslation as f } from "react-i18next";
-import { QueryErrorResetBoundary as k } from "@tanstack/react-query";
-import { FadeIn as R } from "../Common/FadeIn/FadeIn.js";
-import { BaseContext as S } from "./useBase.js";
+import { useTranslation as p } from "react-i18next";
+import { QueryErrorResetBoundary as S } from "@tanstack/react-query";
+import { FadeIn as I } from "../Common/FadeIn/FadeIn.js";
+import { BaseContext as R } from "./useBase.js";
 import { useBaseSubmit as x } from "./useBaseSubmit.js";
-import { componentEvents as I } from "../../shared/constants.js";
-import "classnames";
-import { InternalError as g } from "../Common/InternalError/InternalError.js";
-import { useComponentContext as E } from "../../contexts/ComponentAdapter/useComponentContext.js";
-import { useLoadingIndicator as h } from "../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
-import { useObservability as D } from "../../contexts/ObservabilityProvider/useObservability.js";
-import { normalizeToSDKError as T } from "../../types/sdkError.js";
+import { componentEvents as D } from "../../shared/constants.js";
+import { InternalError as f } from "../Common/InternalError/InternalError.js";
+import { useComponentContext as g } from "../../contexts/ComponentAdapter/useComponentContext.js";
+import { useLoadingIndicator as d } from "../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
+import { useObservability as E } from "../../contexts/ObservabilityProvider/useObservability.js";
+import { normalizeToSDKError as F } from "../../types/sdkError.js";
 const $ = ({
   children: r,
-  FallbackComponent: t = g,
+  FallbackComponent: t = f,
   LoaderComponent: s,
   onEvent: o,
-  componentName: e
+  componentName: n
 }) => {
-  const { error: i, baseSubmitHandler: a, setError: y } = x(e), { observability: d } = D(), { LoadingIndicator: w } = h(), l = s ?? w, L = (u, C) => {
-    o(I.ERROR, u);
-    const b = T(u);
-    d?.onError?.({
-      ...b,
+  const { error: i, baseSubmitHandler: a, setError: h } = x(n), { observability: y } = E(), { LoadingIndicator: L } = d(), b = s ?? L, w = (l, C) => {
+    o(D.ERROR, l);
+    const v = F(l);
+    y?.onError?.({
+      ...v,
       timestamp: Date.now(),
-      componentName: e,
+      componentName: n,
       componentStack: C.componentStack ?? void 0
     });
   };
-  return /* @__PURE__ */ n(
-    S.Provider,
+  return /* @__PURE__ */ e(
+    R.Provider,
     {
       value: {
         error: i,
-        setError: y,
+        setError: h,
         onEvent: o,
         baseSubmitHandler: a,
-        LoadingIndicator: l,
-        componentName: e
+        LoadingIndicator: b,
+        componentName: n
       },
-      children: /* @__PURE__ */ n(
-        U,
+      children: /* @__PURE__ */ e(
+        _,
         {
           FallbackComponent: t,
-          onErrorBoundaryError: L,
-          children: /* @__PURE__ */ n(
-            v,
-            {
-              fallback: /* @__PURE__ */ n(
-                M,
-                {
-                  LoaderComponent: l,
-                  observability: d,
-                  componentName: e
-                }
-              ),
-              children: /* @__PURE__ */ n(j, { error: i, children: r })
-            }
-          )
+          onErrorBoundaryError: w,
+          componentName: n,
+          children: /* @__PURE__ */ e(j, { error: i, children: r })
         }
       )
     }
   );
 };
-function A({ error: r }) {
-  const t = E(), { t: s } = f(), o = r.fieldErrors.length > 0;
+function T({ error: r }) {
+  const t = g(), { t: s } = p(), o = r.fieldErrors.length > 0;
   return /* @__PURE__ */ m(t.Alert, { label: s("status.errorEncountered"), status: "error", children: [
-    o && /* @__PURE__ */ n(
+    o && /* @__PURE__ */ e(
       t.UnorderedList,
       {
-        items: r.fieldErrors.filter((e) => e.message).map((e) => /* @__PURE__ */ n("span", { children: e.message }, e.field))
+        items: r.fieldErrors.filter((n) => n.message).map((n) => /* @__PURE__ */ e("span", { children: n.message }, n.field))
       }
     ),
-    !o && r.category === "validation_error" && /* @__PURE__ */ n(t.Text, { as: "pre", children: r.raw && typeof r.raw == "object" && "pretty" in r.raw && typeof r.raw.pretty == "function" ? r.raw.pretty() : r.message }),
-    !o && r.category !== "validation_error" && /* @__PURE__ */ n(t.Text, { children: r.message || s("errors.unknownError") })
+    !o && r.category === "validation_error" && /* @__PURE__ */ e(t.Text, { as: "pre", children: r.raw && typeof r.raw == "object" && "pretty" in r.raw && typeof r.raw.pretty == "function" ? r.raw.pretty() : r.message }),
+    !o && r.category !== "validation_error" && /* @__PURE__ */ e(t.Text, { children: r.message || s("errors.unknownError") })
   ] });
 }
-function F({ errors: r }) {
-  const t = E(), { t: s } = f();
-  return /* @__PURE__ */ n(t.Alert, { label: s("status.multipleErrorsEncountered"), status: "error", children: /* @__PURE__ */ n(
+function A({ errors: r }) {
+  const t = g(), { t: s } = p();
+  return /* @__PURE__ */ e(t.Alert, { label: s("status.multipleErrorsEncountered"), status: "error", children: /* @__PURE__ */ e(
     t.UnorderedList,
     {
-      items: r.filter((o) => o.message || o.fieldErrors.length > 0).map((o, e) => {
+      items: r.filter((o) => o.message || o.fieldErrors.length > 0).map((o, n) => {
         const i = o.fieldErrors.filter((a) => a.message);
-        return i.length === 0 ? /* @__PURE__ */ n("span", { children: o.message || s("errors.unknownError") }, e) : /* @__PURE__ */ m("span", { children: [
+        return i.length === 0 ? /* @__PURE__ */ e("span", { children: o.message || s("errors.unknownError") }, n) : /* @__PURE__ */ m("span", { children: [
           o.message || s("errors.unknownError"),
-          /* @__PURE__ */ n(
+          /* @__PURE__ */ e(
             t.UnorderedList,
             {
-              items: i.map((a) => /* @__PURE__ */ n("span", { children: a.message }, a.field))
+              items: i.map((a) => /* @__PURE__ */ e("span", { children: a.message }, a.field))
             }
           )
-        ] }, e);
+        ] }, n);
       })
     }
   ) });
 }
 const j = ({ children: r, error: t, isLoading: s }) => {
-  const { LoadingIndicator: o } = h(), e = Array.isArray(t) ? t : t ? [t] : [], i = e.length > 0;
+  const { LoadingIndicator: o } = d(), n = Array.isArray(t) ? t : t ? [t] : [], i = n.length > 0;
   if (s && !i)
-    return /* @__PURE__ */ n(o, {});
-  const [a] = e;
-  return /* @__PURE__ */ m(R, { children: [
-    e.length > 1 && /* @__PURE__ */ n(F, { errors: e }),
-    e.length === 1 && a && /* @__PURE__ */ n(A, { error: a }),
+    return /* @__PURE__ */ e(o, {});
+  const [a] = n;
+  return /* @__PURE__ */ m(I, { children: [
+    n.length > 1 && /* @__PURE__ */ e(A, { errors: n }),
+    n.length === 1 && a && /* @__PURE__ */ e(T, { error: a }),
     r
   ] });
 }, M = ({
@@ -113,34 +100,47 @@ const j = ({ children: r, error: t, isLoading: s }) => {
   observability: t,
   componentName: s
 }) => {
-  const o = c(Date.now()), e = c(t), i = c(s);
-  return p(() => {
-    e.current = t, i.current = s;
-  }, [t, s]), p(() => () => {
+  const o = c(Date.now()), n = c(t), i = c(s);
+  return u(() => {
+    n.current = t, i.current = s;
+  }, [t, s]), u(() => () => {
     const a = Date.now() - o.current;
-    e.current?.onMetric?.({
+    n.current?.onMetric?.({
       name: "sdk.component.loading_duration",
       value: a,
       unit: "ms",
       tags: i.current ? { component: i.current } : void 0,
       timestamp: Date.now()
     });
-  }, []), /* @__PURE__ */ n(r, {});
-}, U = ({
+  }, []), /* @__PURE__ */ e(r, {});
+};
+function U({ componentName: r }) {
+  const { LoadingIndicator: t } = d(), { observability: s } = E();
+  return /* @__PURE__ */ e(
+    M,
+    {
+      LoaderComponent: t,
+      observability: s,
+      componentName: r
+    }
+  );
+}
+const _ = ({
   children: r,
-  FallbackComponent: t = g,
-  onErrorBoundaryError: s
-}) => /* @__PURE__ */ n(k, { children: ({ reset: o }) => /* @__PURE__ */ n(
+  FallbackComponent: t = f,
+  onErrorBoundaryError: s,
+  componentName: o
+}) => /* @__PURE__ */ e(S, { children: ({ reset: n }) => /* @__PURE__ */ e(
   B,
   {
     FallbackComponent: t,
-    onReset: o,
+    onReset: n,
     onError: s,
-    children: r
+    children: /* @__PURE__ */ e(k, { fallback: /* @__PURE__ */ e(U, { componentName: o }), children: r })
   }
 ) });
 export {
-  U as BaseBoundaries,
+  _ as BaseBoundaries,
   $ as BaseComponent,
   j as BaseLayout
 };

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

@@ -1 +1 @@
-{"version":3,"file":"Base.js","sources":["../../../src/components/Base/Base.tsx"],"sourcesContent":["import type { ReactNode, JSX, ErrorInfo } from 'react'\nimport { Suspense, useEffect, useRef } from 'react'\nimport type { FallbackProps } from 'react-error-boundary'\nimport { ErrorBoundary } from 'react-error-boundary'\nimport { useTranslation } from 'react-i18next'\nimport { QueryErrorResetBoundary } from '@tanstack/react-query'\nimport { FadeIn } from '../Common/FadeIn/FadeIn'\nimport { BaseContext, type OnEventType } from './useBase'\nimport { useBaseSubmit } from './useBaseSubmit'\nimport { componentEvents, type EventType } from '@/shared/constants'\nimport { InternalError } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport type { ResourceDictionary, Resources } from '@/types/Helpers'\nimport { useLoadingIndicator } from '@/contexts/LoadingIndicatorProvider/useLoadingIndicator'\nimport type { LoadingIndicatorContextProps } from '@/contexts/LoadingIndicatorProvider/useLoadingIndicator'\nimport { useObservability } from '@/contexts/ObservabilityProvider/useObservability'\nimport { normalizeToSDKError, type SDKError } from '@/types/sdkError'\n\nexport interface CommonComponentInterface<TResourceKey extends keyof Resources = keyof Resources> {\n  children?: ReactNode\n  className?: string\n  defaultValues?: unknown\n  dictionary?: ResourceDictionary<TResourceKey>\n}\n\nexport interface BaseComponentInterface<\n  TResourceKey extends keyof Resources = keyof Resources,\n> extends CommonComponentInterface<TResourceKey> {\n  FallbackComponent?: BaseBoundariesProps['FallbackComponent']\n  LoaderComponent?: LoadingIndicatorContextProps['LoadingIndicator']\n  onEvent: OnEventType<EventType, unknown>\n}\n\ninterface InternalBaseComponentProps {\n  componentName?: string\n}\n\nexport const BaseComponent = <TResourceKey extends keyof Resources = keyof Resources>({\n  children,\n  FallbackComponent = InternalError,\n  LoaderComponent: LoadingIndicatorFromProps,\n  onEvent,\n  componentName,\n}: BaseComponentInterface<TResourceKey> & InternalBaseComponentProps) => {\n  const { error, baseSubmitHandler, setError } = useBaseSubmit(componentName)\n  const { observability } = useObservability()\n\n  const { LoadingIndicator: LoadingIndicatorFromContext } = useLoadingIndicator()\n  const LoaderComponent = LoadingIndicatorFromProps ?? LoadingIndicatorFromContext\n\n  const onErrorBoundaryError = (boundaryError: unknown, errorInfo: ErrorInfo) => {\n    onEvent(componentEvents.ERROR, boundaryError)\n\n    const sdkError = normalizeToSDKError(boundaryError)\n\n    observability?.onError?.({\n      ...sdkError,\n      timestamp: Date.now(),\n      componentName,\n      componentStack: errorInfo.componentStack ?? undefined,\n    })\n  }\n\n  return (\n    <BaseContext.Provider\n      value={{\n        error,\n        setError,\n        onEvent,\n        baseSubmitHandler,\n        LoadingIndicator: LoaderComponent,\n        componentName,\n      }}\n    >\n      <BaseBoundaries\n        FallbackComponent={FallbackComponent}\n        onErrorBoundaryError={onErrorBoundaryError}\n      >\n        <Suspense\n          fallback={\n            <LoaderWithMetrics\n              LoaderComponent={LoaderComponent}\n              observability={observability}\n              componentName={componentName}\n            />\n          }\n        >\n          <BaseLayout error={error}>{children}</BaseLayout>\n        </Suspense>\n      </BaseBoundaries>\n    </BaseContext.Provider>\n  )\n}\n\nexport interface BaseLayoutProps {\n  children?: ReactNode\n  error?: SDKError | SDKError[] | null\n  isLoading?: boolean\n}\n\nfunction SingleErrorContent({ error }: { error: SDKError }) {\n  const Components = useComponentContext()\n  const { t } = useTranslation()\n  const hasFieldErrors = error.fieldErrors.length > 0\n\n  return (\n    <Components.Alert label={t('status.errorEncountered')} status=\"error\">\n      {hasFieldErrors && (\n        <Components.UnorderedList\n          items={error.fieldErrors\n            .filter(fieldError => fieldError.message)\n            .map(fieldError => (\n              <span key={fieldError.field}>{fieldError.message}</span>\n            ))}\n        />\n      )}\n      {!hasFieldErrors && error.category === 'validation_error' && (\n        <Components.Text as=\"pre\">\n          {error.raw &&\n          typeof error.raw === 'object' &&\n          'pretty' in error.raw &&\n          typeof (error.raw as { pretty: unknown }).pretty === 'function'\n            ? (error.raw as { pretty: () => string }).pretty()\n            : error.message}\n        </Components.Text>\n      )}\n      {!hasFieldErrors && error.category !== 'validation_error' && (\n        <Components.Text>{error.message || t('errors.unknownError')}</Components.Text>\n      )}\n    </Components.Alert>\n  )\n}\n\nfunction MultipleErrorsContent({ errors }: { errors: SDKError[] }) {\n  const Components = useComponentContext()\n  const { t } = useTranslation()\n\n  return (\n    <Components.Alert label={t('status.multipleErrorsEncountered')} status=\"error\">\n      <Components.UnorderedList\n        items={errors\n          .filter(error => error.message || error.fieldErrors.length > 0)\n          .map((error, index) => {\n            const visibleFieldErrors = error.fieldErrors.filter(fieldError => fieldError.message)\n\n            if (visibleFieldErrors.length === 0) {\n              return <span key={index}>{error.message || t('errors.unknownError')}</span>\n            }\n\n            return (\n              <span key={index}>\n                {error.message || t('errors.unknownError')}\n                <Components.UnorderedList\n                  items={visibleFieldErrors.map(fieldError => (\n                    <span key={fieldError.field}>{fieldError.message}</span>\n                  ))}\n                />\n              </span>\n            )\n          })}\n      />\n    </Components.Alert>\n  )\n}\n\nexport const BaseLayout = ({ children, error, isLoading }: BaseLayoutProps) => {\n  const { LoadingIndicator } = useLoadingIndicator()\n\n  const errors = Array.isArray(error) ? error : error ? [error] : []\n  const hasErrors = errors.length > 0\n\n  if (isLoading && !hasErrors) {\n    return <LoadingIndicator />\n  }\n\n  const [firstError] = errors\n\n  return (\n    <FadeIn>\n      {errors.length > 1 && <MultipleErrorsContent errors={errors} />}\n      {errors.length === 1 && firstError && <SingleErrorContent error={firstError} />}\n      {children}\n    </FadeIn>\n  )\n}\n\ninterface LoaderWithMetricsProps {\n  LoaderComponent: LoadingIndicatorContextProps['LoadingIndicator']\n  observability: ReturnType<typeof useObservability>['observability']\n  componentName?: string\n}\n\nconst LoaderWithMetrics = ({\n  LoaderComponent,\n  observability,\n  componentName,\n}: LoaderWithMetricsProps) => {\n  const loadingStartTime = useRef(Date.now())\n  const observabilityRef = useRef(observability)\n  const componentNameRef = useRef(componentName)\n\n  useEffect(() => {\n    observabilityRef.current = observability\n    componentNameRef.current = componentName\n  }, [observability, componentName])\n\n  useEffect(() => {\n    return () => {\n      const duration = Date.now() - loadingStartTime.current\n      observabilityRef.current?.onMetric?.({\n        name: 'sdk.component.loading_duration',\n        value: duration,\n        unit: 'ms',\n        tags: componentNameRef.current ? { component: componentNameRef.current } : undefined,\n        timestamp: Date.now(),\n      })\n    }\n  }, [])\n\n  return <LoaderComponent />\n}\n\nexport interface BaseBoundariesProps {\n  children?: ReactNode\n  FallbackComponent?: (props: FallbackProps) => JSX.Element\n  onErrorBoundaryError?: (error: unknown, info: ErrorInfo) => void\n}\n\nexport const BaseBoundaries = ({\n  children,\n  FallbackComponent = InternalError,\n  onErrorBoundaryError,\n}: BaseBoundariesProps) => {\n  return (\n    <QueryErrorResetBoundary>\n      {({ reset: resetQueries }) => (\n        <ErrorBoundary\n          FallbackComponent={FallbackComponent}\n          onReset={resetQueries}\n          onError={onErrorBoundaryError}\n        >\n          {children}\n        </ErrorBoundary>\n      )}\n    </QueryErrorResetBoundary>\n  )\n}\n"],"names":["BaseComponent","children","FallbackComponent","InternalError","LoadingIndicatorFromProps","onEvent","componentName","error","baseSubmitHandler","setError","useBaseSubmit","observability","useObservability","LoadingIndicatorFromContext","useLoadingIndicator","LoaderComponent","onErrorBoundaryError","boundaryError","errorInfo","componentEvents","sdkError","normalizeToSDKError","jsx","BaseContext","BaseBoundaries","Suspense","LoaderWithMetrics","BaseLayout","SingleErrorContent","Components","useComponentContext","t","useTranslation","hasFieldErrors","jsxs","fieldError","MultipleErrorsContent","errors","index","visibleFieldErrors","isLoading","LoadingIndicator","hasErrors","firstError","FadeIn","loadingStartTime","useRef","observabilityRef","componentNameRef","useEffect","duration","QueryErrorResetBoundary","resetQueries","ErrorBoundary"],"mappings":";;;;;;;;;;;;;;;AAqCO,MAAMA,IAAgB,CAAyD;AAAA,EACpF,UAAAC;AAAA,EACA,mBAAAC,IAAoBC;AAAA,EACpB,iBAAiBC;AAAA,EACjB,SAAAC;AAAA,EACA,eAAAC;AACF,MAAyE;AACvE,QAAM,EAAE,OAAAC,GAAO,mBAAAC,GAAmB,UAAAC,EAAA,IAAaC,EAAcJ,CAAa,GACpE,EAAE,eAAAK,EAAA,IAAkBC,EAAA,GAEpB,EAAE,kBAAkBC,EAAA,IAAgCC,EAAA,GACpDC,IAAkBX,KAA6BS,GAE/CG,IAAuB,CAACC,GAAwBC,MAAyB;AAC7E,IAAAb,EAAQc,EAAgB,OAAOF,CAAa;AAE5C,UAAMG,IAAWC,EAAoBJ,CAAa;AAElD,IAAAN,GAAe,UAAU;AAAA,MACvB,GAAGS;AAAA,MACH,WAAW,KAAK,IAAA;AAAA,MAChB,eAAAd;AAAA,MACA,gBAAgBY,EAAU,kBAAkB;AAAA,IAAA,CAC7C;AAAA,EACH;AAEA,SACE,gBAAAI;AAAA,IAACC,EAAY;AAAA,IAAZ;AAAA,MACC,OAAO;AAAA,QACL,OAAAhB;AAAA,QACA,UAAAE;AAAA,QACA,SAAAJ;AAAA,QACA,mBAAAG;AAAA,QACA,kBAAkBO;AAAA,QAClB,eAAAT;AAAA,MAAA;AAAA,MAGF,UAAA,gBAAAgB;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,mBAAAtB;AAAA,UACA,sBAAAc;AAAA,UAEA,UAAA,gBAAAM;AAAA,YAACG;AAAA,YAAA;AAAA,cACC,UACE,gBAAAH;AAAA,gBAACI;AAAA,gBAAA;AAAA,kBACC,iBAAAX;AAAA,kBACA,eAAAJ;AAAA,kBACA,eAAAL;AAAA,gBAAA;AAAA,cAAA;AAAA,cAIJ,UAAA,gBAAAgB,EAACK,GAAA,EAAW,OAAApB,GAAe,UAAAN,EAAA,CAAS;AAAA,YAAA;AAAA,UAAA;AAAA,QACtC;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGN;AAQA,SAAS2B,EAAmB,EAAE,OAAArB,KAA8B;AAC1D,QAAMsB,IAAaC,EAAA,GACb,EAAE,GAAAC,EAAA,IAAMC,EAAA,GACRC,IAAiB1B,EAAM,YAAY,SAAS;AAElD,SACE,gBAAA2B,EAACL,EAAW,OAAX,EAAiB,OAAOE,EAAE,yBAAyB,GAAG,QAAO,SAC3D,UAAA;AAAA,IAAAE,KACC,gBAAAX;AAAA,MAACO,EAAW;AAAA,MAAX;AAAA,QACC,OAAOtB,EAAM,YACV,OAAO,CAAA4B,MAAcA,EAAW,OAAO,EACvC,IAAI,CAAAA,wBACF,QAAA,EAA6B,UAAAA,EAAW,QAAA,GAA9BA,EAAW,KAA2B,CAClD;AAAA,MAAA;AAAA,IAAA;AAAA,IAGN,CAACF,KAAkB1B,EAAM,aAAa,sBACrC,gBAAAe,EAACO,EAAW,MAAX,EAAgB,IAAG,OACjB,UAAAtB,EAAM,OACP,OAAOA,EAAM,OAAQ,YACrB,YAAYA,EAAM,OAClB,OAAQA,EAAM,IAA4B,UAAW,aAChDA,EAAM,IAAiC,OAAA,IACxCA,EAAM,QAAA,CACZ;AAAA,IAED,CAAC0B,KAAkB1B,EAAM,aAAa,sBACrC,gBAAAe,EAACO,EAAW,MAAX,EAAiB,UAAAtB,EAAM,WAAWwB,EAAE,qBAAqB,EAAA,CAAE;AAAA,EAAA,GAEhE;AAEJ;AAEA,SAASK,EAAsB,EAAE,QAAAC,KAAkC;AACjE,QAAMR,IAAaC,EAAA,GACb,EAAE,GAAAC,EAAA,IAAMC,EAAA;AAEd,SACE,gBAAAV,EAACO,EAAW,OAAX,EAAiB,OAAOE,EAAE,kCAAkC,GAAG,QAAO,SACrE,UAAA,gBAAAT;AAAA,IAACO,EAAW;AAAA,IAAX;AAAA,MACC,OAAOQ,EACJ,OAAO,CAAA9B,MAASA,EAAM,WAAWA,EAAM,YAAY,SAAS,CAAC,EAC7D,IAAI,CAACA,GAAO+B,MAAU;AACrB,cAAMC,IAAqBhC,EAAM,YAAY,OAAO,CAAA4B,MAAcA,EAAW,OAAO;AAEpF,eAAII,EAAmB,WAAW,sBACxB,QAAA,EAAkB,UAAAhC,EAAM,WAAWwB,EAAE,qBAAqB,KAAhDO,CAAkD,sBAInE,QAAA,EACE,UAAA;AAAA,UAAA/B,EAAM,WAAWwB,EAAE,qBAAqB;AAAA,UACzC,gBAAAT;AAAA,YAACO,EAAW;AAAA,YAAX;AAAA,cACC,OAAOU,EAAmB,IAAI,CAAAJ,MAC5B,gBAAAb,EAAC,UAA6B,UAAAa,EAAW,WAA9BA,EAAW,KAA2B,CAClD;AAAA,YAAA;AAAA,UAAA;AAAA,QACH,EAAA,GANSG,CAOX;AAAA,MAEJ,CAAC;AAAA,IAAA;AAAA,EAAA,GAEP;AAEJ;AAEO,MAAMX,IAAa,CAAC,EAAE,UAAA1B,GAAU,OAAAM,GAAO,WAAAiC,QAAiC;AAC7E,QAAM,EAAE,kBAAAC,EAAA,IAAqB3B,EAAA,GAEvBuB,IAAS,MAAM,QAAQ9B,CAAK,IAAIA,IAAQA,IAAQ,CAACA,CAAK,IAAI,CAAA,GAC1DmC,IAAYL,EAAO,SAAS;AAElC,MAAIG,KAAa,CAACE;AAChB,6BAAQD,GAAA,EAAiB;AAG3B,QAAM,CAACE,CAAU,IAAIN;AAErB,2BACGO,GAAA,EACE,UAAA;AAAA,IAAAP,EAAO,SAAS,KAAK,gBAAAf,EAACc,GAAA,EAAsB,QAAAC,GAAgB;AAAA,IAC5DA,EAAO,WAAW,KAAKM,KAAc,gBAAArB,EAACM,GAAA,EAAmB,OAAOe,GAAY;AAAA,IAC5E1C;AAAA,EAAA,GACH;AAEJ,GAQMyB,IAAoB,CAAC;AAAA,EACzB,iBAAAX;AAAA,EACA,eAAAJ;AAAA,EACA,eAAAL;AACF,MAA8B;AAC5B,QAAMuC,IAAmBC,EAAO,KAAK,IAAA,CAAK,GACpCC,IAAmBD,EAAOnC,CAAa,GACvCqC,IAAmBF,EAAOxC,CAAa;AAE7C,SAAA2C,EAAU,MAAM;AACd,IAAAF,EAAiB,UAAUpC,GAC3BqC,EAAiB,UAAU1C;AAAA,EAC7B,GAAG,CAACK,GAAeL,CAAa,CAAC,GAEjC2C,EAAU,MACD,MAAM;AACX,UAAMC,IAAW,KAAK,IAAA,IAAQL,EAAiB;AAC/C,IAAAE,EAAiB,SAAS,WAAW;AAAA,MACnC,MAAM;AAAA,MACN,OAAOG;AAAA,MACP,MAAM;AAAA,MACN,MAAMF,EAAiB,UAAU,EAAE,WAAWA,EAAiB,YAAY;AAAA,MAC3E,WAAW,KAAK,IAAA;AAAA,IAAI,CACrB;AAAA,EACH,GACC,CAAA,CAAE,qBAEGjC,GAAA,EAAgB;AAC1B,GAQaS,IAAiB,CAAC;AAAA,EAC7B,UAAAvB;AAAA,EACA,mBAAAC,IAAoBC;AAAA,EACpB,sBAAAa;AACF,wBAEKmC,GAAA,EACE,UAAA,CAAC,EAAE,OAAOC,QACT,gBAAA9B;AAAA,EAAC+B;AAAA,EAAA;AAAA,IACC,mBAAAnD;AAAA,IACA,SAASkD;AAAA,IACT,SAASpC;AAAA,IAER,UAAAf;AAAA,EAAA;AAAA,GAGP;"}
+{"version":3,"file":"Base.js","sources":["../../../src/components/Base/Base.tsx"],"sourcesContent":["import type { ReactNode, JSX, ErrorInfo } from 'react'\nimport { Suspense, useEffect, useRef } from 'react'\nimport type { FallbackProps } from 'react-error-boundary'\nimport { ErrorBoundary } from 'react-error-boundary'\nimport { useTranslation } from 'react-i18next'\nimport { QueryErrorResetBoundary } from '@tanstack/react-query'\nimport { FadeIn } from '../Common/FadeIn/FadeIn'\nimport { BaseContext, type OnEventType } from './useBase'\nimport { useBaseSubmit } from './useBaseSubmit'\nimport { componentEvents, type EventType } from '@/shared/constants'\nimport { InternalError } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport type { ResourceDictionary, Resources } from '@/types/Helpers'\nimport { useLoadingIndicator } from '@/contexts/LoadingIndicatorProvider/useLoadingIndicator'\nimport type { LoadingIndicatorContextProps } from '@/contexts/LoadingIndicatorProvider/useLoadingIndicator'\nimport { useObservability } from '@/contexts/ObservabilityProvider/useObservability'\nimport { normalizeToSDKError, type SDKError } from '@/types/sdkError'\n\nexport interface CommonComponentInterface<TResourceKey extends keyof Resources = keyof Resources> {\n  children?: ReactNode\n  className?: string\n  defaultValues?: unknown\n  dictionary?: ResourceDictionary<TResourceKey>\n}\n\nexport interface BaseComponentInterface<\n  TResourceKey extends keyof Resources = keyof Resources,\n> extends CommonComponentInterface<TResourceKey> {\n  FallbackComponent?: BaseBoundariesProps['FallbackComponent']\n  LoaderComponent?: LoadingIndicatorContextProps['LoadingIndicator']\n  onEvent: OnEventType<EventType, unknown>\n}\n\ninterface InternalBaseComponentProps {\n  componentName?: string\n}\n\nexport const BaseComponent = <TResourceKey extends keyof Resources = keyof Resources>({\n  children,\n  FallbackComponent = InternalError,\n  LoaderComponent: LoadingIndicatorFromProps,\n  onEvent,\n  componentName,\n}: BaseComponentInterface<TResourceKey> & InternalBaseComponentProps) => {\n  const { error, baseSubmitHandler, setError } = useBaseSubmit(componentName)\n  const { observability } = useObservability()\n\n  const { LoadingIndicator: LoadingIndicatorFromContext } = useLoadingIndicator()\n  const LoaderComponent = LoadingIndicatorFromProps ?? LoadingIndicatorFromContext\n\n  const onErrorBoundaryError = (boundaryError: unknown, errorInfo: ErrorInfo) => {\n    onEvent(componentEvents.ERROR, boundaryError)\n\n    const sdkError = normalizeToSDKError(boundaryError)\n\n    observability?.onError?.({\n      ...sdkError,\n      timestamp: Date.now(),\n      componentName,\n      componentStack: errorInfo.componentStack ?? undefined,\n    })\n  }\n\n  return (\n    <BaseContext.Provider\n      value={{\n        error,\n        setError,\n        onEvent,\n        baseSubmitHandler,\n        LoadingIndicator: LoaderComponent,\n        componentName,\n      }}\n    >\n      <BaseBoundaries\n        FallbackComponent={FallbackComponent}\n        onErrorBoundaryError={onErrorBoundaryError}\n        componentName={componentName}\n      >\n        <BaseLayout error={error}>{children}</BaseLayout>\n      </BaseBoundaries>\n    </BaseContext.Provider>\n  )\n}\n\nexport interface BaseLayoutProps {\n  children?: ReactNode\n  error?: SDKError | SDKError[] | null\n  isLoading?: boolean\n}\n\nfunction SingleErrorContent({ error }: { error: SDKError }) {\n  const Components = useComponentContext()\n  const { t } = useTranslation()\n  const hasFieldErrors = error.fieldErrors.length > 0\n\n  return (\n    <Components.Alert label={t('status.errorEncountered')} status=\"error\">\n      {hasFieldErrors && (\n        <Components.UnorderedList\n          items={error.fieldErrors\n            .filter(fieldError => fieldError.message)\n            .map(fieldError => (\n              <span key={fieldError.field}>{fieldError.message}</span>\n            ))}\n        />\n      )}\n      {!hasFieldErrors && error.category === 'validation_error' && (\n        <Components.Text as=\"pre\">\n          {error.raw &&\n          typeof error.raw === 'object' &&\n          'pretty' in error.raw &&\n          typeof (error.raw as { pretty: unknown }).pretty === 'function'\n            ? (error.raw as { pretty: () => string }).pretty()\n            : error.message}\n        </Components.Text>\n      )}\n      {!hasFieldErrors && error.category !== 'validation_error' && (\n        <Components.Text>{error.message || t('errors.unknownError')}</Components.Text>\n      )}\n    </Components.Alert>\n  )\n}\n\nfunction MultipleErrorsContent({ errors }: { errors: SDKError[] }) {\n  const Components = useComponentContext()\n  const { t } = useTranslation()\n\n  return (\n    <Components.Alert label={t('status.multipleErrorsEncountered')} status=\"error\">\n      <Components.UnorderedList\n        items={errors\n          .filter(error => error.message || error.fieldErrors.length > 0)\n          .map((error, index) => {\n            const visibleFieldErrors = error.fieldErrors.filter(fieldError => fieldError.message)\n\n            if (visibleFieldErrors.length === 0) {\n              return <span key={index}>{error.message || t('errors.unknownError')}</span>\n            }\n\n            return (\n              <span key={index}>\n                {error.message || t('errors.unknownError')}\n                <Components.UnorderedList\n                  items={visibleFieldErrors.map(fieldError => (\n                    <span key={fieldError.field}>{fieldError.message}</span>\n                  ))}\n                />\n              </span>\n            )\n          })}\n      />\n    </Components.Alert>\n  )\n}\n\nexport const BaseLayout = ({ children, error, isLoading }: BaseLayoutProps) => {\n  const { LoadingIndicator } = useLoadingIndicator()\n\n  const errors = Array.isArray(error) ? error : error ? [error] : []\n  const hasErrors = errors.length > 0\n\n  if (isLoading && !hasErrors) {\n    return <LoadingIndicator />\n  }\n\n  const [firstError] = errors\n\n  return (\n    <FadeIn>\n      {errors.length > 1 && <MultipleErrorsContent errors={errors} />}\n      {errors.length === 1 && firstError && <SingleErrorContent error={firstError} />}\n      {children}\n    </FadeIn>\n  )\n}\n\ninterface LoaderWithMetricsProps {\n  LoaderComponent: LoadingIndicatorContextProps['LoadingIndicator']\n  observability: ReturnType<typeof useObservability>['observability']\n  componentName?: string\n}\n\nconst LoaderWithMetrics = ({\n  LoaderComponent,\n  observability,\n  componentName,\n}: LoaderWithMetricsProps) => {\n  const loadingStartTime = useRef(Date.now())\n  const observabilityRef = useRef(observability)\n  const componentNameRef = useRef(componentName)\n\n  useEffect(() => {\n    observabilityRef.current = observability\n    componentNameRef.current = componentName\n  }, [observability, componentName])\n\n  useEffect(() => {\n    return () => {\n      const duration = Date.now() - loadingStartTime.current\n      observabilityRef.current?.onMetric?.({\n        name: 'sdk.component.loading_duration',\n        value: duration,\n        unit: 'ms',\n        tags: componentNameRef.current ? { component: componentNameRef.current } : undefined,\n        timestamp: Date.now(),\n      })\n    }\n  }, [])\n\n  return <LoaderComponent />\n}\n\nfunction SuspenseFallback({ componentName }: { componentName?: string }) {\n  const { LoadingIndicator } = useLoadingIndicator()\n  const { observability } = useObservability()\n  return (\n    <LoaderWithMetrics\n      LoaderComponent={LoadingIndicator}\n      observability={observability}\n      componentName={componentName}\n    />\n  )\n}\n\nexport interface BaseBoundariesProps {\n  children?: ReactNode\n  FallbackComponent?: (props: FallbackProps) => JSX.Element\n  onErrorBoundaryError?: (error: unknown, info: ErrorInfo) => void\n  componentName?: string\n}\n\nexport const BaseBoundaries = ({\n  children,\n  FallbackComponent = InternalError,\n  onErrorBoundaryError,\n  componentName,\n}: BaseBoundariesProps) => {\n  return (\n    <QueryErrorResetBoundary>\n      {({ reset: resetQueries }) => (\n        <ErrorBoundary\n          FallbackComponent={FallbackComponent}\n          onReset={resetQueries}\n          onError={onErrorBoundaryError}\n        >\n          <Suspense fallback={<SuspenseFallback componentName={componentName} />}>\n            {children}\n          </Suspense>\n        </ErrorBoundary>\n      )}\n    </QueryErrorResetBoundary>\n  )\n}\n"],"names":["BaseComponent","children","FallbackComponent","InternalError","LoadingIndicatorFromProps","onEvent","componentName","error","baseSubmitHandler","setError","useBaseSubmit","observability","useObservability","LoadingIndicatorFromContext","useLoadingIndicator","LoaderComponent","onErrorBoundaryError","boundaryError","errorInfo","componentEvents","sdkError","normalizeToSDKError","jsx","BaseContext","BaseBoundaries","BaseLayout","SingleErrorContent","Components","useComponentContext","t","useTranslation","hasFieldErrors","jsxs","fieldError","MultipleErrorsContent","errors","index","visibleFieldErrors","isLoading","LoadingIndicator","hasErrors","firstError","FadeIn","LoaderWithMetrics","loadingStartTime","useRef","observabilityRef","componentNameRef","useEffect","duration","SuspenseFallback","QueryErrorResetBoundary","resetQueries","ErrorBoundary","Suspense"],"mappings":";;;;;;;;;;;;;;AAqCO,MAAMA,IAAgB,CAAyD;AAAA,EACpF,UAAAC;AAAA,EACA,mBAAAC,IAAoBC;AAAA,EACpB,iBAAiBC;AAAA,EACjB,SAAAC;AAAA,EACA,eAAAC;AACF,MAAyE;AACvE,QAAM,EAAE,OAAAC,GAAO,mBAAAC,GAAmB,UAAAC,EAAA,IAAaC,EAAcJ,CAAa,GACpE,EAAE,eAAAK,EAAA,IAAkBC,EAAA,GAEpB,EAAE,kBAAkBC,EAAA,IAAgCC,EAAA,GACpDC,IAAkBX,KAA6BS,GAE/CG,IAAuB,CAACC,GAAwBC,MAAyB;AAC7E,IAAAb,EAAQc,EAAgB,OAAOF,CAAa;AAE5C,UAAMG,IAAWC,EAAoBJ,CAAa;AAElD,IAAAN,GAAe,UAAU;AAAA,MACvB,GAAGS;AAAA,MACH,WAAW,KAAK,IAAA;AAAA,MAChB,eAAAd;AAAA,MACA,gBAAgBY,EAAU,kBAAkB;AAAA,IAAA,CAC7C;AAAA,EACH;AAEA,SACE,gBAAAI;AAAA,IAACC,EAAY;AAAA,IAAZ;AAAA,MACC,OAAO;AAAA,QACL,OAAAhB;AAAA,QACA,UAAAE;AAAA,QACA,SAAAJ;AAAA,QACA,mBAAAG;AAAA,QACA,kBAAkBO;AAAA,QAClB,eAAAT;AAAA,MAAA;AAAA,MAGF,UAAA,gBAAAgB;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,mBAAAtB;AAAA,UACA,sBAAAc;AAAA,UACA,eAAAV;AAAA,UAEA,UAAA,gBAAAgB,EAACG,GAAA,EAAW,OAAAlB,GAAe,UAAAN,EAAA,CAAS;AAAA,QAAA;AAAA,MAAA;AAAA,IACtC;AAAA,EAAA;AAGN;AAQA,SAASyB,EAAmB,EAAE,OAAAnB,KAA8B;AAC1D,QAAMoB,IAAaC,EAAA,GACb,EAAE,GAAAC,EAAA,IAAMC,EAAA,GACRC,IAAiBxB,EAAM,YAAY,SAAS;AAElD,SACE,gBAAAyB,EAACL,EAAW,OAAX,EAAiB,OAAOE,EAAE,yBAAyB,GAAG,QAAO,SAC3D,UAAA;AAAA,IAAAE,KACC,gBAAAT;AAAA,MAACK,EAAW;AAAA,MAAX;AAAA,QACC,OAAOpB,EAAM,YACV,OAAO,CAAA0B,MAAcA,EAAW,OAAO,EACvC,IAAI,CAAAA,wBACF,QAAA,EAA6B,UAAAA,EAAW,QAAA,GAA9BA,EAAW,KAA2B,CAClD;AAAA,MAAA;AAAA,IAAA;AAAA,IAGN,CAACF,KAAkBxB,EAAM,aAAa,sBACrC,gBAAAe,EAACK,EAAW,MAAX,EAAgB,IAAG,OACjB,UAAApB,EAAM,OACP,OAAOA,EAAM,OAAQ,YACrB,YAAYA,EAAM,OAClB,OAAQA,EAAM,IAA4B,UAAW,aAChDA,EAAM,IAAiC,OAAA,IACxCA,EAAM,QAAA,CACZ;AAAA,IAED,CAACwB,KAAkBxB,EAAM,aAAa,sBACrC,gBAAAe,EAACK,EAAW,MAAX,EAAiB,UAAApB,EAAM,WAAWsB,EAAE,qBAAqB,EAAA,CAAE;AAAA,EAAA,GAEhE;AAEJ;AAEA,SAASK,EAAsB,EAAE,QAAAC,KAAkC;AACjE,QAAMR,IAAaC,EAAA,GACb,EAAE,GAAAC,EAAA,IAAMC,EAAA;AAEd,SACE,gBAAAR,EAACK,EAAW,OAAX,EAAiB,OAAOE,EAAE,kCAAkC,GAAG,QAAO,SACrE,UAAA,gBAAAP;AAAA,IAACK,EAAW;AAAA,IAAX;AAAA,MACC,OAAOQ,EACJ,OAAO,CAAA5B,MAASA,EAAM,WAAWA,EAAM,YAAY,SAAS,CAAC,EAC7D,IAAI,CAACA,GAAO6B,MAAU;AACrB,cAAMC,IAAqB9B,EAAM,YAAY,OAAO,CAAA0B,MAAcA,EAAW,OAAO;AAEpF,eAAII,EAAmB,WAAW,sBACxB,QAAA,EAAkB,UAAA9B,EAAM,WAAWsB,EAAE,qBAAqB,KAAhDO,CAAkD,sBAInE,QAAA,EACE,UAAA;AAAA,UAAA7B,EAAM,WAAWsB,EAAE,qBAAqB;AAAA,UACzC,gBAAAP;AAAA,YAACK,EAAW;AAAA,YAAX;AAAA,cACC,OAAOU,EAAmB,IAAI,CAAAJ,MAC5B,gBAAAX,EAAC,UAA6B,UAAAW,EAAW,WAA9BA,EAAW,KAA2B,CAClD;AAAA,YAAA;AAAA,UAAA;AAAA,QACH,EAAA,GANSG,CAOX;AAAA,MAEJ,CAAC;AAAA,IAAA;AAAA,EAAA,GAEP;AAEJ;AAEO,MAAMX,IAAa,CAAC,EAAE,UAAAxB,GAAU,OAAAM,GAAO,WAAA+B,QAAiC;AAC7E,QAAM,EAAE,kBAAAC,EAAA,IAAqBzB,EAAA,GAEvBqB,IAAS,MAAM,QAAQ5B,CAAK,IAAIA,IAAQA,IAAQ,CAACA,CAAK,IAAI,CAAA,GAC1DiC,IAAYL,EAAO,SAAS;AAElC,MAAIG,KAAa,CAACE;AAChB,6BAAQD,GAAA,EAAiB;AAG3B,QAAM,CAACE,CAAU,IAAIN;AAErB,2BACGO,GAAA,EACE,UAAA;AAAA,IAAAP,EAAO,SAAS,KAAK,gBAAAb,EAACY,GAAA,EAAsB,QAAAC,GAAgB;AAAA,IAC5DA,EAAO,WAAW,KAAKM,KAAc,gBAAAnB,EAACI,GAAA,EAAmB,OAAOe,GAAY;AAAA,IAC5ExC;AAAA,EAAA,GACH;AAEJ,GAQM0C,IAAoB,CAAC;AAAA,EACzB,iBAAA5B;AAAA,EACA,eAAAJ;AAAA,EACA,eAAAL;AACF,MAA8B;AAC5B,QAAMsC,IAAmBC,EAAO,KAAK,IAAA,CAAK,GACpCC,IAAmBD,EAAOlC,CAAa,GACvCoC,IAAmBF,EAAOvC,CAAa;AAE7C,SAAA0C,EAAU,MAAM;AACd,IAAAF,EAAiB,UAAUnC,GAC3BoC,EAAiB,UAAUzC;AAAA,EAC7B,GAAG,CAACK,GAAeL,CAAa,CAAC,GAEjC0C,EAAU,MACD,MAAM;AACX,UAAMC,IAAW,KAAK,IAAA,IAAQL,EAAiB;AAC/C,IAAAE,EAAiB,SAAS,WAAW;AAAA,MACnC,MAAM;AAAA,MACN,OAAOG;AAAA,MACP,MAAM;AAAA,MACN,MAAMF,EAAiB,UAAU,EAAE,WAAWA,EAAiB,YAAY;AAAA,MAC3E,WAAW,KAAK,IAAA;AAAA,IAAI,CACrB;AAAA,EACH,GACC,CAAA,CAAE,qBAEGhC,GAAA,EAAgB;AAC1B;AAEA,SAASmC,EAAiB,EAAE,eAAA5C,KAA6C;AACvE,QAAM,EAAE,kBAAAiC,EAAA,IAAqBzB,EAAA,GACvB,EAAE,eAAAH,EAAA,IAAkBC,EAAA;AAC1B,SACE,gBAAAU;AAAA,IAACqB;AAAA,IAAA;AAAA,MACC,iBAAiBJ;AAAA,MACjB,eAAA5B;AAAA,MACA,eAAAL;AAAA,IAAA;AAAA,EAAA;AAGN;AASO,MAAMkB,IAAiB,CAAC;AAAA,EAC7B,UAAAvB;AAAA,EACA,mBAAAC,IAAoBC;AAAA,EACpB,sBAAAa;AAAA,EACA,eAAAV;AACF,wBAEK6C,GAAA,EACE,UAAA,CAAC,EAAE,OAAOC,QACT,gBAAA9B;AAAA,EAAC+B;AAAA,EAAA;AAAA,IACC,mBAAAnD;AAAA,IACA,SAASkD;AAAA,IACT,SAASpC;AAAA,IAET,4BAACsC,GAAA,EAAS,4BAAWJ,GAAA,EAAiB,eAAA5C,GAA8B,GACjE,UAAAL,EAAA,CACH;AAAA,EAAA;AAAA,GAGN;"}

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

@@ -1 +1 @@
-{"version":3,"file":"createCompoundContext.js","sources":["../../../src/components/Base/createCompoundContext.tsx"],"sourcesContent":["import { createContext, useContext } from 'react'\n\nexport function createCompoundContext<T>(contextName: string, defaultValue: T | null = null) {\n  const context = createContext<T | null>(defaultValue)\n\n  const useCompoundContext = () => {\n    const ctx = useContext(context)\n    if (!ctx) {\n      throw new Error(`${contextName} must be used within its Provider.`)\n    }\n    return ctx\n  }\n\n  return [useCompoundContext, context.Provider] as const\n}\n"],"names":["createCompoundContext","contextName","defaultValue","context","createContext","ctx","useContext"],"mappings":";AAEO,SAASA,EAAyBC,GAAqBC,IAAyB,MAAM;AAC3F,QAAMC,IAAUC,EAAwBF,CAAY;AAUpD,SAAO,CARoB,MAAM;AAC/B,UAAMG,IAAMC,EAAWH,CAAO;AAC9B,QAAI,CAACE;AACH,YAAM,IAAI,MAAM,GAAGJ,CAAW,oCAAoC;AAEpE,WAAOI;AAAA,EACT,GAE4BF,EAAQ,QAAQ;AAC9C;"}
+{"version":3,"file":"createCompoundContext.js","sources":["../../../src/components/Base/createCompoundContext.tsx"],"sourcesContent":["import { createContext, useContext } from 'react'\n\nexport function createCompoundContext<T>(contextName: string, defaultValue: T | null = null) {\n  const context = createContext(defaultValue)\n\n  const useCompoundContext = () => {\n    const ctx = useContext(context)\n    if (!ctx) {\n      throw new Error(`${contextName} must be used within its Provider.`)\n    }\n    return ctx\n  }\n\n  return [useCompoundContext, context.Provider] as const\n}\n"],"names":["createCompoundContext","contextName","defaultValue","context","createContext","ctx","useContext"],"mappings":";AAEO,SAASA,EAAyBC,GAAqBC,IAAyB,MAAM;AAC3F,QAAMC,IAAUC,EAAcF,CAAY;AAU1C,SAAO,CARoB,MAAM;AAC/B,UAAMG,IAAMC,EAAWH,CAAO;AAC9B,QAAI,CAACE;AACH,YAAM,IAAI,MAAM,GAAGJ,CAAW,oCAAoC;AAEpE,WAAOI;AAAA,EACT,GAE4BF,EAAQ,QAAQ;AAC9C;"}

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":"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"}