@layerfi/components 0.1.12 → 0.1.14

package/dist/index.js

@@ -827,7 +827,6 @@ var debounce = (fnc, timeout = 300) => {
     }, timeout);
   };
 };
-var convertToStableName = (name) => name.replace(/[`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi, "").replace(/\W+/g, " ").split(/ |\B(?=[A-Z])/).map((word) => word.toLowerCase()).join("_");
 
 // src/components/BankTransactionListItem/BankTransactionListItem.tsx
 var import_react36 = __toESM(require("react"));
@@ -2230,6 +2229,7 @@ var FileInput = ({ text = "Upload", onUpload }) => {
 // src/components/Input/Select.tsx
 var import_react26 = __toESM(require("react"));
 var import_react_select2 = __toESM(require("react-select"));
+var import_classnames14 = __toESM(require("classnames"));
 var DropdownIndicator2 = (props) => {
   return /* @__PURE__ */ import_react26.default.createElement(import_react_select2.components.DropdownIndicator, { ...props }, /* @__PURE__ */ import_react26.default.createElement(ChevronDownFill_default, null));
 };
@@ -2241,13 +2241,20 @@ var Select2 = ({
   value,
   onChange,
   disabled,
-  placeholder
+  placeholder,
+  isInvalid,
+  errorMessage
 }) => {
-  return /* @__PURE__ */ import_react26.default.createElement(
+  const baseClassName = (0, import_classnames14.default)(
+    "Layer__select",
+    isInvalid ? "Layer__select--error" : "",
+    className
+  );
+  return /* @__PURE__ */ import_react26.default.createElement(Tooltip, { disabled: !isInvalid || !errorMessage }, /* @__PURE__ */ import_react26.default.createElement(TooltipTrigger, { className: "Layer__input-tooltip" }, /* @__PURE__ */ import_react26.default.createElement(
     import_react_select2.default,
     {
       name,
-      className: `Layer__select ${className ?? ""}`,
+      className: baseClassName,
       classNamePrefix,
       placeholder: placeholder ?? "Select...",
       options,
@@ -2258,7 +2265,7 @@ var Select2 = ({
       components: { DropdownIndicator: DropdownIndicator2 },
       isDisabled: disabled
     }
-  );
+  )), /* @__PURE__ */ import_react26.default.createElement(TooltipContent, { className: "Layer__tooltip" }, errorMessage));
 };
 
 // src/components/MatchForm/MatchForm.tsx
@@ -2288,7 +2295,7 @@ var MatchBadge = ({
 };
 
 // src/components/MatchForm/MatchForm.tsx
-var import_classnames14 = __toESM(require("classnames"));
+var import_classnames15 = __toESM(require("classnames"));
 var import_date_fns6 = require("date-fns");
 var MatchForm = ({
   classNamePrefix,
@@ -2307,7 +2314,7 @@ var MatchForm = ({
       "div",
       {
         key: idx,
-        className: (0, import_classnames14.default)(
+        className: (0, import_classnames15.default)(
           `${classNamePrefix}__match-row`,
           match.id === selectedMatchId ? `${classNamePrefix}__match-row--selected` : ""
         ),
@@ -2366,18 +2373,18 @@ var MatchForm = ({
 
 // src/components/Textarea/Textarea.tsx
 var import_react29 = __toESM(require("react"));
-var import_classnames15 = __toESM(require("classnames"));
+var import_classnames16 = __toESM(require("classnames"));
 var Textarea = ({
   className,
   ...props
 }) => {
-  const baseClassName = (0, import_classnames15.default)("Layer__textarea", className);
+  const baseClassName = (0, import_classnames16.default)("Layer__textarea", className);
   return /* @__PURE__ */ import_react29.default.createElement("textarea", { ...props, className: baseClassName });
 };
 
 // src/components/Toggle/Toggle.tsx
 var import_react30 = __toESM(require("react"));
-var import_classnames16 = __toESM(require("classnames"));
+var import_classnames17 = __toESM(require("classnames"));
 var Toggle = ({
   name,
   options,
@@ -2394,7 +2401,7 @@ var Toggle = ({
     }
   });
   const selectedValue = selected || options[0].value;
-  const baseClassName = (0, import_classnames16.default)(
+  const baseClassName = (0, import_classnames17.default)(
     "Layer__toggle",
     `Layer__toggle--${size}`,
     initialized ? "Layer__toggle--initialized" : ""
@@ -2645,7 +2652,7 @@ var Notification = ({
 };
 
 // src/components/ExpandedBankTransactionRow/ExpandedBankTransactionRow.tsx
-var import_classnames17 = __toESM(require("classnames"));
+var import_classnames18 = __toESM(require("classnames"));
 var hasMatch = (bankTransaction) => {
   return Boolean(
     bankTransaction?.suggested_matches && bankTransaction?.suggested_matches?.length > 0 || bankTransaction?.match
@@ -2898,7 +2905,7 @@ var ExpandedBankTransactionRow = (0, import_react32.forwardRef)(
         /* @__PURE__ */ import_react32.default.createElement("div", { className: `${className}__content-panels` }, /* @__PURE__ */ import_react32.default.createElement(
           "div",
           {
-            className: (0, import_classnames17.default)(
+            className: (0, import_classnames18.default)(
               `${className}__match`,
               `${className}__content-panel`,
               purpose === "match" /* match */ ? `${className}__content-panel--active` : ""
@@ -2920,7 +2927,7 @@ var ExpandedBankTransactionRow = (0, import_react32.forwardRef)(
         ), /* @__PURE__ */ import_react32.default.createElement(
           "div",
           {
-            className: (0, import_classnames17.default)(
+            className: (0, import_classnames18.default)(
               `${className}__splits`,
               `${className}__content-panel`,
               purpose === "categorize" /* categorize */ ? `${className}__content-panel--active` : ""
@@ -3059,7 +3066,7 @@ var SplitTooltipDetails = ({
 };
 
 // src/components/BankTransactionRow/BankTransactionRow.tsx
-var import_classnames18 = __toESM(require("classnames"));
+var import_classnames19 = __toESM(require("classnames"));
 var import_date_fns7 = require("date-fns");
 var isCredit = ({ direction }) => direction === "CREDIT" /* CREDIT */;
 var extractDescriptionForSplit = (category) => {
@@ -3158,7 +3165,7 @@ var BankTransactionRow = ({
   }
   const className = "Layer__bank-transaction-row";
   const openClassName = open ? `${className}--expanded` : "";
-  const rowClassName = (0, import_classnames18.default)(
+  const rowClassName = (0, import_classnames19.default)(
     className,
     bankTransaction.recently_categorized && editable ? "Layer__bank-transaction-row--removing" : "",
     open ? openClassName : "",
@@ -3232,7 +3239,7 @@ var BankTransactionRow = ({
     /* @__PURE__ */ import_react34.default.createElement(
       "td",
       {
-        className: (0, import_classnames18.default)(
+        className: (0, import_classnames19.default)(
           "Layer__table-cell",
           "Layer__table-cell__category-col",
           `${className}__actions-cell`,
@@ -3387,7 +3394,7 @@ var Assignment = ({ bankTransaction }) => {
 };
 
 // src/components/BankTransactionListItem/BankTransactionListItem.tsx
-var import_classnames19 = __toESM(require("classnames"));
+var import_classnames20 = __toESM(require("classnames"));
 var import_date_fns9 = require("date-fns");
 var isCredit2 = ({ direction }) => direction === "CREDIT" /* CREDIT */;
 var BankTransactionListItem = ({
@@ -3446,7 +3453,7 @@ var BankTransactionListItem = ({
   }
   const className = "Layer__bank-transaction-list-item";
   const openClassName = open ? `${className}--expanded` : "";
-  const rowClassName = (0, import_classnames19.default)(
+  const rowClassName = (0, import_classnames20.default)(
     className,
     bankTransaction.recently_categorized ? "Layer__bank-transaction-row--removing" : "",
     open ? openClassName : "",
@@ -3753,10 +3760,10 @@ var hslToHex = (hsl) => {
 };
 
 // src/components/Container/Container.tsx
-var import_classnames20 = __toESM(require("classnames"));
+var import_classnames21 = __toESM(require("classnames"));
 var Container = (0, import_react37.forwardRef)(
   ({ name, className, children, asWidget, elevated = false }, ref) => {
-    const baseClassName = (0, import_classnames20.default)(
+    const baseClassName = (0, import_classnames21.default)(
       "Layer__component Layer__component-container",
       `Layer__${name}`,
       elevated && "Layer__component--elevated",
@@ -3771,10 +3778,10 @@ var Container = (0, import_react37.forwardRef)(
 
 // src/components/Container/Header.tsx
 var import_react38 = __toESM(require("react"));
-var import_classnames21 = __toESM(require("classnames"));
+var import_classnames22 = __toESM(require("classnames"));
 var Header = (0, import_react38.forwardRef)(
   ({ className, children, style }, ref) => {
-    const baseClassName = (0, import_classnames21.default)("Layer__component-header", className);
+    const baseClassName = (0, import_classnames22.default)("Layer__component-header", className);
     return /* @__PURE__ */ import_react38.default.createElement("header", { ref, className: baseClassName, style }, children);
   }
 );
@@ -3922,7 +3929,7 @@ var ChavronRight = ({ size = 18, ...props }) => /* @__PURE__ */ React54.createEl
 var ChevronRight_default = ChavronRight;
 
 // src/components/Pagination/Pagination.tsx
-var import_classnames22 = __toESM(require("classnames"));
+var import_classnames23 = __toESM(require("classnames"));
 var Pagination = ({
   onPageChange,
   totalCount,
@@ -3947,7 +3954,7 @@ var Pagination = ({
     "li",
     {
       key: `page-prev`,
-      className: (0, import_classnames22.default)(
+      className: (0, import_classnames23.default)(
         "Layer__pagination-item Layer__pagination-arrow Layer__pagination-arrow--previous",
         {
           disabled: currentPage === 1
@@ -3971,7 +3978,7 @@ var Pagination = ({
       "li",
       {
         key: `page-${pageNumber}`,
-        className: (0, import_classnames22.default)("Layer__pagination-item", {
+        className: (0, import_classnames23.default)("Layer__pagination-item", {
           selected: pageNumber === currentPage
         }),
         onClick: () => {
@@ -3986,7 +3993,7 @@ var Pagination = ({
     "li",
     {
       key: `page-last`,
-      className: (0, import_classnames22.default)(
+      className: (0, import_classnames23.default)(
         "Layer__pagination-item Layer__pagination-arrow Layer__pagination-arrow--next",
         {
           disabled: currentPage === lastPage
@@ -4325,7 +4332,7 @@ var useLinkedAccounts = () => {
   const exchangePublicToken = async (publicToken, metadata) => {
     await Layer.exchangePlaidPublicToken(apiUrl, auth?.access_token, {
       params: { businessId },
-      body: { public_token: publicToken, institution_id: metadata.institution }
+      body: { public_token: publicToken, institution: metadata.institution }
     });
     refetchAccounts();
   };
@@ -4484,7 +4491,7 @@ var MoreVertical_default = MoreVertical;
 
 // src/components/HoverMenu/HoverMenu.tsx
 var import_react47 = __toESM(require("react"));
-var import_classnames23 = __toESM(require("classnames"));
+var import_classnames24 = __toESM(require("classnames"));
 var HoverMenu = ({
   children,
   config,
@@ -4493,7 +4500,7 @@ var HoverMenu = ({
 }) => {
   const [openMenu, setOpenMenu] = (0, import_react47.useState)(false);
   const hoverMenuRef = (0, import_react47.useRef)(null);
-  const hoverMenuClassName = (0, import_classnames23.default)(
+  const hoverMenuClassName = (0, import_classnames24.default)(
     "Layer__hover-menu",
     openMenu && "Layer__hover-menu--open"
   );
@@ -4856,13 +4863,13 @@ var InstitutionIcon = ({ size = 18, ...props }) => /* @__PURE__ */ React62.creat
 var InstitutionIcon_default = InstitutionIcon;
 
 // src/components/LinkedAccountThumb/LinkedAccountThumb.tsx
-var import_classnames24 = __toESM(require("classnames"));
+var import_classnames25 = __toESM(require("classnames"));
 var AccountNumber = ({ accountNumber }) => /* @__PURE__ */ import_react49.default.createElement("div", { className: "account-number" }, /* @__PURE__ */ import_react49.default.createElement(Text, { size: "sm" }, "\u2022\u2022\u2022 ", accountNumber));
 var LinkedAccountThumb = ({
   account,
   asWidget
 }) => {
-  const linkedAccountThumbClassName = (0, import_classnames24.default)(
+  const linkedAccountThumbClassName = (0, import_classnames25.default)(
     "Layer__linked-account-thumb",
     asWidget && "--as-widget"
   );
@@ -4907,7 +4914,7 @@ var LinkedAccountThumb = ({
 };
 
 // src/components/LinkedAccounts/LinkedAccounts.tsx
-var import_classnames25 = __toESM(require("classnames"));
+var import_classnames26 = __toESM(require("classnames"));
 var COMPONENT_NAME2 = "linked-accounts";
 var LinkedAccounts = ({ asWidget, elevated }) => {
   const {
@@ -4924,7 +4931,7 @@ var LinkedAccounts = ({ asWidget, elevated }) => {
     { name: "Renew link", action: renewLinkAccount },
     { name: "Unlink", action: unlinkAccount }
   ];
-  const linkedAccountsNewAccountClassName = (0, import_classnames25.default)(
+  const linkedAccountsNewAccountClassName = (0, import_classnames26.default)(
     "Layer__linked-accounts__new-account",
     asWidget && "--as-widget"
   );
@@ -4967,7 +4974,7 @@ var LinkedAccounts = ({ asWidget, elevated }) => {
 };
 
 // src/components/ProfitAndLoss/ProfitAndLoss.tsx
-var import_react64 = __toESM(require("react"));
+var import_react65 = __toESM(require("react"));
 
 // src/hooks/useProfitAndLoss/useProfitAndLoss.tsx
 var import_react51 = require("react");
@@ -5025,12 +5032,12 @@ var applyShare = (items, total) => {
   });
 };
 
-// src/hooks/useProfitAndLoss/useProfitAndLoss.tsx
+// src/hooks/useProfitAndLoss/useProfitAndLossQuery.tsx
 var import_date_fns10 = require("date-fns");
 var import_swr5 = __toESM(require("swr"));
-var useProfitAndLoss = ({
-  startDate: initialStartDate,
-  endDate: initialEndDate,
+var useProfitAndLossQuery = ({
+  startDate,
+  endDate,
   tagFilter,
   reportingBasis
 } = {
@@ -5038,17 +5045,6 @@ var useProfitAndLoss = ({
   endDate: (0, import_date_fns10.endOfMonth)(/* @__PURE__ */ new Date())
 }) => {
   const { auth, businessId, apiUrl } = useLayerContext();
-  const [startDate, setStartDate] = (0, import_react51.useState)(
-    initialStartDate || (0, import_date_fns10.startOfMonth)(Date.now())
-  );
-  const [endDate, setEndDate] = (0, import_react51.useState)(
-    initialEndDate || (0, import_date_fns10.endOfMonth)(Date.now())
-  );
-  const [filters, setFilters] = (0, import_react51.useState)({
-    expenses: void 0,
-    revenue: void 0
-  });
-  const [sidebarScope, setSidebarScope] = (0, import_react51.useState)(void 0);
   const {
     data: rawData,
     isLoading,
@@ -5062,15 +5058,83 @@ var useProfitAndLoss = ({
     Layer.getProfitAndLoss(apiUrl, auth?.access_token, {
       params: {
         businessId,
-        startDate: (0, import_date_fns10.formatISO)(startDate),
-        endDate: (0, import_date_fns10.formatISO)(endDate),
+        startDate: (0, import_date_fns10.formatISO)(startDate.valueOf()),
+        endDate: (0, import_date_fns10.formatISO)(endDate.valueOf()),
         tagKey: tagFilter?.key,
         tagValues: tagFilter?.values?.join(","),
         reportingBasis
       }
     })
   );
-  const { data, error } = rawData || {};
+  const refetch = () => {
+    mutate();
+  };
+  return {
+    startDate,
+    endDate,
+    data: rawData?.data,
+    isLoading,
+    isValidating,
+    error: rawError,
+    refetch
+  };
+};
+
+// src/hooks/useProfitAndLoss/useProfitAndLoss.tsx
+var import_date_fns11 = require("date-fns");
+var useProfitAndLoss = ({
+  startDate: initialStartDate,
+  endDate: initialEndDate,
+  tagFilter,
+  reportingBasis,
+  fetchMultipleMonths = false
+} = {
+  startDate: (0, import_date_fns11.startOfMonth)(/* @__PURE__ */ new Date()),
+  endDate: (0, import_date_fns11.endOfMonth)(/* @__PURE__ */ new Date())
+}) => {
+  const [startDate, setStartDate] = (0, import_react51.useState)(
+    initialStartDate || (0, import_date_fns11.startOfMonth)(Date.now())
+  );
+  const [endDate, setEndDate] = (0, import_react51.useState)(
+    initialEndDate || (0, import_date_fns11.endOfMonth)(Date.now())
+  );
+  const [filters, setFilters] = (0, import_react51.useState)({
+    expenses: void 0,
+    revenue: void 0
+  });
+  const [sidebarScope, setSidebarScope] = (0, import_react51.useState)(void 0);
+  const { data, isLoading, isValidating, error, refetch } = useProfitAndLossQuery({
+    startDate,
+    endDate,
+    tagFilter,
+    reportingBasis
+  });
+  const changeDateRange = ({
+    startDate: newStartDate,
+    endDate: newEndDate
+  }) => {
+    newStartDate && setStartDate(newStartDate);
+    newEndDate && setEndDate(newEndDate);
+  };
+  const sortBy = (scope, field, direction) => {
+    setFilters({
+      ...filters,
+      [scope]: {
+        ...filters[scope],
+        sortBy: field,
+        sortDirection: direction ?? filters[scope]?.sortDirection === "desc" ? "asc" : "desc"
+      }
+    });
+  };
+  const setFilterTypes = (scope, types) => {
+    setFilters({
+      ...filters,
+      [scope]: {
+        ...filters[scope],
+        types
+      }
+    });
+  };
   const { filteredDataRevenue, filteredTotalRevenue } = (0, import_react51.useMemo)(() => {
     if (!data) {
       return { filteredDataRevenue: [], filteredTotalRevenue: void 0 };
@@ -5145,35 +5209,6 @@ var useProfitAndLoss = ({
     const withShare = applyShare(sorted, total);
     return { filteredDataExpenses: withShare, filteredTotalExpenses: total };
   }, [data, startDate, filters, sidebarScope]);
-  const changeDateRange = ({
-    startDate: newStartDate,
-    endDate: newEndDate
-  }) => {
-    newStartDate && setStartDate(newStartDate);
-    newEndDate && setEndDate(newEndDate);
-  };
-  const refetch = () => {
-    mutate();
-  };
-  const sortBy = (scope, field, direction) => {
-    setFilters({
-      ...filters,
-      [scope]: {
-        ...filters[scope],
-        sortBy: field,
-        sortDirection: direction ?? filters[scope]?.sortDirection === "desc" ? "asc" : "desc"
-      }
-    });
-  };
-  const setFilterTypes = (scope, types) => {
-    setFilters({
-      ...filters,
-      [scope]: {
-        ...filters[scope],
-        types
-      }
-    });
-  };
   return {
     data,
     filteredDataRevenue,
@@ -5182,7 +5217,7 @@ var useProfitAndLoss = ({
     filteredTotalExpenses,
     isLoading,
     isValidating,
-    error: error || rawError,
+    error,
     dateRange: { startDate, endDate },
     refetch,
     changeDateRange,
@@ -5195,7 +5230,350 @@ var useProfitAndLoss = ({
 };
 
 // src/components/ProfitAndLossChart/ProfitAndLossChart.tsx
-var import_react53 = __toESM(require("react"));
+var import_react54 = __toESM(require("react"));
+
+// src/hooks/useProfitAndLoss/useProfitAndLossLTM.tsx
+var import_react52 = require("react");
+var import_date_fns12 = require("date-fns");
+var buildDates = ({ currentDate }) => {
+  const list = [];
+  for (let i = 11; i > 0; i--) {
+    const startDateWithOffset = (0, import_date_fns12.startOfMonth)((0, import_date_fns12.sub)(currentDate, { months: i }));
+    const endDateWithOffset = (0, import_date_fns12.endOfMonth)((0, import_date_fns12.sub)(currentDate, { months: i }));
+    list.push({
+      startDate: startDateWithOffset,
+      endDate: endDateWithOffset
+    });
+  }
+  list.push({
+    startDate: (0, import_date_fns12.startOfMonth)(currentDate),
+    endDate: (0, import_date_fns12.endOfMonth)(currentDate)
+  });
+  return list;
+};
+var useProfitAndLossLTM = ({ currentDate, tagFilter, reportingBasis } = {
+  currentDate: /* @__PURE__ */ new Date()
+}) => {
+  const { businessId } = useLayerContext();
+  const [loaded, setLoaded] = (0, import_react52.useState)("initial");
+  const dates = (0, import_react52.useMemo)(() => {
+    return buildDates({ currentDate });
+  }, [currentDate, businessId, tagFilter, reportingBasis]);
+  const {
+    data: data0,
+    isLoading: isLoading0,
+    error: error0,
+    startDate: startDate0,
+    endDate: endDate0
+  } = useProfitAndLossQuery({
+    startDate: dates[0].startDate,
+    endDate: dates[0].endDate,
+    tagFilter,
+    reportingBasis
+  });
+  const {
+    data: data1,
+    isLoading: isLoading1,
+    error: error1,
+    startDate: startDate1,
+    endDate: endDate1
+  } = useProfitAndLossQuery({
+    startDate: dates[1].startDate,
+    endDate: dates[1].endDate,
+    tagFilter,
+    reportingBasis
+  });
+  const {
+    data: data2,
+    isLoading: isLoading2,
+    error: error2,
+    startDate: startDate2,
+    endDate: endDate2
+  } = useProfitAndLossQuery({
+    startDate: dates[2].startDate,
+    endDate: dates[2].endDate,
+    tagFilter,
+    reportingBasis
+  });
+  const {
+    data: data3,
+    isLoading: isLoading3,
+    error: error3,
+    startDate: startDate3,
+    endDate: endDate3
+  } = useProfitAndLossQuery({
+    startDate: dates[3].startDate,
+    endDate: dates[3].endDate,
+    tagFilter,
+    reportingBasis
+  });
+  const {
+    data: data4,
+    isLoading: isLoading4,
+    error: error4,
+    startDate: startDate4,
+    endDate: endDate4
+  } = useProfitAndLossQuery({
+    startDate: dates[4].startDate,
+    endDate: dates[4].endDate,
+    tagFilter,
+    reportingBasis
+  });
+  const {
+    data: data5,
+    isLoading: isLoading5,
+    error: error5,
+    startDate: startDate5,
+    endDate: endDate5
+  } = useProfitAndLossQuery({
+    startDate: dates[5].startDate,
+    endDate: dates[5].endDate,
+    tagFilter,
+    reportingBasis
+  });
+  const {
+    data: data6,
+    isLoading: isLoading6,
+    error: error6,
+    startDate: startDate6,
+    endDate: endDate6
+  } = useProfitAndLossQuery({
+    startDate: dates[6].startDate,
+    endDate: dates[6].endDate,
+    tagFilter,
+    reportingBasis
+  });
+  const {
+    data: data7,
+    isLoading: isLoading7,
+    error: error7,
+    startDate: startDate7,
+    endDate: endDate7
+  } = useProfitAndLossQuery({
+    startDate: dates[7].startDate,
+    endDate: dates[7].endDate,
+    tagFilter,
+    reportingBasis
+  });
+  const {
+    data: data8,
+    isLoading: isLoading8,
+    error: error8,
+    startDate: startDate8,
+    endDate: endDate8
+  } = useProfitAndLossQuery({
+    startDate: dates[8].startDate,
+    endDate: dates[8].endDate,
+    tagFilter,
+    reportingBasis
+  });
+  const {
+    data: data9,
+    isLoading: isLoading9,
+    error: error9,
+    startDate: startDate9,
+    endDate: endDate9
+  } = useProfitAndLossQuery({
+    startDate: dates[9].startDate,
+    endDate: dates[9].endDate,
+    tagFilter,
+    reportingBasis
+  });
+  const {
+    data: data10,
+    isLoading: isLoading10,
+    error: error10,
+    startDate: startDate10,
+    endDate: endDate10
+  } = useProfitAndLossQuery({
+    startDate: dates[10].startDate,
+    endDate: dates[10].endDate,
+    tagFilter,
+    reportingBasis
+  });
+  const {
+    data: data11,
+    isLoading: isLoading11,
+    error: error11,
+    startDate: startDate11,
+    endDate: endDate11
+  } = useProfitAndLossQuery({
+    startDate: dates[11].startDate,
+    endDate: dates[11].endDate,
+    tagFilter,
+    reportingBasis
+  });
+  const { data, isLoading, error } = (0, import_react52.useMemo)(() => {
+    return {
+      data: [
+        {
+          data: data0,
+          isLoading: isLoading0,
+          error: error0,
+          startDate: startDate0,
+          endDate: endDate0
+        },
+        {
+          data: data1,
+          isLoading: isLoading1,
+          error: error1,
+          startDate: startDate1,
+          endDate: endDate1
+        },
+        {
+          data: data2,
+          isLoading: isLoading2,
+          error: error2,
+          startDate: startDate2,
+          endDate: endDate2
+        },
+        {
+          data: data3,
+          isLoading: isLoading3,
+          error: error3,
+          startDate: startDate3,
+          endDate: endDate3
+        },
+        {
+          data: data4,
+          isLoading: isLoading4,
+          error: error4,
+          startDate: startDate4,
+          endDate: endDate4
+        },
+        {
+          data: data5,
+          isLoading: isLoading5,
+          error: error5,
+          startDate: startDate5,
+          endDate: endDate5
+        },
+        {
+          data: data6,
+          isLoading: isLoading6,
+          error: error6,
+          startDate: startDate6,
+          endDate: endDate6
+        },
+        {
+          data: data7,
+          isLoading: isLoading7,
+          error: error7,
+          startDate: startDate7,
+          endDate: endDate7
+        },
+        {
+          data: data8,
+          isLoading: isLoading8,
+          error: error8,
+          startDate: startDate8,
+          endDate: endDate8
+        },
+        {
+          data: data9,
+          isLoading: isLoading9,
+          error: error9,
+          startDate: startDate9,
+          endDate: endDate9
+        },
+        {
+          data: data10,
+          isLoading: isLoading10,
+          error: error10,
+          startDate: startDate10,
+          endDate: endDate10
+        },
+        {
+          data: data11,
+          isLoading: isLoading11,
+          error: error11,
+          startDate: startDate11,
+          endDate: endDate11
+        }
+      ],
+      error: [
+        error0,
+        error1,
+        error2,
+        error3,
+        error4,
+        error5,
+        error6,
+        error7,
+        error8,
+        error9,
+        error10,
+        error11
+      ].find((x) => !!x),
+      isLoading: [
+        isLoading0,
+        isLoading1,
+        isLoading2,
+        isLoading3,
+        isLoading4,
+        isLoading5,
+        isLoading6,
+        isLoading7,
+        isLoading8,
+        isLoading9,
+        isLoading10,
+        isLoading11
+      ].find((x) => !!x)
+    };
+  }, [
+    data0,
+    data1,
+    data2,
+    data3,
+    data4,
+    data5,
+    data6,
+    data7,
+    data8,
+    data9,
+    data10,
+    data11,
+    isLoading0,
+    isLoading1,
+    isLoading2,
+    isLoading3,
+    isLoading4,
+    isLoading5,
+    isLoading6,
+    isLoading7,
+    isLoading8,
+    isLoading9,
+    isLoading10,
+    isLoading11,
+    error0,
+    error1,
+    error2,
+    error3,
+    error4,
+    error5,
+    error6,
+    error7,
+    error8,
+    error9,
+    error10,
+    error11
+  ]);
+  (0, import_react52.useEffect)(() => {
+    if (isLoading && loaded === "initial") {
+      setLoaded("loading");
+      return;
+    }
+    if (!isLoading && data && !data.find((x) => !x.data && !x.error)) {
+      setLoaded("complete");
+    }
+  }, [data, isLoading]);
+  return {
+    data,
+    isLoading,
+    loaded,
+    error
+  };
+};
 
 // src/utils/format.ts
 var capitalizeFirstLetter = (text) => text.charAt(0).toUpperCase() + text.slice(1);
@@ -5236,211 +5614,188 @@ var humanizeEnum = (text) => {
 };
 
 // src/components/ProfitAndLossChart/Indicator.tsx
-var import_react52 = __toESM(require("react"));
+var import_react53 = __toESM(require("react"));
 var emptyViewBox = { x: 0, y: 0, width: 0, height: 0 };
 var Indicator = ({
-  viewBox = {},
   className,
   animateFrom,
-  setAnimateFrom
+  setAnimateFrom,
+  customCursorSize,
+  setCustomCursorSize,
+  viewBox = {}
 }) => {
   if (!className?.match(/selected/)) {
     return null;
   }
+  const [opacityIndicator, setOpacityIndicator] = (0, import_react53.useState)(0);
   const { x: animateTo = 0, width = 0 } = "x" in viewBox ? viewBox : emptyViewBox;
   const margin = width > 12 ? 4 : 1;
   const boxWidth = width * 2 + margin;
   const multiplier = width > 12 ? 1.2 : 1;
   const xOffset = (boxWidth * multiplier - boxWidth) / 2;
-  const borderRadius = width > 16 ? 8 : width / 2;
-  (0, import_react52.useEffect)(() => {
+  const borderRadius = 6;
+  const rectWidth = `${boxWidth * multiplier}px`;
+  const rectHeight = "calc(100% - 38px)";
+  (0, import_react53.useEffect)(() => {
+    if (Math.abs(animateTo - animateFrom) < 30) {
+      setOpacityIndicator(0);
+    }
     setAnimateFrom(animateTo);
+    setTimeout(() => {
+      setOpacityIndicator(1);
+    }, 200);
   }, [animateTo]);
+  const rectRef = (ref) => {
+    if (ref) {
+      const refRectWidth = ref.getBoundingClientRect().width;
+      const refRectHeight = ref.getBoundingClientRect().height;
+      if (customCursorSize.width !== refRectWidth || customCursorSize.height !== refRectHeight) {
+        setCustomCursorSize(refRectWidth, refRectHeight, actualX - xOffset);
+      }
+    }
+  };
   const actualX = animateFrom === -1 ? animateTo : animateFrom;
-  return /* @__PURE__ */ import_react52.default.createElement(
+  return /* @__PURE__ */ import_react53.default.createElement(
     "rect",
     {
+      ref: rectRef,
       className: "Layer__profit-and-loss-chart__selection-indicator",
       rx: borderRadius,
       ry: borderRadius,
       style: {
-        width: `${boxWidth * multiplier}px`,
+        width: rectWidth,
         // @ts-expect-error -- y is fine but x apparently isn't!
         x: actualX - xOffset,
-        y: 22,
-        height: "calc(100% - 38px)"
+        y: 1,
+        height: rectHeight,
+        opacity: opacityIndicator
       }
     }
   );
 };
 
 // src/components/ProfitAndLossChart/ProfitAndLossChart.tsx
-var import_date_fns11 = require("date-fns");
+var import_classnames27 = __toESM(require("classnames"));
+var import_date_fns13 = require("date-fns");
 var import_recharts = require("recharts");
 var barGap = 4;
 var barSize = 20;
 var ProfitAndLossChart = () => {
   const { getColor } = useLayerContext();
-  const { changeDateRange, dateRange } = (0, import_react53.useContext)(ProfitAndLoss.Context);
-  const thisMonth = (0, import_date_fns11.startOfMonth)(Date.now());
+  const { changeDateRange, dateRange } = (0, import_react54.useContext)(ProfitAndLoss.Context);
+  const [customCursorSize, setCustomCursorSize] = (0, import_react54.useState)({
+    width: 0,
+    height: 0,
+    x: 0
+  });
+  const [barAnimActive, setBarAnimActive] = (0, import_react54.useState)(true);
   const startSelectionMonth = dateRange.startDate.getMonth();
   const endSelectionMonth = dateRange.endDate.getMonth();
-  const monthData = [];
-  monthData.push(
-    useProfitAndLoss({
-      startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 11 })),
-      endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 11 }))
-    })?.data
-  );
-  monthData.push(
-    useProfitAndLoss({
-      startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 10 })),
-      endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 10 }))
-    })?.data
-  );
-  monthData.push(
-    useProfitAndLoss({
-      startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 9 })),
-      endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 9 }))
-    })?.data
-  );
-  monthData.push(
-    useProfitAndLoss({
-      startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 8 })),
-      endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 8 }))
-    })?.data
-  );
-  monthData.push(
-    useProfitAndLoss({
-      startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 7 })),
-      endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 7 }))
-    })?.data
-  );
-  monthData.push(
-    useProfitAndLoss({
-      startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 6 })),
-      endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 6 }))
-    })?.data
-  );
-  monthData.push(
-    useProfitAndLoss({
-      startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 5 })),
-      endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 5 }))
-    })?.data
-  );
-  monthData.push(
-    useProfitAndLoss({
-      startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 4 })),
-      endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 4 }))
-    })?.data
-  );
-  monthData.push(
-    useProfitAndLoss({
-      startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 3 })),
-      endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 3 }))
-    })?.data
-  );
-  monthData.push(
-    useProfitAndLoss({
-      startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 2 })),
-      endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 2 }))
-    })?.data
-  );
-  monthData.push(
-    useProfitAndLoss({
-      startDate: (0, import_date_fns11.startOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 1 })),
-      endDate: (0, import_date_fns11.endOfMonth)((0, import_date_fns11.sub)(thisMonth, { months: 1 }))
-    })?.data
-  );
-  monthData.push(
-    useProfitAndLoss({
-      startDate: thisMonth,
-      endDate: (0, import_date_fns11.endOfMonth)(thisMonth)
-    })?.data
-  );
-  const getMonthName = (pnl) => pnl ? (0, import_date_fns11.format)((0, import_date_fns11.parseISO)(pnl.start_date), "LLL") : "";
+  const { data, loaded } = useProfitAndLossLTM({
+    currentDate: (0, import_date_fns13.startOfMonth)(Date.now())
+  });
+  (0, import_react54.useEffect)(() => {
+    if (loaded === "complete") {
+      setTimeout(() => {
+        setBarAnimActive(false);
+      }, 1e3);
+    }
+  }, [loaded]);
+  const getMonthName = (pnl) => pnl ? (0, import_date_fns13.format)((0, import_date_fns13.parseISO)(pnl.start_date), "LLL") : "";
   const summarizePnL = (pnl) => ({
     name: getMonthName(pnl),
     revenue: pnl?.income.value || 0,
     expenses: Math.abs((pnl?.income.value || 0) - (pnl?.net_profit || 0)),
     netProfit: pnl?.net_profit || 0,
-    selected: !!pnl && (0, import_date_fns11.parseISO)(pnl.start_date).getMonth() >= startSelectionMonth && (0, import_date_fns11.parseISO)(pnl.end_date).getMonth() <= endSelectionMonth
+    selected: !!pnl && (0, import_date_fns13.parseISO)(pnl.start_date).getMonth() >= startSelectionMonth && (0, import_date_fns13.parseISO)(pnl.end_date).getMonth() <= endSelectionMonth
   });
   const onClick = ({ activeTooltipIndex }) => {
-    const selection = monthData[activeTooltipIndex || -1];
-    if (selection) {
-      const { start_date: startDate, end_date: endDate } = selection;
+    const selection = data[activeTooltipIndex || -1];
+    if (selection && selection.data) {
+      const { start_date, end_date } = selection.data;
       changeDateRange({
-        startDate: (0, import_date_fns11.parseISO)(startDate),
-        endDate: (0, import_date_fns11.parseISO)(endDate)
+        startDate: (0, import_date_fns13.parseISO)(start_date),
+        endDate: (0, import_date_fns13.parseISO)(end_date)
       });
     }
   };
-  const CustomTooltip = ({
-    active,
-    payload,
-    label
-  }) => {
+  const CustomTooltip = ({ active, payload }) => {
     if (active && payload && payload.length) {
       const netProfit = payload[0].payload.netProfit ?? 0;
       const netProfitClass = netProfit > 0 ? "positive" : netProfit < 0 ? "negative" : "";
-      return /* @__PURE__ */ import_react53.default.createElement("div", { className: "Layer__chart__tooltip" }, /* @__PURE__ */ import_react53.default.createElement("ul", { className: "Layer__chart__tooltip-list" }, /* @__PURE__ */ import_react53.default.createElement("li", null, /* @__PURE__ */ import_react53.default.createElement("label", { className: "Layer__chart__tooltip-label" }, capitalizeFirstLetter(payload[0].name ?? "")), /* @__PURE__ */ import_react53.default.createElement("span", { className: "Layer__chart__tooltip-value" }, "$", centsToDollars(Math.abs(payload[0].value ?? 0)))), /* @__PURE__ */ import_react53.default.createElement("li", null, /* @__PURE__ */ import_react53.default.createElement("label", { className: "Layer__chart__tooltip-label" }, capitalizeFirstLetter(payload[1].name ?? "")), /* @__PURE__ */ import_react53.default.createElement("span", { className: "Layer__chart__tooltip-value" }, "$", centsToDollars(Math.abs(payload[1].value ?? 0)))), /* @__PURE__ */ import_react53.default.createElement("li", null, /* @__PURE__ */ import_react53.default.createElement("label", { className: "Layer__chart__tooltip-label" }, "Net Profit"), /* @__PURE__ */ import_react53.default.createElement("span", { className: `Layer__chart__tooltip-value ${netProfitClass}` }, "$", centsToDollars(netProfit)))));
+      return /* @__PURE__ */ import_react54.default.createElement("div", { className: "Layer__chart__tooltip" }, loaded !== "complete" ? /* @__PURE__ */ import_react54.default.createElement(Text, null, "Loading...") : /* @__PURE__ */ import_react54.default.createElement("ul", { className: "Layer__chart__tooltip-list" }, /* @__PURE__ */ import_react54.default.createElement("li", null, /* @__PURE__ */ import_react54.default.createElement("label", { className: "Layer__chart__tooltip-label" }, capitalizeFirstLetter(payload[0].name ?? "")), /* @__PURE__ */ import_react54.default.createElement("span", { className: "Layer__chart__tooltip-value" }, "$", centsToDollars(Math.abs(payload[0].value ?? 0)))), /* @__PURE__ */ import_react54.default.createElement("li", null, /* @__PURE__ */ import_react54.default.createElement("label", { className: "Layer__chart__tooltip-label" }, capitalizeFirstLetter(payload[1].name ?? "")), /* @__PURE__ */ import_react54.default.createElement("span", { className: "Layer__chart__tooltip-value" }, "$", centsToDollars(Math.abs(payload[1].value ?? 0)))), /* @__PURE__ */ import_react54.default.createElement("li", null, /* @__PURE__ */ import_react54.default.createElement("label", { className: "Layer__chart__tooltip-label" }, "Net Profit"), /* @__PURE__ */ import_react54.default.createElement(
+        "span",
+        {
+          className: `Layer__chart__tooltip-value ${netProfitClass}`
+        },
+        "$",
+        centsToDollars(netProfit)
+      ))));
     }
     return null;
   };
   const CustomizedCursor = (props) => {
-    const { x, width, height } = props;
-    return /* @__PURE__ */ import_react53.default.createElement(
+    const { x, y } = props;
+    const { width, height } = customCursorSize;
+    const offsetX = width * 0.1;
+    return /* @__PURE__ */ import_react54.default.createElement(
       import_recharts.Rectangle,
       {
-        fill: getColor(900)?.hex ?? "#333",
+        fill: "#F7F8FA",
         stroke: "none",
-        x: x + width / 2 - 11,
-        y: height + 44,
-        radius: 2,
-        width: 22,
-        height: 2,
+        x: x + offsetX,
+        y,
+        width,
+        height,
+        radius: 6,
         className: "Layer__chart__tooltip-cursor"
       }
     );
   };
-  const data = (0, import_react53.useMemo)(
-    () => monthData.map(summarizePnL),
-    [
-      startSelectionMonth,
-      endSelectionMonth,
-      ...monthData.map((m) => m?.net_profit)
-    ]
-  );
-  const [animateFrom, setAnimateFrom] = (0, import_react53.useState)(-1);
-  return /* @__PURE__ */ import_react53.default.createElement(
+  const theData = (0, import_react54.useMemo)(() => {
+    if (loaded !== "complete") {
+      return data?.map((x) => ({
+        name: (0, import_date_fns13.format)(x.startDate, "LLL"),
+        revenue: 1,
+        expenses: 1,
+        netProfit: 0,
+        selected: false
+      }));
+    }
+    return data?.map((x) => summarizePnL(x.data));
+  }, [startSelectionMonth, endSelectionMonth, loaded]);
+  const [animateFrom, setAnimateFrom] = (0, import_react54.useState)(-1);
+  return /* @__PURE__ */ import_react54.default.createElement(
     import_recharts.ResponsiveContainer,
     {
-      className: "Layer__chart-container",
+      className: (0, import_classnames27.default)(
+        "Layer__chart-container",
+        loaded !== "complete" && "Layer__chart-container--loading"
+      ),
       width: "100%",
       height: "100%",
       minHeight: 200
     },
-    /* @__PURE__ */ import_react53.default.createElement(
+    /* @__PURE__ */ import_react54.default.createElement(
       import_recharts.BarChart,
       {
         margin: { left: 12, right: 12, bottom: 12 },
-        data,
+        data: theData,
         onClick,
         barGap,
         className: "Layer__profit-and-loss-chart"
       },
-      /* @__PURE__ */ import_react53.default.createElement(
+      /* @__PURE__ */ import_react54.default.createElement(
         import_recharts.Tooltip,
         {
           wrapperClassName: "Layer__chart__tooltip-wrapper",
-          content: /* @__PURE__ */ import_react53.default.createElement(CustomTooltip, null),
-          cursor: /* @__PURE__ */ import_react53.default.createElement(CustomizedCursor, null),
+          content: /* @__PURE__ */ import_react54.default.createElement(CustomTooltip, null),
+          cursor: /* @__PURE__ */ import_react54.default.createElement(CustomizedCursor, null),
           animationDuration: 100,
           animationEasing: "ease-out"
         }
       ),
-      /* @__PURE__ */ import_react53.default.createElement(
+      /* @__PURE__ */ import_react54.default.createElement(
         import_recharts.CartesianGrid,
         {
           vertical: false,
@@ -5448,12 +5803,12 @@ var ProfitAndLossChart = () => {
           strokeDasharray: "5 5"
         }
       ),
-      /* @__PURE__ */ import_react53.default.createElement(
+      /* @__PURE__ */ import_react54.default.createElement(
         import_recharts.Legend,
         {
-          verticalAlign: "top",
+          verticalAlign: "bottom",
           align: "left",
-          wrapperStyle: { top: -24 },
+          wrapperStyle: { bottom: 0 },
           payload: [
             {
               value: "Revenue",
@@ -5468,46 +5823,50 @@ var ProfitAndLossChart = () => {
           ]
         }
       ),
-      /* @__PURE__ */ import_react53.default.createElement(import_recharts.XAxis, { dataKey: "name", tickLine: false }),
-      /* @__PURE__ */ import_react53.default.createElement(
+      /* @__PURE__ */ import_react54.default.createElement(import_recharts.XAxis, { dataKey: "name", tickLine: false }),
+      /* @__PURE__ */ import_react54.default.createElement(
         import_recharts.Bar,
         {
           dataKey: "revenue",
           barSize,
-          isAnimationActive: false,
+          isAnimationActive: barAnimActive,
           radius: [2, 2, 0, 0],
           className: "Layer__profit-and-loss-chart__bar--income"
         },
-        /* @__PURE__ */ import_react53.default.createElement(
+        /* @__PURE__ */ import_react54.default.createElement(
           import_recharts.LabelList,
           {
-            content: /* @__PURE__ */ import_react53.default.createElement(
+            content: /* @__PURE__ */ import_react54.default.createElement(
               Indicator,
               {
+                setCustomCursorSize: (width, height, x) => setCustomCursorSize({ width, height, x }),
+                customCursorSize,
                 animateFrom,
                 setAnimateFrom
               }
             )
           }
         ),
-        data.map((entry) => /* @__PURE__ */ import_react53.default.createElement(
-          import_recharts.Cell,
-          {
-            key: entry.name,
-            className: entry.selected ? "Layer__profit-and-loss-chart__cell--selected" : ""
-          }
-        ))
+        theData?.map((entry) => {
+          return /* @__PURE__ */ import_react54.default.createElement(
+            import_recharts.Cell,
+            {
+              key: entry.name,
+              className: entry.selected ? "Layer__profit-and-loss-chart__cell--selected" : ""
+            }
+          );
+        })
       ),
-      /* @__PURE__ */ import_react53.default.createElement(
+      /* @__PURE__ */ import_react54.default.createElement(
         import_recharts.Bar,
         {
           dataKey: "expenses",
           barSize,
-          isAnimationActive: false,
+          isAnimationActive: barAnimActive,
           radius: [2, 2, 0, 0],
           className: "Layer__profit-and-loss-chart__bar--expenses"
         },
-        data.map((entry) => /* @__PURE__ */ import_react53.default.createElement(
+        theData.map((entry) => /* @__PURE__ */ import_react54.default.createElement(
           import_recharts.Cell,
           {
             key: entry.name,
@@ -5520,19 +5879,19 @@ var ProfitAndLossChart = () => {
 };
 
 // src/components/ProfitAndLossDatePicker/ProfitAndLossDatePicker.tsx
-var import_react54 = __toESM(require("react"));
-var import_date_fns12 = require("date-fns");
+var import_react55 = __toESM(require("react"));
+var import_date_fns14 = require("date-fns");
 var ProfitAndLossDatePicker = () => {
-  const { changeDateRange, dateRange } = (0, import_react54.useContext)(ProfitAndLoss.Context);
-  const [isAnimating, setIsAnimating] = (0, import_react54.useState)(false);
-  const [localDate, setLocalDate] = (0, import_react54.useState)(dateRange.startDate);
-  const [nextOpacity, setNextOpacity] = (0, import_react54.useState)(0);
-  const [currentOpacity, setCurrentOpacity] = (0, import_react54.useState)(1);
-  const [transformStyle, setTransformStyle] = (0, import_react54.useState)({
+  const { changeDateRange, dateRange } = (0, import_react55.useContext)(ProfitAndLoss.Context);
+  const [isAnimating, setIsAnimating] = (0, import_react55.useState)(false);
+  const [localDate, setLocalDate] = (0, import_react55.useState)(dateRange.startDate);
+  const [nextOpacity, setNextOpacity] = (0, import_react55.useState)(0);
+  const [currentOpacity, setCurrentOpacity] = (0, import_react55.useState)(1);
+  const [transformStyle, setTransformStyle] = (0, import_react55.useState)({
     transform: "translateX(33%)",
     transition: "ease"
   });
-  (0, import_react54.useEffect)(() => {
+  (0, import_react55.useEffect)(() => {
     if (dateRange.startDate !== localDate && !isAnimating) {
       setLocalDate(dateRange.startDate);
       setTransformStyle({ transform: "translateX(33%)", transition: "none" });
@@ -5543,13 +5902,13 @@ var ProfitAndLossDatePicker = () => {
       return;
     setIsAnimating(true);
     setNextOpacity(1);
-    const newDate = (0, import_date_fns12.add)(localDate, { months: monthsToAdd });
+    const newDate = (0, import_date_fns14.add)(localDate, { months: monthsToAdd });
     if (monthsToAdd === -1) {
       setCurrentOpacity(0);
     }
     changeDateRange({
-      startDate: (0, import_date_fns12.startOfMonth)(newDate),
-      endDate: (0, import_date_fns12.endOfMonth)(newDate)
+      startDate: (0, import_date_fns14.startOfMonth)(newDate),
+      endDate: (0, import_date_fns14.endOfMonth)(newDate)
     });
     const translateXValue = monthsToAdd > 0 ? "0%" : "66%";
     setTransformStyle({
@@ -5567,67 +5926,67 @@ var ProfitAndLossDatePicker = () => {
       setCurrentOpacity(1);
     }, 300);
   };
-  const currentLabel = (0, import_date_fns12.format)(localDate, "LLLL, y");
-  const prevLabel = (0, import_date_fns12.format)((0, import_date_fns12.add)(localDate, { months: -1 }), "LLLL, y");
-  const nextLabel = (0, import_date_fns12.format)((0, import_date_fns12.add)(localDate, { months: 1 }), "LLLL, y");
-  return /* @__PURE__ */ import_react54.default.createElement(
+  const currentLabel = (0, import_date_fns14.format)(localDate, "LLLL, y");
+  const prevLabel = (0, import_date_fns14.format)((0, import_date_fns14.add)(localDate, { months: -1 }), "LLLL, y");
+  const nextLabel = (0, import_date_fns14.format)((0, import_date_fns14.add)(localDate, { months: 1 }), "LLLL, y");
+  return /* @__PURE__ */ import_react55.default.createElement("div", { className: "Layer__profit-and-loss-date-picker" }, /* @__PURE__ */ import_react55.default.createElement(
     "div",
     {
-      className: "Layer__profit-and-loss-date-picker"
+      className: "Layer__profit-and-loss-date-picker__labels-container",
+      style: transformStyle
     },
-    /* @__PURE__ */ import_react54.default.createElement("div", { className: "Layer__profit-and-loss-date-picker__labels-container", style: transformStyle }, /* @__PURE__ */ import_react54.default.createElement("span", { className: "Layer__profit-and-loss-date-picker__label" }, prevLabel), /* @__PURE__ */ import_react54.default.createElement(
+    /* @__PURE__ */ import_react55.default.createElement("span", { className: "Layer__profit-and-loss-date-picker__label" }, prevLabel),
+    /* @__PURE__ */ import_react55.default.createElement(
       "span",
       {
         className: "Layer__profit-and-loss-date-picker__label",
         style: { opacity: currentOpacity }
       },
       currentLabel
-    ), /* @__PURE__ */ import_react54.default.createElement(
+    ),
+    /* @__PURE__ */ import_react55.default.createElement(
       "span",
       {
         className: "Layer__profit-and-loss-date-picker__label",
         style: { opacity: nextOpacity }
       },
       nextLabel
-    )),
-    /* @__PURE__ */ import_react54.default.createElement(
-      "button",
+    )
+  ), /* @__PURE__ */ import_react55.default.createElement(
+    "button",
+    {
+      "aria-label": "View Previous Month",
+      className: "Layer__profit-and-loss-date-picker__button",
+      onClick: () => change(-1),
+      disabled: isAnimating
+    },
+    /* @__PURE__ */ import_react55.default.createElement(
+      ChevronLeft_default,
       {
-        "aria-label": "View Previous Month",
-        className: "Layer__profit-and-loss-date-picker__button",
-        onClick: () => change(-1),
-        disabled: isAnimating
-      },
-      /* @__PURE__ */ import_react54.default.createElement(
-        ChevronLeft_default,
-        {
-          className: "Layer__profit-and-loss-date-picker__button-icon",
-          size: 16
-        }
-      )
-    ),
-    /* @__PURE__ */ import_react54.default.createElement(
-      "button",
+        className: "Layer__profit-and-loss-date-picker__button-icon",
+        size: 16
+      }
+    )
+  ), /* @__PURE__ */ import_react55.default.createElement(
+    "button",
+    {
+      "aria-label": "View Next Month",
+      className: "Layer__profit-and-loss-date-picker__button",
+      onClick: () => change(1),
+      disabled: isAnimating
+    },
+    /* @__PURE__ */ import_react55.default.createElement(
+      ChevronRight_default,
       {
-        "aria-label": "View Next Month",
-        className: "Layer__profit-and-loss-date-picker__button",
-        onClick: () => change(1),
-        disabled: isAnimating
-      },
-      /* @__PURE__ */ import_react54.default.createElement(
-        ChevronRight_default,
-        {
-          className: "Layer__profit-and-loss-date-picker__button-icon",
-          size: 16
-        }
-      )
-    ),
-    /* @__PURE__ */ import_react54.default.createElement("div", { className: "Layer__profit-and-loss-date-picker__effect-blur" })
-  );
+        className: "Layer__profit-and-loss-date-picker__button-icon",
+        size: 16
+      }
+    )
+  ), /* @__PURE__ */ import_react55.default.createElement("div", { className: "Layer__profit-and-loss-date-picker__effect-blur" }));
 };
 
 // src/components/ProfitAndLossDetailedCharts/ProfitAndLossDetailedCharts.tsx
-var import_react58 = __toESM(require("react"));
+var import_react59 = __toESM(require("react"));
 
 // src/icons/X.tsx
 var React68 = __toESM(require("react"));
@@ -5663,7 +6022,7 @@ var X = ({ size = 18, ...props }) => /* @__PURE__ */ React68.createElement(
 var X_default = X;
 
 // src/components/ProfitAndLossDetailedCharts/DetailedChart.tsx
-var import_react55 = __toESM(require("react"));
+var import_react56 = __toESM(require("react"));
 
 // src/config/charts.ts
 var INACTIVE_OPACITY_LEVELS = [
@@ -5762,7 +6121,7 @@ var DetailedChart = ({
   date,
   isLoading
 }) => {
-  const chartData = (0, import_react55.useMemo)(() => {
+  const chartData = (0, import_react56.useMemo)(() => {
     if (!filteredData) {
       return [];
     }
@@ -5780,7 +6139,7 @@ var DetailedChart = ({
     });
   }, [filteredData, isLoading]);
   const noValue = chartData.length === 0 || !chartData.find((x) => x.value !== 0);
-  return /* @__PURE__ */ import_react55.default.createElement("div", { className: "chart-field" }, /* @__PURE__ */ import_react55.default.createElement("div", { className: "header--tablet" }, /* @__PURE__ */ import_react55.default.createElement(Text, { size: "lg" /* lg */, weight: "bold" /* bold */, className: "title" }, humanizeTitle(sidebarScope)), /* @__PURE__ */ import_react55.default.createElement(ProfitAndLossDatePicker, null)), /* @__PURE__ */ import_react55.default.createElement("div", { className: "chart-container" }, /* @__PURE__ */ import_react55.default.createElement(import_recharts2.ResponsiveContainer, null, /* @__PURE__ */ import_react55.default.createElement(import_recharts2.PieChart, null, !isLoading && !noValue ? /* @__PURE__ */ import_react55.default.createElement(
+  return /* @__PURE__ */ import_react56.default.createElement("div", { className: "chart-field" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "header--tablet" }, /* @__PURE__ */ import_react56.default.createElement(Text, { size: "lg" /* lg */, weight: "bold" /* bold */, className: "title" }, humanizeTitle(sidebarScope)), /* @__PURE__ */ import_react56.default.createElement(ProfitAndLossDatePicker, null)), /* @__PURE__ */ import_react56.default.createElement("div", { className: "chart-container" }, /* @__PURE__ */ import_react56.default.createElement(import_recharts2.ResponsiveContainer, null, /* @__PURE__ */ import_react56.default.createElement(import_recharts2.PieChart, null, !isLoading && !noValue ? /* @__PURE__ */ import_react56.default.createElement(
     import_recharts2.Pie,
     {
       data: chartData,
@@ -5805,7 +6164,7 @@ var DetailedChart = ({
         fill = void 0;
         opacity = INACTIVE_OPACITY_LEVELS[index % INACTIVE_OPACITY_LEVELS.length];
       }
-      return /* @__PURE__ */ import_react55.default.createElement(
+      return /* @__PURE__ */ import_react56.default.createElement(
         import_recharts2.Cell,
         {
           key: `cell-${index}`,
@@ -5817,7 +6176,7 @@ var DetailedChart = ({
         }
       );
     }),
-    /* @__PURE__ */ import_react55.default.createElement(
+    /* @__PURE__ */ import_react56.default.createElement(
       import_recharts2.Label,
       {
         position: "center",
@@ -5838,7 +6197,7 @@ var DetailedChart = ({
           if (hoveredItem) {
             text = hoveredItem;
           }
-          return /* @__PURE__ */ import_react55.default.createElement(
+          return /* @__PURE__ */ import_react56.default.createElement(
             import_recharts2.Text,
             {
               ...positioningProps,
@@ -5849,7 +6208,7 @@ var DetailedChart = ({
         }
       }
     ),
-    /* @__PURE__ */ import_react55.default.createElement(
+    /* @__PURE__ */ import_react56.default.createElement(
       import_recharts2.Label,
       {
         position: "center",
@@ -5872,7 +6231,7 @@ var DetailedChart = ({
               (x) => x.display_name === hoveredItem
             )?.value;
           }
-          return /* @__PURE__ */ import_react55.default.createElement(
+          return /* @__PURE__ */ import_react56.default.createElement(
             import_recharts2.Text,
             {
               ...positioningProps,
@@ -5883,7 +6242,7 @@ var DetailedChart = ({
         }
       }
     ),
-    /* @__PURE__ */ import_react55.default.createElement(
+    /* @__PURE__ */ import_react56.default.createElement(
       import_recharts2.Label,
       {
         position: "center",
@@ -5902,7 +6261,7 @@ var DetailedChart = ({
             verticalAnchor: "middle"
           };
           if (hoveredItem) {
-            return /* @__PURE__ */ import_react55.default.createElement(
+            return /* @__PURE__ */ import_react56.default.createElement(
               import_recharts2.Text,
               {
                 ...positioningProps,
@@ -5919,7 +6278,7 @@ var DetailedChart = ({
         }
       }
     )
-  ) : null, !isLoading && noValue ? /* @__PURE__ */ import_react55.default.createElement(
+  ) : null, !isLoading && noValue ? /* @__PURE__ */ import_react56.default.createElement(
     import_recharts2.Pie,
     {
       data: [{ name: "Total", value: 1 }],
@@ -5934,7 +6293,7 @@ var DetailedChart = ({
       animationDuration: 200,
       animationEasing: "ease-in-out"
     },
-    /* @__PURE__ */ import_react55.default.createElement(
+    /* @__PURE__ */ import_react56.default.createElement(
       import_recharts2.Label,
       {
         position: "center",
@@ -5955,7 +6314,7 @@ var DetailedChart = ({
           if (hoveredItem) {
             text = hoveredItem;
           }
-          return /* @__PURE__ */ import_react55.default.createElement(
+          return /* @__PURE__ */ import_react56.default.createElement(
             import_recharts2.Text,
             {
               ...positioningProps,
@@ -5966,7 +6325,7 @@ var DetailedChart = ({
         }
       }
     ),
-    /* @__PURE__ */ import_react55.default.createElement(
+    /* @__PURE__ */ import_react56.default.createElement(
       import_recharts2.Label,
       {
         position: "center",
@@ -5989,7 +6348,7 @@ var DetailedChart = ({
               (x) => x.display_name === hoveredItem
             )?.value;
           }
-          return /* @__PURE__ */ import_react55.default.createElement(
+          return /* @__PURE__ */ import_react56.default.createElement(
             import_recharts2.Text,
             {
               ...positioningProps,
@@ -6000,7 +6359,7 @@ var DetailedChart = ({
         }
       }
     )
-  ) : null, isLoading ? /* @__PURE__ */ import_react55.default.createElement(
+  ) : null, isLoading ? /* @__PURE__ */ import_react56.default.createElement(
     import_recharts2.Pie,
     {
       data: [{ name: "loading...", value: 1 }],
@@ -6019,7 +6378,7 @@ var DetailedChart = ({
 };
 
 // src/components/ProfitAndLossDetailedCharts/DetailedTable.tsx
-var import_react56 = __toESM(require("react"));
+var import_react57 = __toESM(require("react"));
 
 // src/icons/SortArrows.tsx
 var React70 = __toESM(require("react"));
@@ -6033,7 +6392,7 @@ var SortArrows = ({ size = 13, ...props }) => /* @__PURE__ */ React70.createElem
     width: size,
     height: size
   },
-  /* @__PURE__ */ React70.createElement("g", { "clip-path": "url(#clip0_1758_75388)" }, /* @__PURE__ */ React70.createElement(
+  /* @__PURE__ */ React70.createElement("g", { clipPath: "url(#clip0_1758_75388)" }, /* @__PURE__ */ React70.createElement(
     "path",
     {
       d: "M1.33325 8.5L3.99992 11.1667L6.66659 8.5",
@@ -6083,7 +6442,7 @@ var SortArrows = ({ size = 13, ...props }) => /* @__PURE__ */ React70.createElem
 var SortArrows_default = SortArrows;
 
 // src/components/ProfitAndLossDetailedCharts/DetailedTable.tsx
-var import_classnames26 = __toESM(require("classnames"));
+var import_classnames28 = __toESM(require("classnames"));
 var DetailedTable = ({
   filteredData,
   sidebarScope,
@@ -6093,52 +6452,52 @@ var DetailedTable = ({
   setHoveredItem
 }) => {
   const buildColClass = (column) => {
-    return (0, import_classnames26.default)(
+    return (0, import_classnames28.default)(
       "Layer__sortable-col",
       sidebarScope && filters[sidebarScope]?.sortBy === column ? `sort--${(sidebarScope && filters[sidebarScope]?.sortDirection) ?? "desc"}` : ""
     );
   };
-  return /* @__PURE__ */ import_react56.default.createElement("div", { className: "details-container" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "table" }, /* @__PURE__ */ import_react56.default.createElement("table", null, /* @__PURE__ */ import_react56.default.createElement("thead", null, /* @__PURE__ */ import_react56.default.createElement("tr", null, /* @__PURE__ */ import_react56.default.createElement(
+  return /* @__PURE__ */ import_react57.default.createElement("div", { className: "details-container" }, /* @__PURE__ */ import_react57.default.createElement("div", { className: "table" }, /* @__PURE__ */ import_react57.default.createElement("table", null, /* @__PURE__ */ import_react57.default.createElement("thead", null, /* @__PURE__ */ import_react57.default.createElement("tr", null, /* @__PURE__ */ import_react57.default.createElement(
     "th",
     {
       className: buildColClass("category"),
       onClick: () => sortBy(sidebarScope ?? "expenses", "category")
     },
     "Expense/Sale ",
-    /* @__PURE__ */ import_react56.default.createElement(SortArrows_default, { className: "Layer__sort-arrows" })
-  ), /* @__PURE__ */ import_react56.default.createElement(
+    /* @__PURE__ */ import_react57.default.createElement(SortArrows_default, { className: "Layer__sort-arrows" })
+  ), /* @__PURE__ */ import_react57.default.createElement(
     "th",
     {
       className: buildColClass("type"),
       onClick: () => sortBy(sidebarScope ?? "expenses", "type")
     },
     "Type ",
-    /* @__PURE__ */ import_react56.default.createElement(SortArrows_default, { className: "Layer__sort-arrows" })
-  ), /* @__PURE__ */ import_react56.default.createElement("th", null), /* @__PURE__ */ import_react56.default.createElement(
+    /* @__PURE__ */ import_react57.default.createElement(SortArrows_default, { className: "Layer__sort-arrows" })
+  ), /* @__PURE__ */ import_react57.default.createElement("th", null), /* @__PURE__ */ import_react57.default.createElement(
     "th",
     {
       className: buildColClass("value"),
       onClick: () => sortBy(sidebarScope ?? "expenses", "value")
     },
     "Value ",
-    /* @__PURE__ */ import_react56.default.createElement(SortArrows_default, { className: "Layer__sort-arrows" })
-  ))), /* @__PURE__ */ import_react56.default.createElement("tbody", null, filteredData.filter((x) => !x.hidden).map((item, idx) => {
+    /* @__PURE__ */ import_react57.default.createElement(SortArrows_default, { className: "Layer__sort-arrows" })
+  ))), /* @__PURE__ */ import_react57.default.createElement("tbody", null, filteredData.filter((x) => !x.hidden).map((item, idx) => {
     const colorConfig = DEFAULT_CHART_COLORS[idx % DEFAULT_CHART_COLORS.length];
-    return /* @__PURE__ */ import_react56.default.createElement(
+    return /* @__PURE__ */ import_react57.default.createElement(
       "tr",
       {
         key: `pl-side-table-item-${idx}`,
-        className: (0, import_classnames26.default)(
+        className: (0, import_classnames28.default)(
           "Layer__profit-and-loss-detailed-table__row",
           hoveredItem && hoveredItem === item.display_name ? "active" : ""
         ),
         onMouseEnter: () => setHoveredItem(item.display_name),
         onMouseLeave: () => setHoveredItem(void 0)
       },
-      /* @__PURE__ */ import_react56.default.createElement("td", { className: "category-col" }, item.display_name),
-      /* @__PURE__ */ import_react56.default.createElement("td", { className: "type-col" }, item.type),
-      /* @__PURE__ */ import_react56.default.createElement("td", { className: "value-col" }, "$", centsToDollars(item.value)),
-      /* @__PURE__ */ import_react56.default.createElement("td", { className: "share-col" }, /* @__PURE__ */ import_react56.default.createElement("span", { className: "share-cell-content" }, formatPercent(item.share), "%", /* @__PURE__ */ import_react56.default.createElement(
+      /* @__PURE__ */ import_react57.default.createElement("td", { className: "category-col" }, item.display_name),
+      /* @__PURE__ */ import_react57.default.createElement("td", { className: "type-col" }, item.type),
+      /* @__PURE__ */ import_react57.default.createElement("td", { className: "value-col" }, "$", centsToDollars(item.value)),
+      /* @__PURE__ */ import_react57.default.createElement("td", { className: "share-col" }, /* @__PURE__ */ import_react57.default.createElement("span", { className: "share-cell-content" }, formatPercent(item.share), "%", /* @__PURE__ */ import_react57.default.createElement(
         "div",
         {
           className: "share-icon",
@@ -6153,7 +6512,7 @@ var DetailedTable = ({
 };
 
 // src/components/ProfitAndLossDetailedCharts/Filters.tsx
-var import_react57 = __toESM(require("react"));
+var import_react58 = __toESM(require("react"));
 var import_react_select3 = __toESM(require("react-select"));
 var Filters = ({
   filteredData,
@@ -6161,7 +6520,7 @@ var Filters = ({
   filters,
   setFilterTypes
 }) => {
-  return /* @__PURE__ */ import_react57.default.createElement("div", { className: "filters" }, /* @__PURE__ */ import_react57.default.createElement(Text, { size: "sm" /* sm */, className: "Layer__label" }, "Filters"), /* @__PURE__ */ import_react57.default.createElement(
+  return /* @__PURE__ */ import_react58.default.createElement("div", { className: "filters" }, /* @__PURE__ */ import_react58.default.createElement(Text, { size: "sm" /* sm */, className: "Layer__label" }, "Filters"), /* @__PURE__ */ import_react58.default.createElement(
     import_react_select3.default,
     {
       className: "Layer__select type-select",
@@ -6183,15 +6542,15 @@ var Filters = ({
         );
       },
       components: {
-        DropdownIndicator: (props) => /* @__PURE__ */ import_react57.default.createElement(import_react_select3.components.DropdownIndicator, { ...props }, /* @__PURE__ */ import_react57.default.createElement(ChevronDown_default, null)),
-        Placeholder: (props) => /* @__PURE__ */ import_react57.default.createElement(import_react_select3.components.Placeholder, { ...props }, /* @__PURE__ */ import_react57.default.createElement("div", { className: "Layer__select__multi-all-placeholder-badge" }, "All"))
+        DropdownIndicator: (props) => /* @__PURE__ */ import_react58.default.createElement(import_react_select3.components.DropdownIndicator, { ...props }, /* @__PURE__ */ import_react58.default.createElement(ChevronDown_default, null)),
+        Placeholder: (props) => /* @__PURE__ */ import_react58.default.createElement(import_react_select3.components.Placeholder, { ...props }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "Layer__select__multi-all-placeholder-badge" }, "All"))
       }
     }
   ));
 };
 
 // src/components/ProfitAndLossDetailedCharts/ProfitAndLossDetailedCharts.tsx
-var import_date_fns13 = require("date-fns");
+var import_date_fns15 = require("date-fns");
 var ProfitAndLossDetailedCharts = ({
   scope,
   hideClose = false,
@@ -6209,20 +6568,20 @@ var ProfitAndLossDetailedCharts = ({
     sidebarScope,
     setSidebarScope,
     setFilterTypes
-  } = (0, import_react58.useContext)(ProfitAndLoss.Context);
+  } = (0, import_react59.useContext)(ProfitAndLoss.Context);
   const theScope = scope ? scope : sidebarScope;
   const data = theScope === "revenue" ? filteredDataRevenue : filteredDataExpenses;
   const total = theScope === "revenue" ? filteredTotalRevenue : filteredTotalExpenses;
-  const [hoveredItem, setHoveredItem] = (0, import_react58.useState)();
-  return /* @__PURE__ */ import_react58.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts" }, /* @__PURE__ */ import_react58.default.createElement("header", { className: "Layer__profit-and-loss-detailed-charts__header" }, /* @__PURE__ */ import_react58.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts__head" }, /* @__PURE__ */ import_react58.default.createElement(Text, { size: "lg" /* lg */, weight: "bold" /* bold */, className: "title" }, humanizeTitle(theScope)), /* @__PURE__ */ import_react58.default.createElement(Text, { size: "sm" /* sm */, className: "date" }, (0, import_date_fns13.format)(dateRange.startDate, "LLLL, y")), showDatePicker && /* @__PURE__ */ import_react58.default.createElement(ProfitAndLossDatePicker, null)), !hideClose && /* @__PURE__ */ import_react58.default.createElement(
+  const [hoveredItem, setHoveredItem] = (0, import_react59.useState)();
+  return /* @__PURE__ */ import_react59.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts" }, /* @__PURE__ */ import_react59.default.createElement("header", { className: "Layer__profit-and-loss-detailed-charts__header" }, /* @__PURE__ */ import_react59.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts__head" }, /* @__PURE__ */ import_react59.default.createElement(Text, { size: "lg" /* lg */, weight: "bold" /* bold */, className: "title" }, humanizeTitle(theScope)), /* @__PURE__ */ import_react59.default.createElement(Text, { size: "sm" /* sm */, className: "date" }, (0, import_date_fns15.format)(dateRange.startDate, "LLLL, y")), showDatePicker && /* @__PURE__ */ import_react59.default.createElement(ProfitAndLossDatePicker, null)), !hideClose && /* @__PURE__ */ import_react59.default.createElement(
     Button,
     {
-      rightIcon: /* @__PURE__ */ import_react58.default.createElement(X_default, null),
+      rightIcon: /* @__PURE__ */ import_react59.default.createElement(X_default, null),
       iconOnly: true,
       onClick: () => setSidebarScope(void 0),
       variant: "secondary" /* secondary */
     }
-  )), /* @__PURE__ */ import_react58.default.createElement("header", { className: "Layer__profit-and-loss-detailed-charts__header--tablet" }, /* @__PURE__ */ import_react58.default.createElement(BackButton, { onClick: () => setSidebarScope(void 0) })), /* @__PURE__ */ import_react58.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts__content" }, /* @__PURE__ */ import_react58.default.createElement(
+  )), /* @__PURE__ */ import_react59.default.createElement("header", { className: "Layer__profit-and-loss-detailed-charts__header--tablet" }, /* @__PURE__ */ import_react59.default.createElement(BackButton, { onClick: () => setSidebarScope(void 0) })), /* @__PURE__ */ import_react59.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts__content" }, /* @__PURE__ */ import_react59.default.createElement(
     DetailedChart,
     {
       filteredData: data,
@@ -6233,7 +6592,7 @@ var ProfitAndLossDetailedCharts = ({
       date: dateRange.startDate,
       isLoading
     }
-  ), /* @__PURE__ */ import_react58.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts__table-wrapper" }, /* @__PURE__ */ import_react58.default.createElement(
+  ), /* @__PURE__ */ import_react59.default.createElement("div", { className: "Layer__profit-and-loss-detailed-charts__table-wrapper" }, /* @__PURE__ */ import_react59.default.createElement(
     Filters,
     {
       filteredData: data,
@@ -6241,7 +6600,7 @@ var ProfitAndLossDetailedCharts = ({
       filters,
       setFilterTypes
     }
-  ), /* @__PURE__ */ import_react58.default.createElement(
+  ), /* @__PURE__ */ import_react59.default.createElement(
     DetailedTable,
     {
       filteredData: data,
@@ -6255,28 +6614,28 @@ var ProfitAndLossDetailedCharts = ({
 };
 
 // src/components/ProfitAndLossSummaries/ProfitAndLossSummaries.tsx
-var import_react61 = __toESM(require("react"));
+var import_react62 = __toESM(require("react"));
 
 // src/components/SkeletonLoader/SkeletonLoader.tsx
-var import_react59 = __toESM(require("react"));
-var import_classnames27 = __toESM(require("classnames"));
+var import_react60 = __toESM(require("react"));
+var import_classnames29 = __toESM(require("classnames"));
 var SkeletonLoader = ({
   height,
   width,
   className
 }) => {
-  const baseClassName = (0, import_classnames27.default)(
+  const baseClassName = (0, import_classnames29.default)(
     "Layer__skeleton-loader Layer__anim--skeleton-loading",
     className
   );
-  return /* @__PURE__ */ import_react59.default.createElement("div", { className: baseClassName, style: { width, height } });
+  return /* @__PURE__ */ import_react60.default.createElement("div", { className: baseClassName, style: { width, height } });
 };
 
 // src/components/ProfitAndLossSummaries/MiniChart.tsx
-var import_react60 = __toESM(require("react"));
+var import_react61 = __toESM(require("react"));
 var import_recharts3 = require("recharts");
 var MiniChart = ({ data }) => {
-  return /* @__PURE__ */ import_react60.default.createElement(import_recharts3.PieChart, { width: 48, height: 48, className: "mini-chart" }, /* @__PURE__ */ import_react60.default.createElement(
+  return /* @__PURE__ */ import_react61.default.createElement(import_recharts3.PieChart, { width: 48, height: 48, className: "mini-chart" }, /* @__PURE__ */ import_react61.default.createElement(
     import_recharts3.Pie,
     {
       data,
@@ -6295,7 +6654,7 @@ var MiniChart = ({ data }) => {
     },
     data.map((entry, index) => {
       const colorConfig = DEFAULT_CHART_COLORS[index % DEFAULT_CHART_COLORS.length];
-      return /* @__PURE__ */ import_react60.default.createElement(
+      return /* @__PURE__ */ import_react61.default.createElement(
         import_recharts3.Cell,
         {
           key: `cell-${index}`,
@@ -6309,7 +6668,7 @@ var MiniChart = ({ data }) => {
 };
 
 // src/components/ProfitAndLossSummaries/ProfitAndLossSummaries.tsx
-var import_classnames28 = __toESM(require("classnames"));
+var import_classnames30 = __toESM(require("classnames"));
 var CHART_PLACEHOLDER = [
   {
     name: "placeholder",
@@ -6346,26 +6705,27 @@ var ProfitAndLossSummaries = ({
     isLoading,
     setSidebarScope,
     sidebarScope
-  } = (0, import_react61.useContext)(ProfitAndLoss.Context);
-  const expensesChartData = (0, import_react61.useMemo)(() => {
-    return buildMiniChartData("expenses", storedData);
+  } = (0, import_react62.useContext)(ProfitAndLoss.Context);
+  const dataItem = Array.isArray(storedData) ? storedData[storedData.length - 1] : storedData;
+  const expensesChartData = (0, import_react62.useMemo)(() => {
+    return buildMiniChartData("expenses", dataItem);
   }, [storedData]);
-  const revenueChartData = (0, import_react61.useMemo)(() => {
-    return buildMiniChartData("revenue", storedData);
+  const revenueChartData = (0, import_react62.useMemo)(() => {
+    return buildMiniChartData("revenue", dataItem);
   }, [storedData]);
-  const data = storedData ? storedData : { income: { value: NaN }, net_profit: NaN };
+  const data = dataItem ? dataItem : { income: { value: NaN }, net_profit: NaN };
   const incomeDirectionClass = (data.income.value ?? NaN) < 0 ? "Layer__profit-and-loss-summaries__amount--negative" : "Layer__profit-and-loss-summaries__amount--positive";
   const expensesDirectionClass = (data?.income?.value ?? NaN) - data.net_profit < 0 ? "Layer__profit-and-loss-summaries__amount--negative" : "Layer__profit-and-loss-summaries__amount--positive";
   const netProfitDirectionClass = data.net_profit < 0 ? "Layer__profit-and-loss-summaries__amount--negative" : "Layer__profit-and-loss-summaries__amount--positive";
-  return /* @__PURE__ */ import_react61.default.createElement(
+  return /* @__PURE__ */ import_react62.default.createElement(
     "div",
     {
       className: `Layer__profit-and-loss-summaries ${vertical ? "flex-col" : ""}`
     },
-    /* @__PURE__ */ import_react61.default.createElement(
+    /* @__PURE__ */ import_react62.default.createElement(
       "div",
       {
-        className: (0, import_classnames28.default)(
+        className: (0, import_classnames30.default)(
           "Layer__profit-and-loss-summaries__summary",
           actionable && "Layer__actionable",
           "Layer__profit-and-loss-summaries__summary--income",
@@ -6375,8 +6735,8 @@ var ProfitAndLossSummaries = ({
           actionable && setSidebarScope("revenue");
         }
       },
-      /* @__PURE__ */ import_react61.default.createElement(MiniChart, { data: revenueChartData }),
-      /* @__PURE__ */ import_react61.default.createElement("div", { className: "Layer__profit-and-loss-summaries__text" }, /* @__PURE__ */ import_react61.default.createElement("span", { className: "Layer__profit-and-loss-summaries__title" }, revenueLabel), isLoading || storedData === void 0 ? /* @__PURE__ */ import_react61.default.createElement("div", { className: "Layer__profit-and-loss-summaries__loader" }, /* @__PURE__ */ import_react61.default.createElement(SkeletonLoader, null)) : /* @__PURE__ */ import_react61.default.createElement(
+      /* @__PURE__ */ import_react62.default.createElement(MiniChart, { data: revenueChartData }),
+      /* @__PURE__ */ import_react62.default.createElement("div", { className: "Layer__profit-and-loss-summaries__text" }, /* @__PURE__ */ import_react62.default.createElement("span", { className: "Layer__profit-and-loss-summaries__title" }, revenueLabel), isLoading || storedData === void 0 ? /* @__PURE__ */ import_react62.default.createElement("div", { className: "Layer__profit-and-loss-summaries__loader" }, /* @__PURE__ */ import_react62.default.createElement(SkeletonLoader, null)) : /* @__PURE__ */ import_react62.default.createElement(
         "span",
         {
           className: `Layer__profit-and-loss-summaries__amount ${incomeDirectionClass}`
@@ -6384,10 +6744,10 @@ var ProfitAndLossSummaries = ({
         centsToDollars(Math.abs(data?.income?.value ?? NaN))
       ))
     ),
-    /* @__PURE__ */ import_react61.default.createElement(
+    /* @__PURE__ */ import_react62.default.createElement(
       "div",
       {
-        className: (0, import_classnames28.default)(
+        className: (0, import_classnames30.default)(
           "Layer__profit-and-loss-summaries__summary",
           actionable && "Layer__actionable",
           "Layer__profit-and-loss-summaries__summary--expenses",
@@ -6397,8 +6757,8 @@ var ProfitAndLossSummaries = ({
           actionable && setSidebarScope("expenses");
         }
       },
-      /* @__PURE__ */ import_react61.default.createElement(MiniChart, { data: expensesChartData }),
-      /* @__PURE__ */ import_react61.default.createElement("div", { className: "Layer__profit-and-loss-summaries__text" }, /* @__PURE__ */ import_react61.default.createElement("span", { className: "Layer__profit-and-loss-summaries__title" }, "Expenses"), isLoading || storedData === void 0 ? /* @__PURE__ */ import_react61.default.createElement("div", { className: "Layer__profit-and-loss-summaries__loader" }, /* @__PURE__ */ import_react61.default.createElement(SkeletonLoader, { className: "Layer__profit-and-loss-summaries__loader" })) : /* @__PURE__ */ import_react61.default.createElement(
+      /* @__PURE__ */ import_react62.default.createElement(MiniChart, { data: expensesChartData }),
+      /* @__PURE__ */ import_react62.default.createElement("div", { className: "Layer__profit-and-loss-summaries__text" }, /* @__PURE__ */ import_react62.default.createElement("span", { className: "Layer__profit-and-loss-summaries__title" }, "Expenses"), isLoading || storedData === void 0 ? /* @__PURE__ */ import_react62.default.createElement("div", { className: "Layer__profit-and-loss-summaries__loader" }, /* @__PURE__ */ import_react62.default.createElement(SkeletonLoader, { className: "Layer__profit-and-loss-summaries__loader" })) : /* @__PURE__ */ import_react62.default.createElement(
         "span",
         {
           className: `Layer__profit-and-loss-summaries__amount ${expensesDirectionClass}`
@@ -6408,15 +6768,15 @@ var ProfitAndLossSummaries = ({
         )
       ))
     ),
-    /* @__PURE__ */ import_react61.default.createElement(
+    /* @__PURE__ */ import_react62.default.createElement(
       "div",
       {
-        className: (0, import_classnames28.default)(
+        className: (0, import_classnames30.default)(
           "Layer__profit-and-loss-summaries__summary net-profit Layer__profit-and-loss-summaries__summary--net-profit",
           actionable && "Layer__actionable"
         )
       },
-      /* @__PURE__ */ import_react61.default.createElement("div", { className: "Layer__profit-and-loss-summaries__text" }, /* @__PURE__ */ import_react61.default.createElement("span", { className: "Layer__profit-and-loss-summaries__title" }, "Net Profit"), isLoading || storedData === void 0 ? /* @__PURE__ */ import_react61.default.createElement("div", { className: "Layer__profit-and-loss-summaries__loader" }, /* @__PURE__ */ import_react61.default.createElement(SkeletonLoader, { className: "Layer__profit-and-loss-summaries__loader" })) : /* @__PURE__ */ import_react61.default.createElement(
+      /* @__PURE__ */ import_react62.default.createElement("div", { className: "Layer__profit-and-loss-summaries__text" }, /* @__PURE__ */ import_react62.default.createElement("span", { className: "Layer__profit-and-loss-summaries__title" }, "Net Profit"), isLoading || storedData === void 0 ? /* @__PURE__ */ import_react62.default.createElement("div", { className: "Layer__profit-and-loss-summaries__loader" }, /* @__PURE__ */ import_react62.default.createElement(SkeletonLoader, { className: "Layer__profit-and-loss-summaries__loader" })) : /* @__PURE__ */ import_react62.default.createElement(
         "span",
         {
           className: `Layer__profit-and-loss-summaries__amount ${netProfitDirectionClass}`
@@ -6428,10 +6788,10 @@ var ProfitAndLossSummaries = ({
 };
 
 // src/components/ProfitAndLossTable/ProfitAndLossTable.tsx
-var import_react63 = __toESM(require("react"));
+var import_react64 = __toESM(require("react"));
 
 // src/components/ProfitAndLossRow/ProfitAndLossRow.tsx
-var import_react62 = __toESM(require("react"));
+var import_react63 = __toESM(require("react"));
 
 // src/icons/PieChart.tsx
 var React77 = __toESM(require("react"));
@@ -6480,7 +6840,7 @@ var ProfitAndLossRow = ({
     return null;
   }
   const { value, display_name, line_items } = lineItem;
-  const [expanded, setExpanded] = (0, import_react62.useState)(true);
+  const [expanded, setExpanded] = (0, import_react63.useState)(true);
   const amount = value ?? 0;
   const amountString = centsToDollars(Math.abs(amount));
   const labelClasses = [
@@ -6511,20 +6871,20 @@ var ProfitAndLossRow = ({
   );
   displayChildren && expanded && labelClasses.push("Layer__profit-and-loss-row__label--expanded");
   displayChildren && expanded && valueClasses.push("Layer__profit-and-loss-row__value--expanded");
-  return /* @__PURE__ */ import_react62.default.createElement(import_react62.default.Fragment, null, /* @__PURE__ */ import_react62.default.createElement(
+  return /* @__PURE__ */ import_react63.default.createElement(import_react63.default.Fragment, null, /* @__PURE__ */ import_react63.default.createElement(
     "div",
     {
       className: labelClasses.join(" "),
       onClick: () => !lockExpanded && toggleExpanded()
     },
-    /* @__PURE__ */ import_react62.default.createElement("span", { className: "Layer__profit-and-loss-row__label__title" }, !lockExpanded && variant !== "summation" ? /* @__PURE__ */ import_react62.default.createElement(
+    /* @__PURE__ */ import_react63.default.createElement("span", { className: "Layer__profit-and-loss-row__label__title" }, !lockExpanded && variant !== "summation" ? /* @__PURE__ */ import_react63.default.createElement(
       ChevronDownFill_default,
       {
         size: 16,
         className: "Layer__profit-and-loss-row__label__chevron"
       }
-    ) : null, /* @__PURE__ */ import_react62.default.createElement(Text, null, display_name)),
-    setSidebarScope && /* @__PURE__ */ import_react62.default.createElement(
+    ) : null, /* @__PURE__ */ import_react63.default.createElement(Text, null, display_name)),
+    setSidebarScope && /* @__PURE__ */ import_react63.default.createElement(
       "span",
       {
         className: "Layer__profit-and-loss-row__detailed-chart-btn",
@@ -6533,14 +6893,14 @@ var ProfitAndLossRow = ({
           setSidebarScope && setSidebarScope(scope ?? "expenses");
         }
       },
-      /* @__PURE__ */ import_react62.default.createElement(PieChart_default, null)
+      /* @__PURE__ */ import_react63.default.createElement(PieChart_default, null)
     )
-  ), /* @__PURE__ */ import_react62.default.createElement("div", { className: valueClasses.join(" ") }, /* @__PURE__ */ import_react62.default.createElement(Text, null, amountString)), canGoDeeper && hasChildren && /* @__PURE__ */ import_react62.default.createElement(
+  ), /* @__PURE__ */ import_react63.default.createElement("div", { className: valueClasses.join(" ") }, /* @__PURE__ */ import_react63.default.createElement(Text, null, amountString)), canGoDeeper && hasChildren && /* @__PURE__ */ import_react63.default.createElement(
     "div",
     {
       className: `Layer__profit-and-loss-row__children ${expanded && "Layer__profit-and-loss-row__children--expanded"}`
     },
-    /* @__PURE__ */ import_react62.default.createElement("div", { className: "Layer__profit-and-loss-row__children--content" }, (line_items || []).map((line_item) => /* @__PURE__ */ import_react62.default.createElement(
+    /* @__PURE__ */ import_react63.default.createElement("div", { className: "Layer__profit-and-loss-row__children--content" }, (line_items || []).map((line_item) => /* @__PURE__ */ import_react63.default.createElement(
       ProfitAndLossRow,
       {
         key: line_item.display_name,
@@ -6602,35 +6962,36 @@ var empty_profit_and_loss_report_default = {
 };
 
 // src/components/ProfitAndLossTable/ProfitAndLossTable.tsx
-var import_classnames29 = __toESM(require("classnames"));
+var import_classnames31 = __toESM(require("classnames"));
 var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
   const {
     data: actualData,
     isLoading,
     setSidebarScope
-  } = (0, import_react63.useContext)(ProfitAndLoss.Context);
-  const data = !actualData || isLoading ? empty_profit_and_loss_report_default : actualData;
+  } = (0, import_react64.useContext)(ProfitAndLoss.Context);
+  const currentData = Array.isArray(actualData) ? actualData[actualData.length - 1] : actualData;
+  const data = !currentData || isLoading ? empty_profit_and_loss_report_default : currentData;
   if (isLoading || actualData === void 0) {
-    return /* @__PURE__ */ import_react63.default.createElement(
+    return /* @__PURE__ */ import_react64.default.createElement(
       "div",
       {
-        className: (0, import_classnames29.default)(
+        className: (0, import_classnames31.default)(
           "Layer__profit-and-loss-table__loader-container",
           asContainer && "Layer__component-container"
         )
       },
-      /* @__PURE__ */ import_react63.default.createElement(Loader2, null)
+      /* @__PURE__ */ import_react64.default.createElement(Loader2, null)
     );
   }
-  return /* @__PURE__ */ import_react63.default.createElement(import_react63.default.Fragment, null, /* @__PURE__ */ import_react63.default.createElement(
+  return /* @__PURE__ */ import_react64.default.createElement(import_react64.default.Fragment, null, /* @__PURE__ */ import_react64.default.createElement(
     "div",
     {
-      className: (0, import_classnames29.default)(
+      className: (0, import_classnames31.default)(
         "Layer__profit-and-loss-table Layer__profit-and-loss-table--main",
         asContainer && "Layer__component-container"
       )
     },
-    /* @__PURE__ */ import_react63.default.createElement(
+    /* @__PURE__ */ import_react64.default.createElement(
       ProfitAndLossRow,
       {
         lineItem: data.income,
@@ -6640,7 +7001,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
         setSidebarScope
       }
     ),
-    /* @__PURE__ */ import_react63.default.createElement(
+    /* @__PURE__ */ import_react64.default.createElement(
       ProfitAndLossRow,
       {
         lineItem: data.cost_of_goods_sold,
@@ -6650,7 +7011,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
         setSidebarScope
       }
     ),
-    /* @__PURE__ */ import_react63.default.createElement(
+    /* @__PURE__ */ import_react64.default.createElement(
       ProfitAndLossRow,
       {
         lineItem: {
@@ -6664,7 +7025,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
         setSidebarScope
       }
     ),
-    /* @__PURE__ */ import_react63.default.createElement(
+    /* @__PURE__ */ import_react64.default.createElement(
       ProfitAndLossRow,
       {
         lineItem: data.expenses,
@@ -6674,7 +7035,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
         setSidebarScope
       }
     ),
-    /* @__PURE__ */ import_react63.default.createElement(
+    /* @__PURE__ */ import_react64.default.createElement(
       ProfitAndLossRow,
       {
         lineItem: {
@@ -6688,7 +7049,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
         setSidebarScope
       }
     ),
-    /* @__PURE__ */ import_react63.default.createElement(
+    /* @__PURE__ */ import_react64.default.createElement(
       ProfitAndLossRow,
       {
         lineItem: data.taxes,
@@ -6698,7 +7059,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
         setSidebarScope
       }
     ),
-    /* @__PURE__ */ import_react63.default.createElement(
+    /* @__PURE__ */ import_react64.default.createElement(
       ProfitAndLossRow,
       {
         lineItem: {
@@ -6710,14 +7071,14 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
         lockExpanded
       }
     )
-  ), data.other_outflows || data.personal_expenses ? /* @__PURE__ */ import_react63.default.createElement("div", { className: "Layer__profit-and-loss-table Layer__profit-and-loss-table__outflows" }, /* @__PURE__ */ import_react63.default.createElement(
+  ), data.other_outflows || data.personal_expenses ? /* @__PURE__ */ import_react64.default.createElement("div", { className: "Layer__profit-and-loss-table Layer__profit-and-loss-table__outflows" }, /* @__PURE__ */ import_react64.default.createElement(
     ProfitAndLossRow,
     {
       lineItem: data.other_outflows,
       direction: "DEBIT" /* DEBIT */,
       lockExpanded
     }
-  ), /* @__PURE__ */ import_react63.default.createElement(
+  ), /* @__PURE__ */ import_react64.default.createElement(
     ProfitAndLossRow,
     {
       lineItem: data.personal_expenses,
@@ -6728,8 +7089,8 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
 };
 
 // src/components/ProfitAndLoss/ProfitAndLoss.tsx
-var import_date_fns14 = require("date-fns");
-var PNLContext = (0, import_react64.createContext)({
+var import_date_fns16 = require("date-fns");
+var PNLContext = (0, import_react65.createContext)({
   data: void 0,
   filteredDataRevenue: [],
   filteredTotalRevenue: void 0,
@@ -6739,8 +7100,8 @@ var PNLContext = (0, import_react64.createContext)({
   isValidating: false,
   error: void 0,
   dateRange: {
-    startDate: (0, import_date_fns14.startOfMonth)(/* @__PURE__ */ new Date()),
-    endDate: (0, import_date_fns14.endOfMonth)(/* @__PURE__ */ new Date())
+    startDate: (0, import_date_fns16.startOfMonth)(/* @__PURE__ */ new Date()),
+    endDate: (0, import_date_fns16.endOfMonth)(/* @__PURE__ */ new Date())
   },
   changeDateRange: () => {
   },
@@ -6765,7 +7126,7 @@ var ProfitAndLoss = ({
   asContainer = true
 }) => {
   const contextData = useProfitAndLoss({ tagFilter, reportingBasis });
-  return /* @__PURE__ */ import_react64.default.createElement(PNLContext.Provider, { value: contextData }, asContainer ? /* @__PURE__ */ import_react64.default.createElement(Container, { name: "profit-and-loss" }, children) : children);
+  return /* @__PURE__ */ import_react65.default.createElement(PNLContext.Provider, { value: contextData }, asContainer ? /* @__PURE__ */ import_react65.default.createElement(Container, { name: "profit-and-loss" }, children) : children);
 };
 ProfitAndLoss.Chart = ProfitAndLossChart;
 ProfitAndLoss.Context = PNLContext;
@@ -6775,11 +7136,11 @@ ProfitAndLoss.Table = ProfitAndLossTable;
 ProfitAndLoss.DetailedCharts = ProfitAndLossDetailedCharts;
 
 // src/components/ProfitAndLossView/ProfitAndLossView.tsx
-var import_react66 = __toESM(require("react"));
+var import_react67 = __toESM(require("react"));
 
 // src/components/Panel/Panel.tsx
-var import_react65 = __toESM(require("react"));
-var import_classnames30 = __toESM(require("classnames"));
+var import_react66 = __toESM(require("react"));
+var import_classnames32 = __toESM(require("classnames"));
 var Panel = ({
   children,
   className,
@@ -6788,23 +7149,23 @@ var Panel = ({
   sidebarIsOpen,
   parentRef
 }) => {
-  const [sidebarHeight, setSidebarHeight] = (0, import_react65.useState)(0);
-  (0, import_react65.useEffect)(() => {
+  const [sidebarHeight, setSidebarHeight] = (0, import_react66.useState)(0);
+  (0, import_react66.useEffect)(() => {
     if (parentRef?.current?.offsetHeight) {
       setSidebarHeight(parentRef?.current?.offsetHeight - 1);
     }
   }, [parentRef?.current?.offsetHeight, sidebarIsOpen]);
-  return /* @__PURE__ */ import_react65.default.createElement(
+  return /* @__PURE__ */ import_react66.default.createElement(
     "div",
     {
-      className: (0, import_classnames30.default)(
+      className: (0, import_classnames32.default)(
         "Layer__panel",
         className,
         sidebarIsOpen && "Layer__panel--open"
       )
     },
-    /* @__PURE__ */ import_react65.default.createElement("div", { className: "Layer__panel__content" }, header, children),
-    sidebar && /* @__PURE__ */ import_react65.default.createElement(
+    /* @__PURE__ */ import_react66.default.createElement("div", { className: "Layer__panel__content" }, header, children),
+    sidebar && /* @__PURE__ */ import_react66.default.createElement(
       "div",
       {
         className: "Layer__panel__sidebar",
@@ -6812,7 +7173,7 @@ var Panel = ({
           maxHeight: sidebarHeight > 0 && sidebarIsOpen ? sidebarHeight : 0
         }
       },
-      /* @__PURE__ */ import_react65.default.createElement("div", { className: "Layer__panel__sidebar-content" }, sidebar)
+      /* @__PURE__ */ import_react66.default.createElement("div", { className: "Layer__panel__sidebar-content" }, sidebar)
     )
   );
 };
@@ -6820,34 +7181,34 @@ var Panel = ({
 // src/components/ProfitAndLossView/ProfitAndLossView.tsx
 var COMPONENT_NAME3 = "profit-and-loss";
 var ProfitAndLossView = (props) => {
-  const containerRef = (0, import_react66.useRef)(null);
-  return /* @__PURE__ */ import_react66.default.createElement(Container, { name: COMPONENT_NAME3, ref: containerRef }, /* @__PURE__ */ import_react66.default.createElement(ProfitAndLoss, null, /* @__PURE__ */ import_react66.default.createElement(ProfitAndLossPanel, { containerRef, ...props })));
+  const containerRef = (0, import_react67.useRef)(null);
+  return /* @__PURE__ */ import_react67.default.createElement(Container, { name: COMPONENT_NAME3, ref: containerRef }, /* @__PURE__ */ import_react67.default.createElement(ProfitAndLoss, null, /* @__PURE__ */ import_react67.default.createElement(ProfitAndLossPanel, { containerRef, ...props })));
 };
 var ProfitAndLossPanel = ({
   containerRef,
   ...props
 }) => {
-  const { sidebarScope } = (0, import_react66.useContext)(ProfitAndLoss.Context);
-  return /* @__PURE__ */ import_react66.default.createElement(
+  const { sidebarScope } = (0, import_react67.useContext)(ProfitAndLoss.Context);
+  return /* @__PURE__ */ import_react67.default.createElement(
     Panel,
     {
-      sidebar: /* @__PURE__ */ import_react66.default.createElement(ProfitAndLossDetailedCharts, null),
+      sidebar: /* @__PURE__ */ import_react67.default.createElement(ProfitAndLossDetailedCharts, null),
       sidebarIsOpen: Boolean(sidebarScope),
       parentRef: containerRef
     },
-    /* @__PURE__ */ import_react66.default.createElement(Header, { className: `Layer__${COMPONENT_NAME3}__header` }, /* @__PURE__ */ import_react66.default.createElement(Heading, { className: "Layer__profit-and-loss__title" }, "Profit & Loss")),
-    /* @__PURE__ */ import_react66.default.createElement(Components, { ...props })
+    /* @__PURE__ */ import_react67.default.createElement(Header, { className: `Layer__${COMPONENT_NAME3}__header` }, /* @__PURE__ */ import_react67.default.createElement(Heading, { className: "Layer__profit-and-loss__title" }, "Profit & Loss")),
+    /* @__PURE__ */ import_react67.default.createElement(Components, { ...props })
   );
 };
 var Components = ({
   hideChart = false,
   hideTable = false
 }) => {
-  const { error, isLoading, isValidating, refetch } = (0, import_react66.useContext)(
+  const { error, isLoading, isValidating, refetch } = (0, import_react67.useContext)(
     ProfitAndLoss.Context
   );
   if (!isLoading && error) {
-    return /* @__PURE__ */ import_react66.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react66.default.createElement(
+    return /* @__PURE__ */ import_react67.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react67.default.createElement(
       DataState,
       {
         status: "failed" /* failed */,
@@ -6858,27 +7219,230 @@ var Components = ({
       }
     ));
   }
-  return /* @__PURE__ */ import_react66.default.createElement(import_react66.default.Fragment, null, !hideChart && /* @__PURE__ */ import_react66.default.createElement("div", { className: `Layer__${COMPONENT_NAME3}__chart_with_summaries` }, /* @__PURE__ */ import_react66.default.createElement(
+  return /* @__PURE__ */ import_react67.default.createElement(import_react67.default.Fragment, null, !hideChart && /* @__PURE__ */ import_react67.default.createElement("div", { className: `Layer__${COMPONENT_NAME3}__chart_with_summaries` }, /* @__PURE__ */ import_react67.default.createElement(
     "div",
     {
       className: `Layer__${COMPONENT_NAME3}__chart_with_summaries__summary-col`
     },
-    /* @__PURE__ */ import_react66.default.createElement(ProfitAndLoss.DatePicker, null),
-    /* @__PURE__ */ import_react66.default.createElement(ProfitAndLoss.Summaries, { vertical: true })
-  ), /* @__PURE__ */ import_react66.default.createElement(
+    /* @__PURE__ */ import_react67.default.createElement(ProfitAndLoss.DatePicker, null),
+    /* @__PURE__ */ import_react67.default.createElement(ProfitAndLoss.Summaries, { vertical: true })
+  ), /* @__PURE__ */ import_react67.default.createElement(
     "div",
     {
       className: `Layer__${COMPONENT_NAME3}__chart_with_summaries__chart-col`
     },
-    /* @__PURE__ */ import_react66.default.createElement(ProfitAndLoss.Chart, null)
-  )), !hideTable && /* @__PURE__ */ import_react66.default.createElement(ProfitAndLoss.Table, null));
+    /* @__PURE__ */ import_react67.default.createElement(ProfitAndLoss.Chart, null)
+  )), !hideTable && /* @__PURE__ */ import_react67.default.createElement(ProfitAndLoss.Table, null));
 };
 
 // src/components/ChartOfAccounts/ChartOfAccounts.tsx
-var import_react81 = __toESM(require("react"));
+var import_react82 = __toESM(require("react"));
+
+// src/hooks/useChartOfAccounts/useChartOfAccounts.tsx
+var import_react68 = require("react");
+
+// src/components/ChartOfAccountsForm/constants.ts
+var LEDGER_ACCOUNT_TYPES = [
+  {
+    value: "ASSET",
+    label: "Assets"
+  },
+  {
+    value: "LIABILITY",
+    label: "Liabilities"
+  },
+  {
+    value: "EQUITY",
+    label: "Equities"
+  },
+  {
+    value: "REVENUE",
+    label: "Revenue"
+  },
+  {
+    value: "EXPENSE",
+    label: "Expenses"
+  }
+];
+var DEFAULT_ACCOUNT_TYPE_DIRECTION = {
+  ASSET: "DEBIT" /* DEBIT */,
+  LIABILITY: "CREDIT" /* CREDIT */,
+  EQUITY: "CREDIT" /* CREDIT */,
+  REVENUE: "CREDIT" /* CREDIT */,
+  EXPENSE: "DEBIT" /* DEBIT */
+};
+var NORMALITY_OPTIONS = [
+  {
+    value: "DEBIT" /* DEBIT */,
+    label: "Debit"
+  },
+  {
+    value: "CREDIT" /* CREDIT */,
+    label: "Credit"
+  }
+];
+var ASSET_LEDGER_ACCOUNT_SUBTYPES = [
+  {
+    value: "BANK_ACCOUNTS",
+    label: "Bank Accounts"
+  },
+  {
+    value: "ACCOUNTS_RECEIVABLE",
+    label: "Accounts Receivable"
+  },
+  {
+    value: "INVENTORY",
+    label: "Inventory"
+  },
+  {
+    value: "PAYMENT_PROCESSOR_CLEARING_ACCOUNT",
+    label: "Payment Processor Clearing Accounts"
+  },
+  {
+    value: "FIXED_ASSET",
+    label: "Fixed Assets"
+  },
+  {
+    value: "CASH",
+    label: "Cash"
+  },
+  {
+    value: "UNDEPOSITED_FUNDS",
+    label: "Undeposited Funds"
+  }
+];
+var LIABILITY_LEDGER_ACCOUNT_SUBTYPES = [
+  {
+    value: "LIABILITY",
+    label: "Liabilities"
+  },
+  {
+    value: "ACCOUNTS_PAYABLE",
+    label: "Accounts Payable"
+  },
+  {
+    value: "CREDIT_CARD",
+    label: "Credit Cards"
+  },
+  {
+    value: "SHAREHOLDER_LOAN",
+    label: "Shareholder Loans"
+  },
+  {
+    value: "PAYROLL_LIABILITY",
+    label: "Payroll Liabilities"
+  },
+  {
+    value: "SALES_TAXES_PAYABLE",
+    label: "Sales Taxes Payable"
+  },
+  {
+    value: "LINE_OF_CREDIT",
+    label: "Lines of Credit"
+  },
+  {
+    value: "NOTES_PAYABLE",
+    label: "Notes Payable"
+  },
+  {
+    value: "TIPS",
+    label: "Tips"
+  },
+  {
+    value: "UNEARNED_REVENUE",
+    label: "Unearned Revenue"
+  },
+  {
+    value: "UNDEPOSITED_OUTFLOWS",
+    label: "Undeposited Outflows"
+  }
+];
+var EQUITY_LEDGER_ACCOUNT_SUBTYPES = [
+  {
+    value: "CONTRIBUTIONS",
+    label: "Contributions"
+  },
+  {
+    value: "DISTRIBUTIONS",
+    label: "Distributions"
+  },
+  {
+    value: "COMMON_STOCK",
+    label: "Common Stock"
+  },
+  {
+    value: "ADDITIONAL_PAID_IN_CAPITAL",
+    label: "Additional Paid In Capital"
+  },
+  {
+    value: "RETAINED_EARNINGS",
+    label: "Retained Earnings"
+  },
+  {
+    value: "ACCUMULATED_ADJUSTMENTS",
+    label: "Accumulated Adjustments"
+  },
+  {
+    value: "OPENING_BALANCE_EQUITY",
+    label: "Opening Balance Equity"
+  }
+];
+var REVENUE_LEDGER_ACCOUNT_SUBTYPES = [
+  {
+    value: "SALES",
+    label: "Sales"
+  },
+  {
+    value: "UNCATEGORIZED_REVENUE",
+    label: "Uncategorized Revenue"
+  },
+  {
+    value: "RETURNS_ALLOWANCES",
+    label: "Returns & Allowances"
+  }
+];
+var EXPENSE_LEDGER_ACCOUNT_SUBTYPES = [
+  {
+    value: "COGS",
+    label: "COGS"
+  },
+  {
+    value: "OPERATING_EXPENSES",
+    label: "Operating Expenses"
+  },
+  {
+    value: "PAYROLL",
+    label: "Payroll"
+  },
+  {
+    value: "TAXES_LICENSES",
+    label: "Taxes & Licenses"
+  },
+  {
+    value: "BAD_DEBT",
+    label: "Bad Debt"
+  },
+  {
+    value: "CHARITABLE_CONTRIBUTIONS",
+    label: "Charitable Contributions"
+  }
+];
+var LEDGER_ACCOUNT_SUBTYPES = [
+  ...ASSET_LEDGER_ACCOUNT_SUBTYPES,
+  ...LIABILITY_LEDGER_ACCOUNT_SUBTYPES,
+  ...EQUITY_LEDGER_ACCOUNT_SUBTYPES,
+  ...REVENUE_LEDGER_ACCOUNT_SUBTYPES,
+  ...EXPENSE_LEDGER_ACCOUNT_SUBTYPES
+];
+var LEDGER_ACCOUNT_SUBTYPES_FOR_TYPE = {
+  ASSET: ASSET_LEDGER_ACCOUNT_SUBTYPES,
+  LIABILITY: LIABILITY_LEDGER_ACCOUNT_SUBTYPES,
+  EQUITY: EQUITY_LEDGER_ACCOUNT_SUBTYPES,
+  REVENUE: REVENUE_LEDGER_ACCOUNT_SUBTYPES,
+  EXPENSE: EXPENSE_LEDGER_ACCOUNT_SUBTYPES
+};
 
 // src/hooks/useChartOfAccounts/useChartOfAccounts.tsx
-var import_react67 = require("react");
 var import_swr6 = __toESM(require("swr"));
 var validate = (formData) => {
   const errors = [];
@@ -6886,6 +7450,14 @@ var validate = (formData) => {
   if (nameError) {
     errors.push(nameError);
   }
+  const normalityError = validateNormality(formData);
+  if (normalityError) {
+    errors.push(normalityError);
+  }
+  const typeError = validateType(formData);
+  if (typeError) {
+    errors.push(typeError);
+  }
   return errors;
 };
 var revalidateField = (fieldName, formData) => {
@@ -6897,10 +7469,48 @@ var revalidateField = (fieldName, formData) => {
       }
       return (formData?.errors || []).filter((x) => x.field !== fieldName);
     }
+    case "normality": {
+      const normalityError = validateNormality(formData);
+      if (normalityError) {
+        return (formData?.errors || []).filter((x) => x.field !== fieldName).concat([normalityError]);
+      }
+      return (formData?.errors || []).filter((x) => x.field !== fieldName);
+    }
+    case "type": {
+      const typeError = validateType(formData);
+      if (typeError) {
+        return (formData?.errors || []).filter((x) => x.field !== fieldName).concat([typeError]);
+      }
+      return (formData?.errors || []).filter((x) => x.field !== fieldName);
+    }
     default:
       return formData?.errors;
   }
 };
+var validateType = (formData) => {
+  if (!formData?.data.type?.value) {
+    return {
+      field: "type",
+      message: "Must be selected"
+    };
+  }
+  return;
+};
+var validateNormality = (formData) => {
+  const stringValueNormality = formData?.data.normality?.value?.toString();
+  if (stringValueNormality === void 0) {
+    return {
+      field: "normality",
+      message: "Must be selected"
+    };
+  } else if (!["DEBIT", "CREDIT"].includes(stringValueNormality)) {
+    return {
+      field: "normality",
+      message: "Must be selected"
+    };
+  }
+  return;
+};
 var validateName = (formData) => {
   if (!formData?.data.name?.trim()) {
     return {
@@ -6913,9 +7523,9 @@ var validateName = (formData) => {
 var flattenAccounts = (accounts) => accounts.flatMap((a) => [a, flattenAccounts(a.sub_accounts || [])]).flat().filter((id) => id);
 var useChartOfAccounts = () => {
   const { auth, businessId, apiUrl } = useLayerContext();
-  const [form, setForm] = (0, import_react67.useState)();
-  const [sendingForm, setSendingForm] = (0, import_react67.useState)(false);
-  const [apiError, setApiError] = (0, import_react67.useState)(void 0);
+  const [form, setForm] = (0, import_react68.useState)();
+  const [sendingForm, setSendingForm] = (0, import_react68.useState)(false);
+  const [apiError, setApiError] = (0, import_react68.useState)(void 0);
   const { data, isLoading, isValidating, error, mutate } = (0, import_swr6.default)(
     businessId && auth?.access_token && `chart-of-accounts-${businessId}`,
     Layer.getLedgerAccountBalances(apiUrl, auth?.access_token, {
@@ -6941,14 +7551,8 @@ var useChartOfAccounts = () => {
   const update = async (accountData, accountId) => {
     setSendingForm(true);
     setApiError(void 0);
-    const stable_name = convertToStableName(accountData.name);
     const newAccountData = {
-      ...accountData,
-      stable_name,
-      pnl_category: "INCOME",
-      //this field will be deprecated soon, but is still required
-      always_show_in_pnl: false
-      //this field will be deprecated soon, but is still required
+      ...accountData
     };
     try {
       await Layer.updateAccount(apiUrl, auth?.access_token, {
@@ -6977,13 +7581,14 @@ var useChartOfAccounts = () => {
     }
     const data2 = {
       name: form.data.name ?? "",
-      normality: form.data.subType?.value,
+      stable_name: form.data.stable_name,
       parent_id: form.data.parent ? {
         type: "AccountId",
         id: form.data.parent.value
       } : void 0,
       account_type: form.data.type.value.toString(),
-      account_subtype: form.data.subType?.value.toString()
+      account_subtype: form.data.subType?.value.toString(),
+      normality: form.data.normality?.value
     };
     if (form.action === "new") {
       create(data2);
@@ -7000,10 +7605,8 @@ var useChartOfAccounts = () => {
     data: {
       parent: void 0,
       name: void 0,
-      type: {
-        value: "ASSETS",
-        label: "Assets"
-      },
+      type: void 0,
+      normality: void 0,
       subType: void 0
     }
   });
@@ -7024,12 +7627,19 @@ var useChartOfAccounts = () => {
           value: parent.id,
           label: parent.name
         } : void 0,
+        stable_name: found.stable_name,
         name: found.name,
         type: {
-          value: "ASSETS",
-          label: "Assets"
+          value: found.account_type.value,
+          label: found.account_type.display_name
         },
-        subType: void 0
+        subType: found.account_subtype ? {
+          value: found.account_subtype?.value,
+          label: found.account_subtype?.display_name
+        } : void 0,
+        normality: NORMALITY_OPTIONS.find(
+          (normalityOption) => normalityOption.value == found.normality
+        )
       }
     });
   };
@@ -7038,13 +7648,41 @@ var useChartOfAccounts = () => {
     if (!form) {
       return;
     }
-    const newFormData = {
+    let newFormData = {
       ...form,
       data: {
         ...form.data,
         [fieldName]: value
       }
     };
+    if (fieldName === "parent") {
+      const allAccounts = flattenAccounts(data?.data?.accounts || []);
+      const foundParent = allAccounts?.find(
+        (x) => x.id === value.value
+      );
+      if (foundParent) {
+        newFormData = {
+          ...newFormData,
+          data: {
+            ...newFormData.data,
+            /* Inherit the parent's type */
+            type: {
+              value: foundParent.account_type.value,
+              label: foundParent.account_type.display_name
+            },
+            /* If the parent has a subtype, inherit it */
+            subType: foundParent.account_subtype ? {
+              value: foundParent.account_subtype?.value,
+              label: foundParent.account_subtype?.display_name
+            } : void 0,
+            /* Inherit the parent's normality */
+            normality: NORMALITY_OPTIONS.find(
+              (normalityOption) => normalityOption.value == foundParent.normality
+            )
+          }
+        };
+      }
+    }
     const errors = revalidateField(fieldName, newFormData);
     setForm({
       ...newFormData,
@@ -7071,12 +7709,12 @@ var useChartOfAccounts = () => {
 };
 
 // src/hooks/useLedgerAccounts/useLedgerAccounts.tsx
-var import_react68 = require("react");
+var import_react69 = require("react");
 var import_swr7 = __toESM(require("swr"));
 var useLedgerAccounts = () => {
   const { auth, businessId, apiUrl } = useLayerContext();
-  const [accountId, setAccountId] = (0, import_react68.useState)();
-  const [selectedEntryId, setSelectedEntryId] = (0, import_react68.useState)();
+  const [accountId, setAccountId] = (0, import_react69.useState)();
+  const [selectedEntryId, setSelectedEntryId] = (0, import_react69.useState)();
   const { data, isLoading, isValidating, error, mutate } = (0, import_swr7.default)(
     businessId && accountId && auth?.access_token && `ledger-accounts-lines-${businessId}-${accountId}`,
     Layer.getLedgerAccountsLines(apiUrl, auth?.access_token, {
@@ -7119,10 +7757,10 @@ var useLedgerAccounts = () => {
 };
 
 // src/components/ChartOfAccountsTable/ChartOfAccountsTable.tsx
-var import_react73 = __toESM(require("react"));
+var import_react74 = __toESM(require("react"));
 
 // src/components/ChartOfAccountsRow/ChartOfAccountsRow.tsx
-var import_react69 = __toESM(require("react"));
+var import_react70 = __toESM(require("react"));
 
 // src/icons/Edit2.tsx
 var React83 = __toESM(require("react"));
@@ -7149,7 +7787,7 @@ var Edit2 = ({ size = 18, ...props }) => /* @__PURE__ */ React83.createElement(
 var Edit2_default = Edit2;
 
 // src/components/ChartOfAccountsRow/ChartOfAccountsRow.tsx
-var import_classnames31 = __toESM(require("classnames"));
+var import_classnames33 = __toESM(require("classnames"));
 var INDENTATION = 24;
 var MOBILE_INDENTATION = 12;
 var EXPANDED_STYLE = {
@@ -7180,10 +7818,10 @@ var ChartOfAccountsRow = ({
   acountsLength,
   view
 }) => {
-  const { form, editAccount } = (0, import_react69.useContext)(ChartOfAccountsContext);
-  const { setAccountId } = (0, import_react69.useContext)(LedgerAccountsContext);
+  const { form, editAccount } = (0, import_react70.useContext)(ChartOfAccountsContext);
+  const { setAccountId } = (0, import_react70.useContext)(LedgerAccountsContext);
   const baseStyle = view === "desktop" ? EXPANDED_STYLE : EXPANDED_MOBILE_STYLE;
-  const [isOpen, setIsOpen] = (0, import_react69.useState)(defaultOpen);
+  const [isOpen, setIsOpen] = (0, import_react70.useState)(defaultOpen);
   const style = expanded ? {
     ...baseStyle,
     transitionDelay: `${15 * index}ms`
@@ -7191,14 +7829,14 @@ var ChartOfAccountsRow = ({
     ...COLLAPSED_STYLE,
     transitionDelay: `${acountsLength - 15 * index}ms`
   };
-  const [showComponent, setShowComponent] = (0, import_react69.useState)(false);
-  (0, import_react69.useEffect)(() => {
+  const [showComponent, setShowComponent] = (0, import_react70.useState)(false);
+  (0, import_react70.useEffect)(() => {
     const timeoutId = setTimeout(() => {
       setShowComponent(true);
     }, cumulativeIndex * 50);
     return () => clearTimeout(timeoutId);
   }, []);
-  const baseClass = (0, import_classnames31.default)(
+  const baseClass = (0, import_classnames33.default)(
     "Layer__table-row",
     isOpen ? "Layer__table-row--expanded" : "Layer__table-row--collapsed",
     !expanded && "Layer__table-row--hidden",
@@ -7206,15 +7844,15 @@ var ChartOfAccountsRow = ({
     form?.accountId === account.id && "Layer__table-row--active",
     !showComponent && "Layer__table-row--anim-starting-state"
   );
-  const desktopRowClass = (0, import_classnames31.default)(
+  const desktopRowClass = (0, import_classnames33.default)(
     baseClass,
     "Layer__chart-of-accounts__row---desktop"
   );
-  const mobileRowClass = (0, import_classnames31.default)(
+  const mobileRowClass = (0, import_classnames33.default)(
     baseClass,
     "Layer__chart-of-accounts__row---mobile"
   );
-  return /* @__PURE__ */ import_react69.default.createElement(import_react69.default.Fragment, null, view === "desktop" && /* @__PURE__ */ import_react69.default.createElement(
+  return /* @__PURE__ */ import_react70.default.createElement(import_react70.default.Fragment, null, view === "desktop" && /* @__PURE__ */ import_react70.default.createElement(
     "tr",
     {
       className: desktopRowClass,
@@ -7224,7 +7862,7 @@ var ChartOfAccountsRow = ({
         setAccountId(account.id);
       }
     },
-    /* @__PURE__ */ import_react69.default.createElement("td", { className: "Layer__table-cell Layer__coa__name" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "Layer__table-cell-content", style }, /* @__PURE__ */ import_react69.default.createElement(
+    /* @__PURE__ */ import_react70.default.createElement("td", { className: "Layer__table-cell Layer__coa__name" }, /* @__PURE__ */ import_react70.default.createElement("span", { className: "Layer__table-cell-content", style }, /* @__PURE__ */ import_react70.default.createElement(
       "span",
       {
         className: "Layer__table-cell-content-indentation",
@@ -7232,7 +7870,7 @@ var ChartOfAccountsRow = ({
           paddingLeft: INDENTATION * depth + 16
         }
       },
-      account.sub_accounts && account.sub_accounts.length > 0 && /* @__PURE__ */ import_react69.default.createElement(
+      account.sub_accounts && account.sub_accounts.length > 0 && /* @__PURE__ */ import_react70.default.createElement(
         ChevronDownFill_default,
         {
           size: 16,
@@ -7243,22 +7881,22 @@ var ChartOfAccountsRow = ({
           }
         }
       ),
-      /* @__PURE__ */ import_react69.default.createElement("span", { className: "Layer__coa__name__text" }, account.name)
+      /* @__PURE__ */ import_react70.default.createElement("span", { className: "Layer__coa__name__text" }, account.name)
     ))),
-    /* @__PURE__ */ import_react69.default.createElement("td", { className: "Layer__table-cell Layer__coa__type" }, /* @__PURE__ */ import_react69.default.createElement(
+    /* @__PURE__ */ import_react70.default.createElement("td", { className: "Layer__table-cell Layer__coa__type" }, /* @__PURE__ */ import_react70.default.createElement(
       "span",
       {
         className: "Layer__table-cell-content Layer__mobile--hidden",
         style
       },
       account.account_type?.display_name
-    ), /* @__PURE__ */ import_react69.default.createElement(
+    ), /* @__PURE__ */ import_react70.default.createElement(
       "span",
       {
         className: "Layer__table-cell-content Layer__desktop--hidden",
         style
       },
-      /* @__PURE__ */ import_react69.default.createElement(
+      /* @__PURE__ */ import_react70.default.createElement(
         Text,
         {
           weight: "bold" /* bold */,
@@ -7266,10 +7904,10 @@ var ChartOfAccountsRow = ({
         },
         account.normality
       ),
-      /* @__PURE__ */ import_react69.default.createElement(Text, { className: "Layer__coa__subtype--mobile" }, account.account_subtype?.display_name)
+      /* @__PURE__ */ import_react70.default.createElement(Text, { className: "Layer__coa__subtype--mobile" }, account.account_subtype?.display_name)
     )),
-    /* @__PURE__ */ import_react69.default.createElement("td", { className: "Layer__table-cell Layer__coa__subtype Layer__mobile--hidden" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "Layer__table-cell-content", style }, account.account_subtype?.display_name)),
-    /* @__PURE__ */ import_react69.default.createElement("td", { className: "Layer__table-cell Layer__coa__balance" }, /* @__PURE__ */ import_react69.default.createElement(
+    /* @__PURE__ */ import_react70.default.createElement("td", { className: "Layer__table-cell Layer__coa__subtype Layer__mobile--hidden" }, /* @__PURE__ */ import_react70.default.createElement("span", { className: "Layer__table-cell-content", style }, account.account_subtype?.display_name)),
+    /* @__PURE__ */ import_react70.default.createElement("td", { className: "Layer__table-cell Layer__coa__balance" }, /* @__PURE__ */ import_react70.default.createElement(
       "span",
       {
         className: "Layer__table-cell-content Layer__table-cell--amount",
@@ -7278,11 +7916,11 @@ var ChartOfAccountsRow = ({
       "$",
       centsToDollars(Math.abs(account.balance || 0))
     )),
-    /* @__PURE__ */ import_react69.default.createElement("td", { className: "Layer__table-cell Layer__coa__actions" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "Layer__table-cell-content", style }, /* @__PURE__ */ import_react69.default.createElement(
+    /* @__PURE__ */ import_react70.default.createElement("td", { className: "Layer__table-cell Layer__coa__actions" }, /* @__PURE__ */ import_react70.default.createElement("span", { className: "Layer__table-cell-content", style }, /* @__PURE__ */ import_react70.default.createElement(
       Button,
       {
         variant: "secondary" /* secondary */,
-        rightIcon: /* @__PURE__ */ import_react69.default.createElement(Edit2_default, { size: 12 }),
+        rightIcon: /* @__PURE__ */ import_react70.default.createElement(Edit2_default, { size: 12 }),
         iconOnly: true,
         onClick: (e) => {
           e.preventDefault();
@@ -7292,7 +7930,7 @@ var ChartOfAccountsRow = ({
       },
       "Edit"
     )))
-  ), view === "mobile" || view === "tablet" ? /* @__PURE__ */ import_react69.default.createElement(
+  ), view === "mobile" || view === "tablet" ? /* @__PURE__ */ import_react70.default.createElement(
     "tr",
     {
       className: mobileRowClass,
@@ -7302,7 +7940,7 @@ var ChartOfAccountsRow = ({
         setAccountId(account.id);
       }
     },
-    /* @__PURE__ */ import_react69.default.createElement("td", { className: "Layer__table-cell", colSpan: 5 }, /* @__PURE__ */ import_react69.default.createElement(
+    /* @__PURE__ */ import_react70.default.createElement("td", { className: "Layer__table-cell", colSpan: 5 }, /* @__PURE__ */ import_react70.default.createElement(
       "span",
       {
         className: "Layer__table-cell-content Layer__table-cell-content-indentation",
@@ -7311,7 +7949,7 @@ var ChartOfAccountsRow = ({
           ...style
         }
       },
-      account.sub_accounts && account.sub_accounts.length > 0 && /* @__PURE__ */ import_react69.default.createElement(
+      account.sub_accounts && account.sub_accounts.length > 0 && /* @__PURE__ */ import_react70.default.createElement(
         ChevronDownFill_default,
         {
           size: 16,
@@ -7322,14 +7960,14 @@ var ChartOfAccountsRow = ({
           }
         }
       ),
-      /* @__PURE__ */ import_react69.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content__top-row" }, /* @__PURE__ */ import_react69.default.createElement(
+      /* @__PURE__ */ import_react70.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content" }, /* @__PURE__ */ import_react70.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content__top-row" }, /* @__PURE__ */ import_react70.default.createElement(
         Text,
         {
           as: "span",
           className: "Layer__chart-of-accounts__mobile-row-content__name"
         },
         account.name
-      ), /* @__PURE__ */ import_react69.default.createElement(
+      ), /* @__PURE__ */ import_react70.default.createElement(
         TextButton,
         {
           onClick: (e) => {
@@ -7339,7 +7977,7 @@ var ChartOfAccountsRow = ({
           }
         },
         "Edit"
-      )), /* @__PURE__ */ import_react69.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content__bottom-row" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content__types" }, /* @__PURE__ */ import_react69.default.createElement(Text, { as: "span" }, account.normality), /* @__PURE__ */ import_react69.default.createElement("span", { className: "Layer__chart-of-accounts__mobile-row-content__separator" }), /* @__PURE__ */ import_react69.default.createElement(Text, { as: "span" }, "Sub-Type")), /* @__PURE__ */ import_react69.default.createElement(
+      )), /* @__PURE__ */ import_react70.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content__bottom-row" }, /* @__PURE__ */ import_react70.default.createElement("div", { className: "Layer__chart-of-accounts__mobile-row-content__types" }, /* @__PURE__ */ import_react70.default.createElement(Text, { as: "span" }, account.normality), /* @__PURE__ */ import_react70.default.createElement("span", { className: "Layer__chart-of-accounts__mobile-row-content__separator" }), /* @__PURE__ */ import_react70.default.createElement(Text, { as: "span" }, "Sub-Type")), /* @__PURE__ */ import_react70.default.createElement(
         Text,
         {
           as: "span",
@@ -7349,7 +7987,7 @@ var ChartOfAccountsRow = ({
         centsToDollars(Math.abs(account.balance || 0))
       )))
     ))
-  ) : null, (account.sub_accounts || []).map((subAccount, idx) => /* @__PURE__ */ import_react69.default.createElement(
+  ) : null, (account.sub_accounts || []).map((subAccount, idx) => /* @__PURE__ */ import_react70.default.createElement(
     ChartOfAccountsRow,
     {
       key: subAccount.id,
@@ -7365,26 +8003,14 @@ var ChartOfAccountsRow = ({
 };
 
 // src/components/ChartOfAccountsSidebar/ChartOfAccountsSidebar.tsx
-var import_react72 = __toESM(require("react"));
+var import_react73 = __toESM(require("react"));
 
 // src/components/ChartOfAccountsForm/ChartOfAccountsForm.tsx
-var import_react71 = __toESM(require("react"));
-
-// src/components/ChartOfAccountsForm/constants.ts
-var SUB_TYPE_OPTIONS = [
-  {
-    value: "DEBIT" /* DEBIT */,
-    label: "Debit"
-  },
-  {
-    value: "CREDIT" /* CREDIT */,
-    label: "Credit"
-  }
-];
+var import_react72 = __toESM(require("react"));
 
 // src/components/ChartOfAccountsForm/useParentOptions.ts
-var import_react70 = require("react");
-var useParentOptions = (data) => (0, import_react70.useMemo)(
+var import_react71 = require("react");
+var useParentOptions = (data) => (0, import_react71.useMemo)(
   () => flattenAccounts(data?.accounts || []).sort((a, b) => a?.name && b?.name ? a.name.localeCompare(b.name) : 0).map((x) => {
     return {
       label: x.name,
@@ -7404,9 +8030,9 @@ var ChartOfAccountsForm = () => {
     submitForm,
     sendingForm,
     apiError
-  } = (0, import_react71.useContext)(ChartOfAccountsContext);
+  } = (0, import_react72.useContext)(ChartOfAccountsContext);
   const parentOptions = useParentOptions(data);
-  const entry = (0, import_react71.useMemo)(() => {
+  const entry = (0, import_react72.useMemo)(() => {
     if (form?.action === "edit" && form.accountId) {
       return flattenAccounts(data?.accounts || []).find(
         (x) => x.id === form.accountId
@@ -7417,7 +8043,7 @@ var ChartOfAccountsForm = () => {
   if (!form) {
     return;
   }
-  return /* @__PURE__ */ import_react71.default.createElement(
+  return /* @__PURE__ */ import_react72.default.createElement(
     "form",
     {
       className: "Layer__form",
@@ -7426,7 +8052,7 @@ var ChartOfAccountsForm = () => {
         submitForm();
       }
     },
-    /* @__PURE__ */ import_react71.default.createElement("div", { className: "Layer__chart-of-accounts__sidebar__header" }, /* @__PURE__ */ import_react71.default.createElement(Text, { size: "lg" /* lg */, weight: "bold" /* bold */, className: "title" }, form?.action === "edit" ? "Edit" : "Add New", " Account"), /* @__PURE__ */ import_react71.default.createElement("div", { className: "actions" }, /* @__PURE__ */ import_react71.default.createElement(
+    /* @__PURE__ */ import_react72.default.createElement("div", { className: "Layer__chart-of-accounts__sidebar__header" }, /* @__PURE__ */ import_react72.default.createElement(Text, { size: "lg" /* lg */, weight: "bold" /* bold */, className: "title" }, form?.action === "edit" ? "Edit" : "Add New", " Account"), /* @__PURE__ */ import_react72.default.createElement("div", { className: "actions" }, /* @__PURE__ */ import_react72.default.createElement(
       Button,
       {
         type: "button",
@@ -7435,7 +8061,7 @@ var ChartOfAccountsForm = () => {
         disabled: sendingForm
       },
       "Cancel"
-    ), apiError && /* @__PURE__ */ import_react71.default.createElement(
+    ), apiError && /* @__PURE__ */ import_react72.default.createElement(
       RetryButton,
       {
         type: "submit",
@@ -7444,7 +8070,7 @@ var ChartOfAccountsForm = () => {
         disabled: sendingForm
       },
       "Retry"
-    ), !apiError && /* @__PURE__ */ import_react71.default.createElement(
+    ), !apiError && /* @__PURE__ */ import_react72.default.createElement(
       SubmitButton,
       {
         type: "submit",
@@ -7454,7 +8080,7 @@ var ChartOfAccountsForm = () => {
       },
       "Save"
     ))),
-    apiError && /* @__PURE__ */ import_react71.default.createElement(
+    apiError && /* @__PURE__ */ import_react72.default.createElement(
       Text,
       {
         size: "sm" /* sm */,
@@ -7462,8 +8088,8 @@ var ChartOfAccountsForm = () => {
       },
       apiError
     ),
-    entry && /* @__PURE__ */ import_react71.default.createElement("div", { className: "Layer__chart-of-accounts__form-edit-entry" }, /* @__PURE__ */ import_react71.default.createElement(Text, { weight: "bold" /* bold */ }, entry.name), /* @__PURE__ */ import_react71.default.createElement(Text, { weight: "bold" /* bold */ }, "$", centsToDollars(entry.balance || 0))),
-    /* @__PURE__ */ import_react71.default.createElement("div", { className: "Layer__chart-of-accounts__form" }, /* @__PURE__ */ import_react71.default.createElement(InputGroup, { name: "parent", label: "Parent", inline: true }, /* @__PURE__ */ import_react71.default.createElement(
+    entry && /* @__PURE__ */ import_react72.default.createElement("div", { className: "Layer__chart-of-accounts__form-edit-entry" }, /* @__PURE__ */ import_react72.default.createElement(Text, { weight: "bold" /* bold */ }, entry.name), /* @__PURE__ */ import_react72.default.createElement(Text, { weight: "bold" /* bold */ }, "$", centsToDollars(entry.balance || 0))),
+    /* @__PURE__ */ import_react72.default.createElement("div", { className: "Layer__chart-of-accounts__form" }, /* @__PURE__ */ import_react72.default.createElement(InputGroup, { name: "parent", label: "Parent", inline: true }, /* @__PURE__ */ import_react72.default.createElement(
       Select2,
       {
         options: parentOptions,
@@ -7471,7 +8097,7 @@ var ChartOfAccountsForm = () => {
         onChange: (sel) => changeFormData("parent", sel),
         disabled: sendingForm
       }
-    )), /* @__PURE__ */ import_react71.default.createElement(InputGroup, { name: "name", label: "Name", inline: true }, /* @__PURE__ */ import_react71.default.createElement(
+    )), /* @__PURE__ */ import_react72.default.createElement(InputGroup, { name: "name", label: "Name", inline: true }, /* @__PURE__ */ import_react72.default.createElement(
       Input,
       {
         name: "name",
@@ -7482,22 +8108,36 @@ var ChartOfAccountsForm = () => {
         disabled: sendingForm,
         onChange: (e) => changeFormData("name", e.target.value)
       }
-    )), /* @__PURE__ */ import_react71.default.createElement(InputGroup, { name: "type", label: "Type", inline: true }, /* @__PURE__ */ import_react71.default.createElement(
+    )), /* @__PURE__ */ import_react72.default.createElement(InputGroup, { name: "type", label: "Type", inline: true }, /* @__PURE__ */ import_react72.default.createElement(
       Select2,
       {
-        options: [],
-        disabled: true,
+        options: LEDGER_ACCOUNT_TYPES,
         value: form?.data.type,
-        onChange: (sel) => changeFormData("type", sel)
+        onChange: (sel) => changeFormData("type", sel),
+        isInvalid: Boolean(form?.errors?.find((x) => x.field === "type")),
+        errorMessage: form?.errors?.find((x) => x.field === "type")?.message,
+        disabled: sendingForm || form.action === "edit" || form.data.parent !== void 0
       }
-    )), /* @__PURE__ */ import_react71.default.createElement(InputGroup, { name: "subType", label: "Sub-Type", inline: true }, /* @__PURE__ */ import_react71.default.createElement(
+    )), /* @__PURE__ */ import_react72.default.createElement(InputGroup, { name: "subType", label: "Sub-Type", inline: true }, /* @__PURE__ */ import_react72.default.createElement(
       Select2,
       {
-        options: SUB_TYPE_OPTIONS,
+        options: form?.data.type?.value !== void 0 ? LEDGER_ACCOUNT_SUBTYPES_FOR_TYPE[form?.data.type?.value] : LEDGER_ACCOUNT_SUBTYPES,
         value: form?.data.subType,
         onChange: (sel) => changeFormData("subType", sel),
         disabled: sendingForm
       }
+    )), /* @__PURE__ */ import_react72.default.createElement(InputGroup, { name: "normality", label: "Normality", inline: true }, /* @__PURE__ */ import_react72.default.createElement(
+      Select2,
+      {
+        options: NORMALITY_OPTIONS,
+        value: form?.data.normality,
+        isInvalid: Boolean(
+          form?.errors?.find((x) => x.field === "normality")
+        ),
+        errorMessage: form?.errors?.find((x) => x.field === "normality")?.message,
+        onChange: (sel) => changeFormData("normality", sel),
+        disabled: sendingForm
+      }
     )))
   );
 };
@@ -7506,7 +8146,7 @@ var ChartOfAccountsForm = () => {
 var ChartOfAccountsSidebar = ({
   parentRef: _parentRef
 }) => {
-  return /* @__PURE__ */ import_react72.default.createElement(ChartOfAccountsForm, null);
+  return /* @__PURE__ */ import_react73.default.createElement(ChartOfAccountsForm, null);
 };
 
 // src/components/ChartOfAccountsTable/ChartOfAccountsTable.tsx
@@ -7515,29 +8155,29 @@ var ChartOfAccountsTable = ({
   view,
   containerRef
 }) => {
-  const { data, isLoading, addAccount, error, isValidating, refetch, form } = (0, import_react73.useContext)(ChartOfAccountsContext);
+  const { data, isLoading, addAccount, error, isValidating, refetch, form } = (0, import_react74.useContext)(ChartOfAccountsContext);
   let cumulativeIndex = 0;
   const accountsLength = data?.accounts.length ?? 0;
-  return /* @__PURE__ */ import_react73.default.createElement(
+  return /* @__PURE__ */ import_react74.default.createElement(
     Panel,
     {
-      sidebar: /* @__PURE__ */ import_react73.default.createElement(ChartOfAccountsSidebar, { parentRef: containerRef }),
+      sidebar: /* @__PURE__ */ import_react74.default.createElement(ChartOfAccountsSidebar, { parentRef: containerRef }),
       sidebarIsOpen: Boolean(form),
       parentRef: containerRef
     },
-    /* @__PURE__ */ import_react73.default.createElement(Header, { className: `Layer__${COMPONENT_NAME4}__header` }, /* @__PURE__ */ import_react73.default.createElement(Heading, { className: `Layer__${COMPONENT_NAME4}__title` }, "Chart of Accounts"), /* @__PURE__ */ import_react73.default.createElement("div", { className: `Layer__${COMPONENT_NAME4}__actions` }, /* @__PURE__ */ import_react73.default.createElement(
+    /* @__PURE__ */ import_react74.default.createElement(Header, { className: `Layer__${COMPONENT_NAME4}__header` }, /* @__PURE__ */ import_react74.default.createElement(Heading, { className: `Layer__${COMPONENT_NAME4}__title` }, "Chart of Accounts"), /* @__PURE__ */ import_react74.default.createElement("div", { className: `Layer__${COMPONENT_NAME4}__actions` }, /* @__PURE__ */ import_react74.default.createElement(
       Button,
       {
         variant: "secondary" /* secondary */,
         disabled: isLoading,
-        rightIcon: /* @__PURE__ */ import_react73.default.createElement(DownloadCloud_default, { size: 12 })
+        rightIcon: /* @__PURE__ */ import_react74.default.createElement(DownloadCloud_default, { size: 12 })
       },
       "Download"
-    ), /* @__PURE__ */ import_react73.default.createElement(Button, { onClick: () => addAccount(), disabled: isLoading }, "Add Account"))),
-    /* @__PURE__ */ import_react73.default.createElement("table", { className: "Layer__chart-of-accounts__table" }, /* @__PURE__ */ import_react73.default.createElement("thead", null, /* @__PURE__ */ import_react73.default.createElement("tr", { className: "Layer__table-row--header" }, /* @__PURE__ */ import_react73.default.createElement("th", { className: "Layer__table-header Layer__coa__name" }, "Name"), /* @__PURE__ */ import_react73.default.createElement("th", { className: "Layer__table-header Layer__coa__type" }, "Type"), /* @__PURE__ */ import_react73.default.createElement("th", { className: "Layer__table-header Layer__coa__subtype Layer__mobile--hidden" }, "Sub-Type"), /* @__PURE__ */ import_react73.default.createElement("th", { className: "Layer__table-header Layer__coa__balance" }, "Balance"), /* @__PURE__ */ import_react73.default.createElement("th", { className: "Layer__table-header Layer__coa__actions" }))), /* @__PURE__ */ import_react73.default.createElement("tbody", null, !error && data?.accounts.map((account, idx) => {
+    ), /* @__PURE__ */ import_react74.default.createElement(Button, { onClick: () => addAccount(), disabled: isLoading }, "Add Account"))),
+    /* @__PURE__ */ import_react74.default.createElement("table", { className: "Layer__chart-of-accounts__table" }, /* @__PURE__ */ import_react74.default.createElement("thead", null, /* @__PURE__ */ import_react74.default.createElement("tr", { className: "Layer__table-row--header" }, /* @__PURE__ */ import_react74.default.createElement("th", { className: "Layer__table-header Layer__coa__name" }, "Name"), /* @__PURE__ */ import_react74.default.createElement("th", { className: "Layer__table-header Layer__coa__type" }, "Type"), /* @__PURE__ */ import_react74.default.createElement("th", { className: "Layer__table-header Layer__coa__subtype Layer__mobile--hidden" }, "Sub-Type"), /* @__PURE__ */ import_react74.default.createElement("th", { className: "Layer__table-header Layer__coa__balance" }, "Balance"), /* @__PURE__ */ import_react74.default.createElement("th", { className: "Layer__table-header Layer__coa__actions" }))), /* @__PURE__ */ import_react74.default.createElement("tbody", null, !error && data?.accounts.map((account, idx) => {
       const currentCumulativeIndex = cumulativeIndex;
       cumulativeIndex = (account.sub_accounts?.length || 0) + cumulativeIndex + 1;
-      return /* @__PURE__ */ import_react73.default.createElement(
+      return /* @__PURE__ */ import_react74.default.createElement(
         ChartOfAccountsRow,
         {
           key: account.id,
@@ -7552,7 +8192,7 @@ var ChartOfAccountsTable = ({
         }
       );
     }))),
-    error ? /* @__PURE__ */ import_react73.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react73.default.createElement(
+    error ? /* @__PURE__ */ import_react74.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react74.default.createElement(
       DataState,
       {
         status: "failed" /* failed */,
@@ -7562,8 +8202,8 @@ var ChartOfAccountsTable = ({
         isLoading: isValidating || isLoading
       }
     )) : null,
-    (!data || isLoading) && !error ? /* @__PURE__ */ import_react73.default.createElement("div", { className: `Layer__${COMPONENT_NAME4}__loader-container` }, /* @__PURE__ */ import_react73.default.createElement(Loader2, null)) : null,
-    !isLoading && !error && data?.accounts.length === 0 ? /* @__PURE__ */ import_react73.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react73.default.createElement(
+    (!data || isLoading) && !error ? /* @__PURE__ */ import_react74.default.createElement("div", { className: `Layer__${COMPONENT_NAME4}__loader-container` }, /* @__PURE__ */ import_react74.default.createElement(Loader2, null)) : null,
+    !isLoading && !error && data?.accounts.length === 0 ? /* @__PURE__ */ import_react74.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react74.default.createElement(
       DataState,
       {
         status: "info" /* info */,
@@ -7577,21 +8217,21 @@ var ChartOfAccountsTable = ({
 };
 
 // src/components/LedgerAccount/LedgerAccountIndex.tsx
-var import_react80 = __toESM(require("react"));
+var import_react81 = __toESM(require("react"));
 
 // src/components/LedgerAccountEntryDetails/LedgerAccountEntryDetails.tsx
-var import_react78 = __toESM(require("react"));
+var import_react79 = __toESM(require("react"));
 
 // src/components/Card/Card.tsx
-var import_react74 = __toESM(require("react"));
-var import_classnames32 = __toESM(require("classnames"));
+var import_react75 = __toESM(require("react"));
+var import_classnames34 = __toESM(require("classnames"));
 var Card = ({ children, className }) => {
-  return /* @__PURE__ */ import_react74.default.createElement("div", { className: (0, import_classnames32.default)("Layer__card", className) }, children);
+  return /* @__PURE__ */ import_react75.default.createElement("div", { className: (0, import_classnames34.default)("Layer__card", className) }, children);
 };
 
 // src/components/DateTime/DateTime.tsx
-var import_react75 = __toESM(require("react"));
-var import_date_fns15 = require("date-fns");
+var import_react76 = __toESM(require("react"));
+var import_date_fns17 = require("date-fns");
 var DateTime = ({
   value,
   format: format7,
@@ -7601,11 +8241,11 @@ var DateTime = ({
   onlyTime
 }) => {
   if (format7) {
-    return /* @__PURE__ */ import_react75.default.createElement(Text, { className: "Layer__datetime" }, (0, import_date_fns15.format)((0, import_date_fns15.parseISO)(value), format7));
+    return /* @__PURE__ */ import_react76.default.createElement(Text, { className: "Layer__datetime" }, (0, import_date_fns17.format)((0, import_date_fns17.parseISO)(value), format7));
   }
-  const date = (0, import_date_fns15.format)((0, import_date_fns15.parseISO)(value), dateFormat ?? DATE_FORMAT);
-  const time = (0, import_date_fns15.format)((0, import_date_fns15.parseISO)(value), timeFormat ?? TIME_FORMAT);
-  return /* @__PURE__ */ import_react75.default.createElement(Text, { className: "Layer__datetime" }, !onlyTime && /* @__PURE__ */ import_react75.default.createElement(
+  const date = (0, import_date_fns17.format)((0, import_date_fns17.parseISO)(value), dateFormat ?? DATE_FORMAT);
+  const time = (0, import_date_fns17.format)((0, import_date_fns17.parseISO)(value), timeFormat ?? TIME_FORMAT);
+  return /* @__PURE__ */ import_react76.default.createElement(Text, { className: "Layer__datetime" }, !onlyTime && /* @__PURE__ */ import_react76.default.createElement(
     Text,
     {
       as: "span",
@@ -7614,7 +8254,7 @@ var DateTime = ({
       className: "Layer__datetime__date"
     },
     date
-  ), !onlyDate && /* @__PURE__ */ import_react75.default.createElement(
+  ), !onlyDate && /* @__PURE__ */ import_react76.default.createElement(
     Text,
     {
       as: "span",
@@ -7627,22 +8267,22 @@ var DateTime = ({
 };
 
 // src/components/DetailsList/DetailsList.tsx
-var import_react76 = __toESM(require("react"));
-var import_classnames33 = __toESM(require("classnames"));
+var import_react77 = __toESM(require("react"));
+var import_classnames35 = __toESM(require("classnames"));
 var DetailsList = ({
   title,
   children,
   className,
   actions
 }) => {
-  return /* @__PURE__ */ import_react76.default.createElement("div", { className: (0, import_classnames33.default)("Layer__details-list", className) }, title && /* @__PURE__ */ import_react76.default.createElement(Header, null, /* @__PURE__ */ import_react76.default.createElement(Heading, { size: "secondary" /* secondary */ }, title), actions && /* @__PURE__ */ import_react76.default.createElement("div", { className: "Layer__details-list__actions" }, actions)), /* @__PURE__ */ import_react76.default.createElement("ul", { className: "Layer__details-list__list" }, children));
+  return /* @__PURE__ */ import_react77.default.createElement("div", { className: (0, import_classnames35.default)("Layer__details-list", className) }, title && /* @__PURE__ */ import_react77.default.createElement(Header, null, /* @__PURE__ */ import_react77.default.createElement(Heading, { size: "secondary" /* secondary */ }, title), actions && /* @__PURE__ */ import_react77.default.createElement("div", { className: "Layer__details-list__actions" }, actions)), /* @__PURE__ */ import_react77.default.createElement("ul", { className: "Layer__details-list__list" }, children));
 };
 
 // src/components/DetailsList/DetailsListItem.tsx
-var import_react77 = __toESM(require("react"));
+var import_react78 = __toESM(require("react"));
 var renderValue = (value) => {
   if (typeof value === "string") {
-    return /* @__PURE__ */ import_react77.default.createElement(Text, { weight: "bold" /* bold */, size: "sm" /* sm */ }, value);
+    return /* @__PURE__ */ import_react78.default.createElement(Text, { weight: "bold" /* bold */, size: "sm" /* sm */ }, value);
   }
   return value;
 };
@@ -7651,7 +8291,7 @@ var DetailsListItem = ({
   children,
   isLoading
 }) => {
-  return /* @__PURE__ */ import_react77.default.createElement("li", { className: "Layer__details-list-item" }, /* @__PURE__ */ import_react77.default.createElement("label", { className: "Layer__details-list-item__label" }, label), /* @__PURE__ */ import_react77.default.createElement("span", { className: "Layer__details-list-item__value" }, isLoading ? /* @__PURE__ */ import_react77.default.createElement(SkeletonLoader, null) : renderValue(children)));
+  return /* @__PURE__ */ import_react78.default.createElement("li", { className: "Layer__details-list-item" }, /* @__PURE__ */ import_react78.default.createElement("label", { className: "Layer__details-list-item__label" }, label), /* @__PURE__ */ import_react78.default.createElement("span", { className: "Layer__details-list-item__value" }, isLoading ? /* @__PURE__ */ import_react78.default.createElement(SkeletonLoader, null) : renderValue(children)));
 };
 
 // src/components/LedgerAccountEntryDetails/LedgerAccountEntryDetails.tsx
@@ -7659,39 +8299,39 @@ var SourceDetailView = ({ source }) => {
   switch (source.type) {
     case "Transaction_Ledger_Entry_Source": {
       const transactionSource = source;
-      return /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Account name" }, transactionSource.account_name), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Date" }, /* @__PURE__ */ import_react78.default.createElement(DateTime, { value: transactionSource.date })), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(transactionSource.amount)}`), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Direction" }, transactionSource.direction), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Counterparty" }, transactionSource.counterparty));
+      return /* @__PURE__ */ import_react79.default.createElement(import_react79.default.Fragment, null, /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Account name" }, transactionSource.account_name), /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Date" }, /* @__PURE__ */ import_react79.default.createElement(DateTime, { value: transactionSource.date })), /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(transactionSource.amount)}`), /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Direction" }, transactionSource.direction), /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Counterparty" }, transactionSource.counterparty));
     }
     case "Invoice_Ledger_Entry_Source": {
       const invoiceSource = source;
-      return /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Invoice number" }, invoiceSource.invoice_number), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Recipient name" }, invoiceSource.recipient_name), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Date" }, /* @__PURE__ */ import_react78.default.createElement(DateTime, { value: invoiceSource.date })), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(invoiceSource.amount)}`));
+      return /* @__PURE__ */ import_react79.default.createElement(import_react79.default.Fragment, null, /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Invoice number" }, invoiceSource.invoice_number), /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Recipient name" }, invoiceSource.recipient_name), /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Date" }, /* @__PURE__ */ import_react79.default.createElement(DateTime, { value: invoiceSource.date })), /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(invoiceSource.amount)}`));
     }
     case "Manual_Ledger_Entry_Source": {
       const manualSource = source;
-      return /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Memo" }, manualSource.memo), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Created by" }, manualSource.created_by));
+      return /* @__PURE__ */ import_react79.default.createElement(import_react79.default.Fragment, null, /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Memo" }, manualSource.memo), /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Created by" }, manualSource.created_by));
     }
     case "Invoice_Payment_Ledger_Entry_Source": {
       const invoicePaymentSource = source;
-      return /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Invoice number" }, invoicePaymentSource.invoice_number), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(invoicePaymentSource.amount)}`));
+      return /* @__PURE__ */ import_react79.default.createElement(import_react79.default.Fragment, null, /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Invoice number" }, invoicePaymentSource.invoice_number), /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(invoicePaymentSource.amount)}`));
     }
     case "Refund_Ledger_Entry_Source": {
       const refundSource = source;
-      return /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(refundSource.refunded_to_customer_amount)}`), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Recipient name" }, refundSource.recipient_name));
+      return /* @__PURE__ */ import_react79.default.createElement(import_react79.default.Fragment, null, /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(refundSource.refunded_to_customer_amount)}`), /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Recipient name" }, refundSource.recipient_name));
     }
     case "Opening_Balance_Ledger_Entry_Source": {
       const openingBalanceSource = source;
-      return /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Account name" }, openingBalanceSource.account_name));
+      return /* @__PURE__ */ import_react79.default.createElement(import_react79.default.Fragment, null, /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Account name" }, openingBalanceSource.account_name));
     }
     case "Payout_Ledger_Entry_Source": {
       const payoutSource = source;
-      return /* @__PURE__ */ import_react78.default.createElement(import_react78.default.Fragment, null, /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(payoutSource.paid_out_amount)}`), /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Processor" }, payoutSource.processor));
+      return /* @__PURE__ */ import_react79.default.createElement(import_react79.default.Fragment, null, /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Amount" }, `$${centsToDollars(payoutSource.paid_out_amount)}`), /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Processor" }, payoutSource.processor));
     }
     default:
       return null;
   }
 };
 var LedgerAccountEntryDetails = () => {
-  const { entryData, isLoadingEntry, closeSelectedEntry, errorEntry } = (0, import_react78.useContext)(LedgerAccountsContext);
-  const { totalDebit, totalCredit } = (0, import_react78.useMemo)(() => {
+  const { entryData, isLoadingEntry, closeSelectedEntry, errorEntry } = (0, import_react79.useContext)(LedgerAccountsContext);
+  const { totalDebit, totalCredit } = (0, import_react79.useMemo)(() => {
     let totalDebit2 = 0;
     let totalCredit2 = 0;
     entryData?.line_items?.forEach((item) => {
@@ -7703,47 +8343,47 @@ var LedgerAccountEntryDetails = () => {
     });
     return { totalDebit: totalDebit2, totalCredit: totalCredit2 };
   }, [entryData]);
-  return /* @__PURE__ */ import_react78.default.createElement("div", { className: "Layer__ledger-account__entry-details" }, /* @__PURE__ */ import_react78.default.createElement("div", { className: "Layer__ledger-account__entry-details__back-btn" }, /* @__PURE__ */ import_react78.default.createElement(BackButton, { onClick: () => closeSelectedEntry() })), /* @__PURE__ */ import_react78.default.createElement(
+  return /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger-account__entry-details" }, /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger-account__entry-details__back-btn" }, /* @__PURE__ */ import_react79.default.createElement(BackButton, { onClick: () => closeSelectedEntry() })), /* @__PURE__ */ import_react79.default.createElement(
     DetailsList,
     {
       title: "Transaction source",
-      actions: /* @__PURE__ */ import_react78.default.createElement(
+      actions: /* @__PURE__ */ import_react79.default.createElement(
         IconButton,
         {
-          icon: /* @__PURE__ */ import_react78.default.createElement(X_default, null),
+          icon: /* @__PURE__ */ import_react79.default.createElement(X_default, null),
           onClick: () => closeSelectedEntry(),
           className: "Layer__hidden-sm Layer__hidden-xs"
         }
       )
     },
-    /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Source", isLoading: isLoadingEntry }, /* @__PURE__ */ import_react78.default.createElement(Badge, null, entryData?.source?.type)),
-    entryData?.source?.display_description && /* @__PURE__ */ import_react78.default.createElement(SourceDetailView, { source: entryData?.source })
-  ), /* @__PURE__ */ import_react78.default.createElement(
+    /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Source", isLoading: isLoadingEntry }, /* @__PURE__ */ import_react79.default.createElement(Badge, null, entryData?.source?.entity_name)),
+    entryData?.source?.display_description && /* @__PURE__ */ import_react79.default.createElement(SourceDetailView, { source: entryData?.source })
+  ), /* @__PURE__ */ import_react79.default.createElement(
     DetailsList,
     {
       title: `Journal Entry ${entryData?.id.substring(0, 5)}`,
       className: "Layer__border-top"
     },
-    /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Entry type", isLoading: isLoadingEntry }, humanizeEnum(entryData?.entry_type ?? "")),
-    /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Date", isLoading: isLoadingEntry }, entryData?.entry_at && /* @__PURE__ */ import_react78.default.createElement(DateTime, { value: entryData?.entry_at })),
-    /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Creation date", isLoading: isLoadingEntry }, entryData?.date && /* @__PURE__ */ import_react78.default.createElement(DateTime, { value: entryData?.date })),
-    entryData?.reversal_id && /* @__PURE__ */ import_react78.default.createElement(DetailsListItem, { label: "Reversal", isLoading: isLoadingEntry }, entryData?.reversal_id.substring(0, 5))
-  ), !isLoadingEntry && !errorEntry ? /* @__PURE__ */ import_react78.default.createElement("div", { className: "Layer__ledger-account__entry-details__line-items" }, /* @__PURE__ */ import_react78.default.createElement(Card, null, /* @__PURE__ */ import_react78.default.createElement("table", { className: "Layer__table Layer__ledger-account__entry-details__table" }, /* @__PURE__ */ import_react78.default.createElement("thead", null, /* @__PURE__ */ import_react78.default.createElement("tr", null, /* @__PURE__ */ import_react78.default.createElement("th", { className: "Layer__table-header" }, "Line items"), /* @__PURE__ */ import_react78.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Debit"), /* @__PURE__ */ import_react78.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Credit"))), /* @__PURE__ */ import_react78.default.createElement("tbody", null, entryData?.line_items?.map((item) => /* @__PURE__ */ import_react78.default.createElement("tr", { key: `ledger-line-item-${item.id}` }, /* @__PURE__ */ import_react78.default.createElement("td", { className: "Layer__table-cell" }, item.account?.name || ""), /* @__PURE__ */ import_react78.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, item.direction === "DEBIT" /* DEBIT */ && /* @__PURE__ */ import_react78.default.createElement(Badge, { variant: "warning" /* WARNING */ }, "$", centsToDollars(item.amount || 0))), /* @__PURE__ */ import_react78.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, item.direction === "CREDIT" /* CREDIT */ && /* @__PURE__ */ import_react78.default.createElement(Badge, { variant: "success" /* SUCCESS */ }, "$", centsToDollars(item.amount || 0))))), /* @__PURE__ */ import_react78.default.createElement("tr", { className: "Layer__table Layer__ledger-account__entry-details__table__total-row" }, /* @__PURE__ */ import_react78.default.createElement("td", { className: "Layer__table-cell" }, "Total"), /* @__PURE__ */ import_react78.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, "$", centsToDollars(totalDebit || 0)), /* @__PURE__ */ import_react78.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, "$", centsToDollars(totalCredit || 0))))))) : null);
+    /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Entry type", isLoading: isLoadingEntry }, humanizeEnum(entryData?.entry_type ?? "")),
+    /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Date", isLoading: isLoadingEntry }, entryData?.entry_at && /* @__PURE__ */ import_react79.default.createElement(DateTime, { value: entryData?.entry_at })),
+    /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Creation date", isLoading: isLoadingEntry }, entryData?.date && /* @__PURE__ */ import_react79.default.createElement(DateTime, { value: entryData?.date })),
+    entryData?.reversal_id && /* @__PURE__ */ import_react79.default.createElement(DetailsListItem, { label: "Reversal", isLoading: isLoadingEntry }, entryData?.reversal_id.substring(0, 5))
+  ), !isLoadingEntry && !errorEntry ? /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger-account__entry-details__line-items" }, /* @__PURE__ */ import_react79.default.createElement(Card, null, /* @__PURE__ */ import_react79.default.createElement("table", { className: "Layer__table Layer__ledger-account__entry-details__table" }, /* @__PURE__ */ import_react79.default.createElement("thead", null, /* @__PURE__ */ import_react79.default.createElement("tr", null, /* @__PURE__ */ import_react79.default.createElement("th", { className: "Layer__table-header" }, "Line items"), /* @__PURE__ */ import_react79.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Debit"), /* @__PURE__ */ import_react79.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Credit"))), /* @__PURE__ */ import_react79.default.createElement("tbody", null, entryData?.line_items?.map((item) => /* @__PURE__ */ import_react79.default.createElement("tr", { key: `ledger-line-item-${item.id}` }, /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell" }, item.account?.name || ""), /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, item.direction === "DEBIT" /* DEBIT */ && /* @__PURE__ */ import_react79.default.createElement(Badge, { variant: "warning" /* WARNING */ }, "$", centsToDollars(item.amount || 0))), /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, item.direction === "CREDIT" /* CREDIT */ && /* @__PURE__ */ import_react79.default.createElement(Badge, { variant: "success" /* SUCCESS */ }, "$", centsToDollars(item.amount || 0))))), /* @__PURE__ */ import_react79.default.createElement("tr", { className: "Layer__table Layer__ledger-account__entry-details__table__total-row" }, /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell" }, "Total"), /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, "$", centsToDollars(totalDebit || 0)), /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--amount" }, "$", centsToDollars(totalCredit || 0))))))) : null);
 };
 
 // src/components/LedgerAccount/LedgerAccountRow.tsx
-var import_react79 = __toESM(require("react"));
-var import_classnames34 = __toESM(require("classnames"));
-var import_date_fns16 = require("date-fns");
+var import_react80 = __toESM(require("react"));
+var import_classnames36 = __toESM(require("classnames"));
+var import_date_fns18 = require("date-fns");
 var LedgerAccountRow = ({
   row,
   index,
   initialLoad,
   view
 }) => {
-  const { selectedEntryId, setSelectedEntryId, closeSelectedEntry } = (0, import_react79.useContext)(LedgerAccountsContext);
-  const [showComponent, setShowComponent] = (0, import_react79.useState)(false);
-  (0, import_react79.useEffect)(() => {
+  const { selectedEntryId, setSelectedEntryId, closeSelectedEntry } = (0, import_react80.useContext)(LedgerAccountsContext);
+  const [showComponent, setShowComponent] = (0, import_react80.useState)(false);
+  (0, import_react80.useEffect)(() => {
     if (initialLoad) {
       const timeoutId = setTimeout(() => {
         setShowComponent(true);
@@ -7754,10 +8394,10 @@ var LedgerAccountRow = ({
     }
   }, []);
   if (view === "tablet") {
-    return /* @__PURE__ */ import_react79.default.createElement(
+    return /* @__PURE__ */ import_react80.default.createElement(
       "tr",
       {
-        className: (0, import_classnames34.default)(
+        className: (0, import_classnames36.default)(
           "Layer__table-row",
           row.entry_id === selectedEntryId && "Layer__table-row--active",
           initialLoad && "initial-load",
@@ -7773,24 +8413,24 @@ var LedgerAccountRow = ({
           }
         }
       },
-      /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__ledger-account-table__tablet-main-col" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger-account-table__tablet-main-col__date" }, /* @__PURE__ */ import_react79.default.createElement(Text, null, row.date && (0, import_date_fns16.format)((0, import_date_fns16.parseISO)(row.date), DATE_FORMAT)), /* @__PURE__ */ import_react79.default.createElement(
+      /* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell Layer__ledger-account-table__tablet-main-col" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__ledger-account-table__tablet-main-col__date" }, /* @__PURE__ */ import_react80.default.createElement(Text, null, row.date && (0, import_date_fns18.format)((0, import_date_fns18.parseISO)(row.date), DATE_FORMAT)), /* @__PURE__ */ import_react80.default.createElement(
         Text,
         {
           weight: "normal" /* normal */,
           className: "Layer__ledger_account-table__journal-id"
         },
         row.entry_id.substring(0, 5)
-      )), /* @__PURE__ */ import_react79.default.createElement(Text, null, row.source?.display_description ?? ""))),
-      /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "DEBIT" /* DEBIT */ && `$${centsToDollars(row?.amount || 0)}`)),
-      /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "CREDIT" /* CREDIT */ && `$${centsToDollars(row?.amount || 0)}`)),
-      /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, `$${centsToDollars(row.running_balance)}`))
+      )), /* @__PURE__ */ import_react80.default.createElement(Text, null, row.source?.display_description ?? ""))),
+      /* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "DEBIT" /* DEBIT */ && `$${centsToDollars(row?.amount || 0)}`)),
+      /* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "CREDIT" /* CREDIT */ && `$${centsToDollars(row?.amount || 0)}`)),
+      /* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, `$${centsToDollars(row.running_balance)}`))
     );
   }
   if (view === "mobile") {
-    return /* @__PURE__ */ import_react79.default.createElement(
+    return /* @__PURE__ */ import_react80.default.createElement(
       "tr",
       {
-        className: (0, import_classnames34.default)(
+        className: (0, import_classnames36.default)(
           "Layer__table-row",
           row.entry_id === selectedEntryId && "Layer__table-row--active",
           initialLoad && "initial-load",
@@ -7806,20 +8446,20 @@ var LedgerAccountRow = ({
           }
         }
       },
-      /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__ledger-account-table__tablet-main-col" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger-account-table__tablet-main-col__date" }, /* @__PURE__ */ import_react79.default.createElement(Text, null, row.date && (0, import_date_fns16.format)((0, import_date_fns16.parseISO)(row.date), DATE_FORMAT)), /* @__PURE__ */ import_react79.default.createElement(
+      /* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell Layer__ledger-account-table__tablet-main-col" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__ledger-account-table__tablet-main-col__date" }, /* @__PURE__ */ import_react80.default.createElement(Text, null, row.date && (0, import_date_fns18.format)((0, import_date_fns18.parseISO)(row.date), DATE_FORMAT)), /* @__PURE__ */ import_react80.default.createElement(
         Text,
         {
           weight: "normal" /* normal */,
           className: "Layer__ledger_account-table__journal-id"
         },
         row.entry_id.substring(0, 5)
-      )), /* @__PURE__ */ import_react79.default.createElement(Text, null, row.source?.display_description ?? ""), /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger_account-table__balances-mobile" }, /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger_account-table__balance-item" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__label" }, "Debit"), /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__value" }, " ", row.direction === "DEBIT" /* DEBIT */ && `$${centsToDollars(row?.amount || 0)}`)), /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger_account-table__balance-item" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__label" }, "Credit"), /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__value" }, row.direction === "CREDIT" /* CREDIT */ && `$${centsToDollars(row?.amount || 0)}`)), /* @__PURE__ */ import_react79.default.createElement("div", { className: "Layer__ledger_account-table__balance-item" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__label" }, "Running balance"), /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__value" }, `$${centsToDollars(row.running_balance)}`)))))
+      )), /* @__PURE__ */ import_react80.default.createElement(Text, null, row.source?.display_description ?? ""), /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__ledger_account-table__balances-mobile" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__ledger_account-table__balance-item" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__label" }, "Debit"), /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__value" }, " ", row.direction === "DEBIT" /* DEBIT */ && `$${centsToDollars(row?.amount || 0)}`)), /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__ledger_account-table__balance-item" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__label" }, "Credit"), /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__value" }, row.direction === "CREDIT" /* CREDIT */ && `$${centsToDollars(row?.amount || 0)}`)), /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__ledger_account-table__balance-item" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__label" }, "Running balance"), /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__ledger_account-table__balances-mobile__value" }, `$${centsToDollars(row.running_balance)}`)))))
     );
   }
-  return /* @__PURE__ */ import_react79.default.createElement(
+  return /* @__PURE__ */ import_react80.default.createElement(
     "tr",
     {
-      className: (0, import_classnames34.default)(
+      className: (0, import_classnames36.default)(
         "Layer__table-row",
         row.entry_id === selectedEntryId && "Layer__table-row--active",
         initialLoad && "initial-load",
@@ -7835,25 +8475,25 @@ var LedgerAccountRow = ({
         }
       }
     },
-    /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content" }, row.date && (0, import_date_fns16.format)((0, import_date_fns16.parseISO)(row.date), DATE_FORMAT))),
-    /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content" }, row.entry_id.substring(0, 5))),
-    /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content" }, row.source?.display_description ?? "")),
-    /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "DEBIT" /* DEBIT */ && `$${centsToDollars(row?.amount || 0)}`)),
-    /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "CREDIT" /* CREDIT */ && `$${centsToDollars(row?.amount || 0)}`)),
-    /* @__PURE__ */ import_react79.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react79.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, `$${centsToDollars(row.running_balance)}`))
+    /* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__table-cell-content" }, row.date && (0, import_date_fns18.format)((0, import_date_fns18.parseISO)(row.date), DATE_FORMAT))),
+    /* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__table-cell-content" }, row.entry_id.substring(0, 5))),
+    /* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__table-cell-content" }, row.source?.display_description ?? "")),
+    /* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "DEBIT" /* DEBIT */ && `$${centsToDollars(row?.amount || 0)}`)),
+    /* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "CREDIT" /* CREDIT */ && `$${centsToDollars(row?.amount || 0)}`)),
+    /* @__PURE__ */ import_react80.default.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, `$${centsToDollars(row.running_balance)}`))
   );
 };
 
 // src/components/LedgerAccount/LedgerAccountIndex.tsx
-var import_classnames35 = __toESM(require("classnames"));
+var import_classnames37 = __toESM(require("classnames"));
 var LedgerAccount = ({
   containerRef,
   pageSize = 15,
   view
 }) => {
-  const [currentPage, setCurrentPage] = (0, import_react80.useState)(1);
-  const [initialLoad, setInitialLoad] = (0, import_react80.useState)(true);
-  const { data: accountData } = (0, import_react80.useContext)(ChartOfAccountsContext);
+  const [currentPage, setCurrentPage] = (0, import_react81.useState)(1);
+  const [initialLoad, setInitialLoad] = (0, import_react81.useState)(true);
+  const { data: accountData } = (0, import_react81.useContext)(ChartOfAccountsContext);
   const {
     data: rawData,
     error,
@@ -7864,8 +8504,8 @@ var LedgerAccount = ({
     selectedEntryId,
     closeSelectedEntry,
     refetch
-  } = (0, import_react80.useContext)(LedgerAccountsContext);
-  (0, import_react80.useEffect)(() => {
+  } = (0, import_react81.useContext)(LedgerAccountsContext);
+  (0, import_react81.useEffect)(() => {
     if (!isLoading) {
       const timeoutLoad = setTimeout(() => {
         setInitialLoad(false);
@@ -7873,16 +8513,16 @@ var LedgerAccount = ({
       return () => clearTimeout(timeoutLoad);
     }
   }, [isLoading]);
-  const baseClassName = (0, import_classnames35.default)(
+  const baseClassName = (0, import_classnames37.default)(
     "Layer__ledger-account__index",
     accountId && "open"
   );
-  const entry = (0, import_react80.useMemo)(() => {
+  const entry = (0, import_react81.useMemo)(() => {
     return flattenAccounts(accountData?.accounts || []).find(
       (x) => x.id === accountId
     );
   }, [accountId]);
-  const data = (0, import_react80.useMemo)(() => {
+  const data = (0, import_react81.useMemo)(() => {
     const firstPageIndex = (currentPage - 1) * pageSize;
     const lastPageIndex = firstPageIndex + pageSize;
     return rawData?.sort((a, b) => Date.parse(b.date) - Date.parse(a.date))?.slice(firstPageIndex, lastPageIndex);
@@ -7891,36 +8531,36 @@ var LedgerAccount = ({
     setAccountId(void 0);
     closeSelectedEntry();
   };
-  return /* @__PURE__ */ import_react80.default.createElement(
+  return /* @__PURE__ */ import_react81.default.createElement(
     Panel,
     {
-      sidebar: /* @__PURE__ */ import_react80.default.createElement(LedgerAccountEntryDetails, null),
+      sidebar: /* @__PURE__ */ import_react81.default.createElement(LedgerAccountEntryDetails, null),
       sidebarIsOpen: Boolean(selectedEntryId),
       parentRef: containerRef,
       className: "Layer__ledger-account__panel"
     },
-    /* @__PURE__ */ import_react80.default.createElement("div", { className: baseClassName }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__ledger-account__header" }, /* @__PURE__ */ import_react80.default.createElement(BackButton, { onClick: close }), /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__ledger-account__title-container" }, /* @__PURE__ */ import_react80.default.createElement(
+    /* @__PURE__ */ import_react81.default.createElement("div", { className: baseClassName }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "Layer__ledger-account__header" }, /* @__PURE__ */ import_react81.default.createElement(BackButton, { onClick: close }), /* @__PURE__ */ import_react81.default.createElement("div", { className: "Layer__ledger-account__title-container" }, /* @__PURE__ */ import_react81.default.createElement(
       Text,
       {
         weight: "bold" /* bold */,
         className: "Layer__ledger-account__title"
       },
       entry?.name ?? ""
-    ), /* @__PURE__ */ import_react80.default.createElement(
+    ), /* @__PURE__ */ import_react81.default.createElement(
       Button,
       {
         variant: "secondary" /* secondary */,
-        rightIcon: /* @__PURE__ */ import_react80.default.createElement(DownloadCloud_default, { size: 12 })
+        rightIcon: /* @__PURE__ */ import_react81.default.createElement(DownloadCloud_default, { size: 12 })
       },
       "Download"
-    )), /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__ledger-account__balance-container" }, /* @__PURE__ */ import_react80.default.createElement(
+    )), /* @__PURE__ */ import_react81.default.createElement("div", { className: "Layer__ledger-account__balance-container" }, /* @__PURE__ */ import_react81.default.createElement(
       Text,
       {
         weight: "bold" /* bold */,
         className: "Layer__ledger-account__balance-label"
       },
       "Current balance"
-    ), /* @__PURE__ */ import_react80.default.createElement(
+    ), /* @__PURE__ */ import_react81.default.createElement(
       Text,
       {
         weight: "bold" /* bold */,
@@ -7928,7 +8568,7 @@ var LedgerAccount = ({
       },
       "$",
       centsToDollars(entry?.balance || 0)
-    ))), /* @__PURE__ */ import_react80.default.createElement("table", { className: "Layer__table Layer__table--hover-effect Layer__ledger-account-table" }, /* @__PURE__ */ import_react80.default.createElement("thead", null, /* @__PURE__ */ import_react80.default.createElement("tr", null, view !== "desktop" && /* @__PURE__ */ import_react80.default.createElement("th", null), view === "desktop" && /* @__PURE__ */ import_react80.default.createElement(import_react80.default.Fragment, null, /* @__PURE__ */ import_react80.default.createElement("th", { className: "Layer__table-header" }, "Date"), /* @__PURE__ */ import_react80.default.createElement("th", { className: "Layer__table-header" }, "Journal id #"), /* @__PURE__ */ import_react80.default.createElement("th", { className: "Layer__table-header" }, "Source")), view !== "mobile" && /* @__PURE__ */ import_react80.default.createElement(import_react80.default.Fragment, null, /* @__PURE__ */ import_react80.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Debit"), /* @__PURE__ */ import_react80.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Credit"), /* @__PURE__ */ import_react80.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Running balance")))), /* @__PURE__ */ import_react80.default.createElement("tbody", null, data?.map((x, index) => /* @__PURE__ */ import_react80.default.createElement(
+    ))), /* @__PURE__ */ import_react81.default.createElement("table", { className: "Layer__table Layer__table--hover-effect Layer__ledger-account-table" }, /* @__PURE__ */ import_react81.default.createElement("thead", null, /* @__PURE__ */ import_react81.default.createElement("tr", null, view !== "desktop" && /* @__PURE__ */ import_react81.default.createElement("th", null), view === "desktop" && /* @__PURE__ */ import_react81.default.createElement(import_react81.default.Fragment, null, /* @__PURE__ */ import_react81.default.createElement("th", { className: "Layer__table-header" }, "Date"), /* @__PURE__ */ import_react81.default.createElement("th", { className: "Layer__table-header" }, "Journal id #"), /* @__PURE__ */ import_react81.default.createElement("th", { className: "Layer__table-header" }, "Source")), view !== "mobile" && /* @__PURE__ */ import_react81.default.createElement(import_react81.default.Fragment, null, /* @__PURE__ */ import_react81.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Debit"), /* @__PURE__ */ import_react81.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Credit"), /* @__PURE__ */ import_react81.default.createElement("th", { className: "Layer__table-header Layer__table-cell--amount" }, "Running balance")))), /* @__PURE__ */ import_react81.default.createElement("tbody", null, data?.map((x, index) => /* @__PURE__ */ import_react81.default.createElement(
       LedgerAccountRow,
       {
         key: x.id,
@@ -7937,7 +8577,7 @@ var LedgerAccount = ({
         initialLoad,
         view
       }
-    )))), data && /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__ledger-account__pagination" }, /* @__PURE__ */ import_react80.default.createElement(
+    )))), data && /* @__PURE__ */ import_react81.default.createElement("div", { className: "Layer__ledger-account__pagination" }, /* @__PURE__ */ import_react81.default.createElement(
       Pagination,
       {
         currentPage,
@@ -7945,7 +8585,7 @@ var LedgerAccount = ({
         pageSize,
         onPageChange: (page) => setCurrentPage(page)
       }
-    )), error ? /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react80.default.createElement(
+    )), error ? /* @__PURE__ */ import_react81.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react81.default.createElement(
       DataState,
       {
         status: "failed" /* failed */,
@@ -7954,7 +8594,7 @@ var LedgerAccount = ({
         onRefresh: () => refetch(),
         isLoading: isValidating || isLoading
       }
-    )) : null, (!data || isLoading) && !error ? /* @__PURE__ */ import_react80.default.createElement("div", { className: `Layer__ledger-account__loader-container` }, /* @__PURE__ */ import_react80.default.createElement(Loader2, null)) : null, !isLoading && !error && data?.length === 0 ? /* @__PURE__ */ import_react80.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react80.default.createElement(
+    )) : null, (!data || isLoading) && !error ? /* @__PURE__ */ import_react81.default.createElement("div", { className: `Layer__ledger-account__loader-container` }, /* @__PURE__ */ import_react81.default.createElement(Loader2, null)) : null, !isLoading && !error && data?.length === 0 ? /* @__PURE__ */ import_react81.default.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ import_react81.default.createElement(
       DataState,
       {
         status: "info" /* info */,
@@ -7967,7 +8607,7 @@ var LedgerAccount = ({
 };
 
 // src/components/ChartOfAccounts/ChartOfAccounts.tsx
-var ChartOfAccountsContext = (0, import_react81.createContext)(
+var ChartOfAccountsContext = (0, import_react82.createContext)(
   {
     data: void 0,
     isLoading: false,
@@ -7992,7 +8632,7 @@ var ChartOfAccountsContext = (0, import_react81.createContext)(
     }
   }
 );
-var LedgerAccountsContext = (0, import_react81.createContext)({
+var LedgerAccountsContext = (0, import_react82.createContext)({
   data: void 0,
   entryData: void 0,
   isLoading: false,
@@ -8015,11 +8655,11 @@ var LedgerAccountsContext = (0, import_react81.createContext)({
 var ChartOfAccounts = (props) => {
   const chartOfAccountsContextData = useChartOfAccounts();
   const ledgerAccountsContextData = useLedgerAccounts();
-  return /* @__PURE__ */ import_react81.default.createElement(ChartOfAccountsContext.Provider, { value: chartOfAccountsContextData }, /* @__PURE__ */ import_react81.default.createElement(LedgerAccountsContext.Provider, { value: ledgerAccountsContextData }, /* @__PURE__ */ import_react81.default.createElement(ChartOfAccountsContent, null)));
+  return /* @__PURE__ */ import_react82.default.createElement(ChartOfAccountsContext.Provider, { value: chartOfAccountsContextData }, /* @__PURE__ */ import_react82.default.createElement(LedgerAccountsContext.Provider, { value: ledgerAccountsContextData }, /* @__PURE__ */ import_react82.default.createElement(ChartOfAccountsContent, null)));
 };
 var ChartOfAccountsContent = ({ asWidget }) => {
-  const { accountId } = (0, import_react81.useContext)(LedgerAccountsContext);
-  const [view, setView] = (0, import_react81.useState)("desktop");
+  const { accountId } = (0, import_react82.useContext)(LedgerAccountsContext);
+  const [view, setView] = (0, import_react82.useState)("desktop");
   const containerRef = useElementSize((_a, _b, { width }) => {
     if (width) {
       if (width >= BREAKPOINTS.TABLET && view !== "desktop") {
@@ -8031,12 +8671,12 @@ var ChartOfAccountsContent = ({ asWidget }) => {
       }
     }
   });
-  return /* @__PURE__ */ import_react81.default.createElement(Container, { name: "chart-of-accounts", ref: containerRef, asWidget }, accountId ? /* @__PURE__ */ import_react81.default.createElement(LedgerAccount, { view, containerRef }) : /* @__PURE__ */ import_react81.default.createElement(ChartOfAccountsTable, { view, containerRef }));
+  return /* @__PURE__ */ import_react82.default.createElement(Container, { name: "chart-of-accounts", ref: containerRef, asWidget }, accountId ? /* @__PURE__ */ import_react82.default.createElement(LedgerAccount, { view, containerRef }) : /* @__PURE__ */ import_react82.default.createElement(ChartOfAccountsTable, { view, containerRef }));
 };
 
 // src/providers/LayerProvider/LayerProvider.tsx
-var import_react82 = __toESM(require("react"));
-var import_date_fns17 = require("date-fns");
+var import_react83 = __toESM(require("react"));
+var import_date_fns19 = require("date-fns");
 var import_swr8 = __toESM(require("swr"));
 var reducer = (state, action) => {
   switch (action.type) {
@@ -8077,7 +8717,7 @@ var LayerProvider = ({
   };
   const colors = buildColorsPalette(theme);
   const { url, scope, apiUrl } = LayerEnvironment[environment];
-  const [state, dispatch] = (0, import_react82.useReducer)(reducer, {
+  const [state, dispatch] = (0, import_react83.useReducer)(reducer, {
     auth: {
       access_token: "",
       token_type: "",
@@ -8091,7 +8731,7 @@ var LayerProvider = ({
     colors
   });
   const { data: auth } = appId !== void 0 && appSecret !== void 0 ? (0, import_swr8.default)(
-    businessAccessToken === void 0 && appId !== void 0 && appSecret !== void 0 && (0, import_date_fns17.isBefore)(state.auth.expires_at, /* @__PURE__ */ new Date()) && "authenticate",
+    businessAccessToken === void 0 && appId !== void 0 && appSecret !== void 0 && (0, import_date_fns19.isBefore)(state.auth.expires_at, /* @__PURE__ */ new Date()) && "authenticate",
     Layer.authenticate({
       appId,
       appSecret,
@@ -8100,7 +8740,7 @@ var LayerProvider = ({
     }),
     defaultSWRConfig
   ) : { data: void 0 };
-  (0, import_react82.useEffect)(() => {
+  (0, import_react83.useEffect)(() => {
     if (businessAccessToken) {
       dispatch({
         type: "LayerContext.setAuth" /* setAuth */,
@@ -8109,7 +8749,7 @@ var LayerProvider = ({
             access_token: businessAccessToken,
             token_type: "Bearer",
             expires_in: 3600,
-            expires_at: (0, import_date_fns17.add)(/* @__PURE__ */ new Date(), { seconds: 3600 })
+            expires_at: (0, import_date_fns19.add)(/* @__PURE__ */ new Date(), { seconds: 3600 })
           }
         }
       });
@@ -8119,7 +8759,7 @@ var LayerProvider = ({
         payload: {
           auth: {
             ...auth,
-            expires_at: (0, import_date_fns17.add)(/* @__PURE__ */ new Date(), { seconds: auth.expires_in })
+            expires_at: (0, import_date_fns19.add)(/* @__PURE__ */ new Date(), { seconds: auth.expires_in })
           }
         }
       });
@@ -8174,7 +8814,7 @@ var LayerProvider = ({
     }
     return;
   };
-  return /* @__PURE__ */ import_react82.default.createElement(import_swr8.SWRConfig, { value: defaultSWRConfig }, /* @__PURE__ */ import_react82.default.createElement(
+  return /* @__PURE__ */ import_react83.default.createElement(import_swr8.SWRConfig, { value: defaultSWRConfig }, /* @__PURE__ */ import_react83.default.createElement(
     LayerContext.Provider,
     {
       value: { ...state, setTheme, getColor, setLightColor, setDarkColor, setColors }
@@ -8184,53 +8824,53 @@ var LayerProvider = ({
 };
 
 // src/views/AccountingOverview/AccountingOverview.tsx
-var import_react85 = __toESM(require("react"));
+var import_react86 = __toESM(require("react"));
 
 // src/components/View/View.tsx
-var import_react84 = __toESM(require("react"));
+var import_react85 = __toESM(require("react"));
 
 // src/components/ViewHeader/ViewHeader.tsx
-var import_react83 = __toESM(require("react"));
+var import_react84 = __toESM(require("react"));
 var ViewHeader = ({ title, controls }) => {
-  return /* @__PURE__ */ import_react83.default.createElement("div", { className: "Layer__view-header" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "Layer__view-header__content" }, /* @__PURE__ */ import_react83.default.createElement(Heading, null, title), controls && /* @__PURE__ */ import_react83.default.createElement("div", { className: "Layer__view-header__controls" }, controls)));
+  return /* @__PURE__ */ import_react84.default.createElement("div", { className: "Layer__view-header" }, /* @__PURE__ */ import_react84.default.createElement("div", { className: "Layer__view-header__content" }, /* @__PURE__ */ import_react84.default.createElement(Heading, null, title), controls && /* @__PURE__ */ import_react84.default.createElement("div", { className: "Layer__view-header__controls" }, controls)));
 };
 
 // src/components/View/View.tsx
 var View6 = ({ title, children, headerControls }) => {
   const { theme } = useLayerContext();
   const styles = parseStylesFromThemeConfig(theme);
-  return /* @__PURE__ */ import_react84.default.createElement("div", { className: "Layer__view", style: { ...styles } }, /* @__PURE__ */ import_react84.default.createElement(ViewHeader, { title, controls: headerControls }), /* @__PURE__ */ import_react84.default.createElement("div", { className: "Layer__view-main" }, children));
+  return /* @__PURE__ */ import_react85.default.createElement("div", { className: "Layer__view", style: { ...styles } }, /* @__PURE__ */ import_react85.default.createElement(ViewHeader, { title, controls: headerControls }), /* @__PURE__ */ import_react85.default.createElement("div", { className: "Layer__view-main" }, children));
 };
 
 // src/views/AccountingOverview/AccountingOverview.tsx
 var AccountingOverview = ({
   title = "Accounting overview"
 }) => {
-  return /* @__PURE__ */ import_react85.default.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ import_react85.default.createElement(View6, { title, headerControls: /* @__PURE__ */ import_react85.default.createElement(ProfitAndLoss.DatePicker, null) }, /* @__PURE__ */ import_react85.default.createElement(ProfitAndLoss.Summaries, { actionable: false }), /* @__PURE__ */ import_react85.default.createElement(
+  return /* @__PURE__ */ import_react86.default.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ import_react86.default.createElement(View6, { title, headerControls: /* @__PURE__ */ import_react86.default.createElement(ProfitAndLoss.DatePicker, null) }, /* @__PURE__ */ import_react86.default.createElement(ProfitAndLoss.Summaries, { actionable: false }), /* @__PURE__ */ import_react86.default.createElement(
     Container,
     {
       name: "accounting-overview-profit-and-loss",
       asWidget: true,
       elevated: true
     },
-    /* @__PURE__ */ import_react85.default.createElement(Header, null, /* @__PURE__ */ import_react85.default.createElement(Heading, { size: "secondary" /* secondary */ }, "Profit & Loss")),
-    /* @__PURE__ */ import_react85.default.createElement(ProfitAndLoss.Chart, null)
-  ), /* @__PURE__ */ import_react85.default.createElement("div", { className: "accounting-overview-profit-and-loss-charts" }, /* @__PURE__ */ import_react85.default.createElement(Container, { name: "accounting-overview-profit-and-loss-chart" }, /* @__PURE__ */ import_react85.default.createElement(ProfitAndLoss.DetailedCharts, { scope: "revenue", hideClose: true })), /* @__PURE__ */ import_react85.default.createElement(Container, { name: "accounting-overview-profit-and-loss-chart" }, /* @__PURE__ */ import_react85.default.createElement(ProfitAndLoss.DetailedCharts, { scope: "expenses", hideClose: true })))));
+    /* @__PURE__ */ import_react86.default.createElement(Header, null, /* @__PURE__ */ import_react86.default.createElement(Heading, { size: "secondary" /* secondary */ }, "Profit & Loss")),
+    /* @__PURE__ */ import_react86.default.createElement(ProfitAndLoss.Chart, null)
+  ), /* @__PURE__ */ import_react86.default.createElement("div", { className: "accounting-overview-profit-and-loss-charts" }, /* @__PURE__ */ import_react86.default.createElement(Container, { name: "accounting-overview-profit-and-loss-chart" }, /* @__PURE__ */ import_react86.default.createElement(ProfitAndLoss.DetailedCharts, { scope: "revenue", hideClose: true })), /* @__PURE__ */ import_react86.default.createElement(Container, { name: "accounting-overview-profit-and-loss-chart" }, /* @__PURE__ */ import_react86.default.createElement(ProfitAndLoss.DetailedCharts, { scope: "expenses", hideClose: true })))));
 };
 
 // src/views/BankTransactionsWithLinkedAccounts/BankTransactionsWithLinkedAccounts.tsx
-var import_react86 = __toESM(require("react"));
+var import_react87 = __toESM(require("react"));
 var BankTransactionsWithLinkedAccounts = ({
   title = "Bank transactions"
 }) => {
-  return /* @__PURE__ */ import_react86.default.createElement(View6, { title }, /* @__PURE__ */ import_react86.default.createElement(LinkedAccounts, { elevated: true }), /* @__PURE__ */ import_react86.default.createElement(BankTransactions, { asWidget: true }));
+  return /* @__PURE__ */ import_react87.default.createElement(View6, { title }, /* @__PURE__ */ import_react87.default.createElement(LinkedAccounts, { elevated: true }), /* @__PURE__ */ import_react87.default.createElement(BankTransactions, { asWidget: true }));
 };
 
 // src/views/Reports/Reports.tsx
-var import_react87 = __toESM(require("react"));
+var import_react88 = __toESM(require("react"));
 var Reports = ({ title = "Reports" }) => {
-  const containerRef = (0, import_react87.useRef)(null);
-  return /* @__PURE__ */ import_react87.default.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ import_react87.default.createElement(View6, { title, headerControls: /* @__PURE__ */ import_react87.default.createElement(ProfitAndLoss.DatePicker, null) }, /* @__PURE__ */ import_react87.default.createElement(
+  const containerRef = (0, import_react88.useRef)(null);
+  return /* @__PURE__ */ import_react88.default.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ import_react88.default.createElement(View6, { title, headerControls: /* @__PURE__ */ import_react88.default.createElement(ProfitAndLoss.DatePicker, null) }, /* @__PURE__ */ import_react88.default.createElement(
     Toggle,
     {
       name: "reports-tabs",
@@ -8248,18 +8888,18 @@ var Reports = ({ title = "Reports" }) => {
       selected: "profitAndLoss",
       onChange: () => null
     }
-  ), /* @__PURE__ */ import_react87.default.createElement(Container, { name: "reports", ref: containerRef }, /* @__PURE__ */ import_react87.default.createElement(ReportsPanel, { containerRef }))));
+  ), /* @__PURE__ */ import_react88.default.createElement(Container, { name: "reports", ref: containerRef }, /* @__PURE__ */ import_react88.default.createElement(ReportsPanel, { containerRef }))));
 };
 var ReportsPanel = ({ containerRef }) => {
-  const { sidebarScope } = (0, import_react87.useContext)(ProfitAndLoss.Context);
-  return /* @__PURE__ */ import_react87.default.createElement(
+  const { sidebarScope } = (0, import_react88.useContext)(ProfitAndLoss.Context);
+  return /* @__PURE__ */ import_react88.default.createElement(
     Panel,
     {
-      sidebar: /* @__PURE__ */ import_react87.default.createElement(ProfitAndLoss.DetailedCharts, null),
+      sidebar: /* @__PURE__ */ import_react88.default.createElement(ProfitAndLoss.DetailedCharts, null),
       sidebarIsOpen: Boolean(sidebarScope),
       parentRef: containerRef
     },
-    /* @__PURE__ */ import_react87.default.createElement(ProfitAndLoss.Table, { asContainer: false })
+    /* @__PURE__ */ import_react88.default.createElement(ProfitAndLoss.Table, { asContainer: false })
   );
 };
 // Annotate the CommonJS export names for ESM import in node: