@layerfi/components 0.1.89-alpha → 0.1.91-alpha

package/dist/cjs/index.cjs

@@ -55,10 +55,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var __publicField = (obj, key, value) => {
-  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 var __async = (__this, __arguments, generator) => {
   return new Promise((resolve, reject) => {
     var fulfilled = (value) => {
@@ -81,8 +78,8 @@ var __async = (__this, __arguments, generator) => {
 };
 
 // src/index.tsx
-var src_exports = {};
-__export(src_exports, {
+var index_exports = {};
+__export(index_exports, {
   AccountingOverview: () => AccountingOverview,
   BalanceSheet: () => BalanceSheet,
   BankTransactions: () => BankTransactions,
@@ -99,6 +96,7 @@ __export(src_exports, {
   LinkAccounts: () => LinkAccounts,
   LinkedAccounts: () => LinkedAccounts,
   Onboarding: () => Onboarding,
+  PlatformOnboarding: () => PlatformOnboarding,
   ProfitAndLoss: () => ProfitAndLoss,
   ProfitAndLossView: () => ProfitAndLossView,
   ProjectProfitabilityView: () => ProjectProfitabilityView,
@@ -110,7 +108,7 @@ __export(src_exports, {
   useDataSync: () => useDataSync,
   useLayerContext: () => useLayerContext
 });
-module.exports = __toCommonJS(src_exports);
+module.exports = __toCommonJS(index_exports);
 
 // src/providers/LayerProvider/LayerProvider.tsx
 var import_react16 = require("react");
@@ -119,7 +117,7 @@ var import_react16 = require("react");
 var import_react14 = require("react");
 
 // package.json
-var version = "0.1.89-alpha";
+var version = "0.1.91-alpha";
 
 // src/models/APIError.ts
 var APIError = class _APIError extends Error {
@@ -363,6 +361,9 @@ var createBillPayment = post(
 
 // src/api/layer/business.ts
 var getBusiness = get(({ businessId }) => `/v1/businesses/${businessId}`);
+var updateBusiness = put(
+  ({ businessId }) => `/v1/businesses/${businessId}`
+);
 
 // src/api/layer/categories.ts
 var getCategories = get(({ businessId, mode }) => {
@@ -501,7 +502,10 @@ var getCashflowStatementCSV = get(
 
 // src/api/layer/tasks.ts
 var getTasks = get(
-  ({ businessId, startDate, endDate }) => `/v1/businesses/${businessId}/tasks?${startDate ? `&start_date=${encodeURIComponent(startDate)}` : ""}${endDate ? `&end_date=${encodeURIComponent(endDate)}` : ""}`
+  ({ businessId, startDate, endDate }) => {
+    const parameters = toDefinedSearchParameters({ startDate, endDate });
+    return `/v1/businesses/${businessId}/tasks?${parameters}`;
+  }
 );
 var submitResponseToTask = post(
   ({ businessId, taskId }) => `/v1/businesses/${businessId}/tasks/${taskId}/user-response`
@@ -761,14 +765,14 @@ function ToastsContainer() {
 // src/components/GlobalWidgets/GlobalWidgets.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
 var DrawerWidget = () => {
-  const { content, close } = (0, import_react5.useContext)(DrawerContext);
+  const { content, close: close2 } = (0, import_react5.useContext)(DrawerContext);
   const { isMobile, isTablet } = useSizeClass();
   (0, import_react5.useEffect)(() => {
     if (!isMobile && !isTablet && content) {
-      close();
+      close2();
     }
   }, [isMobile]);
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Drawer, { isOpen: Boolean(content), onClose: close, children: content });
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Drawer, { isOpen: Boolean(content), onClose: close2, children: content });
 };
 var GlobalWidgets = () => {
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
@@ -873,7 +877,7 @@ var import_react7 = require("react");
 var useDrawer = () => {
   const [content, setContent] = (0, import_react7.useState)(void 0);
   const [isClosing, setIsClosing] = (0, import_react7.useState)(false);
-  const close = () => {
+  const close2 = () => {
     setIsClosing(true);
   };
   const finishClosing = () => {
@@ -885,7 +889,7 @@ var useDrawer = () => {
     setContent,
     finishClosing,
     isClosing,
-    close
+    close: close2
   };
 };
 
@@ -907,6 +911,15 @@ function hasSuggestions(categorization) {
   return categorization != null && categorization.suggestions !== void 0 && categorization.suggestions.length > 0;
 }
 
+// src/types/business.ts
+var ENTITY_TYPES = [
+  { value: "SOLE_PROP", label: "Sole Proprietorship" },
+  { value: "C_CORP", label: "C Corporation" },
+  { value: "LLC", label: "Limited Liability Company" },
+  { value: "S_CORP", label: "S Corporation" },
+  { value: "PARTNERSHIP", label: "Partnership" }
+];
+
 // src/config/theme.ts
 var SHADES = {
   50: { s: 1, l: 98 },
@@ -1105,16 +1118,11 @@ var buildColorShade = (shade, darkColorHsl) => {
   return { hsl, rgb, hex };
 };
 var hueToRgb = (p, q, t) => {
-  if (t < 0)
-    t += 1;
-  if (t > 1)
-    t -= 1;
-  if (t < 1 / 6)
-    return p + (q - p) * 6 * t;
-  if (t < 1 / 2)
-    return q;
-  if (t < 2 / 3)
-    return p + (q - p) * (2 / 3 - t) * 6;
+  if (t < 0) t += 1;
+  if (t > 1) t -= 1;
+  if (t < 1 / 6) return p + (q - p) * 6 * t;
+  if (t < 1 / 2) return q;
+  if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
   return p;
 };
 var hslToRgb = (hsl) => {
@@ -2459,7 +2467,7 @@ var BusinessProvider = ({
         setOnboardingStep,
         addToast,
         removeToast,
-        onError: errorHandler.onError,
+        onError: (payload) => errorHandler.onError(payload),
         touch,
         read,
         syncTimestamps,
@@ -3363,8 +3371,7 @@ var TooltipContent = (0, import_react22.forwardRef)(function TooltipContent2(_a,
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
   const context = useTooltipContext();
   const ref = (0, import_react23.useMergeRefs)([context.refs.setFloating, propRef]);
-  if (!context.open || context.disabled)
-    return null;
+  if (!context.open || context.disabled) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react23.FloatingPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     "div",
     __spreadProps(__spreadValues({
@@ -3512,8 +3519,7 @@ var IconButton = (_a) => {
         download,
         className: baseClassName,
         onClick: (e) => {
-          if (props.disabled)
-            e.preventDefault();
+          if (props.disabled) e.preventDefault();
         },
         children: icon
       }
@@ -3773,7 +3779,8 @@ var SubmitButton = (_a) => {
     children,
     action = "save" /* SAVE */,
     noIcon,
-    variant = "primary" /* primary */
+    variant = "primary" /* primary */,
+    withRetry
   } = _b, props = __objRest(_b, [
     "active",
     "className",
@@ -3783,12 +3790,24 @@ var SubmitButton = (_a) => {
     "children",
     "action",
     "noIcon",
-    "variant"
+    "variant",
+    "withRetry"
   ]);
   const baseClassName = (0, import_classnames7.default)(
     active ? "Layer__btn--active" : "",
     className
   );
+  if (withRetry && error) {
+    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+      RetryButton,
+      __spreadProps(__spreadValues({}, props), {
+        className: baseClassName,
+        disabled: processing || disabled,
+        error: typeof error === "string" ? error : "Something went wrong",
+        children
+      })
+    );
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
     Button,
     __spreadProps(__spreadValues({}, props), {
@@ -4242,7 +4261,8 @@ var Text = (_a) => {
     weight = "normal" /* normal */,
     withTooltip,
     ellipsis,
-    status
+    status,
+    pb
   } = _b, props = __objRest(_b, [
     "as",
     "className",
@@ -4251,9 +4271,10 @@ var Text = (_a) => {
     "weight",
     "withTooltip",
     "ellipsis",
-    "status"
+    "status",
+    "pb"
   ]);
-  const dataProperties = toDataProperties({ status, ellipsis });
+  const dataProperties = toDataProperties({ status, ellipsis, pb });
   const baseClassName = (0, import_classnames15.default)(
     `Layer__text Layer__text--${size} Layer__text--${weight}`,
     className
@@ -4335,10 +4356,12 @@ var Heading = ({
   as: Component2 = "h2",
   className,
   children,
-  size = "primary" /* primary */
+  size = "primary" /* primary */,
+  align = "center"
 }) => {
   const baseClassName = (0, import_classnames16.default)(
     `Layer__heading Layer__heading--${size}`,
+    `Layer__heading--${align}`,
     className
   );
   return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Component2, { className: baseClassName, children });
@@ -5463,7 +5486,7 @@ var LinkedAccountItemThumb = ({
 };
 
 // src/components/LinkedAccounts/LinkedAccountsContent.tsx
-var import_classnames24 = __toESM(require("classnames"));
+var import_classnames25 = __toESM(require("classnames"));
 
 // src/components/LinkedAccounts/ConfirmationModal/LinkedAccountsConfirmationModal.tsx
 var import_react38 = require("react");
@@ -5642,12 +5665,13 @@ function ModalActions({ children }) {
 }
 
 // src/components/ui/Stack/Stack.tsx
+var import_classnames23 = __toESM(require("classnames"));
 var import_jsx_runtime69 = require("react/jsx-runtime");
 var CLASS_NAME2 = "Layer__Stack";
 function Stack(_a) {
-  var _b = _a, { align, children, direction, gap, justify, pbs, pbe } = _b, restProps = __objRest(_b, ["align", "children", "direction", "gap", "justify", "pbs", "pbe"]);
+  var _b = _a, { align, children, direction, gap, justify, pbs, pbe, className } = _b, restProps = __objRest(_b, ["align", "children", "direction", "gap", "justify", "pbs", "pbe", "className"]);
   const dataProperties = toDataProperties({ align, direction, gap, justify, pbs, pbe });
-  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", __spreadProps(__spreadValues(__spreadValues({}, restProps), dataProperties), { className: CLASS_NAME2, children }));
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", __spreadProps(__spreadValues(__spreadValues({}, restProps), dataProperties), { className: (0, import_classnames23.default)(CLASS_NAME2, className), children }));
 }
 function VStack(props) {
   return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Stack, __spreadProps(__spreadValues({}, props), { direction: "column" }));
@@ -5695,7 +5719,7 @@ function withRenderProp(renderProp, callback) {
 }
 
 // src/components/ui/Checkbox/Checkbox.tsx
-var import_classnames23 = __toESM(require("classnames"));
+var import_classnames24 = __toESM(require("classnames"));
 var import_jsx_runtime71 = require("react/jsx-runtime");
 var CLASS_NAME3 = "Layer__Checkbox";
 function Checkbox(_a) {
@@ -5708,7 +5732,7 @@ function Checkbox(_a) {
   return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
     import_react_aria_components4.Checkbox,
     __spreadProps(__spreadValues(__spreadValues({}, dataProperties), props), {
-      className: (0, import_classnames23.default)(CLASS_NAME3, className),
+      className: (0, import_classnames24.default)(CLASS_NAME3, className),
       children: withRenderProp(children, (node) => /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
         /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { slot: "checkbox", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_lucide_react2.Check, { size: size === "lg" ? 16 : 12 }) }),
         node
@@ -5726,7 +5750,7 @@ function BasicLinkedAccountContainer({ children, isSelected }) {
 }
 function BasicLinkedAccountLogo({ account }) {
   var _a, _b, _c;
-  return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(VStack, { justify: "center", children: ((_a = account.institution) == null ? void 0 : _a.logo) ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(VStack, { justify: "center", className: "Layer__BasicLinkedAccountLogo", children: ((_a = account.institution) == null ? void 0 : _a.logo) ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
     "img",
     {
       width: 28,
@@ -5734,17 +5758,17 @@ function BasicLinkedAccountLogo({ account }) {
       src: `data:image/png;base64,${account.institution.logo}`,
       alt: ((_b = account.institution) == null ? void 0 : _b.name) ? (_c = account.institution) == null ? void 0 : _c.name : account.external_account_name
     }
-  ) : /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(InstitutionIcon_default, { size: 28 }) });
+  ) : /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(InstitutionIcon_default, {}) });
 }
 function BasicLinkedAccountContent({ account }) {
   var _a;
   return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(HStack, { gap: "md", children: [
     /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(BasicLinkedAccountLogo, { account }),
     /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(VStack, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Heading2, { level: 3, size: "sm", pbe: "2xs", children: account.external_account_name }),
+      /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Heading2, { level: 3, size: "xs", pbe: "3xs", children: account.external_account_name }),
       /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(HStack, { gap: "xs", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(P, { children: (_a = account.institution) == null ? void 0 : _a.name }),
-        /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(P, { variant: "subtle", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(P, { size: "sm", children: (_a = account.institution) == null ? void 0 : _a.name }),
+        /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(P, { variant: "subtle", size: "sm", children: [
           "\u2022\u2022\u2022",
           " ",
           account.mask
@@ -5916,13 +5940,8 @@ function useLinkedAccountsConfirmationModal() {
   }, baseInfo);
 }
 function LinkedAccountsConfirmationModalPreloadedContent({ onClose }) {
-  const { onDismiss } = useLinkedAccountsConfirmationModal();
-  const handleDismiss = () => {
-    onDismiss();
-    onClose();
-  };
   return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ModalContextBar, { onClose: handleDismiss }),
+    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ModalContextBar, { onClose }),
     /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ModalHeading, { pbe: "md", children: "Loading Your Accounts..." }),
     /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ModalContent, { children: /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(VStack, { slot: "center", align: "center", gap: "md", children: [
       /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(LoadingSpinner, { size: 48 }),
@@ -5931,16 +5950,12 @@ function LinkedAccountsConfirmationModalPreloadedContent({ onClose }) {
   ] });
 }
 function LinkedAccountsConfirmationModalContent({ onClose }) {
-  const { accounts, onDismiss, onFinish, refetchAccounts } = useLinkedAccountsConfirmationModal();
+  const { accounts, onFinish, refetchAccounts } = useLinkedAccountsConfirmationModal();
   const [formState, setFormState] = (0, import_react38.useState)(() => Object.fromEntries(
     accounts.map(({ id }) => [id, true])
   ));
   const { trigger, isMutating, error } = useConfirmAndExcludeMultiple({ onSuccess: refetchAccounts });
   const hasError = Boolean(error);
-  const handleDismiss = () => {
-    onDismiss();
-    onClose();
-  };
   const handleFinish = () => __async(this, null, function* () {
     const success = yield trigger(formState);
     if (success) {
@@ -5948,9 +5963,12 @@ function LinkedAccountsConfirmationModalContent({ onClose }) {
       onClose();
     }
   });
+  const handleDismiss = () => {
+    onClose();
+  };
   const { descriptionLabel, buttonLabel } = getFormComponentLabels(formState);
   return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ModalContextBar, { onClose: handleDismiss }),
+    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ModalContextBar, { onClose }),
     /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ModalHeading, { pbe: "2xs", children: "Confirm Business Accounts" }),
     /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ModalDescription, { pbe: "md", children: descriptionLabel }),
     /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ModalContent, { children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
@@ -5978,13 +5996,26 @@ function LinkedAccountsConfirmationModalContent({ onClose }) {
     /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ModalActions, { children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(VStack, { gap: "md", children: hasError ? /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(P, { size: "sm", children: "An error occurred while confirming accounts. You will have an opportunity to try again later." }),
       /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(P, { size: "sm", children: "No data will be synced until you confirm." }),
-      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Button2, { size: "lg", onPress: handleDismiss, children: "Close" })
-    ] }) : /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Button2, { size: "lg", onPress: handleFinish, isPending: isMutating, children: buttonLabel }) }) })
+      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Button2, { size: "lg", onPress: close, children: "Close" })
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Button2, { size: "lg", onPress: () => {
+      void handleFinish();
+    }, isPending: isMutating, children: buttonLabel }) }) })
   ] });
 }
 function LinkedAccountsConfirmationModal() {
-  const { preloadIsOpen, mainIsOpen } = useLinkedAccountsConfirmationModal();
-  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Modal, { isOpen: preloadIsOpen || mainIsOpen, children: ({ close }) => preloadIsOpen ? /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(LinkedAccountsConfirmationModalPreloadedContent, { onClose: close }) : /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(LinkedAccountsConfirmationModalContent, { onClose: close }) });
+  const { preloadIsOpen, mainIsOpen, onDismiss } = useLinkedAccountsConfirmationModal();
+  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+    Modal,
+    {
+      isOpen: preloadIsOpen || mainIsOpen,
+      onOpenChange: (isOpen) => {
+        if (!isOpen) {
+          onDismiss();
+        }
+      },
+      children: ({ close: close2 }) => preloadIsOpen ? /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(LinkedAccountsConfirmationModalPreloadedContent, { onClose: close2 }) : /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(LinkedAccountsConfirmationModalContent, { onClose: close2 })
+    }
+  );
 }
 
 // src/components/LinkedAccounts/LinkedAccountsContent.tsx
@@ -5996,7 +6027,7 @@ var LinkedAccountsContent = ({
   showBreakConnection
 }) => {
   const { data, addConnection } = (0, import_react39.useContext)(LinkedAccountsContext);
-  const linkedAccountsNewAccountClassName = (0, import_classnames24.default)(
+  const linkedAccountsNewAccountClassName = (0, import_classnames25.default)(
     "Layer__linked-accounts__new-account",
     asWidget && "--as-widget",
     showLedgerBalance && "--show-ledger-balance",
@@ -6072,7 +6103,7 @@ var isDateAllowedToBrowse = (date, business) => {
 var import_react44 = require("react");
 
 // src/components/Input/Input.tsx
-var import_classnames25 = __toESM(require("classnames"));
+var import_classnames26 = __toESM(require("classnames"));
 var import_jsx_runtime77 = require("react/jsx-runtime");
 var Input = (_a) => {
   var _b = _a, {
@@ -6086,7 +6117,7 @@ var Input = (_a) => {
     "errorMessage",
     "leftText"
   ]);
-  const baseClassName = (0, import_classnames25.default)(
+  const baseClassName = (0, import_classnames26.default)(
     "Layer__input",
     isInvalid ? "Layer__input--error" : "",
     leftText ? "Layer__input--with-left-text" : "",
@@ -6102,7 +6133,7 @@ var Input = (_a) => {
 };
 
 // src/components/Input/InputGroup.tsx
-var import_classnames26 = __toESM(require("classnames"));
+var import_classnames27 = __toESM(require("classnames"));
 var import_jsx_runtime78 = require("react/jsx-runtime");
 var InputGroup = ({
   label,
@@ -6111,7 +6142,7 @@ var InputGroup = ({
   inline,
   children
 }) => {
-  const baseClassName = (0, import_classnames26.default)(
+  const baseClassName = (0, import_classnames27.default)(
     "Layer__input-group",
     className,
     inline && "Layer__input-group--inline"
@@ -6288,7 +6319,7 @@ var ChevronDownFill = (_a) => {
 var ChevronDownFill_default = ChevronDownFill;
 
 // src/components/Input/Select.tsx
-var import_classnames27 = __toESM(require("classnames"));
+var import_classnames28 = __toESM(require("classnames"));
 var import_jsx_runtime82 = require("react/jsx-runtime");
 var Select = ({
   name,
@@ -6302,7 +6333,7 @@ var Select = ({
   isInvalid,
   errorMessage
 }) => {
-  const baseClassName = (0, import_classnames27.default)(
+  const baseClassName = (0, import_classnames28.default)(
     "Layer__select",
     isInvalid ? "Layer__select--error" : "",
     className
@@ -6330,7 +6361,7 @@ var Select = ({
 };
 
 // src/components/Input/InputWithBadge.tsx
-var import_classnames28 = __toESM(require("classnames"));
+var import_classnames29 = __toESM(require("classnames"));
 var import_jsx_runtime83 = require("react/jsx-runtime");
 var InputWithBadge = (_a) => {
   var _b = _a, {
@@ -6348,7 +6379,7 @@ var InputWithBadge = (_a) => {
     "badge",
     "variant"
   ]);
-  const baseClassName = (0, import_classnames28.default)(
+  const baseClassName = (0, import_classnames29.default)(
     "Layer__input",
     isInvalid ? "Layer__input--error" : "",
     leftText ? "Layer__input--with-left-text" : "",
@@ -6369,7 +6400,7 @@ var InputWithBadge = (_a) => {
 // src/components/Input/MultiSelect.tsx
 var import_react42 = require("react");
 var import_react_select2 = __toESM(require("react-select"));
-var import_classnames29 = __toESM(require("classnames"));
+var import_classnames30 = __toESM(require("classnames"));
 var import_jsx_runtime84 = require("react/jsx-runtime");
 var MultiSelect = ({
   name,
@@ -6385,7 +6416,7 @@ var MultiSelect = ({
   errorMessage,
   styles
 }) => {
-  const baseClassName = (0, import_classnames29.default)(
+  const baseClassName = (0, import_classnames30.default)(
     "Layer__select",
     isInvalid ? "Layer__select--error" : "",
     className
@@ -6417,7 +6448,7 @@ var MultiSelect = ({
 };
 
 // src/components/Input/AmountInput.tsx
-var import_classnames30 = __toESM(require("classnames"));
+var import_classnames31 = __toESM(require("classnames"));
 var import_react_currency_input_field = __toESM(require("react-currency-input-field"));
 var import_jsx_runtime85 = require("react/jsx-runtime");
 var AmountInput = (_a) => {
@@ -6436,7 +6467,7 @@ var AmountInput = (_a) => {
     "isInvalid",
     "placeholder"
   ]);
-  const baseClassName = (0, import_classnames30.default)(
+  const baseClassName = (0, import_classnames31.default)(
     "Layer__input Layer__amount-input",
     isInvalid ? "Layer__input--error" : "",
     leftText ? "Layer__input--with-left-text" : "",
@@ -6554,7 +6585,7 @@ var DatePickerOptions = ({
 };
 
 // src/components/DatePicker/DatePicker.tsx
-var import_classnames31 = __toESM(require("classnames"));
+var import_classnames32 = __toESM(require("classnames"));
 var import_date_fns8 = require("date-fns");
 var import_jsx_runtime88 = require("react/jsx-runtime");
 var ReactDatePicker = RDP.default.default || RDP.default || RDP;
@@ -6562,6 +6593,35 @@ var isRangeMode = (displayMode) => displayMode === "dayRangePicker" || displayMo
 var showNavigationArrows = (navigateArrows, isDesktop) => {
   return navigateArrows && (isDesktop && navigateArrows.includes("desktop") || !isDesktop && navigateArrows.includes("mobile"));
 };
+var renderYearContent = (calendarYear, highlightYears) => {
+  if (!highlightYears || !highlightYears.includes(calendarYear)) {
+    return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { className: "Layer__datepicker__year-content", children: calendarYear });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("span", { className: "Layer__datepicker__year-content", children: [
+    calendarYear,
+    /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { className: "Layer__datepicker__date-dot" })
+  ] });
+};
+var highlightBackArrow = ({
+  currentDate,
+  modePicker,
+  highlightYears
+}) => {
+  if (modePicker === "yearPicker") {
+    return Boolean(highlightYears == null ? void 0 : highlightYears.find((year) => year < (0, import_date_fns8.getYear)(currentDate)));
+  }
+  return false;
+};
+var highlightNextArrow = ({
+  currentDate,
+  modePicker,
+  highlightYears
+}) => {
+  if (modePicker === "yearPicker") {
+    return Boolean(highlightYears == null ? void 0 : highlightYears.find((year) => year > (0, import_date_fns8.getYear)(currentDate)));
+  }
+  return false;
+};
 var DatePicker = (_a) => {
   var _b = _a, {
     selected,
@@ -6581,6 +6641,7 @@ var DatePicker = (_a) => {
     maxDate = /* @__PURE__ */ new Date(),
     currentDateOption = true,
     navigateArrows = displayMode === "monthPicker" ? ["mobile"] : void 0,
+    highlightYears,
     onChangeMode,
     slots
   } = _b, props = __objRest(_b, [
@@ -6601,6 +6662,7 @@ var DatePicker = (_a) => {
     "maxDate",
     "currentDateOption",
     "navigateArrows",
+    "highlightYears",
     "onChangeMode",
     "slots"
   ]);
@@ -6629,21 +6691,21 @@ var DatePicker = (_a) => {
     return [selected[0], null];
   }, [selected, displayMode]);
   const { isDesktop } = useSizeClass();
-  const wrapperClassNames = (0, import_classnames31.default)(
+  const wrapperClassNames = (0, import_classnames32.default)(
     "Layer__datepicker__wrapper",
     displayMode === "timePicker" && "Layer__datepicker__time__wrapper",
     showNavigationArrows(navigateArrows, isDesktop) && "Layer__datepicker__wrapper--arrows"
   );
-  const datePickerWrapperClassNames = (0, import_classnames31.default)(
+  const datePickerWrapperClassNames = (0, import_classnames32.default)(
     "Layer__datepicker",
     displayMode === "timePicker" && "Layer__datepicker__time",
     wrapperClassName
   );
-  const calendarClassNames = (0, import_classnames31.default)(
+  const calendarClassNames = (0, import_classnames32.default)(
     "Layer__datepicker__calendar",
     calendarClassName
   );
-  const popperClassNames = (0, import_classnames31.default)(
+  const popperClassNames = (0, import_classnames32.default)(
     "Layer__datepicker__popper",
     displayMode === "timePicker" && "Layer__datepicker__time__popper",
     popperClassName
@@ -6786,7 +6848,8 @@ var DatePicker = (_a) => {
         onFocus: (e) => {
           e.target.blur();
         },
-        disabled
+        disabled,
+        renderYearContent: (d) => renderYearContent(d, highlightYears)
       }, props), {
         children: [
           ModeSelector && pickerMode !== "timePicker" ? /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
@@ -6808,38 +6871,52 @@ var DatePicker = (_a) => {
       })
     ),
     showNavigationArrows(navigateArrows, isDesktop) && /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(import_jsx_runtime88.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(
         Button,
         {
           "aria-label": "Previous Date",
-          className: (0, import_classnames31.default)(
+          className: (0, import_classnames32.default)(
             "Layer__datepicker__prev-button",
             isBeforeMinDate && "Layer__datepicker__button--disabled"
           ),
           onClick: () => handleNavigateDate(-1),
           variant: "secondary" /* secondary */,
           disabled: isBeforeMinDate || disabled,
-          children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(ChevronLeft_default, { className: "Layer__datepicker__button-icon", size: 16 })
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(ChevronLeft_default, { className: "Layer__datepicker__button-icon", size: 16 }),
+            highlightBackArrow({
+              currentDate: firstDate,
+              modePicker: pickerMode,
+              highlightYears
+            }) && /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { className: "Layer__datepicker__nav-arrow-highlight" })
+          ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(
         Button,
         {
           "aria-label": "Next Date",
           variant: "secondary" /* secondary */,
-          className: (0, import_classnames31.default)(
+          className: (0, import_classnames32.default)(
             "Layer__datepicker__next-button",
             isTodayOrAfter ? "Layer__datepicker__button--disabled" : void 0
           ),
           onClick: () => handleNavigateDate(1),
           disabled: isTodayOrAfter || disabled,
-          children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
-            ChevronRight_default,
-            {
-              className: "Layer__datepicker__button-icon",
-              size: 16
-            }
-          )
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(
+              ChevronRight_default,
+              {
+                className: "Layer__datepicker__button-icon",
+                size: 16
+              }
+            ),
+            highlightNextArrow({
+              currentDate: firstDate,
+              modePicker: pickerMode,
+              highlightYears
+            }) && /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { className: "Layer__datepicker__nav-arrow-highlight" })
+          ]
         }
       )
     ] }),
@@ -7080,8 +7157,7 @@ var humanizeEnum = (text) => {
   return capitalizeFirstLetter(text.replace(/_/gi, " ").toLowerCase());
 };
 var convertNumberToCurrency = (amount) => {
-  if (typeof amount !== "number" || isNaN(amount))
-    return "";
+  if (typeof amount !== "number" || isNaN(amount)) return "";
   const formattedValue = amount.toLocaleString("en-US");
   return formattedValue.length > 0 ? `$${formattedValue}` : "";
 };
@@ -7220,11 +7296,11 @@ function OpeningBalanceModal({
           setAccountsToAddOpeningBalanceInModal([]);
         }
       },
-      children: ({ close }) => /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
+      children: ({ close: close2 }) => /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
         LinkedAccountsOpeningBalanceModalContent,
         {
           accounts: accountsToAddOpeningBalanceInModal,
-          onClose: close,
+          onClose: close2,
           stringOverrides
         }
       )
@@ -7733,7 +7809,7 @@ var import_react50 = require("react");
 var import_react49 = require("react");
 
 // src/components/ActionableList/ActionableList.tsx
-var import_classnames32 = __toESM(require("classnames"));
+var import_classnames33 = __toESM(require("classnames"));
 var import_jsx_runtime98 = require("react/jsx-runtime");
 var ActionableList = ({
   options,
@@ -7746,7 +7822,7 @@ var ActionableList = ({
     {
       role: "button",
       onClick: () => onClick(x),
-      className: (0, import_classnames32.default)(
+      className: (0, import_classnames33.default)(
         x.secondary && "Layer__actionable-list-item--secondary",
         x.asLink && "Layer__actionable-list-item--as-link",
         selectedId === x.id && "Layer__actionable-list__item--selected"
@@ -7888,7 +7964,7 @@ var BusinessCategories = ({
 };
 
 // src/components/CategorySelect/CategorySelectDrawer.tsx
-var import_classnames33 = __toESM(require("classnames"));
+var import_classnames34 = __toESM(require("classnames"));
 var import_jsx_runtime100 = require("react/jsx-runtime");
 var CategorySelectDrawer = ({
   onSelect,
@@ -7896,16 +7972,16 @@ var CategorySelectDrawer = ({
   showTooltips: _showTooltips
 }) => {
   var _a, _b;
-  const { setContent, close } = (0, import_react50.useContext)(DrawerContext);
+  const { setContent, close: close2 } = (0, import_react50.useContext)(DrawerContext);
   const onDrawerCategorySelect = (value) => {
-    close();
+    close2();
     onSelect(value);
   };
   return /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(
     "button",
     {
       "aria-label": "Select category",
-      className: (0, import_classnames33.default)(
+      className: (0, import_classnames34.default)(
         "Layer__category-menu__drawer-btn",
         selected && "Layer__category-menu__drawer-btn--selected"
       ),
@@ -7954,7 +8030,7 @@ var CategorySelectDrawerContent = ({
 };
 
 // src/components/CategorySelect/CategorySelect.tsx
-var import_classnames34 = __toESM(require("classnames"));
+var import_classnames35 = __toESM(require("classnames"));
 var import_date_fns12 = require("date-fns");
 var import_jsx_runtime101 = require("react/jsx-runtime");
 var mapCategoryToOption2 = (category) => {
@@ -8006,7 +8082,7 @@ var GroupHeading = (props) => {
   return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
     import_react_select3.components.GroupHeading,
     __spreadValues({
-      className: (0, import_classnames34.default)(
+      className: (0, import_classnames35.default)(
         props.className,
         props.children === "Match" || props.children === "All categories" ? "Layer__select__group-heading--main" : ""
       )
@@ -8337,8 +8413,7 @@ var useReceiptsContext = () => (0, import_react51.useContext)(ReceiptsContext);
 var import_react52 = require("react");
 var import_date_fns13 = require("date-fns");
 var readDate = (date) => {
-  if (!date)
-    return void 0;
+  if (!date) return void 0;
   return date && (0, import_date_fns13.format)((0, import_date_fns13.parseISO)(date), DATE_FORMAT);
 };
 var useReceipts = ({
@@ -8423,8 +8498,7 @@ var useReceipts = ({
     }
   });
   const archiveDocument = (document2) => __async(void 0, null, function* () {
-    if (!document2.id)
-      return;
+    if (!document2.id) return;
     try {
       if (document2.error) {
         setReceiptUrls(receiptUrls.filter((url) => url.id !== document2.id));
@@ -8519,7 +8593,7 @@ var Eye = (_a) => {
 var Eye_default = Eye;
 
 // src/components/FileThumb/FileThumb.tsx
-var import_classnames35 = __toESM(require("classnames"));
+var import_classnames36 = __toESM(require("classnames"));
 var import_jsx_runtime106 = require("react/jsx-runtime");
 var FileThumb = ({
   url,
@@ -8538,7 +8612,7 @@ var FileThumb = ({
   return /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
     "div",
     {
-      className: (0, import_classnames35.default)(
+      className: (0, import_classnames36.default)(
         "Layer__file-thumb",
         floatingActions && "Layer__file-thumb--floating"
       ),
@@ -8571,7 +8645,7 @@ var FileThumb = ({
         enableOpen || enableDownload || onDelete ? /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
           "div",
           {
-            className: (0, import_classnames35.default)(
+            className: (0, import_classnames36.default)(
               "Layer__file-thumb__actions",
               floatingActions && "Layer__file-thumb__actions--floating"
             ),
@@ -8729,7 +8803,7 @@ var MatchBadge = ({
 };
 
 // src/components/MatchForm/MatchForm.tsx
-var import_classnames36 = __toESM(require("classnames"));
+var import_classnames37 = __toESM(require("classnames"));
 var import_date_fns15 = require("date-fns");
 var import_jsx_runtime109 = require("react/jsx-runtime");
 var MatchForm = ({
@@ -8758,7 +8832,7 @@ var MatchForm = ({
       return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(
         "div",
         {
-          className: (0, import_classnames36.default)(
+          className: (0, import_classnames37.default)(
             `${classNamePrefix}__match-row`,
             match.id === selectedMatchId ? `${classNamePrefix}__match-row--selected` : ""
           ),
@@ -8835,7 +8909,7 @@ var MatchForm = ({
 };
 
 // src/components/MatchForm/MatchFormMobile.tsx
-var import_classnames37 = __toESM(require("classnames"));
+var import_classnames38 = __toESM(require("classnames"));
 var import_date_fns16 = require("date-fns");
 var import_jsx_runtime110 = require("react/jsx-runtime");
 var MatchFormMobile = ({
@@ -8851,7 +8925,7 @@ var MatchFormMobile = ({
       return /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
         "div",
         {
-          className: (0, import_classnames37.default)(
+          className: (0, import_classnames38.default)(
             `${classNamePrefix}__match-item`,
             match.id === selectedMatchId ? `${classNamePrefix}__match-item--selected` : ""
           ),
@@ -8912,7 +8986,7 @@ var MatchFormMobile = ({
 };
 
 // src/components/Textarea/Textarea.tsx
-var import_classnames38 = __toESM(require("classnames"));
+var import_classnames39 = __toESM(require("classnames"));
 var import_jsx_runtime111 = require("react/jsx-runtime");
 var Textarea = (_a) => {
   var _b = _a, {
@@ -8924,7 +8998,7 @@ var Textarea = (_a) => {
     "isInvalid",
     "errorMessage"
   ]);
-  const baseClassName = (0, import_classnames38.default)(
+  const baseClassName = (0, import_classnames39.default)(
     "Layer__textarea",
     isInvalid ? "Layer__textarea--error" : "",
     className
@@ -8937,7 +9011,7 @@ var Textarea = (_a) => {
 
 // src/components/Toggle/Toggle.tsx
 var import_react54 = require("react");
-var import_classnames39 = __toESM(require("classnames"));
+var import_classnames40 = __toESM(require("classnames"));
 var import_jsx_runtime112 = require("react/jsx-runtime");
 var import_react55 = require("react");
 var Toggle = ({
@@ -8958,7 +9032,7 @@ var Toggle = ({
       setCurrentWidth(c.width);
     }
   });
-  const baseClassName = (0, import_classnames39.default)(
+  const baseClassName = (0, import_classnames40.default)(
     "Layer__toggle",
     `Layer__toggle--${size}`,
     initialized ? "Layer__toggle--initialized" : ""
@@ -9043,7 +9117,7 @@ var ToggleOption = ({
   style,
   index
 }) => {
-  const optionClassName = (0, import_classnames39.default)("Layer__toggle-option", {
+  const optionClassName = (0, import_classnames40.default)("Layer__toggle-option", {
     "Layer__toggle-option--active": checked
   });
   if (disabled) {
@@ -9208,7 +9282,7 @@ var Notification = ({
 };
 
 // src/components/ExpandedBankTransactionRow/ExpandedBankTransactionRow.tsx
-var import_classnames40 = __toESM(require("classnames"));
+var import_classnames41 = __toESM(require("classnames"));
 
 // src/hooks/bookkeeping/useBookkeepingStatus.ts
 var import_swr5 = __toESM(require("swr"));
@@ -9231,7 +9305,12 @@ function LegacyModeProvider({
 }
 
 // src/hooks/bookkeeping/useBookkeepingStatus.ts
-var BOOKKEEPING_STATUSES = ["NOT_PURCHASED", "BOOKKEEPING_PAUSED", "ACTIVE"];
+var BOOKKEEPING_STATUSES = [
+  "NOT_PURCHASED",
+  "ACTIVE",
+  "ONBOARDING",
+  "BOOKKEEPING_PAUSED"
+];
 function constrainToKnownBookkeepingStatus(status) {
   if (BOOKKEEPING_STATUSES.includes(status)) {
     return status;
@@ -9251,7 +9330,7 @@ function buildKey4({
       accessToken,
       apiUrl,
       businessId,
-      tags: ["#bookkeeping, #status"]
+      tags: ["#bookkeeping", "#status"]
     };
   }
 }
@@ -9322,7 +9401,7 @@ var ExpandedBankTransactionRow = (0, import_react58.forwardRef)(
   ({
     bankTransaction,
     isOpen = false,
-    close,
+    close: close2,
     categorized,
     asListItem = false,
     submitBtnText = "Save",
@@ -9467,7 +9546,7 @@ var ExpandedBankTransactionRow = (0, import_react58.forwardRef)(
           yield onMatchSubmit(selectedMatchId);
           return;
         }
-        close();
+        close2();
         return;
       }
       if (!validateSplit(rowState)) {
@@ -9493,7 +9572,7 @@ var ExpandedBankTransactionRow = (0, import_react58.forwardRef)(
           }))
         }
       );
-      close();
+      close2();
     });
     const fetchMemos = () => __async(void 0, null, function* () {
       const getBankTransactionMetadata2 = Layer.getBankTransactionMetadata(
@@ -9507,8 +9586,7 @@ var ExpandedBankTransactionRow = (0, import_react58.forwardRef)(
         }
       );
       const result = yield getBankTransactionMetadata2();
-      if (result.data.memo)
-        setMemoText(result.data.memo);
+      if (result.data.memo) setMemoText(result.data.memo);
     });
     (0, import_react58.useImperativeHandle)(ref, () => ({
       save
@@ -9522,7 +9600,7 @@ var ExpandedBankTransactionRow = (0, import_react58.forwardRef)(
         return;
       }
       yield matchBankTransaction2(bankTransaction.id, foundMatch.id);
-      close();
+      close2();
     });
     const getDivHeight = (0, import_react58.useCallback)(() => {
       const { height: height2 } = bodyRef.current ? bodyRef.current.getBoundingClientRect() : { height: void 0 };
@@ -9558,8 +9636,7 @@ var ExpandedBankTransactionRow = (0, import_react58.forwardRef)(
     }, [getDivHeight, isOpen]);
     (0, import_react58.useEffect)(() => {
       const loadDocumentsAndMetadata = () => __async(void 0, null, function* () {
-        if (showDescriptions && isOpen)
-          yield fetchMemos();
+        if (showDescriptions && isOpen) yield fetchMemos();
         setIsLoaded(true);
         setOver(true);
       });
@@ -9607,7 +9684,7 @@ var ExpandedBankTransactionRow = (0, import_react58.forwardRef)(
                   /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
                     "div",
                     {
-                      className: (0, import_classnames40.default)(
+                      className: (0, import_classnames41.default)(
                         `${className}__match`,
                         `${className}__content-panel`,
                         purpose === "match" /* match */ ? `${className}__content-panel--active` : ""
@@ -9631,7 +9708,7 @@ var ExpandedBankTransactionRow = (0, import_react58.forwardRef)(
                   /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
                     "div",
                     {
-                      className: (0, import_classnames40.default)(
+                      className: (0, import_classnames41.default)(
                         `${className}__splits`,
                         `${className}__content-panel`,
                         purpose === "categorize" /* categorize */ ? `${className}__content-panel--active` : ""
@@ -9825,7 +9902,7 @@ var SplitTooltipDetails = ({
 };
 
 // src/components/BankTransactionRow/BankTransactionRow.tsx
-var import_classnames41 = __toESM(require("classnames"));
+var import_classnames42 = __toESM(require("classnames"));
 var import_date_fns17 = require("date-fns");
 var import_jsx_runtime118 = require("react/jsx-runtime");
 var extractDescriptionForSplit = (category) => {
@@ -9939,7 +10016,7 @@ var BankTransactionRow = ({
   const categorized = isCategorized(bankTransaction);
   const className = "Layer__bank-transaction-row";
   const openClassName = open ? `${className}--expanded` : "";
-  const rowClassName = (0, import_classnames41.default)(
+  const rowClassName = (0, import_classnames42.default)(
     className,
     bankTransaction.recently_categorized && editable && shouldHideAfterCategorize(bankTransaction) ? "Layer__bank-transaction-row--removing" : "",
     open ? openClassName : "",
@@ -10017,7 +10094,7 @@ var BankTransactionRow = ({
       /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
         "td",
         {
-          className: (0, import_classnames41.default)(
+          className: (0, import_classnames42.default)(
             "Layer__table-cell",
             "Layer__table-cell__category-col",
             `${className}__actions-cell`,
@@ -10199,7 +10276,7 @@ var Assignment = ({ bankTransaction }) => {
 };
 
 // src/components/BankTransactionList/BankTransactionListItem.tsx
-var import_classnames42 = __toESM(require("classnames"));
+var import_classnames43 = __toESM(require("classnames"));
 var import_date_fns19 = require("date-fns");
 var import_jsx_runtime120 = require("react/jsx-runtime");
 var BankTransactionListItem = ({
@@ -10270,7 +10347,7 @@ var BankTransactionListItem = ({
   const categorized = isCategorized(bankTransaction);
   const className = "Layer__bank-transaction-list-item";
   const openClassName = open ? `${className}--expanded` : "";
-  const rowClassName = (0, import_classnames42.default)(
+  const rowClassName = (0, import_classnames43.default)(
     className,
     bankTransaction.recently_categorized && editable && shouldHideAfterCategorize(bankTransaction) ? "Layer__bank-transaction-row--removing" : "",
     open ? openClassName : "",
@@ -10476,8 +10553,7 @@ var useMemoText = ({ bankTransaction, isActive }) => {
         }
       );
       const result = yield getBankTransactionMetadata2();
-      if (result.data.memo)
-        setMemoText(result.data.memo);
+      if (result.data.memo) setMemoText(result.data.memo);
     } catch (error) {
       console.error(error);
     }
@@ -10515,7 +10591,7 @@ var MemoTextProvider = ({
 };
 
 // src/components/BankTransactionMobileList/BusinessForm.tsx
-var import_classnames43 = __toESM(require("classnames"));
+var import_classnames44 = __toESM(require("classnames"));
 var import_jsx_runtime124 = require("react/jsx-runtime");
 var BusinessForm = ({
   bankTransaction,
@@ -10525,7 +10601,7 @@ var BusinessForm = ({
   showDescriptions
 }) => {
   const receiptsRef = (0, import_react62.useRef)(null);
-  const { setContent, close } = (0, import_react62.useContext)(DrawerContext);
+  const { setContent, close: close2 } = (0, import_react62.useContext)(DrawerContext);
   const { categorize: categorizeBankTransaction2, isLoading } = useBankTransactionsContext();
   const [selectedCategory, setSelectedCategory] = (0, import_react62.useState)(
     getAssignedValue(bankTransaction)
@@ -10559,7 +10635,7 @@ var BusinessForm = ({
     return options2;
   }, [bankTransaction, selectedCategory]);
   const onDrawerCategorySelect = (value) => {
-    close();
+    close2();
     setSelectedCategory(value);
   };
   const openDrawer = () => {
@@ -10649,7 +10725,7 @@ var BusinessForm = ({
     /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
       "div",
       {
-        className: (0, import_classnames43.default)(
+        className: (0, import_classnames44.default)(
           "Layer__bank-transaction-mobile-list-item__receipts",
           hasReceipts(bankTransaction) ? "Layer__bank-transaction-mobile-list-item__actions--with-receipts" : void 0
         ),
@@ -10711,7 +10787,7 @@ var PersonalCategories = /* @__PURE__ */ ((PersonalCategories2) => {
 })(PersonalCategories || {});
 
 // src/components/BankTransactionMobileList/PersonalForm.tsx
-var import_classnames44 = __toESM(require("classnames"));
+var import_classnames45 = __toESM(require("classnames"));
 var import_jsx_runtime125 = require("react/jsx-runtime");
 var isAlreadyAssigned = (bankTransaction) => {
   if (bankTransaction.categorization_status === "MATCHED" /* MATCHED */ || (bankTransaction == null ? void 0 : bankTransaction.categorization_status) === "SPLIT" /* SPLIT */) {
@@ -10784,7 +10860,7 @@ var PersonalForm = ({
     /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
       "div",
       {
-        className: (0, import_classnames44.default)(
+        className: (0, import_classnames45.default)(
           "Layer__bank-transaction-mobile-list-item__receipts",
           hasReceipts(bankTransaction) ? "Layer__bank-transaction-mobile-list-item__actions--with-receipts" : void 0
         ),
@@ -10831,7 +10907,7 @@ var import_react66 = require("react");
 
 // src/components/BankTransactionMobileList/MatchForm.tsx
 var import_react64 = require("react");
-var import_classnames45 = __toESM(require("classnames"));
+var import_classnames46 = __toESM(require("classnames"));
 var import_jsx_runtime126 = require("react/jsx-runtime");
 var MatchForm2 = ({
   bankTransaction,
@@ -10918,7 +10994,7 @@ var MatchForm2 = ({
     /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
       "div",
       {
-        className: (0, import_classnames45.default)(
+        className: (0, import_classnames46.default)(
           "Layer__bank-transaction-mobile-list-item__receipts",
           hasReceipts(bankTransaction) ? "Layer__bank-transaction-mobile-list-item__actions--with-receipts" : void 0
         ),
@@ -10963,7 +11039,7 @@ var MatchForm2 = ({
 
 // src/components/BankTransactionMobileList/SplitForm.tsx
 var import_react65 = require("react");
-var import_classnames46 = __toESM(require("classnames"));
+var import_classnames47 = __toESM(require("classnames"));
 var import_jsx_runtime127 = require("react/jsx-runtime");
 var SplitForm = ({
   bankTransaction,
@@ -11140,7 +11216,7 @@ var SplitForm = ({
                 {
                   type: "text",
                   name: `split-${index}`,
-                  className: (0, import_classnames46.default)(
+                  className: (0, import_classnames47.default)(
                     "Layer__split-amount-input",
                     index === 0 && "Layer__split-amount-input--first"
                   ),
@@ -11207,7 +11283,7 @@ var SplitForm = ({
     /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
       "div",
       {
-        className: (0, import_classnames46.default)(
+        className: (0, import_classnames47.default)(
           "Layer__bank-transaction-mobile-list-item__receipts",
           hasReceipts(bankTransaction) ? "Layer__bank-transaction-mobile-list-item__actions--with-receipts" : void 0
         ),
@@ -11356,7 +11432,7 @@ var TransactionToOpenContext = (0, import_react67.createContext)({
 });
 
 // src/components/BankTransactionMobileList/BankTransactionMobileListItem.tsx
-var import_classnames47 = __toESM(require("classnames"));
+var import_classnames48 = __toESM(require("classnames"));
 var import_date_fns20 = require("date-fns");
 var import_jsx_runtime130 = require("react/jsx-runtime");
 var DATE_FORMAT2 = "LLL d";
@@ -11425,7 +11501,7 @@ var BankTransactionMobileListItem = ({
         setRemoveAnim(true);
         openNext();
       } else {
-        close();
+        close2();
       }
     }
   }, [
@@ -11439,7 +11515,7 @@ var BankTransactionMobileListItem = ({
     }
     setOpen(!open);
   };
-  const close = () => {
+  const close2 = () => {
     setOpen(false);
     setHeight(0);
   };
@@ -11466,7 +11542,7 @@ var BankTransactionMobileListItem = ({
   const categorized = isCategorized(bankTransaction);
   const className = "Layer__bank-transaction-mobile-list-item";
   const openClassName = open ? `${className}--expanded` : "";
-  const rowClassName = (0, import_classnames47.default)(
+  const rowClassName = (0, import_classnames48.default)(
     className,
     removeAnim ? "Layer__bank-transaction-row--removing" : "",
     open ? openClassName : "",
@@ -11544,7 +11620,7 @@ var BankTransactionMobileListItem = ({
                     onChange: onChangePurpose
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(CloseButton, { onClick: () => close() })
+                /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(CloseButton, { onClick: () => close2() })
               ] }) : null,
               /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
                 BankTransactionMobileForms,
@@ -11601,14 +11677,14 @@ var BankTransactionMobileList = ({
 var import_react69 = require("react");
 
 // src/components/SkeletonLoader/SkeletonLoader.tsx
-var import_classnames48 = __toESM(require("classnames"));
+var import_classnames49 = __toESM(require("classnames"));
 var import_jsx_runtime132 = require("react/jsx-runtime");
 var SkeletonLoader = ({
   height,
   width,
   className
 }) => {
-  const baseClassName = (0, import_classnames48.default)(
+  const baseClassName = (0, import_classnames49.default)(
     "Layer__skeleton-loader Layer__anim--skeleton-loading",
     className
   );
@@ -11708,7 +11784,7 @@ var BankTransactionsLoader = ({
 };
 
 // src/components/SyncingComponent/SyncingComponent.tsx
-var import_classnames49 = __toESM(require("classnames"));
+var import_classnames50 = __toESM(require("classnames"));
 var import_jsx_runtime135 = require("react/jsx-runtime");
 var SyncingComponent = ({
   title = "Syncing account data",
@@ -11730,7 +11806,7 @@ var SyncingComponent = ({
   return /* @__PURE__ */ (0, import_jsx_runtime135.jsxs)(
     "div",
     {
-      className: (0, import_classnames49.default)(
+      className: (0, import_classnames50.default)(
         "Layer__syncing-component",
         inProgress ? "Layer__syncing-component--with-border" : ""
       ),
@@ -11925,7 +12001,7 @@ var usePagination = ({
 };
 
 // src/components/Pagination/Pagination.tsx
-var import_classnames50 = __toESM(require("classnames"));
+var import_classnames51 = __toESM(require("classnames"));
 var import_jsx_runtime139 = require("react/jsx-runtime");
 var Pagination = (props) => {
   return /* @__PURE__ */ (0, import_jsx_runtime139.jsx)("div", { className: "Layer__pagination-container", children: /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(PaginationContent, __spreadValues({}, props)) });
@@ -11956,7 +12032,7 @@ var PaginationContent = ({
     /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
       "li",
       {
-        className: (0, import_classnames50.default)(
+        className: (0, import_classnames51.default)(
           "Layer__pagination-item Layer__pagination-arrow Layer__pagination-arrow--previous",
           {
             disabled: currentPage === 1
@@ -11981,7 +12057,7 @@ var PaginationContent = ({
       return /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
         "li",
         {
-          className: (0, import_classnames50.default)("Layer__pagination-item", {
+          className: (0, import_classnames51.default)("Layer__pagination-item", {
             selected: pageNumber === currentPage
           }),
           onClick: () => {
@@ -12009,7 +12085,7 @@ var PaginationContent = ({
     /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
       "li",
       {
-        className: (0, import_classnames50.default)(
+        className: (0, import_classnames51.default)(
           "Layer__pagination-item Layer__pagination-arrow Layer__pagination-arrow--next",
           {
             disabled: currentPage === lastPage
@@ -12025,7 +12101,7 @@ var PaginationContent = ({
 
 // src/components/BankTransactions/BankTransactionsHeader.tsx
 var import_react72 = require("react");
-var import_classnames51 = __toESM(require("classnames"));
+var import_classnames52 = __toESM(require("classnames"));
 var import_date_fns21 = require("date-fns");
 var import_jsx_runtime140 = require("react/jsx-runtime");
 var DownloadButton2 = ({
@@ -12095,7 +12171,7 @@ var BankTransactionsHeader = ({
   return /* @__PURE__ */ (0, import_jsx_runtime140.jsxs)(
     Header,
     {
-      className: (0, import_classnames51.default)(
+      className: (0, import_classnames52.default)(
         "Layer__bank-transactions__header",
         withDatePicker && "Layer__bank-transactions__header--with-date-picker",
         mobileComponent && listView ? "Layer__bank-transactions__header--mobile" : void 0
@@ -13081,25 +13157,36 @@ function prepareFiltersBody(compareOptions) {
   const noneFilters = compareOptions.filter(
     ({ tagFilterConfig: { tagFilters: tagFilters2 } }) => tagFilters2 === "None"
   );
-  const tagFilters = compareOptions.flatMap(({ tagFilterConfig: { tagFilters: tagFilters2 } }) => {
+  const tagFilters = compareOptions.flatMap(({ tagFilterConfig: { tagFilters: tagFilters2, structure } }) => {
     if (tagFilters2 === "None") {
       return null;
     }
     if (tagFilters2.tagValues.length === 0) {
-      return { required_tags: [] };
-    }
-    return tagFilters2.tagValues.map((tagValue) => ({
-      required_tags: [{
-        key: tagFilters2.tagKey,
-        value: tagValue
-      }]
-    }));
+      const filter = {
+        structure,
+        required_tags: []
+      };
+      return filter;
+    }
+    return tagFilters2.tagValues.map((tagValue) => {
+      const filter = {
+        structure,
+        required_tags: [{
+          key: tagFilters2.tagKey,
+          value: tagValue
+        }]
+      };
+      return filter;
+    });
   }).filter((item) => item !== null);
   if (tagFilters.length === 0) {
     return;
   }
   const allFilters = [
-    noneFilters.length > 0 ? { required_tags: [] } : null,
+    noneFilters.length > 0 ? {
+      structure: noneFilters[0].tagFilterConfig.structure,
+      required_tags: []
+    } : null,
     ...tagFilters
   ].filter((item) => item !== null);
   return isArrayWithAtLeastOne(allFilters) ? allFilters : void 0;
@@ -13407,7 +13494,7 @@ var Indicator = ({
 };
 
 // src/components/ProfitAndLossChart/ProfitAndLossChart.tsx
-var import_classnames52 = __toESM(require("classnames"));
+var import_classnames53 = __toESM(require("classnames"));
 var import_date_fns26 = require("date-fns");
 var import_recharts = require("recharts");
 var import_jsx_runtime148 = require("react/jsx-runtime");
@@ -13814,7 +13901,7 @@ var ProfitAndLossChart = ({
     /* @__PURE__ */ (0, import_jsx_runtime148.jsx)(
       import_recharts.ResponsiveContainer,
       {
-        className: (0, import_classnames52.default)(
+        className: (0, import_classnames53.default)(
           "Layer__chart-container",
           loaded !== "complete" && "Layer__chart-container--loading"
         ),
@@ -13934,7 +14021,7 @@ var ProfitAndLossChart = ({
                   isAnimationActive: barAnimActive,
                   animationDuration: 100,
                   radius: [2, 2, 0, 0],
-                  className: (0, import_classnames52.default)(
+                  className: (0, import_classnames53.default)(
                     "Layer__profit-and-loss-chart__bar--loading",
                     loaded !== "complete" && "Layer__profit-and-loss-chart__bar--loading-anim"
                   ),
@@ -13950,7 +14037,7 @@ var ProfitAndLossChart = ({
                   isAnimationActive: barAnimActive,
                   animationDuration: 100,
                   radius: [2, 2, 0, 0],
-                  className: (0, import_classnames52.default)(
+                  className: (0, import_classnames53.default)(
                     "Layer__profit-and-loss-chart__bar--loading",
                     loaded !== "complete" && "Layer__profit-and-loss-chart__bar--loading-anim"
                   ),
@@ -14507,7 +14594,7 @@ var SortArrows = (_a) => {
 var SortArrows_default = SortArrows;
 
 // src/components/ProfitAndLossDetailedCharts/DetailedTable.tsx
-var import_classnames53 = __toESM(require("classnames"));
+var import_classnames54 = __toESM(require("classnames"));
 var import_jsx_runtime154 = require("react/jsx-runtime");
 var mapTypesToColors = (data, colorList = DEFAULT_CHART_COLOR_TYPE) => {
   const typeToColor = {};
@@ -14601,7 +14688,7 @@ var DetailedTable = ({
 }) => {
   const buildColClass = (column) => {
     var _a, _b, _c;
-    return (0, import_classnames53.default)(
+    return (0, import_classnames54.default)(
       "Layer__sortable-col",
       sidebarScope && ((_a = filters[sidebarScope]) == null ? void 0 : _a.sortBy) === column ? `sort--${(_c = sidebarScope && ((_b = filters[sidebarScope]) == null ? void 0 : _b.sortDirection)) != null ? _c : "desc"}` : ""
     );
@@ -14653,7 +14740,7 @@ var DetailedTable = ({
       return /* @__PURE__ */ (0, import_jsx_runtime154.jsxs)(
         "tr",
         {
-          className: (0, import_classnames53.default)(
+          className: (0, import_classnames54.default)(
             "Layer__profit-and-loss-detailed-table__row",
             hoveredItem && hoveredItem === item.display_name ? "active" : ""
           ),
@@ -14686,7 +14773,7 @@ var DetailedTable = ({
 };
 
 // src/components/ProfitAndLossDetailedCharts/DetailedChart.tsx
-var import_classnames54 = __toESM(require("classnames"));
+var import_classnames55 = __toESM(require("classnames"));
 var import_recharts2 = require("recharts");
 var import_jsx_runtime155 = require("react/jsx-runtime");
 var DetailedChart = ({
@@ -14780,7 +14867,7 @@ var DetailedChart = ({
               return /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
                 import_recharts2.Cell,
                 {
-                  className: (0, import_classnames54.default)(
+                  className: (0, import_classnames55.default)(
                     "Layer__profit-and-loss-detailed-charts__pie",
                     hoveredItem && active ? "active" : "inactive",
                     entry.type === "Uncategorized" && "Layer__profit-and-loss-detailed-charts__pie--border"
@@ -15246,11 +15333,11 @@ var import_react91 = require("react");
 
 // src/components/Header/Header.tsx
 var import_react88 = require("react");
-var import_classnames55 = __toESM(require("classnames"));
+var import_classnames56 = __toESM(require("classnames"));
 var import_jsx_runtime161 = require("react/jsx-runtime");
 var Header2 = (0, import_react88.forwardRef)(
   ({ className, children, style, sticky, asHeader, rounded }, ref) => {
-    const baseClassName = (0, import_classnames55.default)(
+    const baseClassName = (0, import_classnames56.default)(
       "Layer__header",
       sticky && "Layer__header--sticky",
       rounded && "Layer__header--top-rounded",
@@ -15273,24 +15360,24 @@ var Header2 = (0, import_react88.forwardRef)(
 Header2.displayName = "Header";
 
 // src/components/Header/HeaderRow.tsx
-var import_classnames56 = __toESM(require("classnames"));
+var import_classnames57 = __toESM(require("classnames"));
 var import_jsx_runtime162 = require("react/jsx-runtime");
 var HeaderRow = ({ className, children, direction, style }) => {
   const dataProps = toDataProperties({ direction });
-  return /* @__PURE__ */ (0, import_jsx_runtime162.jsx)("div", __spreadProps(__spreadValues({}, dataProps), { className: (0, import_classnames56.default)("Layer__header__row", className), style, children }));
+  return /* @__PURE__ */ (0, import_jsx_runtime162.jsx)("div", __spreadProps(__spreadValues({}, dataProps), { className: (0, import_classnames57.default)("Layer__header__row", className), style, children }));
 };
 
 // src/components/Header/HeaderCol.tsx
-var import_classnames57 = __toESM(require("classnames"));
+var import_classnames58 = __toESM(require("classnames"));
 var import_jsx_runtime163 = require("react/jsx-runtime");
 var HeaderCol = ({ className, children, style, noPadding = false }) => {
   const dataProperties = toDataProperties({ "no-padding": noPadding });
-  return /* @__PURE__ */ (0, import_jsx_runtime163.jsx)("div", __spreadProps(__spreadValues({}, dataProperties), { className: (0, import_classnames57.default)("Layer__header__col", className), style, children }));
+  return /* @__PURE__ */ (0, import_jsx_runtime163.jsx)("div", __spreadProps(__spreadValues({}, dataProperties), { className: (0, import_classnames58.default)("Layer__header__col", className), style, children }));
 };
 
 // src/components/Panel/Panel.tsx
 var import_react89 = require("react");
-var import_classnames58 = __toESM(require("classnames"));
+var import_classnames59 = __toESM(require("classnames"));
 var import_jsx_runtime164 = require("react/jsx-runtime");
 var Panel = ({
   children,
@@ -15310,7 +15397,7 @@ var Panel = ({
       setSidebarHeight((_b = parentRef == null ? void 0 : parentRef.current) == null ? void 0 : _b.offsetHeight);
     }
   }, [parentRef, (_a = parentRef == null ? void 0 : parentRef.current) == null ? void 0 : _a.offsetHeight, sidebarIsOpen]);
-  const sidebarClass = (0, import_classnames58.default)(
+  const sidebarClass = (0, import_classnames59.default)(
     "Layer__panel__sidebar",
     defaultSidebarHeight && "Layer__panel__sidebar--default",
     floating && "Layer__panel__sidebar--floating"
@@ -15318,7 +15405,7 @@ var Panel = ({
   return /* @__PURE__ */ (0, import_jsx_runtime164.jsxs)(
     "div",
     {
-      className: (0, import_classnames58.default)(
+      className: (0, import_classnames59.default)(
         "Layer__panel",
         className,
         sidebarIsOpen && "Layer__panel--open"
@@ -15347,17 +15434,17 @@ var Panel = ({
 var import_react90 = require("react");
 
 // src/components/ViewHeader/ViewHeader.tsx
-var import_classnames59 = __toESM(require("classnames"));
+var import_classnames60 = __toESM(require("classnames"));
 var import_jsx_runtime165 = require("react/jsx-runtime");
 var ViewHeader = ({ title, className, children }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime165.jsx)("div", { className: (0, import_classnames59.default)("Layer__view-header", className), children: /* @__PURE__ */ (0, import_jsx_runtime165.jsxs)("div", { className: "Layer__view-header__content", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime165.jsx)("div", { className: (0, import_classnames60.default)("Layer__view-header", className), children: /* @__PURE__ */ (0, import_jsx_runtime165.jsxs)("div", { className: "Layer__view-header__content", children: [
     title && /* @__PURE__ */ (0, import_jsx_runtime165.jsx)(Heading, { className: "Layer__view-header__title", children: title }),
     children && /* @__PURE__ */ (0, import_jsx_runtime165.jsx)("div", { className: "Layer__view-header__children", children })
   ] }) });
 };
 
 // src/components/View/View.tsx
-var import_classnames60 = __toESM(require("classnames"));
+var import_classnames61 = __toESM(require("classnames"));
 var import_jsx_runtime166 = require("react/jsx-runtime");
 var View = (0, import_react90.forwardRef)(
   ({
@@ -15373,7 +15460,7 @@ var View = (0, import_react90.forwardRef)(
   }, ref) => {
     const { theme } = useLayerContext();
     const styles = parseStylesFromThemeConfig(theme);
-    const viewClassNames = (0, import_classnames60.default)(
+    const viewClassNames = (0, import_classnames61.default)(
       "Layer__view",
       type === "panel" && "Layer__view--panel",
       viewClassName
@@ -15383,7 +15470,7 @@ var View = (0, import_react90.forwardRef)(
         ViewHeader,
         {
           title,
-          className: (0, import_classnames60.default)(
+          className: (0, import_classnames61.default)(
             headerControls ? "Layer__view-header--paddings" : void 0
           ),
           children: header != null ? header : headerControls
@@ -15892,7 +15979,7 @@ var TableBody = ({ children }) => {
 };
 
 // src/components/TableCell/TableCell.tsx
-var import_classnames61 = __toESM(require("classnames"));
+var import_classnames62 = __toESM(require("classnames"));
 var import_jsx_runtime176 = require("react/jsx-runtime");
 var TableCell = ({
   children,
@@ -15912,7 +15999,7 @@ var TableCell = ({
   const amount = typeof children === "number" ? children : 0;
   const isPositive = amount >= 0;
   const amountString = centsToDollars(Math.abs(amount));
-  const cellClassNames = (0, import_classnames61.default)(
+  const cellClassNames = (0, import_classnames62.default)(
     "Layer__table-cell",
     (primary || isHeaderCell) && "Layer__table-cell--primary",
     isHeaderCell && "Layer__table-header",
@@ -15955,7 +16042,7 @@ var TableHead = ({ children }) => {
 };
 
 // src/components/TableRow/TableRow.tsx
-var import_classnames62 = __toESM(require("classnames"));
+var import_classnames63 = __toESM(require("classnames"));
 var import_jsx_runtime178 = require("react/jsx-runtime");
 var TableRow = ({
   rowKey,
@@ -15975,12 +16062,11 @@ var TableRow = ({
     if (onClick) {
       onClick(e);
     } else {
-      if (variant === "summation" || !expandable)
-        return;
+      if (variant === "summation" || !expandable) return;
       handleExpand && handleExpand();
     }
   };
-  const rowClassNames = (0, import_classnames62.default)([
+  const rowClassNames = (0, import_classnames63.default)([
     "Layer__table-row",
     !isHeadRow && `Layer__table-row--depth-${depth}`,
     !isHeadRow && `Layer__table-row--variant-${variant}`,
@@ -16004,7 +16090,7 @@ var TableRow = ({
 
 // src/components/Table/Table.tsx
 var import_react97 = require("react");
-var import_classnames63 = __toESM(require("classnames"));
+var import_classnames64 = __toESM(require("classnames"));
 var import_jsx_runtime179 = require("react/jsx-runtime");
 var Table = ({
   componentName,
@@ -16045,11 +16131,11 @@ var Table = ({
       prevChildrenRef.current = newChildrenKeys;
     }
   }, [children]);
-  const tableWrapperClassNames = (0, import_classnames63.default)(
+  const tableWrapperClassNames = (0, import_classnames64.default)(
     "Layer__table-wrapper",
     bottomSpacing && "Layer__table-wrapper--bottom-spacing"
   );
-  const tableClassNames = (0, import_classnames63.default)(
+  const tableClassNames = (0, import_classnames64.default)(
     "Layer__table",
     componentName && `Layer__${componentName}__table`,
     borderCollapse && `Layer__table__${borderCollapse}-rows`
@@ -16058,7 +16144,7 @@ var Table = ({
 };
 
 // src/components/ProfitAndLossTable/ProfitAndLossCompareTable.tsx
-var import_classnames64 = __toESM(require("classnames"));
+var import_classnames65 = __toESM(require("classnames"));
 var import_jsx_runtime180 = require("react/jsx-runtime");
 var ProfitAndLossCompareTable = ({
   stringOverrides
@@ -16079,7 +16165,7 @@ var ProfitAndLossCompareTable = ({
     return /* @__PURE__ */ (0, import_jsx_runtime180.jsx)(
       "div",
       {
-        className: (0, import_classnames64.default)("Layer__profit-and-loss-table__loader-container"),
+        className: (0, import_classnames65.default)("Layer__profit-and-loss-table__loader-container"),
         children: /* @__PURE__ */ (0, import_jsx_runtime180.jsx)(Loader2, {})
       }
     );
@@ -16269,7 +16355,7 @@ var empty_profit_and_loss_report_default = {
 };
 
 // src/components/ProfitAndLossTable/ProfitAndLossTableComponent.tsx
-var import_classnames65 = __toESM(require("classnames"));
+var import_classnames66 = __toESM(require("classnames"));
 var import_jsx_runtime182 = require("react/jsx-runtime");
 var ProfitAndLossTableComponent = ({
   asContainer,
@@ -16290,7 +16376,7 @@ var ProfitAndLossTableComponent = ({
     return /* @__PURE__ */ (0, import_jsx_runtime182.jsx)(
       "div",
       {
-        className: (0, import_classnames65.default)(
+        className: (0, import_classnames66.default)(
           "Layer__profit-and-loss-table__loader-container",
           asContainer && "Layer__component-container"
         ),
@@ -18603,10 +18689,10 @@ var lineEntryNumber = (ledgerEntryLine) => {
 };
 
 // src/components/Card/Card.tsx
-var import_classnames66 = __toESM(require("classnames"));
+var import_classnames67 = __toESM(require("classnames"));
 var import_jsx_runtime203 = require("react/jsx-runtime");
 var Card = ({ children, className }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime203.jsx)("div", { className: (0, import_classnames66.default)("Layer__card", className), children });
+  return /* @__PURE__ */ (0, import_jsx_runtime203.jsx)("div", { className: (0, import_classnames67.default)("Layer__card", className), children });
 };
 
 // src/components/DateTime/DateTime.tsx
@@ -18650,7 +18736,7 @@ var DateTime = ({
 };
 
 // src/components/DetailsList/DetailsList.tsx
-var import_classnames67 = __toESM(require("classnames"));
+var import_classnames68 = __toESM(require("classnames"));
 var import_jsx_runtime205 = require("react/jsx-runtime");
 var DetailsList = ({
   title,
@@ -18659,7 +18745,7 @@ var DetailsList = ({
   titleClassName,
   actions
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime205.jsxs)("div", { className: (0, import_classnames67.default)("Layer__details-list", className), children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime205.jsxs)("div", { className: (0, import_classnames68.default)("Layer__details-list", className), children: [
     title && /* @__PURE__ */ (0, import_jsx_runtime205.jsxs)(Header, { className: titleClassName, children: [
       /* @__PURE__ */ (0, import_jsx_runtime205.jsx)(Heading, { size: "secondary" /* secondary */, children: title }),
       actions && /* @__PURE__ */ (0, import_jsx_runtime205.jsx)("div", { className: "Layer__details-list__actions", children: actions })
@@ -18974,7 +19060,7 @@ var LedgerAccountEntryDetails = ({
 
 // src/components/LedgerAccount/LedgerAccountRow.tsx
 var import_react116 = require("react");
-var import_classnames68 = __toESM(require("classnames"));
+var import_classnames69 = __toESM(require("classnames"));
 var import_date_fns36 = require("date-fns");
 var import_jsx_runtime208 = require("react/jsx-runtime");
 var LedgerAccountRow = ({
@@ -19000,7 +19086,7 @@ var LedgerAccountRow = ({
     return /* @__PURE__ */ (0, import_jsx_runtime208.jsxs)(
       "tr",
       {
-        className: (0, import_classnames68.default)(
+        className: (0, import_classnames69.default)(
           "Layer__table-row",
           row.entry_id === selectedEntryId && "Layer__table-row--active",
           initialLoad && "initial-load",
@@ -19041,7 +19127,7 @@ var LedgerAccountRow = ({
     return /* @__PURE__ */ (0, import_jsx_runtime208.jsx)(
       "tr",
       {
-        className: (0, import_classnames68.default)(
+        className: (0, import_classnames69.default)(
           "Layer__table-row",
           row.entry_id === selectedEntryId && "Layer__table-row--active",
           initialLoad && "initial-load",
@@ -19093,7 +19179,7 @@ var LedgerAccountRow = ({
   return /* @__PURE__ */ (0, import_jsx_runtime208.jsxs)(
     "tr",
     {
-      className: (0, import_classnames68.default)(
+      className: (0, import_classnames69.default)(
         "Layer__table-row",
         row.entry_id === selectedEntryId && "Layer__table-row--active",
         initialLoad && "initial-load",
@@ -19121,7 +19207,7 @@ var LedgerAccountRow = ({
 };
 
 // src/components/LedgerAccount/LedgerAccountIndex.tsx
-var import_classnames69 = __toESM(require("classnames"));
+var import_classnames70 = __toESM(require("classnames"));
 var import_jsx_runtime209 = require("react/jsx-runtime");
 var LedgerAccount = ({
   containerRef,
@@ -19152,7 +19238,7 @@ var LedgerAccount = ({
       return () => clearTimeout(timeoutLoad);
     }
   }, [isLoading]);
-  const baseClassName = (0, import_classnames69.default)(
+  const baseClassName = (0, import_classnames70.default)(
     "Layer__ledger-account__index",
     accountId && "open"
   );
@@ -19167,7 +19253,7 @@ var LedgerAccount = ({
     const lastPageIndex = firstPageIndex + pageSize;
     return (_a2 = rawData == null ? void 0 : rawData.sort((a, b) => Date.parse(b.date) - Date.parse(a.date))) == null ? void 0 : _a2.slice(firstPageIndex, lastPageIndex);
   }, [rawData, currentPage]);
-  const close = () => {
+  const close2 = () => {
     setAccountId(void 0);
     closeSelectedEntry();
   };
@@ -19185,7 +19271,7 @@ var LedgerAccount = ({
       className: "Layer__ledger-account__panel",
       children: /* @__PURE__ */ (0, import_jsx_runtime209.jsxs)("div", { className: baseClassName, children: [
         /* @__PURE__ */ (0, import_jsx_runtime209.jsx)(Header2, { className: "Layer__ledger-account__header", children: /* @__PURE__ */ (0, import_jsx_runtime209.jsx)(HeaderRow, { children: /* @__PURE__ */ (0, import_jsx_runtime209.jsxs)(HeaderCol, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime209.jsx)(BackButton, { onClick: close }),
+          /* @__PURE__ */ (0, import_jsx_runtime209.jsx)(BackButton, { onClick: close2 }),
           /* @__PURE__ */ (0, import_jsx_runtime209.jsxs)("div", { className: "Layer__ledger-account__title-container", children: [
             /* @__PURE__ */ (0, import_jsx_runtime209.jsx)(
               Text,
@@ -20793,8 +20879,7 @@ var useTasks = ({
     }).then(refetch);
   });
   const submitResponseToTask2 = (taskId, userResponse) => {
-    if (!taskId || !userResponse || userResponse.length === 0)
-      return;
+    if (!taskId || !userResponse || userResponse.length === 0) return;
     const data2 = {
       type: "FreeResponse",
       user_response: userResponse
@@ -20947,7 +21032,7 @@ var ProgressIcon_default = ProgressIcon;
 
 // src/components/TasksHeader/TasksHeader.tsx
 var import_date_fns40 = require("date-fns");
-var import_classnames70 = __toESM(require("classnames"));
+var import_classnames71 = __toESM(require("classnames"));
 var import_jsx_runtime220 = require("react/jsx-runtime");
 var ICONS = {
   loading: {
@@ -20975,7 +21060,8 @@ var TasksHeader = ({
   tasksHeader = "Bookkeeping Tasks",
   collapsable,
   open,
-  toggleContent
+  toggleContent,
+  highlightYears
 }) => {
   const {
     data: tasks,
@@ -20989,13 +21075,15 @@ var TasksHeader = ({
   const completedTasks = tasks == null ? void 0 : tasks.filter((task) => isComplete(task.status)).length;
   const badgeVariant = completedTasks === (tasks == null ? void 0 : tasks.length) ? ICONS.done : ICONS.pending;
   const minDate = getEarliestDateToBrowse(business);
-  return /* @__PURE__ */ (0, import_jsx_runtime220.jsx)("div", { className: (0, import_classnames70.default)("Layer__tasks-header", collapsable && "Layer__tasks-header--collapsable"), children: /* @__PURE__ */ (0, import_jsx_runtime220.jsxs)("div", { className: "Layer__tasks-header__left-col", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime220.jsx)("div", { className: (0, import_classnames71.default)("Layer__tasks-header", collapsable && "Layer__tasks-header--collapsable"), children: /* @__PURE__ */ (0, import_jsx_runtime220.jsxs)("div", { className: "Layer__tasks-header__left-col", children: [
     /* @__PURE__ */ (0, import_jsx_runtime220.jsxs)("div", { className: "Layer__tasks-header__left-col__title", children: [
       /* @__PURE__ */ (0, import_jsx_runtime220.jsx)(Text, { size: "lg" /* lg */, children: tasksHeader }),
       loadedStatus !== "complete" && !open ? /* @__PURE__ */ (0, import_jsx_runtime220.jsx)(Badge, { variant: ICONS.loading.badge, icon: ICONS.loading.icon, children: ICONS.loading.text }) : loadedStatus === "complete" && !open && (!tasks || error) ? /* @__PURE__ */ (0, import_jsx_runtime220.jsx)(
         Badge,
         {
-          onClick: () => refetch(),
+          onClick: () => {
+            void refetch();
+          },
           variant: ICONS.refresh.badge,
           icon: ICONS.refresh.icon,
           children: ICONS.refresh.text
@@ -21021,7 +21109,8 @@ var TasksHeader = ({
           maxDate: (0, import_date_fns40.endOfYear)(/* @__PURE__ */ new Date()),
           currentDateOption: false,
           navigateArrows: ["mobile", "desktop"],
-          disabled: minDate && (0, import_date_fns40.getYear)(minDate) === (0, import_date_fns40.getYear)(/* @__PURE__ */ new Date())
+          disabled: minDate && (0, import_date_fns40.getYear)(minDate) === (0, import_date_fns40.getYear)(/* @__PURE__ */ new Date()),
+          highlightYears
         }
       ),
       collapsable && /* @__PURE__ */ (0, import_jsx_runtime220.jsx)("div", { className: "Layer__tasks-header__left-col__expand", children: /* @__PURE__ */ (0, import_jsx_runtime220.jsx)(ExpandButton, { onClick: toggleContent, collapsed: !open }) })
@@ -21090,7 +21179,7 @@ var SmileIcon_default = SmileIcon;
 
 // src/components/TasksListItem/TasksListItem.tsx
 var import_react130 = require("react");
-var import_classnames71 = __toESM(require("classnames"));
+var import_classnames72 = __toESM(require("classnames"));
 var import_jsx_runtime222 = require("react/jsx-runtime");
 var TasksListItem = ({
   task,
@@ -21107,16 +21196,16 @@ var TasksListItem = ({
     deleteUploadsForTask,
     updateDocUploadTaskDescription
   } = (0, import_react130.useContext)(TasksContext);
-  const taskBodyClassName = (0, import_classnames71.default)(
+  const taskBodyClassName = (0, import_classnames72.default)(
     "Layer__tasks-list-item__body",
     isOpen && "Layer__tasks-list-item__body--expanded",
     isComplete(task.status) && "Layer__tasks-list-item--completed"
   );
-  const taskHeadClassName = (0, import_classnames71.default)(
+  const taskHeadClassName = (0, import_classnames72.default)(
     "Layer__tasks-list-item__head-info",
     isComplete(task.status) ? "Layer__tasks-list-item--completed" : "Layer__tasks-list-item--pending"
   );
-  const taskItemClassName = (0, import_classnames71.default)(
+  const taskItemClassName = (0, import_classnames72.default)(
     "Layer__tasks-list-item",
     isOpen && "Layer__tasks-list-item__expanded"
   );
@@ -21325,7 +21414,7 @@ var TasksList = ({ pageSize = 10 }) => {
 
 // src/components/TasksPending/TasksPending.tsx
 var import_react132 = require("react");
-var import_classnames72 = __toESM(require("classnames"));
+var import_classnames73 = __toESM(require("classnames"));
 var import_date_fns42 = require("date-fns");
 var import_recharts4 = require("recharts");
 var import_jsx_runtime224 = require("react/jsx-runtime");
@@ -21348,7 +21437,7 @@ var TasksPending = () => {
       value: data == null ? void 0 : data.filter((task) => !isComplete(task.status)).length
     }
   ];
-  const taskStatusClassName = (0, import_classnames72.default)(
+  const taskStatusClassName = (0, import_classnames73.default)(
     completedTasks && completedTasks > 0 ? "Layer__tasks-pending-bar__status--done" : "Layer__tasks-pending-bar__status--pending"
   );
   return /* @__PURE__ */ (0, import_jsx_runtime224.jsxs)("div", { className: "Layer__tasks-pending", children: [
@@ -21397,11 +21486,11 @@ var import_react133 = require("react");
 var import_date_fns43 = require("date-fns");
 
 // src/components/TasksMonthSelector/TaskMonthTile.tsx
-var import_classnames73 = __toESM(require("classnames"));
+var import_classnames74 = __toESM(require("classnames"));
 var import_jsx_runtime225 = require("react/jsx-runtime");
 var TaskMonthTile = ({ monthData, onClick, active, disabled }) => {
   const isCompleted = monthData.total === monthData.completed;
-  const baseClass = (0, import_classnames73.default)(
+  const baseClass = (0, import_classnames74.default)(
     "Layer__tasks-month-selector__month",
     isCompleted && "Layer__tasks-month-selector__month--completed",
     active && "Layer__tasks-month-selector__month--active",
@@ -21445,7 +21534,6 @@ var TasksMonthSelector = ({ tasks, year, currentDate, onClick }) => {
         { year, month: i, date: 1, hours: 0, minutes: 0, seconds: 0, milliseconds: 0 }
       );
       const endDate = (0, import_date_fns43.endOfMonth)(startDate);
-      const disabled = minDate && (0, import_date_fns43.isBefore)(startDate, minDate) || (0, import_date_fns43.isAfter)(startDate, (0, import_date_fns43.startOfMonth)(/* @__PURE__ */ new Date()));
       const taskData = (_a = tasks == null ? void 0 : tasks.find((x) => x.month === i && x.year === year)) != null ? _a : __spreadValues({
         monthStr: (0, import_date_fns43.format)(startDate, "MMM"),
         year,
@@ -21453,6 +21541,7 @@ var TasksMonthSelector = ({ tasks, year, currentDate, onClick }) => {
         startDate,
         endDate
       }, DEFAULT_TASK_DATA);
+      const disabled = taskData.total === 0 && (minDate && (0, import_date_fns43.isBefore)(startDate, minDate) || (0, import_date_fns43.isAfter)(startDate, (0, import_date_fns43.startOfMonth)(/* @__PURE__ */ new Date())));
       return __spreadValues({
         monthStr: (0, import_date_fns43.format)(startDate, "MMM"),
         startDate,
@@ -21476,7 +21565,7 @@ var TasksMonthSelector = ({ tasks, year, currentDate, onClick }) => {
 };
 
 // src/components/Tasks/Tasks.tsx
-var import_classnames74 = __toESM(require("classnames"));
+var import_classnames75 = __toESM(require("classnames"));
 var import_date_fns44 = require("date-fns");
 var import_jsx_runtime227 = require("react/jsx-runtime");
 var UseTasksContext = (0, import_react134.createContext)({
@@ -21566,7 +21655,7 @@ var TasksComponent = ({
   return /* @__PURE__ */ (0, import_jsx_runtime227.jsxs)(
     "div",
     {
-      className: (0, import_classnames74.default)(
+      className: (0, import_classnames75.default)(
         "Layer__tasks-component",
         collapsable && "Layer__tasks-component--collapsable"
       ),
@@ -21577,13 +21666,14 @@ var TasksComponent = ({
             tasksHeader: (stringOverrides == null ? void 0 : stringOverrides.header) || tasksHeader,
             collapsable,
             open,
-            toggleContent: () => setOpen(!open)
+            toggleContent: () => setOpen(!open),
+            highlightYears: yearlyData == null ? void 0 : yearlyData.map((x) => x.year)
           }
         ),
         /* @__PURE__ */ (0, import_jsx_runtime227.jsx)(
           "div",
           {
-            className: (0, import_classnames74.default)(
+            className: (0, import_classnames75.default)(
               "Layer__tasks__content",
               !open && "Layer__tasks__content--collapsed"
             ),
@@ -21738,7 +21828,7 @@ function LinkAccountsConfirmationStep() {
         ) }, index)
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime230.jsxs)(HStack, { pbs: "lg", justify: "end", gap: "sm", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime230.jsxs)(HStack, { pbs: "lg", gap: "sm", children: [
       /* @__PURE__ */ (0, import_jsx_runtime230.jsx)(Button, { variant: "secondary" /* secondary */, onClick: previous, children: "Back" }),
       /* @__PURE__ */ (0, import_jsx_runtime230.jsx)(
         Subscribe,
@@ -21770,7 +21860,16 @@ function LinkAccountsConfirmationStep() {
 // src/components/PlatformOnboarding/Steps/LinkAccountsLinkStep.tsx
 var import_react137 = require("react");
 var import_pluralize = __toESM(require("pluralize"));
+
+// src/components/Separator/Separator.tsx
 var import_jsx_runtime231 = require("react/jsx-runtime");
+var Separator = ({ mbs, mbe }) => {
+  const dataProperties = toDataProperties({ mbs, mbe });
+  return /* @__PURE__ */ (0, import_jsx_runtime231.jsx)("div", __spreadValues({ className: "Layer__separator" }, dataProperties));
+};
+
+// src/components/PlatformOnboarding/Steps/LinkAccountsLinkStep.tsx
+var import_jsx_runtime232 = require("react/jsx-runtime");
 function LinkAccountsLinkStep() {
   const {
     data,
@@ -21781,48 +21880,57 @@ function LinkAccountsLinkStep() {
   } = (0, import_react137.useContext)(LinkedAccountsContext);
   const { next } = useWizard();
   const effectiveAccounts = data != null ? data : [];
-  return /* @__PURE__ */ (0, import_jsx_runtime231.jsxs)(import_jsx_runtime231.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime232.jsxs)(import_jsx_runtime232.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(
       ConditionalList,
       {
         list: effectiveAccounts,
-        Empty: /* @__PURE__ */ (0, import_jsx_runtime231.jsxs)(VStack, { gap: "2xs", pbe: "md", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(P, { variant: "subtle", size: "lg", children: "Connect your business bank accounts and credit cards to automatically import your business transactions." }),
-          /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(HStack, { pbs: "lg", justify: "center", children: /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(
-            Button,
+        Empty: /* @__PURE__ */ (0, import_jsx_runtime232.jsxs)(VStack, { gap: "xl", pbe: "md", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(Text, { status: "disabled", children: "Connect your bank accounts and credit cards to automatically import your business transactions." }),
+          /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(
+            ActionableRow,
             {
-              onClick: () => {
-                addConnection("PLAID");
-              },
-              rightIcon: /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(Link_default, { size: 12 }),
-              disabled: loadingStatus !== "complete",
-              children: "Connect my bank"
+              iconBox: /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(PlaidIcon_default, {}),
+              title: "Connect my bank",
+              description: "Import data with one simple integration.",
+              button: /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(
+                Button,
+                {
+                  onClick: () => addConnection("PLAID"),
+                  rightIcon: /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(Link_default, { size: 12 }),
+                  disabled: loadingStatus !== "complete",
+                  children: "Connect"
+                }
+              )
             }
-          ) })
+          )
         ] }),
-        Container: ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime231.jsxs)(VStack, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime231.jsxs)(VStack, { gap: "2xs", pbe: "md", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(Heading2, { level: 3, size: "sm", children: `We've found ${(0, import_pluralize.default)("account", effectiveAccounts.length, true)}` }),
-            /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(P, { variant: "subtle", children: "You'll have the chance to remove any accounts you don't use for your business in the next step." })
+        Container: ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime232.jsxs)(VStack, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime232.jsxs)(VStack, { gap: "2xs", pbe: "md", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(Heading2, { level: 3, size: "sm", children: `We've found ${(0, import_pluralize.default)("account", effectiveAccounts.length, true)}` }),
+            /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(Text, { status: "disabled", children: "You'll have the chance to remove any accounts you don't use for your business in the next step." })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(LinkAccountsListContainer, { children }),
-          /* @__PURE__ */ (0, import_jsx_runtime231.jsxs)(VStack, { pbs: "xl", gap: "sm", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(Heading2, { level: 3, align: "center", children: "Do you use any other bank accounts or credit cards for your business?" }),
-            /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(HStack, { justify: "center", children: /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(
-              Button,
-              {
-                onClick: () => {
-                  addConnection("PLAID");
-                },
-                rightIcon: /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(Link_default, { size: 12 }),
-                disabled: loadingStatus !== "complete",
-                children: "Link another bank"
-              }
-            ) })
-          ] })
+          /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(LinkAccountsListContainer, { children }),
+          /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(VStack, { pbs: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(
+            ActionableRow,
+            {
+              iconBox: /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(PlaidIcon_default, {}),
+              title: "Connect my next bank account",
+              description: "Import data with one simple integration.",
+              button: /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(
+                Button,
+                {
+                  onClick: () => addConnection("PLAID"),
+                  rightIcon: /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(Link_default, { size: 12 }),
+                  disabled: loadingStatus !== "complete",
+                  children: "Connect next"
+                }
+              )
+            }
+          ) })
         ] }),
         isError: Boolean(error),
-        Error: /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(
+        Error: /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(
           DataState,
           {
             status: "failed" /* failed */,
@@ -21834,20 +21942,23 @@ function LinkAccountsLinkStep() {
           }
         ),
         isLoading: loadingStatus === "loading" || loadingStatus === "initial",
-        Loading: /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(Loader2, {}),
-        children: ({ item: account }) => /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(BasicLinkedAccountContainer, { isSelected: true, children: /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(BasicLinkedAccountContent, { account }) }, account.id)
+        Loading: /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(Loader2, {}),
+        children: ({ item: account }) => /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(BasicLinkedAccountContainer, { isSelected: true, children: /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(BasicLinkedAccountContent, { account }) }, account.id)
       }
     ),
-    effectiveAccounts.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(HStack, { pbs: "lg", justify: "end", gap: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(Button, { onClick: () => {
-      void next();
-    }, children: "I\u2019m done connecting my business accounts" }) }) : null
+    effectiveAccounts.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime232.jsxs)(import_jsx_runtime232.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(Separator, { mbs: "lg", mbe: "lg" }),
+      /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(HStack, { justify: "start", gap: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(Button, { onClick: () => {
+        void next();
+      }, rightIcon: /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(ChevronRight_default, {}), children: "I\u2019m done linking my banks" }) })
+    ] }) : null
   ] });
 }
 
 // src/components/PlatformOnboarding/LinkAccounts.tsx
-var import_jsx_runtime232 = require("react/jsx-runtime");
+var import_jsx_runtime233 = require("react/jsx-runtime");
 function LinkAccounts(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(LinkedAccountsProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(LinkAccountsContent, __spreadValues({}, props)) });
+  return /* @__PURE__ */ (0, import_jsx_runtime233.jsx)(LinkedAccountsProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime233.jsx)(LinkAccountsContent, __spreadValues({}, props)) });
 }
 function LinkAccountsContent({
   onComplete
@@ -21855,45 +21966,1112 @@ function LinkAccountsContent({
   const { data: linkedAccounts, loadingStatus } = (0, import_react138.useContext)(LinkedAccountsContext);
   const linkedAccountsNeedingConfirmation = linkedAccounts ? getAccountsNeedingConfirmation(linkedAccounts) : [];
   const hideConfirmationStep = loadingStatus === "complete" && linkedAccountsNeedingConfirmation.length === 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime232.jsx)("section", { className: "Layer__link-accounts Layer__component", children: /* @__PURE__ */ (0, import_jsx_runtime232.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime233.jsx)("section", { className: "Layer__link-accounts Layer__component", children: /* @__PURE__ */ (0, import_jsx_runtime233.jsxs)(
     Wizard,
     {
-      Header: /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(Heading2, { level: 2, pbe: "md", children: "Link your bank accounts and credit cards" }),
+      Header: /* @__PURE__ */ (0, import_jsx_runtime233.jsx)(Heading2, { children: "Link your bank accounts and credit cards" }),
       Footer: null,
       onComplete,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(LinkAccountsLinkStep, {}),
-        hideConfirmationStep ? null : /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(LinkAccountsConfirmationStep, {})
+        /* @__PURE__ */ (0, import_jsx_runtime233.jsx)(LinkAccountsLinkStep, {}),
+        hideConfirmationStep ? null : /* @__PURE__ */ (0, import_jsx_runtime233.jsx)(LinkAccountsConfirmationStep, {})
       ]
     }
   ) });
 }
 
-// src/icons/Coffee.tsx
-var import_jsx_runtime233 = require("react/jsx-runtime");
-var CoffeeIcon = (_a) => {
-  var _b = _a, { size = 11 } = _b, props = __objRest(_b, ["size"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime233.jsxs)(
+// src/components/PlatformOnboarding/PlatformOnboarding.tsx
+var import_react140 = require("react");
+
+// src/components/ProgressSteps/ProgressSteps.tsx
+var import_jsx_runtime234 = require("react/jsx-runtime");
+var ProgressSteps = ({ steps, currentStep }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime234.jsx)("div", { className: "Layer__progress-steps", children: steps.map((step, index) => {
+    const dataProperties = toDataProperties({ active: index <= currentStep, complete: currentStep > index });
+    return /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(
+      "div",
+      {
+        className: "Layer__progress-steps--step-wrapper",
+        children: /* @__PURE__ */ (0, import_jsx_runtime234.jsxs)("div", __spreadProps(__spreadValues({ className: "Layer__progress-steps--step" }, dataProperties), { children: [
+          index < steps.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime234.jsx)("div", { className: "Layer__progress-steps--step-line" }),
+          /* @__PURE__ */ (0, import_jsx_runtime234.jsx)("div", { className: "Layer__progress-steps--circle", children: index < currentStep && /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(Check_default, { size: 10 }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime234.jsx)("div", { className: "Layer__progress-steps--label", children: /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(Text, { size: "sm" /* sm */, children: step }) })
+        ] }))
+      },
+      index
+    );
+  }) });
+};
+
+// src/icons/Document.tsx
+var import_jsx_runtime235 = require("react/jsx-runtime");
+var Document = (_a) => {
+  var _b = _a, { size = 20 } = _b, props = __objRest(_b, ["size"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime235.jsxs)(
     "svg",
     __spreadProps(__spreadValues({
       xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 12 12",
+      viewBox: "0 0 20 20",
       fill: "none"
     }, props), {
       width: size,
       height: size,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime233.jsxs)("g", { clipPath: "url(#clip0_5018_10141)", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime233.jsx)(
-            "path",
-            {
-              d: "M3.25 4.16666H2.79167C2.30544 4.16666 1.83912 4.35981 1.4953 4.70363C1.15149 5.04744 0.958333 5.51376 0.958333 5.99999C0.958333 6.48622 1.15149 6.95254 1.4953 7.29635C1.83912 7.64017 2.30544 7.83332 2.79167 7.83332H3.25",
+        /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
+          "path",
+          {
+            d: "M11.6667 1.66666H5.00004C4.55801 1.66666 4.13409 1.84226 3.82153 2.15482C3.50897 2.46738 3.33337 2.8913 3.33337 3.33333V16.6667C3.33337 17.1087 3.50897 17.5326 3.82153 17.8452C4.13409 18.1577 4.55801 18.3333 5.00004 18.3333H15C15.4421 18.3333 15.866 18.1577 16.1786 17.8452C16.4911 17.5326 16.6667 17.1087 16.6667 16.6667V6.66666L11.6667 1.66666Z",
+            stroke: "white",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
+          "path",
+          {
+            d: "M11.6667 1.66666H5.00004C4.55801 1.66666 4.13409 1.84226 3.82153 2.15482C3.50897 2.46738 3.33337 2.8913 3.33337 3.33333V16.6667C3.33337 17.1087 3.50897 17.5326 3.82153 17.8452C4.13409 18.1577 4.55801 18.3333 5.00004 18.3333H15C15.4421 18.3333 15.866 18.1577 16.1786 17.8452C16.4911 17.5326 16.6667 17.1087 16.6667 16.6667V6.66666L11.6667 1.66666Z",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
+          "path",
+          {
+            d: "M11.6666 1.66666V6.66666H16.6666",
+            stroke: "white",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
+          "path",
+          {
+            d: "M11.6666 1.66666V6.66666H16.6666",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
+          "path",
+          {
+            d: "M13.3333 10.8333H6.66663",
+            stroke: "white",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
+          "path",
+          {
+            d: "M13.3333 10.8333H6.66663",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
+          "path",
+          {
+            d: "M13.3333 14.1667H6.66663",
+            stroke: "white",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
+          "path",
+          {
+            d: "M13.3333 14.1667H6.66663",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
+          "path",
+          {
+            d: "M8.33329 7.5H7.49996H6.66663",
+            stroke: "white",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
+          "path",
+          {
+            d: "M8.33329 7.5H7.49996H6.66663",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        )
+      ]
+    })
+  );
+};
+var Document_default = Document;
+
+// src/icons/TrendingUp.tsx
+var import_jsx_runtime236 = require("react/jsx-runtime");
+var TrendingUp = (_a) => {
+  var _b = _a, { size = 20 } = _b, props = __objRest(_b, ["size"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime236.jsxs)(
+    "svg",
+    __spreadProps(__spreadValues({
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 20 20",
+      fill: "none"
+    }, props), {
+      width: size,
+      height: size,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(
+          "path",
+          {
+            d: "M19.1667 5L11.25 12.9167L7.08337 8.75L0.833374 15",
+            stroke: "white",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(
+          "path",
+          {
+            d: "M19.1667 5L11.25 12.9167L7.08337 8.75L0.833374 15",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(
+          "path",
+          {
+            d: "M14.1666 5H19.1666V10",
+            stroke: "white",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(
+          "path",
+          {
+            d: "M14.1666 5H19.1666V10",
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        )
+      ]
+    })
+  );
+};
+var TrendingUp_default = TrendingUp;
+
+// src/components/PlatformOnboarding/Steps/WelcomeStep.tsx
+var import_jsx_runtime237 = require("react/jsx-runtime");
+var defaultTitle = "Welcome";
+var defaultDescription = "Welcome to the platform onboarding process";
+var WelcomeStep = ({ onNext, title = defaultTitle, description, stepsEnabled }) => {
+  const buildDescription = () => {
+    if (description) {
+      return description;
+    }
+    if (stepsEnabled) {
+      let text = "In this flow we\u2019ll ";
+      if (stepsEnabled.includes("business-info")) {
+        text += "confirm your business information, ";
+      }
+      if (stepsEnabled.includes("link-accounts")) {
+        text += "connect your financial accounts, ";
+      }
+      text += "and start managing your books like a pro.";
+      return text;
+    }
+    return defaultDescription;
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)(import_jsx_runtime237.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)("div", { className: "Layer__platform-onboarding__welcome", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Heading, { className: "Layer__platform-onboarding__heading", align: "left", children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Text, { status: "disabled", children: buildDescription() })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Button, { onClick: onNext, children: "Get started" })
+  ] });
+};
+var WelcomeStepFooter = () => {
+  return /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)("div", { className: "Layer__platform-onboarding__welcome-footer", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)("div", { className: "Layer__platform-onboarding__welcome-footer__content", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)("div", { className: "Layer__platform-onboarding__welcome-footer__header", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Heading, { align: "left", children: "How it works" }),
+        /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Text, { status: "disabled", children: "Discover how seamless accounting can transform your business." })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)(VStack, { gap: "lg", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)(VStack, { gap: "xs", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)(HStack, { gap: "xs", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(TrendingUp_default, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Heading, { size: "secondary" /* secondary */, children: "Understand your business health" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Text, { status: "disabled", children: "Get an accurate picture of your financial performance and insight into how to grow your profit." })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)(VStack, { gap: "xs", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)(HStack, { gap: "xs", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Document_default, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Heading, { size: "secondary" /* secondary */, children: "Be ready for tax time" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Text, { status: "disabled", children: "Keep your business finances organized to avoid paying more taxes than needed or IRS fines at tax time." })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)("div", { className: "Layer__platform-onboarding__welcome-footer__images", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)("div", { className: "Layer__platform-onboarding__welcome-footer__image", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime237.jsx)("div", { className: "Layer__platform__onboarding__welcome-footer__image-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(
+          "img",
+          {
+            src: "https://layer-public.s3.us-west-2.amazonaws.com/site-images/linked-accounts.png",
+            alt: "Connect your accounts"
+          }
+        ) }),
+        /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)("div", { className: "Layer__platform__onboarding__welcome-footer__image-text", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Heading, { size: "secondary" /* secondary */, children: "Connect your accounts" }),
+          /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Text, { as: "p", children: "Connect your bank accounts and credit cards to see a complete picture of your business finances." })
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)("div", { className: "Layer__platform-onboarding__welcome-footer__image", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime237.jsx)("div", { className: "Layer__platform__onboarding__welcome-footer__image-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(
+          "img",
+          {
+            src: "https://layer-public.s3.us-west-2.amazonaws.com/site-images/bookkeeping-tasks.png",
+            alt: "Bookkeeping tasks"
+          }
+        ) }),
+        /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)("div", { className: "Layer__platform__onboarding__welcome-footer__image-text", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Heading, { size: "secondary" /* secondary */, children: "Ongoing monthly bookkeeping" }),
+          /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Text, { as: "p", children: "Receive a monthly report of your financial performance to review with your PSM." })
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)("div", { className: "Layer__platform-onboarding__welcome-footer__image", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime237.jsx)("div", { className: "Layer__platform__onboarding__welcome-footer__image-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(
+          "img",
+          {
+            src: "https://layer-public.s3.us-west-2.amazonaws.com/site-images/revenue.png",
+            alt: "Profitability"
+          }
+        ) }),
+        /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)("div", { className: "Layer__platform__onboarding__welcome-footer__image-text", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Heading, { size: "secondary" /* secondary */, children: "See your profitability" }),
+          /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Text, { as: "p", children: "Our bookkeeping team organized and categorizes your business transactions." })
+        ] })
+      ] })
+    ] })
+  ] });
+};
+
+// src/components/PlatformOnboarding/Steps/SummaryStep.tsx
+var import_jsx_runtime238 = require("react/jsx-runtime");
+var defaultTitle2 = "You\u2019re all set!";
+var defaultDescription2 = "We\u2019re syncing your accounts. This process may take a while to complete.";
+var defaultNextBtnText = "Go to dashboard";
+var SummaryStep = ({ onNext, title = defaultTitle2, description = defaultDescription2, nextBtnText = defaultNextBtnText }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime238.jsxs)(import_jsx_runtime238.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime238.jsxs)("div", { className: "Layer__platform-onboarding__summary", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(Heading, { className: "Layer__platform-onboarding__heading", align: "left", children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(Text, { status: "disabled", children: description })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(Button, { onClick: onNext, children: nextBtnText })
+  ] });
+};
+
+// src/utils/form.ts
+var notEmpty = (value) => {
+  if (!value) {
+    return false;
+  }
+  return value.trim().length > 0;
+};
+var validateEmailFormat = (email, required = false) => {
+  if (!email) {
+    return !required;
+  }
+  return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
+};
+
+// src/components/BusinessForm/useBusinessForm.ts
+var import_react_form2 = require("@tanstack/react-form");
+
+// src/hooks/businessPersonnel/useBusinessPersonnel.ts
+var import_swr16 = __toESM(require("swr"));
+
+// src/utils/array/readonlyTransformations.ts
+function mapReadonly(array, callbackFn) {
+  return array.map(callbackFn);
+}
+function filterReadonly(array, predicate) {
+  return array.filter(predicate);
+}
+
+// src/hooks/businessPersonnel/types.ts
+var PERSONNEL_ROLES = ["ACCOUNTANT", "ADMINISTRATOR", "OWNER"];
+function isPersonnelRole(role) {
+  return PERSONNEL_ROLES.includes(role);
+}
+
+// src/hooks/businessPersonnel/useBusinessPersonnel.ts
+var BUSINESS_PERSONNEL_TAG_KEY = "#business-personnel";
+function buildKey13({
+  access_token: accessToken,
+  apiUrl,
+  businessId
+}) {
+  if (accessToken && apiUrl) {
+    return {
+      accessToken,
+      apiUrl,
+      businessId,
+      tags: [BUSINESS_PERSONNEL_TAG_KEY]
+    };
+  }
+}
+var getBusinessPersonnel = get(({ businessId }) => `/v1/businesses/${businessId}/personnel`);
+function useBusinessPersonnel() {
+  const { data } = useAuth();
+  const { businessId } = useLayerContext();
+  return (0, import_swr16.default)(
+    () => buildKey13(__spreadProps(__spreadValues({}, data), {
+      businessId
+    })),
+    ({ accessToken, apiUrl, businessId: businessId2 }) => getBusinessPersonnel(
+      apiUrl,
+      accessToken,
+      {
+        params: { businessId: businessId2 }
+      }
+    )().then(({ data: data2 }) => data2.map(({
+      id,
+      full_name: fullName,
+      preferred_name: preferredName,
+      external_id: externalId,
+      email_addresses,
+      phone_numbers,
+      roles
+    }) => ({
+      id,
+      fullName,
+      preferredName,
+      externalId,
+      emailAddresses: mapReadonly(
+        email_addresses,
+        ({ id: id2, email_address: emailAddress }) => ({ id: id2, emailAddress })
+      ),
+      phoneNumbers: mapReadonly(
+        phone_numbers,
+        ({ id: id2, phone_number: phoneNumber }) => ({ id: id2, phoneNumber })
+      ),
+      roles: filterReadonly(
+        roles,
+        (roleEntity) => isPersonnelRole(roleEntity.role)
+      )
+    })))
+  );
+}
+
+// src/hooks/businessPersonnel/useCreateBusinessPersonnel.ts
+var import_mutation7 = __toESM(require("swr/mutation"));
+var import_swr17 = require("swr");
+
+// src/utils/swr/withSWRKeyTags.ts
+function withSWRKeyTags(key, predicate) {
+  if (typeof key !== "object" || key === null || !("tags" in key)) {
+    return false;
+  }
+  return isStringArray(key.tags) ? predicate(key.tags) : false;
+}
+
+// src/hooks/businessPersonnel/useCreateBusinessPersonnel.ts
+var createBusinessPersonnel = post(({ businessId }) => `/v1/businesses/${businessId}/personnel`);
+function buildKey14({
+  access_token: accessToken,
+  apiUrl,
+  businessId
+}) {
+  if (accessToken && apiUrl) {
+    return {
+      accessToken,
+      apiUrl,
+      businessId,
+      tags: [`${BUSINESS_PERSONNEL_TAG_KEY}:create`]
+    };
+  }
+}
+function useCreateBusinessPersonnel() {
+  const { data } = useAuth();
+  const { businessId } = useLayerContext();
+  const { mutate } = (0, import_swr17.useSWRConfig)();
+  const mutationResponse = (0, import_mutation7.default)(
+    () => buildKey14(__spreadProps(__spreadValues({}, data), {
+      businessId
+    })),
+    ({ accessToken, apiUrl, businessId: businessId2 }, { arg: body }) => createBusinessPersonnel(
+      apiUrl,
+      accessToken,
+      {
+        params: { businessId: businessId2 },
+        body
+      }
+    ).then(({ data: data2 }) => data2),
+    {
+      revalidate: false,
+      throwOnError: false
+    }
+  );
+  const { trigger: originalTrigger } = mutationResponse;
+  return Object.assign(
+    mutationResponse,
+    {
+      trigger: (...triggerParameters) => __async(this, null, function* () {
+        const data2 = yield originalTrigger(...triggerParameters);
+        if (data2) {
+          yield mutate((key) => withSWRKeyTags(key, (tags) => tags.includes(BUSINESS_PERSONNEL_TAG_KEY)));
+        }
+        return data2;
+      })
+    }
+  );
+}
+
+// src/hooks/businessPersonnel/useUpdateBusinessPersonnel.ts
+var import_mutation8 = __toESM(require("swr/mutation"));
+var import_swr18 = require("swr");
+
+// src/api/layer/businessPersonnel/updateBusinessPersonnel.ts
+var updateBusinessPersonnel = post(({ businessId, businessPersonnelId }) => {
+  return `/v1/businesses/${businessId}/personnel/${businessPersonnelId}/update`;
+});
+
+// src/hooks/businessPersonnel/useUpdateBusinessPersonnel.ts
+function buildKey15({
+  access_token: accessToken,
+  apiUrl,
+  businessId,
+  businessPersonnelId
+}) {
+  if (accessToken && apiUrl && businessPersonnelId) {
+    return {
+      accessToken,
+      apiUrl,
+      businessId,
+      businessPersonnelId,
+      tags: [`${BUSINESS_PERSONNEL_TAG_KEY}:${businessPersonnelId}`]
+    };
+  }
+}
+function useUpdateBusinessPersonnel({ businessPersonnelId }) {
+  const { data } = useAuth();
+  const { businessId } = useLayerContext();
+  const { mutate } = (0, import_swr18.useSWRConfig)();
+  const mutationResponse = (0, import_mutation8.default)(
+    () => buildKey15(__spreadProps(__spreadValues({}, data), {
+      businessId,
+      businessPersonnelId
+    })),
+    ({ accessToken, apiUrl, businessId: businessId2, businessPersonnelId: businessPersonnelId2 }, { arg: body }) => updateBusinessPersonnel(
+      apiUrl,
+      accessToken,
+      {
+        params: {
+          businessId: businessId2,
+          businessPersonnelId: businessPersonnelId2
+        },
+        body
+      }
+    ).then(({ data: data2 }) => data2),
+    {
+      revalidate: false,
+      throwOnError: false
+    }
+  );
+  const { trigger: originalTrigger } = mutationResponse;
+  return Object.assign(
+    mutationResponse,
+    {
+      trigger: (...triggerParameters) => __async(this, null, function* () {
+        const data2 = yield originalTrigger(...triggerParameters);
+        if (data2) {
+          yield mutate((key) => withSWRKeyTags(key, (tags) => tags.includes(BUSINESS_PERSONNEL_TAG_KEY)));
+        }
+        return data2;
+      })
+    }
+  );
+}
+
+// src/hooks/business/useUpdateBusiness.ts
+var import_mutation9 = __toESM(require("swr/mutation"));
+var import_swr19 = require("swr");
+var BUSINESS_TAG_KEY = "business";
+function buildKey16({
+  access_token: accessToken,
+  apiUrl,
+  businessId
+}) {
+  if (accessToken && apiUrl && businessId) {
+    return {
+      accessToken,
+      apiUrl,
+      businessId,
+      tags: [`${BUSINESS_TAG_KEY}:${businessId}`]
+    };
+  }
+}
+function useUpdateBusiness() {
+  const { data } = useAuth();
+  const { businessId } = useLayerContext();
+  const { mutate } = (0, import_swr19.useSWRConfig)();
+  const mutationResponse = (0, import_mutation9.default)(
+    () => buildKey16(__spreadProps(__spreadValues({}, data), {
+      businessId
+    })),
+    ({ accessToken, apiUrl, businessId: businessId2 }, { arg: body }) => updateBusiness(
+      apiUrl,
+      accessToken,
+      {
+        params: { businessId: businessId2 },
+        body
+      }
+    ).then(({ data: data2 }) => data2),
+    {
+      revalidate: false,
+      throwOnError: false
+    }
+  );
+  const { trigger: originalTrigger } = mutationResponse;
+  return Object.assign(
+    mutationResponse,
+    {
+      trigger: (...triggerParameters) => __async(this, null, function* () {
+        const data2 = yield originalTrigger(...triggerParameters);
+        if (data2) {
+          yield mutate((key) => withSWRKeyTags(key, (tags) => tags.includes(BUSINESS_TAG_KEY)));
+        }
+        return data2;
+      })
+    }
+  );
+}
+
+// src/components/BusinessForm/useBusinessForm.ts
+var import_react139 = require("react");
+var getPerson = (personnel) => {
+  const owners = personnel == null ? void 0 : personnel.filter((p) => p.roles.find((x) => x.role === "OWNER"));
+  if (owners && owners.length > 0) {
+    return owners[0];
+  }
+  return personnel == null ? void 0 : personnel[0];
+};
+var useBusinessForm = ({ onSuccess }) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i;
+  const { business } = useLayerContext();
+  const [submitError, setSubmitError] = (0, import_react139.useState)(void 0);
+  const { data: personnel } = useBusinessPersonnel();
+  const person = getPerson(personnel);
+  const { trigger: createBusinessPersonnel2 } = useCreateBusinessPersonnel();
+  const { trigger: updateBusinessPersonnel2 } = useUpdateBusinessPersonnel({ businessPersonnelId: person == null ? void 0 : person.id });
+  const { trigger: updateBusiness2 } = useUpdateBusiness();
+  const form = (0, import_react_form2.useForm)({
+    defaultValues: {
+      full_name: (_a = person == null ? void 0 : person.fullName) != null ? _a : void 0,
+      preferred_name: (_b = person == null ? void 0 : person.preferredName) != null ? _b : void 0,
+      phone_number: (_d = (_c = person == null ? void 0 : person.phoneNumbers) == null ? void 0 : _c[0]) == null ? void 0 : _d.phoneNumber,
+      email: (_f = (_e = person == null ? void 0 : person.emailAddresses) == null ? void 0 : _e[0]) == null ? void 0 : _f.emailAddress,
+      legal_name: (_g = business == null ? void 0 : business.legal_name) != null ? _g : void 0,
+      entity_type: (_h = business == null ? void 0 : business.entity_type) != null ? _h : void 0,
+      us_state: (_i = business == null ? void 0 : business.us_state) != null ? _i : void 0,
+      tin: business == null ? void 0 : business.tin
+    },
+    onSubmit: (_0) => __async(void 0, [_0], function* ({ value }) {
+      var _a2;
+      try {
+        setSubmitError(void 0);
+        if (person) {
+          yield updateBusinessPersonnel2({
+            id: person.id,
+            full_name: value.full_name,
+            preferred_name: value.preferred_name,
+            email_addresses: value.email ? [{ email_address: value.email }] : [],
+            phone_numbers: value.phone_number ? [{ phone_number: value.phone_number }] : []
+          });
+        } else {
+          if (value.full_name) {
+            yield createBusinessPersonnel2({
+              full_name: value.full_name,
+              preferred_name: (_a2 = value.preferred_name) != null ? _a2 : null,
+              email_addresses: value.email ? [{ email_address: value.email }] : [],
+              phone_numbers: value.phone_number ? [{ phone_number: value.phone_number }] : [],
+              external_id: null,
+              roles: [{ role: "OWNER" }]
+            });
+          }
+        }
+        yield updateBusiness2({
+          legal_name: value.legal_name,
+          entity_type: value.entity_type,
+          us_state: value.us_state,
+          tin: value.tin
+        });
+        onSuccess == null ? void 0 : onSuccess();
+      } catch (e) {
+        setSubmitError("Something went wrong. Please try again.");
+      }
+    })
+  });
+  const isFormValid = (0, import_react_form2.useStore)(form.store, (state) => state.isValid);
+  return { form, submitError, isFormValid };
+};
+
+// src/components/Input/FormSection.tsx
+var import_jsx_runtime239 = require("react/jsx-runtime");
+var FormSection = ({ children, title }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime239.jsxs)(VStack, { className: "Layer__form-section", gap: "sm", children: [
+    title && /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(
+      Text,
+      {
+        className: "Layer__form-section__title",
+        size: "sm" /* sm */,
+        weight: "bold" /* bold */,
+        children: title
+      }
+    ),
+    children
+  ] });
+};
+
+// src/components/Input/BusinessTypeSelect.tsx
+var import_jsx_runtime240 = require("react/jsx-runtime");
+var findSelectOption = (options, value) => {
+  if (!value) {
+    return void 0;
+  }
+  return options.find((o) => o.value === value);
+};
+var BusinessTypeSelect = ({ value, onChange }) => {
+  const entityTypeOptions = ENTITY_TYPES;
+  return /* @__PURE__ */ (0, import_jsx_runtime240.jsx)(
+    Select,
+    {
+      options: entityTypeOptions,
+      value: findSelectOption(entityTypeOptions, value),
+      onChange: (option) => onChange(option == null ? void 0 : option.value)
+    }
+  );
+};
+
+// src/types/location.ts
+var US_STATES = [
+  { value: "AL", label: "Alabama" },
+  { value: "AK", label: "Alaska" },
+  { value: "AZ", label: "Arizona" },
+  { value: "AR", label: "Arkansas" },
+  { value: "CA", label: "California" },
+  { value: "CO", label: "Colorado" },
+  { value: "CT", label: "Connecticut" },
+  { value: "DE", label: "Delaware" },
+  { value: "DC", label: "District of Columbia" },
+  { value: "FL", label: "Florida" },
+  { value: "GA", label: "Georgia" },
+  { value: "HI", label: "Hawaii" },
+  { value: "ID", label: "Idaho" },
+  { value: "IL", label: "Illinois" },
+  { value: "IN", label: "Indiana" },
+  { value: "IA", label: "Iowa" },
+  { value: "KS", label: "Kansas" },
+  { value: "KY", label: "Kentucky" },
+  { value: "LA", label: "Louisiana" },
+  { value: "ME", label: "Maine" },
+  { value: "MD", label: "Maryland" },
+  { value: "MA", label: "Massachusetts" },
+  { value: "MI", label: "Michigan" },
+  { value: "MN", label: "Minnesota" },
+  { value: "MS", label: "Mississippi" },
+  { value: "MO", label: "Missouri" },
+  { value: "MT", label: "Montana" },
+  { value: "NE", label: "Nebraska" },
+  { value: "NV", label: "Nevada" },
+  { value: "NH", label: "New Hampshire" },
+  { value: "NJ", label: "New Jersey" },
+  { value: "NM", label: "New Mexico" },
+  { value: "NY", label: "New York" },
+  { value: "NC", label: "North Carolina" },
+  { value: "ND", label: "North Dakota" },
+  { value: "OH", label: "Ohio" },
+  { value: "OK", label: "Oklahoma" },
+  { value: "OR", label: "Oregon" },
+  { value: "PA", label: "Pennsylvania" },
+  { value: "RI", label: "Rhode Island" },
+  { value: "SC", label: "South Carolina" },
+  { value: "SD", label: "South Dakota" },
+  { value: "TN", label: "Tennessee" },
+  { value: "TX", label: "Texas" },
+  { value: "UT", label: "Utah" },
+  { value: "VT", label: "Vermont" },
+  { value: "VA", label: "Virginia" },
+  { value: "WA", label: "Washington" },
+  { value: "WV", label: "West Virginia" },
+  { value: "WI", label: "Wisconsin" },
+  { value: "WY", label: "Wyoming" },
+  { value: "PR", label: "Puerto Rico" }
+];
+
+// src/components/Input/USStateSelect.tsx
+var import_jsx_runtime241 = require("react/jsx-runtime");
+var findSelectOption2 = (options, selected) => {
+  if (!selected) {
+    return void 0;
+  }
+  return options.find(
+    (o) => String(o.value).toLowerCase() === String(selected).toLowerCase() || String(o.label).toLowerCase() === String(selected).toLowerCase()
+  );
+};
+var USStateSelect = ({ value, onChange }) => {
+  const usStateOptions = US_STATES.map((state) => ({
+    label: state.label,
+    value: state.value
+  }));
+  return /* @__PURE__ */ (0, import_jsx_runtime241.jsx)(
+    Select,
+    {
+      options: usStateOptions,
+      value: findSelectOption2(usStateOptions, value),
+      onChange: (option) => onChange(option),
+      placeholder: "US state"
+    }
+  );
+};
+
+// src/components/Input/PhoneInput.tsx
+var import_libphonenumber_js = require("libphonenumber-js");
+var import_jsx_runtime242 = require("react/jsx-runtime");
+var PhoneInput = (_a) => {
+  var _b = _a, {
+    value,
+    onChange,
+    placeholder = "Phone number"
+  } = _b, props = __objRest(_b, [
+    "value",
+    "onChange",
+    "placeholder"
+  ]);
+  const handleChange = (e) => {
+    const input = e.target.value;
+    const formattedNumber = (0, import_libphonenumber_js.formatIncompletePhoneNumber)(input, "US");
+    onChange(formattedNumber != null ? formattedNumber : input);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime242.jsx)(
+    Input,
+    __spreadValues({
+      type: "tel",
+      value: value ? (0, import_libphonenumber_js.formatIncompletePhoneNumber)(value, "US") : void 0,
+      onChange: handleChange,
+      placeholder,
+      "aria-label": "Phone number input"
+    }, props)
+  );
+};
+
+// src/components/BusinessForm/BusinessForm.tsx
+var import_libphonenumber_js2 = require("libphonenumber-js");
+var import_jsx_runtime243 = require("react/jsx-runtime");
+var BusinessForm2 = ({ stringOverrides, onSuccess }) => {
+  var _a;
+  const { form, submitError, isFormValid } = useBusinessForm({ onSuccess });
+  const { isSubmitting } = form.state;
+  return /* @__PURE__ */ (0, import_jsx_runtime243.jsxs)(
+    "form",
+    {
+      className: "Layer__form Layer__business-form",
+      onSubmit: (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        void form.handleSubmit();
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime243.jsxs)(FormSection, { title: "Contact information", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime243.jsxs)("div", { className: "Layer__business-form__name-fields", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+              form.Field,
+              {
+                name: "full_name",
+                validators: {
+                  onSubmit: ({ value }) => notEmpty(value) ? void 0 : "Full name is required"
+                },
+                children: (field) => /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(import_jsx_runtime243.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(InputGroup, { name: "full_name", label: "Full name", children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+                  Input,
+                  {
+                    name: "full_name",
+                    placeholder: "John Doe",
+                    value: field.state.value,
+                    onChange: (e) => field.handleChange(e.target.value),
+                    isInvalid: field.state.meta.errors.length > 0,
+                    errorMessage: field.state.meta.errors.join(", ")
+                  }
+                ) }) })
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(form.Field, { name: "preferred_name", children: (field) => /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(import_jsx_runtime243.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(InputGroup, { name: "preferred_name", label: "Preferred name", children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+              Input,
+              {
+                name: "preferred_name",
+                placeholder: "John",
+                value: field.state.value,
+                onChange: (e) => field.handleChange(e.target.value)
+              }
+            ) }) }) })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+            form.Field,
+            {
+              name: "email",
+              validators: {
+                onSubmit: ({ value }) => validateEmailFormat(value, true) ? void 0 : "Email is invalid"
+              },
+              children: (field) => /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(import_jsx_runtime243.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+                InputGroup,
+                {
+                  name: "email",
+                  label: "What\u2019s the email you want to use for bookkeeping communication?",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+                    Input,
+                    {
+                      name: "email",
+                      placeholder: "john@company.com",
+                      value: field.state.value,
+                      onChange: (e) => field.handleChange(e.target.value),
+                      isInvalid: field.state.meta.errors.length > 0,
+                      errorMessage: field.state.meta.errors.join(", ")
+                    }
+                  )
+                }
+              ) })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+            form.Field,
+            {
+              name: "phone_number",
+              validators: {
+                onSubmit: ({ value }) => (0, import_libphonenumber_js2.isPossiblePhoneNumber)(value != null ? value : "", "US") ? void 0 : "Phone number is invalid"
+              },
+              children: (field) => /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(import_jsx_runtime243.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+                InputGroup,
+                {
+                  name: "phone_number",
+                  label: "What\u2019s the phone number you want to use for bookkeeping communication?",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+                    PhoneInput,
+                    {
+                      value: field.state.value,
+                      onChange: (value) => field.handleChange(value),
+                      isInvalid: field.state.meta.errors.length > 0,
+                      errorMessage: field.state.meta.errors.join(", ")
+                    }
+                  )
+                }
+              ) })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime243.jsxs)(FormSection, { title: "Business information", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+            form.Field,
+            {
+              name: "legal_name",
+              validators: {
+                onBlur: ({ value }) => notEmpty(value) ? void 0 : "Company name is required"
+              },
+              children: (field) => /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(import_jsx_runtime243.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(InputGroup, { name: "legal_name", label: "Company", children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+                Input,
+                {
+                  name: "legal_name",
+                  placeholder: "Company",
+                  value: field.state.value,
+                  onChange: (e) => field.handleChange(e.target.value),
+                  isInvalid: field.state.meta.errors.length > 0,
+                  errorMessage: field.state.meta.errors.join(", ")
+                }
+              ) }) })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(form.Field, { name: "dba", children: (field) => /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(import_jsx_runtime243.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(InputGroup, { name: "dba", label: "DBA (optional)", children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+            Input,
+            {
+              name: "dba",
+              placeholder: "Alternative name",
+              value: field.state.value,
+              onChange: (e) => field.handleChange(e.target.value),
+              isInvalid: field.state.meta.errors.length > 0,
+              errorMessage: field.state.meta.errors.join(", ")
+            }
+          ) }) }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(form.Field, { name: "entity_type", children: (field) => /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(import_jsx_runtime243.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(InputGroup, { name: "entity_type", label: "Entity type", children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+            BusinessTypeSelect,
+            {
+              value: field.state.value,
+              onChange: (value) => field.handleChange(value)
+            }
+          ) }) }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime243.jsxs)("div", { className: "Layer__business-form__state-tin-fields", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(form.Field, { name: "us_state", children: (field) => /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(import_jsx_runtime243.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(InputGroup, { name: "us_state", label: "State", className: "Layer__business-form__state", children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+              USStateSelect,
+              {
+                value: field.state.value,
+                onChange: (option) => field.handleChange(option.value)
+              }
+            ) }) }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(form.Field, { name: "tin", children: (field) => /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(import_jsx_runtime243.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(InputGroup, { name: "tin", label: "Tax ID number (optional)", children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+              Input,
+              {
+                name: "tin",
+                placeholder: "Tax ID number",
+                value: field.state.value,
+                onChange: (e) => field.handleChange(e.target.value),
+                isInvalid: field.state.meta.errors.length > 0,
+                errorMessage: field.state.meta.errors.join(", ")
+              }
+            ) }) }) })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+          SubmitButton,
+          {
+            type: "submit",
+            processing: isSubmitting,
+            noIcon: true,
+            withRetry: true,
+            error: submitError,
+            children: (_a = stringOverrides == null ? void 0 : stringOverrides.saveButton) != null ? _a : "Save"
+          }
+        ),
+        !isFormValid && /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(ErrorText, { pb: "xs", children: "Please check all fields." })
+      ]
+    }
+  );
+};
+
+// src/components/PlatformOnboarding/Steps/BusinessInfoStep.tsx
+var import_jsx_runtime244 = require("react/jsx-runtime");
+var defaultTitle3 = "We\u2019ll use this information to contact you whenever we have questions on your books.";
+var BusinessInfoStep = ({ title = defaultTitle3, onNext }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime244.jsxs)(import_jsx_runtime244.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(Heading2, { children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(BusinessForm2, { onSuccess: onNext })
+  ] });
+};
+
+// src/components/PlatformOnboarding/PlatformOnboarding.tsx
+var import_jsx_runtime245 = require("react/jsx-runtime");
+var PLATFORM_ONBOARDING_STEPS = [
+  {
+    id: "welcome",
+    label: "Get started"
+  },
+  {
+    id: "business-info",
+    label: "Confirm your informations"
+  },
+  {
+    id: "link-accounts",
+    label: "Connect accounts"
+  },
+  {
+    id: "summary",
+    label: "Summary"
+  }
+];
+var PlatformOnboarding = ({ onComplete }) => {
+  const [step, setStep] = (0, import_react140.useState)(PLATFORM_ONBOARDING_STEPS[0].id);
+  const isFirstStep = PLATFORM_ONBOARDING_STEPS[0].id === step;
+  const nextStep = () => {
+    const currentStepIndex = PLATFORM_ONBOARDING_STEPS.findIndex((s) => s.id === step);
+    if (currentStepIndex === PLATFORM_ONBOARDING_STEPS.length - 1) {
+      onComplete == null ? void 0 : onComplete();
+      return;
+    }
+    const nextStep2 = PLATFORM_ONBOARDING_STEPS[currentStepIndex + 1];
+    if (nextStep2) {
+      setStep(nextStep2.id);
+    }
+  };
+  const previousStep = () => {
+    const currentStepIndex = PLATFORM_ONBOARDING_STEPS.findIndex((s) => s.id === step);
+    const previousStep2 = PLATFORM_ONBOARDING_STEPS[currentStepIndex - 1];
+    if (previousStep2) {
+      setStep(previousStep2.id);
+    }
+  };
+  const renderStepContent = () => {
+    switch (step) {
+      case "welcome":
+        return /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(WelcomeStep, { onNext: nextStep, stepsEnabled: PLATFORM_ONBOARDING_STEPS.map((s) => s.id) });
+      case "business-info":
+        return /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(BusinessInfoStep, { onNext: nextStep });
+      case "link-accounts":
+        return /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(LinkAccounts, { onComplete: nextStep });
+      case "summary":
+        return /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(SummaryStep, { onNext: nextStep });
+    }
+  };
+  const renderStepFooter = () => {
+    if (step === "welcome") {
+      return /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(WelcomeStepFooter, {});
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime245.jsx)("div", { className: "Layer__component Layer__platform-onboarding", children: /* @__PURE__ */ (0, import_jsx_runtime245.jsxs)("div", { className: "Layer__platform-onboarding-layout", children: [
+    !isFirstStep && /* @__PURE__ */ (0, import_jsx_runtime245.jsx)("div", { className: "Layer__platform-onboarding__back-button-container", children: /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(
+      Button,
+      {
+        onClick: previousStep,
+        variant: "secondary" /* secondary */,
+        children: "Back"
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime245.jsxs)("div", { className: "Layer__platfom-onboarding-layout__box", children: [
+      PLATFORM_ONBOARDING_STEPS.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(
+        ProgressSteps,
+        {
+          steps: PLATFORM_ONBOARDING_STEPS.map((step2) => step2.label),
+          currentStep: step === "summary" ? PLATFORM_ONBOARDING_STEPS.length : PLATFORM_ONBOARDING_STEPS.findIndex((s) => s.id === step)
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime245.jsx)("div", { className: "Layer__platform-onboarding-layout__content", children: renderStepContent() })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime245.jsx)("div", { className: "Layer__platform-onboarding-layout__footer", children: renderStepFooter() })
+  ] }) });
+};
+
+// src/icons/Coffee.tsx
+var import_jsx_runtime246 = require("react/jsx-runtime");
+var CoffeeIcon = (_a) => {
+  var _b = _a, { size = 11 } = _b, props = __objRest(_b, ["size"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime246.jsxs)(
+    "svg",
+    __spreadProps(__spreadValues({
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 12 12",
+      fill: "none"
+    }, props), {
+      width: size,
+      height: size,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime246.jsxs)("g", { clipPath: "url(#clip0_5018_10141)", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime246.jsx)(
+            "path",
+            {
+              d: "M3.25 4.16666H2.79167C2.30544 4.16666 1.83912 4.35981 1.4953 4.70363C1.15149 5.04744 0.958333 5.51376 0.958333 5.99999C0.958333 6.48622 1.15149 6.95254 1.4953 7.29635C1.83912 7.64017 2.30544 7.83332 2.79167 7.83332H3.25",
               stroke: "currentColor",
               strokeLinecap: "round",
               strokeLinejoin: "round"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime233.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime246.jsx)(
             "path",
             {
               d: "M10.5834 4.16666H3.25004V8.29166C3.25004 8.77789 3.4432 9.2442 3.78701 9.58802C4.13083 9.93184 4.59714 10.125 5.08337 10.125H8.75004C9.23627 10.125 9.70259 9.93184 10.0464 9.58802C10.3902 9.2442 10.5834 8.77789 10.5834 8.29166V4.16666Z",
@@ -21902,7 +23080,7 @@ var CoffeeIcon = (_a) => {
               strokeLinejoin: "round"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime233.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime246.jsx)(
             "path",
             {
               d: "M8.75 0.958344V2.33334",
@@ -21911,7 +23089,7 @@ var CoffeeIcon = (_a) => {
               strokeLinejoin: "round"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime233.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime246.jsx)(
             "path",
             {
               d: "M6.91663 0.958344V2.33334",
@@ -21920,7 +23098,7 @@ var CoffeeIcon = (_a) => {
               strokeLinejoin: "round"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime233.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime246.jsx)(
             "path",
             {
               d: "M5.08337 0.958344V2.33334",
@@ -21930,7 +23108,7 @@ var CoffeeIcon = (_a) => {
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime233.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime233.jsx)("clipPath", { id: "clip0_5018_10141", children: /* @__PURE__ */ (0, import_jsx_runtime233.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime246.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime246.jsx)("clipPath", { id: "clip0_5018_10141", children: /* @__PURE__ */ (0, import_jsx_runtime246.jsx)(
           "rect",
           {
             width: "11",
@@ -21946,17 +23124,17 @@ var CoffeeIcon = (_a) => {
 var Coffee_default = CoffeeIcon;
 
 // src/components/UpsellBanner/BookkeepingUpsellBar.tsx
-var import_jsx_runtime234 = require("react/jsx-runtime");
+var import_jsx_runtime247 = require("react/jsx-runtime");
 var BookkeepingUpsellBar = ({
   onClick,
   href
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime234.jsxs)("div", { className: "Layer__bar-banner Layer__bar-banner--bookkeeping", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime234.jsxs)("div", { className: "Layer__bar-banner__left-col", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(IconBox, { children: /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(Coffee_default, {}) }),
-      /* @__PURE__ */ (0, import_jsx_runtime234.jsxs)("div", { className: "Layer__bar-banner__text-container", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(Text, { size: "md" /* md */, weight: "bold" /* bold */, children: "Need help with your books?" }),
-        /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime247.jsxs)("div", { className: "Layer__bar-banner Layer__bar-banner--bookkeeping", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime247.jsxs)("div", { className: "Layer__bar-banner__left-col", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime247.jsx)(IconBox, { children: /* @__PURE__ */ (0, import_jsx_runtime247.jsx)(Coffee_default, {}) }),
+      /* @__PURE__ */ (0, import_jsx_runtime247.jsxs)("div", { className: "Layer__bar-banner__text-container", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime247.jsx)(Text, { size: "md" /* md */, weight: "bold" /* bold */, children: "Need help with your books?" }),
+        /* @__PURE__ */ (0, import_jsx_runtime247.jsx)(
           Text,
           {
             size: "sm" /* sm */,
@@ -21966,25 +23144,25 @@ var BookkeepingUpsellBar = ({
         )
       ] })
     ] }),
-    onClick ? /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(Button, { variant: "secondary" /* secondary */, onClick, children: "Schedule a demo" }) : href ? /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(Link2, { href, target: "_blank", variant: "secondary" /* secondary */, children: "Schedule a demo" }) : null
+    onClick ? /* @__PURE__ */ (0, import_jsx_runtime247.jsx)(Button, { variant: "secondary" /* secondary */, onClick, children: "Schedule a demo" }) : href ? /* @__PURE__ */ (0, import_jsx_runtime247.jsx)(Link2, { href, target: "_blank", variant: "secondary" /* secondary */, children: "Schedule a demo" }) : null
   ] });
 };
 
 // src/views/BookkeepingOverview/BookkeepingOverview.tsx
-var import_react139 = require("react");
+var import_react141 = require("react");
 
 // src/views/BookkeepingOverview/internal/BookkeepingProfitAndLossSummariesContainer.tsx
-var import_jsx_runtime235 = require("react/jsx-runtime");
+var import_jsx_runtime248 = require("react/jsx-runtime");
 var CLASS_NAME10 = "Layer__BookkeepingProfitAndLossSummariesContainer";
 function BookkeepingProfitAndLossSummariesContainer({
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime235.jsx)("div", { className: CLASS_NAME10, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime248.jsx)("div", { className: CLASS_NAME10, children });
 }
 
 // src/views/BookkeepingOverview/BookkeepingOverview.tsx
-var import_classnames75 = __toESM(require("classnames"));
-var import_jsx_runtime236 = require("react/jsx-runtime");
+var import_classnames76 = __toESM(require("classnames"));
+var import_jsx_runtime249 = require("react/jsx-runtime");
 var BookkeepingOverview = ({
   title,
   showTitle = true,
@@ -21992,19 +23170,19 @@ var BookkeepingOverview = ({
   slotProps
 }) => {
   var _a, _b, _c, _d, _e, _f;
-  const [pnlToggle, setPnlToggle] = (0, import_react139.useState)("expenses");
+  const [pnlToggle, setPnlToggle] = (0, import_react141.useState)("expenses");
   const [width] = useWindowSize();
   const profitAndLossSummariesVariants = (_b = (_a = slotProps == null ? void 0 : slotProps.profitAndLoss) == null ? void 0 : _a.summaries) == null ? void 0 : _b.variants;
-  return /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(ProfitAndLoss, { asContainer: false, children: /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(TasksProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime236.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(ProfitAndLoss, { asContainer: false, children: /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(TasksProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime249.jsxs)(
     View,
     {
       viewClassName: "Layer__bookkeeping-overview--view",
       title: (stringOverrides == null ? void 0 : stringOverrides.title) || title || "Bookkeeping overview",
       withSidebar: width > 1100,
-      sidebar: /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(TasksComponent, { stringOverrides: stringOverrides == null ? void 0 : stringOverrides.tasks }),
+      sidebar: /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(TasksComponent, { stringOverrides: stringOverrides == null ? void 0 : stringOverrides.tasks }),
       showHeader: showTitle,
       children: [
-        width <= 1100 && /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(
+        width <= 1100 && /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
           TasksComponent,
           {
             collapsable: true,
@@ -22012,33 +23190,33 @@ var BookkeepingOverview = ({
             stringOverrides: stringOverrides == null ? void 0 : stringOverrides.tasks
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime236.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime249.jsxs)(
           Container,
           {
             name: "bookkeeping-overview-profit-and-loss",
             asWidget: true,
             elevated: true,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
                 ProfitAndLoss.Header,
                 {
                   text: ((_c = stringOverrides == null ? void 0 : stringOverrides.profitAndLoss) == null ? void 0 : _c.header) || "Profit & Loss",
                   withDatePicker: true
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(BookkeepingProfitAndLossSummariesContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(BookkeepingProfitAndLossSummariesContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
                 ProfitAndLoss.Summaries,
                 {
                   stringOverrides: (_d = stringOverrides == null ? void 0 : stringOverrides.profitAndLoss) == null ? void 0 : _d.summaries,
                   variants: profitAndLossSummariesVariants
                 }
               ) }),
-              /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(ProfitAndLoss.Chart, {})
+              /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(ProfitAndLoss.Chart, {})
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime236.jsxs)("div", { className: "Layer__bookkeeping-overview-profit-and-loss-charts", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime249.jsxs)("div", { className: "Layer__bookkeeping-overview-profit-and-loss-charts", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
             Toggle,
             {
               name: "pnl-detailed-charts",
@@ -22056,14 +23234,14 @@ var BookkeepingOverview = ({
               onChange: (e) => setPnlToggle(e.target.value)
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
             Container,
             {
-              name: (0, import_classnames75.default)(
+              name: (0, import_classnames76.default)(
                 "bookkeeping-overview-profit-and-loss-chart",
                 pnlToggle !== "revenue" && "bookkeeping-overview-profit-and-loss-chart--hidden"
               ),
-              children: /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
                 ProfitAndLoss.DetailedCharts,
                 {
                   scope: "revenue",
@@ -22073,14 +23251,14 @@ var BookkeepingOverview = ({
               )
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
             Container,
             {
-              name: (0, import_classnames75.default)(
+              name: (0, import_classnames76.default)(
                 "bookkeeping-overview-profit-and-loss-chart",
                 pnlToggle !== "expenses" && "bookkeeping-overview-profit-and-loss-chart--hidden"
               ),
-              children: /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
                 ProfitAndLoss.DetailedCharts,
                 {
                   scope: "expenses",
@@ -22097,23 +23275,23 @@ var BookkeepingOverview = ({
 };
 
 // src/views/AccountingOverview/AccountingOverview.tsx
-var import_react141 = require("react");
+var import_react143 = require("react");
 
 // src/views/AccountingOverview/internal/TransactionsToReview.tsx
-var import_react140 = require("react");
+var import_react142 = require("react");
 
 // src/components/BadgeLoader/BadgeLoader.tsx
-var import_jsx_runtime237 = require("react/jsx-runtime");
+var import_jsx_runtime250 = require("react/jsx-runtime");
 var BadgeLoader = ({ children }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime237.jsxs)("span", { className: "Layer__loader Layer__loader--as-badge", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(Loader_default, { size: 11, className: "Layer__anim--rotating" }),
+  return /* @__PURE__ */ (0, import_jsx_runtime250.jsxs)("span", { className: "Layer__loader Layer__loader--as-badge", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime250.jsx)(Loader_default, { size: 11, className: "Layer__anim--rotating" }),
     children
   ] });
 };
 
 // src/views/AccountingOverview/internal/TransactionsToReview.tsx
 var import_date_fns45 = require("date-fns");
-var import_jsx_runtime238 = require("react/jsx-runtime");
+var import_jsx_runtime251 = require("react/jsx-runtime");
 var CLASS_NAME11 = "Layer__TransactionsToReview";
 function TransactionsToReview({
   onClick,
@@ -22122,17 +23300,17 @@ function TransactionsToReview({
   variants
 }) {
   const { size = "sm" } = variants != null ? variants : {};
-  const { dateRange: contextDateRange } = (0, import_react140.useContext)(ProfitAndLoss.Context);
+  const { dateRange: contextDateRange } = (0, import_react142.useContext)(ProfitAndLoss.Context);
   const dateRange = usePnlDateRange ? contextDateRange : void 0;
-  const [toReview, setToReview] = (0, import_react140.useState)(0);
+  const [toReview, setToReview] = (0, import_react142.useState)(0);
   const { data, loaded, error, refetch } = useProfitAndLossLTM({
     currentDate: dateRange ? dateRange.startDate : (0, import_date_fns45.startOfMonth)(/* @__PURE__ */ new Date()),
     tagFilter
   });
-  (0, import_react140.useEffect)(() => {
+  (0, import_react142.useEffect)(() => {
     checkTransactionsToReview();
   }, []);
-  (0, import_react140.useEffect)(() => {
+  (0, import_react142.useEffect)(() => {
     checkTransactionsToReview();
   }, [dateRange, loaded]);
   const checkTransactionsToReview = () => {
@@ -22154,26 +23332,26 @@ function TransactionsToReview({
       verticalGap = "sm";
       break;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime238.jsxs)("div", { onClick, className: CLASS_NAME11, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime238.jsxs)(VStack, { gap: verticalGap, align: "start", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(ProfitAndLossSummariesHeading, { variants, children: "Transactions to review" }),
-      loaded === "initial" || loaded === "loading" ? /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(BadgeLoader, {}) : null,
-      loaded === "complete" && error ? /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime251.jsxs)("div", { onClick, className: CLASS_NAME11, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime251.jsxs)(VStack, { gap: verticalGap, align: "start", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime251.jsx)(ProfitAndLossSummariesHeading, { variants, children: "Transactions to review" }),
+      loaded === "initial" || loaded === "loading" ? /* @__PURE__ */ (0, import_jsx_runtime251.jsx)(BadgeLoader, {}) : null,
+      loaded === "complete" && error ? /* @__PURE__ */ (0, import_jsx_runtime251.jsx)(
         Badge,
         {
           variant: "error" /* ERROR */,
           size: "small" /* SMALL */,
-          icon: /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(RefreshCcw_default, { size: 12 }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime251.jsx)(RefreshCcw_default, { size: 12 }),
           onClick: () => refetch(),
           children: "Refresh"
         }
       ) : null,
-      loaded === "complete" && !error && toReview > 0 ? /* @__PURE__ */ (0, import_jsx_runtime238.jsxs)(
+      loaded === "complete" && !error && toReview > 0 ? /* @__PURE__ */ (0, import_jsx_runtime251.jsxs)(
         Badge,
         {
           variant: "warning" /* WARNING */,
           size: "small" /* SMALL */,
-          icon: /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(Bell_default, { size: 12 }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime251.jsx)(Bell_default, { size: 12 }),
           children: [
             toReview,
             " ",
@@ -22181,23 +23359,23 @@ function TransactionsToReview({
           ]
         }
       ) : null,
-      loaded === "complete" && !error && toReview === 0 ? /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(
+      loaded === "complete" && !error && toReview === 0 ? /* @__PURE__ */ (0, import_jsx_runtime251.jsx)(
         Badge,
         {
           variant: "success" /* SUCCESS */,
           size: "small" /* SMALL */,
-          icon: /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(Check_default, { size: 12 }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime251.jsx)(Check_default, { size: 12 }),
           children: "All done"
         }
       ) : null
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(IconButton, { icon: /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(ChevronRight_default, {}), withBorder: true, onClick })
+    /* @__PURE__ */ (0, import_jsx_runtime251.jsx)(IconButton, { icon: /* @__PURE__ */ (0, import_jsx_runtime251.jsx)(ChevronRight_default, {}), withBorder: true, onClick })
   ] });
 }
 
 // src/views/AccountingOverview/AccountingOverview.tsx
-var import_classnames76 = __toESM(require("classnames"));
-var import_jsx_runtime239 = require("react/jsx-runtime");
+var import_classnames77 = __toESM(require("classnames"));
+var import_jsx_runtime252 = require("react/jsx-runtime");
 var AccountingOverview = ({
   title = "Accounting overview",
   showTitle = true,
@@ -22212,35 +23390,35 @@ var AccountingOverview = ({
   slotProps
 }) => {
   var _a, _b, _c, _d, _e;
-  const [pnlToggle, setPnlToggle] = (0, import_react141.useState)("expenses");
+  const [pnlToggle, setPnlToggle] = (0, import_react143.useState)("expenses");
   const profitAndLossSummariesVariants = (_b = (_a = slotProps == null ? void 0 : slotProps.profitAndLoss) == null ? void 0 : _a.summaries) == null ? void 0 : _b.variants;
-  return /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(
     ProfitAndLoss,
     {
       asContainer: false,
       tagFilter: tagFilter ? { key: tagFilter.tagKey, values: tagFilter.tagValues } : void 0,
-      children: /* @__PURE__ */ (0, import_jsx_runtime239.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime252.jsxs)(
         View,
         {
           title,
           showHeader: showTitle,
-          header: /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(Header2, { children: /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(HeaderRow, { children: /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(HeaderCol, { children: /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(ProfitAndLoss.DatePicker, {}) }) }) }),
+          header: /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(Header2, { children: /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(HeaderRow, { children: /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(HeaderCol, { children: /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(ProfitAndLoss.DatePicker, {}) }) }) }),
           children: [
-            enableOnboarding && /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(
+            enableOnboarding && /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(
               Onboarding,
               {
                 onTransactionsToReviewClick,
                 onboardingStepOverride
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(
               Internal_ProfitAndLossSummaries,
               {
                 stringOverrides: (_c = stringOverrides == null ? void 0 : stringOverrides.profitAndLoss) == null ? void 0 : _c.summaries,
                 chartColorsList,
                 slots: {
                   unstable_AdditionalListItems: showTransactionsToReview ? [
-                    /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(
                       TransactionsToReview,
                       {
                         usePnlDateRange: true,
@@ -22254,20 +23432,20 @@ var AccountingOverview = ({
                 variants: profitAndLossSummariesVariants
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime239.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime252.jsxs)(
               Container,
               {
                 name: "accounting-overview-profit-and-loss",
                 asWidget: true,
                 elevated: true,
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(
                     ProfitAndLoss.Header,
                     {
                       text: (stringOverrides == null ? void 0 : stringOverrides.header) || "Profit & Loss"
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(
                     ProfitAndLoss.Chart,
                     {
                       tagFilter: tagFilter ? { key: tagFilter.tagKey, values: tagFilter.tagValues } : void 0
@@ -22276,9 +23454,9 @@ var AccountingOverview = ({
                 ]
               }
             ),
-            middleBanner && /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(Container, { name: "accounting-overview-middle-banner", children: middleBanner }),
-            /* @__PURE__ */ (0, import_jsx_runtime239.jsxs)("div", { className: "Layer__accounting-overview-profit-and-loss-charts", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(
+            middleBanner && /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(Container, { name: "accounting-overview-middle-banner", children: middleBanner }),
+            /* @__PURE__ */ (0, import_jsx_runtime252.jsxs)("div", { className: "Layer__accounting-overview-profit-and-loss-charts", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(
                 Toggle,
                 {
                   name: "pnl-detailed-charts",
@@ -22296,14 +23474,14 @@ var AccountingOverview = ({
                   onChange: (e) => setPnlToggle(e.target.value)
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(
                 Container,
                 {
-                  name: (0, import_classnames76.default)(
+                  name: (0, import_classnames77.default)(
                     "accounting-overview-profit-and-loss-chart",
                     pnlToggle !== "revenue" && "accounting-overview-profit-and-loss-chart--hidden"
                   ),
-                  children: /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(
                     ProfitAndLoss.DetailedCharts,
                     {
                       scope: "revenue",
@@ -22314,14 +23492,14 @@ var AccountingOverview = ({
                   )
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(
                 Container,
                 {
-                  name: (0, import_classnames76.default)(
+                  name: (0, import_classnames77.default)(
                     "accounting-overview-profit-and-loss-chart",
                     pnlToggle !== "expenses" && "accounting-overview-profit-and-loss-chart--hidden"
                   ),
-                  children: /* @__PURE__ */ (0, import_jsx_runtime239.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(
                     ProfitAndLoss.DetailedCharts,
                     {
                       scope: "expenses",
@@ -22341,7 +23519,7 @@ var AccountingOverview = ({
 };
 
 // src/views/BankTransactionsWithLinkedAccounts/BankTransactionsWithLinkedAccounts.tsx
-var import_jsx_runtime240 = require("react/jsx-runtime");
+var import_jsx_runtime253 = require("react/jsx-runtime");
 var BankTransactionsWithLinkedAccounts = ({
   title,
   // deprecated
@@ -22357,13 +23535,13 @@ var BankTransactionsWithLinkedAccounts = ({
   mobileComponent,
   stringOverrides
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime240.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime253.jsxs)(
     View,
     {
       title: (stringOverrides == null ? void 0 : stringOverrides.title) || title || "Bank transactions",
       showHeader: showTitle,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime240.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime253.jsx)(
           LinkedAccounts,
           {
             elevated: elevatedLinkedAccounts,
@@ -22373,7 +23551,7 @@ var BankTransactionsWithLinkedAccounts = ({
             stringOverrides: stringOverrides == null ? void 0 : stringOverrides.linkedAccounts
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime240.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime253.jsx)(
           BankTransactions,
           {
             asWidget: true,
@@ -22391,8 +23569,8 @@ var BankTransactionsWithLinkedAccounts = ({
 };
 
 // src/views/GeneralLedger/GeneralLedger.tsx
-var import_react142 = require("react");
-var import_jsx_runtime241 = require("react/jsx-runtime");
+var import_react144 = require("react");
+var import_jsx_runtime254 = require("react/jsx-runtime");
 var GeneralLedgerView = ({
   title,
   // deprecated
@@ -22400,14 +23578,14 @@ var GeneralLedgerView = ({
   stringOverrides,
   chartOfAccountsOptions
 }) => {
-  const [activeTab, setActiveTab] = (0, import_react142.useState)("chartOfAccounts");
-  return /* @__PURE__ */ (0, import_jsx_runtime241.jsx)(ProfitAndLoss, { asContainer: false, children: /* @__PURE__ */ (0, import_jsx_runtime241.jsxs)(
+  const [activeTab, setActiveTab] = (0, import_react144.useState)("chartOfAccounts");
+  return /* @__PURE__ */ (0, import_jsx_runtime254.jsx)(ProfitAndLoss, { asContainer: false, children: /* @__PURE__ */ (0, import_jsx_runtime254.jsxs)(
     View,
     {
       title: (stringOverrides == null ? void 0 : stringOverrides.title) || title || "General Ledger",
       showHeader: showTitle,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime241.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime254.jsx)(
           Toggle,
           {
             name: "general-ledger-tabs",
@@ -22425,7 +23603,7 @@ var GeneralLedgerView = ({
             onChange: (opt) => setActiveTab(opt.target.value)
           }
         ),
-        activeTab === "chartOfAccounts" ? /* @__PURE__ */ (0, import_jsx_runtime241.jsx)(
+        activeTab === "chartOfAccounts" ? /* @__PURE__ */ (0, import_jsx_runtime254.jsx)(
           ChartOfAccounts,
           {
             asWidget: true,
@@ -22435,16 +23613,16 @@ var GeneralLedgerView = ({
             templateAccountsEditable: chartOfAccountsOptions == null ? void 0 : chartOfAccountsOptions.templateAccountsEditable,
             showReversalEntries: chartOfAccountsOptions == null ? void 0 : chartOfAccountsOptions.showReversalEntries
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime241.jsx)(Journal, { stringOverrides: stringOverrides == null ? void 0 : stringOverrides.journal })
+        ) : /* @__PURE__ */ (0, import_jsx_runtime254.jsx)(Journal, { stringOverrides: stringOverrides == null ? void 0 : stringOverrides.journal })
       ]
     }
   ) });
 };
 
 // src/views/ProjectProfitability/ProjectProfitability.tsx
-var import_react143 = require("react");
+var import_react145 = require("react");
 var import_react_select5 = __toESM(require("react-select"));
-var import_jsx_runtime242 = require("react/jsx-runtime");
+var import_jsx_runtime255 = require("react/jsx-runtime");
 var ProjectProfitabilityView = ({
   valueOptions,
   showTitle,
@@ -22452,9 +23630,9 @@ var ProjectProfitabilityView = ({
   datePickerMode = "monthPicker",
   csvMoneyFormat = "DOLLAR_STRING"
 }) => {
-  const [activeTab, setActiveTab] = (0, import_react143.useState)("overview");
-  const [tagFilter, setTagFilter] = (0, import_react143.useState)(null);
-  const [pnlTagFilter, setPnlTagFilter] = (0, import_react143.useState)(
+  const [activeTab, setActiveTab] = (0, import_react145.useState)("overview");
+  const [tagFilter, setTagFilter] = (0, import_react145.useState)(null);
+  const [pnlTagFilter, setPnlTagFilter] = (0, import_react145.useState)(
     void 0
   );
   const isOptionSelected = (option, selectValue) => {
@@ -22468,15 +23646,15 @@ var ProjectProfitabilityView = ({
       values: tagFilter2.tagValues
     } : void 0;
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime242.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime255.jsxs)(
     View,
     {
       title: (stringOverrides == null ? void 0 : stringOverrides.title) || "",
       showHeader: showTitle,
       viewClassName: "Layer__project-view",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime242.jsxs)("div", { className: "Layer__component Layer__header__actions", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime242.jsx)("div", { className: "Layer__component", children: /* @__PURE__ */ (0, import_jsx_runtime242.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime255.jsxs)("div", { className: "Layer__component Layer__header__actions", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime255.jsx)("div", { className: "Layer__component", children: /* @__PURE__ */ (0, import_jsx_runtime255.jsx)(
             Toggle,
             {
               name: "project-tabs",
@@ -22498,7 +23676,7 @@ var ProjectProfitabilityView = ({
               onChange: (opt) => setActiveTab(opt.target.value)
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime242.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime255.jsx)(
             import_react_select5.default,
             {
               className: "Layer__category-menu Layer__select",
@@ -22517,8 +23695,8 @@ var ProjectProfitabilityView = ({
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime242.jsx)(Container, { name: "project", children: /* @__PURE__ */ (0, import_jsx_runtime242.jsxs)(import_jsx_runtime242.Fragment, { children: [
-          activeTab === "overview" && /* @__PURE__ */ (0, import_jsx_runtime242.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime255.jsx)(Container, { name: "project", children: /* @__PURE__ */ (0, import_jsx_runtime255.jsxs)(import_jsx_runtime255.Fragment, { children: [
+          activeTab === "overview" && /* @__PURE__ */ (0, import_jsx_runtime255.jsx)(
             AccountingOverview,
             {
               stringOverrides: { header: "Project Overview" },
@@ -22529,7 +23707,7 @@ var ProjectProfitabilityView = ({
               showTitle: false
             }
           ),
-          activeTab === "transactions" && /* @__PURE__ */ (0, import_jsx_runtime242.jsx)(
+          activeTab === "transactions" && /* @__PURE__ */ (0, import_jsx_runtime255.jsx)(
             BankTransactions,
             {
               hideHeader: true,
@@ -22539,7 +23717,7 @@ var ProjectProfitabilityView = ({
               }
             }
           ),
-          activeTab === "report" && /* @__PURE__ */ (0, import_jsx_runtime242.jsx)(ProfitAndLoss, { asContainer: false, tagFilter: pnlTagFilter, children: /* @__PURE__ */ (0, import_jsx_runtime242.jsx)(
+          activeTab === "report" && /* @__PURE__ */ (0, import_jsx_runtime255.jsx)(ProfitAndLoss, { asContainer: false, tagFilter: pnlTagFilter, children: /* @__PURE__ */ (0, import_jsx_runtime255.jsx)(
             ProfitAndLoss.Report,
             {
               stringOverrides,
@@ -22554,8 +23732,8 @@ var ProjectProfitabilityView = ({
 };
 
 // src/views/Reports/Reports.tsx
-var import_react144 = require("react");
-var import_jsx_runtime243 = require("react/jsx-runtime");
+var import_react146 = require("react");
+var import_jsx_runtime256 = require("react/jsx-runtime");
 var getOptions = (enabledReports) => {
   return [
     enabledReports.includes("profitAndLoss") ? {
@@ -22582,17 +23760,17 @@ var Reports = ({
   statementOfCashFlowConfig
 }) => {
   var _a;
-  const [activeTab, setActiveTab] = (0, import_react144.useState)(enabledReports[0]);
+  const [activeTab, setActiveTab] = (0, import_react146.useState)(enabledReports[0]);
   const { view, containerRef } = useElementViewSize();
   const options = getOptions(enabledReports);
-  const defaultTitle = enabledReports.length > 1 ? "Reports" : (_a = options.find((option) => option.value = enabledReports[0])) == null ? void 0 : _a.label;
-  return /* @__PURE__ */ (0, import_jsx_runtime243.jsxs)(
+  const defaultTitle4 = enabledReports.length > 1 ? "Reports" : (_a = options.find((option) => option.value = enabledReports[0])) == null ? void 0 : _a.label;
+  return /* @__PURE__ */ (0, import_jsx_runtime256.jsxs)(
     View,
     {
-      title: (stringOverrides == null ? void 0 : stringOverrides.title) || title || defaultTitle,
+      title: (stringOverrides == null ? void 0 : stringOverrides.title) || title || defaultTitle4,
       showHeader: showTitle,
       children: [
-        enabledReports.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime243.jsx)("div", { className: "Layer__component Layer__header__actions", children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+        enabledReports.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime256.jsx)("div", { className: "Layer__component Layer__header__actions", children: /* @__PURE__ */ (0, import_jsx_runtime256.jsx)(
           Toggle,
           {
             name: "reports-tabs",
@@ -22601,7 +23779,7 @@ var Reports = ({
             onChange: (opt) => setActiveTab(opt.target.value)
           }
         ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(Container, { name: "reports", ref: containerRef, children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(ProfitAndLoss, { asContainer: false, comparisonConfig, children: /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime256.jsx)(Container, { name: "reports", ref: containerRef, children: /* @__PURE__ */ (0, import_jsx_runtime256.jsx)(ProfitAndLoss, { asContainer: false, comparisonConfig, children: /* @__PURE__ */ (0, import_jsx_runtime256.jsx)(
           ReportsPanel,
           {
             containerRef,
@@ -22624,8 +23802,8 @@ var ReportsPanel = ({
   statementOfCashFlowConfig,
   view
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime243.jsxs)(import_jsx_runtime243.Fragment, { children: [
-    openReport === "profitAndLoss" && /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime256.jsxs)(import_jsx_runtime256.Fragment, { children: [
+    openReport === "profitAndLoss" && /* @__PURE__ */ (0, import_jsx_runtime256.jsx)(
       ProfitAndLoss.Report,
       __spreadValues({
         stringOverrides,
@@ -22633,8 +23811,8 @@ var ReportsPanel = ({
         view
       }, profitAndLossConfig)
     ),
-    openReport === "balanceSheet" && /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(BalanceSheet, { stringOverrides: stringOverrides == null ? void 0 : stringOverrides.balanceSheet }),
-    openReport === "statementOfCashFlow" && /* @__PURE__ */ (0, import_jsx_runtime243.jsx)(
+    openReport === "balanceSheet" && /* @__PURE__ */ (0, import_jsx_runtime256.jsx)(BalanceSheet, { stringOverrides: stringOverrides == null ? void 0 : stringOverrides.balanceSheet }),
+    openReport === "statementOfCashFlow" && /* @__PURE__ */ (0, import_jsx_runtime256.jsx)(
       StatementOfCashFlow,
       __spreadValues({
         stringOverrides: stringOverrides == null ? void 0 : stringOverrides.statementOfCashflow
@@ -22644,12 +23822,12 @@ var ReportsPanel = ({
 };
 
 // src/components/ProfitAndLossView/ProfitAndLossView.tsx
-var import_react145 = require("react");
-var import_jsx_runtime244 = require("react/jsx-runtime");
+var import_react147 = require("react");
+var import_jsx_runtime257 = require("react/jsx-runtime");
 var COMPONENT_NAME7 = "profit-and-loss";
 var ProfitAndLossView = (props) => {
-  const containerRef = (0, import_react145.useRef)(null);
-  return /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(Container, { name: COMPONENT_NAME7, ref: containerRef, children: /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(ProfitAndLoss, { children: /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(ProfitAndLossPanel, __spreadValues({ containerRef }, props)) }) });
+  const containerRef = (0, import_react147.useRef)(null);
+  return /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(Container, { name: COMPONENT_NAME7, ref: containerRef, children: /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(ProfitAndLoss, { children: /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(ProfitAndLossPanel, __spreadValues({ containerRef }, props)) }) });
 };
 var ProfitAndLossPanel = (_a) => {
   var _b = _a, {
@@ -22659,11 +23837,11 @@ var ProfitAndLossPanel = (_a) => {
     "containerRef",
     "stringOverrides"
   ]);
-  const { sidebarScope } = (0, import_react145.useContext)(ProfitAndLoss.Context);
-  return /* @__PURE__ */ (0, import_jsx_runtime244.jsxs)(
+  const { sidebarScope } = (0, import_react147.useContext)(ProfitAndLoss.Context);
+  return /* @__PURE__ */ (0, import_jsx_runtime257.jsxs)(
     Panel,
     {
-      sidebar: /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(
+      sidebar: /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(
         ProfitAndLossDetailedCharts,
         {
           stringOverrides: stringOverrides == null ? void 0 : stringOverrides.profitAndLossDetailedCharts
@@ -22672,7 +23850,7 @@ var ProfitAndLossPanel = (_a) => {
       sidebarIsOpen: Boolean(sidebarScope),
       parentRef: containerRef,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(
           ProfitAndLoss.Header,
           {
             text: (stringOverrides == null ? void 0 : stringOverrides.header) || "Profit & Loss",
@@ -22680,7 +23858,7 @@ var ProfitAndLossPanel = (_a) => {
             headingClassName: "Layer__profit-and-loss__title"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(Components, __spreadValues({ stringOverrides }, props))
+        /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(Components, __spreadValues({ stringOverrides }, props))
       ]
     }
   );
@@ -22690,11 +23868,11 @@ var Components = ({
   hideTable = false,
   stringOverrides
 }) => {
-  const { error, isLoading, isValidating, refetch } = (0, import_react145.useContext)(
+  const { error, isLoading, isValidating, refetch } = (0, import_react147.useContext)(
     ProfitAndLoss.Context
   );
   if (!isLoading && error) {
-    return /* @__PURE__ */ (0, import_jsx_runtime244.jsx)("div", { className: "Layer__table-state-container", children: /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime257.jsx)("div", { className: "Layer__table-state-container", children: /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(
       DataState,
       {
         status: "failed" /* failed */,
@@ -22705,15 +23883,15 @@ var Components = ({
       }
     ) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime244.jsxs)(import_jsx_runtime244.Fragment, { children: [
-    !hideChart && /* @__PURE__ */ (0, import_jsx_runtime244.jsxs)("div", { className: `Layer__${COMPONENT_NAME7}__chart_with_summaries`, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime244.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime257.jsxs)(import_jsx_runtime257.Fragment, { children: [
+    !hideChart && /* @__PURE__ */ (0, import_jsx_runtime257.jsxs)("div", { className: `Layer__${COMPONENT_NAME7}__chart_with_summaries`, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime257.jsxs)(
         "div",
         {
           className: `Layer__${COMPONENT_NAME7}__chart_with_summaries__summary-col`,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(ProfitAndLoss.DatePicker, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(ProfitAndLoss.DatePicker, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(
               ProfitAndLoss.Summaries,
               {
                 actionable: true,
@@ -22723,15 +23901,15 @@ var Components = ({
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(
         "div",
         {
           className: `Layer__${COMPONENT_NAME7}__chart_with_summaries__chart-col`,
-          children: /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(ProfitAndLoss.Chart, {})
+          children: /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(ProfitAndLoss.Chart, {})
         }
       )
     ] }),
-    !hideTable && /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(
+    !hideTable && /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(
       ProfitAndLoss.Table,
       {
         stringOverrides: stringOverrides == null ? void 0 : stringOverrides.profitAndLossTable
@@ -22757,6 +23935,7 @@ var Components = ({
   LinkAccounts,
   LinkedAccounts,
   Onboarding,
+  PlatformOnboarding,
   ProfitAndLoss,
   ProfitAndLossView,
   ProjectProfitabilityView,