@gusto/embedded-react-sdk 0.55.3 → 0.55.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (130) hide show
  1. package/CHANGELOG.md +23 -0
  2. package/dist/components/Common/DataView/DataCards/DataCards.d.ts +2 -1
  3. package/dist/components/Common/DataView/DataCards/DataCards.js +63 -54
  4. package/dist/components/Common/DataView/DataCards/DataCards.js.map +1 -1
  5. package/dist/components/Common/DataView/DataCards/DataCards.module.scss.js +14 -12
  6. package/dist/components/Common/DataView/DataCards/DataCards.module.scss.js.map +1 -1
  7. package/dist/components/Common/DataView/DataTable/DataTable.d.ts +2 -1
  8. package/dist/components/Common/DataView/DataTable/DataTable.js +75 -66
  9. package/dist/components/Common/DataView/DataTable/DataTable.js.map +1 -1
  10. package/dist/components/Common/DataView/DataTable/DataTable.module.scss.js +8 -4
  11. package/dist/components/Common/DataView/DataTable/DataTable.module.scss.js.map +1 -1
  12. package/dist/components/Common/DataView/DataView.js +18 -17
  13. package/dist/components/Common/DataView/DataView.js.map +1 -1
  14. package/dist/components/Company/AssignSignatory/CreateSignatory/useCreateSignatory.js +3 -6
  15. package/dist/components/Company/AssignSignatory/CreateSignatory/useCreateSignatory.js.map +1 -1
  16. package/dist/components/Company/AssignSignatory/InviteSignatory/useInviteSignatory.js +3 -6
  17. package/dist/components/Company/AssignSignatory/InviteSignatory/useInviteSignatory.js.map +1 -1
  18. package/dist/components/Company/AssignSignatory/useAssignSignatory.js +5 -8
  19. package/dist/components/Company/AssignSignatory/useAssignSignatory.js.map +1 -1
  20. package/dist/components/Company/BankAccount/BankAccountForm/context.js +3 -6
  21. package/dist/components/Company/BankAccount/BankAccountForm/context.js.map +1 -1
  22. package/dist/components/Company/DocumentSigner/DocumentList/useDocumentList.js +3 -6
  23. package/dist/components/Company/DocumentSigner/DocumentList/useDocumentList.js.map +1 -1
  24. package/dist/components/Company/FederalTaxes/useFederalTaxes.js +8 -11
  25. package/dist/components/Company/FederalTaxes/useFederalTaxes.js.map +1 -1
  26. package/dist/components/Company/Industry/Context.js +6 -9
  27. package/dist/components/Company/Industry/Context.js.map +1 -1
  28. package/dist/components/Company/Locations/LocationForm/useLocationForm.js +3 -6
  29. package/dist/components/Company/Locations/LocationForm/useLocationForm.js.map +1 -1
  30. package/dist/components/Company/Locations/LocationsList/List.js +27 -25
  31. package/dist/components/Company/Locations/LocationsList/List.js.map +1 -1
  32. package/dist/components/Company/Locations/LocationsList/LocationsList.js +41 -36
  33. package/dist/components/Company/Locations/LocationsList/LocationsList.js.map +1 -1
  34. package/dist/components/Company/Locations/LocationsList/useLocationsList.d.ts +1 -0
  35. package/dist/components/Company/Locations/LocationsList/useLocationsList.js +3 -6
  36. package/dist/components/Company/Locations/LocationsList/useLocationsList.js.map +1 -1
  37. package/dist/components/Company/OnboardingOverview/context.js +3 -6
  38. package/dist/components/Company/OnboardingOverview/context.js.map +1 -1
  39. package/dist/components/Company/StateTaxes/StateTaxesForm/Form.d.ts +9 -2
  40. package/dist/components/Company/StateTaxes/StateTaxesForm/Form.js +19 -18
  41. package/dist/components/Company/StateTaxes/StateTaxesForm/Form.js.map +1 -1
  42. package/dist/components/Company/StateTaxes/StateTaxesForm/StateTaxesForm.js +63 -62
  43. package/dist/components/Company/StateTaxes/StateTaxesForm/StateTaxesForm.js.map +1 -1
  44. package/dist/components/Company/StateTaxes/StateTaxesForm/context.js +3 -6
  45. package/dist/components/Company/StateTaxes/StateTaxesForm/context.js.map +1 -1
  46. package/dist/components/Company/StateTaxes/StateTaxesList/context.js +3 -6
  47. package/dist/components/Company/StateTaxes/StateTaxesList/context.js.map +1 -1
  48. package/dist/components/Company/StateTaxes/TaxRateManagement/AddTaxRateDialog.js +69 -65
  49. package/dist/components/Company/StateTaxes/TaxRateManagement/AddTaxRateDialog.js.map +1 -1
  50. package/dist/components/Company/StateTaxes/TaxRateManagement/context.js +3 -6
  51. package/dist/components/Company/StateTaxes/TaxRateManagement/context.js.map +1 -1
  52. package/dist/components/Company/StateTaxes/TaxRateManagement/toHistoryRows.js +30 -23
  53. package/dist/components/Company/StateTaxes/TaxRateManagement/toHistoryRows.js.map +1 -1
  54. package/dist/components/Company/StateTaxes/shared/RequirementFields.d.ts +8 -4
  55. package/dist/components/Company/StateTaxes/shared/RequirementFields.js +13 -12
  56. package/dist/components/Company/StateTaxes/shared/RequirementFields.js.map +1 -1
  57. package/dist/components/Company/StateTaxes/shared/prepareRequirements.d.ts +29 -0
  58. package/dist/components/Company/StateTaxes/shared/prepareRequirements.js +24 -0
  59. package/dist/components/Company/StateTaxes/shared/prepareRequirements.js.map +1 -0
  60. package/dist/components/Company/StateTaxes/shared/prepareRequirements.test.d.ts +1 -0
  61. package/dist/components/Contractor/Payments/PaymentsList/PaymentsList.js +68 -55
  62. package/dist/components/Contractor/Payments/PaymentsList/PaymentsList.js.map +1 -1
  63. package/dist/components/Contractor/Payments/PaymentsList/PaymentsListPresentation.js +36 -35
  64. package/dist/components/Contractor/Payments/PaymentsList/PaymentsListPresentation.js.map +1 -1
  65. package/dist/components/Employee/Documents/onboarding/DocumentSigner/DocumentList/useDocumentList.js +3 -6
  66. package/dist/components/Employee/Documents/onboarding/DocumentSigner/DocumentList/useDocumentList.js.map +1 -1
  67. package/dist/components/Employee/Paystubs/management/PaystubsCard/PaystubsCard.js +84 -96
  68. package/dist/components/Employee/Paystubs/management/PaystubsCard/PaystubsCard.js.map +1 -1
  69. package/dist/components/Flow/Flow.js +22 -22
  70. package/dist/components/Flow/Flow.js.map +1 -1
  71. package/dist/components/Flow/useFlow.js +3 -3
  72. package/dist/components/InformationRequests/InformationRequests.d.ts +1 -1
  73. package/dist/components/InformationRequests/InformationRequests.js +68 -53
  74. package/dist/components/InformationRequests/InformationRequests.js.map +1 -1
  75. package/dist/components/Payroll/GrossUpModal/GrossUpModal.js +2 -3
  76. package/dist/components/Payroll/GrossUpModal/GrossUpModal.js.map +1 -1
  77. package/dist/components/Payroll/OffCycleCreation/OffCycleCreation.js +52 -50
  78. package/dist/components/Payroll/OffCycleCreation/OffCycleCreation.js.map +1 -1
  79. package/dist/components/Payroll/OffCycleCreation/OffCycleCreationPresentation.d.ts +1 -1
  80. package/dist/components/Payroll/OffCycleCreation/OffCycleCreationPresentation.js +86 -67
  81. package/dist/components/Payroll/OffCycleCreation/OffCycleCreationPresentation.js.map +1 -1
  82. package/dist/components/Payroll/OffCycleCreation/OffCycleCreationTypes.d.ts +4 -0
  83. package/dist/components/Payroll/OffCycleDeductionsSetting/OffCycleDeductionsSetting.d.ts +1 -1
  84. package/dist/components/Payroll/OffCycleDeductionsSetting/OffCycleDeductionsSetting.js +26 -21
  85. package/dist/components/Payroll/OffCycleDeductionsSetting/OffCycleDeductionsSetting.js.map +1 -1
  86. package/dist/components/Payroll/OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation.d.ts +8 -1
  87. package/dist/components/Payroll/OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation.js +29 -17
  88. package/dist/components/Payroll/OffCyclePayPeriodDateForm/OffCyclePayPeriodDateFormPresentation.js.map +1 -1
  89. package/dist/components/Payroll/OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTable.js +21 -18
  90. package/dist/components/Payroll/OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTable.js.map +1 -1
  91. package/dist/components/Payroll/OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTable.module.scss.js +9 -7
  92. package/dist/components/Payroll/OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTable.module.scss.js.map +1 -1
  93. package/dist/components/Payroll/OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes.d.ts +2 -0
  94. package/dist/components/Payroll/OffCycleTaxWithholdingTable/OffCycleTaxWithholdingTableTypes.js.map +1 -1
  95. package/dist/components/Payroll/PayrollConfiguration/PayrollConfiguration.js +193 -191
  96. package/dist/components/Payroll/PayrollConfiguration/PayrollConfiguration.js.map +1 -1
  97. package/dist/components/Payroll/PayrollConfiguration/usePayrollConfigurationData.d.ts +3 -2
  98. package/dist/components/Payroll/PayrollConfiguration/usePayrollConfigurationData.js +31 -31
  99. package/dist/components/Payroll/PayrollConfiguration/usePayrollConfigurationData.js.map +1 -1
  100. package/dist/components/Payroll/PayrollEditEmployee/PayrollEditEmployeePresentation.js +254 -243
  101. package/dist/components/Payroll/PayrollEditEmployee/PayrollEditEmployeePresentation.js.map +1 -1
  102. package/dist/components/Payroll/PayrollHistory/PayrollHistory.js +83 -76
  103. package/dist/components/Payroll/PayrollHistory/PayrollHistory.js.map +1 -1
  104. package/dist/components/Payroll/PayrollHistory/PayrollHistoryPresentation.js +23 -22
  105. package/dist/components/Payroll/PayrollHistory/PayrollHistoryPresentation.js.map +1 -1
  106. package/dist/components/Payroll/PayrollList/PayrollList.js +108 -97
  107. package/dist/components/Payroll/PayrollList/PayrollList.js.map +1 -1
  108. package/dist/components/Payroll/PayrollList/PayrollListPresentation.js +38 -37
  109. package/dist/components/Payroll/PayrollList/PayrollListPresentation.js.map +1 -1
  110. package/dist/components/Payroll/PayrollOverview/PayrollOverview.js +176 -167
  111. package/dist/components/Payroll/PayrollOverview/PayrollOverview.js.map +1 -1
  112. package/dist/components/Payroll/PayrollOverview/PayrollOverviewPresentation.d.ts +2 -1
  113. package/dist/components/Payroll/PayrollOverview/PayrollOverviewPresentation.js +173 -164
  114. package/dist/components/Payroll/PayrollOverview/PayrollOverviewPresentation.js.map +1 -1
  115. package/dist/components/Payroll/usePreparedPayrollData.js +12 -15
  116. package/dist/components/Payroll/usePreparedPayrollData.js.map +1 -1
  117. package/dist/helpers/openPdfInNewTab.d.ts +15 -0
  118. package/dist/helpers/openPdfInNewTab.js +28 -0
  119. package/dist/helpers/openPdfInNewTab.js.map +1 -0
  120. package/dist/i18n/en/Company.StateTaxes.json.js +1 -1
  121. package/dist/i18n/en/Payroll.OffCycleCreation.json.js +11 -9
  122. package/dist/i18n/en/Payroll.OffCycleCreation.json.js.map +1 -1
  123. package/dist/i18n/en/Payroll.OffCycleTaxWithholding.json.js +7 -7
  124. package/dist/i18n/en/Payroll.PayrollEditEmployee.json.js +29 -27
  125. package/dist/i18n/en/Payroll.PayrollEditEmployee.json.js.map +1 -1
  126. package/dist/i18n/en/Payroll.PayrollOverview.json.js +43 -41
  127. package/dist/i18n/en/Payroll.PayrollOverview.json.js.map +1 -1
  128. package/dist/i18n/types.d.ts +20 -0
  129. package/dist/style.css +1 -1
  130. package/package.json +17 -17
