@gusto/embedded-react-sdk 0.18.0 → 0.19.0

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # Changelog
 
+## 0.19.0
+
+### Features & Enhancements
+
+- Add Banner component for displaying important messages and alerts
+- Update Badge component radius styling
+- Remove ul from base.css and update components to use List component
+- Restore spacing values to input groups
+- Normalize translation keys and add translation guidelines
+
+### Chores & Maintenance
+
+- Upgrade to Gusto Embedded API v0.10.2
+- Update custom deductions form to use latest input components
+- Update documentation for Gusto API v2025-06-15 upgrade
+
+### Breaking changes
+
+#### Translation key normalization
+
+Translation keys have been normalized to follow a consistent naming convention. If you have custom dictionary overrides, you may need to update your translation keys to match the new format. Going forward, all translation keys will maintain this normalized format for consistency across the SDK.
+
 ## 0.18.0
 
 ### Features & Enhancements
@@ -23,6 +45,7 @@
 
 ### Chores & Maintenance
 
+- Upgrade to Gusto Embedded API v2025-06-15
 - Bump react-hook-form from 7.65.0 to 7.66.0
 - Bump typescript-eslint from 8.46.2 to 8.46.3
 - Bump @ladle/react from 5.1.0 to 5.1.1

package/dist/assets/icons/icon-error-outline.svg.js

@@ -0,0 +1,10 @@
+import * as e from "react";
+const a = ({
+  title: t,
+  titleId: r,
+  ...o
+}) => /* @__PURE__ */ e.createElement("svg", { width: 46, height: 46, viewBox: "0 0 46 46", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-labelledby": r, ...o }, t ? /* @__PURE__ */ e.createElement("title", { id: r }, t) : null, /* @__PURE__ */ e.createElement("g", { opacity: 0.3 }, /* @__PURE__ */ e.createElement("path", { d: "M23 6C32.3888 6 40 13.6112 40 23C40 32.3888 32.3888 40 23 40C13.6112 40 6 32.3888 6 23C6 13.6112 13.6112 6 23 6Z", stroke: "white", strokeWidth: 2 })), /* @__PURE__ */ e.createElement("g", { opacity: 0.1 }, /* @__PURE__ */ e.createElement("path", { d: "M23 1C35.1503 1 45 10.8497 45 23C45 35.1503 35.1503 45 23 45C10.8497 45 1 35.1503 1 23C1 10.8497 10.8497 1 23 1Z", stroke: "white", strokeWidth: 2 })), /* @__PURE__ */ e.createElement("path", { d: "M26.5 19.4997L19.5 26.4997M19.5 19.4997L26.5 26.4997M34.6667 22.9997C34.6667 29.443 29.4434 34.6663 23 34.6663C16.5567 34.6663 11.3334 29.443 11.3334 22.9997C11.3334 16.5564 16.5567 11.333 23 11.333C29.4434 11.333 34.6667 16.5564 34.6667 22.9997Z", stroke: "white", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }));
+export {
+  a as default
+};
+//# sourceMappingURL=icon-error-outline.svg.js.map

package/dist/assets/icons/icon-error-outline.svg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-error-outline.svg.js","sources":["../../../src/assets/icons/icon-error-outline.svg?react"],"sourcesContent":["import * as React from \"react\";\nconst SvgIconErrorOutline = ({\n  title,\n  titleId,\n  ...props\n}) => /* @__PURE__ */ React.createElement(\"svg\", { width: 46, height: 46, viewBox: \"0 0 46 46\", fill: \"none\", xmlns: \"http://www.w3.org/2000/svg\", \"aria-labelledby\": titleId, ...props }, title ? /* @__PURE__ */ React.createElement(\"title\", { id: titleId }, title) : null, /* @__PURE__ */ React.createElement(\"g\", { opacity: 0.3 }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M23 6C32.3888 6 40 13.6112 40 23C40 32.3888 32.3888 40 23 40C13.6112 40 6 32.3888 6 23C6 13.6112 13.6112 6 23 6Z\", stroke: \"white\", strokeWidth: 2 })), /* @__PURE__ */ React.createElement(\"g\", { opacity: 0.1 }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M23 1C35.1503 1 45 10.8497 45 23C45 35.1503 35.1503 45 23 45C10.8497 45 1 35.1503 1 23C1 10.8497 10.8497 1 23 1Z\", stroke: \"white\", strokeWidth: 2 })), /* @__PURE__ */ React.createElement(\"path\", { d: \"M26.5 19.4997L19.5 26.4997M19.5 19.4997L26.5 26.4997M34.6667 22.9997C34.6667 29.443 29.4434 34.6663 23 34.6663C16.5567 34.6663 11.3334 29.443 11.3334 22.9997C11.3334 16.5564 16.5567 11.333 23 11.333C29.4434 11.333 34.6667 16.5564 34.6667 22.9997Z\", stroke: \"white\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }));\nexport default SvgIconErrorOutline;\n"],"names":["SvgIconErrorOutline","title","titleId","props","React"],"mappings":";AACK,MAACA,IAAsB,CAAC;AAAA,EAC3B,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,MAAsB,gBAAAC,EAAM,cAAc,OAAO,EAAE,OAAO,IAAI,QAAQ,IAAI,SAAS,aAAa,MAAM,QAAQ,OAAO,8BAA8B,mBAAmBF,GAAS,GAAGC,EAAK,GAAIF,IAAwB,gBAAAG,EAAM,cAAc,SAAS,EAAE,IAAIF,EAAO,GAAID,CAAK,IAAI,MAAsB,gBAAAG,EAAM,cAAc,KAAK,EAAE,SAAS,IAAG,GAAoB,gBAAAA,EAAM,cAAc,QAAQ,EAAE,GAAG,oHAAoH,QAAQ,SAAS,aAAa,EAAC,CAAE,CAAC,GAAmB,gBAAAA,EAAM,cAAc,KAAK,EAAE,SAAS,IAAG,GAAoB,gBAAAA,EAAM,cAAc,QAAQ,EAAE,GAAG,oHAAoH,QAAQ,SAAS,aAAa,GAAG,CAAC,GAAmB,gBAAAA,EAAM,cAAc,QAAQ,EAAE,GAAG,0PAA0P,QAAQ,SAAS,aAAa,GAAG,eAAe,SAAS,gBAAgB,SAAS,CAAC;"}

package/dist/assets/icons/icon-info-outline.svg.js

