@layerfi/components 0.1.29 → 0.1.31

package/dist/esm/index.js

@@ -203,6 +203,15 @@ var request = (verb) => (url) => (baseUrl, accessToken, options) => fetch(`${bas
 var post = request("post");
 var put = request("put");
 var deleteRequest = request("delete");
+var postWithFormData = (url, formData, baseUrl, accessToken) => {
+  return fetch(`${baseUrl}${url}`, {
+    method: "POST",
+    headers: {
+      Authorization: "Bearer " + (accessToken || "")
+    },
+    body: formData
+  }).then((res) => handleResponse(res)).catch((error) => handleException(error));
+};
 var handleResponse = async (res) => {
   if (!res.ok) {
     const errors = await tryToReadErrorsFromResponse(res);
@@ -262,6 +271,32 @@ var getBankTransactionsCsv = get((params) => {
   const { businessId, startDate, endDate, categorized, category, month, year } = params;
   return `/v1/businesses/${businessId}/reports/transactions/exports/csv?${startDate ? `start_date=${encodeURIComponent(startDate)}&` : ""}${endDate ? `end_date=${encodeURIComponent(endDate)}&` : ""}${month ? `month=${encodeURIComponent(month)}&` : ""}${year ? `year=${encodeURIComponent(year)}&` : ""}${categorized ? `categorized=${categorized}&` : ""}${category ? `category=${encodeURIComponent(category)}&` : ""}`;
 });
+var getBankTransactionMetadata = get(
+  ({ businessId, bankTransactionId }) => `/v1/businesses/${businessId}/bank-transactions/${bankTransactionId}/metadata`
+);
+var updateBankTransactionMetadata = put(
+  ({ businessId, bankTransactionId }) => `/v1/businesses/${businessId}/bank-transactions/${bankTransactionId}/metadata`
+);
+var listBankTransactionDocuments = get(
+  ({ businessId, bankTransactionId }) => `/v1/businesses/${businessId}/bank-transactions/${bankTransactionId}/documents`
+);
+var uploadBankTransactionDocument = (baseUrl, accessToken) => ({
+  businessId,
+  bankTransactionId,
+  file,
+  documentType
+}) => {
+  const formData = new FormData();
+  formData.append("file", file);
+  formData.append("documentType", documentType);
+  const endpoint = `/v1/businesses/${businessId}/bank-transactions/${bankTransactionId}/documents`;
+  return postWithFormData(
+    endpoint,
+    formData,
+    baseUrl,
+    accessToken
+  );
+};
 
 // src/api/layer/business.ts
 var getBusiness = get(({ businessId }) => `/v1/businesses/${businessId}`);
@@ -376,6 +411,10 @@ var Layer = {
   getBalanceSheet,
   getBankTransactions,
   getBankTransactionsCsv,
+  getBankTransactionMetadata,
+  listBankTransactionDocuments,
+  updateBankTransactionMetadata,
+  uploadBankTransactionDocument,
   getCategories,
   getChartOfAccounts,
   getLedgerAccountBalances,
@@ -632,7 +671,7 @@ var Direction = /* @__PURE__ */ ((Direction3) => {
 
 // src/types/categories.ts
 function hasSuggestions(categorization) {
-  return categorization.suggestions !== void 0;
+  return categorization.suggestions !== void 0 && categorization.suggestions.length > 0;
 }
 
 // src/components/BankTransactions/constants.ts
@@ -1395,7 +1434,7 @@ var LayerProvider = ({
 };
 
 // src/components/BalanceSheet/BalanceSheet.tsx
-import React13, { useState as useState5 } from "react";
+import React12, { useState as useState5 } from "react";
 
 // src/hooks/useBalanceSheet/useBalanceSheet.tsx
 import { format, startOfDay } from "date-fns";
@@ -1412,54 +1451,12 @@ var useBalanceSheet = (date = /* @__PURE__ */ new Date()) => {
   return { data, isLoading, error };
 };
 
-// src/icons/DownloadCloud.tsx
-import * as React7 from "react";
-var DownloadCloud = ({ size = 18, ...props }) => /* @__PURE__ */ React7.createElement(
-  "svg",
-  {
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 18 18",
-    fill: "none",
-    ...props,
-    width: size,
-    height: size
-  },
-  /* @__PURE__ */ React7.createElement(
-    "path",
-    {
-      d: "M6 12.75L9 15.75L12 12.75",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }
-  ),
-  /* @__PURE__ */ React7.createElement(
-    "path",
-    {
-      d: "M9 9V15.75",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }
-  ),
-  /* @__PURE__ */ React7.createElement(
-    "path",
-    {
-      d: "M15.66 13.5675C16.3121 13.109 16.801 12.4546 17.056 11.6994C17.3109 10.9441 17.3186 10.1273 17.0778 9.36737C16.837 8.60748 16.3604 7.94407 15.7171 7.47342C15.0737 7.00278 14.2971 6.74938 13.5 6.75H12.555C12.3294 5.87091 11.9074 5.05444 11.3206 4.36206C10.7338 3.66969 9.99762 3.11945 9.16742 2.75277C8.33721 2.38609 7.43464 2.21252 6.52766 2.24514C5.62067 2.27776 4.7329 2.51571 3.93118 2.94107C3.12946 3.36644 2.43468 3.96814 1.89915 4.70087C1.36362 5.43361 1.0013 6.27829 0.839456 7.17132C0.677613 8.06434 0.720468 8.98245 0.964796 9.85652C1.20912 10.7306 1.64856 11.5378 2.25001 12.2175",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }
-  )
-);
-var DownloadCloud_default = DownloadCloud;
-
 // src/components/BalanceSheetDatePicker/BalanceSheetDatePicker.tsx
-import React9, { useRef } from "react";
+import React8, { useRef } from "react";
 
 // src/icons/Calendar.tsx
-import * as React8 from "react";
-var Calendar = (props) => /* @__PURE__ */ React8.createElement(
+import * as React7 from "react";
+var Calendar = (props) => /* @__PURE__ */ React7.createElement(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -1468,7 +1465,7 @@ var Calendar = (props) => /* @__PURE__ */ React8.createElement(
     fill: "none",
     ...props
   },
-  /* @__PURE__ */ React8.createElement(
+  /* @__PURE__ */ React7.createElement(
     "path",
     {
       stroke: "#000",
@@ -1486,7 +1483,7 @@ import { format as format2 } from "date-fns";
 var BalanceSheetDatePicker = ({ value, onChange }) => {
   const inputRef = useRef(null);
   const showPicker = () => inputRef.current && inputRef.current.showPicker();
-  return /* @__PURE__ */ React9.createElement("span", { className: "Layer__balance-sheet-date-picker" }, /* @__PURE__ */ React9.createElement("button", { onClick: showPicker }, /* @__PURE__ */ React9.createElement(Calendar_default, null), format2(value, "LLLL dd, yyyy"), /* @__PURE__ */ React9.createElement(
+  return /* @__PURE__ */ React8.createElement("span", { className: "Layer__balance-sheet-date-picker" }, /* @__PURE__ */ React8.createElement("button", { onClick: showPicker }, /* @__PURE__ */ React8.createElement(Calendar_default, null), format2(value, "LLLL dd, yyyy"), /* @__PURE__ */ React8.createElement(
     "input",
     {
       type: "date",
@@ -1498,11 +1495,11 @@ var BalanceSheetDatePicker = ({ value, onChange }) => {
 };
 
 // src/components/BalanceSheetRow/BalanceSheetRow.tsx
-import React11, { useState as useState4 } from "react";
+import React10, { useState as useState4 } from "react";
 
 // src/icons/ChevronDown.tsx
-import * as React10 from "react";
-var ChevronDown = ({ size = 18, ...props }) => /* @__PURE__ */ React10.createElement(
+import * as React9 from "react";
+var ChevronDown = ({ size = 18, ...props }) => /* @__PURE__ */ React9.createElement(
   "svg",
   {
     viewBox: "0 0 18 18",
@@ -1512,7 +1509,7 @@ var ChevronDown = ({ size = 18, ...props }) => /* @__PURE__ */ React10.createEle
     width: size,
     height: size
   },
-  /* @__PURE__ */ React10.createElement(
+  /* @__PURE__ */ React9.createElement(
     "path",
     {
       d: "M4.5 6.75L9 11.25L13.5 6.75",
@@ -1576,12 +1573,12 @@ var BalanceSheetRow = ({
   );
   displayChildren && expanded && labelClasses.push("Layer__balance-sheet-row__label--expanded");
   displayChildren && expanded && valueClasses.push("Layer__balance-sheet-row__value--expanded");
-  return /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement("div", { className: labelClasses.join(" "), onClick: toggleExpanded }, /* @__PURE__ */ React11.createElement(ChevronDown_default, { size: 16 }), display_name), /* @__PURE__ */ React11.createElement("div", { className: valueClasses.join(" ") }, !!value && amountString), canGoDeeper && hasChildren && /* @__PURE__ */ React11.createElement(
+  return /* @__PURE__ */ React10.createElement(React10.Fragment, null, /* @__PURE__ */ React10.createElement("div", { className: labelClasses.join(" "), onClick: toggleExpanded }, /* @__PURE__ */ React10.createElement(ChevronDown_default, { size: 16 }), display_name), /* @__PURE__ */ React10.createElement("div", { className: valueClasses.join(" ") }, !!value && amountString), canGoDeeper && hasChildren && /* @__PURE__ */ React10.createElement(
     "div",
     {
       className: `Layer__balance-sheet-row__children ${expanded && "Layer__balance-sheet-row__children--expanded"}`
     },
-    /* @__PURE__ */ React11.createElement("div", { className: "Layer__balance-sheet-row__children--content" }, (line_items || []).map((line_item, idx) => /* @__PURE__ */ React11.createElement(
+    /* @__PURE__ */ React10.createElement("div", { className: "Layer__balance-sheet-row__children--content" }, (line_items || []).map((line_item, idx) => /* @__PURE__ */ React10.createElement(
       BalanceSheetRow,
       {
         key: `${line_item.display_name}_${idx}`,
@@ -1589,7 +1586,7 @@ var BalanceSheetRow = ({
         depth: depth + 1,
         maxDepth
       }
-    )), summarize && /* @__PURE__ */ React11.createElement(
+    )), summarize && /* @__PURE__ */ React10.createElement(
       BalanceSheetRow,
       {
         key: display_name,
@@ -1603,7 +1600,7 @@ var BalanceSheetRow = ({
 };
 
 // src/components/SkeletonBalanceSheetRow/SkeletonBalanceSheetRow.tsx
-import React12 from "react";
+import React11 from "react";
 var SkeletonBalanceSheetRow = ({ children }) => {
   const labelClasses = [
     "Layer__balance-sheet-row",
@@ -1615,21 +1612,21 @@ var SkeletonBalanceSheetRow = ({ children }) => {
     "Layer__balance-sheet-row__value",
     "Layer__balance-sheet-row__value--skeleton"
   ];
-  return /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement("div", { className: labelClasses.join(" ") }, children && /* @__PURE__ */ React12.createElement(ChevronDown_default, { size: 16 }), /* @__PURE__ */ React12.createElement(
+  return /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement("div", { className: labelClasses.join(" ") }, children && /* @__PURE__ */ React11.createElement(ChevronDown_default, { size: 16 }), /* @__PURE__ */ React11.createElement(
     "div",
     {
       style: { width: "20rem" },
       className: "Layer__balance-sheet-row__skeleton-text"
     },
     " "
-  )), /* @__PURE__ */ React12.createElement("div", { className: valueClasses.join(" ") }, /* @__PURE__ */ React12.createElement(
+  )), /* @__PURE__ */ React11.createElement("div", { className: valueClasses.join(" ") }, /* @__PURE__ */ React11.createElement(
     "div",
     {
       style: { width: "4rem" },
       className: "Layer__balance-sheet-row__skeleton-text"
     },
     " "
-  )), children && /* @__PURE__ */ React12.createElement("div", { className: "Layer__balance-sheet-row__children Layer__balance-sheet-row__children--expanded Layer__balance-sheet-row__children--skeleton" }, children));
+  )), children && /* @__PURE__ */ React11.createElement("div", { className: "Layer__balance-sheet-row__children Layer__balance-sheet-row__children--expanded Layer__balance-sheet-row__children--skeleton" }, children));
 };
 
 // src/components/BalanceSheet/BalanceSheet.tsx
@@ -1650,20 +1647,20 @@ var BalanceSheet = () => {
     value: void 0
   };
   const dateString = format3(effectiveDate, "LLLL d, yyyy");
-  return /* @__PURE__ */ React13.createElement("div", { className: "Layer__component Layer__balance-sheet" }, /* @__PURE__ */ React13.createElement("div", { className: "Layer__balance-sheet__header" }, /* @__PURE__ */ React13.createElement("h2", { className: "Layer__balance-sheet__title" }, "Balance Sheet", /* @__PURE__ */ React13.createElement("span", { className: "Layer__balance-sheet__date" }, dateString)), /* @__PURE__ */ React13.createElement(
+  return /* @__PURE__ */ React12.createElement("div", { className: "Layer__component Layer__balance-sheet" }, /* @__PURE__ */ React12.createElement("div", { className: "Layer__balance-sheet__header" }, /* @__PURE__ */ React12.createElement("h2", { className: "Layer__balance-sheet__title" }, "Balance Sheet", /* @__PURE__ */ React12.createElement("span", { className: "Layer__balance-sheet__date" }, dateString)), /* @__PURE__ */ React12.createElement(
     BalanceSheetDatePicker,
     {
       value: effectiveDate,
       onChange: (event) => setEffectiveDate(parseISO2(event.target.value))
     }
-  ), /* @__PURE__ */ React13.createElement("button", { className: "Layer__balance-sheet__download-button" }, /* @__PURE__ */ React13.createElement(DownloadCloud_default, null), "Download")), !data || isLoading ? /* @__PURE__ */ React13.createElement("div", { className: "Layer__balance-sheet__table" }, /* @__PURE__ */ React13.createElement(SkeletonBalanceSheetRow, null, /* @__PURE__ */ React13.createElement(SkeletonBalanceSheetRow, null), /* @__PURE__ */ React13.createElement(SkeletonBalanceSheetRow, null, /* @__PURE__ */ React13.createElement(SkeletonBalanceSheetRow, null), /* @__PURE__ */ React13.createElement(SkeletonBalanceSheetRow, null))), /* @__PURE__ */ React13.createElement(SkeletonBalanceSheetRow, null, /* @__PURE__ */ React13.createElement(SkeletonBalanceSheetRow, null))) : /* @__PURE__ */ React13.createElement("div", { className: "Layer__balance-sheet__table" }, /* @__PURE__ */ React13.createElement(
+  )), !data || isLoading ? /* @__PURE__ */ React12.createElement("div", { className: "Layer__balance-sheet__table" }, /* @__PURE__ */ React12.createElement(SkeletonBalanceSheetRow, null, /* @__PURE__ */ React12.createElement(SkeletonBalanceSheetRow, null), /* @__PURE__ */ React12.createElement(SkeletonBalanceSheetRow, null, /* @__PURE__ */ React12.createElement(SkeletonBalanceSheetRow, null), /* @__PURE__ */ React12.createElement(SkeletonBalanceSheetRow, null))), /* @__PURE__ */ React12.createElement(SkeletonBalanceSheetRow, null, /* @__PURE__ */ React12.createElement(SkeletonBalanceSheetRow, null))) : /* @__PURE__ */ React12.createElement("div", { className: "Layer__balance-sheet__table" }, /* @__PURE__ */ React12.createElement(
     BalanceSheetRow,
     {
       key: assets.name,
       lineItem: assets,
       summarize: false
     }
-  ), /* @__PURE__ */ React13.createElement(BalanceSheetRow, { key: lne.name, lineItem: lne, summarize: false })));
+  ), /* @__PURE__ */ React12.createElement(BalanceSheetRow, { key: lne.name, lineItem: lne, summarize: false })));
 };
 
 // src/components/BankTransactions/BankTransactions.tsx
@@ -1710,14 +1707,14 @@ var debounce = (fnc, timeout = 300) => {
 };
 
 // src/components/BankTransactionList/BankTransactionList.tsx
-import React64 from "react";
+import React63 from "react";
 
 // src/components/BankTransactionList/BankTransactionListItem.tsx
-import React63, { useEffect as useEffect10, useRef as useRef10, useState as useState14 } from "react";
+import React62, { useEffect as useEffect10, useRef as useRef10, useState as useState14 } from "react";
 
 // src/icons/ChevronDownFill.tsx
-import * as React14 from "react";
-var ChevronDownFill = ({ size = 18, ...props }) => /* @__PURE__ */ React14.createElement(
+import * as React13 from "react";
+var ChevronDownFill = ({ size = 18, ...props }) => /* @__PURE__ */ React13.createElement(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -1727,8 +1724,8 @@ var ChevronDownFill = ({ size = 18, ...props }) => /* @__PURE__ */ React14.creat
     width: size,
     height: size
   },
-  /* @__PURE__ */ React14.createElement("path", { d: "M4.5 6.75L9 11.25L13.5 6.75", fill: "currentColor" }),
-  /* @__PURE__ */ React14.createElement(
+  /* @__PURE__ */ React13.createElement("path", { d: "M4.5 6.75L9 11.25L13.5 6.75", fill: "currentColor" }),
+  /* @__PURE__ */ React13.createElement(
     "path",
     {
       d: "M4.5 6.75L9 11.25L13.5 6.75H4.5Z",
@@ -1741,7 +1738,7 @@ var ChevronDownFill = ({ size = 18, ...props }) => /* @__PURE__ */ React14.creat
 var ChevronDownFill_default = ChevronDownFill;
 
 // src/utils/bankTransactions.ts
-import { endOfMonth, isWithinInterval, parseISO as parseISO3, startOfMonth } from "date-fns";
+import { isWithinInterval, parseISO as parseISO3 } from "date-fns";
 var hasMatch = (bankTransaction) => {
   return Boolean(
     bankTransaction?.suggested_matches && bankTransaction?.suggested_matches?.length > 0 || bankTransaction?.match
@@ -1759,17 +1756,17 @@ var isAlreadyMatched = (bankTransaction) => {
 };
 var countTransactionsToReview = ({
   transactions,
-  currentMonthOnly
+  dateRange
 }) => {
   if (transactions && transactions.length > 0) {
-    if (currentMonthOnly) {
-      const currentMonth = {
-        start: startOfMonth(/* @__PURE__ */ new Date()),
-        end: endOfMonth(/* @__PURE__ */ new Date())
+    if (dateRange) {
+      const dateRangeInterval = {
+        start: dateRange.startDate,
+        end: dateRange.endDate
       };
       return transactions.filter((tx) => {
         try {
-          return filterVisibility("TO_REVIEW" /* TO_REVIEW */, tx) && isWithinInterval(parseISO3(tx.date), currentMonth);
+          return filterVisibility("TO_REVIEW" /* TO_REVIEW */, tx) && isWithinInterval(parseISO3(tx.date), dateRangeInterval);
         } catch (_err) {
           return false;
         }
@@ -1795,11 +1792,11 @@ var getCategorizePayload = (category) => {
 };
 
 // src/components/BankTransactionRow/BankTransactionRow.tsx
-import React61, { useEffect as useEffect9, useRef as useRef9, useState as useState13 } from "react";
+import React60, { useEffect as useEffect9, useRef as useRef9, useState as useState13 } from "react";
 
 // src/icons/AlertCircle.tsx
-import * as React15 from "react";
-var AlertCircle = ({ size = 18, ...props }) => /* @__PURE__ */ React15.createElement(
+import * as React14 from "react";
+var AlertCircle = ({ size = 18, ...props }) => /* @__PURE__ */ React14.createElement(
   "svg",
   {
     viewBox: "0 0 18 18",
@@ -1809,7 +1806,7 @@ var AlertCircle = ({ size = 18, ...props }) => /* @__PURE__ */ React15.createEle
     width: size,
     height: size
   },
-  /* @__PURE__ */ React15.createElement(
+  /* @__PURE__ */ React14.createElement(
     "path",
     {
       d: "M9 16.5C13.1421 16.5 16.5 13.1421 16.5 9C16.5 4.85786 13.1421 1.5 9 1.5C4.85786 1.5 1.5 4.85786 1.5 9C1.5 13.1421 4.85786 16.5 9 16.5Z",
@@ -1818,7 +1815,7 @@ var AlertCircle = ({ size = 18, ...props }) => /* @__PURE__ */ React15.createEle
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React15.createElement(
+  /* @__PURE__ */ React14.createElement(
     "path",
     {
       d: "M9 6V9",
@@ -1827,7 +1824,7 @@ var AlertCircle = ({ size = 18, ...props }) => /* @__PURE__ */ React15.createEle
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React15.createElement(
+  /* @__PURE__ */ React14.createElement(
     "path",
     {
       d: "M9 12H9.0075",
@@ -1840,8 +1837,8 @@ var AlertCircle = ({ size = 18, ...props }) => /* @__PURE__ */ React15.createEle
 var AlertCircle_default = AlertCircle;
 
 // src/icons/Scissors.tsx
-import * as React16 from "react";
-var Scissors = ({ size = 11, ...props }) => /* @__PURE__ */ React16.createElement(
+import * as React15 from "react";
+var Scissors = ({ size = 11, ...props }) => /* @__PURE__ */ React15.createElement(
   "svg",
   {
     viewBox: "0 0 11 11",
@@ -1851,7 +1848,7 @@ var Scissors = ({ size = 11, ...props }) => /* @__PURE__ */ React16.createElemen
     width: size,
     height: size
   },
-  /* @__PURE__ */ React16.createElement(
+  /* @__PURE__ */ React15.createElement(
     "path",
     {
       d: "M2.75 4.125C3.50939 4.125 4.125 3.50939 4.125 2.75C4.125 1.99061 3.50939 1.375 2.75 1.375C1.99061 1.375 1.375 1.99061 1.375 2.75C1.375 3.50939 1.99061 4.125 2.75 4.125Z",
@@ -1859,7 +1856,7 @@ var Scissors = ({ size = 11, ...props }) => /* @__PURE__ */ React16.createElemen
       strokeLinecap: "round",
       strokeLinejoin: "round"
     },
-    /* @__PURE__ */ React16.createElement(
+    /* @__PURE__ */ React15.createElement(
       "animate",
       {
         attributeName: "d",
@@ -1874,7 +1871,7 @@ var Scissors = ({ size = 11, ...props }) => /* @__PURE__ */ React16.createElemen
       }
     )
   ),
-  /* @__PURE__ */ React16.createElement(
+  /* @__PURE__ */ React15.createElement(
     "path",
     {
       d: "M2.75 9.625C3.50939 9.625 4.125 9.00939 4.125 8.25C4.125 7.49061 3.50939 6.875 2.75 6.875C1.99061 6.875 1.375 7.49061 1.375 8.25C1.375 9.00939 1.99061 9.625 2.75 9.625Z",
@@ -1882,7 +1879,7 @@ var Scissors = ({ size = 11, ...props }) => /* @__PURE__ */ React16.createElemen
       strokeLinecap: "round",
       strokeLinejoin: "round"
     },
-    /* @__PURE__ */ React16.createElement(
+    /* @__PURE__ */ React15.createElement(
       "animate",
       {
         attributeName: "d",
@@ -1897,7 +1894,7 @@ var Scissors = ({ size = 11, ...props }) => /* @__PURE__ */ React16.createElemen
       }
     )
   ),
-  /* @__PURE__ */ React16.createElement(
+  /* @__PURE__ */ React15.createElement(
     "path",
     {
       d: "M9.16668 1.83325L3.72168 7.27825",
@@ -1905,7 +1902,7 @@ var Scissors = ({ size = 11, ...props }) => /* @__PURE__ */ React16.createElemen
       strokeLinecap: "round",
       strokeLinejoin: "round"
     },
-    /* @__PURE__ */ React16.createElement(
+    /* @__PURE__ */ React15.createElement(
       "animate",
       {
         attributeName: "d",
@@ -1920,7 +1917,7 @@ var Scissors = ({ size = 11, ...props }) => /* @__PURE__ */ React16.createElemen
       }
     )
   ),
-  /* @__PURE__ */ React16.createElement(
+  /* @__PURE__ */ React15.createElement(
     "path",
     {
       d: "M6.63232 6.63672L9.16691 9.16672",
@@ -1928,7 +1925,7 @@ var Scissors = ({ size = 11, ...props }) => /* @__PURE__ */ React16.createElemen
       strokeLinecap: "round",
       strokeLinejoin: "round"
     },
-    /* @__PURE__ */ React16.createElement(
+    /* @__PURE__ */ React15.createElement(
       "animate",
       {
         attributeName: "d",
@@ -1943,7 +1940,7 @@ var Scissors = ({ size = 11, ...props }) => /* @__PURE__ */ React16.createElemen
       }
     )
   ),
-  /* @__PURE__ */ React16.createElement(
+  /* @__PURE__ */ React15.createElement(
     "path",
     {
       d: "M3.72168 3.72168L5.50001 5.50001",
@@ -1951,7 +1948,7 @@ var Scissors = ({ size = 11, ...props }) => /* @__PURE__ */ React16.createElemen
       strokeLinecap: "round",
       strokeLinejoin: "round"
     },
-    /* @__PURE__ */ React16.createElement(
+    /* @__PURE__ */ React15.createElement(
       "animate",
       {
         attributeName: "d",
@@ -1970,17 +1967,17 @@ var Scissors = ({ size = 11, ...props }) => /* @__PURE__ */ React16.createElemen
 var Scissors_default = Scissors;
 
 // src/components/Badge/Badge.tsx
-import React19 from "react";
+import React18 from "react";
 
 // src/components/Tooltip/Tooltip.tsx
-import React18, {
+import React17, {
   forwardRef as forwardRef2,
   isValidElement,
   cloneElement
 } from "react";
 
 // src/components/Tooltip/useTooltip.ts
-import React17, { useState as useState6 } from "react";
+import React16, { useState as useState6 } from "react";
 import {
   useFloating,
   autoUpdate,
@@ -1994,9 +1991,9 @@ import {
   useInteractions,
   useTransitionStyles
 } from "@floating-ui/react";
-var TooltipContext = React17.createContext(null);
+var TooltipContext = React16.createContext(null);
 var useTooltipContext = () => {
-  const context = React17.useContext(TooltipContext);
+  const context = React16.useContext(TooltipContext);
   if (context == null) {
     throw new Error("Tooltip components must be wrapped in <Tooltip />");
   }
@@ -2048,7 +2045,7 @@ var useTooltip = ({
     },
     duration: 300
   });
-  return React17.useMemo(
+  return React16.useMemo(
     () => ({
       open,
       setOpen,
@@ -2069,7 +2066,7 @@ var Tooltip = ({
   ...options
 }) => {
   const tooltip = useTooltip(options);
-  return /* @__PURE__ */ React18.createElement(TooltipContext.Provider, { value: tooltip }, children);
+  return /* @__PURE__ */ React17.createElement(TooltipContext.Provider, { value: tooltip }, children);
 };
 var TooltipTrigger = forwardRef2(function TooltipTrigger2({ children, asChild = false, ...props }, propRef) {
   const context = useTooltipContext();
@@ -2086,7 +2083,7 @@ var TooltipTrigger = forwardRef2(function TooltipTrigger2({ children, asChild =
       })
     );
   }
-  return /* @__PURE__ */ React18.createElement(
+  return /* @__PURE__ */ React17.createElement(
     "span",
     {
       ref,
@@ -2102,7 +2099,7 @@ var TooltipContent = forwardRef2(function TooltipContent2({ style, className, ..
   const ref = useMergeRefs([context.refs.setFloating, propRef]);
   if (!context.open || context.disabled)
     return null;
-  return /* @__PURE__ */ React18.createElement(FloatingPortal, null, /* @__PURE__ */ React18.createElement(
+  return /* @__PURE__ */ React17.createElement(FloatingPortal, null, /* @__PURE__ */ React17.createElement(
     "div",
     {
       ref,
@@ -2112,7 +2109,7 @@ var TooltipContent = forwardRef2(function TooltipContent2({ style, className, ..
       },
       ...context.getFloatingProps(props)
     },
-    /* @__PURE__ */ React18.createElement("div", { className: "Layer__tooltip-content ", style: { ...context.styles } }, props.children)
+    /* @__PURE__ */ React17.createElement("div", { className: "Layer__tooltip-content ", style: { ...context.styles } }, props.children)
   ));
 });
 
@@ -2138,16 +2135,16 @@ var Badge = ({
     onClick,
     children
   };
-  let content = /* @__PURE__ */ React19.createElement(React19.Fragment, null, icon && /* @__PURE__ */ React19.createElement("span", { className: "Layer__badge__icon" }, icon), children);
-  content = onClick ? /* @__PURE__ */ React19.createElement("button", { role: "button", ...baseProps }, content) : /* @__PURE__ */ React19.createElement("span", { ...baseProps }, content);
+  let content = /* @__PURE__ */ React18.createElement(React18.Fragment, null, icon && /* @__PURE__ */ React18.createElement("span", { className: "Layer__badge__icon" }, icon), children);
+  content = onClick ? /* @__PURE__ */ React18.createElement("button", { role: "button", ...baseProps }, content) : /* @__PURE__ */ React18.createElement("span", { ...baseProps }, content);
   if (tooltip) {
-    return /* @__PURE__ */ React19.createElement(Tooltip, { offset: 12 }, /* @__PURE__ */ React19.createElement(TooltipTrigger, null, content), /* @__PURE__ */ React19.createElement(TooltipContent, { className: "Layer__tooltip" }, tooltip));
+    return /* @__PURE__ */ React18.createElement(Tooltip, { offset: 12 }, /* @__PURE__ */ React18.createElement(TooltipTrigger, null, content), /* @__PURE__ */ React18.createElement(TooltipContent, { className: "Layer__tooltip" }, tooltip));
   }
   return content;
 };
 
 // src/components/Button/Button.tsx
-import React20, { useRef as useRef3 } from "react";
+import React19, { useRef as useRef3 } from "react";
 import classNames3 from "classnames";
 var Button = ({
   className,
@@ -2186,7 +2183,7 @@ var Button = ({
   const stopAnimation = () => buttonRef.current && [...buttonRef.current.getElementsByClassName("animateOnHover")].forEach(
     (el) => el.endElement()
   );
-  return /* @__PURE__ */ React20.createElement(
+  return /* @__PURE__ */ React19.createElement(
     "button",
     {
       ...props,
@@ -2195,7 +2192,7 @@ var Button = ({
       onMouseLeave: stopAnimation,
       ref: buttonRef
     },
-    /* @__PURE__ */ React20.createElement("span", { className: `Layer__btn-content Layer__justify--${justifyContent}` }, leftIcon && /* @__PURE__ */ React20.createElement(
+    /* @__PURE__ */ React19.createElement("span", { className: `Layer__btn-content Layer__justify--${justifyContent}` }, leftIcon && /* @__PURE__ */ React19.createElement(
       "span",
       {
         className: classNames3(
@@ -2204,7 +2201,7 @@ var Button = ({
         )
       },
       leftIcon
-    ), !iconOnly && /* @__PURE__ */ React20.createElement("span", { className: "Layer__btn-text" }, children), rightIcon && /* @__PURE__ */ React20.createElement(
+    ), !iconOnly && /* @__PURE__ */ React19.createElement("span", { className: "Layer__btn-text" }, children), rightIcon && /* @__PURE__ */ React19.createElement(
       "span",
       {
         className: classNames3(
@@ -2218,7 +2215,7 @@ var Button = ({
 };
 
 // src/components/Button/IconButton.tsx
-import React21 from "react";
+import React20 from "react";
 import classNames4 from "classnames";
 var IconButton = ({
   className,
@@ -2234,15 +2231,15 @@ var IconButton = ({
     withBorder && "Layer__icon-btn--border",
     className
   );
-  return /* @__PURE__ */ React21.createElement("button", { ...props, className: baseClassName }, icon);
+  return /* @__PURE__ */ React20.createElement("button", { ...props, className: baseClassName }, icon);
 };
 
 // src/components/Button/RetryButton.tsx
-import React23 from "react";
+import React22 from "react";
 
 // src/icons/RefreshCcw.tsx
-import * as React22 from "react";
-var RefreshCcw = ({ size = 18, ...props }) => /* @__PURE__ */ React22.createElement(
+import * as React21 from "react";
+var RefreshCcw = ({ size = 18, ...props }) => /* @__PURE__ */ React21.createElement(
   "svg",
   {
     viewBox: "0 0 18 18",
@@ -2252,7 +2249,7 @@ var RefreshCcw = ({ size = 18, ...props }) => /* @__PURE__ */ React22.createElem
     width: size,
     height: size
   },
-  /* @__PURE__ */ React22.createElement(
+  /* @__PURE__ */ React21.createElement(
     "path",
     {
       d: "M0.75 3V7.5H5.25",
@@ -2261,7 +2258,7 @@ var RefreshCcw = ({ size = 18, ...props }) => /* @__PURE__ */ React22.createElem
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React22.createElement(
+  /* @__PURE__ */ React21.createElement(
     "path",
     {
       d: "M17.25 15V10.5H12.75",
@@ -2270,7 +2267,7 @@ var RefreshCcw = ({ size = 18, ...props }) => /* @__PURE__ */ React22.createElem
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React22.createElement(
+  /* @__PURE__ */ React21.createElement(
     "path",
     {
       d: "M15.3675 6.75C14.9871 5.67508 14.3407 4.71405 13.4884 3.95656C12.6361 3.19907 11.6059 2.66982 10.4938 2.41819C9.38167 2.16656 8.22393 2.20075 7.12861 2.51758C6.03328 2.8344 5.03606 3.42353 4.23 4.23L0.75 7.5M17.25 10.5L13.77 13.77C12.9639 14.5765 11.9667 15.1656 10.8714 15.4824C9.77607 15.7992 8.61833 15.8334 7.50621 15.5818C6.3941 15.3302 5.36385 14.8009 4.5116 14.0434C3.65935 13.2859 3.01288 12.3249 2.6325 11.25",
@@ -2297,14 +2294,14 @@ var RetryButton = ({
     processing ? "Layer__btn--processing" : "",
     className
   );
-  return /* @__PURE__ */ React23.createElement(
+  return /* @__PURE__ */ React22.createElement(
     Button,
     {
       ...props,
       className: baseClassName,
       variant: "secondary" /* secondary */,
       disabled: processing || disabled,
-      rightIcon: /* @__PURE__ */ React23.createElement(RefreshCcw_default, { size: 12 }),
+      rightIcon: /* @__PURE__ */ React22.createElement(RefreshCcw_default, { size: 12 }),
       justify: "center"
     },
     children
@@ -2312,11 +2309,11 @@ var RetryButton = ({
 };
 
 // src/components/Button/SubmitButton.tsx
-import React27 from "react";
+import React26 from "react";
 
 // src/icons/CheckCircle.tsx
-import * as React24 from "react";
-var CheckCircle = ({ size = 18, ...props }) => /* @__PURE__ */ React24.createElement(
+import * as React23 from "react";
+var CheckCircle = ({ size = 18, ...props }) => /* @__PURE__ */ React23.createElement(
   "svg",
   {
     viewBox: "0 0 18 18",
@@ -2326,7 +2323,7 @@ var CheckCircle = ({ size = 18, ...props }) => /* @__PURE__ */ React24.createEle
     width: size,
     height: size
   },
-  /* @__PURE__ */ React24.createElement(
+  /* @__PURE__ */ React23.createElement(
     "path",
     {
       d: "M16.5 8.30999V8.99999C16.4991 10.6173 15.9754 12.191 15.007 13.4864C14.0386 14.7817 12.6775 15.7293 11.1265 16.1879C9.57557 16.6465 7.91794 16.5914 6.40085 16.0309C4.88375 15.4704 3.58848 14.4346 2.70821 13.0778C1.82794 11.721 1.40984 10.116 1.51625 8.50223C1.62266 6.88841 2.2479 5.35223 3.2987 4.12279C4.34951 2.89335 5.76958 2.03653 7.34713 1.6801C8.92469 1.32367 10.5752 1.48674 12.0525 2.14499",
@@ -2335,7 +2332,7 @@ var CheckCircle = ({ size = 18, ...props }) => /* @__PURE__ */ React24.createEle
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React24.createElement(
+  /* @__PURE__ */ React23.createElement(
     "path",
     {
       d: "M16.5 3L9 10.5075L6.75 8.2575",
@@ -2348,8 +2345,8 @@ var CheckCircle = ({ size = 18, ...props }) => /* @__PURE__ */ React24.createEle
 var CheckCircle_default = CheckCircle;
 
 // src/icons/Loader.tsx
-import * as React25 from "react";
-var Loader = ({ size = 18, ...props }) => /* @__PURE__ */ React25.createElement(
+import * as React24 from "react";
+var Loader = ({ size = 18, ...props }) => /* @__PURE__ */ React24.createElement(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -2359,7 +2356,7 @@ var Loader = ({ size = 18, ...props }) => /* @__PURE__ */ React25.createElement(
     width: size,
     height: size
   },
-  /* @__PURE__ */ React25.createElement(
+  /* @__PURE__ */ React24.createElement(
     "path",
     {
       d: "M9 1.5V4.5",
@@ -2368,7 +2365,7 @@ var Loader = ({ size = 18, ...props }) => /* @__PURE__ */ React25.createElement(
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React25.createElement(
+  /* @__PURE__ */ React24.createElement(
     "path",
     {
       d: "M9 13.5V16.5",
@@ -2377,7 +2374,7 @@ var Loader = ({ size = 18, ...props }) => /* @__PURE__ */ React25.createElement(
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React25.createElement(
+  /* @__PURE__ */ React24.createElement(
     "path",
     {
       d: "M3.6975 3.6975L5.82 5.82",
@@ -2386,7 +2383,7 @@ var Loader = ({ size = 18, ...props }) => /* @__PURE__ */ React25.createElement(
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React25.createElement(
+  /* @__PURE__ */ React24.createElement(
     "path",
     {
       d: "M12.18 12.18L14.3025 14.3025",
@@ -2395,7 +2392,7 @@ var Loader = ({ size = 18, ...props }) => /* @__PURE__ */ React25.createElement(
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React25.createElement(
+  /* @__PURE__ */ React24.createElement(
     "path",
     {
       d: "M1.5 9H4.5",
@@ -2404,7 +2401,7 @@ var Loader = ({ size = 18, ...props }) => /* @__PURE__ */ React25.createElement(
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React25.createElement(
+  /* @__PURE__ */ React24.createElement(
     "path",
     {
       d: "M13.5 9H16.5",
@@ -2413,7 +2410,7 @@ var Loader = ({ size = 18, ...props }) => /* @__PURE__ */ React25.createElement(
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React25.createElement(
+  /* @__PURE__ */ React24.createElement(
     "path",
     {
       d: "M3.6975 14.3025L5.82 12.18",
@@ -2422,7 +2419,7 @@ var Loader = ({ size = 18, ...props }) => /* @__PURE__ */ React25.createElement(
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React25.createElement(
+  /* @__PURE__ */ React24.createElement(
     "path",
     {
       d: "M12.18 5.82L14.3025 3.6975",
@@ -2435,8 +2432,8 @@ var Loader = ({ size = 18, ...props }) => /* @__PURE__ */ React25.createElement(
 var Loader_default = Loader;
 
 // src/icons/Save.tsx
-import * as React26 from "react";
-var Save = ({ size = 18, ...props }) => /* @__PURE__ */ React26.createElement(
+import * as React25 from "react";
+var Save = ({ size = 18, ...props }) => /* @__PURE__ */ React25.createElement(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -2446,7 +2443,7 @@ var Save = ({ size = 18, ...props }) => /* @__PURE__ */ React26.createElement(
     width: size,
     height: size
   },
-  /* @__PURE__ */ React26.createElement(
+  /* @__PURE__ */ React25.createElement(
     "path",
     {
       d: "M14.25 15.75H3.75C3.35218 15.75 2.97064 15.592 2.68934 15.3107C2.40804 15.0294 2.25 14.6478 2.25 14.25V3.75C2.25 3.35218 2.40804 2.97064 2.68934 2.68934C2.97064 2.40804 3.35218 2.25 3.75 2.25H12L15.75 6V14.25C15.75 14.6478 15.592 15.0294 15.3107 15.3107C15.0294 15.592 14.6478 15.75 14.25 15.75Z",
@@ -2455,7 +2452,7 @@ var Save = ({ size = 18, ...props }) => /* @__PURE__ */ React26.createElement(
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React26.createElement(
+  /* @__PURE__ */ React25.createElement(
     "path",
     {
       d: "M12.75 15.75V9.75H5.25V15.75",
@@ -2464,7 +2461,7 @@ var Save = ({ size = 18, ...props }) => /* @__PURE__ */ React26.createElement(
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React26.createElement(
+  /* @__PURE__ */ React25.createElement(
     "path",
     {
       d: "M5.25 2.25V6H11.25",
@@ -2488,15 +2485,15 @@ var buildRightIcon = ({
     return;
   }
   if (processing) {
-    return /* @__PURE__ */ React27.createElement(Loader_default, { size: 14, className: "Layer__anim--rotating" });
+    return /* @__PURE__ */ React26.createElement(Loader_default, { size: 14, className: "Layer__anim--rotating" });
   }
   if (error) {
-    return /* @__PURE__ */ React27.createElement(Tooltip, { offset: 12 }, /* @__PURE__ */ React27.createElement(TooltipTrigger, null, /* @__PURE__ */ React27.createElement(AlertCircle_default, { size: 14 })), /* @__PURE__ */ React27.createElement(TooltipContent, { className: "Layer__tooltip" }, error));
+    return /* @__PURE__ */ React26.createElement(Tooltip, { offset: 12 }, /* @__PURE__ */ React26.createElement(TooltipTrigger, null, /* @__PURE__ */ React26.createElement(AlertCircle_default, { size: 14 })), /* @__PURE__ */ React26.createElement(TooltipContent, { className: "Layer__tooltip" }, error));
   }
   if (action === "update" /* UPDATE */) {
-    return /* @__PURE__ */ React27.createElement("span", { className: "Layer__pt-2" }, /* @__PURE__ */ React27.createElement(Save_default, { size: 14 }));
+    return /* @__PURE__ */ React26.createElement("span", { className: "Layer__pt-2" }, /* @__PURE__ */ React26.createElement(CheckCircle_default, { size: 14 }));
   }
-  return /* @__PURE__ */ React27.createElement("span", null, /* @__PURE__ */ React27.createElement(CheckCircle_default, { size: 14, style: { paddingTop: 4 } }));
+  return /* @__PURE__ */ React26.createElement("span", null, /* @__PURE__ */ React26.createElement(Save_default, { size: 14, style: { paddingTop: 4 } }));
 };
 var SubmitButton = ({
   active,
@@ -2513,7 +2510,7 @@ var SubmitButton = ({
     active ? "Layer__btn--active" : "",
     className
   );
-  return /* @__PURE__ */ React27.createElement(
+  return /* @__PURE__ */ React26.createElement(
     Button,
     {
       ...props,
@@ -2528,7 +2525,7 @@ var SubmitButton = ({
 };
 
 // src/components/Button/TextButton.tsx
-import React28 from "react";
+import React27 from "react";
 import classNames7 from "classnames";
 var TextButton = ({
   className,
@@ -2536,15 +2533,15 @@ var TextButton = ({
   ...props
 }) => {
   const baseClassName = classNames7("Layer__text-btn", className);
-  return /* @__PURE__ */ React28.createElement("button", { ...props, className: baseClassName }, children);
+  return /* @__PURE__ */ React27.createElement("button", { ...props, className: baseClassName }, children);
 };
 
 // src/components/Button/BackButton.tsx
-import React30 from "react";
+import React29 from "react";
 
 // src/icons/BackArrow.tsx
-import * as React29 from "react";
-var BackArrow = ({ size = 18, ...props }) => /* @__PURE__ */ React29.createElement(
+import * as React28 from "react";
+var BackArrow = ({ size = 18, ...props }) => /* @__PURE__ */ React28.createElement(
   "svg",
   {
     viewBox: "0 0 12 12",
@@ -2554,7 +2551,7 @@ var BackArrow = ({ size = 18, ...props }) => /* @__PURE__ */ React29.createEleme
     width: size,
     height: size
   },
-  /* @__PURE__ */ React29.createElement(
+  /* @__PURE__ */ React28.createElement(
     "path",
     {
       d: "M7.375 8.75L4.625 6L7.375 3.25",
@@ -2575,15 +2572,15 @@ var BackButton = ({
   ...props
 }) => {
   const baseClassName = classNames8("Layer__btn", "Layer__back-btn", className);
-  return /* @__PURE__ */ React30.createElement("button", { ...props, className: baseClassName }, textOnly ? "Back" : /* @__PURE__ */ React30.createElement(BackArrow_default, { size: 16 }));
+  return /* @__PURE__ */ React29.createElement("button", { ...props, className: baseClassName }, textOnly ? "Back" : /* @__PURE__ */ React29.createElement(BackArrow_default, { size: 16 }));
 };
 
 // src/components/Button/CloseButton.tsx
-import React32 from "react";
+import React31 from "react";
 
 // src/icons/CloseIcon.tsx
-import * as React31 from "react";
-var CloseIcon = ({ size = 12, ...props }) => /* @__PURE__ */ React31.createElement(
+import * as React30 from "react";
+var CloseIcon = ({ size = 12, ...props }) => /* @__PURE__ */ React30.createElement(
   "svg",
   {
     viewBox: "0 0 12 12",
@@ -2593,7 +2590,7 @@ var CloseIcon = ({ size = 12, ...props }) => /* @__PURE__ */ React31.createEleme
     width: size,
     height: size
   },
-  /* @__PURE__ */ React31.createElement(
+  /* @__PURE__ */ React30.createElement(
     "path",
     {
       d: "M8.75 3.25L3.25 8.75",
@@ -2602,7 +2599,7 @@ var CloseIcon = ({ size = 12, ...props }) => /* @__PURE__ */ React31.createEleme
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React31.createElement(
+  /* @__PURE__ */ React30.createElement(
     "path",
     {
       d: "M3.25 3.25L8.75 8.75",
@@ -2623,18 +2620,18 @@ var CloseButton = ({
   ...props
 }) => {
   const baseClassName = classNames9("Layer__btn", "Layer__back-btn", className);
-  return /* @__PURE__ */ React32.createElement("button", { ...props, className: baseClassName }, textOnly ? "Back" : /* @__PURE__ */ React32.createElement(CloseIcon_default, { size: 16 }));
+  return /* @__PURE__ */ React31.createElement("button", { ...props, className: baseClassName }, textOnly ? "Back" : /* @__PURE__ */ React31.createElement(CloseIcon_default, { size: 16 }));
 };
 
 // src/components/CategorySelect/CategorySelect.tsx
-import React42 from "react";
+import React41 from "react";
 import Select, {
   components
 } from "react-select";
 
 // src/icons/Check.tsx
-import * as React33 from "react";
-var Check = ({ size = 18, ...props }) => /* @__PURE__ */ React33.createElement(
+import * as React32 from "react";
+var Check = ({ size = 18, ...props }) => /* @__PURE__ */ React32.createElement(
   "svg",
   {
     viewBox: "0 0 18 18",
@@ -2644,7 +2641,7 @@ var Check = ({ size = 18, ...props }) => /* @__PURE__ */ React33.createElement(
     width: size,
     height: size
   },
-  /* @__PURE__ */ React33.createElement(
+  /* @__PURE__ */ React32.createElement(
     "path",
     {
       d: "M15 4.5L6.75 12.75L3 9",
@@ -2657,8 +2654,8 @@ var Check = ({ size = 18, ...props }) => /* @__PURE__ */ React33.createElement(
 var Check_default = Check;
 
 // src/icons/MinimizeTwo.tsx
-import * as React34 from "react";
-var MinimizeTwo = ({ size = 18, ...props }) => /* @__PURE__ */ React34.createElement(
+import * as React33 from "react";
+var MinimizeTwo = ({ size = 18, ...props }) => /* @__PURE__ */ React33.createElement(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -2668,7 +2665,7 @@ var MinimizeTwo = ({ size = 18, ...props }) => /* @__PURE__ */ React34.createEle
     width: size,
     height: size
   },
-  /* @__PURE__ */ React34.createElement(
+  /* @__PURE__ */ React33.createElement(
     "path",
     {
       d: "M3 10.5H7.5V15",
@@ -2677,7 +2674,7 @@ var MinimizeTwo = ({ size = 18, ...props }) => /* @__PURE__ */ React34.createEle
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React34.createElement(
+  /* @__PURE__ */ React33.createElement(
     "path",
     {
       d: "M15 7.5H10.5V3",
@@ -2686,7 +2683,7 @@ var MinimizeTwo = ({ size = 18, ...props }) => /* @__PURE__ */ React34.createEle
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React34.createElement(
+  /* @__PURE__ */ React33.createElement(
     "path",
     {
       d: "M10.5 7.5L15.75 2.25",
@@ -2695,7 +2692,7 @@ var MinimizeTwo = ({ size = 18, ...props }) => /* @__PURE__ */ React34.createEle
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React34.createElement(
+  /* @__PURE__ */ React33.createElement(
     "path",
     {
       d: "M2.25 15.75L7.5 10.5",
@@ -2708,17 +2705,17 @@ var MinimizeTwo = ({ size = 18, ...props }) => /* @__PURE__ */ React34.createEle
 var MinimizeTwo_default = MinimizeTwo;
 
 // src/components/CategorySelect/CategorySelectDrawer.tsx
-import React41, { useContext as useContext5 } from "react";
+import React40, { useContext as useContext5 } from "react";
 
 // src/components/BankTransactionMobileList/BusinessCategories.tsx
-import React40, { useState as useState8 } from "react";
+import React39, { useState as useState8 } from "react";
 
 // src/components/ActionableList/ActionableList.tsx
-import React39 from "react";
+import React38 from "react";
 
 // src/icons/ChevronRight.tsx
-import * as React35 from "react";
-var ChevronRight = ({ size = 18, ...props }) => /* @__PURE__ */ React35.createElement(
+import * as React34 from "react";
+var ChevronRight = ({ size = 18, ...props }) => /* @__PURE__ */ React34.createElement(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -2728,7 +2725,7 @@ var ChevronRight = ({ size = 18, ...props }) => /* @__PURE__ */ React35.createEl
     fill: "none",
     ...props
   },
-  /* @__PURE__ */ React35.createElement(
+  /* @__PURE__ */ React34.createElement(
     "path",
     {
       d: "M6.75 13.5L11.25 9L6.75 4.5",
@@ -2741,7 +2738,7 @@ var ChevronRight = ({ size = 18, ...props }) => /* @__PURE__ */ React35.createEl
 var ChevronRight_default = ChevronRight;
 
 // src/components/Typography/Text.tsx
-import React36, { useRef as useRef6, useState as useState7, useEffect as useEffect4 } from "react";
+import React35, { useRef as useRef6, useState as useState7, useEffect as useEffect4 } from "react";
 import classNames10 from "classnames";
 var Text = ({
   as: Component = "p",
@@ -2757,7 +2754,7 @@ var Text = ({
     className
   );
   if (withTooltip) {
-    return /* @__PURE__ */ React36.createElement(
+    return /* @__PURE__ */ React35.createElement(
       TextWithTooltip,
       {
         as: Component,
@@ -2770,7 +2767,7 @@ var Text = ({
       children
     );
   }
-  return /* @__PURE__ */ React36.createElement(Component, { ...props, className: baseClassName }, children);
+  return /* @__PURE__ */ React35.createElement(Component, { ...props, className: baseClassName }, children);
 };
 var TextWithTooltip = ({
   as: Component = "p",
@@ -2804,20 +2801,20 @@ var TextWithTooltip = ({
     "Layer__tooltip",
     tooltipOptions?.contentClassName
   );
-  return /* @__PURE__ */ React36.createElement(
+  return /* @__PURE__ */ React35.createElement(
     Tooltip,
     {
       disabled: !hoverStatus,
       offset: tooltipOptions?.offset,
       shift: tooltipOptions?.shift
     },
-    /* @__PURE__ */ React36.createElement(TooltipTrigger, null, /* @__PURE__ */ React36.createElement(Component, { className, ref: textElementRef, ...props }, children)),
-    /* @__PURE__ */ React36.createElement(TooltipContent, { className: contentClassName }, children)
+    /* @__PURE__ */ React35.createElement(TooltipTrigger, null, /* @__PURE__ */ React35.createElement(Component, { className, ref: textElementRef, ...props }, children)),
+    /* @__PURE__ */ React35.createElement(TooltipContent, { className: contentClassName }, children)
   );
 };
 
 // src/components/Typography/Heading.tsx
-import React37 from "react";
+import React36 from "react";
 import classNames11 from "classnames";
 var Heading = ({
   as: Component = "h2",
@@ -2829,15 +2826,15 @@ var Heading = ({
     `Layer__heading Layer__heading--${size}`,
     className
   );
-  return /* @__PURE__ */ React37.createElement(Component, { className: baseClassName }, children);
+  return /* @__PURE__ */ React36.createElement(Component, { className: baseClassName }, children);
 };
 
 // src/components/Typography/ErrorText.tsx
-import React38 from "react";
+import React37 from "react";
 import classNames12 from "classnames";
 var ErrorText = ({ className, ...props }) => {
   const baseClassName = classNames12("Layer__text--error", className);
-  return /* @__PURE__ */ React38.createElement(Text, { ...props, className: baseClassName });
+  return /* @__PURE__ */ React37.createElement(Text, { ...props, className: baseClassName });
 };
 
 // src/components/ActionableList/ActionableList.tsx
@@ -2847,7 +2844,7 @@ var ActionableList = ({
   onClick,
   selected
 }) => {
-  return /* @__PURE__ */ React39.createElement("ul", { className: "Layer__actionable-list" }, options.map((x, idx) => /* @__PURE__ */ React39.createElement(
+  return /* @__PURE__ */ React38.createElement("ul", { className: "Layer__actionable-list" }, options.map((x, idx) => /* @__PURE__ */ React38.createElement(
     "li",
     {
       role: "button",
@@ -2858,15 +2855,15 @@ var ActionableList = ({
         x.asLink && "Layer__actionable-list-item--as-link"
       )
     },
-    /* @__PURE__ */ React39.createElement(Text, null, x.label),
-    !x.asLink && selected && selected.id === x.id ? /* @__PURE__ */ React39.createElement(
+    /* @__PURE__ */ React38.createElement(Text, null, x.label),
+    !x.asLink && selected && selected.id === x.id ? /* @__PURE__ */ React38.createElement(
       Check_default,
       {
         size: 16,
         className: "Layer__actionable-list__selected-icon"
       }
     ) : null,
-    x.asLink && /* @__PURE__ */ React39.createElement(
+    x.asLink && /* @__PURE__ */ React38.createElement(
       ChevronRight_default,
       {
         size: 16,
@@ -2943,14 +2940,14 @@ var BusinessCategories = ({ select }) => {
     }
     select(v);
   };
-  return /* @__PURE__ */ React40.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__categories_list-container" }, /* @__PURE__ */ React40.createElement(
+  return /* @__PURE__ */ React39.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__categories_list-container" }, /* @__PURE__ */ React39.createElement(
     Text,
     {
       weight: "bold" /* bold */,
       className: "Layer__bank-transaction-mobile-list-item__categories_list-title"
     },
     selectedGroup ?? "Select category"
-  ), /* @__PURE__ */ React40.createElement(
+  ), /* @__PURE__ */ React39.createElement(
     ActionableList,
     {
       options: optionsToShow,
@@ -2970,7 +2967,7 @@ var CategorySelectDrawer = ({
     close();
     onSelect(value);
   };
-  return /* @__PURE__ */ React41.createElement(
+  return /* @__PURE__ */ React40.createElement(
     "button",
     {
       "aria-label": "Select category",
@@ -2979,11 +2976,11 @@ var CategorySelectDrawer = ({
         selected && "Layer__category-menu__drawer-btn--selected"
       ),
       onClick: () => setContent(
-        /* @__PURE__ */ React41.createElement(CategorySelectDrawerContent, { onSelect: onDrawerCategorySelect })
+        /* @__PURE__ */ React40.createElement(CategorySelectDrawerContent, { onSelect: onDrawerCategorySelect })
       )
     },
     selected?.payload?.display_name ?? "Select...",
-    /* @__PURE__ */ React41.createElement(
+    /* @__PURE__ */ React40.createElement(
       ChevronDown_default,
       {
         size: 16,
@@ -2994,7 +2991,7 @@ var CategorySelectDrawer = ({
 };
 var CategorySelectDrawerContent = ({
   onSelect
-}) => /* @__PURE__ */ React41.createElement(
+}) => /* @__PURE__ */ React40.createElement(
   BusinessCategories,
   {
     select: (option) => {
@@ -3037,10 +3034,10 @@ var mapSuggestedMatchToOption = (record) => {
   };
 };
 var DropdownIndicator = (props) => {
-  return /* @__PURE__ */ React42.createElement(components.DropdownIndicator, { ...props }, /* @__PURE__ */ React42.createElement(ChevronDown_default, null));
+  return /* @__PURE__ */ React41.createElement(components.DropdownIndicator, { ...props }, /* @__PURE__ */ React41.createElement(ChevronDown_default, null));
 };
 var GroupHeading = (props) => {
-  return /* @__PURE__ */ React42.createElement(
+  return /* @__PURE__ */ React41.createElement(
     components.GroupHeading,
     {
       className: classNames15(
@@ -3056,24 +3053,24 @@ var Option2 = (props) => {
     return;
   }
   if (props.data.type === "match") {
-    return /* @__PURE__ */ React42.createElement(
+    return /* @__PURE__ */ React41.createElement(
       components.Option,
       {
         ...props,
         className: `${props.className} Layer__select__option-content__match`
       },
-      /* @__PURE__ */ React42.createElement("div", { className: "Layer__select__option-content__match__main-row" }, /* @__PURE__ */ React42.createElement("span", { className: "Layer__select__option-content__match__date" }, props.data.payload.date && formatTime(parseISO4(props.data.payload.date), DATE_FORMAT)), /* @__PURE__ */ React42.createElement("span", { className: "Layer__select__option-content__match__description" }, props.data.payload.display_name)),
-      /* @__PURE__ */ React42.createElement("div", { className: "Layer__select__option-content__match__amount-row" }, /* @__PURE__ */ React42.createElement("span", { className: "Layer__select__option-content__match__amount" }, "$", centsToDollars(props.data.payload.amount)))
+      /* @__PURE__ */ React41.createElement("div", { className: "Layer__select__option-content__match__main-row" }, /* @__PURE__ */ React41.createElement("span", { className: "Layer__select__option-content__match__date" }, props.data.payload.date && formatTime(parseISO4(props.data.payload.date), DATE_FORMAT)), /* @__PURE__ */ React41.createElement("span", { className: "Layer__select__option-content__match__description" }, props.data.payload.display_name)),
+      /* @__PURE__ */ React41.createElement("div", { className: "Layer__select__option-content__match__amount-row" }, /* @__PURE__ */ React41.createElement("span", { className: "Layer__select__option-content__match__amount" }, "$", centsToDollars(props.data.payload.amount)))
     );
   }
-  return /* @__PURE__ */ React42.createElement(
+  return /* @__PURE__ */ React41.createElement(
     components.Option,
     {
       ...props,
       className: `Layer__select__option-menu-content ${props.className}`
     },
-    /* @__PURE__ */ React42.createElement("div", null, props.data.payload.display_name),
-    props.isSelected ? /* @__PURE__ */ React42.createElement("span", { className: "Layer__select__option-menu-content-check" }, /* @__PURE__ */ React42.createElement(Check_default, { size: 16 })) : null
+    /* @__PURE__ */ React41.createElement("div", null, props.data.payload.display_name),
+    props.isSelected ? /* @__PURE__ */ React41.createElement("span", { className: "Layer__select__option-menu-content-check" }, /* @__PURE__ */ React41.createElement(Check_default, { size: 16 })) : null
   );
 };
 var allCategoriesDivider = [
@@ -3159,9 +3156,9 @@ var CategorySelect = ({
   const selected = value ? value : !excludeMatches && matchOptions?.length === 1 && matchOptions[0].options.length === 1 ? matchOptions[0].options[0] : void 0;
   const placeholder = matchOptions?.length === 1 && matchOptions[0].options.length > 1 ? `${matchOptions[0].options.length} possible matches...` : "Categorize or match...";
   if (asDrawer) {
-    return /* @__PURE__ */ React42.createElement(CategorySelectDrawer, { onSelect: onChange, selected: value });
+    return /* @__PURE__ */ React41.createElement(CategorySelectDrawer, { onSelect: onChange, selected: value });
   }
-  return /* @__PURE__ */ React42.createElement(
+  return /* @__PURE__ */ React41.createElement(
     Select,
     {
       name,
@@ -3174,7 +3171,7 @@ var CategorySelect = ({
       isSearchable: true,
       placeholder,
       defaultValue: selected,
-      formatOptionLabel: (props) => /* @__PURE__ */ React42.createElement("div", { className: "Layer__select__option-label" }, props.type === "match" && /* @__PURE__ */ React42.createElement(Badge, { size: "small" /* SMALL */, icon: /* @__PURE__ */ React42.createElement(MinimizeTwo_default, { size: 11 }) }, "Match"), /* @__PURE__ */ React42.createElement("span", null, props.payload.display_name)),
+      formatOptionLabel: (props) => /* @__PURE__ */ React41.createElement("div", { className: "Layer__select__option-label" }, props.type === "match" && /* @__PURE__ */ React41.createElement(Badge, { size: "small" /* SMALL */, icon: /* @__PURE__ */ React41.createElement(MinimizeTwo_default, { size: 11 }) }, "Match"), /* @__PURE__ */ React41.createElement("span", null, props.payload.display_name)),
       value,
       onChange: (newValue) => newValue && onChange(newValue),
       getOptionLabel: (category) => category.payload.display_name,
@@ -3191,7 +3188,7 @@ var CategorySelect = ({
 };
 
 // src/components/ExpandedBankTransactionRow/ExpandedBankTransactionRow.tsx
-import React59, {
+import React58, {
   forwardRef as forwardRef3,
   useImperativeHandle,
   useState as useState12,
@@ -3201,8 +3198,8 @@ import React59, {
 } from "react";
 
 // src/icons/ScissorsFullOpen.tsx
-import * as React43 from "react";
-var ScissorsFullOpen = ({ size = 12, ...props }) => /* @__PURE__ */ React43.createElement(
+import * as React42 from "react";
+var ScissorsFullOpen = ({ size = 12, ...props }) => /* @__PURE__ */ React42.createElement(
   "svg",
   {
     viewBox: "0 0 12 12",
@@ -3212,7 +3209,7 @@ var ScissorsFullOpen = ({ size = 12, ...props }) => /* @__PURE__ */ React43.crea
     width: size,
     height: size
   },
-  /* @__PURE__ */ React43.createElement("g", { id: "scissors" }, /* @__PURE__ */ React43.createElement(
+  /* @__PURE__ */ React42.createElement("g", { id: "scissors" }, /* @__PURE__ */ React42.createElement(
     "path",
     {
       id: "Vector",
@@ -3221,7 +3218,7 @@ var ScissorsFullOpen = ({ size = 12, ...props }) => /* @__PURE__ */ React43.crea
       strokeLinecap: "round",
       strokeLinejoin: "round"
     }
-  ), /* @__PURE__ */ React43.createElement(
+  ), /* @__PURE__ */ React42.createElement(
     "path",
     {
       id: "Vector_2",
@@ -3230,7 +3227,7 @@ var ScissorsFullOpen = ({ size = 12, ...props }) => /* @__PURE__ */ React43.crea
       strokeLinecap: "round",
       strokeLinejoin: "round"
     }
-  ), /* @__PURE__ */ React43.createElement(
+  ), /* @__PURE__ */ React42.createElement(
     "path",
     {
       id: "Vector_3",
@@ -3239,7 +3236,7 @@ var ScissorsFullOpen = ({ size = 12, ...props }) => /* @__PURE__ */ React43.crea
       strokeLinecap: "round",
       strokeLinejoin: "round"
     }
-  ), /* @__PURE__ */ React43.createElement(
+  ), /* @__PURE__ */ React42.createElement(
     "path",
     {
       id: "Vector_4",
@@ -3248,7 +3245,7 @@ var ScissorsFullOpen = ({ size = 12, ...props }) => /* @__PURE__ */ React43.crea
       strokeLinecap: "round",
       strokeLinejoin: "round"
     }
-  ), /* @__PURE__ */ React43.createElement(
+  ), /* @__PURE__ */ React42.createElement(
     "path",
     {
       id: "Vector_5",
@@ -3262,8 +3259,8 @@ var ScissorsFullOpen = ({ size = 12, ...props }) => /* @__PURE__ */ React43.crea
 var ScissorsFullOpen_default = ScissorsFullOpen;
 
 // src/icons/Trash.tsx
-import * as React44 from "react";
-var Trash = ({ size = 18, ...props }) => /* @__PURE__ */ React44.createElement(
+import * as React43 from "react";
+var Trash = ({ size = 18, ...props }) => /* @__PURE__ */ React43.createElement(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -3273,7 +3270,7 @@ var Trash = ({ size = 18, ...props }) => /* @__PURE__ */ React44.createElement(
     width: size,
     height: size
   },
-  /* @__PURE__ */ React44.createElement(
+  /* @__PURE__ */ React43.createElement(
     "path",
     {
       d: "M2.25 4.5H3.75H15.75",
@@ -3282,7 +3279,7 @@ var Trash = ({ size = 18, ...props }) => /* @__PURE__ */ React44.createElement(
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React44.createElement(
+  /* @__PURE__ */ React43.createElement(
     "path",
     {
       d: "M14.25 4.5V15C14.25 15.3978 14.092 15.7794 13.8107 16.0607C13.5294 16.342 13.1478 16.5 12.75 16.5H5.25C4.85218 16.5 4.47064 16.342 4.18934 16.0607C3.90804 15.7794 3.75 15.3978 3.75 15V4.5M6 4.5V3C6 2.60218 6.15804 2.22064 6.43934 1.93934C6.72064 1.65804 7.10218 1.5 7.5 1.5H10.5C10.8978 1.5 11.2794 1.65804 11.5607 1.93934C11.842 2.22064 12 2.60218 12 3V4.5",
@@ -3291,7 +3288,7 @@ var Trash = ({ size = 18, ...props }) => /* @__PURE__ */ React44.createElement(
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React44.createElement(
+  /* @__PURE__ */ React43.createElement(
     "path",
     {
       d: "M7.5 8.25V12.75",
@@ -3300,7 +3297,7 @@ var Trash = ({ size = 18, ...props }) => /* @__PURE__ */ React44.createElement(
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React44.createElement(
+  /* @__PURE__ */ React43.createElement(
     "path",
     {
       d: "M10.5 8.25V12.75",
@@ -3313,7 +3310,7 @@ var Trash = ({ size = 18, ...props }) => /* @__PURE__ */ React44.createElement(
 var Trash_default = Trash;
 
 // src/components/Input/Input.tsx
-import React45 from "react";
+import React44 from "react";
 import classNames16 from "classnames";
 var Input = ({
   className,
@@ -3328,11 +3325,11 @@ var Input = ({
     leftText ? "Layer__input--with-left-text" : "",
     className
   );
-  return /* @__PURE__ */ React45.createElement(Tooltip, { disabled: !isInvalid || !errorMessage }, /* @__PURE__ */ React45.createElement(TooltipTrigger, { className: "Layer__input-tooltip" }, /* @__PURE__ */ React45.createElement("input", { ...props, className: baseClassName }), leftText && /* @__PURE__ */ React45.createElement("span", { className: "Layer__input-left-text" }, leftText)), /* @__PURE__ */ React45.createElement(TooltipContent, { className: "Layer__tooltip" }, errorMessage));
+  return /* @__PURE__ */ React44.createElement(Tooltip, { disabled: !isInvalid || !errorMessage }, /* @__PURE__ */ React44.createElement(TooltipTrigger, { className: "Layer__input-tooltip" }, /* @__PURE__ */ React44.createElement("input", { ...props, className: baseClassName }), leftText && /* @__PURE__ */ React44.createElement("span", { className: "Layer__input-left-text" }, leftText)), /* @__PURE__ */ React44.createElement(TooltipContent, { className: "Layer__tooltip" }, errorMessage));
 };
 
 // src/components/Input/InputGroup.tsx
-import React46 from "react";
+import React45 from "react";
 import classNames17 from "classnames";
 var InputGroup = ({
   label,
@@ -3346,7 +3343,7 @@ var InputGroup = ({
     className,
     inline && "Layer__input-group--inline"
   );
-  return /* @__PURE__ */ React46.createElement("div", { className: baseClassName }, label && /* @__PURE__ */ React46.createElement(
+  return /* @__PURE__ */ React45.createElement("div", { className: baseClassName }, label && /* @__PURE__ */ React45.createElement(
     Text,
     {
       as: "label",
@@ -3359,11 +3356,11 @@ var InputGroup = ({
 };
 
 // src/components/Input/FileInput.tsx
-import React48, { useRef as useRef7 } from "react";
+import React47, { useRef as useRef7 } from "react";
 
 // src/icons/UploadCloud.tsx
-import * as React47 from "react";
-var UploadCloud = ({ size = 18, ...props }) => /* @__PURE__ */ React47.createElement(
+import * as React46 from "react";
+var UploadCloud = ({ size = 18, ...props }) => /* @__PURE__ */ React46.createElement(
   "svg",
   {
     viewBox: "0 0 18 18",
@@ -3373,7 +3370,7 @@ var UploadCloud = ({ size = 18, ...props }) => /* @__PURE__ */ React47.createEle
     width: size,
     height: size
   },
-  /* @__PURE__ */ React47.createElement(
+  /* @__PURE__ */ React46.createElement(
     "path",
     {
       d: "M12 12L9 9L6 12",
@@ -3382,7 +3379,7 @@ var UploadCloud = ({ size = 18, ...props }) => /* @__PURE__ */ React47.createEle
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React47.createElement(
+  /* @__PURE__ */ React46.createElement(
     "path",
     {
       d: "M9 9V15.75",
@@ -3391,7 +3388,7 @@ var UploadCloud = ({ size = 18, ...props }) => /* @__PURE__ */ React47.createEle
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React47.createElement(
+  /* @__PURE__ */ React46.createElement(
     "path",
     {
       d: "M15.2925 13.7925C16.024 13.3937 16.6019 12.7626 16.9349 11.999C17.2679 11.2353 17.3372 10.3824 17.1317 9.57501C16.9262 8.7676 16.4576 8.05162 15.8 7.54007C15.1424 7.02852 14.3332 6.75054 13.5 6.74999H12.555C12.328 5.87192 11.9049 5.05674 11.3175 4.36573C10.7301 3.67473 9.99364 3.12588 9.16358 2.76044C8.33352 2.39501 7.43141 2.22251 6.52509 2.2559C5.61876 2.28929 4.7318 2.52771 3.93088 2.95324C3.12997 3.37876 2.43593 3.98032 1.90097 4.71267C1.366 5.44503 1.00402 6.28914 0.842236 7.18153C0.680453 8.07393 0.72308 8.99139 0.966911 9.86493C1.21074 10.7385 1.64943 11.5454 2.25 12.225",
@@ -3400,7 +3397,7 @@ var UploadCloud = ({ size = 18, ...props }) => /* @__PURE__ */ React47.createEle
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React47.createElement(
+  /* @__PURE__ */ React46.createElement(
     "path",
     {
       d: "M12 12L9 9L6 12",
@@ -3426,15 +3423,15 @@ var FileInput = ({ text = "Upload", onUpload }) => {
       onUpload(fileUploaded);
     }
   };
-  return /* @__PURE__ */ React48.createElement(React48.Fragment, null, /* @__PURE__ */ React48.createElement(
+  return /* @__PURE__ */ React47.createElement(React47.Fragment, null, /* @__PURE__ */ React47.createElement(
     Button,
     {
       onClick,
       variant: "secondary" /* secondary */,
-      rightIcon: /* @__PURE__ */ React48.createElement(UploadCloud_default, null)
+      rightIcon: /* @__PURE__ */ React47.createElement(UploadCloud_default, null)
     },
     text
-  ), /* @__PURE__ */ React48.createElement(
+  ), /* @__PURE__ */ React47.createElement(
     "input",
     {
       type: "file",
@@ -3446,13 +3443,13 @@ var FileInput = ({ text = "Upload", onUpload }) => {
 };
 
 // src/components/Input/Select.tsx
-import React49 from "react";
+import React48 from "react";
 import ReactSelect, {
   components as components2
 } from "react-select";
 import classNames18 from "classnames";
 var DropdownIndicator2 = (props) => {
-  return /* @__PURE__ */ React49.createElement(components2.DropdownIndicator, { ...props }, /* @__PURE__ */ React49.createElement(ChevronDownFill_default, null));
+  return /* @__PURE__ */ React48.createElement(components2.DropdownIndicator, { ...props }, /* @__PURE__ */ React48.createElement(ChevronDownFill_default, null));
 };
 var Select2 = ({
   name,
@@ -3471,7 +3468,7 @@ var Select2 = ({
     isInvalid ? "Layer__select--error" : "",
     className
   );
-  return /* @__PURE__ */ React49.createElement(Tooltip, { disabled: !isInvalid || !errorMessage }, /* @__PURE__ */ React49.createElement(TooltipTrigger, { className: "Layer__input-tooltip" }, /* @__PURE__ */ React49.createElement(
+  return /* @__PURE__ */ React48.createElement(Tooltip, { disabled: !isInvalid || !errorMessage }, /* @__PURE__ */ React48.createElement(TooltipTrigger, { className: "Layer__input-tooltip" }, /* @__PURE__ */ React48.createElement(
     ReactSelect,
     {
       name,
@@ -3486,11 +3483,11 @@ var Select2 = ({
       components: { DropdownIndicator: DropdownIndicator2 },
       isDisabled: disabled
     }
-  )), /* @__PURE__ */ React49.createElement(TooltipContent, { className: "Layer__tooltip" }, errorMessage));
+  )), /* @__PURE__ */ React48.createElement(TooltipContent, { className: "Layer__tooltip" }, errorMessage));
 };
 
 // src/components/Input/InputWithBadge.tsx
-import React50 from "react";
+import React49 from "react";
 import classNames19 from "classnames";
 var InputWithBadge = ({
   className,
@@ -3507,11 +3504,11 @@ var InputWithBadge = ({
     leftText ? "Layer__input--with-left-text" : "",
     className
   );
-  return /* @__PURE__ */ React50.createElement(Tooltip, { disabled: !isInvalid || !errorMessage }, /* @__PURE__ */ React50.createElement(TooltipTrigger, { className: "Layer__input-tooltip" }, /* @__PURE__ */ React50.createElement("div", { className: "Layer__input-with-badge" }, /* @__PURE__ */ React50.createElement("input", { ...props, className: baseClassName }), badge && /* @__PURE__ */ React50.createElement(Badge, { variant }, badge)), leftText && /* @__PURE__ */ React50.createElement("span", { className: "Layer__input-left-text" }, leftText)), /* @__PURE__ */ React50.createElement(TooltipContent, { className: "Layer__tooltip" }, errorMessage));
+  return /* @__PURE__ */ React49.createElement(Tooltip, { disabled: !isInvalid || !errorMessage }, /* @__PURE__ */ React49.createElement(TooltipTrigger, { className: "Layer__input-tooltip" }, /* @__PURE__ */ React49.createElement("div", { className: "Layer__input-with-badge" }, /* @__PURE__ */ React49.createElement("input", { ...props, className: baseClassName }), badge && /* @__PURE__ */ React49.createElement(Badge, { variant }, badge)), leftText && /* @__PURE__ */ React49.createElement("span", { className: "Layer__input-left-text" }, leftText)), /* @__PURE__ */ React49.createElement(TooltipContent, { className: "Layer__tooltip" }, errorMessage));
 };
 
 // src/components/Input/DateInput.tsx
-import React51, { useEffect as useEffect5, useState as useState9 } from "react";
+import React50, { useEffect as useEffect5, useState as useState9 } from "react";
 import DatePicker from "react-datepicker";
 import "react-datepicker/dist/react-datepicker.css";
 import classNames20 from "classnames";
@@ -3532,7 +3529,7 @@ var DateInput = ({
     "Layer__datepicker",
     props.showTimeSelect && "Layer__datepicker__time"
   );
-  return /* @__PURE__ */ React51.createElement(
+  return /* @__PURE__ */ React50.createElement(
     DatePicker,
     {
       wrapperClassName,
@@ -3548,10 +3545,10 @@ var DateInput = ({
 };
 
 // src/components/MatchForm/MatchForm.tsx
-import React53 from "react";
+import React52 from "react";
 
 // src/components/BankTransactionRow/MatchBadge.tsx
-import React52 from "react";
+import React51 from "react";
 import { parseISO as parseISO5, format as formatTime2 } from "date-fns";
 var MatchBadge = ({
   bankTransaction,
@@ -3561,11 +3558,11 @@ var MatchBadge = ({
 }) => {
   if (bankTransaction.categorization_status === "MATCHED" /* MATCHED */ && bankTransaction.match) {
     const { date, amount } = bankTransaction.match.bank_transaction;
-    return /* @__PURE__ */ React52.createElement(
+    return /* @__PURE__ */ React51.createElement(
       Badge,
       {
-        icon: /* @__PURE__ */ React52.createElement(MinimizeTwo_default, { size: 11 }),
-        tooltip: /* @__PURE__ */ React52.createElement("span", { className: `${classNamePrefix}__match-tooltip` }, /* @__PURE__ */ React52.createElement("div", { className: `${classNamePrefix}__match-tooltip__date` }, formatTime2(parseISO5(date), dateFormat)), /* @__PURE__ */ React52.createElement("div", { className: `${classNamePrefix}__match-tooltip__description` }, bankTransaction.match?.details?.description ?? ""), /* @__PURE__ */ React52.createElement("div", { className: `${classNamePrefix}__match-tooltip__amount` }, "$", centsToDollars(amount)))
+        icon: /* @__PURE__ */ React51.createElement(MinimizeTwo_default, { size: 11 }),
+        tooltip: /* @__PURE__ */ React51.createElement("span", { className: `${classNamePrefix}__match-tooltip` }, /* @__PURE__ */ React51.createElement("div", { className: `${classNamePrefix}__match-tooltip__date` }, formatTime2(parseISO5(date), dateFormat)), /* @__PURE__ */ React51.createElement("div", { className: `${classNamePrefix}__match-tooltip__description` }, bankTransaction.match?.details?.description ?? ""), /* @__PURE__ */ React51.createElement("div", { className: `${classNamePrefix}__match-tooltip__amount` }, "$", centsToDollars(amount)))
       },
       text
     );
@@ -3583,13 +3580,13 @@ var MatchForm = ({
   setSelectedMatchId,
   matchFormError
 }) => {
-  return /* @__PURE__ */ React53.createElement("div", { className: `${classNamePrefix}__match-table` }, /* @__PURE__ */ React53.createElement("div", { className: `${classNamePrefix}__match-table__header` }, /* @__PURE__ */ React53.createElement("div", { className: `${classNamePrefix}__match-table__date` }, "Date"), /* @__PURE__ */ React53.createElement("div", { className: `${classNamePrefix}__match-table__desc` }, "Description"), /* @__PURE__ */ React53.createElement("div", { className: `${classNamePrefix}__match-table__amount` }, "Amount"), /* @__PURE__ */ React53.createElement(
+  return /* @__PURE__ */ React52.createElement("div", { className: `${classNamePrefix}__match-table` }, /* @__PURE__ */ React52.createElement("div", { className: `${classNamePrefix}__match-table__header` }, /* @__PURE__ */ React52.createElement("div", { className: `${classNamePrefix}__match-table__date` }, "Date"), /* @__PURE__ */ React52.createElement("div", { className: `${classNamePrefix}__match-table__desc` }, "Description"), /* @__PURE__ */ React52.createElement("div", { className: `${classNamePrefix}__match-table__amount` }, "Amount"), /* @__PURE__ */ React52.createElement(
     "div",
     {
       className: `${classNamePrefix}__match-table__status ${bankTransaction.match ? "" : "no-match"}`
     }
   )), bankTransaction.suggested_matches?.map((match, idx) => {
-    return /* @__PURE__ */ React53.createElement(
+    return /* @__PURE__ */ React52.createElement(
       "div",
       {
         key: idx,
@@ -3605,15 +3602,15 @@ var MatchForm = ({
           setSelectedMatchId(match.id);
         }
       },
-      /* @__PURE__ */ React53.createElement(
+      /* @__PURE__ */ React52.createElement(
         "div",
         {
           className: `Layer__nowrap ${classNamePrefix}__match-table__date`
         },
-        /* @__PURE__ */ React53.createElement("span", null, formatTime3(parseISO6(match.details.date), DATE_FORMAT)),
-        /* @__PURE__ */ React53.createElement("span", { className: "amount-next-to-date" }, "$", centsToDollars(match.details.amount))
+        /* @__PURE__ */ React52.createElement("span", null, formatTime3(parseISO6(match.details.date), DATE_FORMAT)),
+        /* @__PURE__ */ React52.createElement("span", { className: "amount-next-to-date" }, "$", centsToDollars(match.details.amount))
       ),
-      /* @__PURE__ */ React53.createElement("div", { className: `${classNamePrefix}__match-table__desc` }, /* @__PURE__ */ React53.createElement(
+      /* @__PURE__ */ React52.createElement("div", { className: `${classNamePrefix}__match-table__desc` }, /* @__PURE__ */ React52.createElement(
         Text,
         {
           className: `${classNamePrefix}__match-table__desc-tooltip`,
@@ -3621,7 +3618,7 @@ var MatchForm = ({
           as: "span"
         },
         match.details.description
-      ), match.details.id === bankTransaction.match?.details.id && /* @__PURE__ */ React53.createElement("span", { className: "match-badge" }, /* @__PURE__ */ React53.createElement(
+      ), match.details.id === bankTransaction.match?.details.id && /* @__PURE__ */ React52.createElement("span", { className: "match-badge" }, /* @__PURE__ */ React52.createElement(
         MatchBadge,
         {
           classNamePrefix,
@@ -3630,13 +3627,13 @@ var MatchForm = ({
           text: "Matched"
         }
       ))),
-      /* @__PURE__ */ React53.createElement("div", { className: `${classNamePrefix}__match-table__amount` }, "$", centsToDollars(match.details.amount)),
-      /* @__PURE__ */ React53.createElement(
+      /* @__PURE__ */ React52.createElement("div", { className: `${classNamePrefix}__match-table__amount` }, "$", centsToDollars(match.details.amount)),
+      /* @__PURE__ */ React52.createElement(
         "div",
         {
           className: `${classNamePrefix}__match-table__status ${bankTransaction.match ? "" : "no-match"}`
         },
-        match.details.id === bankTransaction.match?.details.id && /* @__PURE__ */ React53.createElement(
+        match.details.id === bankTransaction.match?.details.id && /* @__PURE__ */ React52.createElement(
           MatchBadge,
           {
             classNamePrefix,
@@ -3647,11 +3644,11 @@ var MatchForm = ({
         )
       )
     );
-  }), matchFormError && /* @__PURE__ */ React53.createElement(ErrorText, null, matchFormError));
+  }), matchFormError && /* @__PURE__ */ React52.createElement(ErrorText, null, matchFormError));
 };
 
 // src/components/MatchForm/MatchFormMobile.tsx
-import React54 from "react";
+import React53 from "react";
 import classNames22 from "classnames";
 import { parseISO as parseISO7, format as formatTime4 } from "date-fns";
 var MatchFormMobile = ({
@@ -3661,8 +3658,8 @@ var MatchFormMobile = ({
   setSelectedMatchId,
   matchFormError
 }) => {
-  return /* @__PURE__ */ React54.createElement("div", { className: `${classNamePrefix}__match-list` }, bankTransaction.suggested_matches?.map((match, idx) => {
-    return /* @__PURE__ */ React54.createElement(
+  return /* @__PURE__ */ React53.createElement("div", { className: `${classNamePrefix}__match-list` }, bankTransaction.suggested_matches?.map((match, idx) => {
+    return /* @__PURE__ */ React53.createElement(
       "div",
       {
         key: idx,
@@ -3678,14 +3675,14 @@ var MatchFormMobile = ({
           setSelectedMatchId(match.id);
         }
       },
-      /* @__PURE__ */ React54.createElement("div", { className: `${classNamePrefix}__match-item__col-details` }, /* @__PURE__ */ React54.createElement("div", { className: `${classNamePrefix}__match-item__heading` }, /* @__PURE__ */ React54.createElement(
+      /* @__PURE__ */ React53.createElement("div", { className: `${classNamePrefix}__match-item__col-details` }, /* @__PURE__ */ React53.createElement("div", { className: `${classNamePrefix}__match-item__heading` }, /* @__PURE__ */ React53.createElement(
         Text,
         {
           className: `${classNamePrefix}__match-item__name`,
           as: "span"
         },
         match.details.description
-      ), /* @__PURE__ */ React54.createElement(
+      ), /* @__PURE__ */ React53.createElement(
         Text,
         {
           className: `${classNamePrefix}__match-item__amount`,
@@ -3693,7 +3690,7 @@ var MatchFormMobile = ({
         },
         "$",
         centsToDollars(match.details.amount)
-      )), /* @__PURE__ */ React54.createElement("div", { className: `${classNamePrefix}__match-item__details` }, /* @__PURE__ */ React54.createElement(
+      )), /* @__PURE__ */ React53.createElement("div", { className: `${classNamePrefix}__match-item__details` }, /* @__PURE__ */ React53.createElement(
         Text,
         {
           className: `${classNamePrefix}__match-item__date`,
@@ -3702,7 +3699,7 @@ var MatchFormMobile = ({
         },
         formatTime4(parseISO7(match.details.date), MONTH_DAY_FORMAT)
       ))),
-      /* @__PURE__ */ React54.createElement("div", { className: `${classNamePrefix}__match-item__col-status` }, selectedMatchId && selectedMatchId === match.id ? /* @__PURE__ */ React54.createElement(
+      /* @__PURE__ */ React53.createElement("div", { className: `${classNamePrefix}__match-item__col-status` }, selectedMatchId && selectedMatchId === match.id ? /* @__PURE__ */ React53.createElement(
         Check_default,
         {
           size: 16,
@@ -3710,11 +3707,11 @@ var MatchFormMobile = ({
         }
       ) : null)
     );
-  }), matchFormError && /* @__PURE__ */ React54.createElement(ErrorText, null, matchFormError));
+  }), matchFormError && /* @__PURE__ */ React53.createElement(ErrorText, null, matchFormError));
 };
 
 // src/components/Textarea/Textarea.tsx
-import React55 from "react";
+import React54 from "react";
 import classNames23 from "classnames";
 var Textarea = ({
   className,
@@ -3727,11 +3724,11 @@ var Textarea = ({
     isInvalid ? "Layer__textarea--error" : "",
     className
   );
-  return /* @__PURE__ */ React55.createElement(Tooltip, { disabled: !isInvalid || !errorMessage }, /* @__PURE__ */ React55.createElement(TooltipTrigger, { className: "Layer__input-tooltip" }, /* @__PURE__ */ React55.createElement("textarea", { ...props, className: baseClassName })), /* @__PURE__ */ React55.createElement(TooltipContent, { className: "Layer__tooltip" }, errorMessage));
+  return /* @__PURE__ */ React54.createElement(Tooltip, { disabled: !isInvalid || !errorMessage }, /* @__PURE__ */ React54.createElement(TooltipTrigger, { className: "Layer__input-tooltip" }, /* @__PURE__ */ React54.createElement("textarea", { ...props, className: baseClassName })), /* @__PURE__ */ React54.createElement(TooltipContent, { className: "Layer__tooltip" }, errorMessage));
 };
 
 // src/components/Toggle/Toggle.tsx
-import React56, {
+import React55, {
   useEffect as useEffect6,
   useState as useState10
 } from "react";
@@ -3800,7 +3797,7 @@ var Toggle = ({
     }
     return selectedIndex;
   };
-  return /* @__PURE__ */ React56.createElement("div", { className: baseClassName, ref: toggleRef }, options.map((option, index) => /* @__PURE__ */ React56.createElement(
+  return /* @__PURE__ */ React55.createElement("div", { className: baseClassName, ref: toggleRef }, options.map((option, index) => /* @__PURE__ */ React55.createElement(
     ToggleOption,
     {
       ...option,
@@ -3813,7 +3810,7 @@ var Toggle = ({
       disabledMessage: option.disabledMessage,
       index
     }
-  )), /* @__PURE__ */ React56.createElement("span", { className: "Layer__toggle__thumb", style: { ...thumbPos } }));
+  )), /* @__PURE__ */ React55.createElement("span", { className: "Layer__toggle__thumb", style: { ...thumbPos } }));
 };
 var ToggleOption = ({
   checked,
@@ -3829,14 +3826,14 @@ var ToggleOption = ({
   index
 }) => {
   if (disabled) {
-    return /* @__PURE__ */ React56.createElement(Tooltip, null, /* @__PURE__ */ React56.createElement(TooltipTrigger, null, /* @__PURE__ */ React56.createElement(
+    return /* @__PURE__ */ React55.createElement(Tooltip, null, /* @__PURE__ */ React55.createElement(TooltipTrigger, null, /* @__PURE__ */ React55.createElement(
       "label",
       {
         className: `Layer__toggle-option`,
         "data-checked": checked,
         style
       },
-      /* @__PURE__ */ React56.createElement(
+      /* @__PURE__ */ React55.createElement(
         "input",
         {
           type: "radio",
@@ -3848,17 +3845,17 @@ var ToggleOption = ({
           "data-idx": index
         }
       ),
-      /* @__PURE__ */ React56.createElement("span", { className: "Layer__toggle-option-content" }, leftIcon && /* @__PURE__ */ React56.createElement("span", { className: "Layer__toggle-option__icon" }, leftIcon), /* @__PURE__ */ React56.createElement("span", null, label))
-    )), /* @__PURE__ */ React56.createElement(TooltipContent, { className: "Layer__tooltip" }, disabledMessage));
+      /* @__PURE__ */ React55.createElement("span", { className: "Layer__toggle-option-content" }, leftIcon && /* @__PURE__ */ React55.createElement("span", { className: "Layer__toggle-option__icon" }, leftIcon), /* @__PURE__ */ React55.createElement("span", null, label))
+    )), /* @__PURE__ */ React55.createElement(TooltipContent, { className: "Layer__tooltip" }, disabledMessage));
   }
-  return /* @__PURE__ */ React56.createElement(
+  return /* @__PURE__ */ React55.createElement(
     "label",
     {
       className: `Layer__toggle-option`,
       "data-checked": checked,
       style
     },
-    /* @__PURE__ */ React56.createElement(
+    /* @__PURE__ */ React55.createElement(
       "input",
       {
         type: "radio",
@@ -3870,16 +3867,16 @@ var ToggleOption = ({
         "data-idx": index
       }
     ),
-    /* @__PURE__ */ React56.createElement("span", { className: "Layer__toggle-option-content" }, leftIcon && /* @__PURE__ */ React56.createElement("span", { className: "Layer__toggle-option__icon" }, leftIcon), /* @__PURE__ */ React56.createElement("span", null, label))
+    /* @__PURE__ */ React55.createElement("span", { className: "Layer__toggle-option-content" }, leftIcon && /* @__PURE__ */ React55.createElement("span", { className: "Layer__toggle-option__icon" }, leftIcon), /* @__PURE__ */ React55.createElement("span", null, label))
   );
 };
 
 // src/components/ExpandedBankTransactionRow/APIErrorNotifications.tsx
-import React58, { useEffect as useEffect7, useState as useState11 } from "react";
+import React57, { useEffect as useEffect7, useState as useState11 } from "react";
 
 // src/icons/AlertOctagon.tsx
-import * as React57 from "react";
-var AlertOctagon = ({ size = 18, ...props }) => /* @__PURE__ */ React57.createElement(
+import * as React56 from "react";
+var AlertOctagon = ({ size = 18, ...props }) => /* @__PURE__ */ React56.createElement(
   "svg",
   {
     viewBox: "0 0 18 18",
@@ -3889,7 +3886,7 @@ var AlertOctagon = ({ size = 18, ...props }) => /* @__PURE__ */ React57.createEl
     width: size,
     height: size
   },
-  /* @__PURE__ */ React57.createElement(
+  /* @__PURE__ */ React56.createElement(
     "path",
     {
       d: "M5.895 1.5H12.105L16.5 5.895V12.105L12.105 16.5H5.895L1.5 12.105V5.895L5.895 1.5Z",
@@ -3898,7 +3895,7 @@ var AlertOctagon = ({ size = 18, ...props }) => /* @__PURE__ */ React57.createEl
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React57.createElement(
+  /* @__PURE__ */ React56.createElement(
     "path",
     {
       d: "M9 6V9",
@@ -3907,7 +3904,7 @@ var AlertOctagon = ({ size = 18, ...props }) => /* @__PURE__ */ React57.createEl
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ React57.createElement(
+  /* @__PURE__ */ React56.createElement(
     "path",
     {
       d: "M9 12H9.0075",
@@ -3963,13 +3960,13 @@ var APIErrorNotifications = ({
       pushNotification(ERROR_TITLE, ERROR_MESSAGE);
     }
   }, [bankTransaction.error]);
-  return /* @__PURE__ */ React58.createElement(
+  return /* @__PURE__ */ React57.createElement(
     "div",
     {
       className: "Layer__bank-transactions__notifications",
       style: containerWidth ? { left: containerWidth - 324 } : {}
     },
-    notifications.filter((n) => n.bankTransactionId === bankTransaction.id).map((notification) => /* @__PURE__ */ React58.createElement(
+    notifications.filter((n) => n.bankTransactionId === bankTransaction.id).map((notification) => /* @__PURE__ */ React57.createElement(
       Notification,
       {
         key: notification.timestamp,
@@ -3997,20 +3994,20 @@ var Notification = ({
       deleteNotification(notification.timestamp);
     }, FADE_OUT_TIME_WAIT);
   };
-  return /* @__PURE__ */ React58.createElement(
+  return /* @__PURE__ */ React57.createElement(
     "div",
     {
       className: `Layer__bank-transactions__notification ${visible ? "notification-enter" : "notification-exit"}`,
       onClick: hideNotification
     },
-    /* @__PURE__ */ React58.createElement("div", { className: "Layer__bank-transactions__notification-content" }, /* @__PURE__ */ React58.createElement("div", { className: "Layer__bank-transactions__notification-icon" }, /* @__PURE__ */ React58.createElement(AlertOctagon_default, { size: 14 })), /* @__PURE__ */ React58.createElement("div", { className: "Layer__bank-transactions__notification-text" }, /* @__PURE__ */ React58.createElement(
+    /* @__PURE__ */ React57.createElement("div", { className: "Layer__bank-transactions__notification-content" }, /* @__PURE__ */ React57.createElement("div", { className: "Layer__bank-transactions__notification-icon" }, /* @__PURE__ */ React57.createElement(AlertOctagon_default, { size: 14 })), /* @__PURE__ */ React57.createElement("div", { className: "Layer__bank-transactions__notification-text" }, /* @__PURE__ */ React57.createElement(
       Text,
       {
         as: "span",
         className: "Layer__bank-transactions__notification-title"
       },
       notification.title
-    ), /* @__PURE__ */ React58.createElement(
+    ), /* @__PURE__ */ React57.createElement(
       Text,
       {
         as: "span",
@@ -4159,18 +4156,19 @@ var ExpandedBankTransactionRow = forwardRef3(
     const save = async () => {
       const endpoint = `/v1/businesses/${businessId}/bank-transactions/${bankTransaction.id}/metadata`;
       if (showDescriptions && memoText != void 0) {
-        const headers = {
-          method: "PUT",
-          headers: {
-            Authorization: `Bearer ${auth.access_token}`,
-            "Content-Type": "application/json"
-          },
-          body: JSON.stringify({
-            memo: memoText
-          })
-        };
-        const result = await fetch(apiUrl + endpoint, headers);
-        const resultJson = await result.json();
+        const result = await Layer.updateBankTransactionMetadata(
+          apiUrl,
+          auth.access_token,
+          {
+            params: {
+              businessId,
+              bankTransactionId: bankTransaction.id
+            },
+            body: {
+              memo: memoText
+            }
+          }
+        );
       }
       if (purpose === "match" /* match */) {
         if (!selectedMatchId) {
@@ -4206,31 +4204,33 @@ var ExpandedBankTransactionRow = forwardRef3(
       close();
     };
     const fetchMetadata = async () => {
-      const endpoint = `/v1/businesses/${businessId}/bank-transactions/${bankTransaction.id}/metadata`;
-      const headers = {
-        method: "GET",
-        headers: {
-          Authorization: `Bearer ${auth.access_token}`,
-          "Content-Type": "application/json"
+      const getBankTransactionMetadata2 = Layer.getBankTransactionMetadata(
+        apiUrl,
+        auth.access_token,
+        {
+          params: {
+            businessId,
+            bankTransactionId: bankTransaction.id
+          }
         }
-      };
-      const result = await fetch(apiUrl + endpoint, headers);
-      const resultJson = await result.json();
-      const retrievedMemo = resultJson.data.memo ?? "";
-      setMemoText(retrievedMemo);
+      );
+      const result = await getBankTransactionMetadata2();
+      if (result.data.memo)
+        setMemoText(result.data.memo);
     };
     const fetchDocuments = async () => {
-      const docsEndpoint = `/v1/businesses/${businessId}/bank-transactions/${bankTransaction.id}/documents`;
-      const docsHeaders = {
-        method: "GET",
-        headers: {
-          Authorization: `Bearer ${auth.access_token}`,
-          "Content-Type": "application/json"
+      const listBankTransactionDocuments2 = Layer.listBankTransactionDocuments(
+        apiUrl,
+        auth.access_token,
+        {
+          params: {
+            businessId,
+            bankTransactionId: bankTransaction.id
+          }
         }
-      };
-      const docsResult = await fetch(apiUrl + docsEndpoint, docsHeaders);
-      const docsResultJson = await docsResult.json();
-      const retrievedDocs = docsResultJson.data.documentUrls.map(
+      );
+      const result = await listBankTransactionDocuments2();
+      const retrievedDocs = result.data.documentUrls.map(
         (docUrl) => docUrl.presignedUrl
       );
       setReceiptUrls(retrievedDocs);
@@ -4288,14 +4288,14 @@ var ExpandedBankTransactionRow = forwardRef3(
     }, []);
     const className = "Layer__expanded-bank-transaction-row";
     const shouldHide = !isOpen && isOver;
-    return /* @__PURE__ */ React59.createElement(
+    return /* @__PURE__ */ React58.createElement(
       "span",
       {
         className: `${className} ${className}--${isOpen ? "expanded" : "collapsed"}`,
         style: { height },
         onTransitionEnd: handleTransitionEnd
       },
-      shouldHide ? null : /* @__PURE__ */ React59.createElement("span", { className: `${className}__wrapper`, ref: bodyRef }, /* @__PURE__ */ React59.createElement("div", { className: `${className}__content-toggle` }, /* @__PURE__ */ React59.createElement(
+      shouldHide ? null : /* @__PURE__ */ React58.createElement("span", { className: `${className}__wrapper`, ref: bodyRef }, /* @__PURE__ */ React58.createElement("div", { className: `${className}__content-toggle` }, /* @__PURE__ */ React58.createElement(
         Toggle,
         {
           name: `purpose-${bankTransaction.id}${asListItem ? "-li" : ""}`,
@@ -4315,13 +4315,13 @@ var ExpandedBankTransactionRow = forwardRef3(
           selected: purpose,
           onChange: onChangePurpose
         }
-      )), /* @__PURE__ */ React59.createElement(
+      )), /* @__PURE__ */ React58.createElement(
         "div",
         {
           className: `${className}__content`,
           id: `expanded-${bankTransaction.id}`
         },
-        /* @__PURE__ */ React59.createElement("div", { className: `${className}__content-panels` }, /* @__PURE__ */ React59.createElement(
+        /* @__PURE__ */ React58.createElement("div", { className: `${className}__content-panels` }, /* @__PURE__ */ React58.createElement(
           "div",
           {
             className: classNames25(
@@ -4330,7 +4330,7 @@ var ExpandedBankTransactionRow = forwardRef3(
               purpose === "match" /* match */ ? `${className}__content-panel--active` : ""
             )
           },
-          /* @__PURE__ */ React59.createElement("div", { className: `${className}__content-panel-container` }, /* @__PURE__ */ React59.createElement(
+          /* @__PURE__ */ React58.createElement("div", { className: `${className}__content-panel-container` }, /* @__PURE__ */ React58.createElement(
             MatchForm,
             {
               classNamePrefix: className,
@@ -4343,7 +4343,7 @@ var ExpandedBankTransactionRow = forwardRef3(
               matchFormError
             }
           ))
-        ), /* @__PURE__ */ React59.createElement(
+        ), /* @__PURE__ */ React58.createElement(
           "div",
           {
             className: classNames25(
@@ -4352,13 +4352,13 @@ var ExpandedBankTransactionRow = forwardRef3(
               purpose === "categorize" /* categorize */ ? `${className}__content-panel--active` : ""
             )
           },
-          /* @__PURE__ */ React59.createElement("div", { className: `${className}__content-panel-container` }, /* @__PURE__ */ React59.createElement("div", { className: `${className}__splits-inputs` }, rowState.splits.map((split, index) => /* @__PURE__ */ React59.createElement(
+          /* @__PURE__ */ React58.createElement("div", { className: `${className}__content-panel-container` }, /* @__PURE__ */ React58.createElement("div", { className: `${className}__splits-inputs` }, rowState.splits.map((split, index) => /* @__PURE__ */ React58.createElement(
             "div",
             {
               className: `${className}__table-cell--split-entry`,
               key: `split-${index}`
             },
-            /* @__PURE__ */ React59.createElement(
+            /* @__PURE__ */ React58.createElement(
               Input,
               {
                 type: "text",
@@ -4372,12 +4372,12 @@ var ExpandedBankTransactionRow = forwardRef3(
                 errorMessage: "Negative values are not allowed"
               }
             ),
-            /* @__PURE__ */ React59.createElement(
+            /* @__PURE__ */ React58.createElement(
               "div",
               {
                 className: `${className}__table-cell--split-entry__right-col`
               },
-              /* @__PURE__ */ React59.createElement(
+              /* @__PURE__ */ React58.createElement(
                 CategorySelect,
                 {
                   bankTransaction,
@@ -4389,18 +4389,18 @@ var ExpandedBankTransactionRow = forwardRef3(
                   excludeMatches: true
                 }
               ),
-              index > 0 && /* @__PURE__ */ React59.createElement(
+              index > 0 && /* @__PURE__ */ React58.createElement(
                 Button,
                 {
                   className: `${className}__table-cell--split-entry__merge-btn`,
                   onClick: () => removeSplit(index),
-                  rightIcon: /* @__PURE__ */ React59.createElement(Trash_default, { size: 18 }),
+                  rightIcon: /* @__PURE__ */ React58.createElement(Trash_default, { size: 18 }),
                   variant: "secondary" /* secondary */,
                   iconOnly: true
                 }
               )
             )
-          ))), splitFormError && /* @__PURE__ */ React59.createElement(ErrorText, null, splitFormError), /* @__PURE__ */ React59.createElement("div", { className: `${className}__total-and-btns` }, rowState.splits.length > 1 && /* @__PURE__ */ React59.createElement(
+          ))), splitFormError && /* @__PURE__ */ React58.createElement(ErrorText, null, splitFormError), /* @__PURE__ */ React58.createElement("div", { className: `${className}__total-and-btns` }, rowState.splits.length > 1 && /* @__PURE__ */ React58.createElement(
             Input,
             {
               disabled: true,
@@ -4413,31 +4413,31 @@ var ExpandedBankTransactionRow = forwardRef3(
                 )
               )}`
             }