@@ -1,156 +1,144 @@
1
- import { jsx as r } from "react/jsx-runtime";
2
- import { useState as R, useCallback as _ } from "react";
3
- import { useTranslation as C } from "react-i18next";
4
- import { useErrorBoundary as O } from "react-error-boundary";
1
+ import { jsx as o } from "react/jsx-runtime";
2
+ import { useState as L, useCallback as k } from "react";
3
+ import { useTranslation as D } from "react-i18next";
4
+ import { useErrorBoundary as _ } from "react-error-boundary";
5
5
  import { Loading as T } from "../../../../Common/Loading/Loading.js";
6
- import { EmptyData as D } from "../../../../Common/EmptyData/EmptyData.js";
7
- import { BaseBoundaries as v, BaseLayout as x } from "../../../../Base/Base.js";
8
- import { useComponentContext as L } from "../../../../../contexts/ComponentAdapter/useComponentContext.js";
9
- import { composeErrorHandler as j } from "../../../../../partner-hook-utils/composeErrorHandler.js";
10
- import { usePaymentMethodList as W } from "../../../PaymentMethod/shared/usePaymentMethodList.js";
11
- import { formatDateLongWithYear as Y } from "../../../../../helpers/dateFormatting.js";
12
- import H from "../../../../../hooks/useNumberFormatter.js";
6
+ import { EmptyData as E } from "../../../../Common/EmptyData/EmptyData.js";
7
+ import { BaseBoundaries as O, BaseLayout as M } from "../../../../Base/Base.js";
8
+ import { useComponentContext as S } from "../../../../../contexts/ComponentAdapter/useComponentContext.js";
9
+ import { openPdfInNewTab as U } from "../../../../../helpers/openPdfInNewTab.js";
10
+ import { composeErrorHandler as Y } from "../../../../../partner-hook-utils/composeErrorHandler.js";
11
+ import { usePaymentMethodList as H } from "../../../PaymentMethod/shared/usePaymentMethodList.js";
12
+ import { formatDateLongWithYear as R } from "../../../../../helpers/dateFormatting.js";
13
+ import W from "../../../../../hooks/useNumberFormatter.js";
13
14
  import { useI18n as F } from "../../../../../i18n/I18n.js";
14
- import { componentEvents as M } from "../../../../../shared/constants.js";
15
+ import { componentEvents as w } from "../../../../../shared/constants.js";
15
16
  import V from "../../../../../assets/icons/download-cloud.svg.js";
