@layerfi/components 0.1.81 → 0.1.82

package/dist/esm/index.mjs

@@ -57,7 +57,7 @@ import React9, { useState as useState7 } from "react";
 import React8, { useReducer, useEffect as useEffect4 } from "react";
 
 // package.json
-var version = "0.1.81";
+var version = "0.1.82";
 
 // src/models/APIError.ts
 var APIError = class _APIError extends Error {
@@ -398,21 +398,29 @@ var getCashflowStatementCSV = get(
 
 // src/api/layer/tasks.ts
 var getTasks = get(
-  ({ businessId }) => `/v1/businesses/${businessId}/tasks`
+  ({ businessId, startDate, endDate }) => `/v1/businesses/${businessId}/tasks?${startDate ? `&start_date=${encodeURIComponent(startDate)}` : ""}${endDate ? `&end_date=${encodeURIComponent(endDate)}` : ""}`
 );
 var submitResponseToTask = post(
   ({ businessId, taskId }) => `/v1/businesses/${businessId}/tasks/${taskId}/user-response`
 );
+var updateUploadDocumentTaskDescription = post(
+  ({ businessId, taskId }) => `/v1/businesses/${businessId}/tasks/${taskId}/upload/update-description`
+);
 var markTaskAsComplete = post(
   ({ businessId, taskId }) => `/v1/businesses/${businessId}/tasks/${taskId}/complete`
 );
+var deleteTaskUploads = post(
+  ({ businessId, taskId }) => `/v1/businesses/${businessId}/tasks/${taskId}/upload/delete`
+);
 var completeTaskWithUpload = (baseUrl, accessToken) => ({
   businessId,
   taskId,
-  file
+  files,
+  description
 }) => {
   const formData = new FormData();
-  formData.append("file", file);
+  files.forEach((file) => formData.append("file", file));
+  description && formData.append("description", description);
   const endpoint = `/v1/businesses/${businessId}/tasks/${taskId}/upload`;
   return postWithFormData(
     endpoint,
@@ -462,6 +470,8 @@ var Layer = {
   getTasks,
   completeTaskWithUpload,
   submitResponseToTask,
+  deleteTaskUploads,
+  updateUploadDocumentTaskDescription,
   breakPlaidItemConnection,
   syncConnection,
   updateConnectionStatus,
@@ -1366,12 +1376,12 @@ function AccountConfirmationStoreProvider({
   initialVisibility = "DEFAULT"
 }) {
   const [store] = useState4(
-    () => createStore((set) => ({
+    () => createStore((set2) => ({
       visibility: initialVisibility,
       actions: {
-        dismiss: () => set((state) => __spreadProps(__spreadValues({}, state), { visibility: "DISMISSED" })),
-        preload: () => set((state) => __spreadProps(__spreadValues({}, state), { visibility: "PRELOADED" })),
-        reset: () => set((state) => __spreadProps(__spreadValues({}, state), { visibility: "DEFAULT" }))
+        dismiss: () => set2((state) => __spreadProps(__spreadValues({}, state), { visibility: "DISMISSED" })),
+        preload: () => set2((state) => __spreadProps(__spreadValues({}, state), { visibility: "PRELOADED" })),
+        reset: () => set2((state) => __spreadProps(__spreadValues({}, state), { visibility: "DEFAULT" }))
       }
     }))
   );
@@ -5433,7 +5443,7 @@ var LinkedAccountsComponent = ({
 };
 
 // src/components/BankTransactions/BankTransactions.tsx
-import React138, { useEffect as useEffect23, useMemo as useMemo14, useRef as useRef17, useState as useState32 } from "react";
+import React138, { useEffect as useEffect23, useMemo as useMemo15, useRef as useRef17, useState as useState32 } from "react";
 
 // src/hooks/useElementSize/useElementSize.ts
 import { useLayoutEffect as useLayoutEffect2, useRef as useRef6 } from "react";
@@ -6865,7 +6875,8 @@ var FileInput = ({
   disabled = false,
   secondary,
   iconOnly = false,
-  icon
+  icon,
+  allowMultipleUploads = false
 }) => {
   const hiddenFileInput = useRef7(null);
   const onClick = () => {
@@ -6875,8 +6886,8 @@ var FileInput = ({
   };
   const onChange = (event) => {
     if (event.target.files && event.target.files.length > 0 && onUpload) {
-      const fileUploaded = event.target.files[0];
-      onUpload(fileUploaded);
+      const filesUploaded = Array.from(event.target.files);
+      onUpload(filesUploaded);
     }
   };
   if (secondary) {
@@ -6884,6 +6895,7 @@ var FileInput = ({
       "input",
       {
         type: "file",
+        multiple: allowMultipleUploads,
         onChange,
         ref: hiddenFileInput,
         style: { display: "none" }
@@ -6904,6 +6916,7 @@ var FileInput = ({
     "input",
     {
       type: "file",
+      multiple: allowMultipleUploads,
       onChange,
       ref: hiddenFileInput,
       style: { display: "none" }
@@ -7063,7 +7076,7 @@ var BankTransactionReceipts = forwardRef9(
     useImperativeHandle(ref, () => ({
       uploadReceipt
     }));
-    return /* @__PURE__ */ React100.createElement("div", { className: `${classNamePrefix}__file-upload` }, receiptUrls && receiptUrls.length > 0 && label ? /* @__PURE__ */ React100.createElement(Text, { size: "sm" /* sm */, className: "Layer__file-upload__label" }, label) : null, !hideUploadButtons && (!receiptUrls || receiptUrls.length === 0) ? /* @__PURE__ */ React100.createElement(FileInput, { onUpload: uploadReceipt, text: "Upload receipt" }) : null, receiptUrls.map((url, index) => {
+    return /* @__PURE__ */ React100.createElement("div", { className: `${classNamePrefix}__file-upload` }, receiptUrls && receiptUrls.length > 0 && label ? /* @__PURE__ */ React100.createElement(Text, { size: "sm" /* sm */, className: "Layer__file-upload__label" }, label) : null, !hideUploadButtons && (!receiptUrls || receiptUrls.length === 0) ? /* @__PURE__ */ React100.createElement(FileInput, { onUpload: (files) => uploadReceipt(files[0]), text: "Upload receipt" }) : null, receiptUrls.map((url, index) => {
       var _a;
       return /* @__PURE__ */ React100.createElement(
         FileThumb,
@@ -7087,7 +7100,7 @@ var BankTransactionReceipts = forwardRef9(
       FileInput,
       {
         secondary: true,
-        onUpload: uploadReceipt,
+        onUpload: (files) => uploadReceipt(files[0]),
         text: "Add next receipt"
       }
     ) : null);
@@ -8691,7 +8704,6 @@ var BusinessForm = ({
   showReceiptUploads,
   showDescriptions
 }) => {
-  var _a;
   const receiptsRef = useRef11(null);
   const { setContent, close } = useContext16(DrawerContext);
   const { categorize: categorizeBankTransaction2, isLoading } = useBankTransactionsContext();
@@ -8706,8 +8718,8 @@ var BusinessForm = ({
     }
   }, [bankTransaction.error]);
   const options = useMemo11(() => {
-    var _a2;
-    const options2 = ((_a2 = bankTransaction == null ? void 0 : bankTransaction.categorization_flow) == null ? void 0 : _a2.type) === "ASK_FROM_SUGGESTIONS" /* ASK_FROM_SUGGESTIONS */ ? bankTransaction.categorization_flow.suggestions.map(
+    var _a;
+    const options2 = ((_a = bankTransaction == null ? void 0 : bankTransaction.categorization_flow) == null ? void 0 : _a.type) === "ASK_FROM_SUGGESTIONS" /* ASK_FROM_SUGGESTIONS */ ? bankTransaction.categorization_flow.suggestions.map(
       (x) => mapCategoryToOption(x)
     ) : [];
     if (selectedCategory && !options2.find((x) => x.id === (selectedCategory == null ? void 0 : selectedCategory.id))) {
@@ -8743,11 +8755,11 @@ var BusinessForm = ({
     );
   };
   const onCategorySelect = (category) => {
-    var _a2, _b;
+    var _a, _b;
     if (category.value.type === "SELECT_CATEGORY") {
       openDrawer();
     } else {
-      if (selectedCategory && ((_a2 = category.value.payload) == null ? void 0 : _a2.id) === ((_b = selectedCategory.value.payload) == null ? void 0 : _b.id)) {
+      if (selectedCategory && ((_a = category.value.payload) == null ? void 0 : _a.id) === ((_b = selectedCategory.value.payload) == null ? void 0 : _b.id)) {
         setSelectedCategory(void 0);
       } else {
         setSelectedCategory(category);
@@ -8755,14 +8767,14 @@ var BusinessForm = ({
     }
   };
   const save = () => {
-    var _a2, _b, _c;
+    var _a, _b, _c;
     if (showDescriptions && memoText !== void 0) {
       saveMemoText();
     }
     if (!selectedCategory || !selectedCategory.value.payload) {
       return;
     }
-    const payload = ((_b = (_a2 = selectedCategory == null ? void 0 : selectedCategory.value) == null ? void 0 : _a2.payload) == null ? void 0 : _b.id) ? {
+    const payload = ((_b = (_a = selectedCategory == null ? void 0 : selectedCategory.value) == null ? void 0 : _a.payload) == null ? void 0 : _b.id) ? {
       type: "AccountId",
       id: selectedCategory.value.payload.id
     } : {
@@ -8829,7 +8841,10 @@ var BusinessForm = ({
   ), /* @__PURE__ */ React116.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__actions" }, showReceiptUploads && /* @__PURE__ */ React116.createElement(
     FileInput,
     {
-      onUpload: (_a = receiptsRef.current) == null ? void 0 : _a.uploadReceipt,
+      onUpload: (files) => {
+        var _a;
+        return (_a = receiptsRef.current) == null ? void 0 : _a.uploadReceipt(files[0]);
+      },
       text: "Upload receipt",
       iconOnly: true,
       icon: /* @__PURE__ */ React116.createElement(Paperclip_default, null)
@@ -8880,7 +8895,6 @@ var PersonalForm = ({
   showReceiptUploads,
   showDescriptions
 }) => {
-  var _a;
   const receiptsRef = useRef12(null);
   const { categorize: categorizeBankTransaction2, isLoading } = useBankTransactionsContext();
   const [showRetry, setShowRetry] = useState24(false);
@@ -8950,7 +8964,10 @@ var PersonalForm = ({
   ), /* @__PURE__ */ React117.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__actions" }, showReceiptUploads && /* @__PURE__ */ React117.createElement(
     FileInput,
     {
-      onUpload: (_a = receiptsRef.current) == null ? void 0 : _a.uploadReceipt,
+      onUpload: (files) => {
+        var _a;
+        return (_a = receiptsRef.current) == null ? void 0 : _a.uploadReceipt(files[0]);
+      },
       text: "Upload receipt",
       iconOnly: true,
       icon: /* @__PURE__ */ React117.createElement(Paperclip_default, null)
@@ -8977,7 +8994,7 @@ var MatchForm2 = ({
   showReceiptUploads,
   showDescriptions
 }) => {
-  var _a, _b, _c;
+  var _a, _b;
   const receiptsRef = useRef13(null);
   const { match: matchBankTransaction2, isLoading } = useBankTransactionsContext();
   const { memoText, setMemoText, saveMemoText } = useMemoTextContext();
@@ -9068,7 +9085,10 @@ var MatchForm2 = ({
   ), /* @__PURE__ */ React118.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__actions" }, showReceiptUploads && /* @__PURE__ */ React118.createElement(
     FileInput,
     {
-      onUpload: (_c = receiptsRef.current) == null ? void 0 : _c.uploadReceipt,
+      onUpload: (files) => {
+        var _a2;
+        return (_a2 = receiptsRef.current) == null ? void 0 : _a2.uploadReceipt(files[0]);
+      },
       text: "Upload receipt",
       iconOnly: true,
       icon: /* @__PURE__ */ React118.createElement(Paperclip_default, null)
@@ -9094,7 +9114,7 @@ var SplitForm = ({
   showReceiptUploads,
   showDescriptions
 }) => {
-  var _a, _b, _c, _d, _e;
+  var _a, _b, _c, _d;
   const receiptsRef = useRef14(null);
   const {
     categorize: categorizeBankTransaction2,
@@ -9329,7 +9349,10 @@ var SplitForm = ({
   ), /* @__PURE__ */ React119.createElement("div", { className: "Layer__bank-transaction-mobile-list-item__actions" }, showReceiptUploads && /* @__PURE__ */ React119.createElement(
     FileInput,
     {
-      onUpload: (_e = receiptsRef.current) == null ? void 0 : _e.uploadReceipt,
+      onUpload: (files) => {
+        var _a2;
+        return (_a2 = receiptsRef.current) == null ? void 0 : _a2.uploadReceipt(files[0]);
+      },
       text: "Upload receipt",
       iconOnly: true,
       icon: /* @__PURE__ */ React119.createElement(Paperclip_default, null)
@@ -10118,7 +10141,7 @@ var isDateAllowedToBrowse = (date, business) => {
 };
 
 // src/components/DatePicker/DatePicker.tsx
-import React134, { useEffect as useEffect22, useRef as useRef16, useState as useState30 } from "react";
+import React134, { useEffect as useEffect22, useMemo as useMemo14, useRef as useRef16, useState as useState30 } from "react";
 import * as RDP from "react-datepicker";
 
 // src/components/DatePicker/DatePickerOptions.tsx
@@ -10191,6 +10214,7 @@ var DatePickerOptions = ({
 
 // src/components/DatePicker/DatePicker.tsx
 import classNames46 from "classnames";
+import { endOfDay, endOfMonth as endOfMonth3, endOfYear as endOfYear2 } from "date-fns";
 var ReactDatePicker = RDP.default.default || RDP.default || RDP;
 var getDefaultRangeDate = (date, mode, selected) => {
   try {
@@ -10206,10 +10230,14 @@ var getDefaultRangeDate = (date, mode, selected) => {
   }
 };
 var isRangeMode = (mode) => mode === "dayRangePicker" || mode === "monthRangePicker";
+var showNavigationArrows = (navigateArrows, isDesktop) => {
+  return navigateArrows && (isDesktop && navigateArrows.includes("desktop") || !isDesktop && navigateArrows.includes("mobile"));
+};
 var DatePicker = (_a) => {
   var _b = _a, {
     selected,
     onChange,
+    disabled,
     mode = "dayPicker",
     allowedModes,
     dateFormat = mode === "monthPicker" || mode === "monthRangePicker" ? "MMM, yyyy" : mode === "timePicker" ? "h:mm aa" : "MMM d, yyyy",
@@ -10223,12 +10251,13 @@ var DatePicker = (_a) => {
     minDate,
     maxDate = /* @__PURE__ */ new Date(),
     currentDateOption = true,
-    navigateArrows = mode === "monthPicker",
+    navigateArrows = mode === "monthPicker" ? ["mobile"] : void 0,
     onChangeMode,
     slots
   } = _b, props = __objRest(_b, [
     "selected",
     "onChange",
+    "disabled",
     "mode",
     "allowedModes",
     "dateFormat",
@@ -10293,7 +10322,7 @@ var DatePicker = (_a) => {
   const wrapperClassNames = classNames46(
     "Layer__datepicker__wrapper",
     mode === "timePicker" && "Layer__datepicker__time__wrapper",
-    navigateArrows && "Layer__datepicker__wrapper--arrows"
+    showNavigationArrows(navigateArrows, isDesktop) && "Layer__datepicker__wrapper--arrows"
   );
   const datePickerWrapperClassNames = classNames46(
     "Layer__datepicker",
@@ -10324,6 +10353,8 @@ var DatePicker = (_a) => {
       return selectedDates instanceof Date && selectedDates.toDateString() === currentDate.toDateString();
     } else if (mode === "monthPicker") {
       return selectedDates instanceof Date && selectedDates.getMonth() === currentDate.getMonth() && selectedDates.getFullYear() === currentDate.getFullYear();
+    } else if (mode === "yearPicker") {
+      return selectedDates instanceof Date && selectedDates.getFullYear() === currentDate.getFullYear();
     }
     return false;
   };
@@ -10335,11 +10366,32 @@ var DatePicker = (_a) => {
       setSelectedDates(
         new Date(currentDate.getFullYear(), currentDate.getMonth(), 1)
       );
+    } else if (mode === "yearPicker") {
+      setSelectedDates(
+        new Date(currentDate.getFullYear(), 0, 1)
+      );
     }
   };
-  const isTodayOrAfter = Boolean(
-    selectedDates instanceof Date && selectedDates >= /* @__PURE__ */ new Date()
-  );
+  const isTodayOrAfter = useMemo14(() => {
+    switch (mode) {
+      case "dayPicker":
+        return Boolean(
+          selectedDates instanceof Date && (endOfDay(selectedDates) >= endOfDay(/* @__PURE__ */ new Date()) || endOfDay(selectedDates) >= maxDate)
+        );
+      case "monthPicker":
+        return Boolean(
+          selectedDates instanceof Date && (endOfMonth3(selectedDates) >= endOfMonth3(/* @__PURE__ */ new Date()) || endOfMonth3(selectedDates) >= maxDate)
+        );
+      case "yearPicker":
+        return Boolean(
+          selectedDates instanceof Date && (endOfYear2(selectedDates) >= endOfYear2(/* @__PURE__ */ new Date()) || endOfYear2(selectedDates) >= maxDate)
+        );
+      default:
+        return Boolean(
+          selectedDates instanceof Date && (selectedDates >= /* @__PURE__ */ new Date() || selectedDates >= maxDate)
+        );
+    }
+  }, [selectedDates, maxDate, mode]);
   const isBeforeMinDate = Boolean(
     minDate && selectedDates instanceof Date && selectedDates <= minDate
   );
@@ -10360,6 +10412,14 @@ var DatePicker = (_a) => {
           )
         )
       );
+    } else if (mode === "yearPicker") {
+      setSelectedDates(
+        new Date(
+          selectedDates.setFullYear(
+            selectedDates.getFullYear() + value
+          )
+        )
+      );
     }
   };
   const onChangeModeInternal = (mode2) => {
@@ -10394,6 +10454,7 @@ var DatePicker = (_a) => {
       popperPlacement: "bottom-start",
       selectsRange: isRangeMode(mode),
       showMonthYearPicker: mode === "monthPicker" || mode === "monthRangePicker",
+      showYearPicker: mode === "yearPicker",
       dateFormat,
       renderDayContents: (day) => /* @__PURE__ */ React134.createElement("span", { className: "Layer__datepicker__day-contents" }, day),
       timeIntervals,
@@ -10426,7 +10487,8 @@ var DatePicker = (_a) => {
         if (pickerRef.current && !isDesktop) {
           pickerRef.current.setOpen(!pickerRef.current.isCalendarOpen());
         }
-      }
+      },
+      disabled
     }, props),
     ModeSelector && /* @__PURE__ */ React134.createElement(
       ModeSelector,
@@ -10443,7 +10505,7 @@ var DatePicker = (_a) => {
         setSelectedDate: setSelectedDates
       }
     )
-  ), navigateArrows && !isDesktop && /* @__PURE__ */ React134.createElement(React134.Fragment, null, /* @__PURE__ */ React134.createElement(
+  ), showNavigationArrows(navigateArrows, isDesktop) && /* @__PURE__ */ React134.createElement(React134.Fragment, null, /* @__PURE__ */ React134.createElement(
     Button,
     {
       "aria-label": "Previous Date",
@@ -10453,7 +10515,7 @@ var DatePicker = (_a) => {
       ),
       onClick: () => changeDate(-1),
       variant: "secondary" /* secondary */,
-      disabled: isBeforeMinDate
+      disabled: isBeforeMinDate || disabled
     },
     /* @__PURE__ */ React134.createElement(ChevronLeft_default, { className: "Layer__datepicker__button-icon", size: 16 })
   ), /* @__PURE__ */ React134.createElement(
@@ -10466,7 +10528,7 @@ var DatePicker = (_a) => {
         isTodayOrAfter ? "Layer__datepicker__button--disabled" : void 0
       ),
       onClick: () => changeDate(1),
-      disabled: isTodayOrAfter
+      disabled: isTodayOrAfter || disabled
     },
     /* @__PURE__ */ React134.createElement(
       ChevronRight_default,
@@ -10475,13 +10537,13 @@ var DatePicker = (_a) => {
         size: 16
       }
     )
-  )), currentDateOption && (mode === "dayPicker" || mode === "monthPicker") && /* @__PURE__ */ React134.createElement(
+  )), currentDateOption && (mode === "dayPicker" || mode === "monthPicker" || mode === "yearPicker") && /* @__PURE__ */ React134.createElement(
     Button,
     {
       className: "Layer__datepicker__current-button",
       onClick: setCurrentDate,
       variant: "secondary" /* secondary */,
-      disabled: isCurrentDate()
+      disabled: isCurrentDate() || disabled
     },
     mode === "dayPicker" ? "Today" : "Current"
   ));
@@ -10489,7 +10551,7 @@ var DatePicker = (_a) => {
 
 // src/components/BankTransactions/BankTransactionsHeader.tsx
 import classNames47 from "classnames";
-import { endOfMonth as endOfMonth3, startOfMonth as startOfMonth4 } from "date-fns";
+import { endOfMonth as endOfMonth4, startOfMonth as startOfMonth4 } from "date-fns";
 var DownloadButton2 = ({
   downloadButtonTextOverride,
   iconOnly
@@ -10587,7 +10649,7 @@ var BankTransactionsHeader = ({
           if (!Array.isArray(date)) {
             setDateRange({
               startDate: startOfMonth4(date),
-              endDate: endOfMonth3(date)
+              endDate: endOfMonth4(date)
             });
           }
         },
@@ -10690,7 +10752,7 @@ var DataStates = ({
 };
 
 // src/components/BankTransactions/BankTransactions.tsx
-import { endOfMonth as endOfMonth4, startOfMonth as startOfMonth5 } from "date-fns";
+import { endOfMonth as endOfMonth5, startOfMonth as startOfMonth5 } from "date-fns";
 var COMPONENT_NAME2 = "bank-transactions";
 var categorizationEnabled = (mode) => {
   if (mode === "bookkeeping-client") {
@@ -10723,7 +10785,7 @@ var BankTransactionsContent = ({
 }) => {
   const [defaultDateRange] = useState32(() => ({
     startDate: startOfMonth5(/* @__PURE__ */ new Date()),
-    endDate: endOfMonth4(/* @__PURE__ */ new Date())
+    endDate: endOfMonth5(/* @__PURE__ */ new Date())
   }));
   const scrollPaginationRef = useRef17(null);
   const isVisible = useIsVisible(scrollPaginationRef);
@@ -10746,7 +10808,7 @@ var BankTransactionsContent = ({
     removeAfterCategorize
   } = useBankTransactionsContext();
   const { data: linkedAccounts } = useLinkedAccounts();
-  const isSyncing = useMemo14(
+  const isSyncing = useMemo15(
     () => Boolean(linkedAccounts == null ? void 0 : linkedAccounts.some((item) => item.is_syncing)),
     [linkedAccounts]
   );
@@ -10797,7 +10859,7 @@ var BankTransactionsContent = ({
       return () => clearTimeout(timeoutLoad);
     }
   }, [loadingStatus]);
-  const bankTransactions = useMemo14(() => {
+  const bankTransactions = useMemo15(() => {
     if (monthlyView) {
       return data;
     }
@@ -11067,7 +11129,7 @@ var PNLComparisonContext = createContext11({
 });
 
 // src/hooks/useProfitAndLoss/useProfitAndLoss.tsx
-import { useMemo as useMemo16, useState as useState35 } from "react";
+import { useMemo as useMemo17, useState as useState35 } from "react";
 
 // src/utils/profitAndLossUtils.ts
 var doesLineItemQualifies = (item) => {
@@ -11123,7 +11185,7 @@ var applyShare = (items, total) => {
 };
 
 // src/hooks/useProfitAndLoss/useProfitAndLossLTM.tsx
-import { useEffect as useEffect25, useMemo as useMemo15, useState as useState34 } from "react";
+import { useEffect as useEffect25, useMemo as useMemo16, useState as useState34 } from "react";
 import { startOfMonth as startOfMonth6, sub } from "date-fns";
 import useSWR4 from "swr";
 var buildDates = ({ currentDate }) => {
@@ -11154,7 +11216,7 @@ var useProfitAndLossLTM = ({ currentDate, tagFilter, reportingBasis } = {
   const [date, setDate] = useState34(currentDate);
   const [loaded, setLoaded] = useState34("initial");
   const [data, setData] = useState34([]);
-  const { startYear, startMonth, endYear, endMonth } = useMemo15(() => {
+  const { startYear, startMonth, endYear, endMonth } = useMemo16(() => {
     return buildDates({ currentDate: date });
   }, [date, businessId, tagFilter, reportingBasis]);
   const queryKey = businessId && Boolean(startYear) && Boolean(startMonth) && Boolean(endYear) && Boolean(endMonth) && (auth == null ? void 0 : auth.access_token) && `profit-and-loss-summaries-${businessId}-${startYear.toString()}-${startMonth.toString()}-${tagFilter == null ? void 0 : tagFilter.key}-${(_a = tagFilter == null ? void 0 : tagFilter.values) == null ? void 0 : _a.join(
@@ -11278,7 +11340,7 @@ var useProfitAndLossLTM = ({ currentDate, tagFilter, reportingBasis } = {
 
 // src/hooks/useProfitAndLoss/useProfitAndLossQuery.tsx
 import { useEffect as useEffect26 } from "react";
-import { startOfMonth as startOfMonth7, endOfMonth as endOfMonth5, formatISO } from "date-fns";
+import { startOfMonth as startOfMonth7, endOfMonth as endOfMonth6, formatISO } from "date-fns";
 import useSWR5 from "swr";
 var useProfitAndLossQuery = ({
   startDate,
@@ -11287,7 +11349,7 @@ var useProfitAndLossQuery = ({
   reportingBasis
 } = {
   startDate: startOfMonth7(/* @__PURE__ */ new Date()),
-  endDate: endOfMonth5(/* @__PURE__ */ new Date())
+  endDate: endOfMonth6(/* @__PURE__ */ new Date())
 }) => {
   var _a, _b;
   const { businessId, syncTimestamps, read, hasBeenTouched } = useLayerContext();
@@ -11340,7 +11402,7 @@ var useProfitAndLossQuery = ({
 };
 
 // src/hooks/useProfitAndLoss/useProfitAndLoss.tsx
-import { startOfMonth as startOfMonth8, endOfMonth as endOfMonth6 } from "date-fns";
+import { startOfMonth as startOfMonth8, endOfMonth as endOfMonth7 } from "date-fns";
 var useProfitAndLoss = ({
   startDate: initialStartDate,
   endDate: initialEndDate,
@@ -11348,13 +11410,13 @@ var useProfitAndLoss = ({
   reportingBasis
 } = {
   startDate: startOfMonth8(/* @__PURE__ */ new Date()),
-  endDate: endOfMonth6(/* @__PURE__ */ new Date())
+  endDate: endOfMonth7(/* @__PURE__ */ new Date())
 }) => {
   const [startDate, setStartDate] = useState35(
     initialStartDate || startOfMonth8(Date.now())
   );
   const [endDate, setEndDate] = useState35(
-    initialEndDate || endOfMonth6(Date.now())
+    initialEndDate || endOfMonth7(Date.now())
   );
   const [filters, setFilters] = useState35({
     expenses: void 0,
@@ -11394,7 +11456,7 @@ var useProfitAndLoss = ({
       })
     }));
   };
-  const { filteredDataRevenue, filteredTotalRevenue } = useMemo16(() => {
+  const { filteredDataRevenue, filteredTotalRevenue } = useMemo17(() => {
     var _a;
     if (!data) {
       return { filteredDataRevenue: [], filteredTotalRevenue: void 0 };
@@ -11446,7 +11508,7 @@ var useProfitAndLoss = ({
     const withShare = applyShare(sorted, total);
     return { filteredDataRevenue: withShare, filteredTotalRevenue: total };
   }, [data, startDate, filters, sidebarScope, summaryData]);
-  const { filteredDataExpenses, filteredTotalExpenses } = useMemo16(() => {
+  const { filteredDataExpenses, filteredTotalExpenses } = useMemo17(() => {
     var _a;
     if (!data) {
       return { filteredDataExpenses: [], filteredTotalExpenses: void 0 };
@@ -11676,7 +11738,7 @@ var useProfitAndLossComparison = ({
 };
 
 // src/components/ProfitAndLossChart/ProfitAndLossChart.tsx
-import React143, { useContext as useContext18, useEffect as useEffect29, useMemo as useMemo17, useState as useState38 } from "react";
+import React143, { useContext as useContext18, useEffect as useEffect29, useMemo as useMemo18, useState as useState38 } from "react";
 
 // src/components/ProfitAndLossChart/ChartStateCard.tsx
 import React141 from "react";
@@ -11803,7 +11865,7 @@ import classNames48 from "classnames";
 import {
   add,
   differenceInMonths,
-  endOfMonth as endOfMonth7,
+  endOfMonth as endOfMonth8,
   format,
   startOfMonth as startOfMonth10,
   sub as sub2
@@ -11837,37 +11899,37 @@ var getChartWindow = ({
   if (differenceInMonths(startOfMonth10(chartWindow.start), current) === 0) {
     return {
       start: startOfMonth10(sub2(current, { months: 1 })),
-      end: endOfMonth7(add(current, { months: 11 }))
+      end: endOfMonth8(add(current, { months: 11 }))
     };
   }
-  if (differenceInMonths(endOfMonth7(chartWindow.end), endOfMonth7(current)) === 1 && differenceInMonths(today, current) >= 1) {
+  if (differenceInMonths(endOfMonth8(chartWindow.end), endOfMonth8(current)) === 1 && differenceInMonths(today, current) >= 1) {
     return {
       start: startOfMonth10(sub2(current, { months: 10 })),
-      end: endOfMonth7(add(current, { months: 2 }))
+      end: endOfMonth8(add(current, { months: 2 }))
     };
   }
   if (differenceInMonths(current, startOfMonth10(chartWindow.end)) === 0 && differenceInMonths(current, startOfMonth10(today)) > 0) {
     return {
       start: startOfMonth10(sub2(current, { months: 11 })),
-      end: endOfMonth7(add(current, { months: 1 }))
+      end: endOfMonth8(add(current, { months: 1 }))
     };
   }
   if (current >= yearAgo) {
     return {
       start: startOfMonth10(yearAgo),
-      end: endOfMonth7(today)
+      end: endOfMonth8(today)
     };
   }
   if (Number(current) > Number(chartWindow.end)) {
     return {
       start: startOfMonth10(sub2(current, { months: 12 })),
-      end: endOfMonth7(current)
+      end: endOfMonth8(current)
     };
   }
   if (differenceInMonths(current, startOfMonth10(chartWindow.start)) < 0) {
     return {
       start: startOfMonth10(current),
-      end: endOfMonth7(add(current, { months: 11 }))
+      end: endOfMonth8(add(current, { months: 11 }))
     };
   }
   return chartWindow;
@@ -11906,9 +11968,9 @@ var ProfitAndLossChart = ({
   const [barAnimActive, setBarAnimActive] = useState38(true);
   const [chartWindow, setChartWindow] = useState38({
     start: startOfMonth10(sub2(Date.now(), { months: 11 })),
-    end: endOfMonth7(Date.now())
+    end: endOfMonth8(Date.now())
   });
-  const selectionMonth = useMemo17(
+  const selectionMonth = useMemo18(
     () => ({
       year: localDateRange.startDate.getFullYear(),
       month: localDateRange.startDate.getMonth()
@@ -11924,7 +11986,7 @@ var ProfitAndLossChart = ({
     currentDate: startOfMonth10(Date.now()),
     tagFilter
   });
-  const anyData = useMemo17(() => {
+  const anyData = useMemo18(() => {
     return Boolean(
       data == null ? void 0 : data.find(
         (x) => x.income !== 0 || x.costOfGoodsSold !== 0 || x.grossProfit !== 0 || x.operatingExpenses !== 0 || x.profitBeforeTaxes !== 0 || x.taxes !== 0 || x.totalExpenses !== 0
@@ -11932,11 +11994,11 @@ var ProfitAndLossChart = ({
     );
   }, [data]);
   const { data: linkedAccounts } = useLinkedAccounts();
-  const isSyncing = useMemo17(
+  const isSyncing = useMemo18(
     () => Boolean(linkedAccounts == null ? void 0 : linkedAccounts.some((item) => item.is_syncing)),
     [linkedAccounts]
   );
-  const loadingValue = useMemo17(() => getLoadingValue(data), [data]);
+  const loadingValue = useMemo18(() => getLoadingValue(data), [data]);
   useEffect29(() => {
     if (loaded === "complete" && data) {
       const foundCurrent = data.find(
@@ -11995,7 +12057,7 @@ var ProfitAndLossChart = ({
     loading: (pnl == null ? void 0 : pnl.isLoading) ? loadingValue : 0,
     loadingExpenses: (pnl == null ? void 0 : pnl.isLoading) ? -loadingValue : 0
   });
-  const theData = useMemo17(() => {
+  const theData = useMemo18(() => {
     var _a;
     if (loaded !== "complete" || loaded === "complete" && !anyData) {
       const loadingData = [];
@@ -12061,7 +12123,7 @@ var ProfitAndLossChart = ({
       if (isMonthAllowed) {
         changeDateRange({
           startDate: new Date(year, month - 1, 1),
-          endDate: endOfMonth7(new Date(year, month - 1, 1))
+          endDate: endOfMonth8(new Date(year, month - 1, 1))
         });
       }
     }
@@ -12615,7 +12677,8 @@ var DATE_RANGE_MODE_CONFIG = {
   dayPicker: { label: "Day" },
   dayRangePicker: { label: "Select dates" },
   monthPicker: { label: "Month" },
-  monthRangePicker: { label: "Select months" }
+  monthRangePicker: { label: "Select months" },
+  yearPicker: { label: "Year" }
 };
 function toToggleOptions(allowedModes) {
   return allowedModes.map((mode) => ({
@@ -12649,7 +12712,7 @@ function DatePickerModeSelector({
 }
 
 // src/components/ProfitAndLossDatePicker/ProfitAndLossDatePicker.tsx
-import { endOfMonth as endOfMonth8, startOfMonth as startOfMonth11 } from "date-fns";
+import { endOfMonth as endOfMonth9, startOfMonth as startOfMonth11 } from "date-fns";
 var ProfitAndLossDatePicker = ({
   allowedDatePickerModes,
   datePickerMode: deprecated_datePickerMode,
@@ -12669,7 +12732,7 @@ var ProfitAndLossDatePicker = ({
     if (compareMode && compareMonths > 0) {
       refetch({
         startDate: startOfMonth11(date),
-        endDate: endOfMonth8(date)
+        endDate: endOfMonth9(date)
       });
     }
   };
@@ -12713,7 +12776,7 @@ var ProfitAndLossDatePicker = ({
           getComparisonData(date);
           changeDateRange({
             startDate: startOfMonth11(date),
-            endDate: endOfMonth8(date)
+            endDate: endOfMonth9(date)
           });
         }
       },
@@ -12765,7 +12828,7 @@ var X2 = (_a) => {
 var X_default = X2;
 
 // src/components/ProfitAndLossDetailedCharts/DetailedChart.tsx
-import React150, { useMemo as useMemo18 } from "react";
+import React150, { useMemo as useMemo19 } from "react";
 
 // src/utils/format.ts
 var capitalizeFirstLetter = (text) => text.charAt(0).toUpperCase() + text.slice(1);
@@ -13067,7 +13130,7 @@ var DetailedChart = ({
   isLoading,
   showDatePicker = true
 }) => {
-  const chartData = useMemo18(() => {
+  const chartData = useMemo19(() => {
     if (!filteredData) {
       return [];
     }
@@ -13525,7 +13588,7 @@ var ProfitAndLossDownloadButton = ({
 };
 
 // src/components/ProfitAndLossHeader/ProfitAndLossHeader.tsx
-import React155, { useMemo as useMemo19 } from "react";
+import React155, { useMemo as useMemo20 } from "react";
 
 // src/components/SyncingBadge/SyncingBadge.tsx
 import React154 from "react";
@@ -13549,7 +13612,7 @@ var ProfitAndLossHeader = ({
   withDatePicker
 }) => {
   const { data: linkedAccounts } = useLinkedAccounts();
-  const isSyncing = useMemo19(
+  const isSyncing = useMemo20(
     () => Boolean(linkedAccounts == null ? void 0 : linkedAccounts.some((item) => item.is_syncing)),
     [linkedAccounts]
   );
@@ -13763,17 +13826,17 @@ var ProfitAndLossReport = ({
 };
 
 // src/components/ProfitAndLossSummaries/ProfitAndLossSummaries.tsx
-import React167, { useContext as useContext24, useMemo as useMemo23 } from "react";
+import React167, { useContext as useContext24, useMemo as useMemo24 } from "react";
 
 // src/components/ProfitAndLossSummaries/internal/ProfitAndLossSummariesList.tsx
-import React163, { useMemo as useMemo20 } from "react";
+import React163, { useMemo as useMemo21 } from "react";
 var LIST_ITEM_CLASS_NAME = "Layer__ProfitAndLossSummariesListItem";
 function ProfitAndLossSummariesListItem({
   children,
   isActive,
   onClick
 }) {
-  const dataProperties = useMemo20(
+  const dataProperties = useMemo21(
     () => toDataProperties({ active: isActive, clickable: !!onClick }),
     [isActive]
   );
@@ -13784,7 +13847,7 @@ function ProfitAndLossSummariesList({
   children,
   itemCount
 }) {
-  const dataProperties = useMemo20(
+  const dataProperties = useMemo21(
     () => toDataProperties({ ["column-count"]: itemCount }),
     [itemCount]
   );
@@ -13877,10 +13940,10 @@ function ProfitAndLossSummariesMiniChart({
 }
 
 // src/components/ProfitAndLossSummaries/internal/ProfitAndLossSummariesSummary.tsx
-import React166, { useMemo as useMemo22 } from "react";
+import React166, { useMemo as useMemo23 } from "react";
 
 // src/components/ProfitAndLossSummaries/internal/ProfitAndLossSummariesHeading.tsx
-import { useMemo as useMemo21 } from "react";
+import { useMemo as useMemo22 } from "react";
 import React165 from "react";
 var HEADING_CLASS_NAME2 = "Layer__ProfitAndLossSummariesSummaryHeading";
 function ProfitAndLossSummariesHeading({
@@ -13888,7 +13951,7 @@ function ProfitAndLossSummariesHeading({
   children
 }) {
   const { size = "sm" } = variants != null ? variants : {};
-  const labelDataProperties = useMemo21(() => toDataProperties({ size }), [size]);
+  const labelDataProperties = useMemo22(() => toDataProperties({ size }), [size]);
   return /* @__PURE__ */ React165.createElement("h3", __spreadValues({ className: HEADING_CLASS_NAME2 }, labelDataProperties), children);
 }
 
@@ -13905,8 +13968,8 @@ function ProfitAndLossSummariesSummary({
 }) {
   const { Chart } = slots != null ? slots : {};
   const { size = "sm" } = variants != null ? variants : {};
-  const dataProperties = useMemo22(() => toDataProperties({ size }), [size]);
-  const amountDataProperties = useMemo22(
+  const dataProperties = useMemo23(() => toDataProperties({ size }), [size]);
+  const amountDataProperties = useMemo23(
     () => toDataProperties({
       positive: amount >= 0,
       negative: amount < 0,
@@ -13936,7 +13999,7 @@ function Internal_ProfitAndLossSummaries({
     sidebarScope
   } = useContext24(ProfitAndLoss.Context);
   const dataItem = Array.isArray(storedData) ? storedData[storedData.length - 1] : storedData;
-  const { revenueChartData, expensesChartData } = useMemo23(
+  const { revenueChartData, expensesChartData } = useMemo24(
     () => ({
       revenueChartData: toMiniChartData({ scope: "revenue", data: dataItem }),
       expensesChartData: toMiniChartData({ scope: "expenses", data: dataItem })
@@ -14638,7 +14701,7 @@ var ProfitAndLossTableWithProvider = (props) => {
 };
 
 // src/components/ProfitAndLoss/ProfitAndLoss.tsx
-import { endOfMonth as endOfMonth9, startOfMonth as startOfMonth12 } from "date-fns";
+import { endOfMonth as endOfMonth10, startOfMonth as startOfMonth12 } from "date-fns";
 var PNLContext = createContext13({
   data: void 0,
   filteredDataRevenue: [],
@@ -14650,7 +14713,7 @@ var PNLContext = createContext13({
   error: void 0,
   dateRange: {
     startDate: startOfMonth12(/* @__PURE__ */ new Date()),
-    endDate: endOfMonth9(/* @__PURE__ */ new Date())
+    endDate: endOfMonth10(/* @__PURE__ */ new Date())
   },
   changeDateRange: () => {
   },
@@ -15266,7 +15329,7 @@ var STATEMENT_OF_CASH_FLOW_ROWS = [
 ];
 
 // src/components/StatementOfCashFlow/StatementOfCashFlow.tsx
-import { endOfMonth as endOfMonth10, startOfDay as startOfDay4, startOfMonth as startOfMonth13, subWeeks } from "date-fns";
+import { endOfMonth as endOfMonth11, startOfDay as startOfDay4, startOfMonth as startOfMonth13, subWeeks } from "date-fns";
 
 // src/components/StatementOfCashFlow/download/CashflowStatementDownloadButton.tsx
 import React186 from "react";
@@ -15396,7 +15459,7 @@ var StatementOfCashFlowView = ({
       onChange: (dates) => {
         if (!Array.isArray(dates)) {
           const date = dates;
-          handleDateChange([startOfMonth13(date), endOfMonth10(date)]);
+          handleDateChange([startOfMonth13(date), endOfMonth11(date)]);
         }
       },
       dateFormat: "MMM",
@@ -15452,7 +15515,7 @@ import React202, { useContext as useContext36 } from "react";
 
 // src/contexts/ChartOfAccountsContext/ChartOfAccountsContext.tsx
 import { createContext as createContext16 } from "react";
-import { endOfMonth as endOfMonth11, startOfMonth as startOfMonth14 } from "date-fns";
+import { endOfMonth as endOfMonth12, startOfMonth as startOfMonth14 } from "date-fns";
 var ChartOfAccountsContext = createContext16(
   {
     data: void 0,
@@ -15476,7 +15539,7 @@ var ChartOfAccountsContext = createContext16(
     },
     dateRange: {
       startDate: startOfMonth14(/* @__PURE__ */ new Date()),
-      endDate: endOfMonth11(/* @__PURE__ */ new Date())
+      endDate: endOfMonth12(/* @__PURE__ */ new Date())
     },
     changeDateRange: () => {
     }
@@ -15711,7 +15774,7 @@ var LEDGER_ACCOUNT_SUBTYPES_FOR_TYPE = {
 };
 
 // src/hooks/useChartOfAccounts/useChartOfAccounts.tsx
-import { endOfMonth as endOfMonth12, formatISO as formatISO2, startOfMonth as startOfMonth15 } from "date-fns";
+import { endOfMonth as endOfMonth13, formatISO as formatISO2, startOfMonth as startOfMonth15 } from "date-fns";
 import useSWR8 from "swr";
 var validate = (formData) => {
   const errors = [];
@@ -15796,7 +15859,7 @@ var flattenAccounts = (accounts) => accounts.flatMap((a) => [a, flattenAccounts(
 var useChartOfAccounts = ({ withDates, startDate: initialStartDate, endDate: initialEndDate } = {
   withDates: false,
   startDate: startOfMonth15(/* @__PURE__ */ new Date()),
-  endDate: endOfMonth12(/* @__PURE__ */ new Date())
+  endDate: endOfMonth13(/* @__PURE__ */ new Date())
 }) => {
   const {
     businessId,
@@ -15814,7 +15877,7 @@ var useChartOfAccounts = ({ withDates, startDate: initialStartDate, endDate: ini
     initialStartDate != null ? initialStartDate : startOfMonth15(Date.now())
   );
   const [endDate, setEndDate] = useState48(
-    initialEndDate != null ? initialEndDate : endOfMonth12(Date.now())
+    initialEndDate != null ? initialEndDate : endOfMonth13(Date.now())
   );
   const queryKey = businessId && (auth == null ? void 0 : auth.access_token) && `chart-of-accounts-${businessId}-${startDate == null ? void 0 : startDate.valueOf()}-${endDate == null ? void 0 : endDate.valueOf()}`;
   const { data, isLoading, isValidating, error, mutate } = useSWR8(
@@ -16131,7 +16194,7 @@ var Plus_default = Plus;
 
 // src/components/ChartOfAccountsDatePicker/ChartOfAccountsDatePicker.tsx
 import React189, { useContext as useContext29 } from "react";
-import { endOfMonth as endOfMonth13, startOfMonth as startOfMonth16 } from "date-fns";
+import { endOfMonth as endOfMonth14, startOfMonth as startOfMonth16 } from "date-fns";
 var ChartOfAccountsDatePicker = () => {
   const { changeDateRange, dateRange } = useContext29(ChartOfAccountsContext);
   return /* @__PURE__ */ React189.createElement(
@@ -16143,7 +16206,7 @@ var ChartOfAccountsDatePicker = () => {
         if (!Array.isArray(date)) {
           changeDateRange({
             startDate: startOfMonth16(date),
-            endDate: endOfMonth13(date)
+            endDate: endOfMonth14(date)
           });
         }
       }
@@ -16155,13 +16218,13 @@ var ChartOfAccountsDatePicker = () => {
 import React191 from "react";
 
 // src/components/ChartOfAccountsForm/ChartOfAccountsForm.tsx
-import React190, { useContext as useContext30, useMemo as useMemo25 } from "react";
+import React190, { useContext as useContext30, useMemo as useMemo26 } from "react";
 
 // src/components/ChartOfAccountsForm/useParentOptions.ts
-import { useMemo as useMemo24 } from "react";
+import { useMemo as useMemo25 } from "react";
 var useParentOptions = (data) => {
   var _a;
-  return useMemo24(
+  return useMemo25(
     () => flattenAccounts((data == null ? void 0 : data.accounts) || []).sort((a, b) => (a == null ? void 0 : a.name) && (b == null ? void 0 : b.name) ? a.name.localeCompare(b.name) : 0).map((x) => {
       return {
         label: x.name,
@@ -16187,7 +16250,7 @@ var ChartOfAccountsForm = ({
     apiError
   } = useContext30(ChartOfAccountsContext);
   const parentOptions = useParentOptions(data);
-  const entry = useMemo25(() => {
+  const entry = useMemo26(() => {
     if ((form == null ? void 0 : form.action) === "edit" && form.accountId) {
       return flattenAccounts((data == null ? void 0 : data.accounts) || []).find(
         (x) => x.id === form.accountId
@@ -16629,12 +16692,12 @@ var ChartOfAccountsTableWithPanel = ({
 import React201, {
   useContext as useContext35,
   useEffect as useEffect43,
-  useMemo as useMemo27,
+  useMemo as useMemo28,
   useState as useState53
 } from "react";
 
 // src/components/LedgerAccountEntryDetails/LedgerAccountEntryDetails.tsx
-import React199, { useContext as useContext33, useMemo as useMemo26 } from "react";
+import React199, { useContext as useContext33, useMemo as useMemo27 } from "react";
 
 // src/utils/journal.ts
 var getAccountIdentifierPayload = (journalLineItem) => {
@@ -16669,14 +16732,14 @@ import React196 from "react";
 import { parseISO as parseISO12, format as formatTime10 } from "date-fns";
 var DateTime = ({
   value,
-  format: format8,
+  format: format9,
   dateFormat,
   timeFormat,
   onlyDate,
   onlyTime
 }) => {
-  if (format8) {
-    return /* @__PURE__ */ React196.createElement(Text, { className: "Layer__datetime" }, formatTime10(parseISO12(value), format8));
+  if (format9) {
+    return /* @__PURE__ */ React196.createElement(Text, { className: "Layer__datetime" }, formatTime10(parseISO12(value), format9));
   }
   const date = formatTime10(parseISO12(value), dateFormat != null ? dateFormat : DATE_FORMAT);
   const time = formatTime10(parseISO12(value), timeFormat != null ? timeFormat : TIME_FORMAT);
@@ -16843,7 +16906,7 @@ var LedgerAccountEntryDetails = ({
 }) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v;
   const { entryData, isLoadingEntry, closeSelectedEntry, errorEntry } = useContext33(LedgerAccountsContext);
-  const { totalDebit, totalCredit } = useMemo26(() => {
+  const { totalDebit, totalCredit } = useMemo27(() => {
     var _a2;
     let totalDebit2 = 0;
     let totalCredit2 = 0;
@@ -17102,12 +17165,12 @@ var LedgerAccount = ({
     "Layer__ledger-account__index",
     accountId && "open"
   );
-  const account = useMemo27(() => {
+  const account = useMemo28(() => {
     return flattenAccounts((accountData == null ? void 0 : accountData.accounts) || []).find(
       (x) => x.id === accountId
     );
   }, [accountId]);
-  const data = useMemo27(() => {
+  const data = useMemo28(() => {
     var _a2;
     const firstPageIndex = (currentPage - 1) * pageSize;
     const lastPageIndex = firstPageIndex + pageSize;
@@ -17541,13 +17604,13 @@ var useJournal = () => {
 };
 
 // src/components/JournalTable/JournalTableWithPanel.tsx
-import React208, { useContext as useContext42, useMemo as useMemo29, useState as useState56 } from "react";
+import React208, { useContext as useContext42, useMemo as useMemo30, useState as useState56 } from "react";
 
 // src/components/JournalSidebar/JournalSidebar.tsx
 import React206, { useContext as useContext40 } from "react";
 
 // src/components/JournalEntryDetails/JournalEntryDetails.tsx
-import React203, { useContext as useContext37, useMemo as useMemo28, useState as useState55 } from "react";
+import React203, { useContext as useContext37, useMemo as useMemo29, useState as useState55 } from "react";
 var JournalEntryDetails = () => {
   var _a, _b, _c, _d;
   const {
@@ -17561,13 +17624,13 @@ var JournalEntryDetails = () => {
   } = useContext37(JournalContext);
   const [reverseEntryProcessing, setReverseEntryProcessing] = useState55(false);
   const [reverseEntryError, setReverseEntryError] = useState55();
-  const entry = useMemo28(() => {
+  const entry = useMemo29(() => {
     if (selectedEntryId && data) {
       return data.find((x) => x.id === selectedEntryId);
     }
     return;
   }, [data, selectedEntryId]);
-  const sortedLineItems = useMemo28(
+  const sortedLineItems = useMemo29(
     () => {
       var _a2;
       return (_a2 = entry == null ? void 0 : entry.line_items) == null ? void 0 : _a2.sort(
@@ -18099,7 +18162,7 @@ var JournalTableWithPanel = ({
     selectedEntryId,
     addEntry
   } = useContext42(JournalContext);
-  const data = useMemo29(() => {
+  const data = useMemo30(() => {
     var _a;
     const firstPageIndex = (currentPage - 1) * pageSize;
     const lastPageIndex = firstPageIndex + pageSize;
@@ -18214,31 +18277,47 @@ var JournalContent = ({
 };
 
 // src/components/Tasks/Tasks.tsx
-import React216, {
+import React218, {
   createContext as createContext20,
   useContext as useContext47,
   useEffect as useEffect48,
-  useMemo as useMemo31,
+  useMemo as useMemo36,
   useState as useState60
 } from "react";
 
 // src/contexts/TasksContext/TasksContext.tsx
 import { createContext as createContext19 } from "react";
+import { endOfYear as endOfYear3, startOfYear as startOfYear2 } from "date-fns";
 var TasksContext = createContext19({
   data: void 0,
   isLoading: false,
   loadedStatus: "initial",
   error: void 0,
+  currentDate: /* @__PURE__ */ new Date(),
+  setCurrentDate: () => {
+  },
+  dateRange: { startDate: startOfYear2(/* @__PURE__ */ new Date()), endDate: endOfYear3(/* @__PURE__ */ new Date()) },
+  setDateRange: () => {
+  },
   refetch: () => {
   },
   submitResponseToTask: () => {
   },
-  uploadDocumentForTask: () => {
+  updateDocUploadTaskDescription: () => {
+  },
+  uploadDocumentsForTask: () => Promise.resolve(),
+  deleteUploadsForTask: () => {
   }
 });
 
 // src/hooks/useTasks/useTasks.tsx
-import { useEffect as useEffect46, useState as useState57 } from "react";
+import { useEffect as useEffect46, useMemo as useMemo31, useState as useState57 } from "react";
+
+// src/types/tasks.ts
+var COMPLETED_TASK_TYPES = ["COMPLETED", "USER_MARKED_COMPLETED"];
+function isComplete(taskType) {
+  return COMPLETED_TASK_TYPES.includes(taskType);
+}
 
 // src/hooks/useTasks/mockData.ts
 var mockData = [
@@ -18256,7 +18335,9 @@ var mockData = [
     completed_at: null,
     created_at: "2024-09-12T05:56:49.360176Z",
     updated_at: "2024-09-12T05:56:49.360176Z",
-    document_type: "LOAN_STATEMENT"
+    effective_date: "2024-09-12T05:56:49.360176Z",
+    document_type: "LOAN_STATEMENT",
+    documents: []
   },
   {
     id: "f49e6eb2-52d4-4872-b34a-2baf387b8593",
@@ -18272,25 +18353,67 @@ var mockData = [
     completed_at: null,
     created_at: "2024-09-12T05:56:49.360176Z",
     updated_at: "2024-09-12T05:56:49.360176Z",
-    document_type: "BANK_STATEMENT"
+    effective_date: "2024-09-12T05:56:49.360176Z",
+    document_type: "BANK_STATEMENT",
+    documents: []
   }
 ];
 
 // src/hooks/useTasks/useTasks.tsx
 import useSWR11 from "swr";
+import { endOfYear as endOfYear4, formatISO as formatISO3, getMonth as getMonth2, getYear as getYear2, parseISO as parseISO15, startOfYear as startOfYear3 } from "date-fns";
 var DEBUG_MODE = false;
-var useTasks = () => {
+var useTasks = ({
+  startDate: initialStartDate = startOfYear3(/* @__PURE__ */ new Date()),
+  endDate: initialEndDate = endOfYear4(/* @__PURE__ */ new Date())
+} = {}) => {
   const [loadedStatus, setLoadedStatus] = useState57("initial");
   const { businessId, read, syncTimestamps, hasBeenTouched } = useLayerContext();
   const { apiUrl } = useEnvironment();
   const { data: auth } = useAuth();
-  const queryKey = businessId && (auth == null ? void 0 : auth.access_token) && `tasks-${businessId}`;
+  const [dateRange, setDateRange] = useState57({
+    startDate: initialStartDate,
+    endDate: initialEndDate
+  });
+  const [currentDate, setCurrentDate] = useState57(/* @__PURE__ */ new Date());
+  const queryKey = businessId && (auth == null ? void 0 : auth.access_token) && `tasks-${businessId}-${dateRange.startDate}-${dateRange.endDate}`;
   const { data, isLoading, isValidating, error, mutate } = useSWR11(
     queryKey,
     Layer.getTasks(apiUrl, auth == null ? void 0 : auth.access_token, {
-      params: { businessId }
+      params: {
+        businessId,
+        startDate: formatISO3(dateRange.startDate.valueOf()),
+        endDate: formatISO3(dateRange.endDate.valueOf())
+      }
     })
   );
+  const monthlyData = useMemo31(() => {
+    if (data == null ? void 0 : data.data) {
+      const grouped = data.data.reduce((acc, task) => {
+        const effectiveDate = task.effective_date ? parseISO15(task.effective_date) : parseISO15(task.created_at);
+        const year = getYear2(effectiveDate);
+        const month = getMonth2(effectiveDate);
+        const key = `${year}-${month}`;
+        if (!acc[key]) {
+          acc[key] = {
+            year,
+            month,
+            total: 0,
+            completed: 0,
+            tasks: []
+          };
+        }
+        acc[key].tasks.push(task);
+        if (isComplete(task.status)) {
+          acc[key].completed += 1;
+        }
+        acc[key].total += 1;
+        return acc;
+      }, {});
+      return Object.values(grouped);
+    }
+    return [];
+  }, [data]);
   useEffect46(() => {
     if (isLoading && loadedStatus === "initial") {
       setLoadedStatus("loading");
@@ -18299,17 +18422,18 @@ var useTasks = () => {
     }
   }, [isLoading]);
   const refetch = () => mutate();
-  const uploadDocumentForTask = (taskId, file) => {
-    const uploadDocument = Layer.completeTaskWithUpload(
+  const uploadDocumentsForTask = (taskId, files, description) => __async(void 0, null, function* () {
+    const uploadDocuments = Layer.completeTaskWithUpload(
       apiUrl,
       auth == null ? void 0 : auth.access_token
     );
-    uploadDocument({
+    yield uploadDocuments({
       businessId,
       taskId,
-      file
+      files,
+      description
     }).then(refetch);
-  };
+  });
   const submitResponseToTask2 = (taskId, userResponse) => {
     if (!taskId || !userResponse || userResponse.length === 0)
       return;
@@ -18322,6 +18446,21 @@ var useTasks = () => {
       body: data2
     }).then(() => refetch());
   };
+  const deleteUploadsForTask = (taskId) => {
+    Layer.deleteTaskUploads(apiUrl, auth == null ? void 0 : auth.access_token, {
+      params: { businessId, taskId }
+    }).then(() => refetch());
+  };
+  const updateDocUploadTaskDescription = (taskId, userResponse) => {
+    const data2 = {
+      type: "FreeResponse",
+      user_response: userResponse
+    };
+    Layer.updateUploadDocumentTaskDescription(apiUrl, auth == null ? void 0 : auth.access_token, {
+      params: { businessId, taskId },
+      body: data2
+    }).then(() => refetch());
+  };
   useEffect46(() => {
     if (queryKey && (isLoading || isValidating)) {
       read("TASKS" /* TASKS */, queryKey);
@@ -18334,22 +18473,23 @@ var useTasks = () => {
   }, [syncTimestamps]);
   return {
     data: DEBUG_MODE ? mockData : data == null ? void 0 : data.data,
+    monthlyData,
     isLoading,
     loadedStatus,
     isValidating,
     error,
+    currentDate,
+    setCurrentDate,
+    dateRange,
+    setDateRange,
     refetch,
     submitResponseToTask: submitResponseToTask2,
-    uploadDocumentForTask
+    uploadDocumentsForTask,
+    deleteUploadsForTask,
+    updateDocUploadTaskDescription
   };
 };
 
-// src/types/tasks.ts
-var COMPLETED_TASK_TYPES = ["COMPLETED", "USER_MARKED_COMPLETED"];
-function isComplete(taskType) {
-  return COMPLETED_TASK_TYPES.includes(taskType);
-}
-
 // src/components/TasksHeader/TasksHeader.tsx
 import React211, { useContext as useContext43 } from "react";
 
@@ -18444,6 +18584,8 @@ var ProgressIcon = (_a) => {
 var ProgressIcon_default = ProgressIcon;
 
 // src/components/TasksHeader/TasksHeader.tsx
+import { endOfYear as endOfYear5, getYear as getYear3, startOfYear as startOfYear4 } from "date-fns";
+import classNames66 from "classnames";
 var ICONS = {
   loading: {
     icon: /* @__PURE__ */ React211.createElement(ProgressIcon_default, { size: 12, className: "Layer__anim--rotating" }),
@@ -18472,10 +18614,19 @@ var TasksHeader = ({
   open,
   toggleContent
 }) => {
-  const { data: tasks, loadedStatus, refetch, error } = useContext43(TasksContext);
+  const {
+    data: tasks,
+    loadedStatus,
+    refetch,
+    error,
+    dateRange,
+    setDateRange
+  } = useContext43(TasksContext);
+  const { business } = useLayerContext();
   const completedTasks = tasks == null ? void 0 : tasks.filter((task) => isComplete(task.status)).length;
   const badgeVariant = completedTasks === (tasks == null ? void 0 : tasks.length) ? ICONS.done : ICONS.pending;
-  return /* @__PURE__ */ React211.createElement("div", { className: "Layer__tasks-header" }, /* @__PURE__ */ React211.createElement("div", { className: "Layer__tasks-header__left-col" }, /* @__PURE__ */ React211.createElement(Text, { size: "lg" /* lg */ }, tasksHeader), loadedStatus !== "complete" && !open ? /* @__PURE__ */ React211.createElement(Badge, { variant: ICONS.loading.badge, icon: ICONS.loading.icon }, ICONS.loading.text) : loadedStatus === "complete" && (!tasks || error) ? /* @__PURE__ */ React211.createElement(
+  const minDate = getEarliestDateToBrowse(business);
+  return /* @__PURE__ */ React211.createElement("div", { className: classNames66("Layer__tasks-header", collapsable && "Layer__tasks-header--collapsable") }, /* @__PURE__ */ React211.createElement("div", { className: "Layer__tasks-header__left-col" }, /* @__PURE__ */ React211.createElement("div", { className: "Layer__tasks-header__left-col__title" }, /* @__PURE__ */ React211.createElement(Text, { size: "lg" /* lg */ }, tasksHeader), loadedStatus !== "complete" && !open ? /* @__PURE__ */ React211.createElement(Badge, { variant: ICONS.loading.badge, icon: ICONS.loading.icon }, ICONS.loading.text) : loadedStatus === "complete" && !open && (!tasks || error) ? /* @__PURE__ */ React211.createElement(
     Badge,
     {
       onClick: () => refetch(),
@@ -18483,11 +18634,31 @@ var TasksHeader = ({
       icon: ICONS.refresh.icon
     },
     ICONS.refresh.text
-  ) : loadedStatus === "complete" ? /* @__PURE__ */ React211.createElement(Badge, { variant: badgeVariant.badge, icon: badgeVariant.icon }, badgeVariant.text) : open ? null : /* @__PURE__ */ React211.createElement(Badge, { variant: badgeVariant.badge, icon: badgeVariant.icon }, badgeVariant.text)), collapsable && /* @__PURE__ */ React211.createElement(ExpandButton, { onClick: toggleContent, collapsed: !open }));
+  ) : loadedStatus === "complete" && !open ? /* @__PURE__ */ React211.createElement(Badge, { variant: badgeVariant.badge, icon: badgeVariant.icon }, badgeVariant.text) : open ? null : /* @__PURE__ */ React211.createElement(Badge, { variant: badgeVariant.badge, icon: badgeVariant.icon }, badgeVariant.text)), /* @__PURE__ */ React211.createElement("div", { className: "Layer__tasks-header__left-col__controls" }, /* @__PURE__ */ React211.createElement(
+    DatePicker,
+    {
+      selected: dateRange.startDate,
+      onChange: (dates) => {
+        if (!Array.isArray(dates)) {
+          setDateRange({
+            startDate: startOfYear4(dates),
+            endDate: endOfYear5(dates)
+          });
+        }
+      },
+      dateFormat: "YYYY",
+      mode: "yearPicker",
+      minDate,
+      maxDate: endOfYear5(/* @__PURE__ */ new Date()),
+      currentDateOption: false,
+      navigateArrows: ["mobile", "desktop"],
+      disabled: minDate && getYear3(minDate) === getYear3(/* @__PURE__ */ new Date())
+    }
+  ), collapsable && /* @__PURE__ */ React211.createElement("div", { className: "Layer__tasks-header__left-col__expand" }, /* @__PURE__ */ React211.createElement(ExpandButton, { onClick: toggleContent, collapsed: !open })))));
 };
 
 // src/components/TasksList/TasksList.tsx
-import React214, { useContext as useContext45, useMemo as useMemo30, useState as useState59 } from "react";
+import React214, { useContext as useContext45, useMemo as useMemo33, useState as useState59 } from "react";
 
 // src/icons/SmileIcon.tsx
 import * as React212 from "react";
@@ -18544,32 +18715,97 @@ var SmileIcon = (_a) => {
 var SmileIcon_default = SmileIcon;
 
 // src/components/TasksListItem/TasksListItem.tsx
-import React213, { useContext as useContext44, useEffect as useEffect47, useState as useState58 } from "react";
-import classNames66 from "classnames";
+import React213, { useContext as useContext44, useEffect as useEffect47, useMemo as useMemo32, useState as useState58 } from "react";
+import classNames67 from "classnames";
 var TasksListItem = ({
   task,
   goToNextPageIfAllComplete,
   defaultOpen
 }) => {
+  var _a;
   const [isOpen, setIsOpen] = useState58(defaultOpen);
   const [userResponse, setUserResponse] = useState58(task.user_response || "");
-  const { submitResponseToTask: submitResponseToTask2, uploadDocumentForTask } = useContext44(TasksContext);
-  const taskBodyClassName = classNames66(
+  const [selectedFiles, setSelectedFiles] = useState58();
+  const {
+    submitResponseToTask: submitResponseToTask2,
+    uploadDocumentsForTask,
+    deleteUploadsForTask,
+    updateDocUploadTaskDescription
+  } = useContext44(TasksContext);
+  const taskBodyClassName = classNames67(
     "Layer__tasks-list-item__body",
     isOpen && "Layer__tasks-list-item__body--expanded",
     isComplete(task.status) && "Layer__tasks-list-item--completed"
   );
-  const taskHeadClassName = classNames66(
+  const taskHeadClassName = classNames67(
     "Layer__tasks-list-item__head-info",
     isComplete(task.status) ? "Layer__tasks-list-item--completed" : "Layer__tasks-list-item--pending"
   );
-  const taskItemClassName = classNames66(
+  const taskItemClassName = classNames67(
     "Layer__tasks-list-item",
     isOpen && "Layer__tasks-list-item__expanded"
   );
   useEffect47(() => {
     setIsOpen(defaultOpen);
   }, [defaultOpen]);
+  const uploadDocumentAction = useMemo32(() => {
+    if (task.user_response_type === "UPLOAD_DOCUMENT") {
+      if (task.status === "TODO") {
+        if (!selectedFiles) {
+          return /* @__PURE__ */ React213.createElement(
+            FileInput,
+            {
+              onUpload: (files) => {
+                setSelectedFiles(files);
+              },
+              text: "Select file(s)",
+              allowMultipleUploads: true
+            }
+          );
+        } else {
+          return /* @__PURE__ */ React213.createElement(
+            Button,
+            {
+              variant: "secondary" /* secondary */,
+              onClick: () => __async(void 0, null, function* () {
+                yield uploadDocumentsForTask(task.id, selectedFiles, userResponse);
+                setIsOpen(false);
+                goToNextPageIfAllComplete(task);
+                setSelectedFiles(void 0);
+              })
+            },
+            "Submit"
+          );
+        }
+      } else if (task.status === "USER_MARKED_COMPLETED") {
+        if (task.user_response && task.user_response != userResponse) {
+          return /* @__PURE__ */ React213.createElement(
+            Button,
+            {
+              variant: "secondary" /* secondary */,
+              onClick: () => {
+                updateDocUploadTaskDescription(task.id, userResponse);
+              }
+            },
+            "Update"
+          );
+        } else {
+          return /* @__PURE__ */ React213.createElement(
+            Button,
+            {
+              variant: "secondary" /* secondary */,
+              onClick: () => {
+                deleteUploadsForTask(task.id);
+              }
+            },
+            "Delete Uploads"
+          );
+        }
+      } else {
+        return null;
+      }
+    }
+  }, [task, selectedFiles, userResponse]);
   return /* @__PURE__ */ React213.createElement("div", { className: "Layer__tasks-list-item-wrapper" }, /* @__PURE__ */ React213.createElement("div", { className: taskItemClassName }, /* @__PURE__ */ React213.createElement(
     "div",
     {
@@ -18587,24 +18823,14 @@ var TasksListItem = ({
         }
       }
     )
-  ), /* @__PURE__ */ React213.createElement("div", { className: taskBodyClassName }, /* @__PURE__ */ React213.createElement("div", { className: "Layer__tasks-list-item__body-info" }, /* @__PURE__ */ React213.createElement(Text, { size: "sm" /* sm */ }, task.question), task.user_response_type === "FREE_RESPONSE" ? /* @__PURE__ */ React213.createElement(
+  ), /* @__PURE__ */ React213.createElement("div", { className: taskBodyClassName }, /* @__PURE__ */ React213.createElement("div", { className: "Layer__tasks-list-item__body-info" }, /* @__PURE__ */ React213.createElement(Text, { size: "sm" /* sm */ }, task.question), /* @__PURE__ */ React213.createElement(
     Textarea,
     {
       value: userResponse,
+      placeholder: task.user_response_type === "UPLOAD_DOCUMENT" ? "Optional description" : "",
       onChange: (e) => setUserResponse(e.target.value)
     }
-  ) : null, /* @__PURE__ */ React213.createElement("div", { className: "Layer__tasks-list-item__actions" }, task.user_response_type === "UPLOAD_DOCUMENT" ? /* @__PURE__ */ React213.createElement(
-    FileInput,
-    {
-      onUpload: (file) => {
-        uploadDocumentForTask(task.id, file);
-        setIsOpen(false);
-        goToNextPageIfAllComplete(task);
-      },
-      text: "Upload file",
-      disabled: task.completed_at != null || task.user_marked_completed_at != null || task.archived_at != null
-    }
-  ) : /* @__PURE__ */ React213.createElement(
+  ), task.user_response_type === "UPLOAD_DOCUMENT" ? /* @__PURE__ */ React213.createElement("div", { className: "Layer__tasks-list__link-list" }, selectedFiles ? /* @__PURE__ */ React213.createElement("div", { className: "Layer__tasks-list__link-list-header" }, "Selected Files:") : task.documents ? /* @__PURE__ */ React213.createElement("div", { className: "Layer__tasks-list__link-list-header" }, "Uploaded Files:") : null, /* @__PURE__ */ React213.createElement("ul", { className: "Layer__tasks-list__links-list" }, (_a = task.documents) == null ? void 0 : _a.map((document2, idx) => /* @__PURE__ */ React213.createElement("li", { key: `uploaded-doc-name-${idx}` }, /* @__PURE__ */ React213.createElement("a", { className: "Layer__tasks-list-item__link", href: document2.presigned_url.presignedUrl }, document2.file_name))), selectedFiles == null ? void 0 : selectedFiles.map((file, idx) => /* @__PURE__ */ React213.createElement("li", { key: `selected-file-name-${idx}` }, /* @__PURE__ */ React213.createElement("a", { className: "Layer__tasks-list-item__link" }, file.name))))) : null, /* @__PURE__ */ React213.createElement("div", { className: "Layer__tasks-list-item__actions" }, task.user_response_type === "UPLOAD_DOCUMENT" ? uploadDocumentAction : /* @__PURE__ */ React213.createElement(
     Button,
     {
       disabled: userResponse.length === 0 || userResponse === task.user_response,
@@ -18615,11 +18841,12 @@ var TasksListItem = ({
         goToNextPageIfAllComplete(task);
       }
     },
-    userResponse && userResponse.length === 0 ? "Update" : "Save"
+    task.user_response && task.user_response !== userResponse ? "Update" : "Save"
   ))))));
 };
 
 // src/components/TasksList/TasksList.tsx
+import { endOfMonth as endOfMonth15, isAfter, isBefore, parseISO as parseISO16, startOfMonth as startOfMonth17 } from "date-fns";
 function paginateArray(array, chunkSize = 10) {
   const result = [];
   for (let i = 0; i < array.length; i += chunkSize) {
@@ -18630,7 +18857,13 @@ function paginateArray(array, chunkSize = 10) {
 }
 var TasksEmptyState = () => /* @__PURE__ */ React214.createElement("div", { className: "Layer__tasks-empty-state" }, /* @__PURE__ */ React214.createElement("div", { className: "Layer__tasks-icon" }, /* @__PURE__ */ React214.createElement(SmileIcon_default, null)), /* @__PURE__ */ React214.createElement(Text, { size: "sm" /* sm */ }, "There are no pending tasks!", /* @__PURE__ */ React214.createElement("br", null), " Great job!"));
 var TasksList = ({ pageSize = 10 }) => {
-  const { data: tasks, error } = useContext45(TasksContext);
+  const { data: rawData, error, currentDate } = useContext45(TasksContext);
+  const tasks = useMemo33(() => {
+    return rawData == null ? void 0 : rawData.filter((x) => {
+      const d = x.effective_date ? parseISO16(x.effective_date) : parseISO16(x.created_at);
+      return !isBefore(d, startOfMonth17(currentDate)) && !isAfter(d, endOfMonth15(currentDate));
+    });
+  }, [rawData, currentDate]);
   const firstPageWithIincompleteTasks = paginateArray(
     tasks || [],
     pageSize
@@ -18638,10 +18871,10 @@ var TasksList = ({ pageSize = 10 }) => {
   const [currentPage, setCurrentPage] = useState59(
     firstPageWithIincompleteTasks === -1 ? 1 : firstPageWithIincompleteTasks + 1
   );
-  const sortedTasks = useMemo30(() => {
+  const sortedTasks = useMemo33(() => {
     const firstPageIndex = (currentPage - 1) * pageSize;
     const lastPageIndex = firstPageIndex + pageSize;
-    return tasks == null ? void 0 : tasks.slice(firstPageIndex, lastPageIndex);
+    return tasks == null ? void 0 : tasks.sort((x) => isComplete(x.status) ? 1 : -1).slice(firstPageIndex, lastPageIndex);
   }, [tasks, currentPage]);
   const indexFirstIncomplete = sortedTasks == null ? void 0 : sortedTasks.findIndex(
     (task) => !isComplete(task.status)
@@ -18672,12 +18905,18 @@ var TasksList = ({ pageSize = 10 }) => {
 };
 
 // src/components/TasksPending/TasksPending.tsx
-import React215, { useContext as useContext46 } from "react";
-import classNames67 from "classnames";
-import { format as format7 } from "date-fns";
+import React215, { useContext as useContext46, useMemo as useMemo34 } from "react";
+import classNames68 from "classnames";
+import { endOfMonth as endOfMonth16, format as format7, isAfter as isAfter2, isBefore as isBefore2, parseISO as parseISO17, startOfMonth as startOfMonth18 } from "date-fns";
 import { Cell as Cell4, Pie as Pie3, PieChart as PieChart4 } from "recharts";
 var TasksPending = () => {
-  const { data } = useContext46(TasksContext);
+  const { data: rawData, currentDate } = useContext46(TasksContext);
+  const data = useMemo34(() => {
+    return rawData == null ? void 0 : rawData.filter((x) => {
+      const d = x.effective_date ? parseISO17(x.effective_date) : parseISO17(x.created_at);
+      return !isBefore2(d, startOfMonth18(currentDate)) && !isAfter2(d, endOfMonth16(currentDate));
+    });
+  }, [rawData, currentDate]);
   const completedTasks = data == null ? void 0 : data.filter((task) => isComplete(task.status)).length;
   const chartData = [
     {
@@ -18689,10 +18928,10 @@ var TasksPending = () => {
       value: data == null ? void 0 : data.filter((task) => !isComplete(task.status)).length
     }
   ];
-  const taskStatusClassName = classNames67(
+  const taskStatusClassName = classNames68(
     completedTasks && completedTasks > 0 ? "Layer__tasks-pending-bar__status--done" : "Layer__tasks-pending-bar__status--pending"
   );
-  return /* @__PURE__ */ React215.createElement("div", { className: "Layer__tasks-pending" }, /* @__PURE__ */ React215.createElement(Text, { size: "lg" /* lg */ }, format7(Date.now(), "MMMM")), /* @__PURE__ */ React215.createElement("div", { className: "Layer__tasks-pending-bar" }, /* @__PURE__ */ React215.createElement(Text, { size: "sm" /* sm */ }, /* @__PURE__ */ React215.createElement("span", { className: taskStatusClassName }, completedTasks), "/", data == null ? void 0 : data.length, " done"), /* @__PURE__ */ React215.createElement(PieChart4, { width: 24, height: 24, className: "mini-chart" }, /* @__PURE__ */ React215.createElement(
+  return /* @__PURE__ */ React215.createElement("div", { className: "Layer__tasks-pending" }, /* @__PURE__ */ React215.createElement(Text, { size: "lg" /* lg */ }, format7(currentDate, "MMMM")), data && (data == null ? void 0 : data.length) > 0 ? /* @__PURE__ */ React215.createElement("div", { className: "Layer__tasks-pending-bar" }, /* @__PURE__ */ React215.createElement(Text, { size: "sm" /* sm */ }, /* @__PURE__ */ React215.createElement("span", { className: taskStatusClassName }, completedTasks), "/", data == null ? void 0 : data.length, " done"), /* @__PURE__ */ React215.createElement(PieChart4, { width: 24, height: 24, className: "mini-chart" }, /* @__PURE__ */ React215.createElement(
     Pie3,
     {
       data: chartData,
@@ -18719,11 +18958,86 @@ var TasksPending = () => {
         }
       );
     })
-  ))));
+  ))) : null);
+};
+
+// src/components/TasksMonthSelector/TasksMonthSelector.tsx
+import React217, { useMemo as useMemo35 } from "react";
+import { endOfMonth as endOfMonth17, format as format8, getMonth as getMonth3, getYear as getYear4, isAfter as isAfter3, isBefore as isBefore3, set, startOfMonth as startOfMonth19 } from "date-fns";
+
+// src/components/TasksMonthSelector/TaskMonthTile.tsx
+import React216 from "react";
+import classNames69 from "classnames";
+var TaskMonthTile = ({ monthData, onClick, active, disabled }) => {
+  const isCompleted = monthData.total === monthData.completed;
+  const baseClass = classNames69(
+    "Layer__tasks-month-selector__month",
+    isCompleted && "Layer__tasks-month-selector__month--completed",
+    active && "Layer__tasks-month-selector__month--active",
+    disabled && "Layer__tasks-month-selector__month--disabled"
+  );
+  return /* @__PURE__ */ React216.createElement("div", { className: baseClass, onClick: () => !disabled && onClick(monthData.startDate) }, /* @__PURE__ */ React216.createElement(Text, { size: "sm" /* sm */, className: "Layer__tasks-month-selector__month__str" }, monthData.monthStr), /* @__PURE__ */ React216.createElement(Text, { size: "sm" /* sm */, className: "Layer__tasks-month-selector__month__total" }, monthData.total > 0 && isCompleted ? monthData.total : ""), isCompleted && monthData.total > 0 && /* @__PURE__ */ React216.createElement("span", { className: "Layer__tasks-month-selector__month__completed" }, /* @__PURE__ */ React216.createElement(Check_default, { size: 12 })), !isCompleted && monthData.total > 0 && /* @__PURE__ */ React216.createElement("span", { className: "Layer__tasks-month-selector__month__incompleted" }, /* @__PURE__ */ React216.createElement(Text, { size: "sm" /* sm */ }, monthData.total), /* @__PURE__ */ React216.createElement(AlertCircle_default, { size: 12 })));
+};
+
+// src/components/TasksMonthSelector/TasksMonthSelector.tsx
+var DEFAULT_TASK_DATA = {
+  total: 0,
+  completed: 0,
+  tasks: []
+};
+var isCurrentMonth = (monthDate, currentDate) => getMonth3(currentDate) === getMonth3(monthDate) && getYear4(currentDate) === getYear4(monthDate);
+var TasksMonthSelector = ({ tasks, year, currentDate, onClick }) => {
+  const { business } = useLayerContext();
+  const minDate = useMemo35(() => {
+    if (business) {
+      const date = getEarliestDateToBrowse(business);
+      if (date) {
+        return startOfMonth19(date);
+      }
+    }
+    return;
+  }, [business]);
+  const months = useMemo35(() => {
+    return Array.from({ length: 12 }, (_, i) => {
+      var _a;
+      const startDate = set(
+        /* @__PURE__ */ new Date(),
+        { year, month: i, date: 1, hours: 0, minutes: 0, seconds: 0, milliseconds: 0 }
+      );
+      const endDate = endOfMonth17(startDate);
+      const disabled = minDate && isBefore3(startDate, minDate) || isAfter3(startDate, startOfMonth19(/* @__PURE__ */ new Date()));
+      const taskData = (_a = tasks == null ? void 0 : tasks.find((x) => x.month === i && x.year === year)) != null ? _a : __spreadValues({
+        monthStr: format8(startDate, "MMM"),
+        year,
+        month: i,
+        startDate,
+        endDate
+      }, DEFAULT_TASK_DATA);
+      return __spreadValues({
+        monthStr: format8(startDate, "MMM"),
+        startDate,
+        endDate,
+        disabled
+      }, taskData);
+    });
+  }, [tasks, year, minDate]);
+  return /* @__PURE__ */ React217.createElement("div", { className: "Layer__tasks-month-selector" }, months.map((month, idx) => {
+    return /* @__PURE__ */ React217.createElement(
+      TaskMonthTile,
+      {
+        key: idx,
+        onClick,
+        monthData: month,
+        active: isCurrentMonth(month.startDate, currentDate),
+        disabled: month.disabled
+      }
+    );
+  }));
 };
 
 // src/components/Tasks/Tasks.tsx
-import classNames68 from "classnames";
+import classNames70 from "classnames";
+import { endOfYear as endOfYear6, getYear as getYear5, startOfYear as startOfYear5 } from "date-fns";
 var UseTasksContext = createContext20({
   data: void 0,
   isLoading: void 0,
@@ -18734,7 +19048,16 @@ var UseTasksContext = createContext20({
   },
   submitResponseToTask: () => {
   },
-  uploadDocumentForTask: () => {
+  uploadDocumentsForTask: () => Promise.resolve(),
+  deleteUploadsForTask: () => {
+  },
+  updateDocUploadTaskDescription: () => {
+  },
+  currentDate: /* @__PURE__ */ new Date(),
+  setCurrentDate: () => {
+  },
+  dateRange: { startDate: startOfYear5(/* @__PURE__ */ new Date()), endDate: endOfYear6(/* @__PURE__ */ new Date()) },
+  setDateRange: () => {
   }
 });
 var Tasks = ({
@@ -18745,7 +19068,7 @@ var Tasks = ({
   // deprecated
   stringOverrides
 }) => {
-  return /* @__PURE__ */ React216.createElement(TasksProvider, null, /* @__PURE__ */ React216.createElement(
+  return /* @__PURE__ */ React218.createElement(TasksProvider, null, /* @__PURE__ */ React218.createElement(
     TasksComponent,
     {
       collapsable,
@@ -18758,7 +19081,7 @@ var Tasks = ({
 };
 var TasksProvider = ({ children }) => {
   const contextData = useTasks();
-  return /* @__PURE__ */ React216.createElement(TasksContext.Provider, { value: contextData }, children);
+  return /* @__PURE__ */ React218.createElement(TasksContext.Provider, { value: contextData }, children);
 };
 var TasksComponent = ({
   collapsable = false,
@@ -18768,8 +19091,16 @@ var TasksComponent = ({
   // deprecated
   stringOverrides
 }) => {
-  const { isLoading, loadedStatus, data } = useContext47(TasksContext);
-  const allComplete = useMemo31(() => {
+  const {
+    isLoading,
+    loadedStatus,
+    data,
+    monthlyData,
+    currentDate,
+    setCurrentDate,
+    dateRange
+  } = useContext47(TasksContext);
+  const allComplete = useMemo36(() => {
     if (!data) {
       return void 0;
     }
@@ -18786,7 +19117,7 @@ var TasksComponent = ({
       setOpen(false);
     }
   }, [allComplete]);
-  return /* @__PURE__ */ React216.createElement("div", { className: "Layer__tasks-component" }, /* @__PURE__ */ React216.createElement(
+  return /* @__PURE__ */ React218.createElement("div", { className: "Layer__tasks-component" }, /* @__PURE__ */ React218.createElement(
     TasksHeader,
     {
       tasksHeader: (stringOverrides == null ? void 0 : stringOverrides.header) || tasksHeader,
@@ -18794,29 +19125,37 @@ var TasksComponent = ({
       open,
       toggleContent: () => setOpen(!open)
     }
-  ), /* @__PURE__ */ React216.createElement(
+  ), /* @__PURE__ */ React218.createElement(
     "div",
     {
-      className: classNames68(
+      className: classNames70(
         "Layer__tasks__content",
         !open && "Layer__tasks__content--collapsed"
       )
     },
-    isLoading || !data ? /* @__PURE__ */ React216.createElement("div", { className: "Layer__tasks__loader-container" }, /* @__PURE__ */ React216.createElement(Loader2, null)) : /* @__PURE__ */ React216.createElement(React216.Fragment, null, data.length > 0 && /* @__PURE__ */ React216.createElement(TasksPending, null), /* @__PURE__ */ React216.createElement(TasksList, null))
+    isLoading || !data ? /* @__PURE__ */ React218.createElement("div", { className: "Layer__tasks__loader-container" }, /* @__PURE__ */ React218.createElement(Loader2, null)) : /* @__PURE__ */ React218.createElement(React218.Fragment, null, /* @__PURE__ */ React218.createElement(
+      TasksMonthSelector,
+      {
+        tasks: monthlyData,
+        currentDate,
+        onClick: setCurrentDate,
+        year: getYear5(dateRange.startDate)
+      }
+    ), /* @__PURE__ */ React218.createElement(TasksPending, null), /* @__PURE__ */ React218.createElement(TasksList, null))
   ));
 };
 
 // src/components/PlatformOnboarding/LinkAccounts.tsx
-import React217, { useContext as useContext48, useMemo as useMemo32 } from "react";
+import React219, { useContext as useContext48, useMemo as useMemo37 } from "react";
 var LinkAccounts = (_a) => {
   var _b = _a, { inBox } = _b, props = __objRest(_b, ["inBox"]);
-  const content = useMemo32(() => {
+  const content = useMemo37(() => {
     if (inBox) {
-      return /* @__PURE__ */ React217.createElement("div", { className: "Layer__link-accounts__box" }, /* @__PURE__ */ React217.createElement(LinkAccountsContent, __spreadValues({}, props)));
+      return /* @__PURE__ */ React219.createElement("div", { className: "Layer__link-accounts__box" }, /* @__PURE__ */ React219.createElement(LinkAccountsContent, __spreadValues({}, props)));
     }
-    return /* @__PURE__ */ React217.createElement(LinkAccountsContent, __spreadValues({}, props));
+    return /* @__PURE__ */ React219.createElement(LinkAccountsContent, __spreadValues({}, props));
   }, [inBox, props]);
-  return /* @__PURE__ */ React217.createElement(LinkedAccountsProvider, null, content);
+  return /* @__PURE__ */ React219.createElement(LinkedAccountsProvider, null, content);
 };
 var LinkAccountsContent = ({
   title,
@@ -18831,7 +19170,7 @@ var LinkAccountsContent = ({
 }) => {
   var _a;
   const { data, loadingStatus, error, refetchAccounts, addConnection } = useContext48(LinkedAccountsContext);
-  return /* @__PURE__ */ React217.createElement("div", { className: "Layer__link-accounts Layer__component" }, title && /* @__PURE__ */ React217.createElement(Heading, { size: "view" /* view */ }, title), data && data.length === 0 ? /* @__PURE__ */ React217.createElement("div", { className: "Layer__link-accounts__data-status-container" }, !hideLoading && loadingStatus !== "complete" ? /* @__PURE__ */ React217.createElement(Loader2, null) : null, Boolean(error) && /* @__PURE__ */ React217.createElement(
+  return /* @__PURE__ */ React219.createElement("div", { className: "Layer__link-accounts Layer__component" }, title && /* @__PURE__ */ React219.createElement(Heading, { size: "view" /* view */ }, title), data && data.length === 0 ? /* @__PURE__ */ React219.createElement("div", { className: "Layer__link-accounts__data-status-container" }, !hideLoading && loadingStatus !== "complete" ? /* @__PURE__ */ React219.createElement(Loader2, null) : null, Boolean(error) && /* @__PURE__ */ React219.createElement(
     DataState,
     {
       status: "failed" /* failed */,
@@ -18839,7 +19178,7 @@ var LinkAccountsContent = ({
       description: "Please try again later",
       onRefresh: refetchAccounts
     }
-  )) : null, data && data.length > 0 ? /* @__PURE__ */ React217.createElement("div", { className: "Layer__link-accounts__list" }, data == null ? void 0 : data.map((account, index) => /* @__PURE__ */ React217.createElement(
+  )) : null, data && data.length > 0 ? /* @__PURE__ */ React219.createElement("div", { className: "Layer__link-accounts__list" }, data == null ? void 0 : data.map((account, index) => /* @__PURE__ */ React219.createElement(
     LinkedAccountItemThumb,
     {
       key: index,
@@ -18849,33 +19188,33 @@ var LinkAccountsContent = ({
       showBreakConnection,
       asWidget
     }
-  ))) : null, /* @__PURE__ */ React217.createElement(
+  ))) : null, /* @__PURE__ */ React219.createElement(
     ActionableRow,
     {
-      iconBox: /* @__PURE__ */ React217.createElement(PlaidIcon_default, null),
+      iconBox: /* @__PURE__ */ React219.createElement(PlaidIcon_default, null),
       title: data && data.length > 0 ? "Connect my next business account" : "Connect accounts",
       description: "Import data with one simple integration.",
-      button: /* @__PURE__ */ React217.createElement(
+      button: /* @__PURE__ */ React219.createElement(
         Button,
         {
           onClick: () => addConnection("PLAID"),
-          rightIcon: /* @__PURE__ */ React217.createElement(Link_default, { size: 12 }),
+          rightIcon: /* @__PURE__ */ React219.createElement(Link_default, { size: 12 }),
           disabled: loadingStatus !== "complete"
         },
         data && data.length > 0 ? "Connect next" : "Connect"
       )
     }
-  ), /* @__PURE__ */ React217.createElement(LinkedAccountsConfirmationModal, null), onBack || onNext ? /* @__PURE__ */ React217.createElement("div", { className: "Layer__link-accounts__footer" }, onBack && /* @__PURE__ */ React217.createElement(Button, { onClick: onBack, variant: "secondary" /* secondary */ }, (_a = stringOverrides == null ? void 0 : stringOverrides.backButtonText) != null ? _a : "Back"), onNext && /* @__PURE__ */ React217.createElement(Button, { onClick: onNext }, (stringOverrides == null ? void 0 : stringOverrides.nextButtonText) || "I\u2019m done connecting my business accounts")) : null);
+  ), /* @__PURE__ */ React219.createElement(LinkedAccountsConfirmationModal, null), onBack || onNext ? /* @__PURE__ */ React219.createElement("div", { className: "Layer__link-accounts__footer" }, onBack && /* @__PURE__ */ React219.createElement(Button, { onClick: onBack, variant: "secondary" /* secondary */ }, (_a = stringOverrides == null ? void 0 : stringOverrides.backButtonText) != null ? _a : "Back"), onNext && /* @__PURE__ */ React219.createElement(Button, { onClick: onNext }, (stringOverrides == null ? void 0 : stringOverrides.nextButtonText) || "I\u2019m done connecting my business accounts")) : null);
 };
 
 // src/components/UpsellBanner/BookkeepingUpsellBar.tsx
-import React219 from "react";
+import React221 from "react";
 
 // src/icons/Coffee.tsx
-import * as React218 from "react";
+import * as React220 from "react";
 var CoffeeIcon = (_a) => {
   var _b = _a, { size = 11 } = _b, props = __objRest(_b, ["size"]);
-  return /* @__PURE__ */ React218.createElement(
+  return /* @__PURE__ */ React220.createElement(
     "svg",
     __spreadProps(__spreadValues({
       xmlns: "http://www.w3.org/2000/svg",
@@ -18885,7 +19224,7 @@ var CoffeeIcon = (_a) => {
       width: size,
       height: size
     }),
-    /* @__PURE__ */ React218.createElement("g", { clipPath: "url(#clip0_5018_10141)" }, /* @__PURE__ */ React218.createElement(
+    /* @__PURE__ */ React220.createElement("g", { clipPath: "url(#clip0_5018_10141)" }, /* @__PURE__ */ React220.createElement(
       "path",
       {
         d: "M3.25 4.16666H2.79167C2.30544 4.16666 1.83912 4.35981 1.4953 4.70363C1.15149 5.04744 0.958333 5.51376 0.958333 5.99999C0.958333 6.48622 1.15149 6.95254 1.4953 7.29635C1.83912 7.64017 2.30544 7.83332 2.79167 7.83332H3.25",
@@ -18893,7 +19232,7 @@ var CoffeeIcon = (_a) => {
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
-    ), /* @__PURE__ */ React218.createElement(
+    ), /* @__PURE__ */ React220.createElement(
       "path",
       {
         d: "M10.5834 4.16666H3.25004V8.29166C3.25004 8.77789 3.4432 9.2442 3.78701 9.58802C4.13083 9.93184 4.59714 10.125 5.08337 10.125H8.75004C9.23627 10.125 9.70259 9.93184 10.0464 9.58802C10.3902 9.2442 10.5834 8.77789 10.5834 8.29166V4.16666Z",
@@ -18901,7 +19240,7 @@ var CoffeeIcon = (_a) => {
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
-    ), /* @__PURE__ */ React218.createElement(
+    ), /* @__PURE__ */ React220.createElement(
       "path",
       {
         d: "M8.75 0.958344V2.33334",
@@ -18909,7 +19248,7 @@ var CoffeeIcon = (_a) => {
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
-    ), /* @__PURE__ */ React218.createElement(
+    ), /* @__PURE__ */ React220.createElement(
       "path",
       {
         d: "M6.91663 0.958344V2.33334",
@@ -18917,7 +19256,7 @@ var CoffeeIcon = (_a) => {
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
-    ), /* @__PURE__ */ React218.createElement(
+    ), /* @__PURE__ */ React220.createElement(
       "path",
       {
         d: "M5.08337 0.958344V2.33334",
@@ -18926,7 +19265,7 @@ var CoffeeIcon = (_a) => {
         strokeLinejoin: "round"
       }
     )),
-    /* @__PURE__ */ React218.createElement("defs", null, /* @__PURE__ */ React218.createElement("clipPath", { id: "clip0_5018_10141" }, /* @__PURE__ */ React218.createElement(
+    /* @__PURE__ */ React220.createElement("defs", null, /* @__PURE__ */ React220.createElement("clipPath", { id: "clip0_5018_10141" }, /* @__PURE__ */ React220.createElement(
       "rect",
       {
         width: "11",
@@ -18944,30 +19283,30 @@ var BookkeepingUpsellBar = ({
   onClick,
   href
 }) => {
-  return /* @__PURE__ */ React219.createElement("div", { className: "Layer__bar-banner Layer__bar-banner--bookkeeping" }, /* @__PURE__ */ React219.createElement("div", { className: "Layer__bar-banner__left-col" }, /* @__PURE__ */ React219.createElement(IconBox, null, /* @__PURE__ */ React219.createElement(Coffee_default, null)), /* @__PURE__ */ React219.createElement("div", { className: "Layer__bar-banner__text-container" }, /* @__PURE__ */ React219.createElement(Text, { size: "md" /* md */, weight: "bold" /* bold */ }, "Need help with your books?"), /* @__PURE__ */ React219.createElement(
+  return /* @__PURE__ */ React221.createElement("div", { className: "Layer__bar-banner Layer__bar-banner--bookkeeping" }, /* @__PURE__ */ React221.createElement("div", { className: "Layer__bar-banner__left-col" }, /* @__PURE__ */ React221.createElement(IconBox, null, /* @__PURE__ */ React221.createElement(Coffee_default, null)), /* @__PURE__ */ React221.createElement("div", { className: "Layer__bar-banner__text-container" }, /* @__PURE__ */ React221.createElement(Text, { size: "md" /* md */, weight: "bold" /* bold */ }, "Need help with your books?"), /* @__PURE__ */ React221.createElement(
     Text,
     {
       size: "sm" /* sm */,
       className: "Layer__bar-banner__text-container__desc"
     },
     "Order bookkeeping service supported by real humans."
-  ))), onClick ? /* @__PURE__ */ React219.createElement(Button, { variant: "secondary" /* secondary */, onClick }, "Schedule a demo") : href ? /* @__PURE__ */ React219.createElement(Link2, { href, target: "_blank", variant: "secondary" /* secondary */ }, "Schedule a demo") : null);
+  ))), onClick ? /* @__PURE__ */ React221.createElement(Button, { variant: "secondary" /* secondary */, onClick }, "Schedule a demo") : href ? /* @__PURE__ */ React221.createElement(Link2, { href, target: "_blank", variant: "secondary" /* secondary */ }, "Schedule a demo") : null);
 };
 
 // src/views/BookkeepingOverview/BookkeepingOverview.tsx
-import React221, { useState as useState61 } from "react";
+import React223, { useState as useState61 } from "react";
 
 // src/views/BookkeepingOverview/internal/BookkeepingProfitAndLossSummariesContainer.tsx
-import React220 from "react";
+import React222 from "react";
 var CLASS_NAME7 = "Layer__BookkeepingProfitAndLossSummariesContainer";
 function BookkeepingProfitAndLossSummariesContainer({
   children
 }) {
-  return /* @__PURE__ */ React220.createElement("div", { className: CLASS_NAME7 }, children);
+  return /* @__PURE__ */ React222.createElement("div", { className: CLASS_NAME7 }, children);
 }
 
 // src/views/BookkeepingOverview/BookkeepingOverview.tsx
-import classNames69 from "classnames";
+import classNames71 from "classnames";
 var BookkeepingOverview = ({
   title,
   showTitle = true,
@@ -18978,16 +19317,16 @@ var BookkeepingOverview = ({
   const [pnlToggle, setPnlToggle] = useState61("expenses");
   const [width] = useWindowSize();
   const profitAndLossSummariesVariants = (_b = (_a = slotProps == null ? void 0 : slotProps.profitAndLoss) == null ? void 0 : _a.summaries) == null ? void 0 : _b.variants;
-  return /* @__PURE__ */ React221.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ React221.createElement(TasksProvider, null, /* @__PURE__ */ React221.createElement(
+  return /* @__PURE__ */ React223.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ React223.createElement(TasksProvider, null, /* @__PURE__ */ React223.createElement(
     View,
     {
       viewClassName: "Layer__bookkeeping-overview--view",
       title: (stringOverrides == null ? void 0 : stringOverrides.title) || title || "Bookkeeping overview",
       withSidebar: width > 1100,
-      sidebar: /* @__PURE__ */ React221.createElement(TasksComponent, { stringOverrides: stringOverrides == null ? void 0 : stringOverrides.tasks }),
+      sidebar: /* @__PURE__ */ React223.createElement(TasksComponent, { stringOverrides: stringOverrides == null ? void 0 : stringOverrides.tasks }),
       showHeader: showTitle
     },
-    width <= 1100 && /* @__PURE__ */ React221.createElement(
+    width <= 1100 && /* @__PURE__ */ React223.createElement(
       TasksComponent,
       {
         collapsable: true,
@@ -18995,30 +19334,30 @@ var BookkeepingOverview = ({
         stringOverrides: stringOverrides == null ? void 0 : stringOverrides.tasks
       }
     ),
-    /* @__PURE__ */ React221.createElement(
+    /* @__PURE__ */ React223.createElement(
       Container,
       {
         name: "bookkeeping-overview-profit-and-loss",
         asWidget: true,
         elevated: true
       },
-      /* @__PURE__ */ React221.createElement(
+      /* @__PURE__ */ React223.createElement(
         ProfitAndLoss.Header,
         {
           text: ((_c = stringOverrides == null ? void 0 : stringOverrides.profitAndLoss) == null ? void 0 : _c.header) || "Profit & Loss",
           withDatePicker: true
         }
       ),
-      /* @__PURE__ */ React221.createElement(BookkeepingProfitAndLossSummariesContainer, null, /* @__PURE__ */ React221.createElement(
+      /* @__PURE__ */ React223.createElement(BookkeepingProfitAndLossSummariesContainer, null, /* @__PURE__ */ React223.createElement(
         ProfitAndLoss.Summaries,
         {
           stringOverrides: (_d = stringOverrides == null ? void 0 : stringOverrides.profitAndLoss) == null ? void 0 : _d.summaries,
           variants: profitAndLossSummariesVariants
         }
       )),
-      /* @__PURE__ */ React221.createElement(ProfitAndLoss.Chart, null)
+      /* @__PURE__ */ React223.createElement(ProfitAndLoss.Chart, null)
     ),
-    /* @__PURE__ */ React221.createElement("div", { className: "Layer__bookkeeping-overview-profit-and-loss-charts" }, /* @__PURE__ */ React221.createElement(
+    /* @__PURE__ */ React223.createElement("div", { className: "Layer__bookkeeping-overview-profit-and-loss-charts" }, /* @__PURE__ */ React223.createElement(
       Toggle,
       {
         name: "pnl-detailed-charts",
@@ -19035,15 +19374,15 @@ var BookkeepingOverview = ({
         selected: pnlToggle,
         onChange: (e) => setPnlToggle(e.target.value)
       }
-    ), /* @__PURE__ */ React221.createElement(
+    ), /* @__PURE__ */ React223.createElement(
       Container,
       {
-        name: classNames69(
+        name: classNames71(
           "bookkeeping-overview-profit-and-loss-chart",
           pnlToggle !== "revenue" && "bookkeeping-overview-profit-and-loss-chart--hidden"
         )
       },
-      /* @__PURE__ */ React221.createElement(
+      /* @__PURE__ */ React223.createElement(
         ProfitAndLoss.DetailedCharts,
         {
           scope: "revenue",
@@ -19051,15 +19390,15 @@ var BookkeepingOverview = ({
           stringOverrides: (_e = stringOverrides == null ? void 0 : stringOverrides.profitAndLoss) == null ? void 0 : _e.detailedCharts
         }
       )
-    ), /* @__PURE__ */ React221.createElement(
+    ), /* @__PURE__ */ React223.createElement(
       Container,
       {
-        name: classNames69(
+        name: classNames71(
           "bookkeeping-overview-profit-and-loss-chart",
           pnlToggle !== "expenses" && "bookkeeping-overview-profit-and-loss-chart--hidden"
         )
       },
-      /* @__PURE__ */ React221.createElement(
+      /* @__PURE__ */ React223.createElement(
         ProfitAndLoss.DetailedCharts,
         {
           scope: "expenses",
@@ -19072,19 +19411,19 @@ var BookkeepingOverview = ({
 };
 
 // src/views/AccountingOverview/AccountingOverview.tsx
-import React224, { useState as useState63 } from "react";
+import React226, { useState as useState63 } from "react";
 
 // src/views/AccountingOverview/internal/TransactionsToReview.tsx
-import React223, { useContext as useContext49, useEffect as useEffect49, useState as useState62 } from "react";
+import React225, { useContext as useContext49, useEffect as useEffect49, useState as useState62 } from "react";
 
 // src/components/BadgeLoader/BadgeLoader.tsx
-import React222 from "react";
+import React224 from "react";
 var BadgeLoader = ({ children }) => {
-  return /* @__PURE__ */ React222.createElement("span", { className: "Layer__loader Layer__loader--as-badge" }, /* @__PURE__ */ React222.createElement(Loader_default, { size: 11, className: "Layer__anim--rotating" }), children);
+  return /* @__PURE__ */ React224.createElement("span", { className: "Layer__loader Layer__loader--as-badge" }, /* @__PURE__ */ React224.createElement(Loader_default, { size: 11, className: "Layer__anim--rotating" }), children);
 };
 
 // src/views/AccountingOverview/internal/TransactionsToReview.tsx
-import { getMonth as getMonth2, getYear as getYear2, startOfMonth as startOfMonth17 } from "date-fns";
+import { getMonth as getMonth4, getYear as getYear6, startOfMonth as startOfMonth20 } from "date-fns";
 var CLASS_NAME8 = "Layer__TransactionsToReview";
 function TransactionsToReview({
   onClick,
@@ -19097,7 +19436,7 @@ function TransactionsToReview({
   const dateRange = usePnlDateRange ? contextDateRange : void 0;
   const [toReview, setToReview] = useState62(0);
   const { data, loaded, error, refetch } = useProfitAndLossLTM({
-    currentDate: dateRange ? dateRange.startDate : startOfMonth17(/* @__PURE__ */ new Date()),
+    currentDate: dateRange ? dateRange.startDate : startOfMonth20(/* @__PURE__ */ new Date()),
     tagFilter
   });
   useEffect49(() => {
@@ -19109,7 +19448,7 @@ function TransactionsToReview({
   const checkTransactionsToReview = () => {
     if (data && dateRange) {
       const monthTx = data.filter(
-        (x) => x.month - 1 === getMonth2(dateRange.startDate) && x.year === getYear2(dateRange.startDate)
+        (x) => x.month - 1 === getMonth4(dateRange.startDate) && x.year === getYear6(dateRange.startDate)
       );
       if (monthTx.length > 0) {
         setToReview(monthTx[0].uncategorized_transactions);
@@ -19125,37 +19464,37 @@ function TransactionsToReview({
       verticalGap = "sm";
       break;
   }
-  return /* @__PURE__ */ React223.createElement("div", { onClick, className: CLASS_NAME8 }, /* @__PURE__ */ React223.createElement(VStack, { gap: verticalGap, align: "start" }, /* @__PURE__ */ React223.createElement(ProfitAndLossSummariesHeading, { variants }, "Transactions to review"), loaded === "initial" || loaded === "loading" ? /* @__PURE__ */ React223.createElement(BadgeLoader, null) : null, loaded === "complete" && error ? /* @__PURE__ */ React223.createElement(
+  return /* @__PURE__ */ React225.createElement("div", { onClick, className: CLASS_NAME8 }, /* @__PURE__ */ React225.createElement(VStack, { gap: verticalGap, align: "start" }, /* @__PURE__ */ React225.createElement(ProfitAndLossSummariesHeading, { variants }, "Transactions to review"), loaded === "initial" || loaded === "loading" ? /* @__PURE__ */ React225.createElement(BadgeLoader, null) : null, loaded === "complete" && error ? /* @__PURE__ */ React225.createElement(
     Badge,
     {
       variant: "error" /* ERROR */,
       size: "small" /* SMALL */,
-      icon: /* @__PURE__ */ React223.createElement(RefreshCcw_default, { size: 12 }),
+      icon: /* @__PURE__ */ React225.createElement(RefreshCcw_default, { size: 12 }),
       onClick: () => refetch()
     },
     "Refresh"
-  ) : null, loaded === "complete" && !error && toReview > 0 ? /* @__PURE__ */ React223.createElement(
+  ) : null, loaded === "complete" && !error && toReview > 0 ? /* @__PURE__ */ React225.createElement(
     Badge,
     {
       variant: "warning" /* WARNING */,
       size: "small" /* SMALL */,
-      icon: /* @__PURE__ */ React223.createElement(Bell_default, { size: 12 })
+      icon: /* @__PURE__ */ React225.createElement(Bell_default, { size: 12 })
     },
     toReview,
     " pending"
-  ) : null, loaded === "complete" && !error && toReview === 0 ? /* @__PURE__ */ React223.createElement(
+  ) : null, loaded === "complete" && !error && toReview === 0 ? /* @__PURE__ */ React225.createElement(
     Badge,
     {
       variant: "success" /* SUCCESS */,
       size: "small" /* SMALL */,
-      icon: /* @__PURE__ */ React223.createElement(Check_default, { size: 12 })
+      icon: /* @__PURE__ */ React225.createElement(Check_default, { size: 12 })
     },
     "All done"
-  ) : null), /* @__PURE__ */ React223.createElement(IconButton, { icon: /* @__PURE__ */ React223.createElement(ChevronRight_default, null), withBorder: true, onClick }));
+  ) : null), /* @__PURE__ */ React225.createElement(IconButton, { icon: /* @__PURE__ */ React225.createElement(ChevronRight_default, null), withBorder: true, onClick }));
 }
 
 // src/views/AccountingOverview/AccountingOverview.tsx
-import classNames70 from "classnames";
+import classNames72 from "classnames";
 var AccountingOverview = ({
   title = "Accounting overview",
   showTitle = true,
@@ -19172,34 +19511,34 @@ var AccountingOverview = ({
   var _a, _b, _c, _d, _e;
   const [pnlToggle, setPnlToggle] = useState63("expenses");
   const profitAndLossSummariesVariants = (_b = (_a = slotProps == null ? void 0 : slotProps.profitAndLoss) == null ? void 0 : _a.summaries) == null ? void 0 : _b.variants;
-  return /* @__PURE__ */ React224.createElement(
+  return /* @__PURE__ */ React226.createElement(
     ProfitAndLoss,
     {
       asContainer: false,
       tagFilter: tagFilter ? { key: tagFilter.tagKey, values: tagFilter.tagValues } : void 0
     },
-    /* @__PURE__ */ React224.createElement(
+    /* @__PURE__ */ React226.createElement(
       View,
       {
         title,
         showHeader: showTitle,
-        header: /* @__PURE__ */ React224.createElement(Header2, null, /* @__PURE__ */ React224.createElement(HeaderRow, null, /* @__PURE__ */ React224.createElement(HeaderCol, null, /* @__PURE__ */ React224.createElement(ProfitAndLoss.DatePicker, null))))
+        header: /* @__PURE__ */ React226.createElement(Header2, null, /* @__PURE__ */ React226.createElement(HeaderRow, null, /* @__PURE__ */ React226.createElement(HeaderCol, null, /* @__PURE__ */ React226.createElement(ProfitAndLoss.DatePicker, null))))
       },
-      enableOnboarding && /* @__PURE__ */ React224.createElement(
+      enableOnboarding && /* @__PURE__ */ React226.createElement(
         Onboarding,
         {
           onTransactionsToReviewClick,
           onboardingStepOverride
         }
       ),
-      /* @__PURE__ */ React224.createElement(
+      /* @__PURE__ */ React226.createElement(
         Internal_ProfitAndLossSummaries,
         {
           stringOverrides: (_c = stringOverrides == null ? void 0 : stringOverrides.profitAndLoss) == null ? void 0 : _c.summaries,
           chartColorsList,
           slots: {
             unstable_AdditionalListItems: showTransactionsToReview ? [
-              /* @__PURE__ */ React224.createElement(
+              /* @__PURE__ */ React226.createElement(
                 TransactionsToReview,
                 {
                   key: "transactions-to-review",
@@ -19213,28 +19552,28 @@ var AccountingOverview = ({
           variants: profitAndLossSummariesVariants
         }
       ),
-      /* @__PURE__ */ React224.createElement(
+      /* @__PURE__ */ React226.createElement(
         Container,
         {
           name: "accounting-overview-profit-and-loss",
           asWidget: true,
           elevated: true
         },
-        /* @__PURE__ */ React224.createElement(
+        /* @__PURE__ */ React226.createElement(
           ProfitAndLoss.Header,
           {
             text: (stringOverrides == null ? void 0 : stringOverrides.header) || "Profit & Loss"
           }
         ),
-        /* @__PURE__ */ React224.createElement(
+        /* @__PURE__ */ React226.createElement(
           ProfitAndLoss.Chart,
           {
             tagFilter: tagFilter ? { key: tagFilter.tagKey, values: tagFilter.tagValues } : void 0
           }
         )
       ),
-      middleBanner && /* @__PURE__ */ React224.createElement(Container, { name: "accounting-overview-middle-banner" }, middleBanner),
-      /* @__PURE__ */ React224.createElement("div", { className: "Layer__accounting-overview-profit-and-loss-charts" }, /* @__PURE__ */ React224.createElement(
+      middleBanner && /* @__PURE__ */ React226.createElement(Container, { name: "accounting-overview-middle-banner" }, middleBanner),
+      /* @__PURE__ */ React226.createElement("div", { className: "Layer__accounting-overview-profit-and-loss-charts" }, /* @__PURE__ */ React226.createElement(
         Toggle,
         {
           name: "pnl-detailed-charts",
@@ -19251,15 +19590,15 @@ var AccountingOverview = ({
           selected: pnlToggle,
           onChange: (e) => setPnlToggle(e.target.value)
         }
-      ), /* @__PURE__ */ React224.createElement(
+      ), /* @__PURE__ */ React226.createElement(
         Container,
         {
-          name: classNames70(
+          name: classNames72(
             "accounting-overview-profit-and-loss-chart",
             pnlToggle !== "revenue" && "accounting-overview-profit-and-loss-chart--hidden"
           )
         },
-        /* @__PURE__ */ React224.createElement(
+        /* @__PURE__ */ React226.createElement(
           ProfitAndLoss.DetailedCharts,
           {
             scope: "revenue",
@@ -19268,15 +19607,15 @@ var AccountingOverview = ({
             chartColorsList
           }
         )
-      ), /* @__PURE__ */ React224.createElement(
+      ), /* @__PURE__ */ React226.createElement(
         Container,
         {
-          name: classNames70(
+          name: classNames72(
             "accounting-overview-profit-and-loss-chart",
             pnlToggle !== "expenses" && "accounting-overview-profit-and-loss-chart--hidden"
           )
         },
-        /* @__PURE__ */ React224.createElement(
+        /* @__PURE__ */ React226.createElement(
           ProfitAndLoss.DetailedCharts,
           {
             scope: "expenses",
@@ -19291,7 +19630,7 @@ var AccountingOverview = ({
 };
 
 // src/views/BankTransactionsWithLinkedAccounts/BankTransactionsWithLinkedAccounts.tsx
-import React225 from "react";
+import React227 from "react";
 var BankTransactionsWithLinkedAccounts = ({
   title,
   // deprecated
@@ -19307,13 +19646,13 @@ var BankTransactionsWithLinkedAccounts = ({
   mobileComponent,
   stringOverrides
 }) => {
-  return /* @__PURE__ */ React225.createElement(
+  return /* @__PURE__ */ React227.createElement(
     View,
     {
       title: (stringOverrides == null ? void 0 : stringOverrides.title) || title || "Bank transactions",
       showHeader: showTitle
     },
-    /* @__PURE__ */ React225.createElement(
+    /* @__PURE__ */ React227.createElement(
       LinkedAccounts,
       {
         elevated: elevatedLinkedAccounts,
@@ -19323,7 +19662,7 @@ var BankTransactionsWithLinkedAccounts = ({
         stringOverrides: stringOverrides == null ? void 0 : stringOverrides.linkedAccounts
       }
     ),
-    /* @__PURE__ */ React225.createElement(
+    /* @__PURE__ */ React227.createElement(
       BankTransactions,
       {
         asWidget: true,
@@ -19339,7 +19678,7 @@ var BankTransactionsWithLinkedAccounts = ({
 };
 
 // src/views/GeneralLedger/GeneralLedger.tsx
-import React226, { useState as useState64 } from "react";
+import React228, { useState as useState64 } from "react";
 var GeneralLedgerView = ({
   title,
   // deprecated
@@ -19348,13 +19687,13 @@ var GeneralLedgerView = ({
   chartOfAccountsOptions
 }) => {
   const [activeTab, setActiveTab] = useState64("chartOfAccounts");
-  return /* @__PURE__ */ React226.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ React226.createElement(
+  return /* @__PURE__ */ React228.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ React228.createElement(
     View,
     {
       title: (stringOverrides == null ? void 0 : stringOverrides.title) || title || "General Ledger",
       showHeader: showTitle
     },
-    /* @__PURE__ */ React226.createElement(
+    /* @__PURE__ */ React228.createElement(
       Toggle,
       {
         name: "general-ledger-tabs",
@@ -19372,7 +19711,7 @@ var GeneralLedgerView = ({
         onChange: (opt) => setActiveTab(opt.target.value)
       }
     ),
-    activeTab === "chartOfAccounts" ? /* @__PURE__ */ React226.createElement(
+    activeTab === "chartOfAccounts" ? /* @__PURE__ */ React228.createElement(
       ChartOfAccounts,
       {
         asWidget: true,
@@ -19381,12 +19720,12 @@ var GeneralLedgerView = ({
         templateAccountsEditable: chartOfAccountsOptions == null ? void 0 : chartOfAccountsOptions.templateAccountsEditable,
         showReversalEntries: chartOfAccountsOptions == null ? void 0 : chartOfAccountsOptions.showReversalEntries
       }
-    ) : /* @__PURE__ */ React226.createElement(Journal, { stringOverrides: stringOverrides == null ? void 0 : stringOverrides.journal })
+    ) : /* @__PURE__ */ React228.createElement(Journal, { stringOverrides: stringOverrides == null ? void 0 : stringOverrides.journal })
   ));
 };
 
 // src/views/ProjectProfitability/ProjectProfitability.tsx
-import React227, { useState as useState65 } from "react";
+import React229, { useState as useState65 } from "react";
 import Select4 from "react-select";
 var ProjectProfitabilityView = ({
   valueOptions,
@@ -19411,14 +19750,14 @@ var ProjectProfitabilityView = ({
       values: tagFilter2.tagValues
     } : void 0;
   };
-  return /* @__PURE__ */ React227.createElement(
+  return /* @__PURE__ */ React229.createElement(
     View,
     {
       title: (stringOverrides == null ? void 0 : stringOverrides.title) || "",
       showHeader: showTitle,
       viewClassName: "Layer__project-view"
     },
-    /* @__PURE__ */ React227.createElement("div", { className: "Layer__component Layer__header__actions" }, /* @__PURE__ */ React227.createElement("div", { className: "Layer__component" }, /* @__PURE__ */ React227.createElement(
+    /* @__PURE__ */ React229.createElement("div", { className: "Layer__component Layer__header__actions" }, /* @__PURE__ */ React229.createElement("div", { className: "Layer__component" }, /* @__PURE__ */ React229.createElement(
       Toggle,
       {
         name: "project-tabs",
@@ -19439,7 +19778,7 @@ var ProjectProfitabilityView = ({
         selected: activeTab,
         onChange: (opt) => setActiveTab(opt.target.value)
       }
-    )), /* @__PURE__ */ React227.createElement(
+    )), /* @__PURE__ */ React229.createElement(
       Select4,
       {
         className: "Layer__category-menu Layer__select",
@@ -19457,7 +19796,7 @@ var ProjectProfitabilityView = ({
         }
       }
     )),
-    /* @__PURE__ */ React227.createElement(Container, { name: "project" }, /* @__PURE__ */ React227.createElement(React227.Fragment, null, activeTab === "overview" && /* @__PURE__ */ React227.createElement(
+    /* @__PURE__ */ React229.createElement(Container, { name: "project" }, /* @__PURE__ */ React229.createElement(React229.Fragment, null, activeTab === "overview" && /* @__PURE__ */ React229.createElement(
       AccountingOverview,
       {
         stringOverrides: { header: "Project Overview" },
@@ -19467,7 +19806,7 @@ var ProjectProfitabilityView = ({
         showTransactionsToReview: false,
         showTitle: false
       }
-    ), activeTab === "transactions" && /* @__PURE__ */ React227.createElement(
+    ), activeTab === "transactions" && /* @__PURE__ */ React229.createElement(
       BankTransactions,
       {
         hideHeader: true,
@@ -19476,7 +19815,7 @@ var ProjectProfitabilityView = ({
           tagFilter: tagFilter != null ? tagFilter : void 0
         }
       }
-    ), activeTab === "report" && /* @__PURE__ */ React227.createElement(ProfitAndLoss, { asContainer: false, tagFilter: pnlTagFilter }, /* @__PURE__ */ React227.createElement(
+    ), activeTab === "report" && /* @__PURE__ */ React229.createElement(ProfitAndLoss, { asContainer: false, tagFilter: pnlTagFilter }, /* @__PURE__ */ React229.createElement(
       ProfitAndLoss.Report,
       {
         stringOverrides,
@@ -19488,7 +19827,7 @@ var ProjectProfitabilityView = ({
 };
 
 // src/views/Reports/Reports.tsx
-import React228, { useState as useState66 } from "react";
+import React230, { useState as useState66 } from "react";
 var getOptions = (enabledReports) => {
   return [
     enabledReports.includes("profitAndLoss") ? {
@@ -19519,13 +19858,13 @@ var Reports = ({
   const { view, containerRef } = useElementViewSize();
   const options = getOptions(enabledReports);
   const defaultTitle = enabledReports.length > 1 ? "Reports" : (_a = options.find((option) => option.value = enabledReports[0])) == null ? void 0 : _a.label;
-  return /* @__PURE__ */ React228.createElement(
+  return /* @__PURE__ */ React230.createElement(
     View,
     {
       title: (stringOverrides == null ? void 0 : stringOverrides.title) || title || defaultTitle,
       showHeader: showTitle
     },
-    enabledReports.length > 1 && /* @__PURE__ */ React228.createElement("div", { className: "Layer__component Layer__header__actions" }, /* @__PURE__ */ React228.createElement(
+    enabledReports.length > 1 && /* @__PURE__ */ React230.createElement("div", { className: "Layer__component Layer__header__actions" }, /* @__PURE__ */ React230.createElement(
       Toggle,
       {
         name: "reports-tabs",
@@ -19534,7 +19873,7 @@ var Reports = ({
         onChange: (opt) => setActiveTab(opt.target.value)
       }
     )),
-    /* @__PURE__ */ React228.createElement(Container, { name: "reports", ref: containerRef }, /* @__PURE__ */ React228.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ React228.createElement(
+    /* @__PURE__ */ React230.createElement(Container, { name: "reports", ref: containerRef }, /* @__PURE__ */ React230.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ React230.createElement(
       ReportsPanel,
       {
         containerRef,
@@ -19557,7 +19896,7 @@ var ReportsPanel = ({
   statementOfCashFlowConfig,
   view
 }) => {
-  return /* @__PURE__ */ React228.createElement(React228.Fragment, null, openReport === "profitAndLoss" && /* @__PURE__ */ React228.createElement(
+  return /* @__PURE__ */ React230.createElement(React230.Fragment, null, openReport === "profitAndLoss" && /* @__PURE__ */ React230.createElement(
     ProfitAndLoss.Report,
     __spreadValues({
       stringOverrides,
@@ -19565,7 +19904,7 @@ var ReportsPanel = ({
       parentRef: containerRef,
       view
     }, profitAndLossConfig)
-  ), openReport === "balanceSheet" && /* @__PURE__ */ React228.createElement(BalanceSheet, { stringOverrides: stringOverrides == null ? void 0 : stringOverrides.balanceSheet }), openReport === "statementOfCashFlow" && /* @__PURE__ */ React228.createElement(
+  ), openReport === "balanceSheet" && /* @__PURE__ */ React230.createElement(BalanceSheet, { stringOverrides: stringOverrides == null ? void 0 : stringOverrides.balanceSheet }), openReport === "statementOfCashFlow" && /* @__PURE__ */ React230.createElement(
     StatementOfCashFlow,
     __spreadValues({
       stringOverrides: stringOverrides == null ? void 0 : stringOverrides.statementOfCashflow
@@ -19574,11 +19913,11 @@ var ReportsPanel = ({
 };
 
 // src/components/ProfitAndLossView/ProfitAndLossView.tsx
-import React229, { useContext as useContext50, useRef as useRef23 } from "react";
+import React231, { useContext as useContext50, useRef as useRef23 } from "react";
 var COMPONENT_NAME7 = "profit-and-loss";
 var ProfitAndLossView = (props) => {
   const containerRef = useRef23(null);
-  return /* @__PURE__ */ React229.createElement(Container, { name: COMPONENT_NAME7, ref: containerRef }, /* @__PURE__ */ React229.createElement(ProfitAndLoss, null, /* @__PURE__ */ React229.createElement(ProfitAndLossPanel, __spreadValues({ containerRef }, props))));
+  return /* @__PURE__ */ React231.createElement(Container, { name: COMPONENT_NAME7, ref: containerRef }, /* @__PURE__ */ React231.createElement(ProfitAndLoss, null, /* @__PURE__ */ React231.createElement(ProfitAndLossPanel, __spreadValues({ containerRef }, props))));
 };
 var ProfitAndLossPanel = (_a) => {
   var _b = _a, {
@@ -19589,10 +19928,10 @@ var ProfitAndLossPanel = (_a) => {
     "stringOverrides"
   ]);
   const { sidebarScope } = useContext50(ProfitAndLoss.Context);
-  return /* @__PURE__ */ React229.createElement(
+  return /* @__PURE__ */ React231.createElement(
     Panel,
     {
-      sidebar: /* @__PURE__ */ React229.createElement(
+      sidebar: /* @__PURE__ */ React231.createElement(
         ProfitAndLossDetailedCharts,
         {
           stringOverrides: stringOverrides == null ? void 0 : stringOverrides.profitAndLossDetailedCharts
@@ -19601,7 +19940,7 @@ var ProfitAndLossPanel = (_a) => {
       sidebarIsOpen: Boolean(sidebarScope),
       parentRef: containerRef
     },
-    /* @__PURE__ */ React229.createElement(
+    /* @__PURE__ */ React231.createElement(
       ProfitAndLoss.Header,
       {
         text: (stringOverrides == null ? void 0 : stringOverrides.header) || "Profit & Loss",
@@ -19609,7 +19948,7 @@ var ProfitAndLossPanel = (_a) => {
         headingClassName: "Layer__profit-and-loss__title"
       }
     ),
-    /* @__PURE__ */ React229.createElement(Components, __spreadValues({ stringOverrides }, props))
+    /* @__PURE__ */ React231.createElement(Components, __spreadValues({ stringOverrides }, props))
   );
 };
 var Components = ({
@@ -19621,7 +19960,7 @@ var Components = ({
     ProfitAndLoss.Context
   );
   if (!isLoading && error) {
-    return /* @__PURE__ */ React229.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ React229.createElement(
+    return /* @__PURE__ */ React231.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ React231.createElement(
       DataState,
       {
         status: "failed" /* failed */,
@@ -19632,26 +19971,26 @@ var Components = ({
       }
     ));
   }
-  return /* @__PURE__ */ React229.createElement(React229.Fragment, null, !hideChart && /* @__PURE__ */ React229.createElement("div", { className: `Layer__${COMPONENT_NAME7}__chart_with_summaries` }, /* @__PURE__ */ React229.createElement(
+  return /* @__PURE__ */ React231.createElement(React231.Fragment, null, !hideChart && /* @__PURE__ */ React231.createElement("div", { className: `Layer__${COMPONENT_NAME7}__chart_with_summaries` }, /* @__PURE__ */ React231.createElement(
     "div",
     {
       className: `Layer__${COMPONENT_NAME7}__chart_with_summaries__summary-col`
     },
-    /* @__PURE__ */ React229.createElement(ProfitAndLoss.DatePicker, null),
-    /* @__PURE__ */ React229.createElement(
+    /* @__PURE__ */ React231.createElement(ProfitAndLoss.DatePicker, null),
+    /* @__PURE__ */ React231.createElement(
       ProfitAndLoss.Summaries,
       {
         actionable: true,
         stringOverrides: stringOverrides == null ? void 0 : stringOverrides.profitAndLossSummaries
       }
     )
-  ), /* @__PURE__ */ React229.createElement(
+  ), /* @__PURE__ */ React231.createElement(
     "div",
     {
       className: `Layer__${COMPONENT_NAME7}__chart_with_summaries__chart-col`
     },
-    /* @__PURE__ */ React229.createElement(ProfitAndLoss.Chart, null)
-  )), !hideTable && /* @__PURE__ */ React229.createElement(
+    /* @__PURE__ */ React231.createElement(ProfitAndLoss.Chart, null)
+  )), !hideTable && /* @__PURE__ */ React231.createElement(
     ProfitAndLoss.Table,
     {
       stringOverrides: stringOverrides == null ? void 0 : stringOverrides.profitAndLossTable