@gusto/embedded-react-sdk 0.41.0 → 0.43.0

package/dist/components/UNSTABLE_TimeOff/TimeOffManagement/SelectEmployees/useSelectEmployeesData.js

@@ -0,0 +1,56 @@
+import { useState as d, useMemo as i, useCallback as u } from "react";
+import { useEmployeesListSuspense as b } from "@gusto/embedded-api/react-query/employeesList";
+import { usePagination as L } from "../../../../hooks/usePagination/usePagination.js";
+function D(h) {
+  const [f, g] = d(/* @__PURE__ */ new Set()), [s, c] = d(""), { currentPage: m, itemsPerPage: p, getPaginationProps: S, resetPage: a } = L(), { data: n, isFetching: o } = b({
+    companyId: h,
+    terminated: !1,
+    page: m,
+    per: p
+  }), r = i(
+    () => (n.showEmployees ?? []).map((e) => ({
+      uuid: e.uuid,
+      firstName: e.firstName,
+      lastName: e.lastName,
+      jobTitle: e.jobs?.find((t) => t.primary)?.title ?? null,
+      department: e.department ?? null
+    })),
+    [n.showEmployees]
+  ), y = i(() => {
+    if (!s) return r;
+    const e = s.toLowerCase();
+    return r.filter(
+      (t) => `${t.firstName ?? ""} ${t.lastName ?? ""}`.toLowerCase().includes(e)
+    );
+  }, [r, s]), w = i(
+    () => S(n.httpMeta.response.headers, o),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [n.httpMeta.response.headers, o, m, p]
+  ), P = u((e, t) => {
+    g((E) => {
+      const l = new Set(E);
+      return t ? l.add(e.uuid) : l.delete(e.uuid), l;
+    });
+  }, []), N = u(
+    (e) => {
+      c(e), a();
+    },
+    [a]
+  ), C = u(() => {
+    c(""), a();
+  }, [a]);
+  return {
+    filteredEmployees: y,
+    selectedUuids: f,
+    searchValue: s,
+    pagination: w,
+    isFetching: o,
+    handleSelect: P,
+    handleSearchChange: N,
+    handleSearchClear: C
+  };
+}
+export {
+  D as useSelectEmployeesData
+};
+//# sourceMappingURL=useSelectEmployeesData.js.map

package/dist/components/UNSTABLE_TimeOff/TimeOffManagement/SelectEmployees/useSelectEmployeesData.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelectEmployeesData.js","sources":["../../../../../src/components/UNSTABLE_TimeOff/TimeOffManagement/SelectEmployees/useSelectEmployeesData.ts"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react'\nimport { useEmployeesListSuspense } from '@gusto/embedded-api/react-query/employeesList'\nimport type { EmployeeItem } from './SelectEmployeesPresentationTypes'\nimport { usePagination } from '@/hooks/usePagination/usePagination'\n\nexport function useSelectEmployeesData(companyId: string) {\n  const [selectedUuids, setSelectedUuids] = useState(new Set<string>())\n  const [searchValue, setSearchValue] = useState('')\n  const { currentPage, itemsPerPage, getPaginationProps, resetPage } = usePagination()\n\n  const { data: employeesData, isFetching } = useEmployeesListSuspense({\n    companyId,\n    terminated: false,\n    page: currentPage,\n    per: itemsPerPage,\n  })\n\n  const employees = useMemo<EmployeeItem[]>(\n    () =>\n      (employeesData.showEmployees ?? []).map(e => ({\n        uuid: e.uuid,\n        firstName: e.firstName,\n        lastName: e.lastName,\n        jobTitle: e.jobs?.find(job => job.primary)?.title ?? null,\n        department: e.department ?? null,\n      })),\n    [employeesData.showEmployees],\n  )\n\n  const filteredEmployees = useMemo(() => {\n    if (!searchValue) return employees\n    const lower = searchValue.toLowerCase()\n    return employees.filter(e =>\n      `${e.firstName ?? ''} ${e.lastName ?? ''}`.toLowerCase().includes(lower),\n    )\n  }, [employees, searchValue])\n\n  const pagination = useMemo(\n    () => getPaginationProps(employeesData.httpMeta.response.headers, isFetching),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [employeesData.httpMeta.response.headers, isFetching, currentPage, itemsPerPage],\n  )\n\n  const handleSelect = useCallback((item: EmployeeItem, checked: boolean) => {\n    setSelectedUuids(prev => {\n      const next = new Set(prev)\n      if (checked) next.add(item.uuid)\n      else next.delete(item.uuid)\n      return next\n    })\n  }, [])\n\n  const handleSearchChange = useCallback(\n    (value: string) => {\n      setSearchValue(value)\n      resetPage()\n    },\n    [resetPage],\n  )\n\n  const handleSearchClear = useCallback(() => {\n    setSearchValue('')\n    resetPage()\n  }, [resetPage])\n\n  return {\n    filteredEmployees,\n    selectedUuids,\n    searchValue,\n    pagination,\n    isFetching,\n    handleSelect,\n    handleSearchChange,\n    handleSearchClear,\n  }\n}\n"],"names":["useSelectEmployeesData","companyId","selectedUuids","setSelectedUuids","useState","searchValue","setSearchValue","currentPage","itemsPerPage","getPaginationProps","resetPage","usePagination","employeesData","isFetching","useEmployeesListSuspense","employees","useMemo","job","filteredEmployees","lower","e","pagination","handleSelect","useCallback","item","checked","prev","next","handleSearchChange","value","handleSearchClear"],"mappings":";;;AAKO,SAASA,EAAuBC,GAAmB;AACxD,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAS,oBAAI,KAAa,GAC9D,CAACC,GAAaC,CAAc,IAAIF,EAAS,EAAE,GAC3C,EAAE,aAAAG,GAAa,cAAAC,GAAc,oBAAAC,GAAoB,WAAAC,EAAA,IAAcC,EAAA,GAE/D,EAAE,MAAMC,GAAe,YAAAC,EAAA,IAAeC,EAAyB;AAAA,IACnE,WAAAb;AAAA,IACA,YAAY;AAAA,IACZ,MAAMM;AAAA,IACN,KAAKC;AAAA,EAAA,CACN,GAEKO,IAAYC;AAAA,IAChB,OACGJ,EAAc,iBAAiB,CAAA,GAAI,IAAI,CAAA,OAAM;AAAA,MAC5C,MAAM,EAAE;AAAA,MACR,WAAW,EAAE;AAAA,MACb,UAAU,EAAE;AAAA,MACZ,UAAU,EAAE,MAAM,KAAK,OAAOK,EAAI,OAAO,GAAG,SAAS;AAAA,MACrD,YAAY,EAAE,cAAc;AAAA,IAAA,EAC5B;AAAA,IACJ,CAACL,EAAc,aAAa;AAAA,EAAA,GAGxBM,IAAoBF,EAAQ,MAAM;AACtC,QAAI,CAACX,EAAa,QAAOU;AACzB,UAAMI,IAAQd,EAAY,YAAA;AAC1B,WAAOU,EAAU;AAAA,MAAO,CAAAK,MACtB,GAAGA,EAAE,aAAa,EAAE,IAAIA,EAAE,YAAY,EAAE,GAAG,YAAA,EAAc,SAASD,CAAK;AAAA,IAAA;AAAA,EAE3E,GAAG,CAACJ,GAAWV,CAAW,CAAC,GAErBgB,IAAaL;AAAA,IACjB,MAAMP,EAAmBG,EAAc,SAAS,SAAS,SAASC,CAAU;AAAA;AAAA,IAE5E,CAACD,EAAc,SAAS,SAAS,SAASC,GAAYN,GAAaC,CAAY;AAAA,EAAA,GAG3Ec,IAAeC,EAAY,CAACC,GAAoBC,MAAqB;AACzE,IAAAtB,EAAiB,CAAAuB,MAAQ;AACvB,YAAMC,IAAO,IAAI,IAAID,CAAI;AACzB,aAAID,IAASE,EAAK,IAAIH,EAAK,IAAI,IAC1BG,EAAK,OAAOH,EAAK,IAAI,GACnBG;AAAA,IACT,CAAC;AAAA,EACH,GAAG,CAAA,CAAE,GAECC,IAAqBL;AAAA,IACzB,CAACM,MAAkB;AACjB,MAAAvB,EAAeuB,CAAK,GACpBnB,EAAA;AAAA,IACF;AAAA,IACA,CAACA,CAAS;AAAA,EAAA,GAGNoB,IAAoBP,EAAY,MAAM;AAC1C,IAAAjB,EAAe,EAAE,GACjBI,EAAA;AAAA,EACF,GAAG,CAACA,CAAS,CAAC;AAEd,SAAO;AAAA,IACL,mBAAAQ;AAAA,IACA,eAAAhB;AAAA,IACA,aAAAG;AAAA,IACA,YAAAgB;AAAA,IACA,YAAAR;AAAA,IACA,cAAAS;AAAA,IACA,oBAAAM;AAAA,IACA,mBAAAE;AAAA,EAAA;AAEJ;"}