@@ -0,0 +1,10 @@
+import * as e from "react";
+const a = ({
+  title: t,
+  titleId: o,
+  ...r
+}) => /* @__PURE__ */ e.createElement("svg", { width: 46, height: 46, viewBox: "0 0 46 46", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-labelledby": o, ...r }, t ? /* @__PURE__ */ e.createElement("title", { id: o }, t) : null, /* @__PURE__ */ e.createElement("g", { opacity: 0.3 }, /* @__PURE__ */ e.createElement("path", { d: "M23 6C32.3888 6 40 13.6112 40 23C40 32.3888 32.3888 40 23 40C13.6112 40 6 32.3888 6 23C6 13.6112 13.6112 6 23 6Z", stroke: "white", strokeWidth: 2 })), /* @__PURE__ */ e.createElement("g", { opacity: 0.1 }, /* @__PURE__ */ e.createElement("path", { d: "M23 1C35.1503 1 45 10.8497 45 23C45 35.1503 35.1503 45 23 45C10.8497 45 1 35.1503 1 23C1 10.8497 10.8497 1 23 1Z", stroke: "white", strokeWidth: 2 })), /* @__PURE__ */ e.createElement("path", { d: "M22.9999 18.334V23.0007M22.9999 27.6673H23.0116M34.6666 23.0007C34.6666 29.444 29.4432 34.6673 22.9999 34.6673C16.5566 34.6673 11.3333 29.444 11.3333 23.0007C11.3333 16.5573 16.5566 11.334 22.9999 11.334C29.4432 11.334 34.6666 16.5573 34.6666 23.0007Z", stroke: "white", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }));
+export {
+  a as default
+};
+//# sourceMappingURL=icon-info-outline.svg.js.map

package/dist/assets/icons/icon-info-outline.svg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-info-outline.svg.js","sources":["../../../src/assets/icons/icon-info-outline.svg?react"],"sourcesContent":["import * as React from \"react\";\nconst SvgIconInfoOutline = ({\n  title,\n  titleId,\n  ...props\n}) => /* @__PURE__ */ React.createElement(\"svg\", { width: 46, height: 46, viewBox: \"0 0 46 46\", fill: \"none\", xmlns: \"http://www.w3.org/2000/svg\", \"aria-labelledby\": titleId, ...props }, title ? /* @__PURE__ */ React.createElement(\"title\", { id: titleId }, title) : null, /* @__PURE__ */ React.createElement(\"g\", { opacity: 0.3 }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M23 6C32.3888 6 40 13.6112 40 23C40 32.3888 32.3888 40 23 40C13.6112 40 6 32.3888 6 23C6 13.6112 13.6112 6 23 6Z\", stroke: \"white\", strokeWidth: 2 })), /* @__PURE__ */ React.createElement(\"g\", { opacity: 0.1 }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M23 1C35.1503 1 45 10.8497 45 23C45 35.1503 35.1503 45 23 45C10.8497 45 1 35.1503 1 23C1 10.8497 10.8497 1 23 1Z\", stroke: \"white\", strokeWidth: 2 })), /* @__PURE__ */ React.createElement(\"path\", { d: \"M22.9999 18.334V23.0007M22.9999 27.6673H23.0116M34.6666 23.0007C34.6666 29.444 29.4432 34.6673 22.9999 34.6673C16.5566 34.6673 11.3333 29.444 11.3333 23.0007C11.3333 16.5573 16.5566 11.334 22.9999 11.334C29.4432 11.334 34.6666 16.5573 34.6666 23.0007Z\", stroke: \"white\", strokeWidth: 2, strokeLinecap: \"round\", strokeLinejoin: \"round\" }));\nexport default SvgIconInfoOutline;\n"],"names":["SvgIconInfoOutline","title","titleId","props","React"],"mappings":";AACK,MAACA,IAAqB,CAAC;AAAA,EAC1B,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,MAAsB,gBAAAC,EAAM,cAAc,OAAO,EAAE,OAAO,IAAI,QAAQ,IAAI,SAAS,aAAa,MAAM,QAAQ,OAAO,8BAA8B,mBAAmBF,GAAS,GAAGC,EAAK,GAAIF,IAAwB,gBAAAG,EAAM,cAAc,SAAS,EAAE,IAAIF,EAAO,GAAID,CAAK,IAAI,MAAsB,gBAAAG,EAAM,cAAc,KAAK,EAAE,SAAS,IAAG,GAAoB,gBAAAA,EAAM,cAAc,QAAQ,EAAE,GAAG,oHAAoH,QAAQ,SAAS,aAAa,EAAC,CAAE,CAAC,GAAmB,gBAAAA,EAAM,cAAc,KAAK,EAAE,SAAS,IAAG,GAAoB,gBAAAA,EAAM,cAAc,QAAQ,EAAE,GAAG,oHAAoH,QAAQ,SAAS,aAAa,GAAG,CAAC,GAAmB,gBAAAA,EAAM,cAAc,QAAQ,EAAE,GAAG,+PAA+P,QAAQ,SAAS,aAAa,GAAG,eAAe,SAAS,gBAAgB,SAAS,CAAC;"}

package/dist/assets/icons/icon-zap-fast.svg.js

@@ -0,0 +1,10 @@
+import * as e from "react";
+const o = ({
+  title: t,
+  titleId: a,
+  ...n
+}) => /* @__PURE__ */ e.createElement("svg", { width: 12, height: 10, viewBox: "0 0 12 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-labelledby": a, ...n }, t ? /* @__PURE__ */ e.createElement("title", { id: a }, t) : null, /* @__PURE__ */ e.createElement("path", { d: "M4 7.75006H1.25M2.75 5.00006H0.5M4 2.25006H1.5M8 0.500061L4.70178 5.11757C4.5558 5.32194 4.48281 5.42413 4.48597 5.50933C4.48872 5.5835 4.52429 5.65262 4.58305 5.69797C4.65054 5.75006 4.77612 5.75006 5.02728 5.75006H7.5L7 9.50006L10.2982 4.88256C10.4442 4.67818 10.5172 4.57599 10.514 4.4908C10.5113 4.41662 10.4757 4.3475 10.417 4.30215C10.3495 4.25006 10.2239 4.25006 9.97272 4.25006H7.5L8 0.500061Z", stroke: "#079455", strokeLinecap: "round", strokeLinejoin: "round" }));
+export {
+  o as default
+};
+//# sourceMappingURL=icon-zap-fast.svg.js.map

package/dist/assets/icons/icon-zap-fast.svg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-zap-fast.svg.js","sources":["../../../src/assets/icons/icon-zap-fast.svg?react"],"sourcesContent":["import * as React from \"react\";\nconst SvgIconZapFast = ({\n  title,\n  titleId,\n  ...props\n}) => /* @__PURE__ */ React.createElement(\"svg\", { width: 12, height: 10, viewBox: \"0 0 12 10\", fill: \"none\", xmlns: \"http://www.w3.org/2000/svg\", \"aria-labelledby\": titleId, ...props }, title ? /* @__PURE__ */ React.createElement(\"title\", { id: titleId }, title) : null, /* @__PURE__ */ React.createElement(\"path\", { d: \"M4 7.75006H1.25M2.75 5.00006H0.5M4 2.25006H1.5M8 0.500061L4.70178 5.11757C4.5558 5.32194 4.48281 5.42413 4.48597 5.50933C4.48872 5.5835 4.52429 5.65262 4.58305 5.69797C4.65054 5.75006 4.77612 5.75006 5.02728 5.75006H7.5L7 9.50006L10.2982 4.88256C10.4442 4.67818 10.5172 4.57599 10.514 4.4908C10.5113 4.41662 10.4757 4.3475 10.417 4.30215C10.3495 4.25006 10.2239 4.25006 9.97272 4.25006H7.5L8 0.500061Z\", stroke: \"#079455\", strokeLinecap: \"round\", strokeLinejoin: \"round\" }));\nexport default SvgIconZapFast;\n"],"names":["SvgIconZapFast","title","titleId","props","React"],"mappings":";AACK,MAACA,IAAiB,CAAC;AAAA,EACtB,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,MAAsB,gBAAAC,EAAM,cAAc,OAAO,EAAE,OAAO,IAAI,QAAQ,IAAI,SAAS,aAAa,MAAM,QAAQ,OAAO,8BAA8B,mBAAmBF,GAAS,GAAGC,EAAK,GAAIF,IAAwB,gBAAAG,EAAM,cAAc,SAAS,EAAE,IAAIF,EAAO,GAAID,CAAK,IAAI,MAAsB,gBAAAG,EAAM,cAAc,QAAQ,EAAE,GAAG,qZAAqZ,QAAQ,WAAW,eAAe,SAAS,gBAAgB,SAAS,CAAC;"}

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

