@gusto/embedded-react-sdk 0.52.2 → 0.54.0

package/dist/components/Employee/WorkAddress/management/WorkAddressComponents.js

@@ -1,18 +1,32 @@
-import { jsx as e } from "react/jsx-runtime";
+import { jsx as t } from "react/jsx-runtime";
 import { WorkAddressEditForm as m } from "./WorkAddressEditForm.js";
-import { useFlow as t } from "../../../Flow/useFlow.js";
-import { ensureRequired as d } from "../../../../helpers/ensureRequired.js";
-import { WorkAddressCard as n } from "./WorkAddressCard/WorkAddressCard.js";
-function l() {
-  const { employeeId: o, onEvent: r } = t();
-  return /* @__PURE__ */ e(n, { employeeId: d(o), onEvent: r });
-}
+import { useFlow as d } from "../../../Flow/useFlow.js";
+import { ensureRequired as n } from "../../../../helpers/ensureRequired.js";
+import { WorkAddressCard as s } from "./WorkAddressCard/WorkAddressCard.js";
 function a() {
-  const { employeeId: o, onEvent: r } = t();
-  return /* @__PURE__ */ e(m, { employeeId: d(o), onEvent: r });
+  const { employeeId: o, onEvent: e, LoaderComponent: r } = d();
+  return /* @__PURE__ */ t(
+    s,
+    {
+      employeeId: n(o),
+      onEvent: e,
+      LoaderComponent: r
+    }
+  );
+}
+function C() {
+  const { employeeId: o, onEvent: e, LoaderComponent: r } = d();
+  return /* @__PURE__ */ t(
+    m,
+    {
+      employeeId: n(o),
+      onEvent: e,
+      LoaderComponent: r
+    }
+  );
 }
 export {
-  l as WorkAddressCardContextual,
-  a as WorkAddressEditFormContextual
+  a as WorkAddressCardContextual,
+  C as WorkAddressEditFormContextual
 };
 //# sourceMappingURL=WorkAddressComponents.js.map

package/dist/components/Employee/WorkAddress/management/WorkAddressComponents.js.map

