@zeniai/web-components 3.16.50 → 3.16.52

package/dist/AgingReportsPage-DJMmT7Xn.js

@@ -0,0 +1,827 @@
+import { j as t, A as re, u as H, k as se, b as ie, f as Ne } from "./vendor-.pnpm-BZbZ6JJC.js";
+import { useState as k, useCallback as N, useEffect as U, useMemo as be } from "react";
+import f from "@emotion/styled";
+import { dateNow as E, toCOABalanceTimeframe as Re } from "@zeniai/client-epic-state";
+import { u as R, a as y, R as _, S as A, D as p, a5 as ee, p as je, _ as Pe, x as ve, jj as Te, eT as ke, aE as Oe, aL as F, P as $e, f as Ie, g as Me } from "./index-Bove2J7o.js";
+import { B as Ye } from "./BusyIndication-C0DNfQlA.js";
+import { Z as Be } from "./ZeniDatePicker-D0CxiVfS.js";
+import { f as ze } from "./zeniDatePicker.helpers-CQENqyun.js";
+import { g as I } from "./getReferrerType-DjPOy76W.js";
+import { A as Le, a as Ee } from "./ArAgingChart-CPs_hBl5.js";
+import { N as le } from "./NoDataChart-BqHCJbkE.js";
+import { u as O, C as ce } from "./CollapsableReportTable-BiTfvads.js";
+import { N as de } from "./NoDataTable-CLpVffwh.js";
+import { m as ge } from "./mapSpacerToTreeNode-DbgbUCkC.js";
+import { c as Fe } from "./agingReportHelper-ovKP-qSS.js";
+const qe = {
+  chartHeight: new _(288, 360)
+}, me = f.div`
+  display: flex;
+`, pe = f.div`
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  height: ${(e) => qe.chartHeight.valuePx(e.windowSize)};
+  padding-bottom: ${A.sp6};
+`;
+function We({
+  report: e
+}) {
+  return e.reportId === "accounts_payable_aging" ? /* @__PURE__ */ t.jsx(He, { report: e }) : /* @__PURE__ */ t.jsx(Ue, { report: e });
+}
+function He({ report: e }) {
+  const a = R();
+  return e.agingBalances.length === 0 ? /* @__PURE__ */ t.jsx(me, { children: /* @__PURE__ */ t.jsx(
+    le,
+    {
+      title: y.getLocalizedStrings().chartCard.no_data_available
+    }
+  ) }) : /* @__PURE__ */ t.jsx(pe, { windowSize: a, children: /* @__PURE__ */ t.jsx(re, { children: ({ height: r, width: i }) => /* @__PURE__ */ t.jsx(
+    Le,
+    {
+      isDetailPage: !0,
+      report: e,
+      width: i,
+      height: r
+    }
+  ) }) });
+}
+function Ue({ report: e }) {
+  const a = R();
+  return e.agingBalances.length === 0 ? /* @__PURE__ */ t.jsx(me, { children: /* @__PURE__ */ t.jsx(
+    le,
+    {
+      title: y.getLocalizedStrings().chartCard.no_data_available
+    }
+  ) }) : /* @__PURE__ */ t.jsx(pe, { windowSize: a, children: /* @__PURE__ */ t.jsx(re, { children: ({ height: r, width: i }) => /* @__PURE__ */ t.jsx(
+    Ee,
+    {
+      isDetailPage: !0,
+      report: e,
+      width: i,
+      height: r
+    }
+  ) }) });
+}
+function Ke({
+  nestedCustomer: e,
+  numOfBalances: a,
+  title: o,
+  config: r,
+  parentNodeIDs: i,
+  ancestorMetadata: n
+}) {
+  return {
+    children: [],
+    id: O("ac_subentity_total", i),
+    isLastNode: !1,
+    reportElementData: {
+      element: {
+        kind: "ac_subentity_total",
+        title: o,
+        data: e,
+        numOfBalances: a,
+        metadata: n
+      },
+      config: r
+    }
+  };
+}
+function ue({
+  agingBalances: e,
+  numOfBalances: a,
+  title: o,
+  isLastNode: r,
+  config: i,
+  parentNodeIDs: n,
+  ancestorMetadata: c
+}) {
+  const l = O("aging_report_row", [], o), s = {
+    children: [],
+    id: l,
+    isLastNode: r,
+    reportElementData: {
+      element: {
+        kind: "aging_report_row",
+        title: o,
+        data: e,
+        numOfBalances: a,
+        metadata: c
+      },
+      config: i
+    }
+  }, u = e.children.map((m, d) => ue({
+    agingBalances: m,
+    numOfBalances: a,
+    title: m.customer.name,
+    config: i,
+    isLastNode: d === e.children.length - 1,
+    parentNodeIDs: [...n, l],
+    ancestorMetadata: {
+      vendorOrCustomerAncestorMetadata: [
+        ...c.vendorOrCustomerAncestorMetadata,
+        {
+          depth: m.id.length - 1,
+          hasSibling: e.children.length > 1,
+          hasChildren: m.children.length > 0,
+          isLastNode: d === e.children.length - 1,
+          name: m.customer.name
+        }
+      ]
+    }
+  }));
+  return s.children.push(...u), e.children.length > 0 && s.children.push(
+    Ke({
+      config: i,
+      nestedCustomer: e,
+      numOfBalances: a,
+      title: e.customer.name,
+      parentNodeIDs: n,
+      ancestorMetadata: c
+    })
+  ), s;
+}
+function Ge({
+  agingBalances: e,
+  numOfBalances: a,
+  title: o,
+  isLastNode: r,
+  config: i
+}) {
+  const n = O("aging_report_row", [], o);
+  return {
+    children: [],
+    id: n,
+    isLastNode: r,
+    reportElementData: {
+      element: {
+        kind: "aging_report_row",
+        title: o,
+        data: e,
+        numOfBalances: a
+      },
+      config: i
+    }
+  };
+}
+function K({
+  agingPeriods: e,
+  config: a,
+  nodeId: o
+}) {
+  return {
+    children: [],
+    id: o ?? O("timeframe_header", []),
+    isLastNode: !1,
+    reportElementData: {
+      element: {
+        kind: "timeframe_headers",
+        title: "",
+        data: e,
+        numOfBalances: e.length
+      },
+      config: a
+    }
+  };
+}
+function he({
+  title: e,
+  balances: a,
+  config: o,
+  numOfBalances: r,
+  nodeId: i
+}) {
+  return {
+    children: [],
+    id: i ?? O("total", []),
+    isLastNode: !1,
+    reportElementData: {
+      element: {
+        kind: "total",
+        title: e,
+        numOfBalances: r,
+        data: a
+      },
+      config: o
+    }
+  };
+}
+const Je = (e, a, o = !0) => {
+  const { agingPeriods: r, totalBalances: i, agingBalances: n } = e, c = r.length, l = K({
+    agingPeriods: r,
+    config: a
+  }), s = [];
+  s.push(l);
+  const u = n.map((d, g) => Ge({
+    agingBalances: d,
+    title: d.vendor.name,
+    numOfBalances: c,
+    isLastNode: g === n.length - 1,
+    config: a
+  }));
+  s.push(...u);
+  const m = he({
+    title: y.getLocalizedStrings().chartCard.total,
+    balances: i,
+    config: a,
+    numOfBalances: c
+  });
+  return s.push(m), [...Array(1)].forEach((d, g) => {
+    s.push(
+      ge({
+        title: `${g}+${y.getLocalizedStrings().common.loading}`,
+        balances: [],
+        config: a
+      })
+    );
+  }), {
+    config: a,
+    headerNodes: o ? [l] : [],
+    contentNodes: s
+  };
+}, Ze = (e, a, o = !0) => {
+  const { agingPeriods: r, totalBalances: i, agingBalances: n } = e, c = r.length, l = K({
+    agingPeriods: r,
+    config: a
+  }), s = [];
+  s.push(l);
+  const u = n.map((d, g) => ue({
+    agingBalances: d,
+    title: d.customer.name,
+    numOfBalances: c,
+    isLastNode: g === n.length - 1,
+    config: a,
+    parentNodeIDs: [],
+    ancestorMetadata: {
+      vendorOrCustomerAncestorMetadata: [
+        {
+          depth: 0,
+          hasSibling: n.length > 1,
+          hasChildren: d.children.length > 0,
+          isLastNode: g === n.length - 1
+        }
+      ]
+    }
+  }));
+  s.push(...u);
+  const m = he({
+    title: y.getLocalizedStrings().chartCard.total,
+    balances: i,
+    config: a,
+    numOfBalances: c
+  });
+  return s.push(m), [...Array(1)].forEach((d, g) => {
+    s.push(
+      ge({
+        title: `${g}+${y.getLocalizedStrings().common.loading}`,
+        balances: [],
+        config: a
+      })
+    );
+  }), {
+    config: a,
+    headerNodes: o ? [l] : [],
+    contentNodes: s
+  };
+};
+function fe(e, a, o, r = !0) {
+  Object.assign(e.config, a);
+  const { agingPeriods: i } = o, n = K({
+    agingPeriods: i,
+    config: a
+  });
+  return {
+    config: a,
+    headerNodes: r ? [n] : [],
+    contentNodes: [n, ...e.contentNodes.slice(1)]
+  };
+}
+const b = {
+  contentPaddingLeft: new _(p[0], p[0], p[0]),
+  contentPaddingRight: new _(p[3], p[3], p[8]),
+  wrapperPadding: new _(p[3], p[3], p[8])
+}, M = f.div`
+  display: flex;
+  position: sticky;
+  justify-content: center;
+  padding-top: ${(e) => b.wrapperPadding.valuePx(e.windowSize)};
+  padding-left: ${(e) => b.wrapperPadding.valuePx(e.windowSize)};
+  background-color: ${(e) => e.theme.colors.grey4};
+`, xe = f.div`
+  width: 100%;
+  height: calc(100vh - ${A.sp11});
+`;
+function Qe({
+  report: e,
+  onSortOrderChange: a,
+  onEntityNameClick: o,
+  onNodeCollapseToggled: r
+}) {
+  return e.reportId === "accounts_payable_aging" ? /* @__PURE__ */ t.jsx(
+    Ve,
+    {
+      report: e,
+      onSortOrderChange: a,
+      onEntityNameClick: o
+    }
+  ) : /* @__PURE__ */ t.jsx(
+    Xe,
+    {
+      report: e,
+      onSortOrderChange: a,
+      onEntityNameClick: o,
+      onNodeCollapseToggled: r
+    }
+  );
+}
+function Ve({
+  report: e,
+  onSortOrderChange: a,
+  onEntityNameClick: o
+}) {
+  const [r, i] = k(
+    void 0
+  ), [n, c] = k(
+    void 0
+  ), l = R(), s = H(), u = !(l === "small" || l === "medium-compact"), m = N(
+    (d, g) => {
+      a(d, g);
+    },
+    [a]
+  );
+  return U(() => {
+    const d = {
+      reportId: e.reportId,
+      mode: "none",
+      displayOrder: "ascending_date",
+      reportFormat: "more_detailed",
+      bookCloseDate: e.bookCloseDate,
+      firstMonthOfFY: e.firstMonthOfFY,
+      filterAccountsWithNilBalances: "off",
+      filterAccountGroupsWithNilBalances: "off",
+      dataAvailable: e.dataAvailable,
+      showNegativeAmountInParenthesis: !0,
+      agingReportConfig: {
+        sortKey: e.apAgingUIState.sortKey,
+        sortOrder: e.apAgingUIState.sortOrder,
+        onSortOrderChanged: m,
+        onEntityNameClick: o
+      }
+    };
+    if (n == null || !se(r, e)) {
+      const g = Je(
+        e,
+        d,
+        u
+      );
+      i(e), c(g);
+    } else {
+      const g = fe(
+        n,
+        d,
+        e,
+        u
+      );
+      c(g);
+    }
+  }, [e, m]), e.agingBalances.length === 0 ? /* @__PURE__ */ t.jsx(M, { windowSize: l, children: /* @__PURE__ */ t.jsx(de, {}) }) : n != null ? /* @__PURE__ */ t.jsx(M, { windowSize: l, children: /* @__PURE__ */ t.jsx(xe, { numOfRows: e.agingBalances.length, children: /* @__PURE__ */ t.jsx(
+    ce,
+    {
+      backgroundColor: new ie(s.colors.grey4),
+      rootNodes: n,
+      type: "name+balances_actual",
+      isSticky: {
+        isStickyHeader: u,
+        isStickyName: u
+      },
+      treeNodePadding: {
+        left: b.contentPaddingLeft.value(l),
+        right: b.contentPaddingRight.value(l)
+      },
+      nodeOpenStatus: {},
+      compareMode: "compare_mode_amount"
+    }
+  ) }) }) : null;
+}
+function Xe({
+  report: e,
+  onSortOrderChange: a,
+  onEntityNameClick: o,
+  onNodeCollapseToggled: r
+}) {
+  const [i, n] = k(
+    void 0
+  ), [c, l] = k(
+    void 0
+  ), s = R(), u = H(), m = !(s === "small" || s === "medium-compact"), d = N(
+    (g, S) => {
+      a(g, S);
+    },
+    [a]
+  );
+  return U(() => {
+    const g = {
+      reportId: e.reportId,
+      mode: "none",
+      displayOrder: "ascending_date",
+      reportFormat: "more_detailed",
+      bookCloseDate: e.bookCloseDate,
+      firstMonthOfFY: e.firstMonthOfFY,
+      filterAccountsWithNilBalances: "off",
+      filterAccountGroupsWithNilBalances: "off",
+      dataAvailable: e.dataAvailable,
+      showNegativeAmountInParenthesis: !0,
+      agingReportConfig: {
+        sortKey: e.arAgingUIState.sortKey,
+        sortOrder: e.arAgingUIState.sortOrder,
+        onSortOrderChanged: d,
+        onEntityNameClick: o
+      }
+    };
+    if (c == null || !se(i, e)) {
+      const S = Ze(
+        e,
+        g,
+        m
+      );
+      n(e), l(S);
+    } else {
+      const S = fe(
+        c,
+        g,
+        e,
+        m
+      );
+      l(S);
+    }
+  }, [e, d]), e.agingBalances.length === 0 ? /* @__PURE__ */ t.jsx(M, { windowSize: s, children: /* @__PURE__ */ t.jsx(de, {}) }) : c != null ? /* @__PURE__ */ t.jsx(M, { windowSize: s, children: /* @__PURE__ */ t.jsx(xe, { numOfRows: e.agingBalances.length, children: /* @__PURE__ */ t.jsx(
+    ce,
+    {
+      backgroundColor: new ie(u.colors.grey4),
+      rootNodes: c,
+      type: "name+balances_actual",
+      isSticky: {
+        isStickyHeader: m,
+        isStickyName: m
+      },
+      treeNodePadding: {
+        left: b.contentPaddingLeft.value(s),
+        right: b.contentPaddingRight.value(s)
+      },
+      nodeOpenStatus: e.arAgingUIState.nodeCollapseState,
+      onNodeCollapseToggled: r,
+      compareMode: "compare_mode_amount"
+    }
+  ) }) }) : null;
+}
+const et = {
+  summaryColumnGap: new _(p[2], p[1], p[1], p[2], p[6])
+}, tt = f.div`
+  display: flex;
+  width: 100%;
+  justify-content: space-between;
+  align-items: center;
+  overflow: auto;
+  column-gap: ${(e) => et.summaryColumnGap.valuePx(e.windowSize)};
+`, te = f.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+`, ae = f(je)`
+  color: ${(e) => e.theme.colors.grey1};
+  text-wrap: nowrap;
+  width: fit-content;
+`, ne = f(Pe)`
+  color: ${(e) => e.theme.colors.primary};
+`;
+function at({
+  totalBalances: e,
+  reportId: a
+}) {
+  const o = be(() => Fe(e), [e]), r = R();
+  return /* @__PURE__ */ t.jsxs(tt, { windowSize: r, children: [
+    e.map((i) => {
+      const { period: n } = i;
+      return /* @__PURE__ */ t.jsxs(te, { children: [
+        /* @__PURE__ */ t.jsx(ae, { children: y.getLocalizedStrings().reports.aging.duration[n] }),
+        /* @__PURE__ */ t.jsx(ne, { children: ee("0,0", i?.balance) })
+      ] }, n);
+    }),
+    /* @__PURE__ */ t.jsxs(te, { children: [
+      /* @__PURE__ */ t.jsx(ae, { children: a === "accounts_payable_aging" ? y.getLocalizedStrings().reports.aging.apAging.totalPayable : y.getLocalizedStrings().reports.aging.arAging.totalReceivable }),
+      /* @__PURE__ */ t.jsx(ne, { children: ee("0,0", o?.balance) })
+    ] })
+  ] });
+}
+const W = {
+  wrapperPadding: new _(p[3], p[3], p[8]),
+  navbarMarginBottom: new _(p[7], p[4])
+}, {
+  download: q,
+  dateFormat: D,
+  reports: { common: nt, aging: T }
+} = y.getLocalizedStrings();
+function jt(e) {
+  const a = H(), [o, r] = k(!1), i = R(), {
+    report: n,
+    uiState: c,
+    downloadParams: l,
+    analytics: s,
+    onSelectedDateChanged: u,
+    onBackClick: m,
+    onSearchTextChange: d,
+    onReloadReport: g,
+    onSortOrderChange: S,
+    onEntityNameClick: ye,
+    updateDownloadStateHandler: Y,
+    onNodeCollapseToggled: we
+  } = e, { fetchState: j, reportTitle: Se, reportId: x } = n, {
+    searchString: P,
+    downloadState: $,
+    sortKey: B,
+    sortOrder: z,
+    selectedDate: w,
+    agingDateSelectionType: G
+  } = c, { authParams: J, downloadEndPoint: Z, timezone: Q } = l, V = N(
+    (h, C) => {
+      const v = oe(C);
+      u(h, v), s.trackAgingReportDateChange(
+        I(x),
+        w != null ? w.format(D.analytics.YYYYDashMMDashDDFormat) : E().format(D.analytics.YYYYDashMMDashDDFormat),
+        h.format(D.analytics.YYYYDashMMDashDDFormat),
+        v
+      );
+    },
+    [s, u, x, w]
+  ), X = N(
+    (h) => {
+      const C = ze({
+        options: T.preComputedDurationOptions.map(({ label: L, value: Ae }) => ({
+          label: L,
+          value: Re(Ae)
+        })).filter(({ value: L }) => L != null),
+        selectedDate: h
+      }), v = oe(C);
+      u(h, v), s.trackAgingReportDateChange(
+        I(x),
+        w != null ? w.format(D.analytics.YYYYDashMMDashDDFormat) : E().format(D.analytics.YYYYDashMMDashDDFormat),
+        h.format(D.analytics.YYYYDashMMDashDDFormat),
+        v
+      );
+    },
+    [s, u, x, w]
+  ), Ce = N(
+    (h, C) => {
+      S(h, C), s.trackAgingReportSortChange(
+        I(x),
+        C,
+        h
+      );
+    },
+    [s, S, x]
+  ), De = N(() => /* @__PURE__ */ t.jsx(
+    Be,
+    {
+      maxDate: E(),
+      selectedDate: { date: w },
+      precomputedOptionsProperties: {
+        preComputedOptionSelected: mt(
+          G
+        ),
+        preComputedOptionDateFormat: D.visual.MMMDCommaYYYYformat,
+        preComputedOptions: T.preComputedDurationOptions,
+        onPreComputedOptionSelected: V
+      },
+      onSelectedDateChanged: X
+    }
+  ), [
+    w,
+    V,
+    X,
+    G
+  ]);
+  if (U(() => {
+    async function h() {
+      const C = {
+        companyName: l.companyName,
+        searchString: P,
+        sortKey: B,
+        sortOrder: z,
+        statementFileType: "excel",
+        timezone: Q,
+        reportId: x === "accounts_receivable_aging" ? "accounts_receivable_aging" : "accounts_payable_aging",
+        reportDate: w
+      };
+      await ot(Z, J, C), Y("Completed"), s.trackAgingReportDownloadClick(
+        I(x),
+        B,
+        z
+      );
+    }
+    o && $ !== "In-Progress" && (r(!1), Y("In-Progress"), h());
+  }, [
+    J,
+    Z,
+    l.companyName,
+    $,
+    o,
+    x,
+    P,
+    B,
+    z,
+    Y,
+    w,
+    s,
+    Q
+  ]), j === "Error")
+    return /* @__PURE__ */ t.jsxs(st, { children: [
+      /* @__PURE__ */ t.jsx(it, { onClick: g, children: /* @__PURE__ */ t.jsx(ve, {}) }),
+      /* @__PURE__ */ t.jsx(lt, { children: nt.failed })
+    ] });
+  const _e = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+    /* @__PURE__ */ t.jsx(
+      Te,
+      {
+        isSearchOpen: (P?.length ?? 0) > 0,
+        searchPlaceHolder: x === "accounts_payable_aging" ? T.apAging.searchPlaceholder : T.arAging.searchPlaceholder,
+        searchText: P ?? "",
+        onSearchTextChanged: (h) => {
+          d(h);
+        },
+        downloadPresent: !0
+      }
+    ),
+    /* @__PURE__ */ t.jsx(
+      ke,
+      {
+        downloadReportOptions: {
+          type: "simple_menu",
+          downloadMenu: {
+            simpleMenuItems: [
+              {
+                type: "excel",
+                isDisabled: !1,
+                isDownloading: $ === "In-Progress"
+              }
+            ],
+            onDownloadClick: async (h) => {
+              if (h === "excel")
+                if ($ === "In-Progress") {
+                  console.log("Download is already in progress!");
+                  return;
+                } else
+                  r(!0);
+            }
+          }
+        }
+      }
+    )
+  ] });
+  return /* @__PURE__ */ t.jsxs(ct, { children: [
+    /* @__PURE__ */ t.jsx(
+      Oe,
+      {
+        title: Se,
+        subTitle: De(),
+        backgroundColor: a.colors.grey5,
+        onBackClick: m,
+        rightSideComponent: _e,
+        downloadPresent: !0,
+        style: {
+          marginBottom: W.navbarMarginBottom.valuePx(i)
+        },
+        source: "AgingReportsPage"
+      }
+    ),
+    /* @__PURE__ */ t.jsx(
+      F,
+      {
+        controller: j === "In-Progress" || j === "Not-Started",
+        children: /* @__PURE__ */ t.jsx(Ye, { fetchState: j })
+      }
+    ),
+    /* @__PURE__ */ t.jsxs(F, { controller: j === "Completed", children: [
+      /* @__PURE__ */ t.jsx(F, { controller: P.length === 0, children: /* @__PURE__ */ t.jsxs(gt, { windowSize: i, children: [
+        /* @__PURE__ */ t.jsx(dt, { children: /* @__PURE__ */ t.jsx(
+          at,
+          {
+            reportId: x === "accounts_payable_aging" ? "accounts_payable_aging" : "accounts_receivable_aging",
+            totalBalances: n.totalBalances
+          }
+        ) }),
+        /* @__PURE__ */ t.jsx(We, { report: n })
+      ] }) }),
+      /* @__PURE__ */ t.jsx(
+        Qe,
+        {
+          report: n,
+          onSortOrderChange: Ce,
+          onEntityNameClick: ye,
+          onNodeCollapseToggled: we
+        }
+      )
+    ] })
+  ] });
+}
+async function ot(e, a, o) {
+  const r = `${e}?query=${encodeURIComponent(
+    JSON.stringify(rt(o))
+  )}`, i = T.arAging;
+  try {
+    const n = await Ie({
+      urlEndPoint: r,
+      authParams: a,
+      fileType: "excel"
+    });
+    if (n.ok) {
+      const c = Me(
+        n.headers,
+        q.defaultFileName
+      ), l = await n.arrayBuffer();
+      Ne(l, c);
+    } else
+      console.error(
+        `${q.errorMessages.fileDownloadError.replace(
+          "__feature__",
+          i.arAging
+        )} ${n.statusText}`
+      );
+  } catch (n) {
+    console.error(
+      `${q.errorMessages.fileDownloadError.replace(
+        "__feature__",
+        i.arAging
+      )} ${JSON.stringify(n)}`
+    );
+  }
+}
+function rt(e) {
+  return {
+    statement_file_type: e.statementFileType,
+    search_string: e.searchString,
+    report_id: e.reportId,
+    company_name: e.companyName,
+    locale_id: y.getAppLocaleID(),
+    sort_key: e.sortKey,
+    sort_order: e.sortOrder,
+    report_date: e.reportDate,
+    timezone: e.timezone
+  };
+}
+const st = f.div`
+  display: flex;
+  width: 100%;
+  height: calc(100% - 60px);
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+`, it = f.div`
+  height: 96px;
+  width: 96px;
+  background: ${(e) => e.theme.colors.background};
+  border-radius: 50%;
+  cursor: pointer;
+  & svg {
+    margin: ${A.sp5};
+    color: ${(e) => e.theme.colors.grey1};
+  }
+  &:hover {
+    & svg {
+      color: ${(e) => e.theme.colors.primary};
+    }
+  }
+`, lt = f($e)`
+  margin-top: ${A.sp3};
+  color: ${(e) => e.theme.colors.hero};
+`, ct = f.div`
+  display: flex;
+  flex: 1 1 auto;
+  height: 100vh;
+  flex-direction: column;
+  width: 100%;
+  background-color: ${(e) => e.theme.colors.grey5};
+  padding: ${A.sp0};
+  gap: 2px;
+`, dt = f.div`
+  margin-bottom: ${A.sp6};
+`, gt = f.div`
+  position: relative;
+  box-shadow: ${(e) => `2px 2px ${A.sp1} ${e.theme.colors.dropShadowNormal}`};
+  background-color: ${(e) => e.theme.colors.grey5};
+  padding-left: ${(e) => W.wrapperPadding.valuePx(e.windowSize)};
+  padding-right: ${(e) => W.wrapperPadding.valuePx(e.windowSize)};
+`, mt = (e) => {
+  switch (e) {
+    case "last_month":
+      return "month";
+    case "last_quarter":
+      return "quarter";
+    default:
+      return;
+  }
+}, oe = (e) => e === "month" ? "last_month" : e === "quarter" ? "last_quarter" : "custom_date";
+export {
+  jt as default,
+  rt as toDownloadAgingReportOptionsPayload
+};