@@ -1,4 +1,4 @@
-const e = "_root_15bax_1", i = "_legendAndDescription_15bax_10", s = "_withVisibleLegend_15bax_14", t = "_withDescription_15bax_17", o = "_errorMessage_15bax_21", n = {
+const e = "_root_1xzgf_1", i = "_legendAndDescription_1xzgf_10", s = "_withVisibleLegend_1xzgf_14", t = "_withDescription_1xzgf_17", o = "_errorMessage_1xzgf_21", n = {
   root: e,
   legendAndDescription: i,
   withVisibleLegend: s,

package/dist/components/Common/PaginationControl/PaginationControl.js

@@ -1,7 +1,7 @@
-import { jsx as n, jsxs as e } from "react/jsx-runtime";
+import { jsx as n, jsxs as l } from "react/jsx-runtime";
 import { useTranslation as C } from "react-i18next";
 import { Flex as f } from "../Flex/Flex.js";
-import l from "./PaginationControl.module.scss.js";
+import e from "./PaginationControl.module.scss.js";
 import { useComponentContext as r } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import v from "../../../assets/icons/pagination_first.svg.js";
 import h from "../../../assets/icons/pagination_previous.svg.js";
@@ -20,11 +20,11 @@ const L = ({
   itemsPerPage: u = 5
 }) => {
   const { t } = C("common"), a = r();
-  return o < 2 ? null : /* @__PURE__ */ n("section", { className: l.paginationControl, "data-testid": "pagination-control", children: /* @__PURE__ */ e(f, { justifyContent: "space-between", alignItems: "center", children: [
-    /* @__PURE__ */ n("div", { className: l.paginationControlCount, children: /* @__PURE__ */ n("section", { children: /* @__PURE__ */ n(
+  return o < 2 ? null : /* @__PURE__ */ n("section", { className: e.paginationControl, "data-testid": "pagination-control", children: /* @__PURE__ */ l(f, { justifyContent: "space-between", alignItems: "center", children: [
+    /* @__PURE__ */ n("div", { className: e.paginationControlCount, children: /* @__PURE__ */ n("section", { children: /* @__PURE__ */ n(
       a.Select,
       {
-        label: t("labels.paginationControllCountLabel"),
+        label: t("labels.paginationControlCountLabel"),
         shouldVisuallyHideLabel: !0,
         value: u.toString(),
         onChange: (b) => {
@@ -37,7 +37,7 @@ const L = ({
         ]
       }
     ) }) }),
-    /* @__PURE__ */ e("div", { className: l.paginationControlButtons, children: [
+    /* @__PURE__ */ l("div", { className: e.paginationControlButtons, children: [
       s && /* @__PURE__ */ n(I, { ariaLabel: t("labels.paginationFetchingLabel") }),
       /* @__PURE__ */ n(
         a.ButtonIcon,

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

@@ -1 +1 @@
-{"version":3,"file":"PaginationControl.js","sources":["../../../../src/components/Common/PaginationControl/PaginationControl.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { Flex } from '../Flex/Flex'\nimport { InlineSpinner } from '../InlineSpinner'\nimport style from './PaginationControl.module.scss'\nimport type { PaginationControlProps, PaginationItemsPerPage } from './PaginationControlTypes'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport PaginationFirstIcon from '@/assets/icons/pagination_first.svg?react'\nimport PaginationPrevIcon from '@/assets/icons/pagination_previous.svg?react'\nimport PaginationNextIcon from '@/assets/icons/pagination_next.svg?react'\nimport PaginationLastIcon from '@/assets/icons/pagination_last.svg?react'\n\nconst DefaultPaginationControl = ({\n  currentPage,\n  totalPages,\n  isFetching,\n  handleFirstPage,\n  handlePreviousPage,\n  handleNextPage,\n  handleLastPage,\n  handleItemsPerPageChange,\n  itemsPerPage = 5,\n}: PaginationControlProps) => {\n  const { t } = useTranslation('common')\n  const Components = useComponentContext()\n\n  if (totalPages < 2) {\n    return null\n  }\n\n  return (\n    <section className={style.paginationControl} data-testid=\"pagination-control\">\n      <Flex justifyContent=\"space-between\" alignItems=\"center\">\n        <div className={style.paginationControlCount}>\n          <section>\n            <Components.Select\n              label={t('labels.paginationControllCountLabel')}\n              shouldVisuallyHideLabel\n              value={itemsPerPage.toString()}\n              onChange={n => {\n                handleItemsPerPageChange(Number(n) as PaginationItemsPerPage)\n              }}\n              options={[\n                { value: '5', label: '5' },\n                { value: '10', label: '10' },\n                { value: '50', label: '50' },\n              ]}\n            />\n          </section>\n        </div>\n        <div className={style.paginationControlButtons}>\n          {isFetching && <InlineSpinner ariaLabel={t('labels.paginationFetchingLabel')} />}\n          <Components.ButtonIcon\n            aria-label={t('icons.paginationFirst')}\n            isDisabled={currentPage === 1}\n            onClick={handleFirstPage}\n          >\n            <PaginationFirstIcon />\n          </Components.ButtonIcon>\n          <Components.ButtonIcon\n            aria-label={t('icons.paginationPrev')}\n            data-testid=\"pagination-previous\"\n            isDisabled={currentPage === 1}\n            onClick={handlePreviousPage}\n          >\n            <PaginationPrevIcon />\n          </Components.ButtonIcon>\n          <Components.ButtonIcon\n            aria-label={t('icons.paginationNext')}\n            data-testid=\"pagination-next\"\n            isDisabled={currentPage === totalPages}\n            onClick={handleNextPage}\n          >\n            <PaginationNextIcon />\n          </Components.ButtonIcon>\n          <Components.ButtonIcon\n            aria-label={t('icons.paginationLast')}\n            isDisabled={currentPage === totalPages}\n            onClick={handleLastPage}\n          >\n            <PaginationLastIcon />\n          </Components.ButtonIcon>\n        </div>\n      </Flex>\n    </section>\n  )\n}\n\nexport const PaginationControl = (props: PaginationControlProps) => {\n  const Components = useComponentContext()\n\n  return Components.PaginationControl ? (\n    <Components.PaginationControl {...props} />\n  ) : (\n    <DefaultPaginationControl {...props} />\n  )\n}\n"],"names":["DefaultPaginationControl","currentPage","totalPages","isFetching","handleFirstPage","handlePreviousPage","handleNextPage","handleLastPage","handleItemsPerPageChange","itemsPerPage","useTranslation","Components","useComponentContext","jsx","style","jsxs","Flex","n","InlineSpinner","PaginationFirstIcon","PaginationPrevIcon","PaginationNextIcon","PaginationLastIcon","PaginationControl","props"],"mappings":";;;;;;;;;;AAWA,MAAMA,IAA2B,CAAC;AAAA,EAChC,aAAAC;AAAA,EACA,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,0BAAAC;AAAA,EACA,cAAAC,IAAe;AACjB,MAA8B;AAC5B,QAAM,EAAE,EAAA,IAAMC,EAAe,QAAQ,GAC/BC,IAAaC,EAAA;AAEnB,SAAIV,IAAa,IACR,OAIP,gBAAAW,EAAC,WAAA,EAAQ,WAAWC,EAAM,mBAAmB,eAAY,sBACvD,UAAA,gBAAAC,EAACC,GAAA,EAAK,gBAAe,iBAAgB,YAAW,UAC9C,UAAA;AAAA,IAAA,gBAAAH,EAAC,OAAA,EAAI,WAAWC,EAAM,wBACpB,4BAAC,WAAA,EACC,UAAA,gBAAAD;AAAA,MAACF,EAAW;AAAA,MAAX;AAAA,QACC,OAAO,EAAE,qCAAqC;AAAA,QAC9C,yBAAuB;AAAA,QACvB,OAAOF,EAAa,SAAA;AAAA,QACpB,UAAU,CAAAQ,MAAK;AACb,UAAAT,EAAyB,OAAOS,CAAC,CAA2B;AAAA,QAC9D;AAAA,QACA,SAAS;AAAA,UACP,EAAE,OAAO,KAAK,OAAO,IAAA;AAAA,UACrB,EAAE,OAAO,MAAM,OAAO,KAAA;AAAA,UACtB,EAAE,OAAO,MAAM,OAAO,KAAA;AAAA,QAAK;AAAA,MAC7B;AAAA,IAAA,GAEJ,EAAA,CACF;AAAA,IACA,gBAAAF,EAAC,OAAA,EAAI,WAAWD,EAAM,0BACnB,UAAA;AAAA,MAAAX,KAAc,gBAAAU,EAACK,GAAA,EAAc,WAAW,EAAE,gCAAgC,GAAG;AAAA,MAC9E,gBAAAL;AAAA,QAACF,EAAW;AAAA,QAAX;AAAA,UACC,cAAY,EAAE,uBAAuB;AAAA,UACrC,YAAYV,MAAgB;AAAA,UAC5B,SAASG;AAAA,UAET,4BAACe,GAAA,CAAA,CAAoB;AAAA,QAAA;AAAA,MAAA;AAAA,MAEvB,gBAAAN;AAAA,QAACF,EAAW;AAAA,QAAX;AAAA,UACC,cAAY,EAAE,sBAAsB;AAAA,UACpC,eAAY;AAAA,UACZ,YAAYV,MAAgB;AAAA,UAC5B,SAASI;AAAA,UAET,4BAACe,GAAA,CAAA,CAAmB;AAAA,QAAA;AAAA,MAAA;AAAA,MAEtB,gBAAAP;AAAA,QAACF,EAAW;AAAA,QAAX;AAAA,UACC,cAAY,EAAE,sBAAsB;AAAA,UACpC,eAAY;AAAA,UACZ,YAAYV,MAAgBC;AAAA,UAC5B,SAASI;AAAA,UAET,4BAACe,GAAA,CAAA,CAAmB;AAAA,QAAA;AAAA,MAAA;AAAA,MAEtB,gBAAAR;AAAA,QAACF,EAAW;AAAA,QAAX;AAAA,UACC,cAAY,EAAE,sBAAsB;AAAA,UACpC,YAAYV,MAAgBC;AAAA,UAC5B,SAASK;AAAA,UAET,4BAACe,GAAA,CAAA,CAAmB;AAAA,QAAA;AAAA,MAAA;AAAA,IACtB,EAAA,CACF;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ,GAEaC,IAAoB,CAACC,MAAkC;AAClE,QAAMb,IAAaC,EAAA;AAEnB,SAAOD,EAAW,oBAChB,gBAAAE,EAACF,EAAW,mBAAX,EAA8B,GAAGa,EAAA,CAAO,IAEzC,gBAAAX,EAACb,GAAA,EAA0B,GAAGwB,EAAA,CAAO;AAEzC;"}
+{"version":3,"file":"PaginationControl.js","sources":["../../../../src/components/Common/PaginationControl/PaginationControl.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { Flex } from '../Flex/Flex'\nimport { InlineSpinner } from '../InlineSpinner'\nimport style from './PaginationControl.module.scss'\nimport type { PaginationControlProps, PaginationItemsPerPage } from './PaginationControlTypes'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport PaginationFirstIcon from '@/assets/icons/pagination_first.svg?react'\nimport PaginationPrevIcon from '@/assets/icons/pagination_previous.svg?react'\nimport PaginationNextIcon from '@/assets/icons/pagination_next.svg?react'\nimport PaginationLastIcon from '@/assets/icons/pagination_last.svg?react'\n\nconst DefaultPaginationControl = ({\n  currentPage,\n  totalPages,\n  isFetching,\n  handleFirstPage,\n  handlePreviousPage,\n  handleNextPage,\n  handleLastPage,\n  handleItemsPerPageChange,\n  itemsPerPage = 5,\n}: PaginationControlProps) => {\n  const { t } = useTranslation('common')\n  const Components = useComponentContext()\n\n  if (totalPages < 2) {\n    return null\n  }\n\n  return (\n    <section className={style.paginationControl} data-testid=\"pagination-control\">\n      <Flex justifyContent=\"space-between\" alignItems=\"center\">\n        <div className={style.paginationControlCount}>\n          <section>\n            <Components.Select\n              label={t('labels.paginationControlCountLabel')}\n              shouldVisuallyHideLabel\n              value={itemsPerPage.toString()}\n              onChange={n => {\n                handleItemsPerPageChange(Number(n) as PaginationItemsPerPage)\n              }}\n              options={[\n                { value: '5', label: '5' },\n                { value: '10', label: '10' },\n                { value: '50', label: '50' },\n              ]}\n            />\n          </section>\n        </div>\n        <div className={style.paginationControlButtons}>\n          {isFetching && <InlineSpinner ariaLabel={t('labels.paginationFetchingLabel')} />}\n          <Components.ButtonIcon\n            aria-label={t('icons.paginationFirst')}\n            isDisabled={currentPage === 1}\n            onClick={handleFirstPage}\n          >\n            <PaginationFirstIcon />\n          </Components.ButtonIcon>\n          <Components.ButtonIcon\n            aria-label={t('icons.paginationPrev')}\n            data-testid=\"pagination-previous\"\n            isDisabled={currentPage === 1}\n            onClick={handlePreviousPage}\n          >\n            <PaginationPrevIcon />\n          </Components.ButtonIcon>\n          <Components.ButtonIcon\n            aria-label={t('icons.paginationNext')}\n            data-testid=\"pagination-next\"\n            isDisabled={currentPage === totalPages}\n            onClick={handleNextPage}\n          >\n            <PaginationNextIcon />\n          </Components.ButtonIcon>\n          <Components.ButtonIcon\n            aria-label={t('icons.paginationLast')}\n            isDisabled={currentPage === totalPages}\n            onClick={handleLastPage}\n          >\n            <PaginationLastIcon />\n          </Components.ButtonIcon>\n        </div>\n      </Flex>\n    </section>\n  )\n}\n\nexport const PaginationControl = (props: PaginationControlProps) => {\n  const Components = useComponentContext()\n\n  return Components.PaginationControl ? (\n    <Components.PaginationControl {...props} />\n  ) : (\n    <DefaultPaginationControl {...props} />\n  )\n}\n"],"names":["DefaultPaginationControl","currentPage","totalPages","isFetching","handleFirstPage","handlePreviousPage","handleNextPage","handleLastPage","handleItemsPerPageChange","itemsPerPage","useTranslation","Components","useComponentContext","jsx","style","jsxs","Flex","n","InlineSpinner","PaginationFirstIcon","PaginationPrevIcon","PaginationNextIcon","PaginationLastIcon","PaginationControl","props"],"mappings":";;;;;;;;;;AAWA,MAAMA,IAA2B,CAAC;AAAA,EAChC,aAAAC;AAAA,EACA,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,0BAAAC;AAAA,EACA,cAAAC,IAAe;AACjB,MAA8B;AAC5B,QAAM,EAAE,EAAA,IAAMC,EAAe,QAAQ,GAC/BC,IAAaC,EAAA;AAEnB,SAAIV,IAAa,IACR,OAIP,gBAAAW,EAAC,WAAA,EAAQ,WAAWC,EAAM,mBAAmB,eAAY,sBACvD,UAAA,gBAAAC,EAACC,GAAA,EAAK,gBAAe,iBAAgB,YAAW,UAC9C,UAAA;AAAA,IAAA,gBAAAH,EAAC,OAAA,EAAI,WAAWC,EAAM,wBACpB,4BAAC,WAAA,EACC,UAAA,gBAAAD;AAAA,MAACF,EAAW;AAAA,MAAX;AAAA,QACC,OAAO,EAAE,oCAAoC;AAAA,QAC7C,yBAAuB;AAAA,QACvB,OAAOF,EAAa,SAAA;AAAA,QACpB,UAAU,CAAAQ,MAAK;AACb,UAAAT,EAAyB,OAAOS,CAAC,CAA2B;AAAA,QAC9D;AAAA,QACA,SAAS;AAAA,UACP,EAAE,OAAO,KAAK,OAAO,IAAA;AAAA,UACrB,EAAE,OAAO,MAAM,OAAO,KAAA;AAAA,UACtB,EAAE,OAAO,MAAM,OAAO,KAAA;AAAA,QAAK;AAAA,MAC7B;AAAA,IAAA,GAEJ,EAAA,CACF;AAAA,IACA,gBAAAF,EAAC,OAAA,EAAI,WAAWD,EAAM,0BACnB,UAAA;AAAA,MAAAX,KAAc,gBAAAU,EAACK,GAAA,EAAc,WAAW,EAAE,gCAAgC,GAAG;AAAA,MAC9E,gBAAAL;AAAA,QAACF,EAAW;AAAA,QAAX;AAAA,UACC,cAAY,EAAE,uBAAuB;AAAA,UACrC,YAAYV,MAAgB;AAAA,UAC5B,SAASG;AAAA,UAET,4BAACe,GAAA,CAAA,CAAoB;AAAA,QAAA;AAAA,MAAA;AAAA,MAEvB,gBAAAN;AAAA,QAACF,EAAW;AAAA,QAAX;AAAA,UACC,cAAY,EAAE,sBAAsB;AAAA,UACpC,eAAY;AAAA,UACZ,YAAYV,MAAgB;AAAA,UAC5B,SAASI;AAAA,UAET,4BAACe,GAAA,CAAA,CAAmB;AAAA,QAAA;AAAA,MAAA;AAAA,MAEtB,gBAAAP;AAAA,QAACF,EAAW;AAAA,QAAX;AAAA,UACC,cAAY,EAAE,sBAAsB;AAAA,UACpC,eAAY;AAAA,UACZ,YAAYV,MAAgBC;AAAA,UAC5B,SAASI;AAAA,UAET,4BAACe,GAAA,CAAA,CAAmB;AAAA,QAAA;AAAA,MAAA;AAAA,MAEtB,gBAAAR;AAAA,QAACF,EAAW;AAAA,QAAX;AAAA,UACC,cAAY,EAAE,sBAAsB;AAAA,UACpC,YAAYV,MAAgBC;AAAA,UAC5B,SAASK;AAAA,UAET,4BAACe,GAAA,CAAA,CAAmB;AAAA,QAAA;AAAA,MAAA;AAAA,IACtB,EAAA,CACF;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ,GAEaC,IAAoB,CAACC,MAAkC;AAClE,QAAMb,IAAaC,EAAA;AAEnB,SAAOD,EAAW,oBAChB,gBAAAE,EAACF,EAAW,mBAAX,EAA8B,GAAGa,EAAA,CAAO,IAEzC,gBAAAX,EAACb,GAAA,EAA0B,GAAGwB,EAAA,CAAO;AAEzC;"}

package/dist/components/Common/RequirementsList/RequirementsList.js

@@ -1,21 +1,27 @@
 import { jsx as e, jsxs as s } from "react/jsx-runtime";
-import c from "classnames";
-import { useId as a } from "react";
+import l from "classnames";
+import { useId as d } from "react";
 import { Flex as m } from "../Flex/Flex.js";
 import i from "./RequirementsList.module.scss.js";
-import { useComponentContext as d } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useComponentContext as a } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import p from "../../../assets/icons/checkbox.svg.js";
-const v = ({ requirements: n }) => {
-  const r = d(), l = a();
-  return /* @__PURE__ */ e(m, { flexDirection: "column", alignItems: "flex-start", gap: 8, children: /* @__PURE__ */ e("ul", { className: i.list, children: n.sort((t, o) => t.completed ? -1 : 1).map((t, o) => /* @__PURE__ */ s("li", { className: i.listItem, children: [
-    t.completed ? /* @__PURE__ */ e("div", { className: c(i.listItemIcon, i.success), children: /* @__PURE__ */ e(p, { width: 16, height: 16 }) }) : /* @__PURE__ */ e("div", { className: i.listItemIcon, children: o + 1 }),
-    /* @__PURE__ */ s(m, { flexDirection: "column", gap: 0, children: [
-      /* @__PURE__ */ e(r.Heading, { as: "h4", children: t.title }),
-      /* @__PURE__ */ e(r.Text, { variant: "supporting", children: t.description })
-    ] })
-  ] }, `${l}-${o}-${t.description}`)) }) });
+const N = ({ requirements: n }) => {
+  const o = a(), c = d();
+  return /* @__PURE__ */ e(m, { flexDirection: "column", alignItems: "flex-start", gap: 8, children: /* @__PURE__ */ e(
+    o.UnorderedList,
+    {
+      className: i.list,
+      items: n.sort((t, r) => t.completed ? -1 : 1).map((t, r) => /* @__PURE__ */ s("div", { className: i.listItem, children: [
+        t.completed ? /* @__PURE__ */ e("div", { className: l(i.listItemIcon, i.success), children: /* @__PURE__ */ e(p, { width: 16, height: 16 }) }) : /* @__PURE__ */ e("div", { className: i.listItemIcon, children: r + 1 }),
+        /* @__PURE__ */ s(m, { flexDirection: "column", gap: 0, children: [
+          /* @__PURE__ */ e(o.Heading, { as: "h4", children: t.title }),
+          /* @__PURE__ */ e(o.Text, { variant: "supporting", children: t.description })
+        ] })
+      ] }, `${c}-${r}-${t.description}`))
+    }
+  ) });
 };
 export {
-  v as RequirementsList
+  N as RequirementsList
 };
 //# sourceMappingURL=RequirementsList.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"RequirementsList.js","sources":["../../../../src/components/Common/RequirementsList/RequirementsList.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { useId } from 'react'\nimport { Flex } from '../Flex/Flex'\nimport styles from './RequirementsList.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport SuccessCheck from '@/assets/icons/checkbox.svg?react'\n\ninterface RequirementsListProps {\n  requirements: {\n    title: string\n    description: string\n    completed: boolean\n  }[]\n}\nexport const RequirementsList = ({ requirements }: RequirementsListProps) => {\n  const Components = useComponentContext()\n  const id = useId()\n\n  return (\n    <Flex flexDirection=\"column\" alignItems=\"flex-start\" gap={8}>\n      <ul className={styles.list}>\n        {requirements\n          .sort((a, b) => (a.completed ? -1 : 1))\n          .map((step, i) => {\n            return (\n              <li key={`${id}-${i}-${step.description}`} className={styles.listItem}>\n                {step.completed ? (\n                  <div className={classNames(styles.listItemIcon, styles.success)}>\n                    <SuccessCheck width={16} height={16} />\n                  </div>\n                ) : (\n                  <div className={styles.listItemIcon}>{i + 1}</div>\n                )}\n                <Flex flexDirection=\"column\" gap={0}>\n                  <Components.Heading as=\"h4\">{step.title}</Components.Heading>\n                  <Components.Text variant=\"supporting\">{step.description}</Components.Text>\n                </Flex>\n              </li>\n            )\n          })}\n      </ul>\n    </Flex>\n  )\n}\n"],"names":["RequirementsList","requirements","Components","useComponentContext","id","useId","jsx","Flex","styles","a","b","step","i","jsxs","classNames","SuccessCheck"],"mappings":";;;;;;;AAcO,MAAMA,IAAmB,CAAC,EAAE,cAAAC,QAA0C;AAC3E,QAAMC,IAAaC,EAAA,GACbC,IAAKC,EAAA;AAEX,SACE,gBAAAC,EAACC,GAAA,EAAK,eAAc,UAAS,YAAW,cAAa,KAAK,GACxD,UAAA,gBAAAD,EAAC,MAAA,EAAG,WAAWE,EAAO,MACnB,YACE,KAAK,CAACC,GAAGC,MAAOD,EAAE,YAAY,KAAK,CAAE,EACrC,IAAI,CAACE,GAAMC,MAER,gBAAAC,EAAC,MAAA,EAA0C,WAAWL,EAAO,UAC1D,UAAA;AAAA,IAAAG,EAAK,YACJ,gBAAAL,EAAC,OAAA,EAAI,WAAWQ,EAAWN,EAAO,cAAcA,EAAO,OAAO,GAC5D,UAAA,gBAAAF,EAACS,GAAA,EAAa,OAAO,IAAI,QAAQ,GAAA,CAAI,EAAA,CACvC,IAEA,gBAAAT,EAAC,SAAI,WAAWE,EAAO,cAAe,UAAAI,IAAI,EAAA,CAAE;AAAA,IAE9C,gBAAAC,EAACN,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,MAAA,gBAAAD,EAACJ,EAAW,SAAX,EAAmB,IAAG,MAAM,YAAK,OAAM;AAAA,wBACvCA,EAAW,MAAX,EAAgB,SAAQ,cAAc,YAAK,YAAA,CAAY;AAAA,IAAA,EAAA,CAC1D;AAAA,EAAA,KAXO,GAAGE,CAAE,IAAIQ,CAAC,IAAID,EAAK,WAAW,EAYvC,CAEH,GACL,GACF;AAEJ;"}
+{"version":3,"file":"RequirementsList.js","sources":["../../../../src/components/Common/RequirementsList/RequirementsList.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { useId } from 'react'\nimport { Flex } from '../Flex/Flex'\nimport styles from './RequirementsList.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport SuccessCheck from '@/assets/icons/checkbox.svg?react'\n\ninterface RequirementsListProps {\n  requirements: {\n    title: string\n    description: string\n    completed: boolean\n  }[]\n}\nexport const RequirementsList = ({ requirements }: RequirementsListProps) => {\n  const Components = useComponentContext()\n  const id = useId()\n\n  return (\n    <Flex flexDirection=\"column\" alignItems=\"flex-start\" gap={8}>\n      <Components.UnorderedList\n        className={styles.list}\n        items={requirements\n          .sort((a, b) => (a.completed ? -1 : 1))\n          .map((step, i) => {\n            return (\n              <div key={`${id}-${i}-${step.description}`} className={styles.listItem}>\n                {step.completed ? (\n                  <div className={classNames(styles.listItemIcon, styles.success)}>\n                    <SuccessCheck width={16} height={16} />\n                  </div>\n                ) : (\n                  <div className={styles.listItemIcon}>{i + 1}</div>\n                )}\n                <Flex flexDirection=\"column\" gap={0}>\n                  <Components.Heading as=\"h4\">{step.title}</Components.Heading>\n                  <Components.Text variant=\"supporting\">{step.description}</Components.Text>\n                </Flex>\n              </div>\n            )\n          })}\n      />\n    </Flex>\n  )\n}\n"],"names":["RequirementsList","requirements","Components","useComponentContext","id","useId","Flex","jsx","styles","a","b","step","i","jsxs","classNames","SuccessCheck"],"mappings":";;;;;;;AAcO,MAAMA,IAAmB,CAAC,EAAE,cAAAC,QAA0C;AAC3E,QAAMC,IAAaC,EAAA,GACbC,IAAKC,EAAA;AAEX,2BACGC,GAAA,EAAK,eAAc,UAAS,YAAW,cAAa,KAAK,GACxD,UAAA,gBAAAC;AAAA,IAACL,EAAW;AAAA,IAAX;AAAA,MACC,WAAWM,EAAO;AAAA,MAClB,OAAOP,EACJ,KAAK,CAACQ,GAAGC,MAAOD,EAAE,YAAY,KAAK,CAAE,EACrC,IAAI,CAACE,GAAMC,MAER,gBAAAC,EAAC,OAAA,EAA2C,WAAWL,EAAO,UAC3D,UAAA;AAAA,QAAAG,EAAK,YACJ,gBAAAJ,EAAC,OAAA,EAAI,WAAWO,EAAWN,EAAO,cAAcA,EAAO,OAAO,GAC5D,UAAA,gBAAAD,EAACQ,GAAA,EAAa,OAAO,IAAI,QAAQ,GAAA,CAAI,EAAA,CACvC,IAEA,gBAAAR,EAAC,SAAI,WAAWC,EAAO,cAAe,UAAAI,IAAI,EAAA,CAAE;AAAA,QAE9C,gBAAAC,EAACP,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,UAAA,gBAAAC,EAACL,EAAW,SAAX,EAAmB,IAAG,MAAM,YAAK,OAAM;AAAA,4BACvCA,EAAW,MAAX,EAAgB,SAAQ,cAAc,YAAK,YAAA,CAAY;AAAA,QAAA,EAAA,CAC1D;AAAA,MAAA,KAXQ,GAAGE,CAAE,IAAIQ,CAAC,IAAID,EAAK,WAAW,EAYxC,CAEH;AAAA,IAAA;AAAA,EAAA,GAEP;AAEJ;"}

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

@@ -1,4 +1,4 @@
-const s = "_list_1m8z2_1", t = "_listItem_1m8z2_5", c = "_listItemIcon_1m8z2_22", e = "_success_1m8z2_35", _ = {
+const s = "_list_19wwb_1", t = "_listItem_19wwb_12", c = "_listItemIcon_19wwb_29", e = "_success_19wwb_42", _ = {
   list: s,
   listItem: t,
   listItemIcon: c,

package/dist/components/Common/UI/Badge/index.d.ts

@@ -0,0 +1,2 @@
+import "./types/i18next.d.ts"
+export {};

package/dist/components/Common/UI/Banner/Banner.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { BannerProps } from './BannerTypes';
+export declare const Banner: React.FC<BannerProps>;

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

@@ -0,0 +1,31 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import p from "classnames";
+import r from "./Banner.module.scss.js";
+import { BannerDefaults as d } from "./BannerTypes.js";
+import { applyMissingDefaults as f } from "../../../../helpers/applyMissingDefaults.js";
+import u from "../../../../assets/icons/icon-info-outline.svg.js";
+import v from "../../../../assets/icons/icon-error-outline.svg.js";
+const B = (o) => {
+  const a = f(o, d), { className: n, title: i, children: l, status: s, ...m } = a, c = s === "error" ? v : u;
+  return /* @__PURE__ */ t(
+    "div",
+    {
+      ...m,
+      className: p(r.banner, n),
+      "data-status": s,
+      role: "status",
+      "aria-live": "polite",
+      children: [
+        /* @__PURE__ */ t("div", { className: r.header, children: [
+          /* @__PURE__ */ e(c, { "aria-hidden": !0 }),
+          /* @__PURE__ */ e("div", { className: r.title, children: i })
+        ] }),
+        /* @__PURE__ */ e("div", { className: r.content, children: l })
+      ]
+    }
+  );
+};
+export {
+  B as Banner
+};
+//# sourceMappingURL=Banner.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Banner.js","sources":["../../../../../src/components/Common/UI/Banner/Banner.tsx"],"sourcesContent":["import type React from 'react'\nimport classnames from 'classnames'\nimport styles from './Banner.module.scss'\nimport type { BannerProps } from './BannerTypes'\nimport { BannerDefaults } from './BannerTypes'\nimport { applyMissingDefaults } from '@/helpers/applyMissingDefaults'\nimport InfoIcon from '@/assets/icons/icon-info-outline.svg?react'\nimport ErrorIcon from '@/assets/icons/icon-error-outline.svg?react'\n\nexport const Banner: React.FC<BannerProps> = rawProps => {\n  const resolvedProps = applyMissingDefaults(rawProps, BannerDefaults)\n  const { className, title, children, status, ...otherProps } = resolvedProps\n\n  const IconComponent = status === 'error' ? ErrorIcon : InfoIcon\n  return (\n    <div\n      {...otherProps}\n      className={classnames(styles.banner, className)}\n      data-status={status}\n      role=\"status\"\n      aria-live=\"polite\"\n    >\n      <div className={styles.header}>\n        <IconComponent aria-hidden />\n        <div className={styles.title}>{title}</div>\n      </div>\n      <div className={styles.content}>{children}</div>\n    </div>\n  )\n}\n"],"names":["Banner","rawProps","resolvedProps","applyMissingDefaults","BannerDefaults","className","title","children","status","otherProps","IconComponent","ErrorIcon","InfoIcon","jsxs","classnames","styles","jsx"],"mappings":";;;;;;;AASO,MAAMA,IAAgC,CAAAC,MAAY;AACvD,QAAMC,IAAgBC,EAAqBF,GAAUG,CAAc,GAC7D,EAAE,WAAAC,GAAW,OAAAC,GAAO,UAAAC,GAAU,QAAAC,GAAQ,GAAGC,MAAeP,GAExDQ,IAAgBF,MAAW,UAAUG,IAAYC;AACvD,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGJ;AAAA,MACJ,WAAWK,EAAWC,EAAO,QAAQV,CAAS;AAAA,MAC9C,eAAaG;AAAA,MACb,MAAK;AAAA,MACL,aAAU;AAAA,MAEV,UAAA;AAAA,QAAA,gBAAAK,EAAC,OAAA,EAAI,WAAWE,EAAO,QACrB,UAAA;AAAA,UAAA,gBAAAC,EAACN,GAAA,EAAc,eAAW,GAAA,CAAC;AAAA,UAC3B,gBAAAM,EAAC,OAAA,EAAI,WAAWD,EAAO,OAAQ,UAAAT,EAAA,CAAM;AAAA,QAAA,GACvC;AAAA,QACA,gBAAAU,EAAC,OAAA,EAAI,WAAWD,EAAO,SAAU,UAAAR,EAAA,CAAS;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGhD;"}

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

@@ -0,0 +1,14 @@
+const t = "_banner_tub6c_1", e = "_header_tub6c_12", n = "_title_tub6c_19", c = "_content_tub6c_25", _ = {
+  banner: t,
+  header: e,
+  title: n,
+  content: c
+};
+export {
+  t as banner,
+  c as content,
+  _ as default,
+  e as header,
+  n as title
+};
+//# sourceMappingURL=Banner.module.scss.js.map

package/dist/components/Common/UI/Banner/Banner.module.scss.js.map

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

package/dist/components/Common/UI/Banner/BannerTypes.d.ts

@@ -0,0 +1,21 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export interface BannerProps extends Pick<HTMLAttributes<HTMLDivElement>, 'className' | 'id' | 'aria-label'> {
+    /**
+     * Title content displayed in the colored header section
+     */
+    title: ReactNode;
+    /**
+     * Content to be displayed in the main content area
+     */
+    children: ReactNode;
+    /**
+     * Visual status variant of the banner
+     */
+    status?: 'warning' | 'error';
+}
+/**
+ * Default prop values for Banner component.
+ */
+export declare const BannerDefaults: {
+    readonly status: "warning";
+};

package/dist/components/Common/UI/Banner/BannerTypes.js

@@ -0,0 +1,7 @@
+const n = {
+  status: "warning"
+};
+export {
+  n as BannerDefaults
+};
+//# sourceMappingURL=BannerTypes.js.map

package/dist/components/Common/UI/Banner/BannerTypes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BannerTypes.js","sources":["../../../../../src/components/Common/UI/Banner/BannerTypes.ts"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react'\n\nexport interface BannerProps\n  extends Pick<HTMLAttributes<HTMLDivElement>, 'className' | 'id' | 'aria-label'> {\n  /**\n   * Title content displayed in the colored header section\n   */\n  title: ReactNode\n  /**\n   * Content to be displayed in the main content area\n   */\n  children: ReactNode\n  /**\n   * Visual status variant of the banner\n   */\n  status?: 'warning' | 'error'\n}\n\n/**\n * Default prop values for Banner component.\n */\nexport const BannerDefaults = {\n  status: 'warning',\n} as const satisfies Partial<BannerProps>\n"],"names":["BannerDefaults"],"mappings":"AAqBO,MAAMA,IAAiB;AAAA,EAC5B,QAAQ;AACV;"}

package/dist/components/Common/UI/Banner/index.d.ts

@@ -0,0 +1,4 @@
+import "./types/i18next.d.ts"
+export { Banner } from './Banner';
+export type { BannerProps } from './BannerTypes';
+export { BannerDefaults } from './BannerTypes';

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 k } from "./BreadcrumbsTypes.js";
 import r from "./Breadcrumbs.module.scss.js";
 import { applyMissingDefaults as x } from "../../../../helpers/applyMissingDefaults.js";
-import { Flex as u } from "../../Flex/Flex.js";
 function I(p) {
   const f = x(p, k), {
     className: s,

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

@@ -1,9 +1,9 @@
-const t = "_list_1ui59_1", s = "_item_1ui59_13", i = {
+const t = "_list_1tff9_1", s = "_item_1tff9_17", e = {
   list: t,
   item: s
 };
 export {
-  i as default,
+  e as default,
   s as item,
   t as list
 };

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 n from "./ProgressBar.module.scss.js";
-import { Flex as p } from "../../Flex/Flex.js";
+import { Flex as n } from "../../Flex/Flex.js";
+import p from "./ProgressBar.module.scss.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(p, { flexDirection: "column", children: [
+  return /* @__PURE__ */ t(n, { flexDirection: "column", children: [
     o && /* @__PURE__ */ r(o, {}),
-    /* @__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 }) }) })
+    /* @__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 }) }) })
   ] });
 }
 export {

package/dist/components/Company/DocumentSigner/DocumentList/ManageSignatories.js

@@ -1,23 +1,23 @@
 import { jsx as e, jsxs as l } from "react/jsx-runtime";
 import { useTranslation as m } from "react-i18next";
-import { useDocumentList as g } from "./useDocumentList.js";
-import c from "./ManageSignatories.module.scss.js";
-import { useComponentContext as S } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-import { firstLastName as f } from "../../../../helpers/formattedStrings.js";
+import { useDocumentList as c } from "./useDocumentList.js";
+import g from "./ManageSignatories.module.scss.js";
+import { useComponentContext as f } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { firstLastName as y } from "../../../../helpers/formattedStrings.js";
 import { SIGNATORY_TITLES as a } from "../../../../shared/constants.js";
-function y(t) {
+function S(t) {
   return !!t && t in a;
 }
-function b() {
-  const { t } = m("Company.DocumentList"), { isSelfSignatory: r, signatory: n, handleChangeSignatory: s } = g(), i = S();
-  let o = t("noSignatorySubtext");
-  return r ? o = t("selfSignatorySubtext") : n && (o = t("otherSignatorySubtext", {
-    signatory: f({
+function D() {
+  const { t } = m("Company.DocumentList"), { isSelfSignatory: r, signatory: n, handleChangeSignatory: s } = c(), i = f();
+  let o = t("noSignatoryDescription");
+  return r ? o = t("selfSignatoryDescription") : n && (o = t("otherSignatoryDescription", {
+    signatory: y({
       first_name: n.firstName,
       last_name: n.lastName
     }),
-    title: y(n.title) ? t(`signatoryTitles.${a[n.title]}`, { ns: "common" }) : n.title
-  })), /* @__PURE__ */ e("section", { className: c.container, children: /* @__PURE__ */ l(
+    title: S(n.title) ? t(`signatoryTitles.${a[n.title]}`, { ns: "common" }) : n.title
+  })), /* @__PURE__ */ e("section", { className: g.container, children: /* @__PURE__ */ l(
     i.Alert,
     {
       status: "warning",
@@ -30,6 +30,6 @@ function b() {
   ) });
 }
 export {
-  b as ManageSignatories
+  D as ManageSignatories
 };
 //# sourceMappingURL=ManageSignatories.js.map

package/dist/components/Company/DocumentSigner/DocumentList/ManageSignatories.js.map

@@ -1 +1 @@
-{"version":3,"file":"ManageSignatories.js","sources":["../../../../../src/components/Company/DocumentSigner/DocumentList/ManageSignatories.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { useDocumentList } from './useDocumentList'\nimport styles from './ManageSignatories.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { firstLastName } from '@/helpers/formattedStrings'\nimport { SIGNATORY_TITLES } from '@/shared/constants'\n\nfunction isValidSignatoryTitle(\n  title: string | null | undefined,\n): title is keyof typeof SIGNATORY_TITLES {\n  return !!title && title in SIGNATORY_TITLES\n}\n\nexport function ManageSignatories() {\n  const { t } = useTranslation('Company.DocumentList')\n  const { isSelfSignatory, signatory, handleChangeSignatory } = useDocumentList()\n  const Components = useComponentContext()\n\n  let signatorySubtext = t('noSignatorySubtext')\n\n  if (isSelfSignatory) {\n    signatorySubtext = t('selfSignatorySubtext')\n  } else if (signatory) {\n    signatorySubtext = t('otherSignatorySubtext', {\n      signatory: firstLastName({\n        first_name: signatory.firstName,\n        last_name: signatory.lastName,\n      }),\n      title: isValidSignatoryTitle(signatory.title)\n        ? t(`signatoryTitles.${SIGNATORY_TITLES[signatory.title]}`, { ns: 'common' })\n        : signatory.title,\n    })\n  }\n\n  return (\n    <section className={styles.container}>\n      <Components.Alert\n        status=\"warning\"\n        label={isSelfSignatory ? t('selfSignatoryTitle') : t('otherSignatoryTitle')}\n      >\n        <Components.Text>{signatorySubtext}</Components.Text>\n        <Components.Button variant=\"secondary\" onClick={handleChangeSignatory}>\n          {signatory ? t('changeSignatoryCta') : t('assignSignatoryCta')}\n        </Components.Button>\n      </Components.Alert>\n    </section>\n  )\n}\n"],"names":["isValidSignatoryTitle","title","SIGNATORY_TITLES","ManageSignatories","useTranslation","isSelfSignatory","signatory","handleChangeSignatory","useDocumentList","Components","useComponentContext","signatorySubtext","firstLastName","jsx","styles","jsxs"],"mappings":";;;;;;;AAOA,SAASA,EACPC,GACwC;AACxC,SAAO,CAAC,CAACA,KAASA,KAASC;AAC7B;AAEO,SAASC,IAAoB;AAClC,QAAM,EAAE,EAAA,IAAMC,EAAe,sBAAsB,GAC7C,EAAE,iBAAAC,GAAiB,WAAAC,GAAW,uBAAAC,EAAA,IAA0BC,EAAA,GACxDC,IAAaC,EAAA;AAEnB,MAAIC,IAAmB,EAAE,oBAAoB;AAE7C,SAAIN,IACFM,IAAmB,EAAE,sBAAsB,IAClCL,MACTK,IAAmB,EAAE,yBAAyB;AAAA,IAC5C,WAAWC,EAAc;AAAA,MACvB,YAAYN,EAAU;AAAA,MACtB,WAAWA,EAAU;AAAA,IAAA,CACtB;AAAA,IACD,OAAON,EAAsBM,EAAU,KAAK,IACxC,EAAE,mBAAmBJ,EAAiBI,EAAU,KAAK,CAAC,IAAI,EAAE,IAAI,SAAA,CAAU,IAC1EA,EAAU;AAAA,EAAA,CACf,IAID,gBAAAO,EAAC,WAAA,EAAQ,WAAWC,EAAO,WACzB,UAAA,gBAAAC;AAAA,IAACN,EAAW;AAAA,IAAX;AAAA,MACC,QAAO;AAAA,MACP,OAAyB,EAAlBJ,IAAoB,uBAA0B,qBAAN;AAAA,MAE/C,UAAA;AAAA,QAAA,gBAAAQ,EAACJ,EAAW,MAAX,EAAiB,UAAAE,EAAA,CAAiB;AAAA,QACnC,gBAAAE,EAACJ,EAAW,QAAX,EAAkB,SAAQ,aAAY,SAASF,GAC7C,UAAY,EAAZD,IAAc,uBAA0B,oBAAN,EAA0B,CAC/D;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;"}
+{"version":3,"file":"ManageSignatories.js","sources":["../../../../../src/components/Company/DocumentSigner/DocumentList/ManageSignatories.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { useDocumentList } from './useDocumentList'\nimport styles from './ManageSignatories.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { firstLastName } from '@/helpers/formattedStrings'\nimport { SIGNATORY_TITLES } from '@/shared/constants'\n\nfunction isValidSignatoryTitle(\n  title: string | null | undefined,\n): title is keyof typeof SIGNATORY_TITLES {\n  return !!title && title in SIGNATORY_TITLES\n}\n\nexport function ManageSignatories() {\n  const { t } = useTranslation('Company.DocumentList')\n  const { isSelfSignatory, signatory, handleChangeSignatory } = useDocumentList()\n  const Components = useComponentContext()\n\n  let signatorySubtext = t('noSignatoryDescription')\n\n  if (isSelfSignatory) {\n    signatorySubtext = t('selfSignatoryDescription')\n  } else if (signatory) {\n    signatorySubtext = t('otherSignatoryDescription', {\n      signatory: firstLastName({\n        first_name: signatory.firstName,\n        last_name: signatory.lastName,\n      }),\n      title: isValidSignatoryTitle(signatory.title)\n        ? t(`signatoryTitles.${SIGNATORY_TITLES[signatory.title]}`, { ns: 'common' })\n        : signatory.title,\n    })\n  }\n\n  return (\n    <section className={styles.container}>\n      <Components.Alert\n        status=\"warning\"\n        label={isSelfSignatory ? t('selfSignatoryTitle') : t('otherSignatoryTitle')}\n      >\n        <Components.Text>{signatorySubtext}</Components.Text>\n        <Components.Button variant=\"secondary\" onClick={handleChangeSignatory}>\n          {signatory ? t('changeSignatoryCta') : t('assignSignatoryCta')}\n        </Components.Button>\n      </Components.Alert>\n    </section>\n  )\n}\n"],"names":["isValidSignatoryTitle","title","SIGNATORY_TITLES","ManageSignatories","useTranslation","isSelfSignatory","signatory","handleChangeSignatory","useDocumentList","Components","useComponentContext","signatorySubtext","firstLastName","jsx","styles","jsxs"],"mappings":";;;;;;;AAOA,SAASA,EACPC,GACwC;AACxC,SAAO,CAAC,CAACA,KAASA,KAASC;AAC7B;AAEO,SAASC,IAAoB;AAClC,QAAM,EAAE,EAAA,IAAMC,EAAe,sBAAsB,GAC7C,EAAE,iBAAAC,GAAiB,WAAAC,GAAW,uBAAAC,EAAA,IAA0BC,EAAA,GACxDC,IAAaC,EAAA;AAEnB,MAAIC,IAAmB,EAAE,wBAAwB;AAEjD,SAAIN,IACFM,IAAmB,EAAE,0BAA0B,IACtCL,MACTK,IAAmB,EAAE,6BAA6B;AAAA,IAChD,WAAWC,EAAc;AAAA,MACvB,YAAYN,EAAU;AAAA,MACtB,WAAWA,EAAU;AAAA,IAAA,CACtB;AAAA,IACD,OAAON,EAAsBM,EAAU,KAAK,IACxC,EAAE,mBAAmBJ,EAAiBI,EAAU,KAAK,CAAC,IAAI,EAAE,IAAI,SAAA,CAAU,IAC1EA,EAAU;AAAA,EAAA,CACf,IAID,gBAAAO,EAAC,WAAA,EAAQ,WAAWC,EAAO,WACzB,UAAA,gBAAAC;AAAA,IAACN,EAAW;AAAA,IAAX;AAAA,MACC,QAAO;AAAA,MACP,OAAyB,EAAlBJ,IAAoB,uBAA0B,qBAAN;AAAA,MAE/C,UAAA;AAAA,QAAA,gBAAAQ,EAACJ,EAAW,MAAX,EAAiB,UAAAE,EAAA,CAAiB;AAAA,QACnC,gBAAAE,EAACJ,EAAW,QAAX,EAAkB,SAAQ,aAAY,SAASF,GAC7C,UAAY,EAAZD,IAAc,uBAA0B,oBAAN,EAA0B,CAC/D;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;"}

package/dist/components/Company/FederalTaxes/Form.js

@@ -1,38 +1,38 @@
-import { jsxs as d, jsx as r } from "react/jsx-runtime";
+import { jsxs as c, jsx as r } from "react/jsx-runtime";
 import { useMemo as n } from "react";
-import { useTranslation as c, Trans as t } from "react-i18next";
-import { TaxPayerType as _, FilingForm as y } from "@gusto/embedded-api/models/operations/putv1companiescompanyidfederaltaxdetails";
-import { useFederalTaxes as u } from "./useFederalTaxes.js";
-import { Flex as b } from "../../Common/Flex/Flex.js";
-import { usePlaceholderEin as g, normalizeEin as x } from "../../../helpers/federalEin.js";
-import { useComponentContext as F } from "../../../contexts/ComponentAdapter/useComponentContext.js";
-import { TextInputField as l } from "../../Common/Fields/TextInputField/TextInputField.js";
-import { SelectField as a } from "../../Common/Fields/SelectField/SelectField.js";
-function O() {
-  const { t: e } = c("Company.FederalTaxes"), { federalTaxDetails: s } = u(), i = F(), m = g(s?.hasEin), p = n(
-    () => Object.values(_).map((o) => ({
+import { useTranslation as d, Trans as t } from "react-i18next";
+import { TaxPayerType as y, FilingForm as u } from "@gusto/embedded-api/models/operations/putv1companiescompanyidfederaltaxdetails";
+import { useFederalTaxes as b } from "./useFederalTaxes.js";
+import { Flex as g } from "../../Common/Flex/Flex.js";
+import { usePlaceholderEin as x, normalizeEin as F } from "../../../helpers/federalEin.js";
+import { useComponentContext as T } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { TextInputField as a } from "../../Common/Fields/TextInputField/TextInputField.js";
+import { SelectField as l } from "../../Common/Fields/SelectField/SelectField.js";
+function N() {
+  const { t: e } = d("Company.FederalTaxes"), { federalTaxDetails: s } = b(), i = T(), m = x(s?.hasEin), p = n(
+    () => Object.values(y).map((o) => ({
       value: o,
       label: e(`taxPayerType.${o}`)
     })),
     [e]
   ), f = n(
-    () => Object.values(y).map((o) => ({
+    () => Object.values(u).map((o) => ({
       value: o,
       label: e(`filingForm.${o}`)
     })),
     [e]
   );
-  return /* @__PURE__ */ d(b, { flexDirection: "column", gap: 28, children: [
+  return /* @__PURE__ */ c(g, { flexDirection: "column", gap: 28, children: [
     /* @__PURE__ */ r(
-      l,
+      a,
       {
         name: "federalEin",
-        label: e("federal_ein_label"),
+        label: e("federalEinLabel"),
         description: /* @__PURE__ */ r(
           t,
           {
             t: e,
-            i18nKey: "federal_ein_description",
+            i18nKey: "federalEinDescription",
             components: {
               applyLink: /* @__PURE__ */ r(
                 i.Link,
@@ -46,30 +46,30 @@ function O() {
           }
         ),
         isRequired: !0,
-        transform: x,
+        transform: F,
         placeholder: m
       }
     ),
     /* @__PURE__ */ r(
-      a,
+      l,
       {
         name: "taxPayerType",
-        label: e("taxpayer_type_label"),
-        description: e("taxpayer_type_description"),
+        label: e("taxpayerTypeLabel"),
+        description: e("taxpayerTypeDescription"),
         options: p,
         isRequired: !0
       }
     ),
     /* @__PURE__ */ r(
-      a,
+      l,
       {
         name: "filingForm",
-        label: e("federal_filing_form_label"),
+        label: e("federalFilingFormLabel"),
         description: /* @__PURE__ */ r(
           t,
           {
             t: e,
-            i18nKey: "federal_filing_form_description",
+            i18nKey: "federalFilingFormDescription",
             components: {
               irsLink: /* @__PURE__ */ r(
                 i.Link,
@@ -87,18 +87,18 @@ function O() {
       }
     ),
     /* @__PURE__ */ r(
-      l,
+      a,
       {
         name: "legalName",
-        label: e("legal_entity_name_label"),
-        description: e("legal_entity_name_description"),
+        label: e("legalEntityNameLabel"),
+        description: e("legalEntityNameDescription"),
         isRequired: !0,
-        errorMessage: e("legal_entity_name_error")
+        errorMessage: e("legalEntityNameError")
       }
     )
   ] });
 }
 export {
-  O as Form
+  N as Form
 };
 //# sourceMappingURL=Form.js.map