package/dist/components/UNSTABLE_TimeOff/index.d.ts

@@ -5,10 +5,8 @@ export { PolicyTypeSelector } from './PolicyTypeSelector/PolicyTypeSelector';
 export type { PolicyTypeSelectorProps } from './PolicyTypeSelector/PolicyTypeSelector';
 export { PolicyConfigurationForm } from './TimeOffManagement/PolicyConfigurationForm';
 export type { PolicyConfigurationFormProps } from './TimeOffManagement/PolicyConfigurationForm';
-export { PolicySettings } from './PolicySettings/PolicySettings';
-export type { PolicySettingsProps } from './PolicySettings/PolicySettings';
-export { PolicySettingsPresentation } from './PolicySettings/PolicySettingsPresentation';
-export type { PolicySettingsPresentationProps } from './PolicySettings/PolicySettingsTypes';
+export { PolicySettingsPresentation as PolicySettings } from './PolicySettings/PolicySettingsPresentation';
+export type { PolicySettingsPresentationProps as PolicySettingsProps } from './PolicySettings/PolicySettingsTypes';
 export { AddEmployeesToPolicy } from './AddEmployeesToPolicy/AddEmployeesToPolicy';
 export type { AddEmployeesToPolicyProps } from './AddEmployeesToPolicy/AddEmployeesToPolicy';
 export { ViewPolicyDetails } from './ViewPolicyDetails/ViewPolicyDetails';

package/dist/components/UNSTABLE_TimeOff/index.js

@@ -1,29 +1,27 @@
 import { PolicyList as r } from "./PolicyList/PolicyList.js";
 import { PolicyTypeSelector as t } from "./PolicyTypeSelector/PolicyTypeSelector.js";
-import { PolicySettings as m } from "./PolicySettings/PolicySettings.js";
-import { PolicySettingsPresentation as y } from "./PolicySettings/PolicySettingsPresentation.js";
-import { AddEmployeesToPolicy as x } from "./AddEmployeesToPolicy/AddEmployeesToPolicy.js";
-import { ViewPolicyDetails as d } from "./ViewPolicyDetails/ViewPolicyDetails.js";
-import { ViewPolicyEmployees as P } from "./ViewPolicyEmployees/ViewPolicyEmployees.js";
-import { HolidaySelectionForm as n } from "./HolidaySelectionForm/HolidaySelectionForm.js";
-import { AddEmployeesHoliday as S } from "./AddEmployeesHoliday/AddEmployeesHoliday.js";
-import { ViewHolidayEmployees as H } from "./ViewHolidayEmployees/ViewHolidayEmployees.js";
-import { ViewHolidaySchedule as g } from "./ViewHolidaySchedule/ViewHolidaySchedule.js";
-import { TimeOffFlow as T } from "./TimeOffFlow/TimeOffFlow.js";
-import { PolicyConfigurationForm as A } from "./TimeOffManagement/PolicyConfigurationForm/PolicyConfigurationForm.js";
+import { PolicySettingsPresentation as m } from "./PolicySettings/PolicySettingsPresentation.js";
+import { AddEmployeesToPolicy as y } from "./AddEmployeesToPolicy/AddEmployeesToPolicy.js";
+import { ViewPolicyDetails as x } from "./ViewPolicyDetails/ViewPolicyDetails.js";
+import { ViewPolicyEmployees as s } from "./ViewPolicyEmployees/ViewPolicyEmployees.js";
+import { HolidaySelectionForm as P } from "./HolidaySelectionForm/HolidaySelectionForm.js";
+import { AddEmployeesHoliday as n } from "./AddEmployeesHoliday/AddEmployeesHoliday.js";
+import { ViewHolidayEmployees as S } from "./ViewHolidayEmployees/ViewHolidayEmployees.js";
+import { ViewHolidaySchedule as H } from "./ViewHolidaySchedule/ViewHolidaySchedule.js";
+import { TimeOffFlow as g } from "./TimeOffFlow/TimeOffFlow.js";
+import { PolicyConfigurationForm as T } from "./TimeOffManagement/PolicyConfigurationForm/PolicyConfigurationForm.js";
 export {
-  S as AddEmployeesHoliday,
-  x as AddEmployeesToPolicy,
-  n as HolidaySelectionForm,
-  A as PolicyConfigurationForm,
+  n as AddEmployeesHoliday,
+  y as AddEmployeesToPolicy,
+  P as HolidaySelectionForm,
+  T as PolicyConfigurationForm,
   r as PolicyList,
   m as PolicySettings,
-  y as PolicySettingsPresentation,
   t as PolicyTypeSelector,
-  T as TimeOffFlow,
-  H as ViewHolidayEmployees,
-  g as ViewHolidaySchedule,
-  d as ViewPolicyDetails,
-  P as ViewPolicyEmployees
+  g as TimeOffFlow,
+  S as ViewHolidayEmployees,
+  H as ViewHolidaySchedule,
+  x as ViewPolicyDetails,
+  s as ViewPolicyEmployees
 };
 //# sourceMappingURL=index.js.map

package/dist/components/UNSTABLE_TimeOff/index.js.map

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

package/dist/components/UNSTABLE_TimeOff/shared/EmployeeTable/EmployeeTable.js

@@ -0,0 +1,90 @@
+import { jsx as r, jsxs as w } from "react/jsx-runtime";
+import { useMemo as l } from "react";
+import { useTranslation as D } from "react-i18next";
+import h from "./EmployeeTable.module.scss.js";
+import "classnames";
+import { useComponentContext as d } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useI18n as R } from "../../../../i18n/I18n.js";
+import { firstLastName as V } from "../../../../helpers/formattedStrings.js";
+import I from "../../../../assets/icons/search-lg.svg.js";
+import { useDataView as O } from "../../../Common/DataView/useDataView.js";
+import { DataView as P } from "../../../Common/DataView/DataView.js";
+function Q({
+  data: o,
+  label: a,
+  additionalColumns: m = [],
+  searchValue: i,
+  onSearchChange: y,
+  onSearchClear: b,
+  searchPlaceholder: T,
+  selectionMode: g,
+  onSelect: c,
+  getIsItemSelected: C,
+  itemMenu: p,
+  pagination: E,
+  isFetching: S,
+  emptyState: u,
+  emptySearchState: n,
+  footer: x
+}) {
+  R("Company.TimeOff.EmployeeTable");
+  const { t } = D("Company.TimeOff.EmployeeTable"), N = d(), s = i.length > 0 && o.length === 0, j = (e) => {
+    y(e), e || b();
+  }, f = l(() => {
+    const e = t("noSearchResults");
+    return function() {
+      return /* @__PURE__ */ r(_, { message: e });
+    };
+  }, [t]), v = l(() => s && n ? n : s ? f : u, [s, n, u, f]), L = l(
+    () => [
+      {
+        key: "name",
+        title: t("name"),
+        render: (e) => /* @__PURE__ */ r("span", { id: `employee-name-${e.uuid}`, children: V({
+          first_name: e.firstName,
+          last_name: e.lastName
+        }) })
+      },
+      {
+        key: "jobTitle",
+        title: t("jobTitle"),
+        render: (e) => e.jobTitle ?? ""
+      },
+      ...m
+    ],
+    [t, m]
+  ), k = O({
+    data: o,
+    columns: L,
+    itemMenu: p,
+    pagination: E,
+    isFetching: S,
+    emptyState: v,
+    footer: x,
+    ...c && { selectionMode: g, onSelect: c, getIsItemSelected: C }
+  });
+  return /* @__PURE__ */ w("div", { className: h.root, "data-has-menu": p ? !0 : void 0, children: [
+    /* @__PURE__ */ r("div", { className: h.searchContainer, children: /* @__PURE__ */ r(
+      N.TextInput,
+      {
+        name: "employee-search",
+        type: "search",
+        label: t("searchLabel"),
+        shouldVisuallyHideLabel: !0,
+        placeholder: T ?? t("searchPlaceholder"),
+        value: i,
+        onChange: j,
+        adornmentStart: /* @__PURE__ */ r(I, { "aria-hidden": !0 })
+      }
+    ) }),
+    /* @__PURE__ */ r(P, { label: a ?? t("tableLabel"), ...k })
+  ] });
+}
+function _({ message: o }) {
+  const { Text: a } = d();
+  return /* @__PURE__ */ r(a, { children: o });
+}
+export {
+  Q as EmployeeTable
+};
+//# sourceMappingURL=EmployeeTable.js.map

