@zeniai/web-components 3.16.99 → 3.17.2

package/dist/EntitySummarySection-CynVpbx5.js

@@ -1,530 +0,0 @@
-import { j as t, A as V, V as I } from "./vendor-.pnpm-B2klaOGU.js";
-import { useCallback as T, useRef as K, forwardRef as U, useMemo as B } from "react";
-import o from "@emotion/styled";
-import { R as i, a as P, u as b, F as Y, aa as F, S as d, ab as G, D as n, gg as A, fq as O, a2 as j, C as D, o as L, aL as S, H as q, E as J, w as Q } from "./index-CD9fwr4J.js";
-import { c as X } from "./agingReportHelper-ovKP-qSS.js";
-const u = P.getLocalizedStrings().reports.aging.agingDetail.header, m = [
-  {
-    key: "date",
-    value: u.date,
-    sortOrder: "ascending",
-    width: new i(212, 212)
-  },
-  {
-    key: "invoiceNumber",
-    value: u.invoiceNumber,
-    sortOrder: "ascending",
-    width: new i(188, 188)
-  },
-  {
-    key: "dueDate",
-    value: u.dueDate,
-    sortOrder: "ascending",
-    width: new i(188, 188)
-  },
-  {
-    key: "daysPastDue",
-    value: u.daysPastDue,
-    sortOrder: "ascending",
-    width: new i(188, 188)
-  },
-  {
-    key: "amount",
-    value: u.amount,
-    sortOrder: "ascending",
-    width: new i(188, 188)
-  },
-  {
-    key: "balance",
-    value: u.balance,
-    sortOrder: "ascending",
-    width: new i(120, 120)
-  }
-], M = {
-  headerLastColumnTopPadding: new i(n[0], n[4]),
-  headerLastColumnRightPadding: new i(n[3], n[8]),
-  headerLastColumnBottomPadding: new i(n[0], n[4]),
-  headerLastColumnLeftPadding: new i(n[3], n[8]),
-  containerMarginLeft: new i(n[0], n[8]),
-  containerMarginRight: new i(n[0], n[8]),
-  headerHeight: new i(45, 58)
-}, Z = o.div`
-  top: ${d.sp0};
-  left: ${d.sp0};
-  min-height: ${(e) => M.headerHeight.valuePx(e.windowSize)};
-  max-height: ${(e) => M.headerHeight.valuePx(e.windowSize)};
-  width: fit-content;
-  min-width: 100%;
-  z-index: 2;
-  display: flex;
-  align-items: center;
-  box-sizing: border-box;
-  background-color: ${(e) => e.theme.colors.grey4};
-  position: sticky;
-`, ee = o.div`
-  color: ${(e) => e.sortDataValue === e.actualDataValue ? e.theme.colors.primary : e.theme.colors.grey1};
-
-  width: ${(e) => e.windowSize !== "extra-large" ? e.wrapperWidth.valuePx(e.windowSize) : e.wrapperWidth.valuePercentage(e.windowSize)};
-  max-width: ${(e) => e.windowSize !== "extra-large" ? e.wrapperWidth.valuePx(e.windowSize) : e.wrapperWidth.valuePercentage(e.windowSize)};
-  padding-left: ${d.sp0};
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  left: ${d.sp0};
-  justify-content: flex-start;
-  position: static;
-  z-index: 0;
-  box-sizing: border-box;
-`, te = o(G)`
-  width: 12px;
-  height: 12px;
-`, ne = o.div`
-  display: flex;
-  align-items: center;
-  transform: ${(e) => e.sortConfig.sortOrder === "descending" ? "rotate(180deg)" : "rotate(0deg)"};
-  ${(e) => e.sortConfig.sortOrder === "ascending" ? "padding-top: 2px" : "padding-bottom: 2px"};
-`, ie = o.div`
-  display: ${(e) => e.isVisible ? "flex" : "none"};
-  align-items: center;
-  padding-top: 2px;
-  cursor: pointer;
-  &:hover {
-    color: ${(e) => e.theme.colors.primary};
-  }
-`, oe = o.div`
-  display: flex;
-  cursor: pointer;
-  gap: 6px;
-  &:hover {
-    color: ${(e) => e.theme.colors.primary};
-  }
-`;
-function re({
-  sortConfig: e,
-  onColumnSortConfigChanged: l
-}) {
-  const c = b(), a = T(
-    (r, s) => {
-      let g = s;
-      e.sortKey === r && (g = e.sortOrder === "ascending" ? "descending" : "ascending"), l(r, g);
-    },
-    [l, e]
-  );
-  return /* @__PURE__ */ t.jsx(Z, { windowSize: c, children: m.map((r) => /* @__PURE__ */ t.jsxs(
-    ee,
-    {
-      sortDataValue: e.sortKey,
-      actualDataValue: r.key,
-      wrapperWidth: r.width,
-      windowSize: c,
-      children: [
-        /* @__PURE__ */ t.jsxs(
-          oe,
-          {
-            onClick: () => a(r.key, r.sortOrder),
-            children: [
-              /* @__PURE__ */ t.jsx(Y, { children: r.value }),
-              /* @__PURE__ */ t.jsx(ne, { sortConfig: e, children: /* @__PURE__ */ t.jsx(F, { width: 12, height: 12 }) })
-            ]
-          }
-        ),
-        /* @__PURE__ */ t.jsx(
-          ie,
-          {
-            isVisible: e.sortKey === r.key && e.sortKey !== "date",
-            children: /* @__PURE__ */ t.jsx(
-              te,
-              {
-                onClick: () => l("date", "ascending")
-              }
-            )
-          }
-        )
-      ]
-    },
-    r.key
-  )) });
-}
-const $ = {
-  containerPaddingLeft: new i(n[3], n[4]),
-  containerPaddingRight: new i(n[3], n[4]),
-  containerPaddingTop: new i(n[3], n[3]),
-  containerPaddingBottom: new i(n[3], n[3]),
-  containerMarginLeft: new i(n[4], n[8]),
-  nameLogoWidth: new i(n[4], n[4]),
-  nameLogoHeight: new i(n[4], n[4]),
-  nameWidth: new i(150, 150)
-}, ae = o.div`
-  display: flex;
-  flex-direction: column;
-  row-gap: ${d.sp2};
-`, se = o.div`
-  display: flex;
-  background-color: ${(e) => e.theme.colors.grey5};
-  box-sizing: border-box;
-  align-items: center;
-  padding-top: ${(e) => $.containerPaddingTop.valuePx(e.windowSize)};
-  padding-bottom: ${(e) => $.containerPaddingBottom.valuePx(e.windowSize)};
-  border: ${(e) => `1px solid ${e.theme.colors.grey3}`};
-  box-shadow: ${(e) => e.theme.mode === "dark" ? `${D.dropShadowNormalDark} ${d.sp0} 2px ${d.sp1}` : `${d.sp0} 2px ${d.sp1} ${D.dropShadowNormalLight}`};
-  border-radius: ${d.sp2};
-  cursor: pointer;
-  &:hover {
-    border-color: ${(e) => e.theme.colors.primary};
-    div {
-      color: ${(e) => e.theme.colors.primary};
-    }
-    .entity-icon {
-      color: ${(e) => e.theme.colors.grey5};
-    }
-  }
-`, w = o.div`
-  display: flex;
-  align-items: center;
-  width: ${(e) => e.windowSize !== "extra-large" ? e.itemWidth.valuePx(e.windowSize) : e.itemWidth.valuePercentage(e.windowSize)};
-  :last-of-type {
-    padding-right: 0;
-  }
-`, de = o(Y)`
-  color: ${(e) => e.theme.colors.grey1};
-`, y = o(L)`
-  color: ${(e) => e.theme.colors.hero};
-`, le = o(L)`
-  color: ${(e) => e.theme.colors.hero};
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  max-width: ${(e) => $.nameWidth.valuePx(e.windowSize)};
-`, ce = o.div`
-  display: flex;
-  padding-left: ${d.sp3};
-  align-items: center;
-  justify-content: center;
-  column-gap: ${d.sp2};
-`;
-function ge({
-  invoice: e,
-  entityLogo: l,
-  onTransactionClick: c
-}) {
-  const a = b(), { common: r, dateFormat: s } = P.getLocalizedStrings();
-  return /* @__PURE__ */ t.jsxs(ae, { windowSize: a, children: [
-    /* @__PURE__ */ t.jsx(de, { children: e.date.format(s.visual.MMMDCommaYYYYformat) }),
-    /* @__PURE__ */ t.jsxs(
-      se,
-      {
-        onClick: () => {
-          c(e);
-        },
-        windowSize: a,
-        children: [
-          /* @__PURE__ */ t.jsx(
-            w,
-            {
-              windowSize: a,
-              itemWidth: m[0].width,
-              children: /* @__PURE__ */ t.jsxs(ce, { children: [
-                l != null ? /* @__PURE__ */ t.jsx(
-                  A,
-                  {
-                    photoUrl: l.toString(),
-                    styles: {
-                      width: $.nameLogoWidth.valuePx(a),
-                      height: $.nameLogoHeight.valuePx(a)
-                    }
-                  }
-                ) : /* @__PURE__ */ t.jsx(O, { name: e.entity.name, size: d.sp4 }),
-                /* @__PURE__ */ t.jsx(le, { windowSize: a, title: e.entity.name, children: e.entity.name })
-              ] })
-            }
-          ),
-          /* @__PURE__ */ t.jsx(
-            w,
-            {
-              windowSize: a,
-              itemWidth: m[1].width,
-              children: /* @__PURE__ */ t.jsx(y, { children: e.invoiceNumber ?? r.strings.hyphen })
-            }
-          ),
-          /* @__PURE__ */ t.jsx(
-            w,
-            {
-              windowSize: a,
-              itemWidth: m[2].width,
-              children: /* @__PURE__ */ t.jsx(y, { children: e.dueDate != null ? e.dueDate.format(s.visual.MMMDCommaYYYYformat) : r.strings.hyphen })
-            }
-          ),
-          /* @__PURE__ */ t.jsx(
-            w,
-            {
-              windowSize: a,
-              itemWidth: m[3].width,
-              children: /* @__PURE__ */ t.jsx(y, { children: e.daysPastDue ?? r.strings.hyphen })
-            }
-          ),
-          /* @__PURE__ */ t.jsx(
-            w,
-            {
-              windowSize: a,
-              itemWidth: m[4].width,
-              children: /* @__PURE__ */ t.jsx(y, { children: j("0,0", e.amount) })
-            }
-          ),
-          /* @__PURE__ */ t.jsx(
-            w,
-            {
-              windowSize: a,
-              itemWidth: m[5].width,
-              children: /* @__PURE__ */ t.jsx(y, { children: j("0,0", e.balance) })
-            }
-          )
-        ]
-      }
-    )
-  ] });
-}
-const he = {
-  wrapperContainerMarginTop: new i(n[4], n[0]),
-  wrapperContaineHorizontalrMargin: new i(n[0], n[8]),
-  itemHeight: new i(103, 103)
-}, me = o.div`
-  position: relative;
-  width: auto;
-  height: 100%;
-`, ue = o.div`
-  top: ${d.sp0};
-  left: ${d.sp0};
-  padding-bottom: ${d.sp3};
-  box-sizing: border-box;
-`, we = o.div``, E = U(
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  (e, l) => {
-    const {
-      children: c,
-      style: a,
-      sortConfig: r,
-      onColumnSortConfigChanged: s,
-      onUpdateCurrentYTDSelection: g,
-      selectedYTDSpendOption: f,
-      fetchState: v,
-      ...p
-    } = e;
-    return /* @__PURE__ */ t.jsxs(
-      we,
-      {
-        ref: l,
-        style: {
-          ...a,
-          width: "auto"
-        },
-        ...p,
-        children: [
-          /* @__PURE__ */ t.jsx(
-            re,
-            {
-              onColumnSortConfigChanged: s,
-              sortConfig: r
-            }
-          ),
-          /* @__PURE__ */ t.jsx(me, { children: c })
-        ]
-      }
-    );
-  }
-);
-E.displayName = "Aging invoices list view inner element type";
-const pe = ({
-  index: e,
-  style: l,
-  invoices: c,
-  entityLogo: a,
-  onTransactionClick: r
-}) => {
-  const s = c[e];
-  return e < c.length ? /* @__PURE__ */ t.jsx(
-    ue,
-    {
-      style: {
-        ...l,
-        width: "fit-content",
-        minWidth: "100%"
-      },
-      children: /* @__PURE__ */ t.jsx(
-        ge,
-        {
-          onTransactionClick: r,
-          invoice: s,
-          entityLogo: a
-        }
-      )
-    }
-  ) : null;
-};
-function Le({
-  uiState: e,
-  invoices: l,
-  entityLogo: c,
-  onColumnSortConfigChanged: a,
-  onTransactionClick: r
-}) {
-  const s = K(null), g = b(), f = T(() => he.itemHeight.value(g), [g]);
-  return /* @__PURE__ */ t.jsx(V, { children: ({ height: v, width: p }) => /* @__PURE__ */ t.jsx(
-    I,
-    {
-      height: v,
-      width: p,
-      ref: s,
-      overscanCount: 1,
-      itemCount: l.length,
-      innerElementType: (x) => /* @__PURE__ */ t.jsx(
-        E,
-        {
-          ...x,
-          onColumnSortConfigChanged: a,
-          sortConfig: {
-            sortKey: e.sortKey,
-            sortOrder: e.sortOrder
-          }
-        }
-      ),
-      itemSize: f,
-      style: { willChange: "auto" },
-      children: (x) => /* @__PURE__ */ t.jsx(
-        pe,
-        {
-          ...x,
-          invoices: l,
-          entityLogo: c,
-          onTransactionClick: r
-        }
-      )
-    }
-  ) });
-}
-const h = {
-  containerHorizontalPadding: new i(n[2], n[8]),
-  nameLogoWidth: new i(n[5], n[5]),
-  nameLogoHeight: new i(n[5], n[5]),
-  nameLogoMarginTop: new i(n[1], n[1]),
-  entityContainerWidth: new i(300, 350, 350, 350, 400),
-  summaryColumnGap: new i(n[2], n[1], n[1], n[2], n[6])
-}, xe = o.div`
-  background: ${(e) => e.theme.colors.grey5};
-  padding-left: ${(e) => h.containerHorizontalPadding.valuePx(e.windowSize)};
-  padding-right: ${(e) => h.containerHorizontalPadding.valuePx(e.windowSize)};
-  padding-bottom: ${d.sp4};
-  display: flex;
-  justify-content: space-between;
-  align-items: ${(e) => e.isLargeScreen === !0 ? "center" : "flex-start"};
-  flex-direction: ${(e) => e.isLargeScreen === !0 ? "row" : "column"};
-  border-bottom: 1px solid ${(e) => e.theme.colors.grey3};
-  row-gap: ${d.sp3};
-`, ye = o.div`
-  display: flex;
-  align-items: flex-start;
-  column-gap: ${d.sp3};
-  max-width: ${(e) => h.entityContainerWidth.valuePx(e.windowSize)};
-`, $e = o.div`
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  column-gap: ${(e) => h.summaryColumnGap.valuePx(e.windowSize)};
-  width: ${(e) => e.isLargeScreen === !0 ? "unset" : "100%"};
-  overflow: auto;
-`, fe = o.div`
-  display: flex;
-  flex-direction: column;
-`, R = o(J)`
-  color: ${(e) => e.theme.colors.hero};
-`, ve = o.div`
-  margin-top: ${(e) => h.nameLogoMarginTop.valuePx(e.windowSize)};
-`, k = o.div`
-  display: flex;
-  flex-direction: column;
-`, H = o(Q)`
-  text-align: right;
-  color: ${(e) => e.theme.colors.primary};
-`, C = o(L)`
-  color: ${(e) => e.theme.colors.hero};
-  text-wrap: nowrap;
-  width: fit-content;
-`, Se = o(q)`
-  color: ${(e) => e.theme.colors.primary};
-`;
-function We({
-  totalBalances: e,
-  entityName: l,
-  reportId: c,
-  reportDate: a,
-  entityLogo: r
-}) {
-  const s = b(), g = s === "large" || s === "extra-large", {
-    reports: {
-      aging: { duration: f, apAgingDetail: v, arAgingDetail: p, apAging: x, arAging: _ }
-    },
-    dateFormat: W
-  } = P.getLocalizedStrings(), N = B(() => X(e), [e]);
-  return /* @__PURE__ */ t.jsxs(xe, { isLargeScreen: g, windowSize: s, children: [
-    /* @__PURE__ */ t.jsxs(ye, { windowSize: s, children: [
-      r != null ? /* @__PURE__ */ t.jsx(
-        A,
-        {
-          photoUrl: r.toString(),
-          styles: {
-            width: h.nameLogoWidth.valuePx(s),
-            height: h.nameLogoHeight.valuePx(s),
-            marginTop: h.nameLogoMarginTop.valuePx(s)
-          }
-        }
-      ) : /* @__PURE__ */ t.jsx(ve, { windowSize: s, children: /* @__PURE__ */ t.jsx(O, { name: l, size: d.sp5 }) }),
-      /* @__PURE__ */ t.jsxs(fe, { children: [
-        /* @__PURE__ */ t.jsx(Se, { children: l }),
-        /* @__PURE__ */ t.jsx(
-          S,
-          {
-            controller: c === "accounts_payable_aging",
-            children: /* @__PURE__ */ t.jsx(R, { children: `${v.dateLabel} ${a.format(
-              W.visual.MMMDCommaYYYYformat
-            )}` })
-          }
-        ),
-        /* @__PURE__ */ t.jsx(
-          S,
-          {
-            controller: c === "accounts_receivable_aging",
-            children: /* @__PURE__ */ t.jsx(R, { children: `${p.dateLabel} ${a.format(
-              W.visual.MMMDCommaYYYYformat
-            )}` })
-          }
-        )
-      ] })
-    ] }),
-    /* @__PURE__ */ t.jsxs($e, { isLargeScreen: g, windowSize: s, children: [
-      e.map((z) => /* @__PURE__ */ t.jsxs(k, { children: [
-        /* @__PURE__ */ t.jsx(C, { children: f[z.period] }),
-        /* @__PURE__ */ t.jsx(H, { children: j("0,0", z?.balance) })
-      ] }, z.period)),
-      /* @__PURE__ */ t.jsxs(k, { children: [
-        /* @__PURE__ */ t.jsx(
-          S,
-          {
-            controller: c === "accounts_payable_aging",
-            children: /* @__PURE__ */ t.jsx(C, { children: x.totalPayable })
-          }
-        ),
-        /* @__PURE__ */ t.jsx(
-          S,
-          {
-            controller: c === "accounts_receivable_aging",
-            children: /* @__PURE__ */ t.jsx(C, { children: _.totalReceivable })
-          }
-        ),
-        /* @__PURE__ */ t.jsx(H, { children: j("0,0", N?.balance) })
-      ] })
-    ] })
-  ] });
-}
-export {
-  Le as A,
-  We as E
-};

