@layerfi/components 0.1.13 → 0.1.14

package/dist/index.js

@@ -4332,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();
   };
@@ -4974,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");
@@ -5032,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
 } = {
@@ -5045,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,
@@ -5069,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 };
@@ -5152,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,
@@ -5189,7 +5217,7 @@ var useProfitAndLoss = ({
     filteredTotalExpenses,
     isLoading,
     isValidating,
-    error: error || rawError,
+    error,
     dateRange: { startDate, endDate },
     refetch,
     changeDateRange,
@@ -5202,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);
@@ -5243,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,
@@ -5455,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",
@@ -5475,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,
@@ -5527,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" });
@@ -5550,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({
@@ -5574,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"));
@@ -5670,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 = [
@@ -5769,7 +6121,7 @@ var DetailedChart = ({
   date,
   isLoading
 }) => {
-  const chartData = (0, import_react55.useMemo)(() => {
+  const chartData = (0, import_react56.useMemo)(() => {
     if (!filteredData) {
       return [];
     }
@@ -5787,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,
@@ -5812,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}`,
@@ -5824,7 +6176,7 @@ var DetailedChart = ({
         }
       );
     }),
-    /* @__PURE__ */ import_react55.default.createElement(
+    /* @__PURE__ */ import_react56.default.createElement(
       import_recharts2.Label,
       {
         position: "center",
@@ -5845,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,
@@ -5856,7 +6208,7 @@ var DetailedChart = ({
         }
       }
     ),
-    /* @__PURE__ */ import_react55.default.createElement(
+    /* @__PURE__ */ import_react56.default.createElement(
       import_recharts2.Label,
       {
         position: "center",
@@ -5879,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,
@@ -5890,7 +6242,7 @@ var DetailedChart = ({
         }
       }
     ),
-    /* @__PURE__ */ import_react55.default.createElement(
+    /* @__PURE__ */ import_react56.default.createElement(
       import_recharts2.Label,
       {
         position: "center",
@@ -5909,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,
@@ -5926,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 }],
@@ -5941,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",
@@ -5962,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,
@@ -5973,7 +6325,7 @@ var DetailedChart = ({
         }
       }
     ),
-    /* @__PURE__ */ import_react55.default.createElement(
+    /* @__PURE__ */ import_react56.default.createElement(
       import_recharts2.Label,
       {
         position: "center",
@@ -5996,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,
@@ -6007,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 }],
@@ -6026,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"));
@@ -6040,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",
@@ -6090,7 +6442,7 @@ var SortArrows = ({ size = 13, ...props }) => /* @__PURE__ */ React70.createElem
 var SortArrows_default = SortArrows;
 
 // src/components/ProfitAndLossDetailedCharts/DetailedTable.tsx
-var import_classnames27 = __toESM(require("classnames"));
+var import_classnames28 = __toESM(require("classnames"));
 var DetailedTable = ({
   filteredData,
   sidebarScope,
@@ -6100,52 +6452,52 @@ var DetailedTable = ({
   setHoveredItem
 }) => {
   const buildColClass = (column) => {
-    return (0, import_classnames27.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_classnames27.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",
@@ -6160,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,
@@ -6168,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",
@@ -6190,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,
@@ -6216,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,
@@ -6240,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,
@@ -6248,7 +6600,7 @@ var ProfitAndLossDetailedCharts = ({
       filters,
       setFilterTypes
     }
-  ), /* @__PURE__ */ import_react58.default.createElement(
+  ), /* @__PURE__ */ import_react59.default.createElement(
     DetailedTable,
     {
       filteredData: data,
@@ -6262,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_classnames28 = __toESM(require("classnames"));
+var import_react60 = __toESM(require("react"));
+var import_classnames29 = __toESM(require("classnames"));
 var SkeletonLoader = ({
   height,
   width,
   className
 }) => {
-  const baseClassName = (0, import_classnames28.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,
@@ -6302,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}`,
@@ -6316,7 +6668,7 @@ var MiniChart = ({ data }) => {
 };
 
 // src/components/ProfitAndLossSummaries/ProfitAndLossSummaries.tsx
-var import_classnames29 = __toESM(require("classnames"));
+var import_classnames30 = __toESM(require("classnames"));
 var CHART_PLACEHOLDER = [
   {
     name: "placeholder",
@@ -6353,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_classnames29.default)(
+        className: (0, import_classnames30.default)(
           "Layer__profit-and-loss-summaries__summary",
           actionable && "Layer__actionable",
           "Layer__profit-and-loss-summaries__summary--income",
@@ -6382,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}`
@@ -6391,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_classnames29.default)(
+        className: (0, import_classnames30.default)(
           "Layer__profit-and-loss-summaries__summary",
           actionable && "Layer__actionable",
           "Layer__profit-and-loss-summaries__summary--expenses",
@@ -6404,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}`
@@ -6415,15 +6768,15 @@ var ProfitAndLossSummaries = ({
         )
       ))
     ),
-    /* @__PURE__ */ import_react61.default.createElement(
+    /* @__PURE__ */ import_react62.default.createElement(
       "div",
       {
-        className: (0, import_classnames29.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}`
@@ -6435,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"));
@@ -6487,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 = [
@@ -6518,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",
@@ -6540,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,
@@ -6609,35 +6962,36 @@ var empty_profit_and_loss_report_default = {
 };
 
 // src/components/ProfitAndLossTable/ProfitAndLossTable.tsx
-var import_classnames30 = __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_classnames30.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_classnames30.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,
@@ -6647,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,
@@ -6657,7 +7011,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
         setSidebarScope
       }
     ),
-    /* @__PURE__ */ import_react63.default.createElement(
+    /* @__PURE__ */ import_react64.default.createElement(
       ProfitAndLossRow,
       {
         lineItem: {
@@ -6671,7 +7025,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
         setSidebarScope
       }
     ),
-    /* @__PURE__ */ import_react63.default.createElement(
+    /* @__PURE__ */ import_react64.default.createElement(
       ProfitAndLossRow,
       {
         lineItem: data.expenses,
@@ -6681,7 +7035,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
         setSidebarScope
       }
     ),
-    /* @__PURE__ */ import_react63.default.createElement(
+    /* @__PURE__ */ import_react64.default.createElement(
       ProfitAndLossRow,
       {
         lineItem: {
@@ -6695,7 +7049,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
         setSidebarScope
       }
     ),
-    /* @__PURE__ */ import_react63.default.createElement(
+    /* @__PURE__ */ import_react64.default.createElement(
       ProfitAndLossRow,
       {
         lineItem: data.taxes,
@@ -6705,7 +7059,7 @@ var ProfitAndLossTable = ({ lockExpanded, asContainer }) => {
         setSidebarScope
       }
     ),
-    /* @__PURE__ */ import_react63.default.createElement(
+    /* @__PURE__ */ import_react64.default.createElement(
       ProfitAndLossRow,
       {
         lineItem: {
@@ -6717,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,
@@ -6735,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,
@@ -6746,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: () => {
   },
@@ -6772,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;
@@ -6782,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_classnames31 = __toESM(require("classnames"));
+var import_react66 = __toESM(require("react"));
+var import_classnames32 = __toESM(require("classnames"));
 var Panel = ({
   children,
   className,
@@ -6795,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_classnames31.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",
@@ -6819,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)
     )
   );
 };
@@ -6827,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 */,
@@ -6865,27 +7219,27 @@ 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_react67 = require("react");
+var import_react68 = require("react");
 
 // src/components/ChartOfAccountsForm/constants.ts
 var LEDGER_ACCOUNT_TYPES = [
@@ -7169,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, {
@@ -7355,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, {
@@ -7403,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"));
@@ -7433,7 +7787,7 @@ var Edit2 = ({ size = 18, ...props }) => /* @__PURE__ */ React83.createElement(
 var Edit2_default = Edit2;
 
 // src/components/ChartOfAccountsRow/ChartOfAccountsRow.tsx
-var import_classnames32 = __toESM(require("classnames"));
+var import_classnames33 = __toESM(require("classnames"));
 var INDENTATION = 24;
 var MOBILE_INDENTATION = 12;
 var EXPANDED_STYLE = {
@@ -7464,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`
@@ -7475,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_classnames32.default)(
+  const baseClass = (0, import_classnames33.default)(
     "Layer__table-row",
     isOpen ? "Layer__table-row--expanded" : "Layer__table-row--collapsed",
     !expanded && "Layer__table-row--hidden",
@@ -7490,15 +7844,15 @@ var ChartOfAccountsRow = ({
     form?.accountId === account.id && "Layer__table-row--active",
     !showComponent && "Layer__table-row--anim-starting-state"
   );
-  const desktopRowClass = (0, import_classnames32.default)(
+  const desktopRowClass = (0, import_classnames33.default)(
     baseClass,
     "Layer__chart-of-accounts__row---desktop"
   );
-  const mobileRowClass = (0, import_classnames32.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,
@@ -7508,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",
@@ -7516,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,
@@ -7527,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 */,
@@ -7550,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",
@@ -7562,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();
@@ -7576,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,
@@ -7586,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",
@@ -7595,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,
@@ -7606,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) => {
@@ -7623,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",
@@ -7633,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,
@@ -7649,14 +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"));
+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,
@@ -7676,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
@@ -7689,7 +8043,7 @@ var ChartOfAccountsForm = () => {
   if (!form) {
     return;
   }
-  return /* @__PURE__ */ import_react71.default.createElement(
+  return /* @__PURE__ */ import_react72.default.createElement(
     "form",
     {
       className: "Layer__form",
@@ -7698,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",
@@ -7707,7 +8061,7 @@ var ChartOfAccountsForm = () => {
         disabled: sendingForm
       },
       "Cancel"
-    ), apiError && /* @__PURE__ */ import_react71.default.createElement(
+    ), apiError && /* @__PURE__ */ import_react72.default.createElement(
       RetryButton,
       {
         type: "submit",
@@ -7716,7 +8070,7 @@ var ChartOfAccountsForm = () => {
         disabled: sendingForm
       },
       "Retry"
-    ), !apiError && /* @__PURE__ */ import_react71.default.createElement(
+    ), !apiError && /* @__PURE__ */ import_react72.default.createElement(
       SubmitButton,
       {
         type: "submit",
@@ -7726,7 +8080,7 @@ var ChartOfAccountsForm = () => {
       },
       "Save"
     ))),
-    apiError && /* @__PURE__ */ import_react71.default.createElement(
+    apiError && /* @__PURE__ */ import_react72.default.createElement(
       Text,
       {
         size: "sm" /* sm */,
@@ -7734,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,
@@ -7743,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",
@@ -7754,7 +8108,7 @@ 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: LEDGER_ACCOUNT_TYPES,
@@ -7764,7 +8118,7 @@ var ChartOfAccountsForm = () => {
         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: form?.data.type?.value !== void 0 ? LEDGER_ACCOUNT_SUBTYPES_FOR_TYPE[form?.data.type?.value] : LEDGER_ACCOUNT_SUBTYPES,
@@ -7772,7 +8126,7 @@ var ChartOfAccountsForm = () => {
         onChange: (sel) => changeFormData("subType", sel),
         disabled: sendingForm
       }
-    )), /* @__PURE__ */ import_react71.default.createElement(InputGroup, { name: "normality", label: "Normality", inline: true }, /* @__PURE__ */ import_react71.default.createElement(
+    )), /* @__PURE__ */ import_react72.default.createElement(InputGroup, { name: "normality", label: "Normality", inline: true }, /* @__PURE__ */ import_react72.default.createElement(
       Select2,
       {
         options: NORMALITY_OPTIONS,
@@ -7792,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
@@ -7801,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,
@@ -7838,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 */,
@@ -7848,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 */,
@@ -7863,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_classnames33 = __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_classnames33.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,
@@ -7887,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",
@@ -7900,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",
@@ -7913,22 +8267,22 @@ var DateTime = ({
 };
 
 // src/components/DetailsList/DetailsList.tsx
-var import_react76 = __toESM(require("react"));
-var import_classnames34 = __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_classnames34.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;
 };
@@ -7937,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
@@ -7945,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) => {
@@ -7989,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?.entity_name)),
-    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_classnames35 = __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);
@@ -8040,10 +8394,10 @@ var LedgerAccountRow = ({
     }
   }, []);
   if (view === "tablet") {
-    return /* @__PURE__ */ import_react79.default.createElement(
+    return /* @__PURE__ */ import_react80.default.createElement(
       "tr",
       {
-        className: (0, import_classnames35.default)(
+        className: (0, import_classnames36.default)(
           "Layer__table-row",
           row.entry_id === selectedEntryId && "Layer__table-row--active",
           initialLoad && "initial-load",
@@ -8059,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_classnames35.default)(
+        className: (0, import_classnames36.default)(
           "Layer__table-row",
           row.entry_id === selectedEntryId && "Layer__table-row--active",
           initialLoad && "initial-load",
@@ -8092,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_classnames35.default)(
+      className: (0, import_classnames36.default)(
         "Layer__table-row",
         row.entry_id === selectedEntryId && "Layer__table-row--active",
         initialLoad && "initial-load",
@@ -8121,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_classnames36 = __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,
@@ -8150,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);
@@ -8159,16 +8513,16 @@ var LedgerAccount = ({
       return () => clearTimeout(timeoutLoad);
     }
   }, [isLoading]);
-  const baseClassName = (0, import_classnames36.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);
@@ -8177,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 */,
@@ -8214,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,
@@ -8223,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,
@@ -8231,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 */,
@@ -8240,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 */,
@@ -8253,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,
@@ -8278,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,
@@ -8301,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") {
@@ -8317,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) {
@@ -8363,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: "",
@@ -8377,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,
@@ -8386,7 +8740,7 @@ var LayerProvider = ({
     }),
     defaultSWRConfig
   ) : { data: void 0 };
-  (0, import_react82.useEffect)(() => {
+  (0, import_react83.useEffect)(() => {
     if (businessAccessToken) {
       dispatch({
         type: "LayerContext.setAuth" /* setAuth */,
@@ -8395,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 })
           }
         }
       });
@@ -8405,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 })
           }
         }
       });
@@ -8460,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 }
@@ -8470,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",
@@ -8534,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: