@gusto/embedded-react-sdk 0.43.0 → 0.44.1

package/CHANGELOG.md

@@ -1,5 +1,113 @@
 # Changelog
 
+## 0.44.1
+
+### Chores & Maintenance
+
+- Upgrade `@gusto/embedded-api` to `0.13.0` (adapts SDK to renamed error class `UnprocessableEntityError`, `PayScheduleShow` rename, typed mutation bodies, and renamed response payload keys; no public SDK API changes)
+- Bump various dev dependencies (`@commitlint/cli`, `@commitlint/config-conventional`, `lint-staged`, `msw`)
+- Bump `fast-uri` to `3.1.2` (transitive npm/yarn security update)
+
+## 0.44.0
+
+### Breaking Changes
+
+#### `UNSTABLE_TimeOff` namespace renamed to `TimeOff`
+
+TimeOff components are now exported as `TimeOff.*` instead of `UNSTABLE_TimeOff.*`:
+
+```tsx
+// Before
+import { UNSTABLE_TimeOff } from '@gusto/embedded-react-sdk'
+;<UNSTABLE_TimeOff.TimeOffFlow companyId={companyId} onEvent={handleEvent} />
+
+// After
+import { TimeOff } from '@gusto/embedded-react-sdk'
+;<TimeOff.TimeOffFlow companyId={companyId} onEvent={handleEvent} />
+```
+
+#### `useCompensationForm` split into `useJobForm` + `useCompensationForm`
+
+The monolithic `useCompensationForm` has been decomposed into focused, steady-state hooks so partners can drive job and compensation lifecycles independently or together.
+
+- `useJobForm` / `useCurrentJobForm`: create | update routing, error handling, and POST/PUT/DELETE wiring for the Jobs API.
+- `useCompensationForm` / `useCurrentCompensationForm`: single create | update path covering both the onboarding stub-update case and steady-state effective-dated compensations, with optimistic-locking via version.
+
+`useCompensationForm.actions.onSubmit` changed from `(callbacks?, options?)` to `(options?)`. The `CompensationSubmitCallbacks` export is removed. Read the saved compensation from the awaited `HookSubmitResult`'s `data` field instead of wiring `onCompensationCreated` / `onCompensationUpdated`.
+
+#### `Employee.Profile` migrated to hook architecture with management variant
+
+`Employee.Profile` has been rebuilt on the hook architecture and now supports steady-state edit mode. `useEmployeeDetailsForm` props are now a discriminated union on `companyId`/`employeeId`. `EmployeeOnboarding.Profile` and `EmployeeManagement.Profile` each point to their dedicated variant.
+
+#### `Employee.FederalTaxes` split into onboarding + management variants
+
+The `isOnboarding` prop has been replaced with two journey-scoped components:
+
+- `EmployeeOnboarding.FederalTaxes` — Continue button, emits `EMPLOYEE_FEDERAL_TAXES_UPDATED` + `EMPLOYEE_FEDERAL_TAXES_DONE`.
+- `EmployeeManagement.FederalTaxes` — Cancel + Save, dismissible success alert, emits `CANCEL` or `EMPLOYEE_FEDERAL_TAXES_UPDATED` (no `_DONE`).
+
+`Employee.FederalTaxes` now resolves to the management variant (matching the WorkAddress/HomeAddress convention).
+
+### Features & Enhancements
+
+- Export `LocationForm` as standalone component
+- Add `useEmployeeStateTaxesForm` hook and migrate `Employee.StateTaxes`
+- Add `StateTaxes` management variant (onboarding/management split)
+- Display `setup_status`, `default_rates_applied`, and `ready_to_run_payroll` in `StateTaxesList`
+- Add time-off policy detail presentational and functional components with tests
+- Add `HolidayPolicyDetail` presentational and functional components
+- Add edit employee balance modal for time-off policy detail
+- Pre-fill carry-over balances when adding employees to a time-off policy
+- Surface `eligiblePaidTimeOff` via `Include.AllCompensations`
+- Focus visually first invalid field across composed forms
+- Update Company header styles with consistent spacing and supporting text variant
+
+### Fixes
+
+- Make sure to update for component adaptor
+- Use component context for dialog buttons
+- Workers comp rate inputs submit typed values (SDK-798)
+- Improve accessibility: add `aria-labelledby` and `aria-controls` attributes to Time Off form landmarks, PolicySettings switches, and balance inputs
+- Remove hardcoded colors in PolicySettings for theme compliance
+- Correct policy settings visibility for fixed accrual methods
+- Adjust day dropdown in policy reset date based on selected month
+- Hide job title column on time-off policy detail page
+- Use locale-aware date formatting in TimeOff components
+- Use server-side search for employee selection in time-off flows
+- Wire holiday policy edit, add-employees, and delete flows
+- Keep delete confirmation dialog open when deletion fails
+- Clear stale policyId when starting new create flow in TimeOff wizard
+- Rename policy list menu item from "Edit policy" to "View policy"
+- Improve error message when removing employees with pending time-off requests
+- Make reset date type optional for hourly accrual methods
+- Filter policy detail settings display by accrual method category
+- Hide Edit balance menu item for unlimited time-off policies
+- Emit SDK event on time off policy deletion
+- Reset edit balance modal state when switching employees
+- Use update mutation when editing existing time-off policies
+- Hide holiday pay option when company already has a policy
+- Filter time-off policy list to PTO, Sick, and Holiday only
+- Hide deactivated policies from time-off policy list
+- Display employee names in time-off policy detail
+- Hide job title and balance columns for unlimited time-off policies
+- Send `complete: false` when creating non-unlimited time-off policies
+- Scope time-off reassignment warning per policy type
+- Treat NaN as empty in form schema so required validation fires for cleared number inputs
+- Improve validation error for net pay in off-cycle payroll (SDK-735)
+- Reduce button padding and min-height to match input height
+- Apply max length to information request text response (SDK-423)
+
+### Chores & Maintenance
+
+- Rebuild `Employee.Compensation` around a state machine + presentation/connected split
+- Anchor `TimeOffPolicyType` to SDK `PolicyType` enum
+- Remove dead code (`SelectEmployees`, `ViewPolicyDetails`/`ViewPolicyEmployees` stubs, unused i18n keys)
+- Remove duplicate `contractorName` and clean up Street 2 labels
+- Update README with missing docs and fix stale links
+- Standardize workflows-overview structure and add missing components
+- Validate Storybook and SDK app builds in CI
+- Bump various dependencies (i18next, react-i18next, msw, lint-staged, vite-plugin-circular-dependency, react-router-dom, axios, typescript-eslint, globals, @commitlint/cli, react-hook-form, dompurify, @storybook/addon-docs, @storybook/addon-a11y, @storybook/addon-onboarding, @commitlint/config-conventional)
+
 ## 0.43.0
 
 ### Features & Enhancements