16
- import { usePaystubsList as G } from "../../shared/usePaystubsList/usePaystubsList.js";
17
- import { useNonce as Q } from "../../../../../contexts/NonceProvider/useNonce.js";
18
- import { useDataView as q } from "../../../../Common/DataView/useDataView.js";
19
- import { DataView as z } from "../../../../Common/DataView/DataView.js";
20
- function ft({ LoaderComponent: i, ...s }) {
21
- return /* @__PURE__ */ r(v, { componentName: "Employee.Management.Paystubs", LoaderComponent: i, children: /* @__PURE__ */ r(J, { LoaderComponent: i, ...s }) });
17
+ import { usePaystubsList as v } from "../../shared/usePaystubsList/usePaystubsList.js";
18
+ import { useNonce as G } from "../../../../../contexts/NonceProvider/useNonce.js";
19
+ import { useDataView as j } from "../../../../Common/DataView/useDataView.js";
20
+ import { DataView as Q } from "../../../../Common/DataView/DataView.js";
21
+ function pt({ LoaderComponent: a, ...i }) {
22
+ return /* @__PURE__ */ o(O, { componentName: "Employee.Management.Paystubs", LoaderComponent: a, children: /* @__PURE__ */ o(q, { LoaderComponent: a, ...i }) });
22
23
  }
23
- function J({ employeeId: i, onEvent: s, LoaderComponent: c }) {
24
+ function q({ employeeId: a, onEvent: i, LoaderComponent: s }) {
24
25
  F("Employee.Management.Paystubs");
25
- const { t: m } = C("Employee.Management.Paystubs"), u = L(), l = G({ employeeId: i }), n = W({ employeeId: i }), d = j([l, n]);
26
- return l.isLoading ? /* @__PURE__ */ r(x, { error: d.errors, LoaderComponent: c, children: /* @__PURE__ */ r(u.Box, { header: /* @__PURE__ */ r(u.BoxHeader, { title: m("title") }), children: /* @__PURE__ */ r(T, {}) }) }) : /* @__PURE__ */ r(
27
- K,
26
+ const { t: l } = D("Employee.Management.Paystubs"), u = S(), d = v({ employeeId: a }), e = H({ employeeId: a }), m = Y([d, e]);
27
+ return d.isLoading ? /* @__PURE__ */ o(M, { error: m.errors, LoaderComponent: s, children: /* @__PURE__ */ o(u.Box, { header: /* @__PURE__ */ o(u.BoxHeader, { title: l("title") }), children: /* @__PURE__ */ o(T, {}) }) }) : /* @__PURE__ */ o(
28
+ z,
28
29
  {
29
- employeeId: i,
30
- onEvent: s,
31
- paystubsList: l,
32
- paymentMethodList: n,
33
- errorHandling: d,
34
- LoaderComponent: c
30
+ employeeId: a,
31
+ onEvent: i,
32
+ paystubsList: d,
33
+ paymentMethodList: e,
34
+ errorHandling: m,
35
+ LoaderComponent: s
35
36
  }
36
37
  );
37
38
  }
38
- function K({
39
- employeeId: i,
40
- onEvent: s,
41
- paystubsList: c,
42
- paymentMethodList: m,
39
+ function z({
40
+ employeeId: a,
41
+ onEvent: i,
42
+ paystubsList: s,
43
+ paymentMethodList: l,
43
44
  errorHandling: u,
44
- LoaderComponent: l
45
+ LoaderComponent: d
45
46
  }) {
46
- const { t: n } = C("Employee.Management.Paystubs"), d = L(), f = H("currency"), { showBoundary: h } = O(), p = Q(), [S, g] = R(
47
+ const { t: e } = D("Employee.Management.Paystubs"), m = S(), y = W("currency"), { showBoundary: p } = _(), f = G(), [b, g] = L(
47
48
  () => /* @__PURE__ */ new Set()
48
- ), { payStubs: E } = c.data, N = c.pagination.payStubs, k = m.isLoading ? void 0 : m.data.paymentMethod, A = _(
49
+ ), { payStubs: h } = s.data, C = s.pagination.payStubs, N = l.isLoading ? void 0 : l.data.paymentMethod, B = k(
49
50
  async (t) => {
50
- s(M.EMPLOYEE_MANAGEMENT_PAYSTUBS_CARD_DOWNLOAD_REQUESTED, {
51
- employeeId: i,
51
+ i(w.EMPLOYEE_MANAGEMENT_PAYSTUBS_CARD_DOWNLOAD_REQUESTED, {
52
+ employeeId: a,
52
53
  payrollUuid: t
53
54
  });
54
- const o = window.open("", "_blank"), b = n("downloadLoadingMessage");
55
- if (o) {
56
- const e = o.document;
57
- e.title = b;
58
- const a = e.createElement("style");
59
- p && (a.nonce = p), a.textContent = "body{font-family:system-ui,-apple-system,sans-serif;display:flex;align-items:center;justify-content:center;height:100vh;margin:0;color:#444;gap:12px}.spinner{width:20px;height:20px;border:2px solid #ccc;border-top-color:#444;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}", e.head.appendChild(a);
60
- const y = e.createElement("div");
61
- y.className = "spinner", y.setAttribute("aria-hidden", "true");
62
- const w = e.createElement("span");
63
- w.textContent = b, e.body.replaceChildren(y, w);
64
- }
65
- g((e) => {
66
- const a = new Set(e);
67
- return a.add(t), a;
55
+ const r = U({ loadingMessage: e("downloadLoadingMessage"), nonce: f });
56
+ g((n) => {
57
+ const c = new Set(n);
58
+ return c.add(t), c;
68
59
  });
69
60
  try {
70
- const e = await c.actions.downloadPayStub(t);
71
- if (!e) {
72
- o && o.close();
61
+ const n = await s.actions.downloadPayStub(t);
62
+ if (!n) {
63
+ r.close();
73
64
  return;
74
65
  }
75
- const a = URL.createObjectURL(e.data);
76
- o ? (o.addEventListener("load", () => {
77
- URL.revokeObjectURL(a);
78
- }), o.location.href = a) : URL.revokeObjectURL(a), s(M.EMPLOYEE_MANAGEMENT_PAYSTUBS_CARD_DOWNLOADED, {
79
- employeeId: i,
66
+ r.navigate(n.data), i(w.EMPLOYEE_MANAGEMENT_PAYSTUBS_CARD_DOWNLOADED, {
67
+ employeeId: a,
80
68
  payrollUuid: t
81
69
  });
82
- } catch (e) {
83
- o && o.close(), h(e instanceof Error ? e : new Error(String(e)));
70
+ } catch (n) {
71
+ r.close(), p(n instanceof Error ? n : new Error(String(n)));
84
72
  } finally {
85
- g((e) => {
86
- if (!e.has(t)) return e;
87
- const a = new Set(e);
88
- return a.delete(t), a;
73
+ g((n) => {
74
+ if (!n.has(t)) return n;
75
+ const c = new Set(n);
76
+ return c.delete(t), c;
89
77
  });
90
78
  }
91
79
  },
92
- [c.actions, s, i, n, h, p]
93
- ), B = [
80
+ [s.actions, i, a, e, p, f]
81
+ ), A = [
94
82
  {
95
83
  key: "payday",
96
- title: n("payday"),
97
- render: (t) => Y(t.checkDate) || "-"
84
+ title: e("payday"),
85
+ render: (t) => R(t.checkDate) || "-"
98
86
  },
99
87
  {
100
88
  key: "checkAmount",
101
- title: n("checkAmount"),
89
+ title: e("checkAmount"),
102
90
  render: (t) => {
103
91
  if (!t.netPay) return "-";
104
- const o = parseFloat(t.netPay);
105
- return isNaN(o) ? "-" : f(o);
92
+ const r = parseFloat(t.netPay);
93
+ return isNaN(r) ? "-" : y(r);
106
94
  }
107
95
  },
108
96
  {
109
97
  key: "grossPay",
110
- title: n("grossPay"),
98
+ title: e("grossPay"),
111
99
  render: (t) => {
112
100
  if (!t.grossPay) return "-";
113
- const o = parseFloat(t.grossPay);
114
- return isNaN(o) ? "-" : f(o);
101
+ const r = parseFloat(t.grossPay);
102
+ return isNaN(r) ? "-" : y(r);
115
103
  }
116
104
  },
117
105
  {
118
106
  key: "paymentMethod",
119
- title: n("paymentMethod"),
120
- render: () => k?.type || n("noPaymentMethod")
107
+ title: e("paymentMethod"),
108
+ render: () => N?.type || e("noPaymentMethod")
121
109
  }
122
- ], U = q({
123
- data: E,
124
- columns: B,
125
- pagination: N,
110
+ ], x = j({
111
+ data: h,
112
+ columns: A,
113
+ pagination: C,
126
114
  itemMenu: (t) => {
127
- const o = !!t.payrollUuid && S.has(t.payrollUuid);
128
- return /* @__PURE__ */ r(
129
- d.ButtonIcon,
115
+ const r = !!t.payrollUuid && b.has(t.payrollUuid);
116
+ return /* @__PURE__ */ o(
117
+ m.ButtonIcon,
130
118
  {
131
119
  variant: "tertiary",
132
- "aria-label": n("downloadCta"),
120
+ "aria-label": e("downloadCta"),
133
121
  isDisabled: !t.payrollUuid,
134
- isLoading: o,
122
+ isLoading: r,
135
123
  onClick: () => {
136
- t.payrollUuid && A(t.payrollUuid);
124
+ t.payrollUuid && B(t.payrollUuid);
137
125
  },
138
- children: /* @__PURE__ */ r(V, { "aria-hidden": !0 })
126
+ children: /* @__PURE__ */ o(V, { "aria-hidden": !0 })
139
127
  }
140
128
  );
141
129
  },
142
- emptyState: () => /* @__PURE__ */ r(D, { title: n("emptyState.title"), description: n("emptyState.description") })
143
- }), P = E.length > 0;
144
- return /* @__PURE__ */ r(x, { error: u.errors, LoaderComponent: l, children: /* @__PURE__ */ r(
145
- d.Box,
130
+ emptyState: () => /* @__PURE__ */ o(E, { title: e("emptyState.title"), description: e("emptyState.description") })
131
+ }), P = h.length > 0;
132
+ return /* @__PURE__ */ o(M, { error: u.errors, LoaderComponent: d, children: /* @__PURE__ */ o(
133
+ m.Box,
146
134
  {
147
135
  withPadding: !P,
148
- header: /* @__PURE__ */ r(d.BoxHeader, { title: n("title") }),
149
- children: P ? /* @__PURE__ */ r(z, { label: n("listLabel"), isWithinBox: !0, ...U }) : /* @__PURE__ */ r(D, { title: n("emptyState.title"), description: n("emptyState.description") })
136
+ header: /* @__PURE__ */ o(m.BoxHeader, { title: e("title") }),
137
+ children: P ? /* @__PURE__ */ o(Q, { label: e("listLabel"), isWithinBox: !0, ...x }) : /* @__PURE__ */ o(E, { title: e("emptyState.title"), description: e("emptyState.description") })
150
138
  }
151
139
  ) });
152
140
  }
153
141
  export {
154
- ft as PaystubsCard
142
+ pt as PaystubsCard
155
143
  };
156
144
  //# sourceMappingURL=PaystubsCard.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"PaystubsCard.js","sources":["../../../../../../src/components/Employee/Paystubs/management/PaystubsCard/PaystubsCard.tsx"],"sourcesContent":["import { useCallback, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useErrorBoundary } from 'react-error-boundary'\nimport {\n usePaystubsList,\n type EmployeePayStub,\n type UsePaystubsListReady,\n} from '../../shared/usePaystubsList'\nimport { DataView, EmptyData, useDataView, Loading } from '@/components/Common'\nimport { BaseBoundaries, BaseLayout } from '@/components/Base/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useNonce } from '@/contexts/NonceProvider'\nimport { composeErrorHandler } from '@/partner-hook-utils/composeErrorHandler'\nimport {\n usePaymentMethodList,\n type UsePaymentMethodListResult,\n} from '@/components/Employee/PaymentMethod/shared'\nimport { formatDateLongWithYear } from '@/helpers/dateFormatting'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { useI18n } from '@/i18n'\nimport { componentEvents, type EventType } from '@/shared/constants'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport type { LoaderComponentType } from '@/components/Base'\nimport DownloadCloudIcon from '@/assets/icons/download-cloud.svg?react'\n\n/**\n * Props for {@link PaystubsCard}.\n *\n * @public\n */\nexport interface PaystubsCardProps {\n /** The associated employee identifier. */\n employeeId: string\n /** Event handler fired when paystub interactions occur. */\n onEvent: OnEventType<EventType, unknown>\n /** Custom loading indicator rendered while this component's async data is fetching. Overrides the indicator configured on `GustoProvider` for this instance only. */\n LoaderComponent?: LoaderComponentType\n}\n\n/**\n * Standalone \"Paystubs\" card. Owns its own data fetch via\n * {@link usePaystubsList} and renders the paginated paystubs table with a\n * per-row PDF download action. Emits the management block's scoped events\n * (`EMPLOYEE_MANAGEMENT_PAYSTUBS_CARD_*`) on download request and on\n * download success. The card has no edit transitions and no alert API —\n * paystubs is a read-only surface whose only action is a download side\n * effect that opens the PDF in a new tab.\n *\n * @public\n */\nexport function PaystubsCard({ LoaderComponent, ...props }: PaystubsCardProps) {\n return (\n <BaseBoundaries componentName=\"Employee.Management.Paystubs\" LoaderComponent={LoaderComponent}>\n <PaystubsCardContent LoaderComponent={LoaderComponent} {...props} />\n </BaseBoundaries>\n )\n}\n\nfunction PaystubsCardContent({ employeeId, onEvent, LoaderComponent }: PaystubsCardProps) {\n useI18n('Employee.Management.Paystubs')\n const { t } = useTranslation('Employee.Management.Paystubs')\n const Components = useComponentContext()\n const paystubsList = usePaystubsList({ employeeId })\n const paymentMethodList = usePaymentMethodList({ employeeId })\n\n const errorHandling = composeErrorHandler([paystubsList, paymentMethodList])\n\n if (paystubsList.isLoading) {\n return (\n <BaseLayout error={errorHandling.errors} LoaderComponent={LoaderComponent}>\n <Components.Box header={<Components.BoxHeader title={t('title')} />}>\n <Loading />\n </Components.Box>\n </BaseLayout>\n )\n }\n\n return (\n <PaystubsCardReady\n employeeId={employeeId}\n onEvent={onEvent}\n paystubsList={paystubsList}\n paymentMethodList={paymentMethodList}\n errorHandling={errorHandling}\n LoaderComponent={LoaderComponent}\n />\n )\n}\n\ninterface PaystubsCardReadyProps extends PaystubsCardProps {\n paystubsList: UsePaystubsListReady\n paymentMethodList: UsePaymentMethodListResult\n errorHandling: ReturnType<typeof composeErrorHandler>\n}\n\nfunction PaystubsCardReady({\n employeeId,\n onEvent,\n paystubsList,\n paymentMethodList,\n errorHandling,\n LoaderComponent,\n}: PaystubsCardReadyProps) {\n const { t } = useTranslation('Employee.Management.Paystubs')\n const Components = useComponentContext()\n const formatCurrency = useNumberFormatter('currency')\n const { showBoundary } = useErrorBoundary()\n const nonce = useNonce()\n\n const [downloadingPayrollUuids, setDownloadingPayrollUuids] = useState<ReadonlySet<string>>(\n () => new Set(),\n )\n\n const { payStubs } = paystubsList.data\n const payStubsPagination = paystubsList.pagination.payStubs\n const paymentMethod = paymentMethodList.isLoading\n ? undefined\n : paymentMethodList.data.paymentMethod\n\n const handleDownload = useCallback(\n async (payrollUuid: string) => {\n onEvent(componentEvents.EMPLOYEE_MANAGEMENT_PAYSTUBS_CARD_DOWNLOAD_REQUESTED, {\n employeeId,\n payrollUuid,\n })\n\n // Omit `noopener` — it makes window.open return null in modern browsers,\n // which would leave us unable to navigate the new tab to the blob URL.\n const newWindow = window.open('', '_blank')\n const loadingMessage = t('downloadLoadingMessage')\n if (newWindow) {\n // Avoid the user staring at about:blank while we fetch the PDF. The\n // navigation to the Blob URL below replaces this document.\n const doc = newWindow.document\n doc.title = loadingMessage\n const style = doc.createElement('style')\n if (nonce) style.nonce = nonce\n style.textContent =\n 'body{font-family:system-ui,-apple-system,sans-serif;display:flex;align-items:center;' +\n 'justify-content:center;height:100vh;margin:0;color:#444;gap:12px}' +\n '.spinner{width:20px;height:20px;border:2px solid #ccc;border-top-color:#444;' +\n 'border-radius:50%;animation:spin .8s linear infinite}' +\n '@keyframes spin{to{transform:rotate(360deg)}}'\n doc.head.appendChild(style)\n const spinner = doc.createElement('div')\n spinner.className = 'spinner'\n spinner.setAttribute('aria-hidden', 'true')\n const label = doc.createElement('span')\n label.textContent = loadingMessage\n doc.body.replaceChildren(spinner, label)\n }\n setDownloadingPayrollUuids(prev => {\n const next = new Set(prev)\n next.add(payrollUuid)\n return next\n })\n try {\n const result = await paystubsList.actions.downloadPayStub(payrollUuid)\n if (!result) {\n if (newWindow) newWindow.close()\n return\n }\n const url = URL.createObjectURL(result.data)\n if (newWindow) {\n // Revoke after the new tab has loaded the blob; revoking synchronously\n // would race the navigation and leave the tab blank.\n newWindow.addEventListener('load', () => {\n URL.revokeObjectURL(url)\n })\n newWindow.location.href = url\n } else {\n URL.revokeObjectURL(url)\n }\n onEvent(componentEvents.EMPLOYEE_MANAGEMENT_PAYSTUBS_CARD_DOWNLOADED, {\n employeeId,\n payrollUuid,\n })\n } catch (err) {\n if (newWindow) newWindow.close()\n showBoundary(err instanceof Error ? err : new Error(String(err)))\n } finally {\n setDownloadingPayrollUuids(prev => {\n if (!prev.has(payrollUuid)) return prev\n const next = new Set(prev)\n next.delete(payrollUuid)\n return next\n })\n }\n },\n [paystubsList.actions, onEvent, employeeId, t, showBoundary, nonce],\n )\n\n const payStubsColumns = [\n {\n key: 'payday',\n title: t('payday'),\n render: (payStub: EmployeePayStub) => formatDateLongWithYear(payStub.checkDate) || '-',\n },\n {\n key: 'checkAmount',\n title: t('checkAmount'),\n render: (payStub: EmployeePayStub) => {\n if (!payStub.netPay) return '-'\n const amount = parseFloat(payStub.netPay)\n return isNaN(amount) ? '-' : formatCurrency(amount)\n },\n },\n {\n key: 'grossPay',\n title: t('grossPay'),\n render: (payStub: EmployeePayStub) => {\n if (!payStub.grossPay) return '-'\n const amount = parseFloat(payStub.grossPay)\n return isNaN(amount) ? '-' : formatCurrency(amount)\n },\n },\n {\n key: 'paymentMethod',\n title: t('paymentMethod'),\n render: () => paymentMethod?.type || t('noPaymentMethod'),\n },\n ]\n\n const payStubsDataView = useDataView({\n data: payStubs,\n columns: payStubsColumns,\n pagination: payStubsPagination,\n itemMenu: payStub => {\n const isDownloading =\n !!payStub.payrollUuid && downloadingPayrollUuids.has(payStub.payrollUuid)\n return (\n <Components.ButtonIcon\n variant=\"tertiary\"\n aria-label={t('downloadCta')}\n isDisabled={!payStub.payrollUuid}\n isLoading={isDownloading}\n onClick={() => {\n if (payStub.payrollUuid) {\n void handleDownload(payStub.payrollUuid)\n }\n }}\n >\n <DownloadCloudIcon aria-hidden />\n </Components.ButtonIcon>\n )\n },\n emptyState: () => (\n <EmptyData title={t('emptyState.title')} description={t('emptyState.description')} />\n ),\n })\n\n const isShowingTable = payStubs.length > 0\n\n return (\n <BaseLayout error={errorHandling.errors} LoaderComponent={LoaderComponent}>\n <Components.Box\n withPadding={!isShowingTable}\n header={<Components.BoxHeader title={t('title')} />}\n >\n {isShowingTable ? (\n <DataView label={t('listLabel')} isWithinBox {...payStubsDataView} />\n ) : (\n <EmptyData title={t('emptyState.title')} description={t('emptyState.description')} />\n )}\n </Components.Box>\n </BaseLayout>\n )\n}\n"],"names":["PaystubsCard","LoaderComponent","props","jsx","BaseBoundaries","PaystubsCardContent","employeeId","onEvent","useI18n","t","useTranslation","Components","useComponentContext","paystubsList","usePaystubsList","paymentMethodList","usePaymentMethodList","errorHandling","composeErrorHandler","BaseLayout","Loading","PaystubsCardReady","formatCurrency","useNumberFormatter","showBoundary","useErrorBoundary","nonce","useNonce","downloadingPayrollUuids","setDownloadingPayrollUuids","useState","payStubs","payStubsPagination","paymentMethod","handleDownload","useCallback","payrollUuid","componentEvents","newWindow","loadingMessage","doc","style","spinner","label","prev","next","result","url","err","payStubsColumns","payStub","formatDateLongWithYear","amount","payStubsDataView","useDataView","isDownloading","DownloadCloudIcon","EmptyData","isShowingTable","DataView"],"mappings":"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"}
1
+ {"version":3,"file":"PaystubsCard.js","sources":["../../../../../../src/components/Employee/Paystubs/management/PaystubsCard/PaystubsCard.tsx"],"sourcesContent":["import { useCallback, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useErrorBoundary } from 'react-error-boundary'\nimport {\n usePaystubsList,\n type EmployeePayStub,\n type UsePaystubsListReady,\n} from '../../shared/usePaystubsList'\nimport { DataView, EmptyData, useDataView, Loading } from '@/components/Common'\nimport { BaseBoundaries, BaseLayout } from '@/components/Base/Base'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useNonce } from '@/contexts/NonceProvider'\nimport { openPdfInNewTab } from '@/helpers/openPdfInNewTab'\nimport { composeErrorHandler } from '@/partner-hook-utils/composeErrorHandler'\nimport {\n usePaymentMethodList,\n type UsePaymentMethodListResult,\n} from '@/components/Employee/PaymentMethod/shared'\nimport { formatDateLongWithYear } from '@/helpers/dateFormatting'\nimport useNumberFormatter from '@/hooks/useNumberFormatter'\nimport { useI18n } from '@/i18n'\nimport { componentEvents, type EventType } from '@/shared/constants'\nimport type { OnEventType } from '@/components/Base/useBase'\nimport type { LoaderComponentType } from '@/components/Base'\nimport DownloadCloudIcon from '@/assets/icons/download-cloud.svg?react'\n\n/**\n * Props for {@link PaystubsCard}.\n *\n * @public\n */\nexport interface PaystubsCardProps {\n /** The associated employee identifier. */\n employeeId: string\n /** Event handler fired when paystub interactions occur. */\n onEvent: OnEventType<EventType, unknown>\n /** Custom loading indicator rendered while this component's async data is fetching. Overrides the indicator configured on `GustoProvider` for this instance only. */\n LoaderComponent?: LoaderComponentType\n}\n\n/**\n * Standalone \"Paystubs\" card. Owns its own data fetch via\n * {@link usePaystubsList} and renders the paginated paystubs table with a\n * per-row PDF download action. Emits the management block's scoped events\n * (`EMPLOYEE_MANAGEMENT_PAYSTUBS_CARD_*`) on download request and on\n * download success. The card has no edit transitions and no alert API —\n * paystubs is a read-only surface whose only action is a download side\n * effect that opens the PDF in a new tab.\n *\n * @public\n */\nexport function PaystubsCard({ LoaderComponent, ...props }: PaystubsCardProps) {\n return (\n <BaseBoundaries componentName=\"Employee.Management.Paystubs\" LoaderComponent={LoaderComponent}>\n <PaystubsCardContent LoaderComponent={LoaderComponent} {...props} />\n </BaseBoundaries>\n )\n}\n\nfunction PaystubsCardContent({ employeeId, onEvent, LoaderComponent }: PaystubsCardProps) {\n useI18n('Employee.Management.Paystubs')\n const { t } = useTranslation('Employee.Management.Paystubs')\n const Components = useComponentContext()\n const paystubsList = usePaystubsList({ employeeId })\n const paymentMethodList = usePaymentMethodList({ employeeId })\n\n const errorHandling = composeErrorHandler([paystubsList, paymentMethodList])\n\n if (paystubsList.isLoading) {\n return (\n <BaseLayout error={errorHandling.errors} LoaderComponent={LoaderComponent}>\n <Components.Box header={<Components.BoxHeader title={t('title')} />}>\n <Loading />\n </Components.Box>\n </BaseLayout>\n )\n }\n\n return (\n <PaystubsCardReady\n employeeId={employeeId}\n onEvent={onEvent}\n paystubsList={paystubsList}\n paymentMethodList={paymentMethodList}\n errorHandling={errorHandling}\n LoaderComponent={LoaderComponent}\n />\n )\n}\n\ninterface PaystubsCardReadyProps extends PaystubsCardProps {\n paystubsList: UsePaystubsListReady\n paymentMethodList: UsePaymentMethodListResult\n errorHandling: ReturnType<typeof composeErrorHandler>\n}\n\nfunction PaystubsCardReady({\n employeeId,\n onEvent,\n paystubsList,\n paymentMethodList,\n errorHandling,\n LoaderComponent,\n}: PaystubsCardReadyProps) {\n const { t } = useTranslation('Employee.Management.Paystubs')\n const Components = useComponentContext()\n const formatCurrency = useNumberFormatter('currency')\n const { showBoundary } = useErrorBoundary()\n const nonce = useNonce()\n\n const [downloadingPayrollUuids, setDownloadingPayrollUuids] = useState<ReadonlySet<string>>(\n () => new Set(),\n )\n\n const { payStubs } = paystubsList.data\n const payStubsPagination = paystubsList.pagination.payStubs\n const paymentMethod = paymentMethodList.isLoading\n ? undefined\n : paymentMethodList.data.paymentMethod\n\n const handleDownload = useCallback(\n async (payrollUuid: string) => {\n onEvent(componentEvents.EMPLOYEE_MANAGEMENT_PAYSTUBS_CARD_DOWNLOAD_REQUESTED, {\n employeeId,\n payrollUuid,\n })\n\n const tab = openPdfInNewTab({ loadingMessage: t('downloadLoadingMessage'), nonce })\n setDownloadingPayrollUuids(prev => {\n const next = new Set(prev)\n next.add(payrollUuid)\n return next\n })\n try {\n const result = await paystubsList.actions.downloadPayStub(payrollUuid)\n if (!result) {\n tab.close()\n return\n }\n tab.navigate(result.data)\n onEvent(componentEvents.EMPLOYEE_MANAGEMENT_PAYSTUBS_CARD_DOWNLOADED, {\n employeeId,\n payrollUuid,\n })\n } catch (err) {\n tab.close()\n showBoundary(err instanceof Error ? err : new Error(String(err)))\n } finally {\n setDownloadingPayrollUuids(prev => {\n if (!prev.has(payrollUuid)) return prev\n const next = new Set(prev)\n next.delete(payrollUuid)\n return next\n })\n }\n },\n [paystubsList.actions, onEvent, employeeId, t, showBoundary, nonce],\n )\n\n const payStubsColumns = [\n {\n key: 'payday',\n title: t('payday'),\n render: (payStub: EmployeePayStub) => formatDateLongWithYear(payStub.checkDate) || '-',\n },\n {\n key: 'checkAmount',\n title: t('checkAmount'),\n render: (payStub: EmployeePayStub) => {\n if (!payStub.netPay) return '-'\n const amount = parseFloat(payStub.netPay)\n return isNaN(amount) ? '-' : formatCurrency(amount)\n },\n },\n {\n key: 'grossPay',\n title: t('grossPay'),\n render: (payStub: EmployeePayStub) => {\n if (!payStub.grossPay) return '-'\n const amount = parseFloat(payStub.grossPay)\n return isNaN(amount) ? '-' : formatCurrency(amount)\n },\n },\n {\n key: 'paymentMethod',\n title: t('paymentMethod'),\n render: () => paymentMethod?.type || t('noPaymentMethod'),\n },\n ]\n\n const payStubsDataView = useDataView({\n data: payStubs,\n columns: payStubsColumns,\n pagination: payStubsPagination,\n itemMenu: payStub => {\n const isDownloading =\n !!payStub.payrollUuid && downloadingPayrollUuids.has(payStub.payrollUuid)\n return (\n <Components.ButtonIcon\n variant=\"tertiary\"\n aria-label={t('downloadCta')}\n isDisabled={!payStub.payrollUuid}\n isLoading={isDownloading}\n onClick={() => {\n if (payStub.payrollUuid) {\n void handleDownload(payStub.payrollUuid)\n }\n }}\n >\n <DownloadCloudIcon aria-hidden />\n </Components.ButtonIcon>\n )\n },\n emptyState: () => (\n <EmptyData title={t('emptyState.title')} description={t('emptyState.description')} />\n ),\n })\n\n const isShowingTable = payStubs.length > 0\n\n return (\n <BaseLayout error={errorHandling.errors} LoaderComponent={LoaderComponent}>\n <Components.Box\n withPadding={!isShowingTable}\n header={<Components.BoxHeader title={t('title')} />}\n >\n {isShowingTable ? (\n <DataView label={t('listLabel')} isWithinBox {...payStubsDataView} />\n ) : (\n <EmptyData title={t('emptyState.title')} description={t('emptyState.description')} />\n )}\n </Components.Box>\n </BaseLayout>\n )\n}\n"],"names":["PaystubsCard","LoaderComponent","props","jsx","BaseBoundaries","PaystubsCardContent","employeeId","onEvent","useI18n","t","useTranslation","Components","useComponentContext","paystubsList","usePaystubsList","paymentMethodList","usePaymentMethodList","errorHandling","composeErrorHandler","BaseLayout","Loading","PaystubsCardReady","formatCurrency","useNumberFormatter","showBoundary","useErrorBoundary","nonce","useNonce","downloadingPayrollUuids","setDownloadingPayrollUuids","useState","payStubs","payStubsPagination","paymentMethod","handleDownload","useCallback","payrollUuid","componentEvents","tab","openPdfInNewTab","prev","next","result","err","payStubsColumns","payStub","formatDateLongWithYear","amount","payStubsDataView","useDataView","isDownloading","DownloadCloudIcon","EmptyData","isShowingTable","DataView"],"mappings":"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"}
@@ -1,42 +1,42 @@
1
- import { jsx as o, jsxs as f } from "react/jsx-runtime";
2
- import { Suspense as u } from "react";
3
- import { useMachine as h } from "react-robot";
4
- import { FlowContext as x } from "./useFlow.js";
5
- import { FlowHeader as F } from "./FlowHeader.js";
6
- import { useLoadingIndicator as v } from "../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
1
+ import { jsx as n, jsxs as x } from "react/jsx-runtime";
2
+ import { Suspense as d } from "react";
3
+ import { useMachine as F } from "react-robot";
4
+ import { FlowContext as v } from "./useFlow.js";
5
+ import { FlowHeader as E } from "./FlowHeader.js";
6
+ import { useLoadingIndicator as a } from "../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
7
7
  import { Flex as s } from "../Common/Flex/Flex.js";
8
- const E = 40;
8
+ const g = 40;
9
9
  function H() {
10
- const { LoadingIndicator: n } = v();
11
- return /* @__PURE__ */ o(n, { height: E });
10
+ const { LoadingIndicator: o } = a();
11
+ return /* @__PURE__ */ n(o, { height: g });
12
12
  }
13
- const k = ({
14
- onEvent: n,
13
+ const A = ({
14
+ onEvent: o,
15
15
  machine: m
16
16
  }) => {
17
- const [e, d, t] = h(m, {
18
- onEvent: a,
17
+ const { LoadingIndicator: f } = a(), [e, p, t] = F(m, {
18
+ onEvent: h,
19
19
  component: null
20
20
  });
21
- function a(c, i) {
22
- const l = { type: c, payload: i }, p = d;
23
- t.child ? t.child.send(l) : p(l), n(c, i);
21
+ function h(c, i) {
22
+ const l = { type: c, payload: i }, u = p;
23
+ t.child ? t.child.send(l) : u(l), o(c, i);
24
24
  }
25
25
  const r = e.context.component;
26
- return /* @__PURE__ */ o(s, { children: /* @__PURE__ */ o(
27
- x.Provider,
26
+ return /* @__PURE__ */ n(s, { children: /* @__PURE__ */ n(
27
+ v.Provider,
28
28
  {
29
29
  value: {
30
30
  ...e.context
31
31
  },
32
- children: /* @__PURE__ */ f(s, { flexDirection: "column", gap: 32, children: [
33
- /* @__PURE__ */ o(u, { fallback: /* @__PURE__ */ o(H, {}), children: /* @__PURE__ */ o(F, {}) }),
34
- r && /* @__PURE__ */ o(r, {})
32
+ children: /* @__PURE__ */ x(s, { flexDirection: "column", gap: 32, children: [
33
+ /* @__PURE__ */ n(d, { fallback: /* @__PURE__ */ n(H, {}), children: /* @__PURE__ */ n(E, {}) }),
34
+ /* @__PURE__ */ n(d, { fallback: /* @__PURE__ */ n(f, {}), children: r && /* @__PURE__ */ n(r, {}) })
35
35
  ] })
36
36
  }
37
37
  ) });
38
38
  };
39
39
  export {
40
- k as Flow
40
+ A as Flow
41
41
  };
42
42
  //# sourceMappingURL=Flow.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Flow.js","sources":["../../../src/components/Flow/Flow.tsx"],"sourcesContent":["import { Suspense } from 'react'\nimport { useMachine } from 'react-robot'\nimport { type Machine, type SendFunction } from 'robot3'\nimport type { OnEventType } from '../Base/useBase'\nimport { Flex } from '../Common/Flex'\nimport type { FlowContextInterface } from './useFlow'\nimport { FlowContext } from './useFlow'\nimport { FlowHeader } from './FlowHeader'\nimport { useLoadingIndicator } from '@/contexts/LoadingIndicatorProvider/useLoadingIndicator'\nimport { type EventType } from '@/shared/constants'\n\n/**\n * Header chrome is short (a back-button row is the only header that can suspend),\n * so the header fallback matches its height rather than the full content loader —\n * this keeps the step body at the same level, avoiding a layout shift.\n */\nconst HEADER_LOADER_HEIGHT = 40\n\n/**\n * Fallback for the {@link FlowHeader} Suspense boundary. FlowHeader calls\n * `useTranslation` and renders above the active step's own boundary, so a\n * first-time i18n namespace load during a synchronous transition would otherwise\n * throw React #426. Reuses the SDK loading indicator sized to the header height\n * so the placeholder matches the header chrome and the step body doesn't shift.\n * (Step components manage their own loading via `BaseComponent`/`BaseBoundaries`.)\n */\nfunction FlowHeaderFallback() {\n const { LoadingIndicator } = useLoadingIndicator()\n return <LoadingIndicator height={HEADER_LOADER_HEIGHT} />\n}\n\ntype FlowProps<M extends Machine> = {\n machine: M\n onEvent: OnEventType<EventType, unknown>\n}\n\n/**\n * Drives a robot3 state machine that orchestrates a multi-step SDK flow, rendering the active\n * step component inside a {@link FlowContext} provider with optional header chrome above it.\n *\n * @remarks\n * Re-emits every event produced by the state machine (or the active child machine, when one is\n * nested) to the upstream `onEvent` callback, so the consuming flow component (e.g. `PayrollFlow`,\n * `OnboardingFlow`) can forward them to partner code. The set of event types is defined by the\n * machine itself rather than a fixed catalogue.\n *\n * @typeParam M - The robot3 {@link Machine} type whose context extends {@link FlowContextInterface}.\n * @param props - Component props: the `machine` instance to run and an `onEvent` handler that\n * receives every event the machine emits.\n * @returns A React element rendering the machine's current `component` inside the flow context,\n * with a {@link FlowHeader} above it.\n * @internal\n */\nexport const Flow = <M extends Machine<object, FlowContextInterface>>({\n onEvent,\n machine,\n}: FlowProps<M>) => {\n const [current, send, service] = useMachine(machine, {\n onEvent: handleEvent,\n component: null,\n })\n\n function handleEvent(type: EventType, data: unknown): void {\n const event = { type, payload: data }\n const sendFn = send as SendFunction<string>\n //When dealing with nested state machine, correct machine needs to recieve an event\n if (service.child) {\n ;(service.child.send as SendFunction<string>)(event)\n } else {\n sendFn(event)\n }\n // Pass event upstream - onEvent can be optional on Flow component\n onEvent(type, data)\n }\n\n const Component = current.context.component\n\n return (\n <Flex>\n <FlowContext.Provider\n value={{\n ...current.context,\n }}\n >\n <Flex flexDirection=\"column\" gap={32}>\n <Suspense fallback={<FlowHeaderFallback />}>\n <FlowHeader />\n </Suspense>\n {Component && <Component />}\n </Flex>\n </FlowContext.Provider>\n </Flex>\n )\n}\n"],"names":["HEADER_LOADER_HEIGHT","FlowHeaderFallback","LoadingIndicator","useLoadingIndicator","jsx","Flow","onEvent","machine","current","send","service","useMachine","handleEvent","type","data","event","sendFn","Component","Flex","FlowContext","jsxs","Suspense","FlowHeader"],"mappings":";;;;;;;AAgBA,MAAMA,IAAuB;AAU7B,SAASC,IAAqB;AAC5B,QAAM,EAAE,kBAAAC,EAAA,IAAqBC,EAAA;AAC7B,SAAO,gBAAAC,EAACF,GAAA,EAAiB,QAAQF,EAAA,CAAsB;AACzD;AAwBO,MAAMK,IAAO,CAAkD;AAAA,EACpE,SAAAC;AAAA,EACA,SAAAC;AACF,MAAoB;AAClB,QAAM,CAACC,GAASC,GAAMC,CAAO,IAAIC,EAAWJ,GAAS;AAAA,IACnD,SAASK;AAAA,IACT,WAAW;AAAA,EAAA,CACZ;AAED,WAASA,EAAYC,GAAiBC,GAAqB;AACzD,UAAMC,IAAQ,EAAE,MAAAF,GAAM,SAASC,EAAA,GACzBE,IAASP;AAEf,IAAIC,EAAQ,QACRA,EAAQ,MAAM,KAA8BK,CAAK,IAEnDC,EAAOD,CAAK,GAGdT,EAAQO,GAAMC,CAAI;AAAA,EACpB;AAEA,QAAMG,IAAYT,EAAQ,QAAQ;AAElC,2BACGU,GAAA,EACC,UAAA,gBAAAd;AAAA,IAACe,EAAY;AAAA,IAAZ;AAAA,MACC,OAAO;AAAA,QACL,GAAGX,EAAQ;AAAA,MAAA;AAAA,MAGb,UAAA,gBAAAY,EAACF,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA;AAAA,QAAA,gBAAAd,EAACiB,KAAS,UAAU,gBAAAjB,EAACH,KAAmB,GACtC,UAAA,gBAAAG,EAACkB,KAAW,EAAA,CACd;AAAA,QACCL,uBAAcA,GAAA,CAAA,CAAU;AAAA,MAAA,EAAA,CAC3B;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;"}
1
+ {"version":3,"file":"Flow.js","sources":["../../../src/components/Flow/Flow.tsx"],"sourcesContent":["import { Suspense } from 'react'\nimport { useMachine } from 'react-robot'\nimport { type Machine, type SendFunction } from 'robot3'\nimport type { OnEventType } from '../Base/useBase'\nimport { Flex } from '../Common/Flex'\nimport type { FlowContextInterface } from './useFlow'\nimport { FlowContext } from './useFlow'\nimport { FlowHeader } from './FlowHeader'\nimport { useLoadingIndicator } from '@/contexts/LoadingIndicatorProvider/useLoadingIndicator'\nimport { type EventType } from '@/shared/constants'\n\n/**\n * Header chrome is short (a back-button row is the only header that can suspend),\n * so the header fallback matches its height rather than the full content loader —\n * this keeps the step body at the same level, avoiding a layout shift.\n */\nconst HEADER_LOADER_HEIGHT = 40\n\n/**\n * Fallback for the {@link FlowHeader} Suspense boundary. FlowHeader calls\n * `useTranslation` and renders above the active step's own boundary, so a\n * first-time i18n namespace load during a synchronous transition would otherwise\n * throw React #426. Reuses the SDK loading indicator sized to the header height\n * so the placeholder matches the header chrome and the step body doesn't shift.\n * (Step components manage their own loading via `BaseComponent`/`BaseBoundaries`.)\n */\nfunction FlowHeaderFallback() {\n const { LoadingIndicator } = useLoadingIndicator()\n return <LoadingIndicator height={HEADER_LOADER_HEIGHT} />\n}\n\ntype FlowProps<M extends Machine> = {\n machine: M\n onEvent: OnEventType<EventType, unknown>\n}\n\n/**\n * Drives a robot3 state machine that orchestrates a multi-step SDK flow, rendering the active\n * step component inside a {@link FlowContext} provider with optional header chrome above it.\n *\n * @remarks\n * Re-emits every event produced by the state machine (or the active child machine, when one is\n * nested) to the upstream `onEvent` callback, so the consuming flow component (e.g. `PayrollFlow`,\n * `OnboardingFlow`) can forward them to partner code. The set of event types is defined by the\n * machine itself rather than a fixed catalogue.\n *\n * @typeParam M - The robot3 {@link Machine} type whose context extends {@link FlowContextInterface}.\n * @param props - Component props: the `machine` instance to run and an `onEvent` handler that\n * receives every event the machine emits.\n * @returns A React element rendering the machine's current `component` inside the flow context,\n * with a {@link FlowHeader} above it.\n * @internal\n */\nexport const Flow = <M extends Machine<object, FlowContextInterface>>({\n onEvent,\n machine,\n}: FlowProps<M>) => {\n const { LoadingIndicator } = useLoadingIndicator()\n const [current, send, service] = useMachine(machine, {\n onEvent: handleEvent,\n component: null,\n })\n\n function handleEvent(type: EventType, data: unknown): void {\n const event = { type, payload: data }\n const sendFn = send as SendFunction<string>\n //When dealing with nested state machine, correct machine needs to recieve an event\n if (service.child) {\n ;(service.child.send as SendFunction<string>)(event)\n } else {\n sendFn(event)\n }\n // Pass event upstream - onEvent can be optional on Flow component\n onEvent(type, data)\n }\n\n const Component = current.context.component\n\n return (\n <Flex>\n <FlowContext.Provider\n value={{\n ...current.context,\n }}\n >\n <Flex flexDirection=\"column\" gap={32}>\n <Suspense fallback={<FlowHeaderFallback />}>\n <FlowHeader />\n </Suspense>\n <Suspense fallback={<LoadingIndicator />}>{Component && <Component />}</Suspense>\n </Flex>\n </FlowContext.Provider>\n </Flex>\n )\n}\n"],"names":["HEADER_LOADER_HEIGHT","FlowHeaderFallback","LoadingIndicator","useLoadingIndicator","jsx","Flow","onEvent","machine","current","send","service","useMachine","handleEvent","type","data","event","sendFn","Component","Flex","FlowContext","jsxs","Suspense","FlowHeader"],"mappings":";;;;;;;AAgBA,MAAMA,IAAuB;AAU7B,SAASC,IAAqB;AAC5B,QAAM,EAAE,kBAAAC,EAAA,IAAqBC,EAAA;AAC7B,SAAO,gBAAAC,EAACF,GAAA,EAAiB,QAAQF,EAAA,CAAsB;AACzD;AAwBO,MAAMK,IAAO,CAAkD;AAAA,EACpE,SAAAC;AAAA,EACA,SAAAC;AACF,MAAoB;AAClB,QAAM,EAAE,kBAAAL,EAAA,IAAqBC,EAAA,GACvB,CAACK,GAASC,GAAMC,CAAO,IAAIC,EAAWJ,GAAS;AAAA,IACnD,SAASK;AAAA,IACT,WAAW;AAAA,EAAA,CACZ;AAED,WAASA,EAAYC,GAAiBC,GAAqB;AACzD,UAAMC,IAAQ,EAAE,MAAAF,GAAM,SAASC,EAAA,GACzBE,IAASP;AAEf,IAAIC,EAAQ,QACRA,EAAQ,MAAM,KAA8BK,CAAK,IAEnDC,EAAOD,CAAK,GAGdT,EAAQO,GAAMC,CAAI;AAAA,EACpB;AAEA,QAAMG,IAAYT,EAAQ,QAAQ;AAElC,2BACGU,GAAA,EACC,UAAA,gBAAAd;AAAA,IAACe,EAAY;AAAA,IAAZ;AAAA,MACC,OAAO;AAAA,QACL,GAAGX,EAAQ;AAAA,MAAA;AAAA,MAGb,UAAA,gBAAAY,EAACF,GAAA,EAAK,eAAc,UAAS,KAAK,IAChC,UAAA;AAAA,QAAA,gBAAAd,EAACiB,KAAS,UAAU,gBAAAjB,EAACH,KAAmB,GACtC,UAAA,gBAAAG,EAACkB,KAAW,EAAA,CACd;AAAA,QACA,gBAAAlB,EAACiB,KAAS,UAAU,gBAAAjB,EAACF,KAAiB,GAAK,UAAAe,KAAa,gBAAAb,EAACa,GAAA,CAAA,CAAU,EAAA,CAAG;AAAA,MAAA,EAAA,CACxE;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;"}
@@ -1,7 +1,7 @@
1
- import { createContext as e, useContext as t } from "react";
2
- const r = e(null);
1
+ import { useContext as e, createContext as t } from "react";
2
+ const r = t(null);
3
3
  function u() {
4
- const o = t(r);
4
+ const o = e(r);
5
5
  if (!o)
6
6
  throw new Error("useFlow used outside provider");
7
7
  return o;
@@ -60,4 +60,4 @@ export interface InformationRequestsFlowProps extends Omit<BaseComponentInterfac
60
60
  * }
61
61
  * ```
62
62
  */
63
- export declare function InformationRequestsFlow({ companyId, dictionary, withAlert, onEvent, LoaderComponent, }: InformationRequestsFlowProps): import("react").JSX.Element;
63
+ export declare function InformationRequestsFlow({ FallbackComponent, LoaderComponent, ...props }: InformationRequestsFlowProps): import("react").JSX.Element;
@@ -1,94 +1,109 @@
1
- import { jsx as t, jsxs as b } from "react/jsx-runtime";
2
- import { createMachine as Q } from "robot3";
3
- import { useMachine as U } from "react-robot";
4
- import { useState as E, useCallback as p, useMemo as k, Suspense as I } from "react";
5
- import { useTranslation as P } from "react-i18next";
6
- import { informationRequestsMachine as g } from "./informationRequestsStateMachine.js";
7
- import { BaseBoundaries as j } from "../Base/Base.js";
1
+ import { jsx as t, jsxs as Q } from "react/jsx-runtime";
2
+ import { createMachine as U } from "robot3";
3
+ import { useMachine as k } from "react-robot";
4
+ import { useState as I, useCallback as p, useMemo as P, Suspense as O } from "react";
5
+ import { useTranslation as g } from "react-i18next";
6
+ import { informationRequestsMachine as j } from "./informationRequestsStateMachine.js";
7
+ import { BaseBoundaries as h } from "../Base/Base.js";
8
8
  import "../Base/useBase.js";
9
- import { Flex as B } from "../Common/Flex/Flex.js";
10
- import { useComponentContext as L } from "../../contexts/ComponentAdapter/useComponentContext.js";
9
+ import { Flex as w } from "../Common/Flex/Flex.js";
10
+ import { useComponentContext as B } from "../../contexts/ComponentAdapter/useComponentContext.js";
11
11
  import { FlowContext as $ } from "../Flow/useFlow.js";
12
- import { useComponentDictionary as w, useI18n as z } from "../../i18n/I18n.js";
13
- import { informationRequestEvents as s } from "../../shared/constants.js";
12
+ import { useComponentDictionary as z, useI18n as L } from "../../i18n/I18n.js";
13
+ import { informationRequestEvents as l } from "../../shared/constants.js";
14
14
  import { InformationRequestList as Y } from "./InformationRequestList/InformationRequestList.js";
15
- const O = "informationRequestResponded";
16
- function re({
17
- companyId: r,
18
- dictionary: M,
19
- withAlert: m = !0,
20
- onEvent: h = () => {
15
+ const M = "informationRequestResponded";
16
+ function G({
17
+ companyId: o,
18
+ dictionary: s,
19
+ withAlert: r = !0,
20
+ onEvent: x = () => {
21
21
  },
22
- LoaderComponent: i
22
+ LoaderComponent: a
23
23
  }) {
24
- w("InformationRequests", M), z("InformationRequests");
25
- const { t: c } = P("InformationRequests"), { Modal: x, LoadingSpinner: f, Alert: A, Text: F } = L(), [N, l] = E(!1), [T, u] = E({
24
+ z("InformationRequests", s), L("InformationRequests");
25
+ const { t: f } = g("InformationRequests"), { Modal: A, LoadingSpinner: u, Alert: F, Text: N } = B(), [T, m] = I(!1), [_, d] = I({
26
26
  nextAlertId: 0,
27
27
  alerts: []
28
- }), _ = p((e) => {
29
- u((o) => ({
30
- ...o,
31
- alerts: o.alerts.filter((v) => v.id !== e)
28
+ }), q = p((e) => {
29
+ d((n) => ({
30
+ ...n,
31
+ alerts: n.alerts.filter((b) => b.id !== e)
32
32
  }));
33
33
  }, []), S = p(() => {
34
- u((e) => ({
34
+ d((e) => ({
35
35
  nextAlertId: e.nextAlertId + 1,
36
36
  alerts: [{ id: e.nextAlertId }, ...e.alerts]
37
37
  }));
38
- }, []), q = k(
39
- () => Q(
38
+ }, []), C = P(
39
+ () => U(
40
40
  "list",
41
- g,
41
+ j,
42
42
  () => ({
43
43
  component: null,
44
- companyId: r,
45
- onEvent: n,
46
- LoaderComponent: i
44
+ companyId: o,
45
+ onEvent: i,
46
+ LoaderComponent: a
47
47
  })
48
48
  ),
49
- [r, i]
50
- ), [d, C] = U(q);
51
- function n(e, o) {
52
- C({ type: e, payload: o }), e === s.INFORMATION_REQUEST_RESPOND && l(!0), (e === s.INFORMATION_REQUEST_FORM_CANCEL || e === s.INFORMATION_REQUEST_FORM_DONE) && l(!1), e === s.INFORMATION_REQUEST_FORM_DONE && m && S(), h(e, o);
49
+ [o, a]
50
+ ), [R, D] = k(C);
51
+ function i(e, n) {
52
+ D({ type: e, payload: n }), e === l.INFORMATION_REQUEST_RESPOND && m(!0), (e === l.INFORMATION_REQUEST_FORM_CANCEL || e === l.INFORMATION_REQUEST_FORM_DONE) && m(!1), e === l.INFORMATION_REQUEST_FORM_DONE && r && S(), x(e, n);
53
53
  }
54
- const D = () => {
55
- l(!1);
56
- }, a = d.context.component, R = a?.Footer || void 0;
54
+ const v = () => {
55
+ m(!1);
56
+ }, c = R.context.component, E = c?.Footer || void 0;
57
57
  return /* @__PURE__ */ t(
58
58
  $.Provider,
59
59
  {
60
60
  value: {
61
- ...d.context,
62
- onEvent: n
61
+ ...R.context,
62
+ onEvent: i
63
63
  },
64
- children: /* @__PURE__ */ b(B, { flexDirection: "column", gap: 32, children: [
65
- m && T.alerts.map((e) => /* @__PURE__ */ t(
66
- A,
64
+ children: /* @__PURE__ */ Q(w, { flexDirection: "column", gap: 32, children: [
65
+ r && _.alerts.map((e) => /* @__PURE__ */ t(
66
+ F,
67
67
  {
68
68
  status: "success",
69
- label: c(`alerts.${O}.title`),
69
+ label: f(`alerts.${M}.title`),
70
70
  onDismiss: () => {
71
- _(e.id);
71
+ q(e.id);
72
72
  },
73
- children: /* @__PURE__ */ t(F, { children: c(`alerts.${O}.description`) })
73
+ children: /* @__PURE__ */ t(N, { children: f(`alerts.${M}.description`) })
74
74
  },
75
75
  e.id
76
76
  )),
77
- /* @__PURE__ */ t(I, { fallback: /* @__PURE__ */ t(f, {}), children: /* @__PURE__ */ t(Y, { companyId: r, onEvent: n }) }),
77
+ /* @__PURE__ */ t(O, { fallback: /* @__PURE__ */ t(u, {}), children: /* @__PURE__ */ t(Y, { companyId: o, onEvent: i }) }),
78
78
  /* @__PURE__ */ t(
79
- x,
79
+ A,
80
80
  {
81
- isOpen: N,
82
- onClose: D,
83
- footer: R && /* @__PURE__ */ t(j, { LoaderComponent: i, children: /* @__PURE__ */ t(I, { fallback: /* @__PURE__ */ t(f, { size: "sm" }), children: /* @__PURE__ */ t(R, { onEvent: n }) }) }),
84
- children: a && /* @__PURE__ */ t(a, {})
81
+ isOpen: T,
82
+ onClose: v,
83
+ footer: E && /* @__PURE__ */ t(h, { LoaderComponent: a, children: /* @__PURE__ */ t(O, { fallback: /* @__PURE__ */ t(u, { size: "sm" }), children: /* @__PURE__ */ t(E, { onEvent: i }) }) }),
84
+ children: c && /* @__PURE__ */ t(c, {})
85
85
  }
86
86
  )
87
87
  ] })
88
88
  }
89
89
  );
90
90
  }
91
+ function ie({
92
+ FallbackComponent: o,
93
+ LoaderComponent: s,
94
+ ...r
95
+ }) {
96
+ return /* @__PURE__ */ t(
97
+ h,
98
+ {
99
+ componentName: "InformationRequests",
100
+ FallbackComponent: o,
101
+ LoaderComponent: s,
102
+ children: /* @__PURE__ */ t(G, { LoaderComponent: s, ...r })
103
+ }
104
+ );
105
+ }
91
106
  export {
92
- re as InformationRequestsFlow
107
+ ie as InformationRequestsFlow
93
108
  };
94
109
  //# sourceMappingURL=InformationRequests.js.map