-          ), /* @__PURE__ */ React59.createElement("div", { className: `${className}__splits-buttons` }, rowState.splits.length > 1 ? /* @__PURE__ */ React59.createElement(
+          ), /* @__PURE__ */ React58.createElement("div", { className: `${className}__splits-buttons` }, rowState.splits.length > 1 ? /* @__PURE__ */ React58.createElement(
             TextButton,
             {
               onClick: addSplit,
               disabled: rowState.splits.length > 5
             },
             "Add new split"
-          ) : /* @__PURE__ */ React59.createElement(
+          ) : /* @__PURE__ */ React58.createElement(
             Button,
             {
               onClick: addSplit,
-              rightIcon: /* @__PURE__ */ React59.createElement(ScissorsFullOpen_default, { size: 14 }),
+              rightIcon: /* @__PURE__ */ React58.createElement(ScissorsFullOpen_default, { size: 14 }),
               variant: "secondary" /* secondary */,
               disabled: rowState.splits.length > 5
             },
             "Split"
           ))))
         )),
-        showDescriptions && /* @__PURE__ */ React59.createElement(
+        showDescriptions && /* @__PURE__ */ React58.createElement(
           InputGroup,
           {
             className: `${className}__description`,
             name: "description"
           },
-          /* @__PURE__ */ React59.createElement(
+          /* @__PURE__ */ React58.createElement(
             Textarea,
             {
               name: "description",
@@ -4447,32 +4447,25 @@ var ExpandedBankTransactionRow = forwardRef3(
             }
           )
         ),
-        showReceiptUploads && /* @__PURE__ */ React59.createElement("div", null, /* @__PURE__ */ React59.createElement("div", { className: `${className}__file-upload` }, /* @__PURE__ */ React59.createElement(
+        showReceiptUploads && /* @__PURE__ */ React58.createElement("div", null, /* @__PURE__ */ React58.createElement("div", { className: `${className}__file-upload` }, /* @__PURE__ */ React58.createElement(
           FileInput,
           {
             onUpload: async (file) => {
-              const endpoint = `/v1/businesses/${businessId}/bank-transactions/${bankTransaction.id}/documents`;
-              const formData = new FormData();
-              formData.append("file", file);
-              formData.append("documentType", "RECEIPT");
-              try {
-                const headers = {
-                  method: "POST",
-                  headers: {
-                    Authorization: `Bearer ${auth.access_token}`
-                  },
-                  body: formData
-                };
-                const result = await fetch(apiUrl + endpoint, headers);
-                const resultJson = await result.json();
-                await fetchDocuments();
-              } catch (error) {
-                console.error("Error uploading file:", error);
-              }
+              const uploadDocument = Layer.uploadBankTransactionDocument(
+                apiUrl,
+                auth.access_token
+              );
+              const result = await uploadDocument({
+                businessId,
+                bankTransactionId: bankTransaction.id,
+                file,
+                documentType: "RECEIPT"
+              });
+              await fetchDocuments();
             },
             text: "Upload receipt"
           }
-        ), receiptUrls.length > 0 && "Attached receipts:", receiptUrls.map((url, index) => /* @__PURE__ */ React59.createElement(
+        ), receiptUrls.length > 0 && "Attached receipts:", receiptUrls.map((url, index) => /* @__PURE__ */ React58.createElement(
           "a",
           {
             key: url,
@@ -4483,16 +4476,16 @@ var ExpandedBankTransactionRow = forwardRef3(
           "Receipt ",
           index + 1
         )))),
-        asListItem ? /* @__PURE__ */ React59.createElement("div", { className: `${className}__submit-btn` }, bankTransaction.error ? /* @__PURE__ */ React59.createElement(
+        asListItem ? /* @__PURE__ */ React58.createElement("div", { className: `${className}__submit-btn` }, bankTransaction.error ? /* @__PURE__ */ React58.createElement(
           Text,
           {
             as: "span",
             size: "md" /* md */,
             className: "Layer__unsaved-info"
           },
-          /* @__PURE__ */ React59.createElement("span", null, "Unsaved"),
-          /* @__PURE__ */ React59.createElement(AlertCircle_default, { size: 12 })
-        ) : null, /* @__PURE__ */ React59.createElement(
+          /* @__PURE__ */ React58.createElement("span", null, "Unsaved"),
+          /* @__PURE__ */ React58.createElement(AlertCircle_default, { size: 12 })
+        ) : null, /* @__PURE__ */ React58.createElement(
           SubmitButton,
           {
             onClick: () => {
@@ -4507,7 +4500,7 @@ var ExpandedBankTransactionRow = forwardRef3(
           },
           submitBtnText
         )) : null
-      ), /* @__PURE__ */ React59.createElement(
+      ), /* @__PURE__ */ React58.createElement(
         APIErrorNotifications,
         {
           bankTransaction,
@@ -4519,7 +4512,7 @@ var ExpandedBankTransactionRow = forwardRef3(
 );
 
 // src/components/BankTransactionRow/SplitTooltipDetails.tsx
-import React60 from "react";
+import React59 from "react";
 var SplitTooltipDetails = ({
   classNamePrefix,
   category
@@ -4527,7 +4520,7 @@ var SplitTooltipDetails = ({
   if (!category.entries) {
     return;
   }
-  return /* @__PURE__ */ React60.createElement("span", { className: `${classNamePrefix}__split-tooltip` }, /* @__PURE__ */ React60.createElement("ul", null, category.entries.map((entry, idx) => /* @__PURE__ */ React60.createElement("li", { key: idx }, /* @__PURE__ */ React60.createElement("span", { className: `${classNamePrefix}__split-tooltip__label` }, entry.category.display_name), /* @__PURE__ */ React60.createElement("span", { className: `${classNamePrefix}__split-tooltip__value` }, "$", centsToDollars(entry.amount))))));
+  return /* @__PURE__ */ React59.createElement("span", { className: `${classNamePrefix}__split-tooltip` }, /* @__PURE__ */ React59.createElement("ul", null, category.entries.map((entry, idx) => /* @__PURE__ */ React59.createElement("li", { key: idx }, /* @__PURE__ */ React59.createElement("span", { className: `${classNamePrefix}__split-tooltip__label` }, entry.category.display_name), /* @__PURE__ */ React59.createElement("span", { className: `${classNamePrefix}__split-tooltip__value` }, "$", centsToDollars(entry.amount))))));
 };
 
 // src/components/BankTransactionRow/BankTransactionRow.tsx
@@ -4640,7 +4633,7 @@ var BankTransactionRow = ({
     initialLoad ? "initial-load" : "",
     showComponent ? "show" : ""
   );
-  return /* @__PURE__ */ React61.createElement(React61.Fragment, null, /* @__PURE__ */ React61.createElement(
+  return /* @__PURE__ */ React60.createElement(React60.Fragment, null, /* @__PURE__ */ React60.createElement(
     "tr",
     {
       className: rowClassName,
@@ -4653,21 +4646,21 @@ var BankTransactionRow = ({
         }
       }
     },
-    /* @__PURE__ */ React61.createElement(
+    /* @__PURE__ */ React60.createElement(
       "td",
       {
         className: "Layer__table-cell  Layer__bank-transaction-table__date-col",
         ...openRow
       },
-      /* @__PURE__ */ React61.createElement("span", { className: "Layer__table-cell-content" }, formatTime5(parseISO8(bankTransaction.date), dateFormat))
+      /* @__PURE__ */ React60.createElement("span", { className: "Layer__table-cell-content" }, formatTime5(parseISO8(bankTransaction.date), dateFormat))
     ),
-    /* @__PURE__ */ React61.createElement(
+    /* @__PURE__ */ React60.createElement(
       "td",
       {
         className: "Layer__table-cell Layer__bank-transactions__tx-col",
         ...openRow
       },
-      /* @__PURE__ */ React61.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ React61.createElement(
+      /* @__PURE__ */ React60.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ React60.createElement(
         Text,
         {
           as: "span",
@@ -4680,13 +4673,13 @@ var BankTransactionRow = ({
         bankTransaction.counterparty_name ?? bankTransaction.description
       ))
     ),
-    /* @__PURE__ */ React61.createElement(
+    /* @__PURE__ */ React60.createElement(
       "td",
       {
         className: "Layer__table-cell Layer__bank-transactions__account-col",
         ...openRow
       },
-      /* @__PURE__ */ React61.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ React61.createElement(
+      /* @__PURE__ */ React60.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ React60.createElement(
         Text,
         {
           as: "span",
@@ -4696,15 +4689,15 @@ var BankTransactionRow = ({
         bankTransaction.account_name ?? ""
       ))
     ),
-    /* @__PURE__ */ React61.createElement(
+    /* @__PURE__ */ React60.createElement(
       "td",
       {
         className: `Layer__table-cell Layer__table-cell__amount-col Layer__bank-transactions__amount-col Layer__table-cell--amount ${className}__table-cell--amount-${isCredit(bankTransaction) ? "credit" : "debit"}`,
         ...openRow
       },
-      /* @__PURE__ */ React61.createElement("span", { className: "Layer__table-cell-content" }, isCredit(bankTransaction) ? "+$" : " $", centsToDollars(bankTransaction.amount))
+      /* @__PURE__ */ React60.createElement("span", { className: "Layer__table-cell-content" }, isCredit(bankTransaction) ? "+$" : " $", centsToDollars(bankTransaction.amount))
     ),
-    /* @__PURE__ */ React61.createElement(
+    /* @__PURE__ */ React60.createElement(
       "td",
       {
         className: classNames26(
@@ -4714,12 +4707,12 @@ var BankTransactionRow = ({
           `${className}__actions-cell--${open ? "open" : "close"}`
         )
       },
-      /* @__PURE__ */ React61.createElement(
+      /* @__PURE__ */ React60.createElement(
         "span",
         {
           className: `${className}__actions-container Layer__table-cell-content`
         },
-        !categorized && !open ? /* @__PURE__ */ React61.createElement(
+        !categorized && !open ? /* @__PURE__ */ React60.createElement(
           CategorySelect,
           {
             bankTransaction,
@@ -4732,11 +4725,11 @@ var BankTransactionRow = ({
             disabled: bankTransaction.processing
           }
         ) : null,
-        categorized && !open ? /* @__PURE__ */ React61.createElement(Text, { as: "span", className: `${className}__category-text` }, bankTransaction.categorization_status === "SPLIT" /* SPLIT */ && /* @__PURE__ */ React61.createElement(React61.Fragment, null, /* @__PURE__ */ React61.createElement(
+        categorized && !open ? /* @__PURE__ */ React60.createElement(Text, { as: "span", className: `${className}__category-text` }, bankTransaction.categorization_status === "SPLIT" /* SPLIT */ && /* @__PURE__ */ React60.createElement(React60.Fragment, null, /* @__PURE__ */ React60.createElement(
           Badge,
           {
-            icon: /* @__PURE__ */ React61.createElement(Scissors_default, { size: 11 }),
-            tooltip: /* @__PURE__ */ React61.createElement(
+            icon: /* @__PURE__ */ React60.createElement(Scissors_default, { size: 11 }),
+            tooltip: /* @__PURE__ */ React60.createElement(
               SplitTooltipDetails,
               {
                 classNamePrefix: className,
@@ -4745,18 +4738,18 @@ var BankTransactionRow = ({
             )
           },
           "Split"
-        ), /* @__PURE__ */ React61.createElement("span", { className: `${className}__category-text__text` }, extractDescriptionForSplit(bankTransaction.category))), bankTransaction?.categorization_status === "MATCHED" /* MATCHED */ && bankTransaction?.match && /* @__PURE__ */ React61.createElement(React61.Fragment, null, /* @__PURE__ */ React61.createElement(
+        ), /* @__PURE__ */ React60.createElement("span", { className: `${className}__category-text__text` }, extractDescriptionForSplit(bankTransaction.category))), bankTransaction?.categorization_status === "MATCHED" /* MATCHED */ && bankTransaction?.match && /* @__PURE__ */ React60.createElement(React60.Fragment, null, /* @__PURE__ */ React60.createElement(
           MatchBadge,
           {
             classNamePrefix: className,
             bankTransaction,
             dateFormat
           }
-        ), /* @__PURE__ */ React61.createElement("span", { className: `${className}__category-text__text` }, `${formatTime5(
+        ), /* @__PURE__ */ React60.createElement("span", { className: `${className}__category-text__text` }, `${formatTime5(
           parseISO8(bankTransaction.match.bank_transaction.date),
           dateFormat
-        )}, ${bankTransaction.match?.details?.description}`)), bankTransaction?.categorization_status !== "MATCHED" /* MATCHED */ && bankTransaction?.categorization_status !== "SPLIT" /* SPLIT */ && /* @__PURE__ */ React61.createElement("span", { className: `${className}__category-text__text` }, bankTransaction?.category?.display_name)) : null,
-        !categorized && !open && showRetry ? /* @__PURE__ */ React61.createElement(
+        )}, ${bankTransaction.match?.details?.description}`)), bankTransaction?.categorization_status !== "MATCHED" /* MATCHED */ && bankTransaction?.categorization_status !== "SPLIT" /* SPLIT */ && /* @__PURE__ */ React60.createElement("span", { className: `${className}__category-text__text` }, bankTransaction?.category?.display_name)) : null,
+        !categorized && !open && showRetry ? /* @__PURE__ */ React60.createElement(
           RetryButton,
           {
             onClick: () => {
@@ -4770,17 +4763,17 @@ var BankTransactionRow = ({
           },
           "Retry"
         ) : null,
-        open && bankTransaction.error ? /* @__PURE__ */ React61.createElement(
+        open && bankTransaction.error ? /* @__PURE__ */ React60.createElement(
           Text,
           {
             as: "span",
             size: "md" /* md */,
             className: "Layer__unsaved-info"
           },
-          /* @__PURE__ */ React61.createElement("span", null, "Unsaved"),
-          /* @__PURE__ */ React61.createElement(AlertCircle_default, { size: 12 })
+          /* @__PURE__ */ React60.createElement("span", null, "Unsaved"),
+          /* @__PURE__ */ React60.createElement(AlertCircle_default, { size: 12 })
         ) : null,
-        !categorized && (open || !open && !showRetry) || categorized && open ? /* @__PURE__ */ React61.createElement(
+        !categorized && (open || !open && !showRetry) || categorized && open ? /* @__PURE__ */ React60.createElement(
           SubmitButton,
           {
             onClick: () => {
@@ -4795,13 +4788,13 @@ var BankTransactionRow = ({
           },
           categorized ? "Update" : "Approve"
         ) : null,
-        /* @__PURE__ */ React61.createElement(
+        /* @__PURE__ */ React60.createElement(
           IconButton,
           {
             onClick: toggleOpen,
             className: "Layer__bank-transaction-row__expand-button",
             active: open,
-            icon: /* @__PURE__ */ React61.createElement(
+            icon: /* @__PURE__ */ React60.createElement(
               ChevronDownFill_default,
               {
                 className: `Layer__chevron ${open ? "Layer__chevron__up" : "Layer__chevron__down"}`
@@ -4811,7 +4804,7 @@ var BankTransactionRow = ({
         )
       )
     )
-  ), /* @__PURE__ */ React61.createElement("tr", null, /* @__PURE__ */ React61.createElement("td", { colSpan: 5, className: "Layer__bank-transaction-row__expanded-td" }, /* @__PURE__ */ React61.createElement(
+  ), /* @__PURE__ */ React60.createElement("tr", null, /* @__PURE__ */ React60.createElement("td", { colSpan: 5, className: "Layer__bank-transaction-row__expanded-td" }, /* @__PURE__ */ React60.createElement(
     ExpandedBankTransactionRow,
     {
       ref: expandedRowRef,
@@ -4827,11 +4820,11 @@ var BankTransactionRow = ({
 };
 
 // src/components/BankTransactionList/Assignment.tsx
-import React62 from "react";
+import React61 from "react";
 import { parseISO as parseISO9, format as formatTime6 } from "date-fns";
 var Assignment = ({ bankTransaction }) => {
   if (bankTransaction.match && bankTransaction.categorization_status === "MATCHED" /* MATCHED */) {
-    return /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(
+    return /* @__PURE__ */ React61.createElement(React61.Fragment, null, /* @__PURE__ */ React61.createElement(
       MatchBadge,
       {
         classNamePrefix: "Layer__bank-transaction-list-item",
@@ -4839,17 +4832,17 @@ var Assignment = ({ bankTransaction }) => {
         dateFormat: DATE_FORMAT,
         text: "Matched"
       }
-    ), /* @__PURE__ */ React62.createElement(Text, { className: "Layer__bank-transaction-list-item__category-text__text" }, `${formatTime6(
+    ), /* @__PURE__ */ React61.createElement(Text, { className: "Layer__bank-transaction-list-item__category-text__text" }, `${formatTime6(
       parseISO9(bankTransaction.match.bank_transaction.date),
       DATE_FORMAT
     )}, ${bankTransaction.match.bank_transaction.description ?? bankTransaction.match?.details?.description}`));
   }
   if (bankTransaction.categorization_status === "SPLIT" /* SPLIT */) {
-    return /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(
+    return /* @__PURE__ */ React61.createElement(React61.Fragment, null, /* @__PURE__ */ React61.createElement(
       Badge,
       {
-        icon: /* @__PURE__ */ React62.createElement(Scissors_default, { size: 11 }),
-        tooltip: /* @__PURE__ */ React62.createElement(
+        icon: /* @__PURE__ */ React61.createElement(Scissors_default, { size: 11 }),
+        tooltip: /* @__PURE__ */ React61.createElement(
           SplitTooltipDetails,
           {
             classNamePrefix: "Layer__bank-transaction-list-item",
@@ -4858,9 +4851,9 @@ var Assignment = ({ bankTransaction }) => {
         )
       },
       "Split"
-    ), /* @__PURE__ */ React62.createElement(Text, { className: "Layer__bank-transaction-list-item__category-text__text" }, extractDescriptionForSplit(bankTransaction.category)));
+    ), /* @__PURE__ */ React61.createElement(Text, { className: "Layer__bank-transaction-list-item__category-text__text" }, extractDescriptionForSplit(bankTransaction.category)));
   }
-  return /* @__PURE__ */ React62.createElement(Text, null, bankTransaction?.category?.display_name);
+  return /* @__PURE__ */ React61.createElement(Text, null, bankTransaction?.category?.display_name);
 };
 
 // src/components/BankTransactionList/BankTransactionListItem.tsx
@@ -4928,26 +4921,26 @@ var BankTransactionListItem = ({
     open ? openClassName : "",
     showComponent ? "show" : ""
   );
-  return /* @__PURE__ */ React63.createElement("li", { className: rowClassName }, /* @__PURE__ */ React63.createElement("span", { className: `${className}__heading` }, /* @__PURE__ */ React63.createElement("div", { className: `${className}__heading__main` }, /* @__PURE__ */ React63.createElement("span", { className: `${className}__heading-date` }, formatTime7(parseISO10(bankTransaction.date), dateFormat)), /* @__PURE__ */ React63.createElement("span", { className: `${className}__heading-separator` }), /* @__PURE__ */ React63.createElement("span", { className: `${className}__heading-account-name` }, bankTransaction.account_name ?? "")), /* @__PURE__ */ React63.createElement(
+  return /* @__PURE__ */ React62.createElement("li", { className: rowClassName }, /* @__PURE__ */ React62.createElement("span", { className: `${className}__heading` }, /* @__PURE__ */ React62.createElement("div", { className: `${className}__heading__main` }, /* @__PURE__ */ React62.createElement("span", { className: `${className}__heading-date` }, formatTime7(parseISO10(bankTransaction.date), dateFormat)), /* @__PURE__ */ React62.createElement("span", { className: `${className}__heading-separator` }), /* @__PURE__ */ React62.createElement("span", { className: `${className}__heading-account-name` }, bankTransaction.account_name ?? "")), /* @__PURE__ */ React62.createElement(
     "div",
     {
       onClick: toggleOpen,
       className: "Layer__bank-transaction-row__expand-button"
     },
-    /* @__PURE__ */ React63.createElement(
+    /* @__PURE__ */ React62.createElement(
       ChevronDownFill_default,
       {
         className: `Layer__chevron ${open ? "Layer__chevron__up" : "Layer__chevron__down"}`
       }
     )
-  )), /* @__PURE__ */ React63.createElement("span", { className: `${className}__body` }, /* @__PURE__ */ React63.createElement("span", { className: `${className}__body__name` }, /* @__PURE__ */ React63.createElement(Text, { as: "span", withTooltip: "whenTruncated" /* whenTruncated */ }, bankTransaction.counterparty_name ?? bankTransaction.description)), /* @__PURE__ */ React63.createElement(
+  )), /* @__PURE__ */ React62.createElement("span", { className: `${className}__body` }, /* @__PURE__ */ React62.createElement("span", { className: `${className}__body__name` }, /* @__PURE__ */ React62.createElement(Text, { as: "span", withTooltip: "whenTruncated" /* whenTruncated */ }, bankTransaction.counterparty_name ?? bankTransaction.description)), /* @__PURE__ */ React62.createElement(
     "span",
     {
       className: `${className}__amount-${isCredit(bankTransaction) ? "credit" : "debit"}`
     },
     isCredit(bankTransaction) ? "+$" : " $",
     centsToDollars(bankTransaction.amount)
-  )), /* @__PURE__ */ React63.createElement("span", { className: `${className}__expanded-row` }, /* @__PURE__ */ React63.createElement(
+  )), /* @__PURE__ */ React62.createElement("span", { className: `${className}__expanded-row` }, /* @__PURE__ */ React62.createElement(
     ExpandedBankTransactionRow,
     {
       ref: expandedRowRef,
@@ -4961,7 +4954,7 @@ var BankTransactionListItem = ({
       showDescriptions,
       showReceiptUploads
     }
-  )), /* @__PURE__ */ React63.createElement("span", { className: `${className}__base-row` }, !categorized ? /* @__PURE__ */ React63.createElement(
+  )), /* @__PURE__ */ React62.createElement("span", { className: `${className}__base-row` }, !categorized ? /* @__PURE__ */ React62.createElement(
     CategorySelect,
     {
       bankTransaction,
@@ -4973,7 +4966,7 @@ var BankTransactionListItem = ({
       },
       disabled: bankTransaction.processing
     }
-  ) : null, categorized ? /* @__PURE__ */ React63.createElement(Assignment, { bankTransaction }) : null, !categorized && !showRetry ? /* @__PURE__ */ React63.createElement(
+  ) : null, categorized ? /* @__PURE__ */ React62.createElement(Assignment, { bankTransaction }) : null, !categorized && !showRetry ? /* @__PURE__ */ React62.createElement(
     SubmitButton,
     {
       onClick: () => {
@@ -4986,7 +4979,7 @@ var BankTransactionListItem = ({
       action: !categorized ? "save" /* SAVE */ : "update" /* UPDATE */
     },
     !categorized ? "Approve" : "Update"
-  ) : null, !categorized && showRetry ? /* @__PURE__ */ React63.createElement(
+  ) : null, !categorized && showRetry ? /* @__PURE__ */ React62.createElement(
     RetryButton,
     {
       onClick: () => {
@@ -4999,7 +4992,7 @@ var BankTransactionListItem = ({
       error: "Approval failed. Check connection and retry in few seconds."
     },
     "Retry"
-  ) : null), bankTransaction.error && showRetry ? /* @__PURE__ */ React63.createElement(ErrorText, null, "Approval failed. Check connection and retry in few seconds.") : null);
+  ) : null), bankTransaction.error && showRetry ? /* @__PURE__ */ React62.createElement(ErrorText, null, "Approval failed. Check connection and retry in few seconds.") : null);
 };
 
 // src/components/BankTransactionList/BankTransactionList.tsx
@@ -5011,8 +5004,8 @@ var BankTransactionList = ({
   showDescriptions = false,
   showReceiptUploads = false
 }) => {
-  return /* @__PURE__ */ React64.createElement("ul", { className: "Layer__bank-transactions__list" }, bankTransactions?.map(
-    (bankTransaction, index) => /* @__PURE__ */ React64.createElement(
+  return /* @__PURE__ */ React63.createElement("ul", { className: "Layer__bank-transactions__list" }, bankTransactions?.map(
+    (bankTransaction, index) => /* @__PURE__ */ React63.createElement(
       BankTransactionListItem,
       {
         index,
@@ -5030,16 +5023,16 @@ var BankTransactionList = ({
 };
 
 // src/components/BankTransactionMobileList/BankTransactionMobileList.tsx
-import React72 from "react";
+import React71 from "react";
 
 // src/components/BankTransactionMobileList/BankTransactionMobileListItem.tsx
-import React71, { useContext as useContext7, useEffect as useEffect15, useRef as useRef11, useState as useState21 } from "react";
+import React70, { useContext as useContext7, useEffect as useEffect15, useRef as useRef11, useState as useState21 } from "react";
 
 // src/components/BankTransactionMobileList/BankTransactionMobileForms.tsx
-import React70 from "react";
+import React69 from "react";
 
 // src/components/BankTransactionMobileList/BusinessForm.tsx
-import React65, { useContext as useContext6, useEffect as useEffect11, useMemo as useMemo3, useState as useState15 } from "react";
+import React64, { useContext as useContext6, useEffect as useEffect11, useMemo as useMemo3, useState as useState15 } from "react";
 var BusinessForm = ({ bankTransaction }) => {
   const { setContent, close } = useContext6(DrawerContext);
   const { categorize: categorizeBankTransaction2, isLoading } = useBankTransactionsContext();
@@ -5077,7 +5070,7 @@ var BusinessForm = ({ bankTransaction }) => {
     setSelectedCategory(value);
   };
   const openDrawer = () => {
-    setContent(/* @__PURE__ */ React65.createElement(BusinessCategories, { select: onDrawerCategorySelect }));
+    setContent(/* @__PURE__ */ React64.createElement(BusinessCategories, { select: onDrawerCategorySelect }));
   };
   const onCategorySelect = (category) => {
     if (category.value.type === "SELECT_CATEGORY") {
@@ -5110,14 +5103,14 @@ var BusinessForm = ({ bankTransaction }) => {
       true
     );
   };
-  return /* @__PURE__ */ React65.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__business-form" }, /* @__PURE__ */ React65.createElement(
+  return /* @__PURE__ */ React64.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__business-form" }, /* @__PURE__ */ React64.createElement(
     ActionableList,
     {
       options,
       onClick: onCategorySelect,
       selected: selectedCategory
     }
-  ), options.length === 0 ? /* @__PURE__ */ React65.createElement(Button, { onClick: openDrawer, fullWidth: true }, "Select category") : null, options.length > 0 ? /* @__PURE__ */ React65.createElement(
+  ), options.length === 0 ? /* @__PURE__ */ React64.createElement(Button, { onClick: openDrawer, fullWidth: true }, "Select category") : null, options.length > 0 ? /* @__PURE__ */ React64.createElement(
     Button,
     {
       onClick: save,
@@ -5125,11 +5118,11 @@ var BusinessForm = ({ bankTransaction }) => {
       fullWidth: true
     },
     isLoading || bankTransaction.processing ? "Saving..." : "Save"
-  ) : null, bankTransaction.error && showRetry ? /* @__PURE__ */ React65.createElement(ErrorText, null, "Approval failed. Check connection and retry in few seconds.") : null);
+  ) : null, bankTransaction.error && showRetry ? /* @__PURE__ */ React64.createElement(ErrorText, null, "Approval failed. Check connection and retry in few seconds.") : null);
 };
 
 // src/components/BankTransactionMobileList/PersonalForm.tsx
-import React66, { useEffect as useEffect12, useState as useState16 } from "react";
+import React65, { useEffect as useEffect12, useState as useState16 } from "react";
 var isAlreadyAssigned = (bankTransaction) => {
   if (bankTransaction.categorization_status === "MATCHED" /* MATCHED */ || bankTransaction?.categorization_status === "SPLIT" /* SPLIT */) {
     return false;
@@ -5160,7 +5153,7 @@ var PersonalForm = ({ bankTransaction }) => {
     );
   };
   const alreadyAssigned = isAlreadyAssigned(bankTransaction);
-  return /* @__PURE__ */ React66.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__personal-form" }, /* @__PURE__ */ React66.createElement(
+  return /* @__PURE__ */ React65.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__personal-form" }, /* @__PURE__ */ React65.createElement(
     Button,
     {
       fullWidth: true,
@@ -5168,14 +5161,14 @@ var PersonalForm = ({ bankTransaction }) => {
       onClick: save
     },
     isLoading || bankTransaction.processing ? "Saving..." : alreadyAssigned ? "Saved as Personal" : "Categorize as Personal"
-  ), bankTransaction.error && showRetry ? /* @__PURE__ */ React66.createElement(ErrorText, null, "Approval failed. Check connection and retry in few seconds.") : null);
+  ), bankTransaction.error && showRetry ? /* @__PURE__ */ React65.createElement(ErrorText, null, "Approval failed. Check connection and retry in few seconds.") : null);
 };
 
 // src/components/BankTransactionMobileList/SplitAndMatchForm.tsx
-import React69, { useState as useState19 } from "react";
+import React68, { useState as useState19 } from "react";
 
 // src/components/BankTransactionMobileList/MatchForm.tsx
-import React67, { useEffect as useEffect13, useState as useState17 } from "react";
+import React66, { useEffect as useEffect13, useState as useState17 } from "react";
 var MatchForm2 = ({
   bankTransaction
 }) => {
@@ -5209,7 +5202,7 @@ var MatchForm2 = ({
     }
     return;
   };
-  return /* @__PURE__ */ React67.createElement("div", null, /* @__PURE__ */ React67.createElement(Text, { weight: "bold" /* bold */, size: "sm" /* sm */ }, "Find match"), /* @__PURE__ */ React67.createElement(
+  return /* @__PURE__ */ React66.createElement("div", null, /* @__PURE__ */ React66.createElement(Text, { weight: "bold" /* bold */, size: "sm" /* sm */ }, "Find match"), /* @__PURE__ */ React66.createElement(
     MatchFormMobile,
     {
       classNamePrefix: "Layer__bank-transaction-mobile-list-item",
@@ -5220,7 +5213,7 @@ var MatchForm2 = ({
         setSelectedMatchId(id);
       }
     }
-  ), /* @__PURE__ */ React67.createElement(
+  ), /* @__PURE__ */ React66.createElement(
     Button,
     {
       fullWidth: true,
@@ -5228,11 +5221,11 @@ var MatchForm2 = ({
       onClick: save
     },
     isLoading || bankTransaction.processing ? "Saving..." : "Approve match"
-  ), formError && /* @__PURE__ */ React67.createElement(ErrorText, null, formError), bankTransaction.error && showRetry ? /* @__PURE__ */ React67.createElement(ErrorText, null, "Approval failed. Check connection and retry in few seconds.") : null);
+  ), formError && /* @__PURE__ */ React66.createElement(ErrorText, null, formError), bankTransaction.error && showRetry ? /* @__PURE__ */ React66.createElement(ErrorText, null, "Approval failed. Check connection and retry in few seconds.") : null);
 };
 
 // src/components/BankTransactionMobileList/SplitForm.tsx
-import React68, { useEffect as useEffect14, useState as useState18 } from "react";
+import React67, { useEffect as useEffect14, useState as useState18 } from "react";
 import classNames28 from "classnames";
 var SplitForm = ({
   bankTransaction
@@ -5366,13 +5359,13 @@ var SplitForm = ({
       true
     );
   };
-  return /* @__PURE__ */ React68.createElement("div", null, /* @__PURE__ */ React68.createElement(Text, { weight: "bold" /* bold */, size: "sm" /* sm */ }, "Split transaction"), /* @__PURE__ */ React68.createElement("div", { className: "Layer__bank-transactions__table-cell__header" }, /* @__PURE__ */ React68.createElement(Text, { size: "sm" /* sm */ }, "Category"), /* @__PURE__ */ React68.createElement(Text, { size: "sm" /* sm */ }, "Amount")), /* @__PURE__ */ React68.createElement("div", { className: "Layer__bank-transactions__splits-inputs" }, rowState.splits.map((split, index) => /* @__PURE__ */ React68.createElement(
+  return /* @__PURE__ */ React67.createElement("div", null, /* @__PURE__ */ React67.createElement(Text, { weight: "bold" /* bold */, size: "sm" /* sm */ }, "Split transaction"), /* @__PURE__ */ React67.createElement("div", { className: "Layer__bank-transactions__table-cell__header" }, /* @__PURE__ */ React67.createElement(Text, { size: "sm" /* sm */ }, "Category"), /* @__PURE__ */ React67.createElement(Text, { size: "sm" /* sm */ }, "Amount")), /* @__PURE__ */ React67.createElement("div", { className: "Layer__bank-transactions__splits-inputs" }, rowState.splits.map((split, index) => /* @__PURE__ */ React67.createElement(
     "div",
     {
       className: "Layer__bank-transactions__table-cell--split-entry",
       key: `split-${index}`
     },
-    /* @__PURE__ */ React68.createElement("div", { className: "Layer__bank-transactions__table-cell--split-entry__right-col" }, /* @__PURE__ */ React68.createElement(
+    /* @__PURE__ */ React67.createElement("div", { className: "Layer__bank-transactions__table-cell--split-entry__right-col" }, /* @__PURE__ */ React67.createElement(
       CategorySelect,
       {
         bankTransaction,
@@ -5385,7 +5378,7 @@ var SplitForm = ({
         asDrawer: true
       }
     )),
-    /* @__PURE__ */ React68.createElement(
+    /* @__PURE__ */ React67.createElement(
       Input,
       {
         type: "text",
@@ -5403,17 +5396,17 @@ var SplitForm = ({
         inputMode: "numeric"
       }
     ),
-    index > 0 && /* @__PURE__ */ React68.createElement(
+    index > 0 && /* @__PURE__ */ React67.createElement(
       Button,
       {
         className: "Layer__bank-transactions__table-cell--split-entry__merge-btn",
         onClick: () => removeSplit(index),
-        rightIcon: /* @__PURE__ */ React68.createElement(Trash_default, { size: 16 }),
+        rightIcon: /* @__PURE__ */ React67.createElement(Trash_default, { size: 16 }),
         variant: "secondary" /* secondary */,
         iconOnly: true
       }
     )
-  )), /* @__PURE__ */ React68.createElement(
+  )), /* @__PURE__ */ React67.createElement(
     TextButton,
     {
       onClick: addSplit,
@@ -5421,7 +5414,7 @@ var SplitForm = ({
       className: "Layer__add-new-split"
     },
     "Add new split"
-  )), /* @__PURE__ */ React68.createElement(
+  )), /* @__PURE__ */ React67.createElement(
     Button,
     {
       fullWidth: true,
@@ -5429,7 +5422,7 @@ var SplitForm = ({
       disabled: isLoading || bankTransaction.processing
     },
     isLoading || bankTransaction.processing ? "Saving..." : "Save"
-  ), formError && /* @__PURE__ */ React68.createElement(ErrorText, null, formError), bankTransaction.error && showRetry ? /* @__PURE__ */ React68.createElement(ErrorText, null, "Approval failed. Check connection and retry in few seconds.") : null);
+  ), formError && /* @__PURE__ */ React67.createElement(ErrorText, null, formError), bankTransaction.error && showRetry ? /* @__PURE__ */ React67.createElement(ErrorText, null, "Approval failed. Check connection and retry in few seconds.") : null);
 };
 
 // src/components/BankTransactionMobileList/SplitAndMatchForm.tsx
@@ -5440,7 +5433,7 @@ var SplitAndMatchForm = ({
   const [formType, setFormType] = useState19(
     bankTransaction.category ? "categorize" /* categorize */ : anyMatch ? "match" /* match */ : "categorize" /* categorize */
   );
-  return /* @__PURE__ */ React69.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__split-and-match-form" }, formType === "categorize" /* categorize */ && /* @__PURE__ */ React69.createElement(SplitForm, { bankTransaction }), formType === "match" /* match */ && /* @__PURE__ */ React69.createElement(MatchForm2, { bankTransaction }), anyMatch && formType === "match" /* match */ ? /* @__PURE__ */ React69.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__switch-form-btns" }, /* @__PURE__ */ React69.createElement(TextButton, { onClick: () => setFormType("categorize" /* categorize */) }, "or split transaction")) : null, anyMatch && formType === "categorize" /* categorize */ ? /* @__PURE__ */ React69.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__switch-form-btns" }, /* @__PURE__ */ React69.createElement(TextButton, { onClick: () => setFormType("match" /* match */) }, "or find match")) : null);
+  return /* @__PURE__ */ React68.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__split-and-match-form" }, formType === "categorize" /* categorize */ && /* @__PURE__ */ React68.createElement(SplitForm, { bankTransaction }), formType === "match" /* match */ && /* @__PURE__ */ React68.createElement(MatchForm2, { bankTransaction }), anyMatch && formType === "match" /* match */ ? /* @__PURE__ */ React68.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__switch-form-btns" }, /* @__PURE__ */ React68.createElement(TextButton, { onClick: () => setFormType("categorize" /* categorize */) }, "or split transaction")) : null, anyMatch && formType === "categorize" /* categorize */ ? /* @__PURE__ */ React68.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__switch-form-btns" }, /* @__PURE__ */ React68.createElement(TextButton, { onClick: () => setFormType("match" /* match */) }, "or find match")) : null);
 };
 
 // src/components/BankTransactionMobileList/BankTransactionMobileForms.tsx
@@ -5451,16 +5444,16 @@ var BankTransactionMobileForms = ({
   const getContent = () => {
     switch (purpose) {
       case "business":
-        return /* @__PURE__ */ React70.createElement(BusinessForm, { bankTransaction });
+        return /* @__PURE__ */ React69.createElement(BusinessForm, { bankTransaction });
       case "personal":
-        return /* @__PURE__ */ React70.createElement(PersonalForm, { bankTransaction });
+        return /* @__PURE__ */ React69.createElement(PersonalForm, { bankTransaction });
       case "more":
-        return /* @__PURE__ */ React70.createElement(SplitAndMatchForm, { bankTransaction });
+        return /* @__PURE__ */ React69.createElement(SplitAndMatchForm, { bankTransaction });
       default:
         return null;
     }
   };
-  return /* @__PURE__ */ React70.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__form-container" }, getContent());
+  return /* @__PURE__ */ React69.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__form-container" }, getContent());
 };
 
 // src/components/BankTransactionMobileList/TransactionToOpenContext.ts
@@ -5576,7 +5569,7 @@ var BankTransactionMobileListItem = ({
     open ? openClassName : "",
     showComponent ? "show" : ""
   );
-  return /* @__PURE__ */ React71.createElement(
+  return /* @__PURE__ */ React70.createElement(
     "li",
     {
       ref: itemRef,
@@ -5594,7 +5587,7 @@ var BankTransactionMobileListItem = ({
         }
       }
     },
-    /* @__PURE__ */ React71.createElement(
+    /* @__PURE__ */ React70.createElement(
       "span",
       {
         className: `${className}__heading`,
@@ -5602,22 +5595,22 @@ var BankTransactionMobileListItem = ({
         role: "button",
         style: { height: headingHeight }
       },
-      /* @__PURE__ */ React71.createElement("div", { className: `${className}__heading__content`, ref: headingRowRef }, /* @__PURE__ */ React71.createElement("div", { className: `${className}__heading__main` }, /* @__PURE__ */ React71.createElement(Text, { as: "span", className: `${className}__heading__tx-name` }, bankTransaction.counterparty_name ?? bankTransaction.description), /* @__PURE__ */ React71.createElement(Text, { as: "span", className: `${className}__heading__account-name` }, categorized && bankTransaction.categorization_status ? getAssignedValue2(bankTransaction) : null, !categorized && bankTransaction.account_name), categorized && open && /* @__PURE__ */ React71.createElement(Text, { as: "span", className: `${className}__categorized-name` }, bankTransaction.account_name)), /* @__PURE__ */ React71.createElement("div", { className: `${className}__heading__amount` }, /* @__PURE__ */ React71.createElement(
+      /* @__PURE__ */ React70.createElement("div", { className: `${className}__heading__content`, ref: headingRowRef }, /* @__PURE__ */ React70.createElement("div", { className: `${className}__heading__main` }, /* @__PURE__ */ React70.createElement(Text, { as: "span", className: `${className}__heading__tx-name` }, bankTransaction.counterparty_name ?? bankTransaction.description), /* @__PURE__ */ React70.createElement(Text, { as: "span", className: `${className}__heading__account-name` }, categorized && bankTransaction.categorization_status ? getAssignedValue2(bankTransaction) : null, !categorized && bankTransaction.account_name), categorized && open && /* @__PURE__ */ React70.createElement(Text, { as: "span", className: `${className}__categorized-name` }, bankTransaction.account_name)), /* @__PURE__ */ React70.createElement("div", { className: `${className}__heading__amount` }, /* @__PURE__ */ React70.createElement(
         "span",
         {
           className: `${className}__amount-${isCredit(bankTransaction) ? "credit" : "debit"}`
         },
         isCredit(bankTransaction) ? "+$" : " $",
         centsToDollars(bankTransaction.amount)
-      ), /* @__PURE__ */ React71.createElement("span", { className: `${className}__heading__date` }, formatTime8(parseISO11(bankTransaction.date), DATE_FORMAT2))))
+      ), /* @__PURE__ */ React70.createElement("span", { className: `${className}__heading__date` }, formatTime8(parseISO11(bankTransaction.date), DATE_FORMAT2))))
     ),
-    /* @__PURE__ */ React71.createElement("div", { className: `${className}__expanded-row`, style: { height } }, open && /* @__PURE__ */ React71.createElement(
+    /* @__PURE__ */ React70.createElement("div", { className: `${className}__expanded-row`, style: { height } }, open && /* @__PURE__ */ React70.createElement(
       "div",
       {
         className: `${className}__expanded-row__content`,
         ref: formRowRef
       },
-      /* @__PURE__ */ React71.createElement("div", { className: `${className}__toggle-row` }, /* @__PURE__ */ React71.createElement(
+      /* @__PURE__ */ React70.createElement("div", { className: `${className}__toggle-row` }, /* @__PURE__ */ React70.createElement(
         Toggle,
         {
           name: `purpose-${bankTransaction.id}`,
@@ -5642,8 +5635,8 @@ var BankTransactionMobileListItem = ({
           selected: purpose,
           onChange: onChangePurpose
         }
-      ), /* @__PURE__ */ React71.createElement(CloseButton, { onClick: () => close() })),
-      /* @__PURE__ */ React71.createElement(
+      ), /* @__PURE__ */ React70.createElement(CloseButton, { onClick: () => close() })),
+      /* @__PURE__ */ React70.createElement(
         BankTransactionMobileForms,
         {
           purpose,
@@ -5662,8 +5655,8 @@ var BankTransactionMobileList = ({
   initialLoad
 }) => {
   const transactionToOpenContextData = useTransactionToOpen();
-  return /* @__PURE__ */ React72.createElement(TransactionToOpenContext.Provider, { value: transactionToOpenContextData }, /* @__PURE__ */ React72.createElement("ul", { className: "Layer__bank-transactions__mobile-list" }, bankTransactions?.map(
-    (bankTransaction, index) => /* @__PURE__ */ React72.createElement(
+  return /* @__PURE__ */ React71.createElement(TransactionToOpenContext.Provider, { value: transactionToOpenContextData }, /* @__PURE__ */ React71.createElement("ul", { className: "Layer__bank-transactions__mobile-list" }, bankTransactions?.map(
+    (bankTransaction, index) => /* @__PURE__ */ React71.createElement(
       BankTransactionMobileListItem,
       {
         index,
@@ -5678,7 +5671,7 @@ var BankTransactionMobileList = ({
 };
 
 // src/components/BankTransactionsTable/BankTransactionsTable.tsx
-import React73 from "react";
+import React72 from "react";
 var BankTransactionsTable = ({
   categorizeView,
   editable,
@@ -5690,15 +5683,15 @@ var BankTransactionsTable = ({
   showDescriptions = false,
   showReceiptUploads = false
 }) => {
-  return /* @__PURE__ */ React73.createElement(
+  return /* @__PURE__ */ React72.createElement(
     "table",
     {
       width: "100%",
       className: "Layer__table Layer__bank-transactions__table with-cell-separators"
     },
-    /* @__PURE__ */ React73.createElement("thead", null, /* @__PURE__ */ React73.createElement("tr", null, /* @__PURE__ */ React73.createElement("th", { className: "Layer__table-header Layer__bank-transactions__date-col" }, "Date"), /* @__PURE__ */ React73.createElement("th", { className: "Layer__table-header Layer__bank-transactions__tx-col" }, "Transaction"), /* @__PURE__ */ React73.createElement("th", { className: "Layer__table-header Layer__bank-transactions__account-col" }, "Account"), /* @__PURE__ */ React73.createElement("th", { className: "Layer__table-header Layer__table-cell--amount Layer__table-cell__amount-col" }, "Amount"), categorizeView && editable ? /* @__PURE__ */ React73.createElement("th", { className: "Layer__table-header Layer__table-header--primary Layer__table-cell__category-col" }, "Categorize") : /* @__PURE__ */ React73.createElement("th", { className: "Layer__table-header Layer__table-cell__category-col" }, "Category"))),
-    /* @__PURE__ */ React73.createElement("tbody", null, !isLoading && bankTransactions?.map(
-      (bankTransaction, index) => /* @__PURE__ */ React73.createElement(
+    /* @__PURE__ */ React72.createElement("thead", null, /* @__PURE__ */ React72.createElement("tr", null, /* @__PURE__ */ React72.createElement("th", { className: "Layer__table-header Layer__bank-transactions__date-col" }, "Date"), /* @__PURE__ */ React72.createElement("th", { className: "Layer__table-header Layer__bank-transactions__tx-col" }, "Transaction"), /* @__PURE__ */ React72.createElement("th", { className: "Layer__table-header Layer__bank-transactions__account-col" }, "Account"), /* @__PURE__ */ React72.createElement("th", { className: "Layer__table-header Layer__table-cell--amount Layer__table-cell__amount-col" }, "Amount"), categorizeView && editable ? /* @__PURE__ */ React72.createElement("th", { className: "Layer__table-header Layer__table-header--primary Layer__table-cell__category-col" }, "Categorize") : /* @__PURE__ */ React72.createElement("th", { className: "Layer__table-header Layer__table-cell__category-col" }, "Category"))),
+    /* @__PURE__ */ React72.createElement("tbody", null, !isLoading && bankTransactions?.map(
+      (bankTransaction, index) => /* @__PURE__ */ React72.createElement(
         BankTransactionRow,
         {
           initialLoad,
@@ -5718,7 +5711,7 @@ var BankTransactionsTable = ({
 };
 
 // src/components/Container/Container.tsx
-import React74, { forwardRef as forwardRef4 } from "react";
+import React73, { forwardRef as forwardRef4 } from "react";
 import classNames30 from "classnames";
 var Container = forwardRef4(
   ({
@@ -5740,7 +5733,7 @@ var Container = forwardRef4(
     );
     const { theme } = useLayerContext();
     const themeStyles = parseStylesFromThemeConfig(theme);
-    return /* @__PURE__ */ React74.createElement(
+    return /* @__PURE__ */ React73.createElement(
       "div",
       {
         ref,
@@ -5753,7 +5746,7 @@ var Container = forwardRef4(
 );
 
 // src/components/Container/Header.tsx
-import React75, { forwardRef as forwardRef5 } from "react";
+import React74, { forwardRef as forwardRef5 } from "react";
 import classNames31 from "classnames";
 var Header = forwardRef5(
   ({ className, children, style, layout }, ref) => {
@@ -5762,18 +5755,18 @@ var Header = forwardRef5(
       layout && `Layer__component-header--${layout}`,
       className
     );
-    return /* @__PURE__ */ React75.createElement("header", { ref, className: baseClassName, style }, children);
+    return /* @__PURE__ */ React74.createElement("header", { ref, className: baseClassName, style }, children);
   }
 );
 
 // src/components/Loader/Loader.tsx
-import React76 from "react";
+import React75 from "react";
 var Loader2 = ({ children, size = 28 }) => {
-  return /* @__PURE__ */ React76.createElement("span", { className: "Layer__loader" }, /* @__PURE__ */ React76.createElement(Loader_default, { size, className: "Layer__anim--rotating" }), children);
+  return /* @__PURE__ */ React75.createElement("span", { className: "Layer__loader" }, /* @__PURE__ */ React75.createElement(Loader_default, { size, className: "Layer__anim--rotating" }), children);
 };
 
 // src/components/Pagination/Pagination.tsx
-import React78 from "react";
+import React77 from "react";
 
 // src/hooks/usePagination/usePagination.ts
 import { useMemo as useMemo4 } from "react";
@@ -5821,8 +5814,8 @@ var usePagination = ({
 };
 
 // src/icons/ChevronLeft.tsx
-import * as React77 from "react";
-var ChevronLeft = ({ size = 18, ...props }) => /* @__PURE__ */ React77.createElement(
+import * as React76 from "react";
+var ChevronLeft = ({ size = 18, ...props }) => /* @__PURE__ */ React76.createElement(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -5832,7 +5825,7 @@ var ChevronLeft = ({ size = 18, ...props }) => /* @__PURE__ */ React77.createEle
     fill: "none",
     ...props
   },
-  /* @__PURE__ */ React77.createElement(
+  /* @__PURE__ */ React76.createElement(
     "path",
     {
       d: "M11.25 13.5L6.75 9L11.25 4.5",
@@ -5866,7 +5859,7 @@ var Pagination = ({
     return;
   }
   let lastPage = paginationRange[paginationRange.length - 1];
-  return /* @__PURE__ */ React78.createElement("ul", { className: "Layer__pagination" }, /* @__PURE__ */ React78.createElement(
+  return /* @__PURE__ */ React77.createElement("ul", { className: "Layer__pagination" }, /* @__PURE__ */ React77.createElement(
     "li",
     {
       key: `page-prev`,
@@ -5878,10 +5871,10 @@ var Pagination = ({
       ),
       onClick: () => onPageChange(currentPage - 1)
     },
-    /* @__PURE__ */ React78.createElement(ChevronLeft_default, { size: 12 })
+    /* @__PURE__ */ React77.createElement(ChevronLeft_default, { size: 12 })
   ), paginationRange.map((pageNumber, idx) => {
     if (pageNumber === DOTS) {
-      return /* @__PURE__ */ React78.createElement(
+      return /* @__PURE__ */ React77.createElement(
         "li",
         {
           key: `${idx}-page-${pageNumber}`,
@@ -5890,7 +5883,7 @@ var Pagination = ({
         "\u2026"
       );
     }
-    return /* @__PURE__ */ React78.createElement(
+    return /* @__PURE__ */ React77.createElement(
       "li",
       {
         key: `page-${pageNumber}`,
@@ -5905,7 +5898,7 @@ var Pagination = ({
       },
       pageNumber
     );
-  }), /* @__PURE__ */ React78.createElement(
+  }), /* @__PURE__ */ React77.createElement(
     "li",
     {
       key: `page-last`,
@@ -5917,13 +5910,55 @@ var Pagination = ({
       ),
       onClick: () => onPageChange(currentPage + 1)
     },
-    /* @__PURE__ */ React78.createElement(ChevronRight_default, { size: 12 })
+    /* @__PURE__ */ React77.createElement(ChevronRight_default, { size: 12 })
   ));
 };
 
 // src/components/BankTransactions/BankTransactionsHeader.tsx
 import React82, { useState as useState24 } from "react";
 
+// src/icons/DownloadCloud.tsx
+import * as React78 from "react";
+var DownloadCloud = ({ size = 18, ...props }) => /* @__PURE__ */ React78.createElement(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 18 18",
+    fill: "none",
+    ...props,
+    width: size,
+    height: size
+  },
+  /* @__PURE__ */ React78.createElement(
+    "path",
+    {
+      d: "M6 12.75L9 15.75L12 12.75",
+      stroke: "currentColor",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ),
+  /* @__PURE__ */ React78.createElement(
+    "path",
+    {
+      d: "M9 9V15.75",
+      stroke: "currentColor",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ),
+  /* @__PURE__ */ React78.createElement(
+    "path",
+    {
+      d: "M15.66 13.5675C16.3121 13.109 16.801 12.4546 17.056 11.6994C17.3109 10.9441 17.3186 10.1273 17.0778 9.36737C16.837 8.60748 16.3604 7.94407 15.7171 7.47342C15.0737 7.00278 14.2971 6.74938 13.5 6.75H12.555C12.3294 5.87091 11.9074 5.05444 11.3206 4.36206C10.7338 3.66969 9.99762 3.11945 9.16742 2.75277C8.33721 2.38609 7.43464 2.21252 6.52766 2.24514C5.62067 2.27776 4.7329 2.51571 3.93118 2.94107C3.12946 3.36644 2.43468 3.96814 1.89915 4.70087C1.36362 5.43361 1.0013 6.27829 0.839456 7.17132C0.677613 8.06434 0.720468 8.98245 0.964796 9.85652C1.20912 10.7306 1.64856 11.5378 2.25001 12.2175",
+      stroke: "currentColor",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  )
+);
+var DownloadCloud_default = DownloadCloud;
+
 // src/utils/business.ts
 import { differenceInCalendarMonths, parseISO as parseISO12, startOfMonth as startOfMonth2 } from "date-fns";
 var getActivationDate = (business) => {
@@ -7554,7 +7589,9 @@ var LinkedAccountThumb = ({
 import classNames38 from "classnames";
 var LinkedAccountsContent = ({
   asWidget,
-  showLedgerBalance
+  showLedgerBalance,
+  showUnlinkItem,
+  showBreakConnection
 }) => {
   const {
     data,
@@ -7570,7 +7607,9 @@ var LinkedAccountsContent = ({
   const linkedAccountsNewAccountClassName = classNames38(
     "Layer__linked-accounts__new-account",
     asWidget && "--as-widget",
-    showLedgerBalance && "--show-ledger-balance"
+    showLedgerBalance && "--show-ledger-balance",
+    showUnlinkItem && "--show-unlink-item",
+    showBreakConnection && "--show-break-connection"
   );
   return /* @__PURE__ */ React97.createElement("div", { className: "Layer__linked-accounts__list" }, data?.map((account, index) => {
     let pillConfig;
@@ -7602,69 +7641,68 @@ var LinkedAccountsContent = ({
           {
             name: "Repair connection",
             action: async () => {
-              if (account.connection_external_id)
+              if (account.connection_external_id) {
                 await repairConnection(
                   account.external_account_source,
                   account.connection_external_id
                 );
+              }
             }
           }
         ]
       };
     }
+    const additionalConfigs = [
+      {
+        name: "Unlink account",
+        action: async () => {
+          if (confirm(
+            "Please confirm you wish to remove this financial account"
+          )) {
+            await unlinkAccount2(account.external_account_source, account.id);
+          }
+        }
+      }
+    ];
+    if (showUnlinkItem) {
+      additionalConfigs.push({
+        name: `Unlink all accounts under this ${account.institution?.name} connection`,
+        action: async () => {
+          if (account.connection_external_id && confirm(
+            `Please confirm you wish to remove all accounts belonging to ${account.institution?.name || "this institution"}`
+          )) {
+            await removeConnection(
+              account.external_account_source,
+              account.connection_external_id
+            );
+          }
+        }
+      });
+    }
+    if (environment === "staging" && !account.connection_needs_repair_as_of && account.external_account_source === "PLAID" && showBreakConnection) {
+      additionalConfigs.push({
+        name: "Break connection (test utility)",
+        action: async () => {
+          if (account.connection_external_id) {
+            await breakConnection(
+              account.external_account_source,
+              account.connection_external_id
+            );
+          } else {
+            console.warn(
+              "Account doesn't have defined connection_external_id"
+            );
+          }
+        }
+      });
+    }
     return /* @__PURE__ */ React97.createElement(
       LinkedAccountOptions,
       {
         key: `linked-acc-${index}`,
         config: [
-          ...account.external_account_source === "PLAID" ? [
-            {
-              name: "Unlink account",
-              action: async () => {
-                if (!confirm(
-                  "Please confirm you wish to remove this financial account"
-                )) {
-                  return;
-                }
-                await unlinkAccount2(
-                  account.external_account_source,
-                  account.id
-                );
-              }
-            },
-            {
-              name: `Unlink all accounts under this ${account.institution?.name} connection`,
-              action: async () => {
-                if (!account.connection_external_id || !confirm(
-                  `Please confirm you wish to remove all accounts belonging to ${account.institution?.name || "this institution"}`
-                )) {
-                  return;
-                }
-                await removeConnection(
-                  account.external_account_source,
-                  account.connection_external_id
-                );
-              }
-            }
-          ] : [],
-          ...pillConfig ? pillConfig.config : [],
-          ...environment === "staging" && !account.connection_needs_repair_as_of && account.external_account_source === "PLAID" ? [
-            {
-              name: "Break connection (test utility)",
-              action: async () => {
-                if (account.connection_external_id) {
-                  await breakConnection(
-                    account.external_account_source,
-                    account.connection_external_id
-                  );
-                } else {
-                  console.warn(
-                    "Account doesn't have defined connection_external_id"
-                  );
-                }
-              }
-            }
-          ] : []
+          ...additionalConfigs,
+          ...pillConfig ? pillConfig.config : []
         ],
         showLedgerBalance
       },
@@ -7699,7 +7737,9 @@ var LinkedAccounts = (props) => {
 var LinkedAccountsComponent = ({
   asWidget,
   elevated,
-  showLedgerBalance = true
+  showLedgerBalance = true,
+  showUnlinkItem = false,
+  showBreakConnection = false
 }) => {
   const { isLoading, error, isValidating, refetchAccounts } = useContext9(
     LinkedAccountsContext
@@ -7724,7 +7764,9 @@ var LinkedAccountsComponent = ({
     LinkedAccountsContent,
     {
       asWidget,
-      showLedgerBalance
+      showLedgerBalance,
+      showUnlinkItem,
+      showBreakConnection
     }
   ) : null);
 };
@@ -8779,6 +8821,7 @@ var ProfitAndLossDatePicker = () => {
   return /* @__PURE__ */ React101.createElement(
     DateMonthPicker,
     {
+      key: dateRange.startDate.toISOString(),
       dateRange,
       changeDateRange,
       minDate
@@ -11533,13 +11576,6 @@ var LedgerAccount = ({
         className: "Layer__ledger-account__title"
       },
       entry?.name ?? ""
-    ), /* @__PURE__ */ React130.createElement(
-      Button,
-      {
-        variant: "secondary" /* secondary */,
-        rightIcon: /* @__PURE__ */ React130.createElement(DownloadCloud_default, { size: 12 })
-      },
-      "Download"
     )), /* @__PURE__ */ React130.createElement("div", { className: "Layer__ledger-account__balance-container" }, /* @__PURE__ */ React130.createElement(
       Text,
       {
@@ -11670,6 +11706,25 @@ var JournalContext = createContext10({
 
 // src/hooks/useJournal/useJournal.tsx
 import { useState as useState42 } from "react";
+
+// src/utils/journal.ts
+var getAccountIdentifierPayload = (journalLineItem) => {
+  if (journalLineItem.account_identifier.id) {
+    return {
+      type: "AccountId",
+      id: journalLineItem.account_identifier.id
+    };
+  }
+  if (journalLineItem.account_identifier.stable_name) {
+    return {
+      type: "StableName",
+      stable_name: journalLineItem.account_identifier.stable_name
+    };
+  }
+  throw new Error("Invalid account identifier");
+};
+
+// src/hooks/useJournal/useJournal.tsx
 import useSWR10 from "swr";
 var useJournal = () => {
   const { auth, businessId, apiUrl } = useLayerContext();
@@ -11854,10 +11909,7 @@ var useJournal = () => {
         ...form.data,
         line_items: form.data.line_items?.map((line) => ({
           ...line,
-          account_identifier: {
-            type: "StableName",
-            stable_name: line.account_identifier.stable_name
-          }
+          account_identifier: getAccountIdentifierPayload(line)
         }))
       });
     }
@@ -12429,15 +12481,7 @@ var JournalTable = ({
       sidebarIsOpen: Boolean(selectedEntryId),
       parentRef: containerRef
     },
-    /* @__PURE__ */ React137.createElement(Header, { className: `Layer__${COMPONENT_NAME5}__header` }, /* @__PURE__ */ React137.createElement(Heading, { className: `Layer__${COMPONENT_NAME5}__title` }, "Journal"), /* @__PURE__ */ React137.createElement("div", { className: `Layer__${COMPONENT_NAME5}__actions` }, /* @__PURE__ */ React137.createElement(
-      Button,
-      {
-        variant: "secondary" /* secondary */,
-        disabled: isLoading,
-        rightIcon: /* @__PURE__ */ React137.createElement(DownloadCloud_default, { size: 12 })
-      },
-      "Download"
-    ), /* @__PURE__ */ React137.createElement(Button, { onClick: () => addEntry(), disabled: isLoading }, "Add Entry"))),
+    /* @__PURE__ */ React137.createElement(Header, { className: `Layer__${COMPONENT_NAME5}__header` }, /* @__PURE__ */ React137.createElement(Heading, { className: `Layer__${COMPONENT_NAME5}__title` }, "Journal"), /* @__PURE__ */ React137.createElement("div", { className: `Layer__${COMPONENT_NAME5}__actions` }, /* @__PURE__ */ React137.createElement(Button, { onClick: () => addEntry(), disabled: isLoading }, "Add Entry"))),
     /* @__PURE__ */ React137.createElement("table", { className: "Layer__table Layer__table--hover-effect Layer__journal__table" }, /* @__PURE__ */ React137.createElement("thead", null, /* @__PURE__ */ React137.createElement("tr", null, /* @__PURE__ */ React137.createElement("th", { className: "Layer__table-header" }), /* @__PURE__ */ React137.createElement("th", { className: "Layer__table-header" }, "Id"), /* @__PURE__ */ React137.createElement("th", { className: "Layer__table-header" }, "Date"), /* @__PURE__ */ React137.createElement("th", { className: "Layer__table-header" }, "Transaction"), /* @__PURE__ */ React137.createElement("th", { className: "Layer__table-header" }, "Account"), /* @__PURE__ */ React137.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Debit"), /* @__PURE__ */ React137.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Credit"))), /* @__PURE__ */ React137.createElement("tbody", null, !error && data?.map((entry, idx) => {
       return /* @__PURE__ */ React137.createElement(
         JournalRow,
@@ -12772,13 +12816,12 @@ var ActionableRow = ({
 // src/components/Onboarding/ConnectAccount.tsx
 var ConnectAccount = ({
   onboardingStep,
-  onTransactionsToReviewClick,
-  currentMonthOnly = true
+  onTransactionsToReviewClick
 }) => {
   const { addConnection } = useContext30(LinkedAccountsContext);
   const { data, isLoading } = useBankTransactions();
   const transactionsToReview = useMemo17(
-    () => countTransactionsToReview({ transactions: data, currentMonthOnly }),
+    () => countTransactionsToReview({ transactions: data }),
     [data, isLoading]
   );
   if (onboardingStep === "connectAccount") {
@@ -13253,7 +13296,7 @@ var TasksComponent = () => {
 import React160, { useState as useState50 } from "react";
 
 // src/components/TransactionToReviewCard/TransactionToReviewCard.tsx
-import React157, { useEffect as useEffect30, useMemo as useMemo19, useState as useState49 } from "react";
+import React157, { useContext as useContext37, useEffect as useEffect30, useMemo as useMemo19 } from "react";
 
 // src/components/BadgeLoader/BadgeLoader.tsx
 import React155 from "react";
@@ -13282,36 +13325,24 @@ var NotificationCard = ({
 // src/components/TransactionToReviewCard/TransactionToReviewCard.tsx
 var TransactionToReviewCard = ({
   onClick,
-  currentMonthOnly = true
+  usePnlDateRange
 }) => {
-  const [loaded, setLoaded] = useState49("initiated");
   const {
     data,
     isLoading,
+    loadingStatus,
     error,
     refetch,
     activate: activateBankTransactions
-  } = useBankTransactions();
+  } = useBankTransactionsContext();
+  const { dateRange: contextDateRange } = useContext37(ProfitAndLoss.Context);
+  const dateRange = usePnlDateRange ? contextDateRange : void 0;
   useEffect30(() => {
     activateBankTransactions();
   }, []);
-  useEffect30(() => {
-    if (!isLoading && data && data?.length > 0) {
-      setLoaded("complete");
-      return;
-    }
-    if (isLoading && loaded === "initiated") {
-      setLoaded("loading");
-      return;
-    }
-    if (!isLoading && loaded !== "initiated") {
-      setLoaded("complete");
-      return;
-    }
-  }, [isLoading]);
   const toReview = useMemo19(
-    () => countTransactionsToReview({ transactions: data, currentMonthOnly }),
-    [data, isLoading]
+    () => countTransactionsToReview({ transactions: data, dateRange }),
+    [data, isLoading, dateRange]
   );
   return /* @__PURE__ */ React157.createElement(
     NotificationCard,
@@ -13320,21 +13351,18 @@ var TransactionToReviewCard = ({
       onClick: () => onClick && onClick()
     },
     /* @__PURE__ */ React157.createElement(Text, { size: "sm" /* sm */ }, "Transactions to review"),
-    loaded === "initiated" || loaded === "loading" ? /* @__PURE__ */ React157.createElement(BadgeLoader, null) : null,
-    loaded === "complete" && error ? /* @__PURE__ */ React157.createElement(
+    loadingStatus === "initial" || loadingStatus === "loading" ? /* @__PURE__ */ React157.createElement(BadgeLoader, null) : null,
+    loadingStatus === "complete" && error ? /* @__PURE__ */ React157.createElement(
       Badge,
       {
         variant: "error" /* ERROR */,
         size: "small" /* SMALL */,
         icon: /* @__PURE__ */ React157.createElement(RefreshCcw_default, { size: 12 }),
-        onClick: () => {
-          setLoaded("loading");
-          refetch();
-        }
+        onClick: () => refetch()
       },
       "Refresh"
     ) : null,
-    loaded === "complete" && !error && toReview > 0 ? /* @__PURE__ */ React157.createElement(
+    loadingStatus === "complete" && !error && toReview > 0 ? /* @__PURE__ */ React157.createElement(
       Badge,
       {
         variant: "warning" /* WARNING */,
@@ -13344,7 +13372,7 @@ var TransactionToReviewCard = ({
       toReview,
       " pending"
     ) : null,
-    loaded === "complete" && !error && toReview === 0 ? /* @__PURE__ */ React157.createElement(
+    loadingStatus === "complete" && !error && toReview === 0 ? /* @__PURE__ */ React157.createElement(
       Badge,
       {
         variant: "success" /* SUCCESS */,
@@ -13385,7 +13413,13 @@ var AccountingOverview = ({
     {
       onTransactionsToReviewClick
     }
-  ), /* @__PURE__ */ React160.createElement("div", { className: "Layer__accounting-overview__summaries-row" }, /* @__PURE__ */ React160.createElement(ProfitAndLoss.Summaries, { actionable: false }), /* @__PURE__ */ React160.createElement(TransactionToReviewCard, { onClick: onTransactionsToReviewClick })), /* @__PURE__ */ React160.createElement(
+  ), /* @__PURE__ */ React160.createElement("div", { className: "Layer__accounting-overview__summaries-row" }, /* @__PURE__ */ React160.createElement(ProfitAndLoss.Summaries, { actionable: false }), /* @__PURE__ */ React160.createElement(
+    TransactionToReviewCard,
+    {
+      usePnlDateRange: true,
+      onClick: onTransactionsToReviewClick
+    }
+  )), /* @__PURE__ */ React160.createElement(
     Container,
     {
       name: "accounting-overview-profit-and-loss",
@@ -13438,6 +13472,8 @@ var BankTransactionsWithLinkedAccounts = ({
   title = "Bank transactions",
   elevatedLinkedAccounts = true,
   showLedgerBalance = true,
+  showUnlinkItem = false,
+  showBreakConnection = false,
   showDescriptions,
   showReceiptUploads,
   mobileComponent
@@ -13446,7 +13482,9 @@ var BankTransactionsWithLinkedAccounts = ({
     LinkedAccounts,
     {
       elevated: elevatedLinkedAccounts,
-      showLedgerBalance
+      showLedgerBalance,
+      showUnlinkItem,
+      showBreakConnection
     }
   ), /* @__PURE__ */ React161.createElement(
     BankTransactions,
@@ -13460,9 +13498,9 @@ var BankTransactionsWithLinkedAccounts = ({
 };
 
 // src/views/Reports/Reports.tsx
-import React162, { useContext as useContext37, useRef as useRef15, useState as useState51 } from "react";
+import React162, { useContext as useContext38, useRef as useRef15, useState as useState51 } from "react";
 var DownloadButton2 = () => {
-  const { dateRange } = useContext37(ProfitAndLoss.Context);
+  const { dateRange } = useContext38(ProfitAndLoss.Context);
   const { auth, businessId, apiUrl } = useLayerContext();
   const [requestFailed, setRequestFailed] = useState51(false);
   const handleClick = async () => {
@@ -13525,7 +13563,7 @@ var Reports = ({ title = "Reports" }) => {
   ), /* @__PURE__ */ React162.createElement(DownloadButton2, null)), /* @__PURE__ */ React162.createElement(Container, { name: "reports", ref: containerRef }, /* @__PURE__ */ React162.createElement(ReportsPanel, { containerRef }))));
 };
 var ReportsPanel = ({ containerRef }) => {
-  const { sidebarScope } = useContext37(ProfitAndLoss.Context);
+  const { sidebarScope } = useContext38(ProfitAndLoss.Context);
   return /* @__PURE__ */ React162.createElement(
     Panel,
     {