@gusto/embedded-react-sdk 0.55.7 → 0.56.0

package/CHANGELOG.md

@@ -1,5 +1,68 @@
 # Changelog
 
+## [0.56.0](https://github.com/Gusto/embedded-react-sdk/compare/v0.55.8...v0.56.0) (2026-09-21)
+
+### ⚠ Breaking Changes
+
+- **The default portal container for SDK overlays (`Select`, `ComboBox`, `Menu`, `DatePicker`, `MultiSelectComboBox`) is no longer the SDK's in-place root element — it's now a dedicated root appended to `document.body`** ([#2808](https://github.com/Gusto/embedded-react-sdk/issues/2808)). This fixes overlays collapsing (`max-height: 0`) when a host page puts `position`, `transform`, `filter`, or `contain` on any ancestor between the SDK root and the viewport. Three things to check:
+
+  - If you have CSS descendant selectors scoped to the SDK root that expect overlay content to render in-place (e.g. `.your-scope .GSDK [role="listbox"]`), they'll no longer match. Pass an explicit `portalContainer` to `GustoProvider` to restore in-place rendering:
+
+    ```diff
+     <GustoProvider
+    -  config={config}
+    +  config={config}
+    +  portalContainer={myContainerRef.current}
+     >
+    ```
+
+  - If you render the SDK inside a shadow root, `portalContainer` is now **required** — `document.body` sits outside every shadow boundary, so without one, overlays escape your shadow root's style encapsulation entirely.
+  - The new default portal root carries both the `GSDK` and `GSDK-portal-root` classes. If you have a global `.GSDK { ... }` override on the host page, it now also reaches the portal root — scope it to `.GSDK:not(.GSDK-portal-root)` if that's not intended.
+
+  See the [theming guide](https://github.com/Gusto/embedded-react-sdk/blob/main/docs/guides/theming.md) for details.
+
+### Features & Enhancements
+
+- `MultiSelectComboBox` accepts a `portalContainer` prop, matching `Select`, `ComboBox`, `Menu`, and `DatePicker` ([#2808](https://github.com/Gusto/embedded-react-sdk/issues/2808))
+
+### Fixes
+
+- Align payroll receipt sub-tables to full receipt width ([#2807](https://github.com/Gusto/embedded-react-sdk/issues/2807))
+- Return to the employee list when exiting, cancelling, or completing an offboarding payroll launched from `TerminationFlow` ([#2814](https://github.com/Gusto/embedded-react-sdk/issues/2814))
+- Show a "Last day" badge instead of the dismiss action for employees with a termination already scheduled, and expose the effective date via `useEmployeeList`'s new `EmployeeWithActions.pendingDismissalDate` field ([#2814](https://github.com/Gusto/embedded-react-sdk/issues/2814))
+- Harden payroll polling against dropped notifications and inconclusive reads ([#2794](https://github.com/Gusto/embedded-react-sdk/issues/2794))
+- Show a `$` symbol on the gross-up net amount field ([#2802](https://github.com/Gusto/embedded-react-sdk/issues/2802))
+- Show a hint to calculate before applying in the gross-up modal ([#2804](https://github.com/Gusto/embedded-react-sdk/issues/2804))
+- Apply `className` to the `Flex` root instead of an unstyled wrapper ([#2815](https://github.com/Gusto/embedded-react-sdk/issues/2815))
+- Show the specific reason a payroll is blocked (e.g. a suspended company) when creating an off-cycle payroll, matching the detail already shown in the regular payroll flow ([#2816](https://github.com/Gusto/embedded-react-sdk/issues/2816))
+
+### Chores & Maintenance
+
+- Bump dev dependencies (`cspell`, `dotenv`, `eslint-plugin-tsdoc`, `prettier`, `react-router-dom`)
+
+## [0.55.8](https://github.com/Gusto/embedded-react-sdk/compare/v0.55.7...v0.55.8) (2026-09-18)
+
+### Features & Enhancements
+
+- Group additional earnings by overtime impact in the edit-employee prototype, splitting by workweek only when overtime is added ([#2785](https://github.com/Gusto/embedded-react-sdk/issues/2785), [#2787](https://github.com/Gusto/embedded-react-sdk/issues/2787))
+- Add a workweek start day to `CompanyOnboarding.PaySchedule` ([#2796](https://github.com/Gusto/embedded-react-sdk/issues/2796))
+
+### Fixes
+
+- Support the `className` prop consistently across all SDK components ([#2738](https://github.com/Gusto/embedded-react-sdk/issues/2738))
+- Keep payroll review action buttons from overflowing at narrow widths ([#2608](https://github.com/Gusto/embedded-react-sdk/issues/2608))
+- Fix employee name reflow at a 320px viewport width ([#2754](https://github.com/Gusto/embedded-react-sdk/issues/2754))
+- Right-align the paystub column header with its download buttons ([#2788](https://github.com/Gusto/embedded-react-sdk/issues/2788))
+- Default the payroll history end date to three months ahead ([#2792](https://github.com/Gusto/embedded-react-sdk/issues/2792))
+- Include onboarded employees with future hire dates in payroll ([#2801](https://github.com/Gusto/embedded-react-sdk/issues/2801))
+- Constrain the Cancel and Save actions in `UNSTABLE_PayrollEditEmployee` ([#2786](https://github.com/Gusto/embedded-react-sdk/issues/2786))
+- Suppress the wire details loader on the payroll landing screen to avoid a double load ([#2793](https://github.com/Gusto/embedded-react-sdk/issues/2793))
+
+### Chores & Maintenance
+
+- Make `FieldCaption` an overridable component adapter ([#2769](https://github.com/Gusto/embedded-react-sdk/issues/2769))
+- Bump dependencies (`react-hook-form`, `react-i18next`, `dompurify`, `sass-embedded`, `vitest`, `@vitest/coverage-v8`, `@testing-library/dom`, `@types/react-dom`, `@microsoft/api-extractor`, `cspell`, `eslint-plugin-storybook`, `yaml`, `release-it`, `@release-it/conventional-changelog`)
+
 ## [0.55.7](https://github.com/Gusto/embedded-react-sdk/compare/v0.55.6...v0.55.7) (2026-09-14)
 
 ### Features & Enhancements

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

@@ -1,10 +1,10 @@
-const e = "_fade_6tfn1_1", f = "_fadeIn_6tfn1_8", a = {
+const e = "_fade_19iip_1", a = "_fadeIn_19iip_11", d = {
   fade: e,
-  fadeIn: f
+  fadeIn: a
 };
 export {
-  a as default,
+  d as default,
   e as fade,
-  f as fadeIn
+  a as fadeIn
 };
 //# sourceMappingURL=FadeIn.module.scss.js.map

package/dist/components/Common/FieldCaption/FieldCaption.js

@@ -1,33 +1,37 @@
-import { jsxs as l, jsx as c } from "react/jsx-runtime";
-import { useTranslation as p } from "react-i18next";
+import { jsx as n, jsxs as l } from "react/jsx-runtime";
+import { useTranslation as c } from "react-i18next";
 import d from "classnames";
-import n from "./FieldCaption.module.scss.js";
-import { VisuallyHidden as f } from "../VisuallyHidden/VisuallyHidden.js";
-const j = ({
-  children: e,
+import s from "./FieldCaption.module.scss.js";
+import { useComponentContext as f } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { VisuallyHidden as C } from "../VisuallyHidden/VisuallyHidden.js";
+const u = ({
+  children: t,
   as: o = "label",
-  htmlFor: s,
-  isRequired: r = !1,
-  isVisuallyHidden: a = !1,
-  className: m
+  htmlFor: i,
+  isRequired: a = !1,
+  isVisuallyHidden: m = !1,
+  className: r
 }) => {
-  const { t: i } = p("common"), t = /* @__PURE__ */ l(
+  const { t: p } = c("common"), e = /* @__PURE__ */ l(
     o,
     {
-      className: d(n.root, m),
-      htmlFor: o === "label" ? s : void 0,
+      className: d(s.root, r),
+      htmlFor: o === "label" ? i : void 0,
       children: [
-        e,
-        !r && /* @__PURE__ */ l("span", { className: n.optionalLabel, children: [
+        t,
+        !a && /* @__PURE__ */ l("span", { className: s.optionalLabel, children: [
           " ",
-          i("optionalLabel")
+          p("optionalLabel")
         ] })
       ]
     }
   );
-  return a ? /* @__PURE__ */ c(f, { children: t }) : t;
+  return m ? /* @__PURE__ */ n(C, { children: e }) : e;
+}, L = (t) => {
+  const o = f();
+  return o.FieldCaption ? /* @__PURE__ */ n(o.FieldCaption, { ...t }) : /* @__PURE__ */ n(u, { ...t });
 };
 export {
-  j as FieldCaption
+  L as FieldCaption
 };
 //# sourceMappingURL=FieldCaption.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"FieldCaption.js","sources":["../../../../src/components/Common/FieldCaption/FieldCaption.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport { VisuallyHidden } from '../VisuallyHidden'\nimport styles from './FieldCaption.module.scss'\n\n/** @internal */\nexport interface FieldCaptionProps {\n  /** Caption content rendered inside the label or legend element. */\n  children: React.ReactNode\n  /** HTML element to render as — `label` for individual inputs, `legend` for fieldsets. */\n  as?: 'label' | 'legend'\n  /** Associates a `label` with an input by id. Ignored when `as` is `legend`. */\n  htmlFor?: string\n  /** When false, appends a localized optional indicator after the caption. */\n  isRequired?: boolean\n  /** Visually hides the caption while keeping it available to assistive technology. */\n  isVisuallyHidden?: boolean\n  /** Additional class names appended to the root element. */\n  className?: string\n}\n\n/** @internal */\nexport const FieldCaption: React.FC<FieldCaptionProps> = ({\n  children,\n  as = 'label',\n  htmlFor,\n  isRequired = false,\n  isVisuallyHidden = false,\n  className,\n}: FieldCaptionProps) => {\n  const { t } = useTranslation('common')\n  const Component = as\n\n  const content = (\n    <Component\n      className={classNames(styles.root, className)}\n      htmlFor={as === 'label' ? htmlFor : undefined}\n    >\n      {children}\n      {!isRequired && <span className={styles.optionalLabel}> {t('optionalLabel')}</span>}\n    </Component>\n  )\n\n  return isVisuallyHidden ? <VisuallyHidden>{content}</VisuallyHidden> : content\n}\n"],"names":["FieldCaption","children","as","htmlFor","isRequired","isVisuallyHidden","className","t","useTranslation","content","jsxs","classNames","styles","jsx","VisuallyHidden"],"mappings":";;;;;AAsBO,MAAMA,IAA4C,CAAC;AAAA,EACxD,UAAAC;AAAA,EACA,IAAAC,IAAK;AAAA,EACL,SAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,kBAAAC,IAAmB;AAAA,EACnB,WAAAC;AACF,MAAyB;AACvB,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,QAAQ,GAG/BC,IACJ,gBAAAC;AAAA,IAHgBR;AAAA,IAGf;AAAA,MACC,WAAWS,EAAWC,EAAO,MAAMN,CAAS;AAAA,MAC5C,SAASJ,MAAO,UAAUC,IAAU;AAAA,MAEnC,UAAA;AAAA,QAAAF;AAAA,QACA,CAACG,KAAc,gBAAAM,EAAC,QAAA,EAAK,WAAWE,EAAO,eAAe,UAAA;AAAA,UAAA;AAAA,UAAEL,EAAE,eAAe;AAAA,QAAA,EAAA,CAAE;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIhF,SAAOF,IAAmB,gBAAAQ,EAACC,GAAA,EAAgB,UAAAL,EAAA,CAAQ,IAAoBA;AACzE;"}
+{"version":3,"file":"FieldCaption.js","sources":["../../../../src/components/Common/FieldCaption/FieldCaption.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport { VisuallyHidden } from '../VisuallyHidden'\nimport type { FieldCaptionProps } from './FieldCaptionTypes'\nimport styles from './FieldCaption.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nconst DefaultFieldCaption = ({\n  children,\n  as = 'label',\n  htmlFor,\n  isRequired = false,\n  isVisuallyHidden = false,\n  className,\n}: FieldCaptionProps) => {\n  const { t } = useTranslation('common')\n  const Component = as\n\n  const content = (\n    <Component\n      className={classNames(styles.root, className)}\n      htmlFor={as === 'label' ? htmlFor : undefined}\n    >\n      {children}\n      {!isRequired && <span className={styles.optionalLabel}> {t('optionalLabel')}</span>}\n    </Component>\n  )\n\n  return isVisuallyHidden ? <VisuallyHidden>{content}</VisuallyHidden> : content\n}\n\n/** @internal */\nexport const FieldCaption = (props: FieldCaptionProps) => {\n  const Components = useComponentContext()\n\n  return Components.FieldCaption ? (\n    <Components.FieldCaption {...props} />\n  ) : (\n    <DefaultFieldCaption {...props} />\n  )\n}\n"],"names":["DefaultFieldCaption","children","as","htmlFor","isRequired","isVisuallyHidden","className","t","useTranslation","content","jsxs","classNames","styles","jsx","VisuallyHidden","FieldCaption","props","Components","useComponentContext"],"mappings":";;;;;;AAOA,MAAMA,IAAsB,CAAC;AAAA,EAC3B,UAAAC;AAAA,EACA,IAAAC,IAAK;AAAA,EACL,SAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,kBAAAC,IAAmB;AAAA,EACnB,WAAAC;AACF,MAAyB;AACvB,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,QAAQ,GAG/BC,IACJ,gBAAAC;AAAA,IAHgBR;AAAA,IAGf;AAAA,MACC,WAAWS,EAAWC,EAAO,MAAMN,CAAS;AAAA,MAC5C,SAASJ,MAAO,UAAUC,IAAU;AAAA,MAEnC,UAAA;AAAA,QAAAF;AAAA,QACA,CAACG,KAAc,gBAAAM,EAAC,QAAA,EAAK,WAAWE,EAAO,eAAe,UAAA;AAAA,UAAA;AAAA,UAAEL,EAAE,eAAe;AAAA,QAAA,EAAA,CAAE;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIhF,SAAOF,IAAmB,gBAAAQ,EAACC,GAAA,EAAgB,UAAAL,EAAA,CAAQ,IAAoBA;AACzE,GAGaM,IAAe,CAACC,MAA6B;AACxD,QAAMC,IAAaC,EAAA;AAEnB,SAAOD,EAAW,eAChB,gBAAAJ,EAACI,EAAW,cAAX,EAAyB,GAAGD,EAAA,CAAO,IAEpC,gBAAAH,EAACb,GAAA,EAAqB,GAAGgB,EAAA,CAAO;AAEpC;"}

package/dist/components/Common/Flex/Flex.js

@@ -1,28 +1,30 @@
 import { jsx as r } from "react/jsx-runtime";
+import f from "classnames";
 import i from "./Flex.module.scss.js";
-import { setResponsiveCustomProperties as f } from "../../../helpers/responsive.js";
-function c({
+import { setResponsiveCustomProperties as p } from "../../../helpers/responsive.js";
+function v({
   children: e,
-  flexDirection: t = "row",
-  justifyContent: o = "normal",
-  alignItems: s = "flex-start",
+  className: t,
+  flexDirection: o = "row",
+  justifyContent: s = "normal",
+  alignItems: l = "flex-start",
   flexWrap: n,
-  gap: l = 24
+  gap: m = 24
 }) {
-  const m = f({
-    "flex-direction": t,
-    "justify-content": o,
-    "align-items": s,
+  const a = p({
+    "flex-direction": o,
+    "justify-content": s,
+    "align-items": l,
     "flex-wrap": n,
-    gap: l
+    gap: m
   });
-  return /* @__PURE__ */ r("div", { className: i.flexContainer, children: /* @__PURE__ */ r("div", { className: i.flex, style: m, children: e }) });
+  return /* @__PURE__ */ r("div", { className: f(i.flexContainer, t), children: /* @__PURE__ */ r("div", { className: i.flex, style: a, children: e }) });
 }
-function u({ flexGrow: e = "initial", children: t }) {
+function y({ flexGrow: e = "initial", children: t }) {
   return /* @__PURE__ */ r("div", { style: { flexGrow: e }, children: t });
 }
 export {
-  c as Flex,
-  u as FlexItem
+  v as Flex,
+  y as FlexItem
 };
 //# sourceMappingURL=Flex.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Flex.js","sources":["../../../../src/components/Common/Flex/Flex.tsx"],"sourcesContent":["import style from './Flex.module.scss'\nimport {\n  setResponsiveCustomProperties,\n  type Responsive,\n  type CustomPropertyValue,\n} from '@/helpers/responsive'\n\n/** @internal */\nexport interface FlexProps {\n  children: React.ReactNode\n  flexDirection?: Responsive<'row' | 'column'>\n  justifyContent?: Responsive<\n    | 'space-between'\n    | 'center'\n    | 'flex-start'\n    | 'flex-end'\n    | 'space-around'\n    | 'space-evenly'\n    | 'normal'\n  >\n  alignItems?: Responsive<'center' | 'flex-start' | 'flex-end' | 'stretch'>\n  flexWrap?: Responsive<'wrap' | 'nowrap' | 'wrap-reverse'>\n  gap?: Responsive<CustomPropertyValue>\n}\n\n/** @internal */\nexport function Flex({\n  children,\n  flexDirection = 'row',\n  justifyContent = 'normal',\n  alignItems = 'flex-start',\n  flexWrap,\n  gap = 24,\n}: FlexProps) {\n  const properties = setResponsiveCustomProperties({\n    'flex-direction': flexDirection,\n    'justify-content': justifyContent,\n    'align-items': alignItems,\n    'flex-wrap': flexWrap,\n    gap,\n  })\n\n  return (\n    <div className={style.flexContainer}>\n      <div className={style.flex} style={properties}>\n        {children}\n      </div>\n    </div>\n  )\n}\n\n/** @internal */\nexport interface FlexItemProps {\n  flexGrow?: number | 'initial'\n  children: React.ReactNode\n}\n\n/** @internal */\nexport function FlexItem({ flexGrow = 'initial', children }: FlexItemProps) {\n  return <div style={{ flexGrow: flexGrow }}>{children}</div>\n}\n"],"names":["Flex","children","flexDirection","justifyContent","alignItems","flexWrap","gap","properties","setResponsiveCustomProperties","jsx","style","FlexItem","flexGrow"],"mappings":";;;AA0BO,SAASA,EAAK;AAAA,EACnB,UAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,gBAAAC,IAAiB;AAAA,EACjB,YAAAC,IAAa;AAAA,EACb,UAAAC;AAAA,EACA,KAAAC,IAAM;AACR,GAAc;AACZ,QAAMC,IAAaC,EAA8B;AAAA,IAC/C,kBAAkBN;AAAA,IAClB,mBAAmBC;AAAA,IACnB,eAAeC;AAAA,IACf,aAAaC;AAAA,IACb,KAAAC;AAAA,EAAA,CACD;AAED,SACE,gBAAAG,EAAC,OAAA,EAAI,WAAWC,EAAM,eACpB,UAAA,gBAAAD,EAAC,OAAA,EAAI,WAAWC,EAAM,MAAM,OAAOH,GAChC,UAAAN,GACH,GACF;AAEJ;AASO,SAASU,EAAS,EAAE,UAAAC,IAAW,WAAW,UAAAX,KAA2B;AAC1E,2BAAQ,OAAA,EAAI,OAAO,EAAE,UAAAW,EAAA,GAAuB,UAAAX,GAAS;AACvD;"}
+{"version":3,"file":"Flex.js","sources":["../../../../src/components/Common/Flex/Flex.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport style from './Flex.module.scss'\nimport {\n  setResponsiveCustomProperties,\n  type Responsive,\n  type CustomPropertyValue,\n} from '@/helpers/responsive'\n\n/** @internal */\nexport interface FlexProps {\n  children: React.ReactNode\n  /** CSS class name applied to the root element. */\n  className?: string\n  flexDirection?: Responsive<'row' | 'column'>\n  justifyContent?: Responsive<\n    | 'space-between'\n    | 'center'\n    | 'flex-start'\n    | 'flex-end'\n    | 'space-around'\n    | 'space-evenly'\n    | 'normal'\n  >\n  alignItems?: Responsive<'center' | 'flex-start' | 'flex-end' | 'stretch'>\n  flexWrap?: Responsive<'wrap' | 'nowrap' | 'wrap-reverse'>\n  gap?: Responsive<CustomPropertyValue>\n}\n\n/** @internal */\nexport function Flex({\n  children,\n  className,\n  flexDirection = 'row',\n  justifyContent = 'normal',\n  alignItems = 'flex-start',\n  flexWrap,\n  gap = 24,\n}: FlexProps) {\n  const properties = setResponsiveCustomProperties({\n    'flex-direction': flexDirection,\n    'justify-content': justifyContent,\n    'align-items': alignItems,\n    'flex-wrap': flexWrap,\n    gap,\n  })\n\n  return (\n    <div className={classNames(style.flexContainer, className)}>\n      <div className={style.flex} style={properties}>\n        {children}\n      </div>\n    </div>\n  )\n}\n\n/** @internal */\nexport interface FlexItemProps {\n  flexGrow?: number | 'initial'\n  children: React.ReactNode\n}\n\n/** @internal */\nexport function FlexItem({ flexGrow = 'initial', children }: FlexItemProps) {\n  return <div style={{ flexGrow: flexGrow }}>{children}</div>\n}\n"],"names":["Flex","children","className","flexDirection","justifyContent","alignItems","flexWrap","gap","properties","setResponsiveCustomProperties","classNames","style","jsx","FlexItem","flexGrow"],"mappings":";;;;AA6BO,SAASA,EAAK;AAAA,EACnB,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,gBAAAC,IAAiB;AAAA,EACjB,YAAAC,IAAa;AAAA,EACb,UAAAC;AAAA,EACA,KAAAC,IAAM;AACR,GAAc;AACZ,QAAMC,IAAaC,EAA8B;AAAA,IAC/C,kBAAkBN;AAAA,IAClB,mBAAmBC;AAAA,IACnB,eAAeC;AAAA,IACf,aAAaC;AAAA,IACb,KAAAC;AAAA,EAAA,CACD;AAED,2BACG,OAAA,EAAI,WAAWG,EAAWC,EAAM,eAAeT,CAAS,GACvD,UAAA,gBAAAU,EAAC,OAAA,EAAI,WAAWD,EAAM,MAAM,OAAOH,GAChC,UAAAP,GACH,GACF;AAEJ;AASO,SAASY,EAAS,EAAE,UAAAC,IAAW,WAAW,UAAAb,KAA2B;AAC1E,2BAAQ,OAAA,EAAI,OAAO,EAAE,UAAAa,EAAA,GAAuB,UAAAb,GAAS;AACvD;"}

package/dist/components/Common/UI/Breadcrumbs/Breadcrumbs.js

@@ -1,9 +1,9 @@
 import { jsx as l } from "react/jsx-runtime";
 import h from "classnames";
-import { Flex as u } from "../../Flex/Flex.js";
 import { BreadcrumbsDefaults as C } from "./BreadcrumbsTypes.js";
 import i from "./Breadcrumbs.module.scss.js";
 import { applyMissingDefaults as x } from "../../../../helpers/applyMissingDefaults.js";
+import { Flex as u } from "../../Flex/Flex.js";
 function P(f) {
   const p = x(f, C), {
     className: s,

package/dist/components/Common/UI/FileInput/FileInput.js

@@ -7,13 +7,13 @@ import { FileInputDefaults as K } from "./FileInputTypes.js";
 import n from "./FileInput.module.scss.js";
 import { applyMissingDefaults as L } from "../../../../helpers/applyMissingDefaults.js";
 import { FieldLayout as O } from "../../FieldLayout/FieldLayout.js";
-import { Flex as y } from "../../Flex/Flex.js";
 import { ButtonIcon as R } from "../Button/ButtonIcon.js";
 import W from "../../../../assets/icons/icon-trashcan.svg.js";
 import Z from "../../../../assets/icons/icon-file-outline.svg.js";
 import $ from "../../../../assets/icons/icon-file-pdf.svg.js";
 import H from "../../../../assets/icons/icon-file-png.svg.js";
 import V from "../../../../assets/icons/icon-file-jpg.svg.js";
+import { Flex as y } from "../../Flex/Flex.js";
 function Q(i) {
   return i === "application/pdf" ? $ : i === "image/png" ? H : i === "image/jpeg" || i === "image/jpg" ? V : Z;
 }

package/dist/components/Common/UI/Heading/Heading.module.scss.js

@@ -1,19 +1,19 @@
-const t = "_root_1as7b_1", _ = "_h1_1as7b_7", s = "_h2_1as7b_11", h = "_h3_1as7b_14", n = "_h4_1as7b_17", e = "_h5_1as7b_20", o = "_h6_1as7b_23", a = {
+const t = "_root_1xx4k_1", _ = "_h1_1xx4k_8", x = "_h2_1xx4k_12", h = "_h3_1xx4k_15", n = "_h4_1xx4k_18", e = "_h5_1xx4k_21", o = "_h6_1xx4k_24", s = {
   root: t,
   h1: _,
-  h2: s,
+  h2: x,
   h3: h,
   h4: n,
   h5: e,
   h6: o,
-  "textAlign-start": "_textAlign-start_1as7b_26",
-  "textAlign-center": "_textAlign-center_1as7b_29",
-  "textAlign-end": "_textAlign-end_1as7b_32"
+  "textAlign-start": "_textAlign-start_1xx4k_27",
+  "textAlign-center": "_textAlign-center_1xx4k_30",
+  "textAlign-end": "_textAlign-end_1xx4k_33"
 };
 export {
-  a as default,
+  s as default,
   _ as h1,
-  s as h2,
+  x as h2,
   h as h3,
   n as h4,
   e as h5,

package/dist/components/Common/UI/Menu/MenuTypes.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuTypes.js","sources":["../../../../../src/components/Common/UI/Menu/MenuTypes.ts"],"sourcesContent":["import type { ReactNode, RefObject } from 'react'\nimport type { DataAttributes } from '@/types/Helpers'\n\n/**\n * Action entry your {@link MenuProps | Menu} implementation must accept for each entry in its\n * `items` array from the component adapter.\n *\n * @public\n * @childOf {@link MenuProps}\n */\nexport interface MenuItem extends DataAttributes {\n  /**\n   * Text label for the menu item\n   */\n  label: string\n  /**\n   * Optional icon to display before the label\n   */\n  icon?: ReactNode\n  /**\n   * Callback function when the menu item is clicked\n   */\n  onClick: () => void\n  /**\n   * Disables the menu item and prevents interaction\n   */\n  isDisabled?: boolean\n  /**\n   * Optional URL to navigate to when clicked\n   */\n  href?: string\n}\n\n/**\n * Props your `Menu` implementation must accept from the component adapter.\n * Renders a popover menu of actions anchored to a trigger element.\n *\n * @public\n * @group Component props\n */\nexport interface MenuProps extends DataAttributes {\n  /**\n   * Reference to the element that triggers the menu\n   */\n  triggerRef?: RefObject<Element | null>\n  /**\n   * Array of menu items to display\n   */\n  items?: MenuItem[]\n  /**\n   * Controls whether the menu is currently open\n   *\n   * @defaultValue `false`\n   */\n  isOpen?: boolean\n  /**\n   * Callback when the menu is closed\n   */\n  onClose?: () => void\n  /**\n   * Accessible label describing the menu's purpose\n   */\n  'aria-label': string\n  /**\n   * Element to use as the portal container for the menu popover.\n   * Overrides the default SDK root container from context.\n   */\n  portalContainer?: HTMLElement\n  /**\n   * Controls the placement of the menu popover relative to the trigger\n   *\n   * @defaultValue `'bottom start'`\n   */\n  placement?:\n    'top' | 'top start' | 'top end' | 'bottom' | 'bottom start' | 'bottom end' | 'left' | 'right'\n}\n\n/**\n * Default prop values for the {@link Menu} component.\n *\n * @internal\n */\nexport const MenuDefaults = {\n  isOpen: false,\n  placement: 'bottom start',\n} as const satisfies Partial<MenuProps>\n"],"names":["MenuDefaults"],"mappings":"AAkFO,MAAMA,IAAe;AAAA,EAC1B,QAAQ;AAAA,EACR,WAAW;AACb;"}
+{"version":3,"file":"MenuTypes.js","sources":["../../../../../src/components/Common/UI/Menu/MenuTypes.ts"],"sourcesContent":["import type { ReactNode, RefObject } from 'react'\nimport type { DataAttributes } from '@/types/Helpers'\n\n/**\n * Action entry your {@link MenuProps | Menu} implementation must accept for each entry in its\n * `items` array from the component adapter.\n *\n * @public\n * @childOf {@link MenuProps}\n */\nexport interface MenuItem extends DataAttributes {\n  /**\n   * Text label for the menu item\n   */\n  label: string\n  /**\n   * Optional icon to display before the label\n   */\n  icon?: ReactNode\n  /**\n   * Callback function when the menu item is clicked\n   */\n  onClick: () => void\n  /**\n   * Disables the menu item and prevents interaction\n   */\n  isDisabled?: boolean\n  /**\n   * Optional URL to navigate to when clicked\n   */\n  href?: string\n}\n\n/**\n * Props your `Menu` implementation must accept from the component adapter.\n * Renders a popover menu of actions anchored to a trigger element.\n *\n * @public\n * @group Component props\n */\nexport interface MenuProps extends DataAttributes {\n  /**\n   * Reference to the element that triggers the menu\n   */\n  triggerRef?: RefObject<Element | null>\n  /**\n   * Array of menu items to display\n   */\n  items?: MenuItem[]\n  /**\n   * Controls whether the menu is currently open\n   *\n   * @defaultValue `false`\n   */\n  isOpen?: boolean\n  /**\n   * Callback when the menu is closed\n   */\n  onClose?: () => void\n  /**\n   * Accessible label describing the menu's purpose\n   */\n  'aria-label': string\n  /**\n   * Element to use as the portal container for the menu popover.\n   * Overrides the SDK's default portal root (a themed element appended to `document.body`).\n   */\n  portalContainer?: HTMLElement\n  /**\n   * Controls the placement of the menu popover relative to the trigger\n   *\n   * @defaultValue `'bottom start'`\n   */\n  placement?:\n    'top' | 'top start' | 'top end' | 'bottom' | 'bottom start' | 'bottom end' | 'left' | 'right'\n}\n\n/**\n * Default prop values for the {@link Menu} component.\n *\n * @internal\n */\nexport const MenuDefaults = {\n  isOpen: false,\n  placement: 'bottom start',\n} as const satisfies Partial<MenuProps>\n"],"names":["MenuDefaults"],"mappings":"AAkFO,MAAMA,IAAe;AAAA,EAC1B,QAAQ;AAAA,EACR,WAAW;AACb;"}

package/dist/components/Common/UI/MultiSelectComboBox/MultiSelectComboBox.js

@@ -1,19 +1,19 @@
 import { jsxs as c, jsx as r } from "react/jsx-runtime";
-import { useState as Q, useRef as C, useCallback as m, useMemo as u } from "react";
-import { ComboBox as W, Input as X, Button as Y, Popover as Z, Virtualizer as $, ListLayout as V, ListBox as ee, ListBoxItem as re } from "react-aria-components";
+import { useState as W, useRef as C, useCallback as m, useMemo as u } from "react";
+import { ComboBox as X, Input as Y, Button as Z, Popover as $, Virtualizer as V, ListLayout as ee, ListBox as re, ListBoxItem as te } from "react-aria-components";
 import N from "classnames";
-import { useTranslation as te } from "react-i18next";
-import { useFieldIds as ie } from "../hooks/useFieldIds.js";
+import { useTranslation as ie } from "react-i18next";
+import { useFieldIds as oe } from "../hooks/useFieldIds.js";
 import t from "./MultiSelectComboBox.module.scss.js";
-import { FieldLayout as oe } from "../../FieldLayout/FieldLayout.js";
-import { FieldDescription as ne } from "../../FieldDescription/FieldDescription.js";
-import { useComponentContext as le } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-import { useTheme as se } from "../../../../contexts/ThemeProvider/useTheme.js";
+import { FieldLayout as ne } from "../../FieldLayout/FieldLayout.js";
+import { FieldDescription as le } from "../../FieldDescription/FieldDescription.js";
+import { useComponentContext as se } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useTheme as ae } from "../../../../contexts/ThemeProvider/useTheme.js";
 /* empty css                          */
-import { useForkRef as ae } from "../../../../hooks/useForkRef/useForkRef.js";
-import ce from "../../../../assets/icons/alert-circle.svg.js";
-import me from "../../../../assets/icons/caret-down.svg.js";
-function Le({
+import { useForkRef as ce } from "../../../../hooks/useForkRef/useForkRef.js";
+import me from "../../../../assets/icons/alert-circle.svg.js";
+import ue from "../../../../assets/icons/caret-down.svg.js";
+function ye({
   className: D,
   description: F,
   errorMessage: p,
@@ -29,14 +29,15 @@ function Le({
   onChange: n,
   options: l,
   placeholder: A,
+  portalContainer: O,
   value: i = [],
-  shouldVisuallyHideLabel: O
+  shouldVisuallyHideLabel: j
 }) {
-  const j = le(), { t: s } = te("common"), { container: z } = se(), [E, v] = Q(""), o = C(null), I = C(null), M = ae(y, I), P = m(() => {
+  const z = se(), { t: s } = ie("common"), { container: E } = ae(), [M, v] = W(""), o = C(null), I = C(null), P = ce(y, I), k = m(() => {
     o.current = setTimeout(() => {
       o.current = null, b?.();
     }, 50);
-  }, [b]), k = m(() => {
+  }, [b]), H = m(() => {
     o.current && (clearTimeout(o.current), o.current = null);
   }, []), a = u(() => new Set(i), [i]), x = u(
     () => l.filter((e) => !a.has(e.value)).map((e) => ({
@@ -48,80 +49,80 @@ function Le({
   ), g = u(
     () => l.filter((e) => a.has(e.value)),
     [l, a]
-  ), H = u(
+  ), K = u(
     () => x.map((e) => ({
       name: e.label,
       id: e.value,
       description: e.description
     })),
     [x]
-  ), K = m(
+  ), U = m(
     (e) => {
       e && (n?.([...i, e.toString()]), v(""), I.current?.blur());
     },
     [i, n]
-  ), U = m(
+  ), _ = m(
     (e) => {
-      n?.(i.filter((J) => J !== e));
+      n?.(i.filter((Q) => Q !== e));
     },
     [i, n]
-  ), B = (T ? s("status.loadingOptions") : void 0) ?? F, { inputId: S, errorMessageId: _, descriptionId: q, ariaDescribedBy: G } = ie({
+  ), B = (T ? s("status.loadingOptions") : void 0) ?? F, { inputId: S, errorMessageId: q, descriptionId: G, ariaDescribedBy: J } = oe({
     inputId: L,
     errorMessage: p,
     description: B
   });
   return /* @__PURE__ */ c("div", { className: N(t.root, D), children: [
     /* @__PURE__ */ r(
-      oe,
+      ne,
       {
         label: d,
         htmlFor: S,
         errorMessage: p,
-        errorMessageId: _,
-        descriptionId: q,
+        errorMessageId: q,
+        descriptionId: G,
         isRequired: R,
         description: B,
-        shouldVisuallyHideLabel: O,
+        shouldVisuallyHideLabel: j,
         className: t.comboBoxField,
         withErrorIcon: !1,
         children: /* @__PURE__ */ c(
-          W,
+          X,
           {
             "aria-label": d,
-            "aria-describedby": G,
+            "aria-describedby": J,
             className: "react-aria-ComboBox-root",
             isDisabled: f,
             isInvalid: h,
             menuTrigger: "focus",
-            inputValue: E,
+            inputValue: M,
             onInputChange: v,
             selectedKey: null,
-            onSelectionChange: K,
+            onSelectionChange: U,
             id: S,
             name: w,
             children: [
               /* @__PURE__ */ r(
-                X,
+                Y,
                 {
-                  ref: M,
+                  ref: P,
                   placeholder: A,
-                  onBlur: P,
-                  onFocus: k
+                  onBlur: k,
+                  onFocus: H
                 }
               ),
-              /* @__PURE__ */ r(Y, { children: /* @__PURE__ */ c("div", { "aria-hidden": "true", className: t.icons, children: [
-                h && /* @__PURE__ */ r(ce, { fontSize: 16 }),
-                /* @__PURE__ */ r(me, { title: s("icons.selectArrow") })
+              /* @__PURE__ */ r(Z, { children: /* @__PURE__ */ c("div", { "aria-hidden": "true", className: t.icons, children: [
+                h && /* @__PURE__ */ r(me, { fontSize: 16 }),
+                /* @__PURE__ */ r(ue, { title: s("icons.selectArrow") })
               ] }) }),
               /* @__PURE__ */ r(
-                Z,
+                $,
                 {
                   className: N(t.popover, "react-aria-Popover"),
-                  UNSTABLE_portalContainer: z.current ?? void 0,
+                  UNSTABLE_portalContainer: O ?? E.current ?? void 0,
                   maxHeight: 320,
-                  children: /* @__PURE__ */ r($, { layout: V, children: /* @__PURE__ */ r(ee, { items: H, children: (e) => /* @__PURE__ */ c(re, { textValue: e.name, children: [
+                  children: /* @__PURE__ */ r(V, { layout: ee, children: /* @__PURE__ */ r(re, { items: K, children: (e) => /* @__PURE__ */ c(te, { textValue: e.name, children: [
                     /* @__PURE__ */ r("div", { className: t.optionLabel, children: e.name }),
-                    e.description && /* @__PURE__ */ r(ne, { className: t.optionDescription, children: e.description })
+                    e.description && /* @__PURE__ */ r(le, { className: t.optionDescription, children: e.description })
                   ] }, e.id) }) })
                 }
               )
@@ -131,11 +132,11 @@ function Le({
       }
     ),
     g.length > 0 && /* @__PURE__ */ r("div", { className: t.chips, role: "list", "aria-label": s("labels.selectedItems", { label: d }), children: g.map((e) => /* @__PURE__ */ r("span", { role: "listitem", children: /* @__PURE__ */ r(
-      j.Badge,
+      z.Badge,
       {
         status: "info",
         onDismiss: () => {
-          U(e.value);
+          _(e.value);
         },
         dismissAriaLabel: s("labels.removeItem", { label: e.label }),
         isDisabled: f,
@@ -145,6 +146,6 @@ function Le({
   ] });
 }
 export {
-  Le as MultiSelectComboBox
+  ye as MultiSelectComboBox
 };
 //# sourceMappingURL=MultiSelectComboBox.js.map

package/dist/components/Common/UI/MultiSelectComboBox/MultiSelectComboBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultiSelectComboBox.js","sources":["../../../../../src/components/Common/UI/MultiSelectComboBox/MultiSelectComboBox.tsx"],"sourcesContent":["import { useCallback, useMemo, useRef, useState } from 'react'\nimport type { Key } from 'react-aria-components'\nimport {\n  ComboBox as AriaComboBox,\n  Button,\n  Input,\n  ListBox,\n  ListBoxItem,\n  ListLayout,\n  Popover,\n  Virtualizer,\n} from 'react-aria-components'\nimport classNames from 'classnames'\nimport { useTranslation } from 'react-i18next'\nimport { useFieldIds } from '../hooks/useFieldIds'\nimport styles from './MultiSelectComboBox.module.scss'\nimport type { MultiSelectComboBoxProps } from './MultiSelectComboBoxTypes'\nimport { FieldLayout } from '@/components/Common/FieldLayout'\nimport { FieldDescription } from '@/components/Common/FieldDescription'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useTheme } from '@/contexts/ThemeProvider'\nimport { useForkRef } from '@/hooks/useForkRef/useForkRef'\nimport AlertCircle from '@/assets/icons/alert-circle.svg?react'\nimport CaretDown from '@/assets/icons/caret-down.svg?react'\n\n/**\n * Combo box that lets the user pick multiple options, rendering each selection as a dismissable chip below the input.\n *\n * @param props - See {@link MultiSelectComboBoxProps}.\n * @returns The rendered multi-select combo box field.\n * @internal\n */\nexport function MultiSelectComboBox({\n  className,\n  description,\n  errorMessage,\n  id,\n  inputRef: inputRefFromProps,\n  isDisabled,\n  isInvalid,\n  isLoading,\n  isRequired,\n  label,\n  name,\n  onBlur,\n  onChange,\n  options,\n  placeholder,\n  value: selectedValues = [],\n  shouldVisuallyHideLabel,\n}: MultiSelectComboBoxProps) {\n  const Components = useComponentContext()\n  const { t } = useTranslation('common')\n  const { container } = useTheme()\n  const [inputValue, setInputValue] = useState('')\n  const blurTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n  const internalInputRef = useRef<HTMLInputElement>(null)\n  const inputRef = useForkRef(inputRefFromProps, internalInputRef)\n\n  const handleInputBlur = useCallback(() => {\n    blurTimeoutRef.current = setTimeout(() => {\n      blurTimeoutRef.current = null\n      onBlur?.()\n    }, 50)\n  }, [onBlur])\n\n  const handleInputFocus = useCallback(() => {\n    if (blurTimeoutRef.current) {\n      clearTimeout(blurTimeoutRef.current)\n      blurTimeoutRef.current = null\n    }\n  }, [])\n\n  const selectedSet = useMemo(() => new Set(selectedValues), [selectedValues])\n\n  const availableOptions = useMemo(\n    () =>\n      options\n        .filter(option => !selectedSet.has(option.value))\n        .map(option => ({\n          label: option.label,\n          value: option.value,\n          description: option.description,\n        })),\n    [options, selectedSet],\n  )\n\n  const selectedOptions = useMemo(\n    () => options.filter(option => selectedSet.has(option.value)),\n    [options, selectedSet],\n  )\n\n  const items = useMemo(\n    () =>\n      availableOptions.map(option => ({\n        name: option.label,\n        id: option.value,\n        description: option.description,\n      })),\n    [availableOptions],\n  )\n\n  const handleSelectionChange = useCallback(\n    (key: Key | null) => {\n      if (!key) return\n      onChange?.([...selectedValues, key.toString()])\n      setInputValue('')\n      internalInputRef.current?.blur()\n    },\n    [selectedValues, onChange],\n  )\n\n  const handleDismiss = useCallback(\n    (value: string) => {\n      onChange?.(selectedValues.filter(v => v !== value))\n    },\n    [selectedValues, onChange],\n  )\n\n  const loadingDescription = isLoading ? t('status.loadingOptions') : undefined\n  const displayDescription = loadingDescription ?? description\n\n  const { inputId, errorMessageId, descriptionId, ariaDescribedBy } = useFieldIds({\n    inputId: id,\n    errorMessage,\n    description: displayDescription,\n  })\n\n  return (\n    <div className={classNames(styles.root, className)}>\n      <FieldLayout\n        label={label}\n        htmlFor={inputId}\n        errorMessage={errorMessage}\n        errorMessageId={errorMessageId}\n        descriptionId={descriptionId}\n        isRequired={isRequired}\n        description={displayDescription}\n        shouldVisuallyHideLabel={shouldVisuallyHideLabel}\n        className={styles.comboBoxField}\n        withErrorIcon={false}\n      >\n        <AriaComboBox\n          aria-label={label}\n          aria-describedby={ariaDescribedBy}\n          className={'react-aria-ComboBox-root'}\n          isDisabled={isDisabled}\n          isInvalid={isInvalid}\n          menuTrigger=\"focus\"\n          inputValue={inputValue}\n          onInputChange={setInputValue}\n          selectedKey={null}\n          onSelectionChange={handleSelectionChange}\n          id={inputId}\n          name={name}\n        >\n          <Input\n            ref={inputRef}\n            placeholder={placeholder}\n            onBlur={handleInputBlur}\n            onFocus={handleInputFocus}\n          />\n          <Button>\n            <div aria-hidden=\"true\" className={styles.icons}>\n              {isInvalid && <AlertCircle fontSize={16} />}\n              <CaretDown title={t('icons.selectArrow')} />\n            </div>\n          </Button>\n\n          <Popover\n            className={classNames(styles.popover, 'react-aria-Popover')}\n            UNSTABLE_portalContainer={container.current ?? undefined}\n            maxHeight={320}\n          >\n            <Virtualizer layout={ListLayout}>\n              <ListBox items={items}>\n                {item => (\n                  <ListBoxItem key={item.id} textValue={item.name}>\n                    <div className={styles.optionLabel}>{item.name}</div>\n                    {item.description && (\n                      <FieldDescription className={styles.optionDescription}>\n                        {item.description}\n                      </FieldDescription>\n                    )}\n                  </ListBoxItem>\n                )}\n              </ListBox>\n            </Virtualizer>\n          </Popover>\n        </AriaComboBox>\n      </FieldLayout>\n\n      {selectedOptions.length > 0 && (\n        <div className={styles.chips} role=\"list\" aria-label={t('labels.selectedItems', { label })}>\n          {selectedOptions.map(option => (\n            <span key={option.value} role=\"listitem\">\n              <Components.Badge\n                status=\"info\"\n                onDismiss={() => {\n                  handleDismiss(option.value)\n                }}\n                dismissAriaLabel={t('labels.removeItem', { label: option.label })}\n                isDisabled={isDisabled}\n              >\n                {option.label}\n              </Components.Badge>\n            </span>\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["MultiSelectComboBox","className","description","errorMessage","id","inputRefFromProps","isDisabled","isInvalid","isLoading","isRequired","label","name","onBlur","onChange","options","placeholder","selectedValues","shouldVisuallyHideLabel","Components","useComponentContext","t","useTranslation","container","useTheme","inputValue","setInputValue","useState","blurTimeoutRef","useRef","internalInputRef","inputRef","useForkRef","handleInputBlur","useCallback","handleInputFocus","selectedSet","useMemo","availableOptions","option","selectedOptions","items","handleSelectionChange","key","handleDismiss","value","v","displayDescription","inputId","errorMessageId","descriptionId","ariaDescribedBy","useFieldIds","classNames","styles","jsx","FieldLayout","jsxs","AriaComboBox","Input","Button","AlertCircle","CaretDown","Popover","Virtualizer","ListLayout","ListBox","item","ListBoxItem","FieldDescription"],"mappings":"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"}
+{"version":3,"file":"MultiSelectComboBox.js","sources":["../../../../../src/components/Common/UI/MultiSelectComboBox/MultiSelectComboBox.tsx"],"sourcesContent":["import { useCallback, useMemo, useRef, useState } from 'react'\nimport type { Key } from 'react-aria-components'\nimport {\n  ComboBox as AriaComboBox,\n  Button,\n  Input,\n  ListBox,\n  ListBoxItem,\n  ListLayout,\n  Popover,\n  Virtualizer,\n} from 'react-aria-components'\nimport classNames from 'classnames'\nimport { useTranslation } from 'react-i18next'\nimport { useFieldIds } from '../hooks/useFieldIds'\nimport styles from './MultiSelectComboBox.module.scss'\nimport type { MultiSelectComboBoxProps } from './MultiSelectComboBoxTypes'\nimport { FieldLayout } from '@/components/Common/FieldLayout'\nimport { FieldDescription } from '@/components/Common/FieldDescription'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useTheme } from '@/contexts/ThemeProvider'\nimport { useForkRef } from '@/hooks/useForkRef/useForkRef'\nimport AlertCircle from '@/assets/icons/alert-circle.svg?react'\nimport CaretDown from '@/assets/icons/caret-down.svg?react'\n\n/**\n * Combo box that lets the user pick multiple options, rendering each selection as a dismissable chip below the input.\n *\n * @param props - See {@link MultiSelectComboBoxProps}.\n * @returns The rendered multi-select combo box field.\n * @internal\n */\nexport function MultiSelectComboBox({\n  className,\n  description,\n  errorMessage,\n  id,\n  inputRef: inputRefFromProps,\n  isDisabled,\n  isInvalid,\n  isLoading,\n  isRequired,\n  label,\n  name,\n  onBlur,\n  onChange,\n  options,\n  placeholder,\n  portalContainer,\n  value: selectedValues = [],\n  shouldVisuallyHideLabel,\n}: MultiSelectComboBoxProps) {\n  const Components = useComponentContext()\n  const { t } = useTranslation('common')\n  const { container } = useTheme()\n  const [inputValue, setInputValue] = useState('')\n  const blurTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n  const internalInputRef = useRef<HTMLInputElement>(null)\n  const inputRef = useForkRef(inputRefFromProps, internalInputRef)\n\n  const handleInputBlur = useCallback(() => {\n    blurTimeoutRef.current = setTimeout(() => {\n      blurTimeoutRef.current = null\n      onBlur?.()\n    }, 50)\n  }, [onBlur])\n\n  const handleInputFocus = useCallback(() => {\n    if (blurTimeoutRef.current) {\n      clearTimeout(blurTimeoutRef.current)\n      blurTimeoutRef.current = null\n    }\n  }, [])\n\n  const selectedSet = useMemo(() => new Set(selectedValues), [selectedValues])\n\n  const availableOptions = useMemo(\n    () =>\n      options\n        .filter(option => !selectedSet.has(option.value))\n        .map(option => ({\n          label: option.label,\n          value: option.value,\n          description: option.description,\n        })),\n    [options, selectedSet],\n  )\n\n  const selectedOptions = useMemo(\n    () => options.filter(option => selectedSet.has(option.value)),\n    [options, selectedSet],\n  )\n\n  const items = useMemo(\n    () =>\n      availableOptions.map(option => ({\n        name: option.label,\n        id: option.value,\n        description: option.description,\n      })),\n    [availableOptions],\n  )\n\n  const handleSelectionChange = useCallback(\n    (key: Key | null) => {\n      if (!key) return\n      onChange?.([...selectedValues, key.toString()])\n      setInputValue('')\n      internalInputRef.current?.blur()\n    },\n    [selectedValues, onChange],\n  )\n\n  const handleDismiss = useCallback(\n    (value: string) => {\n      onChange?.(selectedValues.filter(v => v !== value))\n    },\n    [selectedValues, onChange],\n  )\n\n  const loadingDescription = isLoading ? t('status.loadingOptions') : undefined\n  const displayDescription = loadingDescription ?? description\n\n  const { inputId, errorMessageId, descriptionId, ariaDescribedBy } = useFieldIds({\n    inputId: id,\n    errorMessage,\n    description: displayDescription,\n  })\n\n  return (\n    <div className={classNames(styles.root, className)}>\n      <FieldLayout\n        label={label}\n        htmlFor={inputId}\n        errorMessage={errorMessage}\n        errorMessageId={errorMessageId}\n        descriptionId={descriptionId}\n        isRequired={isRequired}\n        description={displayDescription}\n        shouldVisuallyHideLabel={shouldVisuallyHideLabel}\n        className={styles.comboBoxField}\n        withErrorIcon={false}\n      >\n        <AriaComboBox\n          aria-label={label}\n          aria-describedby={ariaDescribedBy}\n          className={'react-aria-ComboBox-root'}\n          isDisabled={isDisabled}\n          isInvalid={isInvalid}\n          menuTrigger=\"focus\"\n          inputValue={inputValue}\n          onInputChange={setInputValue}\n          selectedKey={null}\n          onSelectionChange={handleSelectionChange}\n          id={inputId}\n          name={name}\n        >\n          <Input\n            ref={inputRef}\n            placeholder={placeholder}\n            onBlur={handleInputBlur}\n            onFocus={handleInputFocus}\n          />\n          <Button>\n            <div aria-hidden=\"true\" className={styles.icons}>\n              {isInvalid && <AlertCircle fontSize={16} />}\n              <CaretDown title={t('icons.selectArrow')} />\n            </div>\n          </Button>\n\n          <Popover\n            className={classNames(styles.popover, 'react-aria-Popover')}\n            UNSTABLE_portalContainer={portalContainer ?? container.current ?? undefined}\n            maxHeight={320}\n          >\n            <Virtualizer layout={ListLayout}>\n              <ListBox items={items}>\n                {item => (\n                  <ListBoxItem key={item.id} textValue={item.name}>\n                    <div className={styles.optionLabel}>{item.name}</div>\n                    {item.description && (\n                      <FieldDescription className={styles.optionDescription}>\n                        {item.description}\n                      </FieldDescription>\n                    )}\n                  </ListBoxItem>\n                )}\n              </ListBox>\n            </Virtualizer>\n          </Popover>\n        </AriaComboBox>\n      </FieldLayout>\n\n      {selectedOptions.length > 0 && (\n        <div className={styles.chips} role=\"list\" aria-label={t('labels.selectedItems', { label })}>\n          {selectedOptions.map(option => (\n            <span key={option.value} role=\"listitem\">\n              <Components.Badge\n                status=\"info\"\n                onDismiss={() => {\n                  handleDismiss(option.value)\n                }}\n                dismissAriaLabel={t('labels.removeItem', { label: option.label })}\n                isDisabled={isDisabled}\n              >\n                {option.label}\n              </Components.Badge>\n            </span>\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["MultiSelectComboBox","className","description","errorMessage","id","inputRefFromProps","isDisabled","isInvalid","isLoading","isRequired","label","name","onBlur","onChange","options","placeholder","portalContainer","selectedValues","shouldVisuallyHideLabel","Components","useComponentContext","t","useTranslation","container","useTheme","inputValue","setInputValue","useState","blurTimeoutRef","useRef","internalInputRef","inputRef","useForkRef","handleInputBlur","useCallback","handleInputFocus","selectedSet","useMemo","availableOptions","option","selectedOptions","items","handleSelectionChange","key","handleDismiss","value","v","displayDescription","inputId","errorMessageId","descriptionId","ariaDescribedBy","useFieldIds","classNames","styles","jsx","FieldLayout","jsxs","AriaComboBox","Input","Button","AlertCircle","CaretDown","Popover","Virtualizer","ListLayout","ListBox","item","ListBoxItem","FieldDescription"],"mappings":"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"}

package/dist/components/Common/UI/ProgressBar/ProgressBar.js

@@ -1,7 +1,7 @@
 import { jsxs as t, jsx as r } from "react/jsx-runtime";
 import c from "classnames";
-import { Flex as n } from "../../Flex/Flex.js";
-import p from "./ProgressBar.module.scss.js";
+import n from "./ProgressBar.module.scss.js";
+import { Flex as p } from "../../Flex/Flex.js";
 import { VisuallyHidden as d } from "../../VisuallyHidden/VisuallyHidden.js";
 function y({
   className: i,
@@ -13,9 +13,9 @@ function y({
   const s = Math.max(1, Math.min(m, e)), l = {
     "--g-progress-bar-width": `${s * 100 / e}%`
   };
-  return /* @__PURE__ */ t(n, { flexDirection: "column", children: [
+  return /* @__PURE__ */ t(p, { flexDirection: "column", children: [
     o && /* @__PURE__ */ r(o, {}),
-    /* @__PURE__ */ r("div", { className: c(p.root, i), style: l, children: /* @__PURE__ */ r(d, { children: /* @__PURE__ */ r("progress", { "aria-label": a, value: s, max: e }) }) })
+    /* @__PURE__ */ r("div", { className: c(n.root, i), style: l, children: /* @__PURE__ */ r(d, { children: /* @__PURE__ */ r("progress", { "aria-label": a, value: s, max: e }) }) })
   ] });
 }
 export {

package/dist/components/Company/AssignSignatory/CreateSignatory/useCreateSignatory.js

@@ -9,13 +9,15 @@ import "@gusto/embedded-api/models/errors/gustoembeddederror";
 import "@gusto/embedded-api/models/errors/sdkvalidationerror";
 import "@gusto/embedded-api/models/errors/unprocessableentityerror";
 import "@gusto/embedded-api/models/errors/httpclienterrors";
+import "dompurify";
+import "../../../../contexts/LocaleProvider/useLocale.js";
 import "../../../../shared/constants.js";
 import "../../../../contexts/ComponentAdapter/useComponentContext.js";
 import "../../../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
 import { createCompoundContext as t } from "../../../Base/createCompoundContext.js";
-const [s, u] = t("CreateSignatoryContext");
+const [f, v] = t("CreateSignatoryContext");
 export {
-  u as CreateSignatoryProvider,
-  s as useCreateSignatory
+  v as CreateSignatoryProvider,
+  f as useCreateSignatory
 };
 //# sourceMappingURL=useCreateSignatory.js.map

package/dist/components/Company/AssignSignatory/CreateSignatory/useCreateSignatory.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCreateSignatory.js","sources":["../../../../../src/components/Company/AssignSignatory/CreateSignatory/useCreateSignatory.ts"],"sourcesContent":["import { type Signatory } from '@gusto/embedded-api/models/components/signatory'\nimport { createCompoundContext } from '@/components/Base'\nimport type { RequireAtLeastOne } from '@/types/Helpers'\n\n/**\n * Initial values for the {@link CreateSignatory} form fields. At least one field must be provided.\n *\n * @public\n */\nexport type CreateSignatoryDefaultValues = RequireAtLeastOne<\n  Pick<Signatory, 'firstName' | 'lastName' | 'email' | 'title' | 'phone' | 'birthday'> &\n    Pick<\n      NonNullable<Signatory['homeAddress']>,\n      'street1' | 'street2' | 'city' | 'state' | 'zip'\n    > & {\n      ssn?: string\n    }\n>\ntype CreateSignatoryContextType = {\n  isPending: boolean\n  currentSignatory?: Signatory\n}\n\nconst [useCreateSignatory, CreateSignatoryProvider] =\n  createCompoundContext<CreateSignatoryContextType>('CreateSignatoryContext')\n\nexport {\n  /** @internal */\n  useCreateSignatory,\n  /** @internal */\n  CreateSignatoryProvider,\n}\n"],"names":["useCreateSignatory","CreateSignatoryProvider","createCompoundContext"],"mappings":";;;;;;;;;;;;;;;AAuBA,MAAM,CAACA,GAAoBC,CAAuB,IAChDC,EAAkD,wBAAwB;"}
+{"version":3,"file":"useCreateSignatory.js","sources":["../../../../../src/components/Company/AssignSignatory/CreateSignatory/useCreateSignatory.ts"],"sourcesContent":["import { type Signatory } from '@gusto/embedded-api/models/components/signatory'\nimport { createCompoundContext } from '@/components/Base'\nimport type { RequireAtLeastOne } from '@/types/Helpers'\n\n/**\n * Initial values for the {@link CreateSignatory} form fields. At least one field must be provided.\n *\n * @public\n */\nexport type CreateSignatoryDefaultValues = RequireAtLeastOne<\n  Pick<Signatory, 'firstName' | 'lastName' | 'email' | 'title' | 'phone' | 'birthday'> &\n    Pick<\n      NonNullable<Signatory['homeAddress']>,\n      'street1' | 'street2' | 'city' | 'state' | 'zip'\n    > & {\n      ssn?: string\n    }\n>\ntype CreateSignatoryContextType = {\n  isPending: boolean\n  currentSignatory?: Signatory\n}\n\nconst [useCreateSignatory, CreateSignatoryProvider] =\n  createCompoundContext<CreateSignatoryContextType>('CreateSignatoryContext')\n\nexport {\n  /** @internal */\n  useCreateSignatory,\n  /** @internal */\n  CreateSignatoryProvider,\n}\n"],"names":["useCreateSignatory","CreateSignatoryProvider","createCompoundContext"],"mappings":";;;;;;;;;;;;;;;;;AAuBA,MAAM,CAACA,GAAoBC,CAAuB,IAChDC,EAAkD,wBAAwB;"}

package/dist/components/Company/AssignSignatory/InviteSignatory/useInviteSignatory.js

@@ -9,13 +9,15 @@ import "@gusto/embedded-api/models/errors/gustoembeddederror";
 import "@gusto/embedded-api/models/errors/sdkvalidationerror";
 import "@gusto/embedded-api/models/errors/unprocessableentityerror";
 import "@gusto/embedded-api/models/errors/httpclienterrors";
+import "dompurify";
+import "../../../../contexts/LocaleProvider/useLocale.js";
 import "../../../../shared/constants.js";
 import "../../../../contexts/ComponentAdapter/useComponentContext.js";
 import "../../../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
 import { createCompoundContext as t } from "../../../Base/createCompoundContext.js";
-const [c, d] = t("InviteSignatoryContext");
+const [s, u] = t("InviteSignatoryContext");
 export {
-  d as InviteSignatoryProvider,
-  c as useInviteSignatory
+  u as InviteSignatoryProvider,
+  s as useInviteSignatory
 };
 //# sourceMappingURL=useInviteSignatory.js.map