package/dist/EntitySummarySection-kTytfD8-.cjs

@@ -1,149 +0,0 @@
-"use strict";const n=require("./vendor-.pnpm-D0ILHvHB.cjs"),w=require("react"),i=require("@emotion/styled"),e=require("./index-CZKgJQb3.cjs"),W=require("./agingReportHelper-BX2km1yO.cjs"),x=e.appLocale.getLocalizedStrings().reports.aging.agingDetail.header,c=[{key:"date",value:x.date,sortOrder:"ascending",width:new e.ResponsiveSized(212,212)},{key:"invoiceNumber",value:x.invoiceNumber,sortOrder:"ascending",width:new e.ResponsiveSized(188,188)},{key:"dueDate",value:x.dueDate,sortOrder:"ascending",width:new e.ResponsiveSized(188,188)},{key:"daysPastDue",value:x.daysPastDue,sortOrder:"ascending",width:new e.ResponsiveSized(188,188)},{key:"amount",value:x.amount,sortOrder:"ascending",width:new e.ResponsiveSized(188,188)},{key:"balance",value:x.balance,sortOrder:"ascending",width:new e.ResponsiveSized(120,120)}],E={headerLastColumnTopPadding:new e.ResponsiveSized(e.sp[0],e.sp[4]),headerLastColumnRightPadding:new e.ResponsiveSized(e.sp[3],e.sp[8]),headerLastColumnBottomPadding:new e.ResponsiveSized(e.sp[0],e.sp[4]),headerLastColumnLeftPadding:new e.ResponsiveSized(e.sp[3],e.sp[8]),containerMarginLeft:new e.ResponsiveSized(e.sp[0],e.sp[8]),containerMarginRight:new e.ResponsiveSized(e.sp[0],e.sp[8]),headerHeight:new e.ResponsiveSized(45,58)},D=i.div`
-  top: ${e.Space.sp0};
-  left: ${e.Space.sp0};
-  min-height: ${t=>E.headerHeight.valuePx(t.windowSize)};
-  max-height: ${t=>E.headerHeight.valuePx(t.windowSize)};
-  width: fit-content;
-  min-width: 100%;
-  z-index: 2;
-  display: flex;
-  align-items: center;
-  box-sizing: border-box;
-  background-color: ${t=>t.theme.colors.grey4};
-  position: sticky;
-`,T=i.div`
-  color: ${t=>t.sortDataValue===t.actualDataValue?t.theme.colors.primary:t.theme.colors.grey1};
-
-  width: ${t=>t.windowSize!=="extra-large"?t.wrapperWidth.valuePx(t.windowSize):t.wrapperWidth.valuePercentage(t.windowSize)};
-  max-width: ${t=>t.windowSize!=="extra-large"?t.wrapperWidth.valuePx(t.windowSize):t.wrapperWidth.valuePercentage(t.windowSize)};
-  padding-left: ${e.Space.sp0};
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  left: ${e.Space.sp0};
-  justify-content: flex-start;
-  position: static;
-  z-index: 0;
-  box-sizing: border-box;
-`,M=i(e.SvgCloseRound)`
-  width: 12px;
-  height: 12px;
-`,k=i.div`
-  display: flex;
-  align-items: center;
-  transform: ${t=>t.sortConfig.sortOrder==="descending"?"rotate(180deg)":"rotate(0deg)"};
-  ${t=>t.sortConfig.sortOrder==="ascending"?"padding-top: 2px":"padding-bottom: 2px"};
-`,H=i.div`
-  display: ${t=>t.isVisible?"flex":"none"};
-  align-items: center;
-  padding-top: 2px;
-  cursor: pointer;
-  &:hover {
-    color: ${t=>t.theme.colors.primary};
-  }
-`,Y=i.div`
-  display: flex;
-  cursor: pointer;
-  gap: 6px;
-  &:hover {
-    color: ${t=>t.theme.colors.primary};
-  }
-`;function A({sortConfig:t,onColumnSortConfigChanged:a}){const d=e.useWindowSizeContext(),s=w.useCallback((o,r)=>{let l=r;t.sortKey===o&&(l=t.sortOrder==="ascending"?"descending":"ascending"),a(o,l)},[a,t]);return n.jsxRuntimeExports.jsx(D,{windowSize:d,children:c.map(o=>n.jsxRuntimeExports.jsxs(T,{sortDataValue:t.sortKey,actualDataValue:o.key,wrapperWidth:o.width,windowSize:d,children:[n.jsxRuntimeExports.jsxs(Y,{onClick:()=>s(o.key,o.sortOrder),children:[n.jsxRuntimeExports.jsx(e.SmallRegular,{children:o.value}),n.jsxRuntimeExports.jsx(k,{sortConfig:t,children:n.jsxRuntimeExports.jsx(e.SvgArrowTailTop,{width:12,height:12})})]}),n.jsxRuntimeExports.jsx(H,{isVisible:t.sortKey===o.key&&t.sortKey!=="date",children:n.jsxRuntimeExports.jsx(M,{onClick:()=>a("date","ascending")})})]},o.key))})}const S={containerPaddingLeft:new e.ResponsiveSized(e.sp[3],e.sp[4]),containerPaddingRight:new e.ResponsiveSized(e.sp[3],e.sp[4]),containerPaddingTop:new e.ResponsiveSized(e.sp[3],e.sp[3]),containerPaddingBottom:new e.ResponsiveSized(e.sp[3],e.sp[3]),containerMarginLeft:new e.ResponsiveSized(e.sp[4],e.sp[8]),nameLogoWidth:new e.ResponsiveSized(e.sp[4],e.sp[4]),nameLogoHeight:new e.ResponsiveSized(e.sp[4],e.sp[4]),nameWidth:new e.ResponsiveSized(150,150)},O=i.div`
-  display: flex;
-  flex-direction: column;
-  row-gap: ${e.Space.sp2};
-`,_=i.div`
-  display: flex;
-  background-color: ${t=>t.theme.colors.grey5};
-  box-sizing: border-box;
-  align-items: center;
-  padding-top: ${t=>S.containerPaddingTop.valuePx(t.windowSize)};
-  padding-bottom: ${t=>S.containerPaddingBottom.valuePx(t.windowSize)};
-  border: ${t=>`1px solid ${t.theme.colors.grey3}`};
-  box-shadow: ${t=>t.theme.mode==="dark"?`${e.Colors.dropShadowNormalDark} ${e.Space.sp0} 2px ${e.Space.sp1}`:`${e.Space.sp0} 2px ${e.Space.sp1} ${e.Colors.dropShadowNormalLight}`};
-  border-radius: ${e.Space.sp2};
-  cursor: pointer;
-  &:hover {
-    border-color: ${t=>t.theme.colors.primary};
-    div {
-      color: ${t=>t.theme.colors.primary};
-    }
-    .entity-icon {
-      color: ${t=>t.theme.colors.grey5};
-    }
-  }
-`,m=i.div`
-  display: flex;
-  align-items: center;
-  width: ${t=>t.windowSize!=="extra-large"?t.itemWidth.valuePx(t.windowSize):t.itemWidth.valuePercentage(t.windowSize)};
-  :last-of-type {
-    padding-right: 0;
-  }
-`,N=i(e.SmallRegular)`
-  color: ${t=>t.theme.colors.grey1};
-`,h=i(e.StandardRegular)`
-  color: ${t=>t.theme.colors.hero};
-`,V=i(e.StandardRegular)`
-  color: ${t=>t.theme.colors.hero};
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  max-width: ${t=>S.nameWidth.valuePx(t.windowSize)};
-`,q=i.div`
-  display: flex;
-  padding-left: ${e.Space.sp3};
-  align-items: center;
-  justify-content: center;
-  column-gap: ${e.Space.sp2};
-`;function I({invoice:t,entityLogo:a,onTransactionClick:d}){const s=e.useWindowSizeContext(),{common:o,dateFormat:r}=e.appLocale.getLocalizedStrings();return n.jsxRuntimeExports.jsxs(O,{windowSize:s,children:[n.jsxRuntimeExports.jsx(N,{children:t.date.format(r.visual.MMMDCommaYYYYformat)}),n.jsxRuntimeExports.jsxs(_,{onClick:()=>{d(t)},windowSize:s,children:[n.jsxRuntimeExports.jsx(m,{windowSize:s,itemWidth:c[0].width,children:n.jsxRuntimeExports.jsxs(q,{children:[a!=null?n.jsxRuntimeExports.jsx(e.EntityLogoAvatar,{photoUrl:a.toString(),styles:{width:S.nameLogoWidth.valuePx(s),height:S.nameLogoHeight.valuePx(s)}}):n.jsxRuntimeExports.jsx(e.EntityAvatar,{name:t.entity.name,size:e.Space.sp4}),n.jsxRuntimeExports.jsx(V,{windowSize:s,title:t.entity.name,children:t.entity.name})]})}),n.jsxRuntimeExports.jsx(m,{windowSize:s,itemWidth:c[1].width,children:n.jsxRuntimeExports.jsx(h,{children:t.invoiceNumber??o.strings.hyphen})}),n.jsxRuntimeExports.jsx(m,{windowSize:s,itemWidth:c[2].width,children:n.jsxRuntimeExports.jsx(h,{children:t.dueDate!=null?t.dueDate.format(r.visual.MMMDCommaYYYYformat):o.strings.hyphen})}),n.jsxRuntimeExports.jsx(m,{windowSize:s,itemWidth:c[3].width,children:n.jsxRuntimeExports.jsx(h,{children:t.daysPastDue??o.strings.hyphen})}),n.jsxRuntimeExports.jsx(m,{windowSize:s,itemWidth:c[4].width,children:n.jsxRuntimeExports.jsx(h,{children:e.amountToString("0,0",t.amount)})}),n.jsxRuntimeExports.jsx(m,{windowSize:s,itemWidth:c[5].width,children:n.jsxRuntimeExports.jsx(h,{children:e.amountToString("0,0",t.balance)})})]})]})}const K={wrapperContainerMarginTop:new e.ResponsiveSized(e.sp[4],e.sp[0]),wrapperContaineHorizontalrMargin:new e.ResponsiveSized(e.sp[0],e.sp[8]),itemHeight:new e.ResponsiveSized(103,103)},U=i.div`
-  position: relative;
-  width: auto;
-  height: 100%;
-`,B=i.div`
-  top: ${e.Space.sp0};
-  left: ${e.Space.sp0};
-  padding-bottom: ${e.Space.sp3};
-  box-sizing: border-box;
-`,F=i.div``,b=w.forwardRef((t,a)=>{const{children:d,style:s,sortConfig:o,onColumnSortConfigChanged:r,onUpdateCurrentYTDSelection:l,selectedYTDSpendOption:j,fetchState:R,...u}=t;return n.jsxRuntimeExports.jsxs(F,{ref:a,style:{...s,width:"auto"},...u,children:[n.jsxRuntimeExports.jsx(A,{onColumnSortConfigChanged:r,sortConfig:o}),n.jsxRuntimeExports.jsx(U,{children:d})]})});b.displayName="Aging invoices list view inner element type";const G=({index:t,style:a,invoices:d,entityLogo:s,onTransactionClick:o})=>{const r=d[t];return t<d.length?n.jsxRuntimeExports.jsx(B,{style:{...a,width:"fit-content",minWidth:"100%"},children:n.jsxRuntimeExports.jsx(I,{onTransactionClick:o,invoice:r,entityLogo:s})}):null};function J({uiState:t,invoices:a,entityLogo:d,onColumnSortConfigChanged:s,onTransactionClick:o}){const r=w.useRef(null),l=e.useWindowSizeContext(),j=w.useCallback(()=>K.itemHeight.value(l),[l]);return n.jsxRuntimeExports.jsx(n.AutoSizer,{children:({height:R,width:u})=>n.jsxRuntimeExports.jsx(n.VariableSizeList,{height:R,width:u,ref:r,overscanCount:1,itemCount:a.length,innerElementType:g=>n.jsxRuntimeExports.jsx(b,{...g,onColumnSortConfigChanged:s,sortConfig:{sortKey:t.sortKey,sortOrder:t.sortOrder}}),itemSize:j,style:{willChange:"auto"},children:g=>n.jsxRuntimeExports.jsx(G,{...g,invoices:a,entityLogo:d,onTransactionClick:o})})})}const p={containerHorizontalPadding:new e.ResponsiveSized(e.sp[2],e.sp[8]),nameLogoWidth:new e.ResponsiveSized(e.sp[5],e.sp[5]),nameLogoHeight:new e.ResponsiveSized(e.sp[5],e.sp[5]),nameLogoMarginTop:new e.ResponsiveSized(e.sp[1],e.sp[1]),entityContainerWidth:new e.ResponsiveSized(300,350,350,350,400),summaryColumnGap:new e.ResponsiveSized(e.sp[2],e.sp[1],e.sp[1],e.sp[2],e.sp[6])},Q=i.div`
-  background: ${t=>t.theme.colors.grey5};
-  padding-left: ${t=>p.containerHorizontalPadding.valuePx(t.windowSize)};
-  padding-right: ${t=>p.containerHorizontalPadding.valuePx(t.windowSize)};
-  padding-bottom: ${e.Space.sp4};
-  display: flex;
-  justify-content: space-between;
-  align-items: ${t=>t.isLargeScreen===!0?"center":"flex-start"};
-  flex-direction: ${t=>t.isLargeScreen===!0?"row":"column"};
-  border-bottom: 1px solid ${t=>t.theme.colors.grey3};
-  row-gap: ${e.Space.sp3};
-`,X=i.div`
-  display: flex;
-  align-items: flex-start;
-  column-gap: ${e.Space.sp3};
-  max-width: ${t=>p.entityContainerWidth.valuePx(t.windowSize)};
-`,Z=i.div`
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  column-gap: ${t=>p.summaryColumnGap.valuePx(t.windowSize)};
-  width: ${t=>t.isLargeScreen===!0?"unset":"100%"};
-  overflow: auto;
-`,ee=i.div`
-  display: flex;
-  flex-direction: column;
-`,$=i(e.ExtraSmallRegular)`
-  color: ${t=>t.theme.colors.hero};
-`,te=i.div`
-  margin-top: ${t=>p.nameLogoMarginTop.valuePx(t.windowSize)};
-`,f=i.div`
-  display: flex;
-  flex-direction: column;
-`,C=i(e.LargeMedium)`
-  text-align: right;
-  color: ${t=>t.theme.colors.primary};
-`,y=i(e.StandardRegular)`
-  color: ${t=>t.theme.colors.hero};
-  text-wrap: nowrap;
-  width: fit-content;
-`,ne=i(e.H5Regular)`
-  color: ${t=>t.theme.colors.primary};
-`;function ie({totalBalances:t,entityName:a,reportId:d,reportDate:s,entityLogo:o}){const r=e.useWindowSizeContext(),l=r==="large"||r==="extra-large",{reports:{aging:{duration:j,apAgingDetail:R,arAgingDetail:u,apAging:g,arAging:L}},dateFormat:z}=e.appLocale.getLocalizedStrings(),P=w.useMemo(()=>W.calculateTotalBalance(t),[t]);return n.jsxRuntimeExports.jsxs(Q,{isLargeScreen:l,windowSize:r,children:[n.jsxRuntimeExports.jsxs(X,{windowSize:r,children:[o!=null?n.jsxRuntimeExports.jsx(e.EntityLogoAvatar,{photoUrl:o.toString(),styles:{width:p.nameLogoWidth.valuePx(r),height:p.nameLogoHeight.valuePx(r),marginTop:p.nameLogoMarginTop.valuePx(r)}}):n.jsxRuntimeExports.jsx(te,{windowSize:r,children:n.jsxRuntimeExports.jsx(e.EntityAvatar,{name:a,size:e.Space.sp5})}),n.jsxRuntimeExports.jsxs(ee,{children:[n.jsxRuntimeExports.jsx(ne,{children:a}),n.jsxRuntimeExports.jsx(e.ControlledComponent,{controller:d==="accounts_payable_aging",children:n.jsxRuntimeExports.jsx($,{children:`${R.dateLabel} ${s.format(z.visual.MMMDCommaYYYYformat)}`})}),n.jsxRuntimeExports.jsx(e.ControlledComponent,{controller:d==="accounts_receivable_aging",children:n.jsxRuntimeExports.jsx($,{children:`${u.dateLabel} ${s.format(z.visual.MMMDCommaYYYYformat)}`})})]})]}),n.jsxRuntimeExports.jsxs(Z,{isLargeScreen:l,windowSize:r,children:[t.map(v=>n.jsxRuntimeExports.jsxs(f,{children:[n.jsxRuntimeExports.jsx(y,{children:j[v.period]}),n.jsxRuntimeExports.jsx(C,{children:e.amountToString("0,0",v?.balance)})]},v.period)),n.jsxRuntimeExports.jsxs(f,{children:[n.jsxRuntimeExports.jsx(e.ControlledComponent,{controller:d==="accounts_payable_aging",children:n.jsxRuntimeExports.jsx(y,{children:g.totalPayable})}),n.jsxRuntimeExports.jsx(e.ControlledComponent,{controller:d==="accounts_receivable_aging",children:n.jsxRuntimeExports.jsx(y,{children:L.totalReceivable})}),n.jsxRuntimeExports.jsx(C,{children:e.amountToString("0,0",P?.balance)})]})]})]})}exports.AgingDetailReportTable=J;exports.EntitySummarySection=ie;