package/dist/components/UNSTABLE_TimeOff/shared/EmployeeTable/EmployeeTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmployeeTable.js","sources":["../../../../../src/components/UNSTABLE_TimeOff/shared/EmployeeTable/EmployeeTable.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport type { EmployeeTableItem, EmployeeTableProps } from './EmployeeTableTypes'\nimport styles from './EmployeeTable.module.scss'\nimport { DataView, useDataView } from '@/components/Common'\nimport type { useDataViewProp } from '@/components/Common/DataView/useDataView'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n/I18n'\nimport { firstLastName } from '@/helpers/formattedStrings'\nimport SearchIcon from '@/assets/icons/search-lg.svg?react'\n\nexport function EmployeeTable<T extends EmployeeTableItem>({\n  data,\n  label,\n  additionalColumns = [],\n  searchValue,\n  onSearchChange,\n  onSearchClear,\n  searchPlaceholder,\n  selectionMode,\n  onSelect,\n  getIsItemSelected,\n  itemMenu,\n  pagination,\n  isFetching,\n  emptyState,\n  emptySearchState,\n  footer,\n}: EmployeeTableProps<T>) {\n  useI18n('Company.TimeOff.EmployeeTable')\n  const { t } = useTranslation('Company.TimeOff.EmployeeTable')\n  const Components = useComponentContext()\n\n  const isSearchWithNoResults = searchValue.length > 0 && data.length === 0\n\n  const handleSearchChange = (value: string) => {\n    onSearchChange(value)\n    if (!value) onSearchClear()\n  }\n\n  const defaultEmptySearch = useMemo(() => {\n    const noSearchResults = t('noSearchResults')\n    return function EmptySearchFallback() {\n      return <DefaultEmptySearchState message={noSearchResults} />\n    }\n  }, [t])\n\n  const resolvedEmptyState = useMemo(() => {\n    if (isSearchWithNoResults && emptySearchState) {\n      return emptySearchState\n    }\n    if (isSearchWithNoResults) {\n      return defaultEmptySearch\n    }\n    return emptyState\n  }, [isSearchWithNoResults, emptySearchState, emptyState, defaultEmptySearch])\n\n  const columns = useMemo(\n    () => [\n      {\n        key: 'name',\n        title: t('name'),\n        render: (item: T) => (\n          <span id={`employee-name-${item.uuid}`}>\n            {firstLastName({\n              first_name: item.firstName,\n              last_name: item.lastName,\n            })}\n          </span>\n        ),\n      },\n      {\n        key: 'jobTitle' as keyof T,\n        title: t('jobTitle'),\n        render: (item: T) => item.jobTitle ?? '',\n      },\n      ...additionalColumns,\n    ],\n    [t, additionalColumns],\n  )\n\n  const dataViewProps = useDataView<T>({\n    data,\n    columns,\n    itemMenu,\n    pagination,\n    isFetching,\n    emptyState: resolvedEmptyState,\n    footer,\n    ...(onSelect && { selectionMode, onSelect, getIsItemSelected }),\n  } as useDataViewProp<T>)\n\n  return (\n    <div className={styles.root} data-has-menu={itemMenu ? true : undefined}>\n      <div className={styles.searchContainer}>\n        <Components.TextInput\n          name=\"employee-search\"\n          type=\"search\"\n          label={t('searchLabel')}\n          shouldVisuallyHideLabel\n          placeholder={searchPlaceholder ?? t('searchPlaceholder')}\n          value={searchValue}\n          onChange={handleSearchChange}\n          adornmentStart={<SearchIcon aria-hidden />}\n        />\n      </div>\n      <DataView label={label ?? t('tableLabel')} {...dataViewProps} />\n    </div>\n  )\n}\n\nfunction DefaultEmptySearchState({ message }: { message: string }) {\n  const { Text } = useComponentContext()\n  return <Text>{message}</Text>\n}\n"],"names":["EmployeeTable","data","label","additionalColumns","searchValue","onSearchChange","onSearchClear","searchPlaceholder","selectionMode","onSelect","getIsItemSelected","itemMenu","pagination","isFetching","emptyState","emptySearchState","footer","useI18n","useTranslation","Components","useComponentContext","isSearchWithNoResults","handleSearchChange","value","defaultEmptySearch","useMemo","noSearchResults","jsx","DefaultEmptySearchState","resolvedEmptyState","columns","item","firstLastName","dataViewProps","useDataView","jsxs","styles","SearchIcon","DataView","message","Text"],"mappings":";;;;;;;;;;;AAWO,SAASA,EAA2C;AAAA,EACzD,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,mBAAAC,IAAoB,CAAA;AAAA,EACpB,aAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,UAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,QAAAC;AACF,GAA0B;AACxB,EAAAC,EAAQ,+BAA+B;AACvC,QAAM,EAAE,EAAA,IAAMC,EAAe,+BAA+B,GACtDC,IAAaC,EAAA,GAEbC,IAAwBjB,EAAY,SAAS,KAAKH,EAAK,WAAW,GAElEqB,IAAqB,CAACC,MAAkB;AAC5C,IAAAlB,EAAekB,CAAK,GACfA,KAAOjB,EAAA;AAAA,EACd,GAEMkB,IAAqBC,EAAQ,MAAM;AACvC,UAAMC,IAAkB,EAAE,iBAAiB;AAC3C,WAAO,WAA+B;AACpC,aAAO,gBAAAC,EAACC,GAAA,EAAwB,SAASF,EAAA,CAAiB;AAAA,IAC5D;AAAA,EACF,GAAG,CAAC,CAAC,CAAC,GAEAG,IAAqBJ,EAAQ,MAC7BJ,KAAyBN,IACpBA,IAELM,IACKG,IAEFV,GACN,CAACO,GAAuBN,GAAkBD,GAAYU,CAAkB,CAAC,GAEtEM,IAAUL;AAAA,IACd,MAAM;AAAA,MACJ;AAAA,QACE,KAAK;AAAA,QACL,OAAO,EAAE,MAAM;AAAA,QACf,QAAQ,CAACM,MACP,gBAAAJ,EAAC,QAAA,EAAK,IAAI,iBAAiBI,EAAK,IAAI,IACjC,UAAAC,EAAc;AAAA,UACb,YAAYD,EAAK;AAAA,UACjB,WAAWA,EAAK;AAAA,QAAA,CACjB,EAAA,CACH;AAAA,MAAA;AAAA,MAGJ;AAAA,QACE,KAAK;AAAA,QACL,OAAO,EAAE,UAAU;AAAA,QACnB,QAAQ,CAACA,MAAYA,EAAK,YAAY;AAAA,MAAA;AAAA,MAExC,GAAG5B;AAAA,IAAA;AAAA,IAEL,CAAC,GAAGA,CAAiB;AAAA,EAAA,GAGjB8B,IAAgBC,EAAe;AAAA,IACnC,MAAAjC;AAAA,IACA,SAAA6B;AAAA,IACA,UAAAnB;AAAA,IACA,YAAAC;AAAA,IACA,YAAAC;AAAA,IACA,YAAYgB;AAAA,IACZ,QAAAb;AAAA,IACA,GAAIP,KAAY,EAAE,eAAAD,GAAe,UAAAC,GAAU,mBAAAC,EAAA;AAAA,EAAkB,CACxC;AAEvB,SACE,gBAAAyB,EAAC,SAAI,WAAWC,EAAO,MAAM,iBAAezB,IAAW,KAAO,QAC5D,UAAA;AAAA,IAAA,gBAAAgB,EAAC,OAAA,EAAI,WAAWS,EAAO,iBACrB,UAAA,gBAAAT;AAAA,MAACR,EAAW;AAAA,MAAX;AAAA,QACC,MAAK;AAAA,QACL,MAAK;AAAA,QACL,OAAO,EAAE,aAAa;AAAA,QACtB,yBAAuB;AAAA,QACvB,aAAaZ,KAAqB,EAAE,mBAAmB;AAAA,QACvD,OAAOH;AAAA,QACP,UAAUkB;AAAA,QACV,gBAAgB,gBAAAK,EAACU,GAAA,EAAW,eAAW,GAAA,CAAC;AAAA,MAAA;AAAA,IAAA,GAE5C;AAAA,IACA,gBAAAV,EAACW,KAAS,OAAOpC,KAAS,EAAE,YAAY,GAAI,GAAG+B,EAAA,CAAe;AAAA,EAAA,GAChE;AAEJ;AAEA,SAASL,EAAwB,EAAE,SAAAW,KAAgC;AACjE,QAAM,EAAE,MAAAC,EAAA,IAASpB,EAAA;AACjB,SAAO,gBAAAO,EAACa,KAAM,UAAAD,EAAA,CAAQ;AACxB;"}

package/dist/components/UNSTABLE_TimeOff/shared/EmployeeTable/EmployeeTable.module.scss.js