@@ -1 +1 @@
-{"version":3,"file":"WorkAddressComponents.js","sources":["../../../../../src/components/Employee/WorkAddress/management/WorkAddressComponents.tsx"],"sourcesContent":["import { WorkAddressCard } from './WorkAddressCard'\nimport { WorkAddressEditForm } from './WorkAddressEditForm'\nimport { useFlow, type FlowContextInterface } from '@/components/Flow/useFlow'\nimport { ensureRequired } from '@/helpers/ensureRequired'\n\n/** @internal */\nexport interface WorkAddressContextInterface extends FlowContextInterface {\n  employeeId?: string\n}\n\n/** @internal */\nexport function WorkAddressCardContextual() {\n  const { employeeId, onEvent } = useFlow<WorkAddressContextInterface>()\n  return <WorkAddressCard employeeId={ensureRequired(employeeId)} onEvent={onEvent} />\n}\n\n/** @internal */\nexport function WorkAddressEditFormContextual() {\n  const { employeeId, onEvent } = useFlow<WorkAddressContextInterface>()\n  return <WorkAddressEditForm employeeId={ensureRequired(employeeId)} onEvent={onEvent} />\n}\n"],"names":["WorkAddressCardContextual","employeeId","onEvent","useFlow","WorkAddressCard","ensureRequired","WorkAddressEditFormContextual","WorkAddressEditForm"],"mappings":";;;;;AAWO,SAASA,IAA4B;AAC1C,QAAM,EAAE,YAAAC,GAAY,SAAAC,EAAA,IAAYC,EAAA;AAChC,2BAAQC,GAAA,EAAgB,YAAYC,EAAeJ,CAAU,GAAG,SAAAC,GAAkB;AACpF;AAGO,SAASI,IAAgC;AAC9C,QAAM,EAAE,YAAAL,GAAY,SAAAC,EAAA,IAAYC,EAAA;AAChC,2BAAQI,GAAA,EAAoB,YAAYF,EAAeJ,CAAU,GAAG,SAAAC,GAAkB;AACxF;"}
+{"version":3,"file":"WorkAddressComponents.js","sources":["../../../../../src/components/Employee/WorkAddress/management/WorkAddressComponents.tsx"],"sourcesContent":["import { WorkAddressCard } from './WorkAddressCard'\nimport { WorkAddressEditForm } from './WorkAddressEditForm'\nimport { useFlow, type FlowContextInterface } from '@/components/Flow/useFlow'\nimport { ensureRequired } from '@/helpers/ensureRequired'\n\n/** @internal */\nexport interface WorkAddressContextInterface extends FlowContextInterface {\n  employeeId?: string\n}\n\n/** @internal */\nexport function WorkAddressCardContextual() {\n  const { employeeId, onEvent, LoaderComponent } = useFlow<WorkAddressContextInterface>()\n  return (\n    <WorkAddressCard\n      employeeId={ensureRequired(employeeId)}\n      onEvent={onEvent}\n      LoaderComponent={LoaderComponent}\n    />\n  )\n}\n\n/** @internal */\nexport function WorkAddressEditFormContextual() {\n  const { employeeId, onEvent, LoaderComponent } = useFlow<WorkAddressContextInterface>()\n  return (\n    <WorkAddressEditForm\n      employeeId={ensureRequired(employeeId)}\n      onEvent={onEvent}\n      LoaderComponent={LoaderComponent}\n    />\n  )\n}\n"],"names":["WorkAddressCardContextual","employeeId","onEvent","LoaderComponent","useFlow","jsx","WorkAddressCard","ensureRequired","WorkAddressEditFormContextual","WorkAddressEditForm"],"mappings":";;;;;AAWO,SAASA,IAA4B;AAC1C,QAAM,EAAE,YAAAC,GAAY,SAAAC,GAAS,iBAAAC,EAAA,IAAoBC,EAAA;AACjD,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,YAAYC,EAAeN,CAAU;AAAA,MACrC,SAAAC;AAAA,MACA,iBAAAC;AAAA,IAAA;AAAA,EAAA;AAGN;AAGO,SAASK,IAAgC;AAC9C,QAAM,EAAE,YAAAP,GAAY,SAAAC,GAAS,iBAAAC,EAAA,IAAoBC,EAAA;AACjD,SACE,gBAAAC;AAAA,IAACI;AAAA,IAAA;AAAA,MACC,YAAYF,EAAeN,CAAU;AAAA,MACrC,SAAAC;AAAA,MACA,iBAAAC;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Employee/WorkAddress/management/WorkAddressEditForm.d.ts

@@ -21,4 +21,4 @@ export interface WorkAddressEditFormProps extends BaseComponentInterface<'Employ
  *
  * @public
  */
-export declare function WorkAddressEditForm({ FallbackComponent, ...props }: WorkAddressEditFormProps): import("react").JSX.Element;
+export declare function WorkAddressEditForm({ FallbackComponent, LoaderComponent, ...props }: WorkAddressEditFormProps): import("react").JSX.Element;

package/dist/components/Employee/WorkAddress/management/WorkAddressEditForm.js

@@ -1,21 +1,33 @@
-import { jsx as r } from "react/jsx-runtime";
-import { WorkAddressView as m } from "./WorkAddressView.js";
-import { useWorkAddressManagement as A, isUseWorkAddressManagementSuccess as E } from "./useWorkAddressManagement.js";
-import { BaseBoundaries as g, BaseLayout as t } from "../../../Base/Base.js";
-import { useI18n as W, useComponentDictionary as c } from "../../../../i18n/I18n.js";
+import { jsx as o } from "react/jsx-runtime";
+import { WorkAddressView as A } from "./WorkAddressView.js";
+import { useWorkAddressManagement as E, isUseWorkAddressManagementSuccess as g } from "./useWorkAddressManagement.js";
+import { BaseBoundaries as W, BaseLayout as i } from "../../../Base/Base.js";
+import { useI18n as c, useComponentDictionary as k } from "../../../../i18n/I18n.js";
 import { componentEvents as n } from "../../../../shared/constants.js";
-function k({ employeeId: d, dictionary: s, onEvent: o }) {
-  W(["Employee.Management.WorkAddress"]), c("Employee.Management.WorkAddress", s);
-  const e = A({ employeeId: d, onEvent: o });
+function D({
+  employeeId: s,
+  dictionary: d,
+  onEvent: r,
+  LoaderComponent: a
+}) {
+  c(["Employee.Management.WorkAddress"]), k("Employee.Management.WorkAddress", d);
+  const e = E({ employeeId: s, onEvent: r });
   if (e.isLoading)
-    return /* @__PURE__ */ r(t, { isLoading: !0, error: e.errorHandling.errors });
-  if (!E(e))
-    return /* @__PURE__ */ r(t, { error: e.errorHandling.errors });
-  const i = (a) => {
-    a.mode === "create" ? o(n.EMPLOYEE_MANAGEMENT_WORK_ADDRESS_CREATED, a.data) : o(n.EMPLOYEE_MANAGEMENT_WORK_ADDRESS_UPDATED, a.data);
+    return /* @__PURE__ */ o(
+      i,
+      {
+        isLoading: !0,
+        error: e.errorHandling.errors,
+        LoaderComponent: a
+      }
+    );
+  if (!g(e))
+    return /* @__PURE__ */ o(i, { error: e.errorHandling.errors, LoaderComponent: a });
+  const m = (t) => {
+    t.mode === "create" ? r(n.EMPLOYEE_MANAGEMENT_WORK_ADDRESS_CREATED, t.data) : r(n.EMPLOYEE_MANAGEMENT_WORK_ADDRESS_UPDATED, t.data);
   };
-  return /* @__PURE__ */ r(t, { error: e.errorHandling.errors, children: /* @__PURE__ */ r(
-    m,
+  return /* @__PURE__ */ o(i, { error: e.errorHandling.errors, LoaderComponent: a, children: /* @__PURE__ */ o(
+    A,
     {
       editWorkAddressForm: e.data.editWorkAddressForm,
       changeWorkAddressForm: e.data.changeWorkAddressForm,
@@ -24,25 +36,30 @@ function k({ employeeId: d, dictionary: s, onEvent: o }) {
       onEditTargetUuidChange: e.actions.setEditTargetUuid,
       employeeDisplayName: e.data.employeeDisplayName,
       onConfirmDelete: e.actions.confirmDeleteWorkAddress,
-      onWorkAddressSaved: i,
+      onWorkAddressSaved: m,
       onBack: () => {
-        o(n.EMPLOYEE_MANAGEMENT_WORK_ADDRESS_EDIT_CANCELLED);
+        r(n.EMPLOYEE_MANAGEMENT_WORK_ADDRESS_EDIT_CANCELLED);
       },
       isDeletePending: e.status.isDeletePending
     }
   ) });
 }
-function _({ FallbackComponent: d, ...s }) {
-  return /* @__PURE__ */ r(
-    g,
+function y({
+  FallbackComponent: s,
+  LoaderComponent: d,
+  ...r
+}) {
+  return /* @__PURE__ */ o(
+    W,
     {
       componentName: "Employee.Management.WorkAddress",
-      FallbackComponent: d,
-      children: /* @__PURE__ */ r(k, { ...s })
+      FallbackComponent: s,
+      LoaderComponent: d,
+      children: /* @__PURE__ */ o(D, { LoaderComponent: d, ...r })
     }
   );
 }
 export {
-  _ as WorkAddressEditForm
+  y as WorkAddressEditForm
 };
 //# sourceMappingURL=WorkAddressEditForm.js.map

package/dist/components/Employee/WorkAddress/management/WorkAddressEditForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"WorkAddressEditForm.js","sources":["../../../../../src/components/Employee/WorkAddress/management/WorkAddressEditForm.tsx"],"sourcesContent":["import type { EmployeeWorkAddress } from '@gusto/embedded-api/models/components/employeeworkaddress'\nimport { WorkAddressView } from './WorkAddressView'\nimport {\n  isUseWorkAddressManagementSuccess,\n  useWorkAddressManagement,\n} from './useWorkAddressManagement'\nimport { BaseBoundaries, BaseLayout, type BaseComponentInterface } from '@/components/Base/Base'\nimport { useI18n, useComponentDictionary } from '@/i18n'\nimport type { HookSubmitResult } from '@/partner-hook-utils/types'\nimport { componentEvents } from '@/shared/constants'\n\n/**\n * Props for {@link WorkAddressEditForm}.\n *\n * @public\n */\nexport interface WorkAddressEditFormProps extends BaseComponentInterface<'Employee.Management.WorkAddress'> {\n  /** The associated employee identifier. */\n  employeeId: string\n}\n\nfunction WorkAddressEditFormRoot({ employeeId, dictionary, onEvent }: WorkAddressEditFormProps) {\n  useI18n(['Employee.Management.WorkAddress'])\n  useComponentDictionary('Employee.Management.WorkAddress', dictionary)\n\n  const management = useWorkAddressManagement({ employeeId, onEvent })\n\n  if (management.isLoading) {\n    return <BaseLayout isLoading error={management.errorHandling.errors} />\n  }\n\n  if (!isUseWorkAddressManagementSuccess(management)) {\n    return <BaseLayout error={management.errorHandling.errors} />\n  }\n\n  const handleWorkAddressSaved = (result: HookSubmitResult<EmployeeWorkAddress>) => {\n    if (result.mode === 'create') {\n      onEvent(componentEvents.EMPLOYEE_MANAGEMENT_WORK_ADDRESS_CREATED, result.data)\n    } else {\n      onEvent(componentEvents.EMPLOYEE_MANAGEMENT_WORK_ADDRESS_UPDATED, result.data)\n    }\n  }\n\n  return (\n    <BaseLayout error={management.errorHandling.errors}>\n      <WorkAddressView\n        editWorkAddressForm={management.data.editWorkAddressForm}\n        changeWorkAddressForm={management.data.changeWorkAddressForm}\n        workAddresses={management.data.employeeWorkAddresses}\n        editTargetUuid={management.data.editTargetUuid}\n        onEditTargetUuidChange={management.actions.setEditTargetUuid}\n        employeeDisplayName={management.data.employeeDisplayName}\n        onConfirmDelete={management.actions.confirmDeleteWorkAddress}\n        onWorkAddressSaved={handleWorkAddressSaved}\n        onBack={() => {\n          onEvent(componentEvents.EMPLOYEE_MANAGEMENT_WORK_ADDRESS_EDIT_CANCELLED)\n        }}\n        isDeletePending={management.status.isDeletePending}\n      />\n    </BaseLayout>\n  )\n}\n\n/**\n * Standalone employee work address edit form for creating, updating, and deleting addresses.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `employee/management/workAddress/created` | A new work address was created | {@link APIModels.EmployeeWorkAddress} |\n * | `employee/management/workAddress/updated` | An existing work address was updated | {@link APIModels.EmployeeWorkAddress} |\n * | `employee/management/workAddress/deleted` | A work address was deleted | {@link APIModels.EmployeeWorkAddress} |\n * | `employee/management/workAddress/editCancelled` | User backed out of the edit form | — |\n *\n * @public\n */\nexport function WorkAddressEditForm({ FallbackComponent, ...props }: WorkAddressEditFormProps) {\n  return (\n    <BaseBoundaries\n      componentName=\"Employee.Management.WorkAddress\"\n      FallbackComponent={FallbackComponent}\n    >\n      <WorkAddressEditFormRoot {...props} />\n    </BaseBoundaries>\n  )\n}\n"],"names":["WorkAddressEditFormRoot","employeeId","dictionary","onEvent","useI18n","useComponentDictionary","management","useWorkAddressManagement","BaseLayout","isUseWorkAddressManagementSuccess","jsx","handleWorkAddressSaved","result","componentEvents","WorkAddressView","WorkAddressEditForm","FallbackComponent","props","BaseBoundaries"],"mappings":";;;;;;AAqBA,SAASA,EAAwB,EAAE,YAAAC,GAAY,YAAAC,GAAY,SAAAC,KAAqC;AAC9F,EAAAC,EAAQ,CAAC,iCAAiC,CAAC,GAC3CC,EAAuB,mCAAmCH,CAAU;AAEpE,QAAMI,IAAaC,EAAyB,EAAE,YAAAN,GAAY,SAAAE,GAAS;AAEnE,MAAIG,EAAW;AACb,6BAAQE,GAAA,EAAW,WAAS,IAAC,OAAOF,EAAW,cAAc,QAAQ;AAGvE,MAAI,CAACG,EAAkCH,CAAU;AAC/C,WAAO,gBAAAI,EAACF,GAAA,EAAW,OAAOF,EAAW,cAAc,QAAQ;AAG7D,QAAMK,IAAyB,CAACC,MAAkD;AAChF,IAAIA,EAAO,SAAS,WAClBT,EAAQU,EAAgB,0CAA0CD,EAAO,IAAI,IAE7ET,EAAQU,EAAgB,0CAA0CD,EAAO,IAAI;AAAA,EAEjF;AAEA,SACE,gBAAAF,EAACF,GAAA,EAAW,OAAOF,EAAW,cAAc,QAC1C,UAAA,gBAAAI;AAAA,IAACI;AAAA,IAAA;AAAA,MACC,qBAAqBR,EAAW,KAAK;AAAA,MACrC,uBAAuBA,EAAW,KAAK;AAAA,MACvC,eAAeA,EAAW,KAAK;AAAA,MAC/B,gBAAgBA,EAAW,KAAK;AAAA,MAChC,wBAAwBA,EAAW,QAAQ;AAAA,MAC3C,qBAAqBA,EAAW,KAAK;AAAA,MACrC,iBAAiBA,EAAW,QAAQ;AAAA,MACpC,oBAAoBK;AAAA,MACpB,QAAQ,MAAM;AACZ,QAAAR,EAAQU,EAAgB,+CAA+C;AAAA,MACzE;AAAA,MACA,iBAAiBP,EAAW,OAAO;AAAA,IAAA;AAAA,EAAA,GAEvC;AAEJ;AAeO,SAASS,EAAoB,EAAE,mBAAAC,GAAmB,GAAGC,KAAmC;AAC7F,SACE,gBAAAP;AAAA,IAACQ;AAAA,IAAA;AAAA,MACC,eAAc;AAAA,MACd,mBAAAF;AAAA,MAEA,UAAA,gBAAAN,EAACV,GAAA,EAAyB,GAAGiB,EAAA,CAAO;AAAA,IAAA;AAAA,EAAA;AAG1C;"}
+{"version":3,"file":"WorkAddressEditForm.js","sources":["../../../../../src/components/Employee/WorkAddress/management/WorkAddressEditForm.tsx"],"sourcesContent":["import type { EmployeeWorkAddress } from '@gusto/embedded-api/models/components/employeeworkaddress'\nimport { WorkAddressView } from './WorkAddressView'\nimport {\n  isUseWorkAddressManagementSuccess,\n  useWorkAddressManagement,\n} from './useWorkAddressManagement'\nimport { BaseBoundaries, BaseLayout, type BaseComponentInterface } from '@/components/Base/Base'\nimport { useI18n, useComponentDictionary } from '@/i18n'\nimport type { HookSubmitResult } from '@/partner-hook-utils/types'\nimport { componentEvents } from '@/shared/constants'\n\n/**\n * Props for {@link WorkAddressEditForm}.\n *\n * @public\n */\nexport interface WorkAddressEditFormProps extends BaseComponentInterface<'Employee.Management.WorkAddress'> {\n  /** The associated employee identifier. */\n  employeeId: string\n}\n\nfunction WorkAddressEditFormRoot({\n  employeeId,\n  dictionary,\n  onEvent,\n  LoaderComponent,\n}: WorkAddressEditFormProps) {\n  useI18n(['Employee.Management.WorkAddress'])\n  useComponentDictionary('Employee.Management.WorkAddress', dictionary)\n\n  const management = useWorkAddressManagement({ employeeId, onEvent })\n\n  if (management.isLoading) {\n    return (\n      <BaseLayout\n        isLoading\n        error={management.errorHandling.errors}\n        LoaderComponent={LoaderComponent}\n      />\n    )\n  }\n\n  if (!isUseWorkAddressManagementSuccess(management)) {\n    return <BaseLayout error={management.errorHandling.errors} LoaderComponent={LoaderComponent} />\n  }\n\n  const handleWorkAddressSaved = (result: HookSubmitResult<EmployeeWorkAddress>) => {\n    if (result.mode === 'create') {\n      onEvent(componentEvents.EMPLOYEE_MANAGEMENT_WORK_ADDRESS_CREATED, result.data)\n    } else {\n      onEvent(componentEvents.EMPLOYEE_MANAGEMENT_WORK_ADDRESS_UPDATED, result.data)\n    }\n  }\n\n  return (\n    <BaseLayout error={management.errorHandling.errors} LoaderComponent={LoaderComponent}>\n      <WorkAddressView\n        editWorkAddressForm={management.data.editWorkAddressForm}\n        changeWorkAddressForm={management.data.changeWorkAddressForm}\n        workAddresses={management.data.employeeWorkAddresses}\n        editTargetUuid={management.data.editTargetUuid}\n        onEditTargetUuidChange={management.actions.setEditTargetUuid}\n        employeeDisplayName={management.data.employeeDisplayName}\n        onConfirmDelete={management.actions.confirmDeleteWorkAddress}\n        onWorkAddressSaved={handleWorkAddressSaved}\n        onBack={() => {\n          onEvent(componentEvents.EMPLOYEE_MANAGEMENT_WORK_ADDRESS_EDIT_CANCELLED)\n        }}\n        isDeletePending={management.status.isDeletePending}\n      />\n    </BaseLayout>\n  )\n}\n\n/**\n * Standalone employee work address edit form for creating, updating, and deleting addresses.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `employee/management/workAddress/created` | A new work address was created | {@link APIModels.EmployeeWorkAddress} |\n * | `employee/management/workAddress/updated` | An existing work address was updated | {@link APIModels.EmployeeWorkAddress} |\n * | `employee/management/workAddress/deleted` | A work address was deleted | {@link APIModels.EmployeeWorkAddress} |\n * | `employee/management/workAddress/editCancelled` | User backed out of the edit form | — |\n *\n * @public\n */\nexport function WorkAddressEditForm({\n  FallbackComponent,\n  LoaderComponent,\n  ...props\n}: WorkAddressEditFormProps) {\n  return (\n    <BaseBoundaries\n      componentName=\"Employee.Management.WorkAddress\"\n      FallbackComponent={FallbackComponent}\n      LoaderComponent={LoaderComponent}\n    >\n      <WorkAddressEditFormRoot LoaderComponent={LoaderComponent} {...props} />\n    </BaseBoundaries>\n  )\n}\n"],"names":["WorkAddressEditFormRoot","employeeId","dictionary","onEvent","LoaderComponent","useI18n","useComponentDictionary","management","useWorkAddressManagement","jsx","BaseLayout","isUseWorkAddressManagementSuccess","handleWorkAddressSaved","result","componentEvents","WorkAddressView","WorkAddressEditForm","FallbackComponent","props","BaseBoundaries"],"mappings":";;;;;;AAqBA,SAASA,EAAwB;AAAA,EAC/B,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,SAAAC;AAAA,EACA,iBAAAC;AACF,GAA6B;AAC3B,EAAAC,EAAQ,CAAC,iCAAiC,CAAC,GAC3CC,EAAuB,mCAAmCJ,CAAU;AAEpE,QAAMK,IAAaC,EAAyB,EAAE,YAAAP,GAAY,SAAAE,GAAS;AAEnE,MAAII,EAAW;AACb,WACE,gBAAAE;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,WAAS;AAAA,QACT,OAAOH,EAAW,cAAc;AAAA,QAChC,iBAAAH;AAAA,MAAA;AAAA,IAAA;AAKN,MAAI,CAACO,EAAkCJ,CAAU;AAC/C,6BAAQG,GAAA,EAAW,OAAOH,EAAW,cAAc,QAAQ,iBAAAH,GAAkC;AAG/F,QAAMQ,IAAyB,CAACC,MAAkD;AAChF,IAAIA,EAAO,SAAS,WAClBV,EAAQW,EAAgB,0CAA0CD,EAAO,IAAI,IAE7EV,EAAQW,EAAgB,0CAA0CD,EAAO,IAAI;AAAA,EAEjF;AAEA,2BACGH,GAAA,EAAW,OAAOH,EAAW,cAAc,QAAQ,iBAAAH,GAClD,UAAA,gBAAAK;AAAA,IAACM;AAAA,IAAA;AAAA,MACC,qBAAqBR,EAAW,KAAK;AAAA,MACrC,uBAAuBA,EAAW,KAAK;AAAA,MACvC,eAAeA,EAAW,KAAK;AAAA,MAC/B,gBAAgBA,EAAW,KAAK;AAAA,MAChC,wBAAwBA,EAAW,QAAQ;AAAA,MAC3C,qBAAqBA,EAAW,KAAK;AAAA,MACrC,iBAAiBA,EAAW,QAAQ;AAAA,MACpC,oBAAoBK;AAAA,MACpB,QAAQ,MAAM;AACZ,QAAAT,EAAQW,EAAgB,+CAA+C;AAAA,MACzE;AAAA,MACA,iBAAiBP,EAAW,OAAO;AAAA,IAAA;AAAA,EAAA,GAEvC;AAEJ;AAeO,SAASS,EAAoB;AAAA,EAClC,mBAAAC;AAAA,EACA,iBAAAb;AAAA,EACA,GAAGc;AACL,GAA6B;AAC3B,SACE,gBAAAT;AAAA,IAACU;AAAA,IAAA;AAAA,MACC,eAAc;AAAA,MACd,mBAAAF;AAAA,MACA,iBAAAb;AAAA,MAEA,UAAA,gBAAAK,EAACT,GAAA,EAAwB,iBAAAI,GAAmC,GAAGc,EAAA,CAAO;AAAA,IAAA;AAAA,EAAA;AAG5E;"}

package/dist/components/Flow/Flow.js

@@ -1,8 +1,8 @@
 import { jsx as n, jsxs as x } from "react/jsx-runtime";
 import { useMachine as h } from "react-robot";
+import { Flex as l } from "../Common/Flex/Flex.js";
 import { FlowContext as u } from "./useFlow.js";
 import { FlowHeader as v } from "./FlowHeader.js";
-import { Flex as l } from "../Common/Flex/Flex.js";
 const E = ({
   onEvent: m,
   machine: s

package/dist/components/Flow/FlowHeader.js

@@ -2,12 +2,11 @@ import { jsx as r, jsxs as i } from "react/jsx-runtime";
 import { useTranslation as m } from "react-i18next";
 import { FlowBreadcrumbs as f } from "../Common/FlowBreadcrumbs/FlowBreadcrumbs.js";
 import { Flex as l, FlexItem as a } from "../Common/Flex/Flex.js";
-import { useComponentContext as u } from "../../contexts/ComponentAdapter/useComponentContext.js";
-import "react";
 import { useFlow as s } from "./useFlow.js";
 import { componentEvents as b } from "../../shared/constants.js";
+import { useComponentContext as u } from "../../contexts/ComponentAdapter/useComponentContext.js";
 import h from "../../assets/icons/caret-left.svg.js";
-function L() {
+function I() {
   const { header: e, component: t } = s();
   if (!e || !t) return null;
   switch (e.type) {
@@ -88,6 +87,6 @@ function v({
   ] });
 }
 export {
-  L as FlowHeader
+  I as FlowHeader
 };
 //# sourceMappingURL=FlowHeader.js.map

package/dist/components/Flow/FlowHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlowHeader.js","sources":["../../../src/components/Flow/FlowHeader.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { CustomTypeOptions } from 'i18next'\nimport { FlowBreadcrumbs } from '../Common/FlowBreadcrumbs/FlowBreadcrumbs'\nimport type { BreadcrumbTrail } from '../Common/FlowBreadcrumbs/FlowBreadcrumbsTypes'\nimport { Flex } from '../Common/Flex'\nimport { FlexItem } from '../Common'\nimport { useFlow } from './useFlow'\nimport { componentEvents, type EventType } from '@/shared/constants'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport CaretLeftIcon from '@/assets/icons/caret-left.svg?react'\n\n/**\n * Renders the chrome above the active flow component (back affordance, progress bar, breadcrumbs).\n *\n * @remarks\n * Reads the discriminated `header` value from {@link FlowContext} and dispatches to the matching\n * internal renderer:\n *\n * - `header.type === 'minimal'` — back button and optional CTA.\n * - `header.type === 'progress'` — step indicator with `currentStep` / `totalSteps`.\n * - `header.type === 'breadcrumbs'` — breadcrumb trail; renders nothing while\n *   `currentBreadcrumbId` is absent so passive states (e.g. landing screens) don't reset the bar.\n *\n * When no `header` is configured, or there is no active `component` in context, nothing is\n * rendered. To add a new chrome variant: extend {@link FlowHeaderConfig}, add a renderer below,\n * and add a branch here.\n *\n * @returns A header element above the active flow component, or `null` when no header should show.\n * @internal\n */\nexport function FlowHeader() {\n  const { header, component } = useFlow()\n\n  if (!header || !component) return null\n\n  switch (header.type) {\n    case 'minimal':\n      return <MinimalHeader back={header.back} cta={header.cta} />\n    case 'progress':\n      return (\n        <ProgressHeader\n          currentStep={header.currentStep}\n          totalSteps={header.totalSteps}\n          cta={header.cta}\n        />\n      )\n    case 'breadcrumbs':\n      // The breadcrumb trail is intentionally persisted across \"passive\"\n      // states (e.g. landing screens) so that subsequent transitions can\n      // pick up where they left off without rebuilding it. We render the\n      // bar only when there's an active breadcrumb to show; otherwise\n      // we treat the flow as \"no chrome\" for this state.\n      if (!header.currentBreadcrumbId) return null\n      return (\n        <BreadcrumbsHeader\n          currentBreadcrumbId={header.currentBreadcrumbId}\n          breadcrumbs={header.breadcrumbs}\n          cta={header.cta}\n        />\n      )\n  }\n}\n\nfunction MinimalHeader({\n  back,\n  cta: Cta,\n}: {\n  back?: {\n    labelKey: string\n    namespace: keyof CustomTypeOptions['resources']\n    event: EventType\n  }\n  cta?: React.ComponentType\n}) {\n  const { onEvent } = useFlow()\n  const Components = useComponentContext()\n  const { t } = useTranslation(back?.namespace)\n\n  const label = back ? t(back.labelKey as never) : t('back')\n  const event = back?.event ?? componentEvents.CANCEL\n\n  return (\n    <Flex flexDirection=\"row\" justifyContent=\"space-between\" alignItems=\"center\">\n      <FlexItem>\n        <Components.Button\n          variant=\"secondary\"\n          icon={<CaretLeftIcon aria-hidden=\"true\" />}\n          onClick={() => {\n            onEvent(event, undefined)\n          }}\n        >\n          {label}\n        </Components.Button>\n      </FlexItem>\n      {Cta && (\n        <FlexItem>\n          <Cta />\n        </FlexItem>\n      )}\n    </Flex>\n  )\n}\n\nfunction ProgressHeader({\n  currentStep,\n  totalSteps,\n  cta: Cta,\n}: {\n  currentStep: number\n  totalSteps: number\n  cta?: React.ComponentType\n}) {\n  const Components = useComponentContext()\n  const { t } = useTranslation()\n\n  return (\n    <Components.ProgressBar\n      totalSteps={totalSteps}\n      currentStep={currentStep}\n      label={t('progressBarLabel', { totalSteps, currentStep })}\n      cta={Cta}\n    />\n  )\n}\n\nfunction BreadcrumbsHeader({\n  currentBreadcrumbId,\n  breadcrumbs = {},\n  cta: Cta,\n}: {\n  currentBreadcrumbId?: string\n  breadcrumbs?: BreadcrumbTrail\n  cta?: React.ComponentType\n}) {\n  const { onEvent } = useFlow()\n\n  return (\n    <Flex flexDirection=\"row\" justifyContent=\"space-between\" alignItems=\"center\">\n      <FlexItem flexGrow={1}>\n        <FlowBreadcrumbs\n          breadcrumbs={currentBreadcrumbId ? (breadcrumbs[currentBreadcrumbId] ?? []) : []}\n          currentBreadcrumbId={currentBreadcrumbId}\n          onEvent={onEvent}\n        />\n      </FlexItem>\n      <FlexItem>{Cta && <Cta />}</FlexItem>\n    </Flex>\n  )\n}\n"],"names":["FlowHeader","header","component","useFlow","MinimalHeader","jsx","ProgressHeader","BreadcrumbsHeader","back","Cta","onEvent","Components","useComponentContext","t","useTranslation","label","event","componentEvents","Flex","FlexItem","CaretLeftIcon","currentStep","totalSteps","currentBreadcrumbId","breadcrumbs","FlowBreadcrumbs"],"mappings":";;;;;;;;;AA8BO,SAASA,IAAa;AAC3B,QAAM,EAAE,QAAAC,GAAQ,WAAAC,EAAA,IAAcC,EAAA;AAE9B,MAAI,CAACF,KAAU,CAACC,EAAW,QAAO;AAElC,UAAQD,EAAO,MAAA;AAAA,IACb,KAAK;AACH,+BAAQG,GAAA,EAAc,MAAMH,EAAO,MAAM,KAAKA,EAAO,KAAK;AAAA,IAC5D,KAAK;AACH,aACE,gBAAAI;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,aAAaL,EAAO;AAAA,UACpB,YAAYA,EAAO;AAAA,UACnB,KAAKA,EAAO;AAAA,QAAA;AAAA,MAAA;AAAA,IAGlB,KAAK;AAMH,aAAKA,EAAO,sBAEV,gBAAAI;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,qBAAqBN,EAAO;AAAA,UAC5B,aAAaA,EAAO;AAAA,UACpB,KAAKA,EAAO;AAAA,QAAA;AAAA,MAAA,IALwB;AAAA,EAMtC;AAGR;AAEA,SAASG,EAAc;AAAA,EACrB,MAAAI;AAAA,EACA,KAAKC;AACP,GAOG;AACD,QAAM,EAAE,SAAAC,EAAA,IAAYP,EAAA,GACdQ,IAAaC,EAAA,GACb,EAAE,GAAAC,EAAA,IAAMC,EAAeN,GAAM,SAAS,GAEtCO,IAAeF,EAAPL,IAASA,EAAK,WAAuB,MAAN,GACvCQ,IAAQR,GAAM,SAASS,EAAgB;AAE7C,2BACGC,GAAA,EAAK,eAAc,OAAM,gBAAe,iBAAgB,YAAW,UAClE,UAAA;AAAA,IAAA,gBAAAb,EAACc,GAAA,EACC,UAAA,gBAAAd;AAAA,MAACM,EAAW;AAAA,MAAX;AAAA,QACC,SAAQ;AAAA,QACR,MAAM,gBAAAN,EAACe,GAAA,EAAc,eAAY,OAAA,CAAO;AAAA,QACxC,SAAS,MAAM;AACb,UAAAV,EAAQM,GAAO,MAAS;AAAA,QAC1B;AAAA,QAEC,UAAAD;AAAA,MAAA;AAAA,IAAA,GAEL;AAAA,IACCN,KACC,gBAAAJ,EAACc,GAAA,EACC,UAAA,gBAAAd,EAACI,KAAI,EAAA,CACP;AAAA,EAAA,GAEJ;AAEJ;AAEA,SAASH,EAAe;AAAA,EACtB,aAAAe;AAAA,EACA,YAAAC;AAAA,EACA,KAAKb;AACP,GAIG;AACD,QAAME,IAAaC,EAAA,GACb,EAAE,GAAAC,EAAA,IAAMC,EAAA;AAEd,SACE,gBAAAT;AAAA,IAACM,EAAW;AAAA,IAAX;AAAA,MACC,YAAAW;AAAA,MACA,aAAAD;AAAA,MACA,OAAOR,EAAE,oBAAoB,EAAE,YAAAS,GAAY,aAAAD,GAAa;AAAA,MACxD,KAAKZ;AAAA,IAAA;AAAA,EAAA;AAGX;AAEA,SAASF,EAAkB;AAAA,EACzB,qBAAAgB;AAAA,EACA,aAAAC,IAAc,CAAA;AAAA,EACd,KAAKf;AACP,GAIG;AACD,QAAM,EAAE,SAAAC,EAAA,IAAYP,EAAA;AAEpB,2BACGe,GAAA,EAAK,eAAc,OAAM,gBAAe,iBAAgB,YAAW,UAClE,UAAA;AAAA,IAAA,gBAAAb,EAACc,GAAA,EAAS,UAAU,GAClB,UAAA,gBAAAd;AAAA,MAACoB;AAAA,MAAA;AAAA,QACC,aAAaF,IAAuBC,EAAYD,CAAmB,KAAK,CAAA,IAAM,CAAA;AAAA,QAC9E,qBAAAA;AAAA,QACA,SAAAb;AAAA,MAAA;AAAA,IAAA,GAEJ;AAAA,IACA,gBAAAL,EAACc,GAAA,EAAU,UAAAV,KAAO,gBAAAJ,EAACI,KAAI,EAAA,CAAG;AAAA,EAAA,GAC5B;AAEJ;"}
+{"version":3,"file":"FlowHeader.js","sources":["../../../src/components/Flow/FlowHeader.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport type { CustomTypeOptions } from 'i18next'\nimport { FlowBreadcrumbs } from '../Common/FlowBreadcrumbs/FlowBreadcrumbs'\nimport type { BreadcrumbTrail } from '../Common/FlowBreadcrumbs/FlowBreadcrumbsTypes'\nimport { Flex } from '../Common/Flex'\nimport { FlexItem } from '../Common'\nimport { useFlow } from './useFlow'\nimport { componentEvents, type EventType } from '@/shared/constants'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport CaretLeftIcon from '@/assets/icons/caret-left.svg?react'\n\n/**\n * Renders the chrome above the active flow component (back affordance, progress bar, breadcrumbs).\n *\n * @remarks\n * Reads the discriminated `header` value from {@link FlowContext} and dispatches to the matching\n * internal renderer:\n *\n * - `header.type === 'minimal'` — back button and optional CTA.\n * - `header.type === 'progress'` — step indicator with `currentStep` / `totalSteps`.\n * - `header.type === 'breadcrumbs'` — breadcrumb trail; renders nothing while\n *   `currentBreadcrumbId` is absent so passive states (e.g. landing screens) don't reset the bar.\n *\n * When no `header` is configured, or there is no active `component` in context, nothing is\n * rendered. To add a new chrome variant: extend {@link FlowHeaderConfig}, add a renderer below,\n * and add a branch here.\n *\n * @returns A header element above the active flow component, or `null` when no header should show.\n * @internal\n */\nexport function FlowHeader() {\n  const { header, component } = useFlow()\n\n  if (!header || !component) return null\n\n  switch (header.type) {\n    case 'minimal':\n      return <MinimalHeader back={header.back} cta={header.cta} />\n    case 'progress':\n      return (\n        <ProgressHeader\n          currentStep={header.currentStep}\n          totalSteps={header.totalSteps}\n          cta={header.cta}\n        />\n      )\n    case 'breadcrumbs':\n      // The breadcrumb trail is intentionally persisted across \"passive\"\n      // states (e.g. landing screens) so that subsequent transitions can\n      // pick up where they left off without rebuilding it. We render the\n      // bar only when there's an active breadcrumb to show; otherwise\n      // we treat the flow as \"no chrome\" for this state.\n      if (!header.currentBreadcrumbId) return null\n      return (\n        <BreadcrumbsHeader\n          currentBreadcrumbId={header.currentBreadcrumbId}\n          breadcrumbs={header.breadcrumbs}\n          cta={header.cta}\n        />\n      )\n  }\n}\n\nfunction MinimalHeader({\n  back,\n  cta: Cta,\n}: {\n  back?: {\n    labelKey: string\n    namespace: keyof CustomTypeOptions['resources']\n    event: EventType\n  }\n  cta?: React.ComponentType\n}) {\n  const { onEvent } = useFlow()\n  const Components = useComponentContext()\n  const { t } = useTranslation(back?.namespace)\n\n  const label = back ? t(back.labelKey as never) : t('back')\n  const event = back?.event ?? componentEvents.CANCEL\n\n  return (\n    <Flex flexDirection=\"row\" justifyContent=\"space-between\" alignItems=\"center\">\n      <FlexItem>\n        <Components.Button\n          variant=\"secondary\"\n          icon={<CaretLeftIcon aria-hidden=\"true\" />}\n          onClick={() => {\n            onEvent(event, undefined)\n          }}\n        >\n          {label}\n        </Components.Button>\n      </FlexItem>\n      {Cta && (\n        <FlexItem>\n          <Cta />\n        </FlexItem>\n      )}\n    </Flex>\n  )\n}\n\nfunction ProgressHeader({\n  currentStep,\n  totalSteps,\n  cta: Cta,\n}: {\n  currentStep: number\n  totalSteps: number\n  cta?: React.ComponentType\n}) {\n  const Components = useComponentContext()\n  const { t } = useTranslation()\n\n  return (\n    <Components.ProgressBar\n      totalSteps={totalSteps}\n      currentStep={currentStep}\n      label={t('progressBarLabel', { totalSteps, currentStep })}\n      cta={Cta}\n    />\n  )\n}\n\nfunction BreadcrumbsHeader({\n  currentBreadcrumbId,\n  breadcrumbs = {},\n  cta: Cta,\n}: {\n  currentBreadcrumbId?: string\n  breadcrumbs?: BreadcrumbTrail\n  cta?: React.ComponentType\n}) {\n  const { onEvent } = useFlow()\n\n  return (\n    <Flex flexDirection=\"row\" justifyContent=\"space-between\" alignItems=\"center\">\n      <FlexItem flexGrow={1}>\n        <FlowBreadcrumbs\n          breadcrumbs={currentBreadcrumbId ? (breadcrumbs[currentBreadcrumbId] ?? []) : []}\n          currentBreadcrumbId={currentBreadcrumbId}\n          onEvent={onEvent}\n        />\n      </FlexItem>\n      <FlexItem>{Cta && <Cta />}</FlexItem>\n    </Flex>\n  )\n}\n"],"names":["FlowHeader","header","component","useFlow","MinimalHeader","jsx","ProgressHeader","BreadcrumbsHeader","back","Cta","onEvent","Components","useComponentContext","t","useTranslation","label","event","componentEvents","Flex","FlexItem","CaretLeftIcon","currentStep","totalSteps","currentBreadcrumbId","breadcrumbs","FlowBreadcrumbs"],"mappings":";;;;;;;;AA8BO,SAASA,IAAa;AAC3B,QAAM,EAAE,QAAAC,GAAQ,WAAAC,EAAA,IAAcC,EAAA;AAE9B,MAAI,CAACF,KAAU,CAACC,EAAW,QAAO;AAElC,UAAQD,EAAO,MAAA;AAAA,IACb,KAAK;AACH,+BAAQG,GAAA,EAAc,MAAMH,EAAO,MAAM,KAAKA,EAAO,KAAK;AAAA,IAC5D,KAAK;AACH,aACE,gBAAAI;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,aAAaL,EAAO;AAAA,UACpB,YAAYA,EAAO;AAAA,UACnB,KAAKA,EAAO;AAAA,QAAA;AAAA,MAAA;AAAA,IAGlB,KAAK;AAMH,aAAKA,EAAO,sBAEV,gBAAAI;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,qBAAqBN,EAAO;AAAA,UAC5B,aAAaA,EAAO;AAAA,UACpB,KAAKA,EAAO;AAAA,QAAA;AAAA,MAAA,IALwB;AAAA,EAMtC;AAGR;AAEA,SAASG,EAAc;AAAA,EACrB,MAAAI;AAAA,EACA,KAAKC;AACP,GAOG;AACD,QAAM,EAAE,SAAAC,EAAA,IAAYP,EAAA,GACdQ,IAAaC,EAAA,GACb,EAAE,GAAAC,EAAA,IAAMC,EAAeN,GAAM,SAAS,GAEtCO,IAAeF,EAAPL,IAASA,EAAK,WAAuB,MAAN,GACvCQ,IAAQR,GAAM,SAASS,EAAgB;AAE7C,2BACGC,GAAA,EAAK,eAAc,OAAM,gBAAe,iBAAgB,YAAW,UAClE,UAAA;AAAA,IAAA,gBAAAb,EAACc,GAAA,EACC,UAAA,gBAAAd;AAAA,MAACM,EAAW;AAAA,MAAX;AAAA,QACC,SAAQ;AAAA,QACR,MAAM,gBAAAN,EAACe,GAAA,EAAc,eAAY,OAAA,CAAO;AAAA,QACxC,SAAS,MAAM;AACb,UAAAV,EAAQM,GAAO,MAAS;AAAA,QAC1B;AAAA,QAEC,UAAAD;AAAA,MAAA;AAAA,IAAA,GAEL;AAAA,IACCN,KACC,gBAAAJ,EAACc,GAAA,EACC,UAAA,gBAAAd,EAACI,KAAI,EAAA,CACP;AAAA,EAAA,GAEJ;AAEJ;AAEA,SAASH,EAAe;AAAA,EACtB,aAAAe;AAAA,EACA,YAAAC;AAAA,EACA,KAAKb;AACP,GAIG;AACD,QAAME,IAAaC,EAAA,GACb,EAAE,GAAAC,EAAA,IAAMC,EAAA;AAEd,SACE,gBAAAT;AAAA,IAACM,EAAW;AAAA,IAAX;AAAA,MACC,YAAAW;AAAA,MACA,aAAAD;AAAA,MACA,OAAOR,EAAE,oBAAoB,EAAE,YAAAS,GAAY,aAAAD,GAAa;AAAA,MACxD,KAAKZ;AAAA,IAAA;AAAA,EAAA;AAGX;AAEA,SAASF,EAAkB;AAAA,EACzB,qBAAAgB;AAAA,EACA,aAAAC,IAAc,CAAA;AAAA,EACd,KAAKf;AACP,GAIG;AACD,QAAM,EAAE,SAAAC,EAAA,IAAYP,EAAA;AAEpB,2BACGe,GAAA,EAAK,eAAc,OAAM,gBAAe,iBAAgB,YAAW,UAClE,UAAA;AAAA,IAAA,gBAAAb,EAACc,GAAA,EAAS,UAAU,GAClB,UAAA,gBAAAd;AAAA,MAACoB;AAAA,MAAA;AAAA,QACC,aAAaF,IAAuBC,EAAYD,CAAmB,KAAK,CAAA,IAAM,CAAA;AAAA,QAC9E,qBAAAA;AAAA,QACA,SAAAb;AAAA,MAAA;AAAA,IAAA,GAEJ;AAAA,IACA,gBAAAL,EAACc,GAAA,EAAU,UAAAV,KAAO,gBAAAJ,EAACI,KAAI,EAAA,CAAG;AAAA,EAAA,GAC5B;AAEJ;"}

package/dist/components/Flow/useFlow.d.ts

@@ -1,6 +1,6 @@
 import { CustomTypeOptions } from 'i18next';
 import { OnEventType } from '../Base/useBase';
-import { CommonComponentInterface } from '../Base';
+import { CommonComponentInterface, LoaderComponentType } from '../Base';
 import { BreadcrumbTrail } from '../Common/FlowBreadcrumbs/FlowBreadcrumbsTypes';
 import { EventType } from '../../shared/constants';
 /**
@@ -70,6 +70,12 @@ export interface FlowContextInterface {
      * (or set to `null`), no header is shown.
      */
     header?: FlowHeaderConfig | null;
+    /**
+     * Optional loading indicator propagated from the flow's entry component so step
+     * components can forward it to their `BaseLayout`. Falls back to the
+     * `LoadingIndicatorContext` value when omitted.
+     */
+    LoaderComponent?: LoaderComponentType;
 }
 /**
  * React context that exposes the current {@link FlowContextInterface} to step components

package/dist/components/Flow/useFlow.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFlow.js","sources":["../../../src/components/Flow/useFlow.ts"],"sourcesContent":["import { createContext, useContext } from 'react'\nimport type { CustomTypeOptions } from 'i18next'\nimport type { OnEventType } from '../Base/useBase'\nimport type { CommonComponentInterface } from '../Base'\nimport type { BreadcrumbTrail } from '../Common/FlowBreadcrumbs/FlowBreadcrumbsTypes'\nimport type { EventType } from '@/shared/constants'\n\n/**\n * Configuration for a call-to-action label sourced from the i18n catalogue.\n *\n * @internal\n */\ninterface CtaConfig {\n  labelKey: string\n  namespace?: keyof CustomTypeOptions['resources']\n}\n\n/**\n * Discriminated union describing the chrome rendered above the active flow component.\n *\n * @remarks\n * Each variant declares only the data it needs:\n *\n * - `minimal` — back button. Optional `cta` for an extra control next to it.\n * - `progress` — step indicator. Requires `currentStep` / `totalSteps`, plus optional `cta`.\n * - `breadcrumbs` — breadcrumb trail. Optional `currentBreadcrumbId` / `breadcrumbs` (typically\n *   populated via `buildBreadcrumbs` + `updateBreadcrumbs`), plus optional `cta`.\n *\n * `cta` carries the same meaning across every variant: an optional component rendered as part\n * of the header chrome.\n *\n * @internal\n */\nexport type FlowHeaderConfig =\n  | {\n      type: 'minimal'\n      /**\n       * Optional override for the default back button (defaults to\n       * `t('back')` + `componentEvents.CANCEL`). Provide both `label` and\n       * `event` to render a flow-specific affordance — e.g. \"Back to\n       * employees\" routed to a dedicated state-machine transition so nested\n       * flows don't intercept it as a generic cancel.\n       */\n      back?: {\n        labelKey: string\n        namespace: keyof CustomTypeOptions['resources']\n        event: EventType\n      }\n      cta?: React.ComponentType\n    }\n  | {\n      type: 'progress'\n      currentStep: number\n      totalSteps: number\n      cta?: React.ComponentType\n    }\n  | {\n      type: 'breadcrumbs'\n      currentBreadcrumbId?: string\n      breadcrumbs?: BreadcrumbTrail\n      cta?: React.ComponentType\n    }\n\n/**\n * Shape of the value carried by {@link FlowContext}: the active step component, the upstream\n * event dispatcher, and optional defaults / chrome configuration.\n *\n * @internal\n */\nexport interface FlowContextInterface {\n  component: React.ComponentType<CommonComponentInterface> | null\n  onEvent: OnEventType<EventType, unknown>\n  defaultValues?: Record<string, unknown>\n  ctaConfig?: CtaConfig | null\n  /**\n   * Optional chrome rendered above the active flow component. When omitted\n   * (or set to `null`), no header is shown.\n   */\n  header?: FlowHeaderConfig | null\n}\n\n/**\n * React context that exposes the current {@link FlowContextInterface} to step components\n * rendered inside a {@link Flow}.\n *\n * @internal\n */\nexport const FlowContext = createContext<FlowContextInterface | null>(null)\n\n//TODO: This is hiding the fact that the callsite for useFlow\n//  destructures a `companyId` that doesn't seem to exist\n/* eslint-disable @typescript-eslint/no-unnecessary-type-parameters */\n/**\n * Reads the active {@link FlowContext} value from a step component rendered inside a {@link Flow}.\n *\n * @remarks\n * Throws if called outside a {@link Flow} provider. The generic `C` parameter lets callers narrow\n * the context to a flow-specific extension of {@link FlowContextInterface} that carries extra\n * fields (e.g. `companyId`, `employeeId`).\n *\n * @typeParam C - The concrete context shape the calling flow expects, extending {@link FlowContextInterface}.\n * @returns The current flow context value, narrowed to `C`.\n * @throws When called outside a {@link Flow} provider, an `Error` is thrown.\n * @internal\n */\nexport function useFlow<C extends FlowContextInterface>() {\n  /* eslint-enable @typescript-eslint/no-unnecessary-type-parameters */\n  // When used outside provider, this is expected to return undefined - consumers must fallback to params\n  const values = useContext<C>(FlowContext as unknown as React.Context<C>)\n  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n  if (!values) {\n    throw new Error('useFlow used outside provider')\n  }\n  return values\n}\n"],"names":["FlowContext","createContext","useFlow","values","useContext"],"mappings":";AAuFO,MAAMA,IAAcC,EAA2C,IAAI;AAkBnE,SAASC,IAA0C;AAGxD,QAAMC,IAASC,EAAcJ,CAA0C;AAEvE,MAAI,CAACG;AACH,UAAM,IAAI,MAAM,+BAA+B;AAEjD,SAAOA;AACT;"}
+{"version":3,"file":"useFlow.js","sources":["../../../src/components/Flow/useFlow.ts"],"sourcesContent":["import { createContext, useContext } from 'react'\nimport type { CustomTypeOptions } from 'i18next'\nimport type { OnEventType } from '../Base/useBase'\nimport type { CommonComponentInterface, LoaderComponentType } from '../Base'\nimport type { BreadcrumbTrail } from '../Common/FlowBreadcrumbs/FlowBreadcrumbsTypes'\nimport type { EventType } from '@/shared/constants'\n\n/**\n * Configuration for a call-to-action label sourced from the i18n catalogue.\n *\n * @internal\n */\ninterface CtaConfig {\n  labelKey: string\n  namespace?: keyof CustomTypeOptions['resources']\n}\n\n/**\n * Discriminated union describing the chrome rendered above the active flow component.\n *\n * @remarks\n * Each variant declares only the data it needs:\n *\n * - `minimal` — back button. Optional `cta` for an extra control next to it.\n * - `progress` — step indicator. Requires `currentStep` / `totalSteps`, plus optional `cta`.\n * - `breadcrumbs` — breadcrumb trail. Optional `currentBreadcrumbId` / `breadcrumbs` (typically\n *   populated via `buildBreadcrumbs` + `updateBreadcrumbs`), plus optional `cta`.\n *\n * `cta` carries the same meaning across every variant: an optional component rendered as part\n * of the header chrome.\n *\n * @internal\n */\nexport type FlowHeaderConfig =\n  | {\n      type: 'minimal'\n      /**\n       * Optional override for the default back button (defaults to\n       * `t('back')` + `componentEvents.CANCEL`). Provide both `label` and\n       * `event` to render a flow-specific affordance — e.g. \"Back to\n       * employees\" routed to a dedicated state-machine transition so nested\n       * flows don't intercept it as a generic cancel.\n       */\n      back?: {\n        labelKey: string\n        namespace: keyof CustomTypeOptions['resources']\n        event: EventType\n      }\n      cta?: React.ComponentType\n    }\n  | {\n      type: 'progress'\n      currentStep: number\n      totalSteps: number\n      cta?: React.ComponentType\n    }\n  | {\n      type: 'breadcrumbs'\n      currentBreadcrumbId?: string\n      breadcrumbs?: BreadcrumbTrail\n      cta?: React.ComponentType\n    }\n\n/**\n * Shape of the value carried by {@link FlowContext}: the active step component, the upstream\n * event dispatcher, and optional defaults / chrome configuration.\n *\n * @internal\n */\nexport interface FlowContextInterface {\n  component: React.ComponentType<CommonComponentInterface> | null\n  onEvent: OnEventType<EventType, unknown>\n  defaultValues?: Record<string, unknown>\n  ctaConfig?: CtaConfig | null\n  /**\n   * Optional chrome rendered above the active flow component. When omitted\n   * (or set to `null`), no header is shown.\n   */\n  header?: FlowHeaderConfig | null\n  /**\n   * Optional loading indicator propagated from the flow's entry component so step\n   * components can forward it to their `BaseLayout`. Falls back to the\n   * `LoadingIndicatorContext` value when omitted.\n   */\n  LoaderComponent?: LoaderComponentType\n}\n\n/**\n * React context that exposes the current {@link FlowContextInterface} to step components\n * rendered inside a {@link Flow}.\n *\n * @internal\n */\nexport const FlowContext = createContext<FlowContextInterface | null>(null)\n\n//TODO: This is hiding the fact that the callsite for useFlow\n//  destructures a `companyId` that doesn't seem to exist\n/* eslint-disable @typescript-eslint/no-unnecessary-type-parameters */\n/**\n * Reads the active {@link FlowContext} value from a step component rendered inside a {@link Flow}.\n *\n * @remarks\n * Throws if called outside a {@link Flow} provider. The generic `C` parameter lets callers narrow\n * the context to a flow-specific extension of {@link FlowContextInterface} that carries extra\n * fields (e.g. `companyId`, `employeeId`).\n *\n * @typeParam C - The concrete context shape the calling flow expects, extending {@link FlowContextInterface}.\n * @returns The current flow context value, narrowed to `C`.\n * @throws When called outside a {@link Flow} provider, an `Error` is thrown.\n * @internal\n */\nexport function useFlow<C extends FlowContextInterface>() {\n  /* eslint-enable @typescript-eslint/no-unnecessary-type-parameters */\n  // When used outside provider, this is expected to return undefined - consumers must fallback to params\n  const values = useContext<C>(FlowContext as unknown as React.Context<C>)\n  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n  if (!values) {\n    throw new Error('useFlow used outside provider')\n  }\n  return values\n}\n"],"names":["FlowContext","createContext","useFlow","values","useContext"],"mappings":";AA6FO,MAAMA,IAAcC,EAA2C,IAAI;AAkBnE,SAASC,IAA0C;AAGxD,QAAMC,IAASC,EAAcJ,CAA0C;AAEvE,MAAI,CAACG;AACH,UAAM,IAAI,MAAM,+BAA+B;AAEjD,SAAOA;AACT;"}

package/dist/components/InformationRequests/InformationRequestForm/InformationRequestForm.js

@@ -1,145 +1,168 @@
-import { jsx as e, jsxs as p } from "react/jsx-runtime";
-import M from "dompurify";
-import { useTranslation as C } from "react-i18next";
-import { useForm as L, FormProvider as Q } from "react-hook-form";
-import { zodResolver as k } from "@hookform/resolvers/zod";
-import { z as l } from "zod";
-import "@tanstack/react-query";
-import { useInformationRequestsGetInformationRequestsSuspense as z } from "@gusto/embedded-api/react-query/informationRequestsGetInformationRequests";
-import { useInformationRequestsSubmitMutation as B } from "@gusto/embedded-api/react-query/informationRequestsSubmit";
-import { ResponseType as i } from "@gusto/embedded-api/models/components/informationrequest";
-import { ResponseType as v } from "@gusto/embedded-api/models/operations/submitinformationrequest";
-import s from "./InformationRequestForm.module.scss.js";
-import { BaseComponent as W } from "../../Base/Base.js";
-import { useBase as j } from "../../Base/useBase.js";
-import { Flex as E } from "../../Common/Flex/Flex.js";
-import { useComponentContext as H } from "../../../contexts/ComponentAdapter/useComponentContext.js";
-import "react";
-import { FileInputField as G } from "../../Common/Fields/FileInputField/FileInputField.js";
-import { Form as V } from "../../Common/Form/Form.js";
-import { useComponentDictionary as X, useI18n as Y } from "../../../i18n/I18n.js";
-import { informationRequestEvents as $ } from "../../../shared/constants.js";
-import "../../Flow/useFlow.js";
-import { TextInputField as J } from "../../Common/Fields/TextInputField/TextInputField.js";
-const K = "gusto-sdk-information-request-form", Z = ["image/jpeg", "image/png", "application/pdf"], ee = {
+import { jsx as e, jsxs as m } from "react/jsx-runtime";
+import B from "dompurify";
+import { useTranslation as D } from "react-i18next";
+import { useForm as W, FormProvider as H } from "react-hook-form";
+import { zodResolver as G } from "@hookform/resolvers/zod";
+import { z as f } from "zod";
+import { useIsMutating as K } from "@tanstack/react-query";
+import { useInformationRequestsGetInformationRequestsSuspense as _ } from "@gusto/embedded-api/react-query/informationRequestsGetInformationRequests";
+import { useInformationRequestsSubmitMutation as V, mutationKeyInformationRequestsSubmit as X } from "@gusto/embedded-api/react-query/informationRequestsSubmit";
+import { ResponseType as u } from "@gusto/embedded-api/models/components/informationrequest";
+import { ResponseType as U } from "@gusto/embedded-api/models/operations/submitinformationrequest";
+import i from "./InformationRequestForm.module.scss.js";
+import { BaseComponent as Y } from "../../Base/Base.js";
+import { useBase as $ } from "../../Base/useBase.js";
+import { Flex as q } from "../../Common/Flex/Flex.js";
+import { FileInputField as J } from "../../Common/Fields/FileInputField/FileInputField.js";
+import { Form as Z } from "../../Common/Form/Form.js";
+import { useComponentContext as P } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useComponentDictionary as ee, useI18n as A } from "../../../i18n/I18n.js";
+import { informationRequestEvents as C } from "../../../shared/constants.js";
+import { useFlow as ne } from "../../Flow/useFlow.js";
+import { TextInputField as te } from "../../Common/Fields/TextInputField/TextInputField.js";
+const M = "gusto-sdk-information-request-form", oe = ["image/jpeg", "image/png", "application/pdf"], se = {
   ALLOWED_TAGS: ["a", "b", "strong"],
   ALLOWED_ATTR: ["target", "href", "rel"]
-}, oe = 5e3, ne = l.record(
-  l.string(),
-  l.union([l.string().min(1), l.instanceof(File)])
+}, ie = 5e3, re = f.record(
+  f.string(),
+  f.union([f.string().min(1), f.instanceof(File)])
 );
-function Pe(t) {
-  return /* @__PURE__ */ e(W, { ...t, children: /* @__PURE__ */ e(ae, { ...t, children: t.children }) });
+function Ae(o) {
+  return /* @__PURE__ */ e(Y, { ...o, children: /* @__PURE__ */ e(me, { ...o, children: o.children }) });
 }
-const te = (t) => new Promise((r, h) => {
-  const o = new FileReader();
-  o.onload = () => {
-    r(o.result);
-  }, o.onerror = h, o.readAsDataURL(t);
-}), se = [i.Text, i.Document];
-function re(t) {
-  return t.some((r) => !se.includes(r.responseType));
+const ae = (o) => new Promise((s, r) => {
+  const n = new FileReader();
+  n.onload = () => {
+    s(n.result);
+  }, n.onerror = r, n.readAsDataURL(o);
+}), ue = [u.Text, u.Document];
+function O(o) {
+  return o.some((s) => !ue.includes(s.responseType));
 }
-function ie(t) {
-  return t.some((r) => r.responseType === i.Persona);
+function ce(o) {
+  return o.some((s) => s.responseType === u.Persona);
 }
-function ae({ companyId: t, requestId: r, dictionary: h }) {
-  X("InformationRequests.InformationRequestForm", h), Y("InformationRequests.InformationRequestForm");
-  const { t: o } = C("InformationRequests.InformationRequestForm"), { Alert: F, Heading: S, Text: a } = H(), { onEvent: x, baseSubmitHandler: N } = j(), { data: D } = z({
-    companyUuid: t
-  }), y = D.informationRequests?.find((n) => n.uuid === r), c = y?.requiredQuestions ?? [], U = y?.blockingPayroll ?? !1, b = re(c), g = ie(c), { mutateAsync: P } = B(), T = {}, R = [];
-  c.forEach((n) => {
-    n.responseType === i.Text ? (R.push(n.questionUuid), T[n.questionUuid] = "") : n.responseType === i.Document && (R.push(n.questionUuid), T[n.questionUuid] = void 0);
+function me({ companyId: o, requestId: s, dictionary: r }) {
+  ee("InformationRequests.InformationRequestForm", r), A("InformationRequests.InformationRequestForm");
+  const { t: n } = D("InformationRequests.InformationRequestForm"), { Alert: T, Heading: y, Text: c } = P(), { onEvent: g, baseSubmitHandler: I } = $(), { data: x } = _({
+    companyUuid: o
+  }), l = x.informationRequests?.find((t) => t.uuid === s), a = l?.requiredQuestions ?? [], F = l?.blockingPayroll ?? !1, w = O(a), N = ce(a), { mutateAsync: Q } = V(), v = {}, E = [];
+  a.forEach((t) => {
+    t.responseType === u.Text ? (E.push(t.questionUuid), v[t.questionUuid] = "") : t.responseType === u.Document && (E.push(t.questionUuid), v[t.questionUuid] = void 0);
   });
-  const I = L({
-    resolver: k(ne),
-    defaultValues: T
-  }), _ = async (n) => {
-    await N(n, async () => {
-      const f = (await Promise.all(
-        R.map(async (u) => {
-          const m = n[u];
-          if (typeof m == "string")
+  const b = W({
+    resolver: G(re),
+    defaultValues: v
+  }), L = async (t) => {
+    await I(t, async () => {
+      const h = (await Promise.all(
+        E.map(async (p) => {
+          const d = t[p];
+          if (typeof d == "string")
             return {
-              questionUuid: u,
-              responseType: v.Text,
-              textResponse: m
+              questionUuid: p,
+              responseType: U.Text,
+              textResponse: d
             };
-          if (m instanceof File) {
-            const w = await te(m);
+          if (d instanceof File) {
+            const z = await ae(d);
             return {
-              questionUuid: u,
-              responseType: v.Document,
-              fileResponse: w,
-              fileName: m.name
+              questionUuid: p,
+              responseType: U.Document,
+              fileResponse: z,
+              fileName: d.name
             };
           }
           return null;
         })
-      )).filter((u) => u !== null), q = await P({
+      )).filter((p) => p !== null), S = await Q({
         request: {
-          informationRequestUuid: r,
+          informationRequestUuid: s,
           requestBody: {
-            requiredQuestions: f
+            requiredQuestions: h
           }
         }
       });
-      x($.INFORMATION_REQUEST_FORM_DONE, q.informationRequest);
+      g(C.INFORMATION_REQUEST_FORM_DONE, S.informationRequest);
     });
-  }, A = (n) => {
-    const d = n.questionUuid, f = n.responseType === i.Document, q = n.responseType === i.Text;
-    return /* @__PURE__ */ p("div", { className: s.questionCard, children: [
-      /* @__PURE__ */ p("div", { className: s.questionDescription, children: [
-        /* @__PURE__ */ e(a, { size: "sm", weight: "medium", children: o(f ? "questionTypes.document" : "questionTypes.answer") }),
-        /* @__PURE__ */ e(a, { size: "sm", variant: "supporting", children: /* @__PURE__ */ e(
+  }, k = (t) => {
+    const R = t.questionUuid, h = t.responseType === u.Document, S = t.responseType === u.Text;
+    return /* @__PURE__ */ m("div", { className: i.questionCard, children: [
+      /* @__PURE__ */ m("div", { className: i.questionDescription, children: [
+        /* @__PURE__ */ e(c, { size: "sm", weight: "medium", children: n(h ? "questionTypes.document" : "questionTypes.answer") }),
+        /* @__PURE__ */ e(c, { size: "sm", variant: "supporting", children: /* @__PURE__ */ e(
           "span",
           {
             dangerouslySetInnerHTML: {
-              __html: M.sanitize(n.questionText, ee)
+              __html: B.sanitize(t.questionText, se)
             }
           }
         ) })
       ] }),
-      /* @__PURE__ */ e("hr", { className: s.divider }),
-      q && /* @__PURE__ */ e("div", { className: s.textInputWrapper, children: /* @__PURE__ */ e(
-        J,
+      /* @__PURE__ */ e("hr", { className: i.divider }),
+      S && /* @__PURE__ */ e("div", { className: i.textInputWrapper, children: /* @__PURE__ */ e(
+        te,
         {
-          name: d,
-          label: o("fields.textAnswer.label"),
-          placeholder: o("fields.textAnswer.placeholder"),
-          maxLength: oe,
+          name: R,
+          label: n("fields.textAnswer.label"),
+          placeholder: n("fields.textAnswer.placeholder"),
+          maxLength: ie,
           isRequired: !0,
-          errorMessage: o("validation.required")
+          errorMessage: n("validation.required")
         }
       ) }),
-      f && /* @__PURE__ */ e("div", { className: s.fileInputWrapper, children: /* @__PURE__ */ e(
-        G,
+      h && /* @__PURE__ */ e("div", { className: i.fileInputWrapper, children: /* @__PURE__ */ e(
+        J,
         {
-          name: d,
-          label: o("fields.fileUpload.label"),
-          accept: Z,
+          name: R,
+          label: n("fields.fileUpload.label"),
+          accept: oe,
           isRequired: !0,
-          errorMessage: o("validation.required")
+          errorMessage: n("validation.required")
         }
       ) })
-    ] }, d);
-  }, O = /* @__PURE__ */ p("div", { className: s.questionCard, children: [
-    /* @__PURE__ */ p("div", { className: s.questionDescription, children: [
-      /* @__PURE__ */ e(a, { weight: "medium", children: o(g ? "unsupported.persona.title" : "unsupported.generic.title") }),
-      /* @__PURE__ */ e(a, { children: o(
-        g ? "unsupported.persona.description" : "unsupported.generic.description"
+    ] }, R);
+  }, j = /* @__PURE__ */ m("div", { className: i.questionCard, children: [
+    /* @__PURE__ */ m("div", { className: i.questionDescription, children: [
+      /* @__PURE__ */ e(c, { weight: "medium", children: n(N ? "unsupported.persona.title" : "unsupported.generic.title") }),
+      /* @__PURE__ */ e(c, { children: n(
+        N ? "unsupported.persona.description" : "unsupported.generic.description"
       ) })
     ] }),
-    /* @__PURE__ */ e("hr", { className: s.divider }),
-    /* @__PURE__ */ e("div", { className: s.contactSupport, children: /* @__PURE__ */ e(a, { variant: "supporting", children: o("unsupported.contactSupport") }) })
+    /* @__PURE__ */ e("hr", { className: i.divider }),
+    /* @__PURE__ */ e("div", { className: i.contactSupport, children: /* @__PURE__ */ e(c, { variant: "supporting", children: n("unsupported.contactSupport") }) })
   ] });
-  return /* @__PURE__ */ e("div", { className: s.root, children: /* @__PURE__ */ p(E, { flexDirection: "column", gap: 16, children: [
-    /* @__PURE__ */ e(S, { as: "h2", children: o("title") }),
-    U && /* @__PURE__ */ e(F, { status: "error", label: o("blockingAlert.title"), disableScrollIntoView: !0, children: o("blockingAlert.description") }),
-    b ? O : /* @__PURE__ */ e(Q, { ...I, children: /* @__PURE__ */ e(V, { id: K, onSubmit: I.handleSubmit(_), children: /* @__PURE__ */ e(E, { flexDirection: "column", gap: 16, children: c.map(A) }) }) })
+  return /* @__PURE__ */ e("div", { className: i.root, children: /* @__PURE__ */ m(q, { flexDirection: "column", gap: 16, children: [
+    /* @__PURE__ */ e(y, { as: "h2", children: n("title") }),
+    F && /* @__PURE__ */ e(T, { status: "error", label: n("blockingAlert.title"), disableScrollIntoView: !0, children: n("blockingAlert.description") }),
+    w ? j : /* @__PURE__ */ e(H, { ...b, children: /* @__PURE__ */ e(Z, { id: M, onSubmit: b.handleSubmit(L), children: /* @__PURE__ */ e(q, { flexDirection: "column", gap: 16, children: a.map(k) }) }) })
   ] }) });
 }
+function Ce({ onEvent: o }) {
+  A("InformationRequests.InformationRequestForm");
+  const { t: s } = D("InformationRequests.InformationRequestForm"), { Button: r } = P(), { companyId: n, selectedRequestId: T } = ne(), { data: y } = _({
+    companyUuid: n
+  }), g = y.informationRequests?.find((F) => F.uuid === T)?.requiredQuestions ?? [], I = O(g), l = K({
+    mutationKey: X()
+  }) > 0, a = () => {
+    o(C.INFORMATION_REQUEST_FORM_CANCEL);
+  };
+  return I ? /* @__PURE__ */ e(q, { justifyContent: "flex-end", gap: 12, children: /* @__PURE__ */ e(r, { variant: "secondary", onClick: a, children: s("cta.close") }) }) : /* @__PURE__ */ m(q, { justifyContent: "flex-end", gap: 12, children: [
+    /* @__PURE__ */ e(r, { variant: "secondary", onClick: a, isDisabled: l, children: s("cta.cancel") }),
+    /* @__PURE__ */ e(
+      r,
+      {
+        variant: "primary",
+        type: "submit",
+        form: M,
+        isLoading: l,
+        children: s("cta.submit")
+      }
+    )
+  ] });
+}
 export {
-  Pe as InformationRequestForm
+  Ce as Footer,
+  Ae as InformationRequestForm
 };
 //# sourceMappingURL=InformationRequestForm.js.map