package/README.md

@@ -8,15 +8,19 @@ To install:
 npm add @gusto/embedded-react-sdk
 ```
 
-Examples at:
+## SDK Dev App
 
-https://codesandbox.io/p/sandbox/gusto-embedded-sdk-demo-employeelist-nzpslw
+A standalone development application for building and testing SDK components with live API data is available in [`sdk-app/`](sdk-app/). To get started:
 
-## Documentation
+```bash
+npm run sdk-app              # Demo environment (default)
+npm run sdk-app:staging      # Staging environment
+```
 
-Live documentation is available at: https://docs.gusto.com/embedded-payroll/docs/what-is-the-gep-react-sdk
+See the [SDK Dev App README](sdk-app/README.md) for full setup and usage details.
+
+## Documentation
 
-- [What is the GEP React SDK](docs/what-is-the-gep-react-sdk.md)
 - [Deciding to build with the SDK](docs/deciding-to-build-with-the-sdk/deciding-to-build-with-the-sdk.md)
   - [Build Pathways - SDK, Flows & APIs](docs/deciding-to-build-with-the-sdk/build-pathways-sdk-flows-api.md)
   - [Component Types](docs/deciding-to-build-with-the-sdk/component-types.md)
@@ -33,6 +37,8 @@ Live documentation is available at: https://docs.gusto.com/embedded-payroll/docs
   - [Routing](docs/integration-guide/routing.md)
   - [Request Interceptors](docs/integration-guide/request-interceptors.md)
   - [Customizing SDK UI](docs/integration-guide/customizing-sdk-ui.md)
+  - [Observability](docs/integration-guide/observability.md)
+  - [Observability Examples](docs/integration-guide/observability-examples.md)
 - [Theming](docs/theming/theming.md)
   - [Theming Guide](docs/theming/theming-guide.md)
   - [Theme Variables](docs/theming/theme-variables.md)
@@ -42,11 +48,19 @@ Live documentation is available at: https://docs.gusto.com/embedded-payroll/docs
   - [Setting up your Component Adapter](docs/component-adapter/setting-up-your-component-adapter.md)
   - [Component Inventory](docs/component-adapter/component-inventory.md)
   - [Component Adapter FAQ](docs/component-adapter/component-adapter-faq.md)
+- [Reference](docs/reference/endpoint-reference.md)
+  - [Endpoint Reference](docs/reference/endpoint-reference.md)
+  - [Jobs and Compensations](docs/reference/jobs-and-compensations.md)
+  - [Proxy Examples](docs/reference/proxy-examples.md)
 - [Workflows Overview](docs/workflows-overview/workflows-overview.md)
   - [Company Onboarding](docs/workflows-overview/company-onboarding.md)
   - [Contractor Onboarding](docs/workflows-overview/contractor-onboarding.md)
+  - [Contractor Payments](docs/workflows-overview/contractor-payments.md)
   - [Employee Onboarding](docs/workflows-overview/employee-onboarding/employee-onboarding.md)
     - [Employee Self-Onboarding](docs/workflows-overview/employee-onboarding/employee-self-onboarding.md)
+  - [Employee Dashboard](docs/workflows-overview/employee-dashboard.md)
+  - [Employee Termination](docs/workflows-overview/employee-termination.md)
+  - [Information Requests](docs/workflows-overview/information-requests.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)
@@ -54,4 +68,8 @@ Live documentation is available at: https://docs.gusto.com/embedded-payroll/docs
 - [Hooks (Experimental)](docs/hooks/hooks.md)
   - [useEmployeeDetailsForm](docs/hooks/useEmployeeDetailsForm.md)
   - [useCompensationForm](docs/hooks/useCompensationForm.md)
+  - [useFederalTaxesForm](docs/hooks/useFederalTaxesForm.md)
+  - [usePayScheduleForm](docs/hooks/usePayScheduleForm.md)
+  - [useSignCompanyForm](docs/hooks/useSignCompanyForm.md)
+  - [useSignEmployeeForm](docs/hooks/useSignEmployeeForm.md)
   - [useWorkAddressForm](docs/hooks/useWorkAddressForm.md)

package/dist/assets/icons/edit-02.svg.js

@@ -0,0 +1,10 @@
+import * as e from "react";
+const n = ({
+  title: t,
+  titleId: r,
+  ...o
+}) => /* @__PURE__ */ e.createElement("svg", { width: 20, height: 20, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-labelledby": r, ...o }, t ? /* @__PURE__ */ e.createElement("title", { id: r }, t) : null, /* @__PURE__ */ e.createElement("path", { d: "M14.9999 8.33228L11.6666 4.99895M2.08325 17.9156L4.90356 17.6023C5.24813 17.564 5.42042 17.5448 5.58146 17.4927C5.72433 17.4464 5.86029 17.3811 5.98566 17.2984C6.12696 17.2052 6.24954 17.0827 6.49469 16.8375L17.4999 5.83228C18.4204 4.91181 18.4204 3.41942 17.4999 2.49895C16.5795 1.57848 15.0871 1.57847 14.1666 2.49895L3.16136 13.5042C2.91621 13.7493 2.79363 13.8719 2.70045 14.0132C2.61778 14.1386 2.55243 14.2745 2.50618 14.4174C2.45405 14.5784 2.43491 14.7507 2.39662 15.0953L2.08325 17.9156Z", stroke: "currentColor", strokeWidth: 1.66667, strokeLinecap: "round", strokeLinejoin: "round" }));
+export {
+  n as default
+};
+//# sourceMappingURL=edit-02.svg.js.map

package/dist/assets/icons/edit-02.svg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"edit-02.svg.js","sources":["../../../src/assets/icons/edit-02.svg?react"],"sourcesContent":["import * as React from \"react\";\nconst SvgEdit02 = ({\n  title,\n  titleId,\n  ...props\n}) => /* @__PURE__ */ React.createElement(\"svg\", { width: 20, height: 20, viewBox: \"0 0 20 20\", fill: \"none\", xmlns: \"http://www.w3.org/2000/svg\", \"aria-labelledby\": titleId, ...props }, title ? /* @__PURE__ */ React.createElement(\"title\", { id: titleId }, title) : null, /* @__PURE__ */ React.createElement(\"path\", { d: \"M14.9999 8.33228L11.6666 4.99895M2.08325 17.9156L4.90356 17.6023C5.24813 17.564 5.42042 17.5448 5.58146 17.4927C5.72433 17.4464 5.86029 17.3811 5.98566 17.2984C6.12696 17.2052 6.24954 17.0827 6.49469 16.8375L17.4999 5.83228C18.4204 4.91181 18.4204 3.41942 17.4999 2.49895C16.5795 1.57848 15.0871 1.57847 14.1666 2.49895L3.16136 13.5042C2.91621 13.7493 2.79363 13.8719 2.70045 14.0132C2.61778 14.1386 2.55243 14.2745 2.50618 14.4174C2.45405 14.5784 2.43491 14.7507 2.39662 15.0953L2.08325 17.9156Z\", stroke: \"currentColor\", strokeWidth: 1.66667, strokeLinecap: \"round\", strokeLinejoin: \"round\" }));\nexport default SvgEdit02;\n"],"names":["SvgEdit02","title","titleId","props","React"],"mappings":";AACK,MAACA,IAAY,CAAC;AAAA,EACjB,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,MAAsB,gBAAAC,EAAM,cAAc,OAAO,EAAE,OAAO,IAAI,QAAQ,IAAI,SAAS,aAAa,MAAM,QAAQ,OAAO,8BAA8B,mBAAmBF,GAAS,GAAGC,EAAK,GAAIF,IAAwB,gBAAAG,EAAM,cAAc,SAAS,EAAE,IAAIF,KAAWD,CAAK,IAAI,MAAsB,gBAAAG,EAAM,cAAc,QAAQ,EAAE,GAAG,ofAAof,QAAQ,gBAAgB,aAAa,SAAS,eAAe,SAAS,gBAAgB,SAAS,CAAC;"}

package/dist/components/Base/useBaseSubmit.js

@@ -1,12 +1,12 @@
 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 { APIError as E } from "@gusto/embedded-api/models/errors/apierror";
+import { GustoEmbeddedError as b } 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 { UnprocessableEntityError as p } from "@gusto/embedded-api/models/errors/unprocessableentityerror";
 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 x = (t) => {
   const [u, o] = f(null), a = y(), { observability: s } = D(), i = m(
     (n) => {
       const e = S(n);
@@ -23,7 +23,7 @@ const g = (t) => {
         try {
           await e(n), c = !0;
         } catch (r) {
-          r instanceof b || r instanceof d || r instanceof p || r instanceof E || r instanceof w ? i(r) : a(r);
+          r instanceof E || r instanceof d || r instanceof p || r instanceof b || r instanceof w ? i(r) : a(r);
         } finally {
           const r = Date.now() - l;
           s?.onMetric?.({
@@ -45,6 +45,6 @@ const g = (t) => {
   };
 };
 export {
-  g as useBaseSubmit
+  x 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 { 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;"}
+{"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 { UnprocessableEntityError } from '@gusto/embedded-api/models/errors/unprocessableentityerror'\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 UnprocessableEntityError ||\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","UnprocessableEntityError","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/DataTable/DataTable.js

@@ -1,10 +1,10 @@
-import { jsx as l } from "react/jsx-runtime";
-import { useId as w, useState as T } from "react";
-import { useTranslation as F } from "react-i18next";
-import { useSelectionState as S } from "../useSelectionState.js";
-import { useComponentContext as j } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-import { VisuallyHidden as p } from "../../VisuallyHidden/VisuallyHidden.js";
-function A(c, n) {
+import { jsx as a } from "react/jsx-runtime";
+import { useId as P, useState as V } from "react";
+import { useTranslation as T } from "react-i18next";
+import { useSelectionState as F } from "../useSelectionState.js";
+import { useComponentContext as S } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { VisuallyHidden as h } from "../../VisuallyHidden/VisuallyHidden.js";
+function j(c, n) {
   if (n.render)
     return n.render(c);
   if (n.key) {
@@ -13,32 +13,54 @@ function A(c, n) {
   }
   return "";
 }
-const J = ({
+const B = ({
   label: c,
   data: n,
   columns: s,
   itemMenu: d,
-  onSelect: a,
+  onSelect: r,
   onSelectAll: C,
   getIsItemSelected: u,
-  emptyState: b,
-  footer: k,
-  isWithinBox: R,
-  selectionMode: h = "multiple"
+  emptyState: f,
+  footer: b,
+  isWithinBox: g,
+  selectionMode: k = "multiple"
 }) => {
-  const y = j(), { t: i } = F("common"), $ = w(), [g, m] = T(null), { allSelected: H } = S(n, u), L = [
-    ...a ? [
+  const p = S(), { t: i } = T("common"), R = P(), [D, $] = V(null), { allSelected: m } = F(n, u), H = [
+    ...r ? [
       {
         key: "select-header",
-        content: h === "multiple" && u ? /* @__PURE__ */ l(
-          y.Checkbox,
-          {
-            value: H,
-            onChange: (e) => C?.(e, n),
-            label: i("table.selectAllRowsLabel"),
-            shouldVisuallyHideLabel: !0
-          }
-        ) : /* @__PURE__ */ l(p, { children: i("table.selectRowHeader") })
+        content: k === "multiple" && u ? (
+          // Stop propagation so the surrounding react-aria-components
+          // <Column> press handler doesn't intercept the checkbox click
+          // and desync the controlled DOM state. The inner <input> is
+          // the actual interactive element; this span is a propagation
+          // shield, not a click target itself.
+          // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
+          /* @__PURE__ */ a(
+            "span",
+            {
+              onClick: (e) => {
+                e.stopPropagation();
+              },
+              onPointerDown: (e) => {
+                e.stopPropagation();
+              },
+              onMouseDown: (e) => {
+                e.stopPropagation();
+              },
+              children: /* @__PURE__ */ a(
+                p.Checkbox,
+                {
+                  value: m,
+                  onChange: (e) => C?.(e, n),
+                  label: i("table.selectAllRowsLabel"),
+                  shouldVisuallyHideLabel: !0
+                }
+              )
+            }
+          )
+        ) : /* @__PURE__ */ a(h, { children: i("table.selectRowHeader") })
       }
     ] : [],
     ...s.map((e, t) => ({
@@ -48,50 +70,50 @@ const J = ({
     ...d ? [
       {
         key: "actions-header",
-        content: /* @__PURE__ */ l(p, { children: i("table.actionsColumnHeader") })
+        content: /* @__PURE__ */ a(h, { children: i("table.actionsColumnHeader") })
       }
     ] : []
-  ], v = (e, t) => {
-    m(t), a?.(e, !0);
-  }, D = (e, t) => {
-    if (h === "single") {
-      const o = u?.(e) ?? g === t;
-      return /* @__PURE__ */ l(
-        y.Radio,
+  ], L = (e, t) => {
+    $(t), r?.(e, !0);
+  }, v = (e, t) => {
+    if (k === "single") {
+      const o = u?.(e) ?? D === t;
+      return /* @__PURE__ */ a(
+        p.Radio,
         {
-          name: $,
+          name: R,
           value: o,
           onChange: () => {
-            v(e, t);
+            L(e, t);
           },
           label: i("table.selectRowLabel"),
           shouldVisuallyHideLabel: !0
         }
       );
     }
-    const r = u?.(e) ?? !1;
-    return /* @__PURE__ */ l(
-      y.Checkbox,
+    const l = u?.(e) ?? !1;
+    return /* @__PURE__ */ a(
+      p.Checkbox,
       {
-        value: r,
+        value: l,
         onChange: (o) => {
-          a?.(e, o);
+          r?.(e, o);
         },
         label: i("table.selectRowLabel"),
         shouldVisuallyHideLabel: !0
       }
     );
-  }, x = n.map((e, t) => {
-    const r = [
-      ...a ? [
+  }, w = n.map((e, t) => {
+    const l = [
+      ...r ? [
         {
           key: `select-${t}`,
-          content: D(e, t)
+          content: v(e, t)
         }
       ] : [],
-      ...s.map((o, f) => ({
-        key: typeof o.key == "string" ? o.key : `cell-${f}`,
-        content: A(e, o)
+      ...s.map((o, y) => ({
+        key: typeof o.key == "string" ? o.key : `cell-${y}`,
+        content: j(e, o)
       })),
       ...d ? [
         {
@@ -102,40 +124,40 @@ const J = ({
     ];
     return {
       key: `row-${t}`,
-      data: r
+      data: l
     };
-  }), V = (() => {
-    if (!k) return;
-    const e = k(), t = [];
-    return a && t.push({
+  }), x = (() => {
+    if (!b) return;
+    const e = b(), t = [];
+    return r && t.push({
       key: "footer-select",
       content: ""
-    }), s.forEach((r, o) => {
-      const f = typeof r.key == "string" ? r.key : `column-${o}`;
+    }), s.forEach((l, o) => {
+      const y = typeof l.key == "string" ? l.key : `column-${o}`;
       t.push({
-        key: `footer-${f}`,
-        content: e[f] || ""
+        key: `footer-${y}`,
+        content: e[y] || ""
       });
     }), d && t.push({
       key: "footer-actions",
       content: ""
     }), t;
   })();
-  return /* @__PURE__ */ l(
-    y.Table,
+  return /* @__PURE__ */ a(
+    p.Table,
     {
       "aria-label": c,
       "data-testid": "data-table",
-      headers: L,
-      rows: x,
-      footer: V,
-      emptyState: b ? b() : void 0,
-      isWithinBox: R,
-      hasCheckboxColumn: !!a
+      headers: H,
+      rows: w,
+      footer: x,
+      emptyState: f ? f() : void 0,
+      isWithinBox: g,
+      hasCheckboxColumn: !!r
     }
   );
 };
 export {
-  J as DataTable
+  B as DataTable
 };
 //# sourceMappingURL=DataTable.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DataTable.js","sources":["../../../../../src/components/Common/DataView/DataTable/DataTable.tsx"],"sourcesContent":["import { useId, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport type { useDataViewPropReturn, SelectionMode } from '../useDataView'\nimport { useSelectionState } from '../useSelectionState'\nimport type { TableData, TableRow, TableProps } from '../../UI/Table/TableTypes'\nimport { VisuallyHidden } from '../../VisuallyHidden'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nexport type DataTableProps<T> = {\n  label: string\n  columns: useDataViewPropReturn<T>['columns']\n  data: useDataViewPropReturn<T>['data']\n  itemMenu?: useDataViewPropReturn<T>['itemMenu']\n  onSelect?: useDataViewPropReturn<T>['onSelect']\n  onSelectAll?: (checked: boolean, visibleData: T[]) => void\n  getIsItemSelected?: (item: T) => boolean\n  emptyState?: useDataViewPropReturn<T>['emptyState']\n  footer?: useDataViewPropReturn<T>['footer']\n  isWithinBox?: TableProps['isWithinBox']\n  selectionMode?: SelectionMode\n}\n\nfunction getCellContent<T>(\n  item: T,\n  column: { key?: string | keyof T; render?: (item: T) => React.ReactNode },\n) {\n  if (column.render) {\n    return column.render(item)\n  }\n\n  if (column.key) {\n    const key = column.key as keyof T\n    return String(item[key] ?? '')\n  }\n\n  return ''\n}\n\nexport const DataTable = <T,>({\n  label,\n  data,\n  columns,\n  itemMenu,\n  onSelect,\n  onSelectAll,\n  getIsItemSelected,\n  emptyState,\n  footer,\n  isWithinBox,\n  selectionMode = 'multiple',\n}: DataTableProps<T>) => {\n  const Components = useComponentContext()\n  const { t } = useTranslation('common')\n  const radioGroupName = useId()\n  const [selectedRadioIndex, setSelectedRadioIndex] = useState<number | null>(null)\n  const { allSelected } = useSelectionState(data, getIsItemSelected)\n\n  const headers: TableData[] = [\n    ...(onSelect\n      ? [\n          {\n            key: 'select-header',\n            content:\n              selectionMode === 'multiple' && getIsItemSelected ? (\n                <Components.Checkbox\n                  value={allSelected}\n                  onChange={(checked: boolean) => onSelectAll?.(checked, data)}\n                  label={t('table.selectAllRowsLabel')}\n                  shouldVisuallyHideLabel\n                />\n              ) : (\n                <VisuallyHidden>{t('table.selectRowHeader')}</VisuallyHidden>\n              ),\n          },\n        ]\n      : []),\n    ...columns.map((column, index) => ({\n      key: typeof column.key === 'string' ? column.key : `header-${index}`,\n      content: column.title,\n    })),\n    ...(itemMenu\n      ? [\n          {\n            key: 'actions-header',\n            content: <VisuallyHidden>{t('table.actionsColumnHeader')}</VisuallyHidden>,\n          },\n        ]\n      : []),\n  ]\n\n  const handleRadioSelect = (item: T, rowIndex: number) => {\n    setSelectedRadioIndex(rowIndex)\n    onSelect?.(item, true)\n  }\n\n  const renderSelectionControl = (item: T, rowIndex: number) => {\n    if (selectionMode === 'single') {\n      const isSelected = getIsItemSelected?.(item) ?? selectedRadioIndex === rowIndex\n      return (\n        <Components.Radio\n          name={radioGroupName}\n          value={isSelected}\n          onChange={() => {\n            handleRadioSelect(item, rowIndex)\n          }}\n          label={t('table.selectRowLabel')}\n          shouldVisuallyHideLabel\n        />\n      )\n    }\n\n    const isSelected = getIsItemSelected?.(item) ?? false\n    return (\n      <Components.Checkbox\n        value={isSelected}\n        onChange={(checked: boolean) => {\n          onSelect?.(item, checked)\n        }}\n        label={t('table.selectRowLabel')}\n        shouldVisuallyHideLabel\n      />\n    )\n  }\n\n  const rows: TableRow[] = data.map((item, rowIndex) => {\n    const rowData: TableData[] = [\n      ...(onSelect\n        ? [\n            {\n              key: `select-${rowIndex}`,\n              content: renderSelectionControl(item, rowIndex),\n            },\n          ]\n        : []),\n      ...columns.map((column, colIndex) => {\n        return {\n          key: typeof column.key === 'string' ? column.key : `cell-${colIndex}`,\n          content: getCellContent(item, column),\n        }\n      }),\n      ...(itemMenu\n        ? [\n            {\n              key: `menu-${rowIndex}`,\n              content: itemMenu(item),\n            },\n          ]\n        : []),\n    ]\n\n    return {\n      key: `row-${rowIndex}`,\n      data: rowData,\n    }\n  })\n\n  const buildFooterData = () => {\n    if (!footer) return undefined\n\n    const footerContent = footer()\n    const footerCells: TableData[] = []\n\n    // Add select column footer (empty)\n    if (onSelect) {\n      footerCells.push({\n        key: 'footer-select',\n        content: '',\n      })\n    }\n\n    // Add data column footers\n    columns.forEach((column, index) => {\n      const columnKey = typeof column.key === 'string' ? column.key : `column-${index}`\n      footerCells.push({\n        key: `footer-${columnKey}`,\n        content: footerContent[columnKey] || '',\n      })\n    })\n\n    // Add actions column footer (empty)\n    if (itemMenu) {\n      footerCells.push({\n        key: 'footer-actions',\n        content: '',\n      })\n    }\n\n    return footerCells\n  }\n\n  const footerData = buildFooterData()\n\n  return (\n    <Components.Table\n      aria-label={label}\n      data-testid=\"data-table\"\n      headers={headers}\n      rows={rows}\n      footer={footerData}\n      emptyState={emptyState ? emptyState() : undefined}\n      isWithinBox={isWithinBox}\n      hasCheckboxColumn={!!onSelect}\n    />\n  )\n}\n"],"names":["getCellContent","item","column","key","DataTable","label","data","columns","itemMenu","onSelect","onSelectAll","getIsItemSelected","emptyState","footer","isWithinBox","selectionMode","Components","useComponentContext","t","useTranslation","radioGroupName","useId","selectedRadioIndex","setSelectedRadioIndex","useState","allSelected","useSelectionState","headers","jsx","checked","VisuallyHidden","index","handleRadioSelect","rowIndex","renderSelectionControl","isSelected","rows","rowData","colIndex","footerData","footerContent","footerCells","columnKey"],"mappings":"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"}
+{"version":3,"file":"DataTable.js","sources":["../../../../../src/components/Common/DataView/DataTable/DataTable.tsx"],"sourcesContent":["import { useId, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport type { useDataViewPropReturn, SelectionMode } from '../useDataView'\nimport { useSelectionState } from '../useSelectionState'\nimport type { TableData, TableRow, TableProps } from '../../UI/Table/TableTypes'\nimport { VisuallyHidden } from '../../VisuallyHidden'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nexport type DataTableProps<T> = {\n  label: string\n  columns: useDataViewPropReturn<T>['columns']\n  data: useDataViewPropReturn<T>['data']\n  itemMenu?: useDataViewPropReturn<T>['itemMenu']\n  onSelect?: useDataViewPropReturn<T>['onSelect']\n  onSelectAll?: (checked: boolean, visibleData: T[]) => void\n  getIsItemSelected?: (item: T) => boolean\n  emptyState?: useDataViewPropReturn<T>['emptyState']\n  footer?: useDataViewPropReturn<T>['footer']\n  isWithinBox?: TableProps['isWithinBox']\n  selectionMode?: SelectionMode\n}\n\nfunction getCellContent<T>(\n  item: T,\n  column: { key?: string | keyof T; render?: (item: T) => React.ReactNode },\n) {\n  if (column.render) {\n    return column.render(item)\n  }\n\n  if (column.key) {\n    const key = column.key as keyof T\n    return String(item[key] ?? '')\n  }\n\n  return ''\n}\n\nexport const DataTable = <T,>({\n  label,\n  data,\n  columns,\n  itemMenu,\n  onSelect,\n  onSelectAll,\n  getIsItemSelected,\n  emptyState,\n  footer,\n  isWithinBox,\n  selectionMode = 'multiple',\n}: DataTableProps<T>) => {\n  const Components = useComponentContext()\n  const { t } = useTranslation('common')\n  const radioGroupName = useId()\n  const [selectedRadioIndex, setSelectedRadioIndex] = useState<number | null>(null)\n  const { allSelected } = useSelectionState(data, getIsItemSelected)\n\n  const headers: TableData[] = [\n    ...(onSelect\n      ? [\n          {\n            key: 'select-header',\n            content:\n              selectionMode === 'multiple' && getIsItemSelected ? (\n                // Stop propagation so the surrounding react-aria-components\n                // <Column> press handler doesn't intercept the checkbox click\n                // and desync the controlled DOM state. The inner <input> is\n                // the actual interactive element; this span is a propagation\n                // shield, not a click target itself.\n                // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions\n                <span\n                  onClick={e => {\n                    e.stopPropagation()\n                  }}\n                  onPointerDown={e => {\n                    e.stopPropagation()\n                  }}\n                  onMouseDown={e => {\n                    e.stopPropagation()\n                  }}\n                >\n                  <Components.Checkbox\n                    value={allSelected}\n                    onChange={(checked: boolean) => onSelectAll?.(checked, data)}\n                    label={t('table.selectAllRowsLabel')}\n                    shouldVisuallyHideLabel\n                  />\n                </span>\n              ) : (\n                <VisuallyHidden>{t('table.selectRowHeader')}</VisuallyHidden>\n              ),\n          },\n        ]\n      : []),\n    ...columns.map((column, index) => ({\n      key: typeof column.key === 'string' ? column.key : `header-${index}`,\n      content: column.title,\n    })),\n    ...(itemMenu\n      ? [\n          {\n            key: 'actions-header',\n            content: <VisuallyHidden>{t('table.actionsColumnHeader')}</VisuallyHidden>,\n          },\n        ]\n      : []),\n  ]\n\n  const handleRadioSelect = (item: T, rowIndex: number) => {\n    setSelectedRadioIndex(rowIndex)\n    onSelect?.(item, true)\n  }\n\n  const renderSelectionControl = (item: T, rowIndex: number) => {\n    if (selectionMode === 'single') {\n      const isSelected = getIsItemSelected?.(item) ?? selectedRadioIndex === rowIndex\n      return (\n        <Components.Radio\n          name={radioGroupName}\n          value={isSelected}\n          onChange={() => {\n            handleRadioSelect(item, rowIndex)\n          }}\n          label={t('table.selectRowLabel')}\n          shouldVisuallyHideLabel\n        />\n      )\n    }\n\n    const isSelected = getIsItemSelected?.(item) ?? false\n    return (\n      <Components.Checkbox\n        value={isSelected}\n        onChange={(checked: boolean) => {\n          onSelect?.(item, checked)\n        }}\n        label={t('table.selectRowLabel')}\n        shouldVisuallyHideLabel\n      />\n    )\n  }\n\n  const rows: TableRow[] = data.map((item, rowIndex) => {\n    const rowData: TableData[] = [\n      ...(onSelect\n        ? [\n            {\n              key: `select-${rowIndex}`,\n              content: renderSelectionControl(item, rowIndex),\n            },\n          ]\n        : []),\n      ...columns.map((column, colIndex) => {\n        return {\n          key: typeof column.key === 'string' ? column.key : `cell-${colIndex}`,\n          content: getCellContent(item, column),\n        }\n      }),\n      ...(itemMenu\n        ? [\n            {\n              key: `menu-${rowIndex}`,\n              content: itemMenu(item),\n            },\n          ]\n        : []),\n    ]\n\n    return {\n      key: `row-${rowIndex}`,\n      data: rowData,\n    }\n  })\n\n  const buildFooterData = () => {\n    if (!footer) return undefined\n\n    const footerContent = footer()\n    const footerCells: TableData[] = []\n\n    // Add select column footer (empty)\n    if (onSelect) {\n      footerCells.push({\n        key: 'footer-select',\n        content: '',\n      })\n    }\n\n    // Add data column footers\n    columns.forEach((column, index) => {\n      const columnKey = typeof column.key === 'string' ? column.key : `column-${index}`\n      footerCells.push({\n        key: `footer-${columnKey}`,\n        content: footerContent[columnKey] || '',\n      })\n    })\n\n    // Add actions column footer (empty)\n    if (itemMenu) {\n      footerCells.push({\n        key: 'footer-actions',\n        content: '',\n      })\n    }\n\n    return footerCells\n  }\n\n  const footerData = buildFooterData()\n\n  return (\n    <Components.Table\n      aria-label={label}\n      data-testid=\"data-table\"\n      headers={headers}\n      rows={rows}\n      footer={footerData}\n      emptyState={emptyState ? emptyState() : undefined}\n      isWithinBox={isWithinBox}\n      hasCheckboxColumn={!!onSelect}\n    />\n  )\n}\n"],"names":["getCellContent","item","column","key","DataTable","label","data","columns","itemMenu","onSelect","onSelectAll","getIsItemSelected","emptyState","footer","isWithinBox","selectionMode","Components","useComponentContext","t","useTranslation","radioGroupName","useId","selectedRadioIndex","setSelectedRadioIndex","useState","allSelected","useSelectionState","headers","jsx","checked","VisuallyHidden","index","handleRadioSelect","rowIndex","renderSelectionControl","isSelected","rows","rowData","colIndex","footerData","footerContent","footerCells","columnKey"],"mappings":"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"}

package/dist/components/Common/DetailViewLayout/DetailViewLayout.js

@@ -0,0 +1,52 @@
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { useId as x } from "react";
+import l from "classnames";
+import a from "./DetailViewLayout.module.scss.js";
+import y from "../../../assets/icons/caret-left.svg.js";
+import { useComponentContext as C } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+function T({
+  title: t,
+  subtitle: r,
+  onBack: o,
+  backLabel: c,
+  actions: n,
+  tabs: s,
+  selectedTabId: m,
+  onTabChange: h,
+  children: p,
+  className: u
+}) {
+  const { Button: f, Heading: v, Text: g, Tabs: N } = C(), d = x();
+  return /* @__PURE__ */ i("section", { className: l(a.root, u), "aria-labelledby": d, children: [
+    o && /* @__PURE__ */ e(
+      f,
+      {
+        variant: "tertiary",
+        className: a.backButton,
+        icon: /* @__PURE__ */ e(y, { "aria-hidden": "true" }),
+        onClick: o,
+        children: c
+      }
+    ),
+    /* @__PURE__ */ i("div", { className: l(a.pageHeader, r && a.hasSubtitle), children: [
+      /* @__PURE__ */ i("div", { className: a.titleGroup, children: [
+        /* @__PURE__ */ e(v, { as: "h2", styledAs: "h2", id: d, children: t }),
+        r && /* @__PURE__ */ e(g, { variant: "supporting", children: r })
+      ] }),
+      n && /* @__PURE__ */ e("div", { className: a.actions, children: n })
+    ] }),
+    s !== void 0 ? /* @__PURE__ */ e(
+      N,
+      {
+        tabs: s,
+        selectedId: m,
+        onSelectionChange: h,
+        "aria-label": t
+      }
+    ) : p
+  ] });
+}
+export {
+  T as DetailViewLayout
+};
+//# sourceMappingURL=DetailViewLayout.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DetailViewLayout.js","sources":["../../../../src/components/Common/DetailViewLayout/DetailViewLayout.tsx"],"sourcesContent":["import { useId } from 'react'\nimport classNames from 'classnames'\nimport type { DetailViewLayoutProps } from './DetailViewLayoutTypes'\nimport styles from './DetailViewLayout.module.scss'\nimport CaretLeftIcon from '@/assets/icons/caret-left.svg?react'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nexport function DetailViewLayout({\n  title,\n  subtitle,\n  onBack,\n  backLabel,\n  actions,\n  tabs,\n  selectedTabId,\n  onTabChange,\n  children,\n  className,\n}: DetailViewLayoutProps) {\n  const { Button, Heading, Text, Tabs } = useComponentContext()\n  const headingId = useId()\n\n  return (\n    <section className={classNames(styles.root, className)} aria-labelledby={headingId}>\n      {onBack && (\n        <Button\n          variant=\"tertiary\"\n          className={styles.backButton}\n          icon={<CaretLeftIcon aria-hidden=\"true\" />}\n          onClick={onBack}\n        >\n          {backLabel}\n        </Button>\n      )}\n\n      <div className={classNames(styles.pageHeader, subtitle && styles.hasSubtitle)}>\n        <div className={styles.titleGroup}>\n          <Heading as=\"h2\" styledAs=\"h2\" id={headingId}>\n            {title}\n          </Heading>\n          {subtitle && <Text variant=\"supporting\">{subtitle}</Text>}\n        </div>\n        {actions && <div className={styles.actions}>{actions}</div>}\n      </div>\n\n      {tabs !== undefined ? (\n        <Tabs\n          tabs={tabs}\n          selectedId={selectedTabId}\n          onSelectionChange={onTabChange}\n          aria-label={title}\n        />\n      ) : (\n        children\n      )}\n    </section>\n  )\n}\n"],"names":["DetailViewLayout","title","subtitle","onBack","backLabel","actions","tabs","selectedTabId","onTabChange","children","className","Button","Heading","Text","Tabs","useComponentContext","headingId","useId","jsxs","classNames","styles","jsx","CaretLeftIcon"],"mappings":";;;;;;AAOO,SAASA,EAAiB;AAAA,EAC/B,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,eAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AACF,GAA0B;AACxB,QAAM,EAAE,QAAAC,GAAQ,SAAAC,GAAS,MAAAC,GAAM,MAAAC,EAAA,IAASC,EAAA,GAClCC,IAAYC,EAAA;AAElB,SACE,gBAAAC,EAAC,aAAQ,WAAWC,EAAWC,EAAO,MAAMV,CAAS,GAAG,mBAAiBM,GACtE,UAAA;AAAA,IAAAb,KACC,gBAAAkB;AAAA,MAACV;AAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,WAAWS,EAAO;AAAA,QAClB,MAAM,gBAAAC,EAACC,GAAA,EAAc,eAAY,OAAA,CAAO;AAAA,QACxC,SAASnB;AAAA,QAER,UAAAC;AAAA,MAAA;AAAA,IAAA;AAAA,IAIL,gBAAAc,EAAC,SAAI,WAAWC,EAAWC,EAAO,YAAYlB,KAAYkB,EAAO,WAAW,GAC1E,UAAA;AAAA,MAAA,gBAAAF,EAAC,OAAA,EAAI,WAAWE,EAAO,YACrB,UAAA;AAAA,QAAA,gBAAAC,EAACT,KAAQ,IAAG,MAAK,UAAS,MAAK,IAAII,GAChC,UAAAf,EAAA,CACH;AAAA,QACCC,KAAY,gBAAAmB,EAACR,GAAA,EAAK,SAAQ,cAAc,UAAAX,EAAA,CAAS;AAAA,MAAA,GACpD;AAAA,MACCG,KAAW,gBAAAgB,EAAC,OAAA,EAAI,WAAWD,EAAO,SAAU,UAAAf,EAAA,CAAQ;AAAA,IAAA,GACvD;AAAA,IAECC,MAAS,SACR,gBAAAe;AAAA,MAACP;AAAA,MAAA;AAAA,QACC,MAAAR;AAAA,QACA,YAAYC;AAAA,QACZ,mBAAmBC;AAAA,QACnB,cAAYP;AAAA,MAAA;AAAA,IAAA,IAGdQ;AAAA,EAAA,GAEJ;AAEJ;"}

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

@@ -0,0 +1,18 @@
+const t = "_root_qymm1_1", o = "_backButton_qymm1_8", e = "_pageHeader_qymm1_12", _ = "_hasSubtitle_qymm1_20", a = "_titleGroup_qymm1_24", s = "_actions_qymm1_32", c = {
+  root: t,
+  backButton: o,
+  pageHeader: e,
+  hasSubtitle: _,
+  titleGroup: a,
+  actions: s
+};
+export {
+  s as actions,
+  o as backButton,
+  c as default,
+  _ as hasSubtitle,
+  e as pageHeader,
+  t as root,
+  a as titleGroup
+};
+//# sourceMappingURL=DetailViewLayout.module.scss.js.map

package/dist/components/Common/DetailViewLayout/DetailViewLayout.module.scss.js.map

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

package/dist/components/Common/Fields/hooks/FieldElementRegistryProvider.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from 'react';
+import { FieldElementRegistry } from './fieldElementRegistry';
+interface FieldElementRegistryProviderProps {
+    registry: FieldElementRegistry | null | undefined;
+    children: ReactNode;
+}
+/**
+ * Publishes a `FieldElementRegistry` via context so `useField` can populate it.
+ * `SDKFormProvider` wires this automatically; partners who build their own form
+ * surface can wrap with this provider directly to opt into cross-form focus.
+ */
+export declare function FieldElementRegistryProvider({ registry, children, }: FieldElementRegistryProviderProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Common/Fields/hooks/FieldElementRegistryProvider.js

@@ -0,0 +1,12 @@
+import { jsx as t } from "react/jsx-runtime";
+import { FieldElementRegistryContext as i } from "./fieldElementRegistry.js";
+function n({
+  registry: e,
+  children: r
+}) {
+  return /* @__PURE__ */ t(i.Provider, { value: e ?? null, children: r });
+}
+export {
+  n as FieldElementRegistryProvider
+};
+//# sourceMappingURL=FieldElementRegistryProvider.js.map