@@ -0,0 +1,10 @@
+const o = "_root_kciql_1", t = "_searchContainer_kciql_11", r = {
+  root: o,
+  searchContainer: t
+};
+export {
+  r as default,
+  o as root,
+  t as searchContainer
+};
+//# sourceMappingURL=EmployeeTable.module.scss.js.map

package/dist/components/UNSTABLE_TimeOff/shared/EmployeeTable/EmployeeTable.module.scss.js.map

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

package/dist/components/UNSTABLE_TimeOff/shared/EmployeeTable/EmployeeTableTypes.d.ts

@@ -2,6 +2,7 @@ import { ReactNode } from 'react';
 import { useDataViewProp, SelectionMode } from '../../../Common/DataView/useDataView';
 import { PaginationControlProps } from '../../../Common/PaginationControl/PaginationControlTypes';
 export interface EmployeeTableItem {
+    uuid: string;
     firstName?: string | null;
     lastName?: string | null;
     jobTitle?: string | null;

package/dist/contexts/GustoProvider/GustoProviderCustomUIAdapter.d.ts

@@ -19,6 +19,7 @@ export interface GustoProviderProps {
     locale?: string;
     currency?: string;
     theme?: GustoSDKTheme;
+    portalContainer?: HTMLElement;
     queryClient?: QueryClient;
     components: ComponentsContextType;
     LoaderComponent?: LoadingIndicatorContextProps['LoadingIndicator'];

package/dist/contexts/GustoProvider/GustoProviderCustomUIAdapter.js

@@ -1,36 +1,36 @@
 import { jsx as o } from "react/jsx-runtime";
-import { ErrorBoundary as E } from "react-error-boundary";
-import { I18nextProvider as g } from "react-i18next";
-import { useEffect as P, useMemo as k } from "react";
+import { ErrorBoundary as g } from "react-error-boundary";
+import { I18nextProvider as P } from "react-i18next";
+import { useEffect as k, useMemo as C } from "react";
 import { ComponentsProvider as S } from "../ComponentAdapter/ComponentsProvider.js";
-import { ApiProvider as C } from "../ApiProvider/ApiProvider.js";
-import { LoadingIndicatorProvider as I } from "../LoadingIndicatorProvider/LoadingIndicatorProvider.js";
-import { sanitizeError as L } from "../ObservabilityProvider/sanitization.js";
+import { ApiProvider as I } from "../ApiProvider/ApiProvider.js";
+import { LoadingIndicatorProvider as L } from "../LoadingIndicatorProvider/LoadingIndicatorProvider.js";
+import { sanitizeError as x } from "../ObservabilityProvider/sanitization.js";
 import { SDKI18next as m } from "./SDKI18next.js";
-import "../../shared/constants.js";
 import "classnames";
-import { InternalError as x } from "../../components/Common/InternalError/InternalError.js";
-import { LocaleProvider as z } from "../LocaleProvider/LocaleProvider.js";
+import { InternalError as z } from "../../components/Common/InternalError/InternalError.js";
+import { LocaleProvider as D } from "../LocaleProvider/LocaleProvider.js";
 import "../LocaleProvider/useLocale.js";
-import { ThemeProvider as D } from "../ThemeProvider/ThemeProvider.js";
-import { normalizeToSDKError as U } from "../../types/sdkError.js";
-import { ObservabilityProvider as T } from "../ObservabilityProvider/ObservabilityProvider.js";
+import { ThemeProvider as U } from "../ThemeProvider/ThemeProvider.js";
+import { normalizeToSDKError as T } from "../../types/sdkError.js";
+import { ObservabilityProvider as w } from "../ObservabilityProvider/ObservabilityProvider.js";
 const X = (s) => {
   const {
     children: l,
     config: r,
     dictionary: i,
-    lng: t = "en",
+    lng: n = "en",
     locale: c = "en-US",
     currency: d = "USD",
     theme: p,
-    components: v,
-    LoaderComponent: f,
-    queryClient: b
+    portalContainer: v,
+    components: f,
+    LoaderComponent: b,
+    queryClient: u
   } = s;
   if (i)
-    for (const n in i) {
-      const e = n;
+    for (const t in i) {
+      const e = t;
       for (const a in i[e])
         m.addResourceBundle(
           e,
@@ -40,31 +40,31 @@ const X = (s) => {
           !0
         );
     }
-  P(() => {
-    (async () => await m.changeLanguage(t))();
-  }, [t]);
-  const u = k(() => {
+  k(() => {
+    (async () => await m.changeLanguage(n))();
+  }, [n]);
+  const h = C(() => {
     if (r.observability?.onError)
-      return (n, e) => {
+      return (t, e) => {
         if (!r.observability?.onError) return;
-        const h = {
-          ...U(n),
+        const y = {
+          ...T(t),
           timestamp: Date.now(),
           componentStack: e.componentStack ?? void 0
-        }, y = L(h, r.observability.sanitization);
-        r.observability.onError(y);
+        }, E = x(y, r.observability.sanitization);
+        r.observability.onError(E);
       };
   }, [r.observability]);
-  return /* @__PURE__ */ o(S, { value: v, children: /* @__PURE__ */ o(I, { value: f, children: /* @__PURE__ */ o(T, { observability: r.observability, children: /* @__PURE__ */ o(E, { FallbackComponent: x, onError: u, children: /* @__PURE__ */ o(D, { theme: p, children: /* @__PURE__ */ o(z, { locale: c, currency: d, children: /* @__PURE__ */ o(g, { i18n: m, children: /* @__PURE__ */ o(
-    C,
+  return /* @__PURE__ */ o(S, { value: f, children: /* @__PURE__ */ o(L, { value: b, children: /* @__PURE__ */ o(w, { observability: r.observability, children: /* @__PURE__ */ o(g, { FallbackComponent: z, onError: h, children: /* @__PURE__ */ o(U, { theme: p, portalContainer: v, children: /* @__PURE__ */ o(D, { locale: c, currency: d, children: /* @__PURE__ */ o(P, { i18n: m, children: /* @__PURE__ */ o(
+    I,
     {
       url: r.baseUrl,
       headers: r.headers,
       hooks: r.hooks,
-      queryClient: b,
+      queryClient: u,
       children: l
     }
-  ) }, t) }) }) }) }) }) });
+  ) }, n) }) }) }) }) }) });
 };
 export {
   X as GustoProviderCustomUIAdapter

package/dist/contexts/GustoProvider/GustoProviderCustomUIAdapter.js.map

@@ -1 +1 @@
-{"version":3,"file":"GustoProviderCustomUIAdapter.js","sources":["../../../src/contexts/GustoProvider/GustoProviderCustomUIAdapter.tsx"],"sourcesContent":["import type React from 'react'\nimport type { ErrorInfo } from 'react'\nimport { ErrorBoundary } from 'react-error-boundary'\nimport { I18nextProvider } from 'react-i18next'\nimport type { QueryClient } from '@tanstack/react-query'\nimport { useEffect, useMemo } from 'react'\nimport { ComponentsProvider } from '../ComponentAdapter/ComponentsProvider'\nimport type { ComponentsContextType } from '../ComponentAdapter/useComponentContext'\nimport { ApiProvider } from '../ApiProvider/ApiProvider'\nimport { LoadingIndicatorProvider } from '../LoadingIndicatorProvider/LoadingIndicatorProvider'\nimport type { LoadingIndicatorContextProps } from '../LoadingIndicatorProvider/useLoadingIndicator'\nimport { ObservabilityProvider } from '../ObservabilityProvider'\nimport { sanitizeError } from '../ObservabilityProvider/sanitization'\nimport { SDKI18next } from './SDKI18next'\nimport { InternalError } from '@/components/Common'\nimport { LocaleProvider } from '@/contexts/LocaleProvider'\nimport { ThemeProvider } from '@/contexts/ThemeProvider'\nimport type { GustoSDKTheme } from '@/contexts/ThemeProvider/theme'\nimport type { ResourceDictionary, SupportedLanguages } from '@/types/Helpers'\nimport type { SDKHooks } from '@/types/hooks'\nimport type { ObservabilityHook } from '@/types/observability'\nimport { normalizeToSDKError } from '@/types/sdkError'\n\nexport interface APIConfig {\n  baseUrl: string\n  headers?: HeadersInit\n  hooks?: SDKHooks\n  observability?: ObservabilityHook\n}\n\nexport interface GustoProviderProps {\n  config: APIConfig\n  dictionary?: ResourceDictionary\n  lng?: string\n  locale?: string\n  currency?: string\n  theme?: GustoSDKTheme\n  queryClient?: QueryClient\n  components: ComponentsContextType\n  LoaderComponent?: LoadingIndicatorContextProps['LoadingIndicator']\n}\n\nexport interface GustoProviderCustomUIAdapterProps extends GustoProviderProps {\n  children?: React.ReactNode\n}\n\n/**\n * A provider that accepts UI component adapters through the components prop\n */\nconst GustoProviderCustomUIAdapter: React.FC<GustoProviderCustomUIAdapterProps> = props => {\n  const {\n    children,\n    config,\n    dictionary,\n    lng = 'en',\n    locale = 'en-US',\n    currency = 'USD',\n    theme,\n    components,\n    LoaderComponent,\n    queryClient,\n  } = props\n\n  if (dictionary) {\n    for (const language in dictionary) {\n      const lang = language as SupportedLanguages\n      for (const ns in dictionary[lang]) {\n        SDKI18next.addResourceBundle(\n          lang,\n          ns,\n          (dictionary[lang] as Record<string, unknown>)[ns],\n          true,\n          true,\n        )\n      }\n    }\n  }\n\n  useEffect(() => {\n    void (async () => {\n      await SDKI18next.changeLanguage(lng)\n    })()\n  }, [lng])\n\n  const handleTopLevelError = useMemo(() => {\n    if (!config.observability?.onError) return undefined\n\n    return (error: unknown, errorInfo: ErrorInfo) => {\n      if (!config.observability?.onError) return\n\n      const sdkError = normalizeToSDKError(error)\n\n      const observabilityError = {\n        ...sdkError,\n        timestamp: Date.now(),\n        componentStack: errorInfo.componentStack ?? undefined,\n      }\n\n      const sanitizedError = sanitizeError(observabilityError, config.observability.sanitization)\n\n      config.observability.onError(sanitizedError)\n    }\n  }, [config.observability])\n  return (\n    <ComponentsProvider value={components}>\n      <LoadingIndicatorProvider value={LoaderComponent}>\n        <ObservabilityProvider observability={config.observability}>\n          <ErrorBoundary FallbackComponent={InternalError} onError={handleTopLevelError}>\n            <ThemeProvider theme={theme}>\n              <LocaleProvider locale={locale} currency={currency}>\n                <I18nextProvider i18n={SDKI18next} key={lng}>\n                  <ApiProvider\n                    url={config.baseUrl}\n                    headers={config.headers}\n                    hooks={config.hooks}\n                    queryClient={queryClient}\n                  >\n                    {children}\n                  </ApiProvider>\n                </I18nextProvider>\n              </LocaleProvider>\n            </ThemeProvider>\n          </ErrorBoundary>\n        </ObservabilityProvider>\n      </LoadingIndicatorProvider>\n    </ComponentsProvider>\n  )\n}\n\nexport { GustoProviderCustomUIAdapter }\n"],"names":["GustoProviderCustomUIAdapter","props","children","config","dictionary","lng","locale","currency","theme","components","LoaderComponent","queryClient","language","lang","ns","SDKI18next","useEffect","handleTopLevelError","useMemo","error","errorInfo","observabilityError","normalizeToSDKError","sanitizedError","sanitizeError","jsx","ComponentsProvider","LoadingIndicatorProvider","ObservabilityProvider","ErrorBoundary","InternalError","ThemeProvider","LocaleProvider","I18nextProvider","ApiProvider"],"mappings":";;;;;;;;;;;;;;;;;AAiDA,MAAMA,IAA4E,CAAAC,MAAS;AACzF,QAAM;AAAA,IACJ,UAAAC;AAAA,IACA,QAAAC;AAAA,IACA,YAAAC;AAAA,IACA,KAAAC,IAAM;AAAA,IACN,QAAAC,IAAS;AAAA,IACT,UAAAC,IAAW;AAAA,IACX,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,aAAAC;AAAA,EAAA,IACEV;AAEJ,MAAIG;AACF,eAAWQ,KAAYR,GAAY;AACjC,YAAMS,IAAOD;AACb,iBAAWE,KAAMV,EAAWS,CAAI;AAC9B,QAAAE,EAAW;AAAA,UACTF;AAAA,UACAC;AAAA,UACCV,EAAWS,CAAI,EAA8BC,CAAE;AAAA,UAChD;AAAA,UACA;AAAA,QAAA;AAAA,IAGN;AAGF,EAAAE,EAAU,MAAM;AACd,KAAM,YACJ,MAAMD,EAAW,eAAeV,CAAG;AAAA,EAEvC,GAAG,CAACA,CAAG,CAAC;AAER,QAAMY,IAAsBC,EAAQ,MAAM;AACxC,QAAKf,EAAO,eAAe;AAE3B,aAAO,CAACgB,GAAgBC,MAAyB;AAC/C,YAAI,CAACjB,EAAO,eAAe,QAAS;AAIpC,cAAMkB,IAAqB;AAAA,UACzB,GAHeC,EAAoBH,CAAK;AAAA,UAIxC,WAAW,KAAK,IAAA;AAAA,UAChB,gBAAgBC,EAAU,kBAAkB;AAAA,QAAA,GAGxCG,IAAiBC,EAAcH,GAAoBlB,EAAO,cAAc,YAAY;AAE1F,QAAAA,EAAO,cAAc,QAAQoB,CAAc;AAAA,MAC7C;AAAA,EACF,GAAG,CAACpB,EAAO,aAAa,CAAC;AACzB,SACE,gBAAAsB,EAACC,GAAA,EAAmB,OAAOjB,GACzB,UAAA,gBAAAgB,EAACE,GAAA,EAAyB,OAAOjB,GAC/B,UAAA,gBAAAe,EAACG,GAAA,EAAsB,eAAezB,EAAO,eAC3C,UAAA,gBAAAsB,EAACI,GAAA,EAAc,mBAAmBC,GAAe,SAASb,GACxD,UAAA,gBAAAQ,EAACM,GAAA,EAAc,OAAAvB,GACb,UAAA,gBAAAiB,EAACO,GAAA,EAAe,QAAA1B,GAAgB,UAAAC,GAC9B,UAAA,gBAAAkB,EAACQ,GAAA,EAAgB,MAAMlB,GACrB,UAAA,gBAAAU;AAAA,IAACS;AAAA,IAAA;AAAA,MACC,KAAK/B,EAAO;AAAA,MACZ,SAASA,EAAO;AAAA,MAChB,OAAOA,EAAO;AAAA,MACd,aAAAQ;AAAA,MAEC,UAAAT;AAAA,IAAA;AAAA,EAAA,KAPmCG,CASxC,GACF,GACF,EAAA,CACF,EAAA,CACF,GACF,GACF;AAEJ;"}
+{"version":3,"file":"GustoProviderCustomUIAdapter.js","sources":["../../../src/contexts/GustoProvider/GustoProviderCustomUIAdapter.tsx"],"sourcesContent":["import type React from 'react'\nimport type { ErrorInfo } from 'react'\nimport { ErrorBoundary } from 'react-error-boundary'\nimport { I18nextProvider } from 'react-i18next'\nimport type { QueryClient } from '@tanstack/react-query'\nimport { useEffect, useMemo } from 'react'\nimport { ComponentsProvider } from '../ComponentAdapter/ComponentsProvider'\nimport type { ComponentsContextType } from '../ComponentAdapter/useComponentContext'\nimport { ApiProvider } from '../ApiProvider/ApiProvider'\nimport { LoadingIndicatorProvider } from '../LoadingIndicatorProvider/LoadingIndicatorProvider'\nimport type { LoadingIndicatorContextProps } from '../LoadingIndicatorProvider/useLoadingIndicator'\nimport { ObservabilityProvider } from '../ObservabilityProvider'\nimport { sanitizeError } from '../ObservabilityProvider/sanitization'\nimport { SDKI18next } from './SDKI18next'\nimport { InternalError } from '@/components/Common'\nimport { LocaleProvider } from '@/contexts/LocaleProvider'\nimport { ThemeProvider } from '@/contexts/ThemeProvider'\nimport type { GustoSDKTheme } from '@/contexts/ThemeProvider/theme'\nimport type { ResourceDictionary, SupportedLanguages } from '@/types/Helpers'\nimport type { SDKHooks } from '@/types/hooks'\nimport type { ObservabilityHook } from '@/types/observability'\nimport { normalizeToSDKError } from '@/types/sdkError'\n\nexport interface APIConfig {\n  baseUrl: string\n  headers?: HeadersInit\n  hooks?: SDKHooks\n  observability?: ObservabilityHook\n}\n\nexport interface GustoProviderProps {\n  config: APIConfig\n  dictionary?: ResourceDictionary\n  lng?: string\n  locale?: string\n  currency?: string\n  theme?: GustoSDKTheme\n  portalContainer?: HTMLElement\n  queryClient?: QueryClient\n  components: ComponentsContextType\n  LoaderComponent?: LoadingIndicatorContextProps['LoadingIndicator']\n}\n\nexport interface GustoProviderCustomUIAdapterProps extends GustoProviderProps {\n  children?: React.ReactNode\n}\n\n/**\n * A provider that accepts UI component adapters through the components prop\n */\nconst GustoProviderCustomUIAdapter: React.FC<GustoProviderCustomUIAdapterProps> = props => {\n  const {\n    children,\n    config,\n    dictionary,\n    lng = 'en',\n    locale = 'en-US',\n    currency = 'USD',\n    theme,\n    portalContainer,\n    components,\n    LoaderComponent,\n    queryClient,\n  } = props\n\n  if (dictionary) {\n    for (const language in dictionary) {\n      const lang = language as SupportedLanguages\n      for (const ns in dictionary[lang]) {\n        SDKI18next.addResourceBundle(\n          lang,\n          ns,\n          (dictionary[lang] as Record<string, unknown>)[ns],\n          true,\n          true,\n        )\n      }\n    }\n  }\n\n  useEffect(() => {\n    void (async () => {\n      await SDKI18next.changeLanguage(lng)\n    })()\n  }, [lng])\n\n  const handleTopLevelError = useMemo(() => {\n    if (!config.observability?.onError) return undefined\n\n    return (error: unknown, errorInfo: ErrorInfo) => {\n      if (!config.observability?.onError) return\n\n      const sdkError = normalizeToSDKError(error)\n\n      const observabilityError = {\n        ...sdkError,\n        timestamp: Date.now(),\n        componentStack: errorInfo.componentStack ?? undefined,\n      }\n\n      const sanitizedError = sanitizeError(observabilityError, config.observability.sanitization)\n\n      config.observability.onError(sanitizedError)\n    }\n  }, [config.observability])\n  return (\n    <ComponentsProvider value={components}>\n      <LoadingIndicatorProvider value={LoaderComponent}>\n        <ObservabilityProvider observability={config.observability}>\n          <ErrorBoundary FallbackComponent={InternalError} onError={handleTopLevelError}>\n            <ThemeProvider theme={theme} portalContainer={portalContainer}>\n              <LocaleProvider locale={locale} currency={currency}>\n                <I18nextProvider i18n={SDKI18next} key={lng}>\n                  <ApiProvider\n                    url={config.baseUrl}\n                    headers={config.headers}\n                    hooks={config.hooks}\n                    queryClient={queryClient}\n                  >\n                    {children}\n                  </ApiProvider>\n                </I18nextProvider>\n              </LocaleProvider>\n            </ThemeProvider>\n          </ErrorBoundary>\n        </ObservabilityProvider>\n      </LoadingIndicatorProvider>\n    </ComponentsProvider>\n  )\n}\n\nexport { GustoProviderCustomUIAdapter }\n"],"names":["GustoProviderCustomUIAdapter","props","children","config","dictionary","lng","locale","currency","theme","portalContainer","components","LoaderComponent","queryClient","language","lang","ns","SDKI18next","useEffect","handleTopLevelError","useMemo","error","errorInfo","observabilityError","normalizeToSDKError","sanitizedError","sanitizeError","jsx","ComponentsProvider","LoadingIndicatorProvider","ObservabilityProvider","ErrorBoundary","InternalError","ThemeProvider","LocaleProvider","I18nextProvider","ApiProvider"],"mappings":";;;;;;;;;;;;;;;;AAkDA,MAAMA,IAA4E,CAAAC,MAAS;AACzF,QAAM;AAAA,IACJ,UAAAC;AAAA,IACA,QAAAC;AAAA,IACA,YAAAC;AAAA,IACA,KAAAC,IAAM;AAAA,IACN,QAAAC,IAAS;AAAA,IACT,UAAAC,IAAW;AAAA,IACX,OAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,aAAAC;AAAA,EAAA,IACEX;AAEJ,MAAIG;AACF,eAAWS,KAAYT,GAAY;AACjC,YAAMU,IAAOD;AACb,iBAAWE,KAAMX,EAAWU,CAAI;AAC9B,QAAAE,EAAW;AAAA,UACTF;AAAA,UACAC;AAAA,UACCX,EAAWU,CAAI,EAA8BC,CAAE;AAAA,UAChD;AAAA,UACA;AAAA,QAAA;AAAA,IAGN;AAGF,EAAAE,EAAU,MAAM;AACd,KAAM,YACJ,MAAMD,EAAW,eAAeX,CAAG;AAAA,EAEvC,GAAG,CAACA,CAAG,CAAC;AAER,QAAMa,IAAsBC,EAAQ,MAAM;AACxC,QAAKhB,EAAO,eAAe;AAE3B,aAAO,CAACiB,GAAgBC,MAAyB;AAC/C,YAAI,CAAClB,EAAO,eAAe,QAAS;AAIpC,cAAMmB,IAAqB;AAAA,UACzB,GAHeC,EAAoBH,CAAK;AAAA,UAIxC,WAAW,KAAK,IAAA;AAAA,UAChB,gBAAgBC,EAAU,kBAAkB;AAAA,QAAA,GAGxCG,IAAiBC,EAAcH,GAAoBnB,EAAO,cAAc,YAAY;AAE1F,QAAAA,EAAO,cAAc,QAAQqB,CAAc;AAAA,MAC7C;AAAA,EACF,GAAG,CAACrB,EAAO,aAAa,CAAC;AACzB,SACE,gBAAAuB,EAACC,GAAA,EAAmB,OAAOjB,GACzB,UAAA,gBAAAgB,EAACE,GAAA,EAAyB,OAAOjB,GAC/B,UAAA,gBAAAe,EAACG,GAAA,EAAsB,eAAe1B,EAAO,eAC3C,UAAA,gBAAAuB,EAACI,GAAA,EAAc,mBAAmBC,GAAe,SAASb,GACxD,UAAA,gBAAAQ,EAACM,GAAA,EAAc,OAAAxB,GAAc,iBAAAC,GAC3B,UAAA,gBAAAiB,EAACO,GAAA,EAAe,QAAA3B,GAAgB,UAAAC,GAC9B,UAAA,gBAAAmB,EAACQ,GAAA,EAAgB,MAAMlB,GACrB,UAAA,gBAAAU;AAAA,IAACS;AAAA,IAAA;AAAA,MACC,KAAKhC,EAAO;AAAA,MACZ,SAASA,EAAO;AAAA,MAChB,OAAOA,EAAO;AAAA,MACd,aAAAS;AAAA,MAEC,UAAAV;AAAA,IAAA;AAAA,EAAA,KAPmCG,CASxC,GACF,GACF,EAAA,CACF,EAAA,CACF,GACF,GACF;AAEJ;"}

package/dist/contexts/ThemeProvider/ThemeProvider.d.ts

@@ -2,6 +2,14 @@ import { default as React } from 'react';
 import { GustoSDKTheme } from './theme';
 export interface ThemeProviderProps {
     theme?: GustoSDKTheme;
+    /**
+     * Element to use as the portal container for all SDK overlays (Select, ComboBox,
+     * DatePicker, Menu, etc.). Defaults to the SDK's root article element.
+     *
+     * Pass `document.body` (or another stable element outside the SDK's container)
+     * when your app's scroll or clipping context interferes with overlay positioning.
+     */
+    portalContainer?: HTMLElement;
     children?: React.ReactNode;
 }
 export declare const ThemeProvider: React.FC<ThemeProviderProps>;

package/dist/contexts/ThemeProvider/ThemeProvider.js

@@ -1,33 +1,38 @@
-import { jsx as c } from "react/jsx-runtime";
-import { useRef as m, useMemo as u, useEffect as i } from "react";
-import { ThemeContext as l } from "./useTheme.js";
-import { mergePartnerTheme as d } from "./theme.js";
+import { jsx as m } from "react/jsx-runtime";
+import { useRef as u, useCallback as f, useMemo as a, useEffect as h } from "react";
+import { ThemeContext as p } from "./useTheme.js";
+import { mergePartnerTheme as C } from "./theme.js";
 /* empty css                    */
-const C = ({
+const D = ({
   theme: n = {},
-  children: r
+  portalContainer: t,
+  children: o
 }) => {
-  const e = m(null), t = m(null), o = u(
-    () => d(n),
+  const e = u(null), r = u(null), i = f(
+    (d) => {
+      r.current = t ?? d;
+    },
+    [t]
+  ), s = a(
+    () => C(n),
     [n]
-  ), s = u(
+  ), c = a(
     () => `.GSDK{
-${a(o).join(`
+${l(s).join(`
 `)}
 }`,
-    [o]
+    [s]
   );
-  return i(() => {
-    e.current || (e.current = document.createElement("style"), e.current.setAttribute("data-testid", "GSDK"), document.head.appendChild(e.current)), e.current.textContent = s;
-  }, [s]), // @ts-expect-error HACK fix mismatch where containerRef allows null
-  /* @__PURE__ */ c(l.Provider, { value: { container: t }, children: /* @__PURE__ */ c("article", { className: "GSDK", "data-testid": "GSDK", ref: t, children: r }) });
-}, a = (n, r) => {
-  const e = [];
-  for (const [t, o] of Object.entries(n))
-    typeof o == "object" ? e.push(...a(o, r ? r + "-" + t : t)) : e.push(`--g-${r ? r + "-" + t : t}: ${o};`);
-  return e;
+  return h(() => {
+    e.current || (e.current = document.createElement("style"), e.current.setAttribute("data-testid", "GSDK"), document.head.appendChild(e.current)), e.current.textContent = c;
+  }, [c]), /* @__PURE__ */ m(p.Provider, { value: { container: r }, children: /* @__PURE__ */ m("article", { className: "GSDK", "data-testid": "GSDK", ref: i, children: o }) });
+}, l = (n, t) => {
+  const o = [];
+  for (const [e, r] of Object.entries(n))
+    typeof r == "object" ? o.push(...l(r, t ? t + "-" + e : e)) : o.push(`--g-${t ? t + "-" + e : e}: ${r};`);
+  return o;
 };
 export {
-  C as ThemeProvider
+  D as ThemeProvider
 };
 //# sourceMappingURL=ThemeProvider.js.map

package/dist/contexts/ThemeProvider/ThemeProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.js","sources":["../../../src/contexts/ThemeProvider/ThemeProvider.tsx"],"sourcesContent":["import type React from 'react'\nimport { useEffect, useMemo, useRef } from 'react'\nimport { ThemeContext } from './useTheme'\nimport { mergePartnerTheme, type GustoSDKTheme } from './theme'\nimport '@/styles/sdk.scss'\n\nexport interface ThemeProviderProps {\n  theme?: GustoSDKTheme\n  children?: React.ReactNode\n}\n\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({\n  theme: partnerThemeOverrides = {},\n  children,\n}) => {\n  const GThemeVariables = useRef<HTMLStyleElement | null>(null)\n  const containerRef = useRef<HTMLElement>(null)\n\n  const mergedTheme = useMemo(\n    () => mergePartnerTheme(partnerThemeOverrides),\n    [partnerThemeOverrides],\n  )\n\n  const cssContent = useMemo(\n    () => `.GSDK{\\n${parseThemeToCSS(mergedTheme).join('\\n')}\\n}`,\n    [mergedTheme],\n  )\n\n  useEffect(() => {\n    if (!GThemeVariables.current) {\n      GThemeVariables.current = document.createElement('style')\n      GThemeVariables.current.setAttribute('data-testid', 'GSDK')\n      document.head.appendChild(GThemeVariables.current)\n    }\n\n    GThemeVariables.current.textContent = cssContent\n  }, [cssContent])\n\n  return (\n    // @ts-expect-error HACK fix mismatch where containerRef allows null\n    <ThemeContext.Provider value={{ container: containerRef }}>\n      <article className=\"GSDK\" data-testid=\"GSDK\" ref={containerRef}>\n        {children}\n      </article>\n    </ThemeContext.Provider>\n  )\n}\n\n/**\n * Recursive flattening of the theme object into css variable format\n */\nconst parseThemeToCSS = (theme: GustoSDKTheme, prefix?: string): string[] => {\n  const cssProps: string[] = []\n  for (const [key, value] of Object.entries(theme)) {\n    if (typeof value === 'object') {\n      cssProps.push(...parseThemeToCSS(value, prefix ? prefix + '-' + key : key))\n    } else {\n      cssProps.push(`--g-${prefix ? prefix + '-' + key : key}: ${value};`)\n    }\n  }\n  return cssProps\n}\n"],"names":["ThemeProvider","partnerThemeOverrides","children","GThemeVariables","useRef","containerRef","mergedTheme","useMemo","mergePartnerTheme","cssContent","parseThemeToCSS","useEffect","ThemeContext","jsx","theme","prefix","cssProps","key","value"],"mappings":";;;;;AAWO,MAAMA,IAA8C,CAAC;AAAA,EAC1D,OAAOC,IAAwB,CAAA;AAAA,EAC/B,UAAAC;AACF,MAAM;AACJ,QAAMC,IAAkBC,EAAgC,IAAI,GACtDC,IAAeD,EAAoB,IAAI,GAEvCE,IAAcC;AAAA,IAClB,MAAMC,EAAkBP,CAAqB;AAAA,IAC7C,CAACA,CAAqB;AAAA,EAAA,GAGlBQ,IAAaF;AAAA,IACjB,MAAM;AAAA,EAAWG,EAAgBJ,CAAW,EAAE,KAAK;AAAA,CAAI,CAAC;AAAA;AAAA,IACxD,CAACA,CAAW;AAAA,EAAA;AAGd,SAAAK,EAAU,MAAM;AACd,IAAKR,EAAgB,YACnBA,EAAgB,UAAU,SAAS,cAAc,OAAO,GACxDA,EAAgB,QAAQ,aAAa,eAAe,MAAM,GAC1D,SAAS,KAAK,YAAYA,EAAgB,OAAO,IAGnDA,EAAgB,QAAQ,cAAcM;AAAA,EACxC,GAAG,CAACA,CAAU,CAAC;AAAA,oBAIZG,EAAa,UAAb,EAAsB,OAAO,EAAE,WAAWP,EAAA,GACzC,UAAA,gBAAAQ,EAAC,WAAA,EAAQ,WAAU,QAAO,eAAY,QAAO,KAAKR,GAC/C,UAAAH,GACH,EAAA,CACF;AAEJ,GAKMQ,IAAkB,CAACI,GAAsBC,MAA8B;AAC3E,QAAMC,IAAqB,CAAA;AAC3B,aAAW,CAACC,GAAKC,CAAK,KAAK,OAAO,QAAQJ,CAAK;AAC7C,IAAI,OAAOI,KAAU,WACnBF,EAAS,KAAK,GAAGN,EAAgBQ,GAAOH,IAASA,IAAS,MAAME,IAAMA,CAAG,CAAC,IAE1ED,EAAS,KAAK,OAAOD,IAASA,IAAS,MAAME,IAAMA,CAAG,KAAKC,CAAK,GAAG;AAGvE,SAAOF;AACT;"}
+{"version":3,"file":"ThemeProvider.js","sources":["../../../src/contexts/ThemeProvider/ThemeProvider.tsx"],"sourcesContent":["import type React from 'react'\nimport { useCallback, useEffect, useMemo, useRef } from 'react'\nimport { ThemeContext } from './useTheme'\nimport { mergePartnerTheme, type GustoSDKTheme } from './theme'\nimport '@/styles/sdk.scss'\n\nexport interface ThemeProviderProps {\n  theme?: GustoSDKTheme\n  /**\n   * Element to use as the portal container for all SDK overlays (Select, ComboBox,\n   * DatePicker, Menu, etc.). Defaults to the SDK's root article element.\n   *\n   * Pass `document.body` (or another stable element outside the SDK's container)\n   * when your app's scroll or clipping context interferes with overlay positioning.\n   */\n  portalContainer?: HTMLElement\n  children?: React.ReactNode\n}\n\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({\n  theme: partnerThemeOverrides = {},\n  portalContainer,\n  children,\n}) => {\n  const GThemeVariables = useRef<HTMLStyleElement | null>(null)\n  const portalContainerRef = useRef<HTMLElement | null>(null)\n\n  const articleRef = useCallback(\n    (el: HTMLElement | null) => {\n      portalContainerRef.current = portalContainer ?? el\n    },\n    [portalContainer],\n  )\n\n  const mergedTheme = useMemo(\n    () => mergePartnerTheme(partnerThemeOverrides),\n    [partnerThemeOverrides],\n  )\n\n  const cssContent = useMemo(\n    () => `.GSDK{\\n${parseThemeToCSS(mergedTheme).join('\\n')}\\n}`,\n    [mergedTheme],\n  )\n\n  useEffect(() => {\n    if (!GThemeVariables.current) {\n      GThemeVariables.current = document.createElement('style')\n      GThemeVariables.current.setAttribute('data-testid', 'GSDK')\n      document.head.appendChild(GThemeVariables.current)\n    }\n\n    GThemeVariables.current.textContent = cssContent\n  }, [cssContent])\n\n  return (\n    <ThemeContext.Provider value={{ container: portalContainerRef }}>\n      <article className=\"GSDK\" data-testid=\"GSDK\" ref={articleRef}>\n        {children}\n      </article>\n    </ThemeContext.Provider>\n  )\n}\n\n/**\n * Recursive flattening of the theme object into css variable format\n */\nconst parseThemeToCSS = (theme: GustoSDKTheme, prefix?: string): string[] => {\n  const cssProps: string[] = []\n  for (const [key, value] of Object.entries(theme)) {\n    if (typeof value === 'object') {\n      cssProps.push(...parseThemeToCSS(value, prefix ? prefix + '-' + key : key))\n    } else {\n      cssProps.push(`--g-${prefix ? prefix + '-' + key : key}: ${value};`)\n    }\n  }\n  return cssProps\n}\n"],"names":["ThemeProvider","partnerThemeOverrides","portalContainer","children","GThemeVariables","useRef","portalContainerRef","articleRef","useCallback","el","mergedTheme","useMemo","mergePartnerTheme","cssContent","parseThemeToCSS","useEffect","ThemeContext","jsx","theme","prefix","cssProps","key","value"],"mappings":";;;;;AAmBO,MAAMA,IAA8C,CAAC;AAAA,EAC1D,OAAOC,IAAwB,CAAA;AAAA,EAC/B,iBAAAC;AAAA,EACA,UAAAC;AACF,MAAM;AACJ,QAAMC,IAAkBC,EAAgC,IAAI,GACtDC,IAAqBD,EAA2B,IAAI,GAEpDE,IAAaC;AAAA,IACjB,CAACC,MAA2B;AAC1B,MAAAH,EAAmB,UAAUJ,KAAmBO;AAAA,IAClD;AAAA,IACA,CAACP,CAAe;AAAA,EAAA,GAGZQ,IAAcC;AAAA,IAClB,MAAMC,EAAkBX,CAAqB;AAAA,IAC7C,CAACA,CAAqB;AAAA,EAAA,GAGlBY,IAAaF;AAAA,IACjB,MAAM;AAAA,EAAWG,EAAgBJ,CAAW,EAAE,KAAK;AAAA,CAAI,CAAC;AAAA;AAAA,IACxD,CAACA,CAAW;AAAA,EAAA;AAGd,SAAAK,EAAU,MAAM;AACd,IAAKX,EAAgB,YACnBA,EAAgB,UAAU,SAAS,cAAc,OAAO,GACxDA,EAAgB,QAAQ,aAAa,eAAe,MAAM,GAC1D,SAAS,KAAK,YAAYA,EAAgB,OAAO,IAGnDA,EAAgB,QAAQ,cAAcS;AAAA,EACxC,GAAG,CAACA,CAAU,CAAC,qBAGZG,EAAa,UAAb,EAAsB,OAAO,EAAE,WAAWV,EAAA,GACzC,UAAA,gBAAAW,EAAC,WAAA,EAAQ,WAAU,QAAO,eAAY,QAAO,KAAKV,GAC/C,UAAAJ,GACH,GACF;AAEJ,GAKMW,IAAkB,CAACI,GAAsBC,MAA8B;AAC3E,QAAMC,IAAqB,CAAA;AAC3B,aAAW,CAACC,GAAKC,CAAK,KAAK,OAAO,QAAQJ,CAAK;AAC7C,IAAI,OAAOI,KAAU,WACnBF,EAAS,KAAK,GAAGN,EAAgBQ,GAAOH,IAASA,IAAS,MAAME,IAAMA,CAAG,CAAC,IAE1ED,EAAS,KAAK,OAAOD,IAASA,IAAS,MAAME,IAAMA,CAAG,KAAKC,CAAK,GAAG;AAGvE,SAAOF;AACT;"}

package/dist/contexts/ThemeProvider/useTheme.d.ts

@@ -1,5 +1,5 @@
 export interface ThemeContextProps {
-    container: React.RefObject<HTMLElement>;
+    container: React.RefObject<HTMLElement | null>;
 }
 export declare const ThemeContext: import('react').Context<ThemeContextProps>;
 export declare const useTheme: () => ThemeContextProps;

package/dist/contexts/ThemeProvider/useTheme.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTheme.js","sources":["../../../src/contexts/ThemeProvider/useTheme.ts"],"sourcesContent":["import { createContext, useContext } from 'react'\n\nexport interface ThemeContextProps {\n  container: React.RefObject<HTMLElement>\n}\nexport const ThemeContext = createContext({} as ThemeContextProps)\n\nexport const useTheme = () => useContext(ThemeContext)\n"],"names":["ThemeContext","createContext","useTheme","useContext"],"mappings":";AAKO,MAAMA,IAAeC,EAAc,CAAA,CAAuB,GAEpDC,IAAW,MAAMC,EAAWH,CAAY;"}
+{"version":3,"file":"useTheme.js","sources":["../../../src/contexts/ThemeProvider/useTheme.ts"],"sourcesContent":["import { createContext, useContext } from 'react'\n\nexport interface ThemeContextProps {\n  container: React.RefObject<HTMLElement | null>\n}\nexport const ThemeContext = createContext({} as ThemeContextProps)\n\nexport const useTheme = () => useContext(ThemeContext)\n"],"names":["ThemeContext","createContext","useTheme","useContext"],"mappings":";AAKO,MAAMA,IAAeC,EAAc,CAAA,CAAuB,GAEpDC,IAAW,MAAMC,EAAWH,CAAY;"}

package/dist/helpers/breadcrumbHelpers.d.ts

@@ -1,4 +1,11 @@
 import { BreadcrumbNodes, BreadcrumbTrail } from '../components/Common/FlowBreadcrumbs/FlowBreadcrumbsTypes';
+import { FlowHeaderConfig } from '../components/Flow/useFlow';
+type BreadcrumbsHeader = Extract<FlowHeaderConfig, {
+    type: 'breadcrumbs';
+}>;
+type WithHeader = {
+    header?: FlowHeaderConfig | null;
+};
 /**
  * Builds a complete breadcrumb trail map from a hierarchical node structure.
  *
@@ -16,32 +23,38 @@ export declare const buildBreadcrumbs: (nodes: BreadcrumbNodes) => BreadcrumbTra
  */
 export declare const resolveBreadcrumbVariables: (variables: Record<string, string> | undefined, context: Record<string, unknown>) => Record<string, unknown>;
 /**
- * Removes a breadcrumb from all trails in the context.
- * Use this in state machine reducers to hide a step entirely (e.g. after payroll submission).
+ * Merges `patch` fields into the existing breadcrumbs header on a context,
+ * preserving the existing trails and CTA. If the context has no breadcrumbs
+ * header, a fresh one is created. Useful when a transition needs to flip
+ * breadcrumbs visibility (`currentBreadcrumbId`) without rebuilding any
+ * trails.
+ */
+export declare const patchBreadcrumbsHeader: <T extends WithHeader>(context: T, patch: Partial<Omit<BreadcrumbsHeader, "type">>) => T & {
+    header: BreadcrumbsHeader;
+};
+/**
+ * Removes a breadcrumb from all trails in the context's breadcrumbs header.
+ * Use this in state machine reducers to hide a step entirely (e.g. after
+ * payroll submission).
  */
-export declare const hideBreadcrumb: <T extends {
-    breadcrumbs?: BreadcrumbTrail;
-}>(breadcrumbId: string, context: T) => T;
+export declare const hideBreadcrumb: <T extends WithHeader>(breadcrumbId: string, context: T) => T;
 /**
- * Marks a breadcrumb as non-navigable across all trails in the context.
- * Use this in state machine reducers to disable backward navigation to a specific step.
+ * Marks a breadcrumb as non-navigable across all trails in the context's
+ * breadcrumbs header. Use this in state machine reducers to disable backward
+ * navigation to a specific step.
  */
-export declare const lockBreadcrumb: <T extends {
-    breadcrumbs?: BreadcrumbTrail;
-}>(breadcrumbId: string, context: T) => T;
+export declare const lockBreadcrumb: <T extends WithHeader>(breadcrumbId: string, context: T) => T;
 /**
- * Updates the breadcrumb trail for a specific state with resolved variables.
+ * Updates the breadcrumb trail for a specific state with resolved variables
+ * and switches the active breadcrumb to that state.
  *
- * This function is typically used in state machine transitions to update breadcrumb
- * navigation when moving between states. It preserves all existing breadcrumb trails
- * for other states and only updates the trail for the specified state by resolving
- * any template variables for that state's breadcrumb.
-
+ * This function is typically used in state machine transitions to update
+ * breadcrumb navigation when moving between states. It preserves all existing
+ * breadcrumb trails for other states and only updates the trail for the
+ * specified state by resolving any template variables for that state's
+ * breadcrumb. The resulting context's header is always of type `'breadcrumbs'`.
  */
-export declare const updateBreadcrumbs: <T extends {
-    breadcrumbs?: BreadcrumbTrail;
-    currentBreadcrumb?: string;
-}>(stateName: string, context: T, variables?: Record<string, string>) => Omit<T, "breadcrumbs" | "currentBreadcrumb"> & {
-    breadcrumbs: BreadcrumbTrail;
-    currentBreadcrumbId: string;
+export declare const updateBreadcrumbs: <T extends WithHeader>(stateName: string, context: T, variables?: Record<string, string>) => T & {
+    header: BreadcrumbsHeader;
 };
+export {};