@zeniai/web-components 3.16.40 → 3.16.42

package/dist/ReportTableViewSelector-9FwQz4HU.js

@@ -1,679 +0,0 @@
-import { f as fe, u as X, j as o, z as ge, k as K, b as xe, g as ye, C as be, F as _e } from "./vendor-.pnpm-BZbZ6JJC.js";
-import { a as ee, f as we, g as $e, S as a, p as ve, aw as ke, D as p, u as ce, R as I, f8 as je, f9 as oe, ap as Ne, _ as Ce, E as de, b2 as De, G as Se } from "./index-oeut1pIL.js";
-import "@zeniai/client-epic-state";
-import he, { useState as _, useEffect as Q } from "react";
-import d from "@emotion/styled";
-import { u as R, C as Ie } from "./CollapsableReportTable-DfogYZH-.js";
-import { S as Re } from "./filter-cZIFUNvj.js";
-const F = ee.getLocalizedStrings().dateFormat.analytics.YYYYDashMMDashDDFormat, Te = (e) => ({
-  this_period: {
-    start_date: e.thisPeriod.startDate.format(F),
-    end_date: e.thisPeriod.endDate.format(F)
-  },
-  number_of_periods: e.numberOfPeriods,
-  order_by: e.orderBy
-}), Oe = (e) => e != null ? {
-  start_date: e.startDate.format(F),
-  end_date: e.endDate.format(F)
-} : void 0;
-function Pe(e) {
-  return {
-    locale_id: e.localeId,
-    show_negative_amount_in_parenthesis: e.showNegativeAmountInParenthesis,
-    filter_accounts_with_nil_balances: e.filterAccountsWithNilBalances,
-    filter_account_groups_with_nil_balances: e.filterAccountGroupsWithNilBalances,
-    include_cover_page: e.includeCoverPage,
-    company_name: e.companyName,
-    statement_file_type: e.statementFileType,
-    statements: e.statements,
-    first_month_of_fy: e.firstMonthOfFY,
-    book_close_date: e.bookCloseDate != null ? e.bookCloseDate.format(F) : void 0,
-    timeframe: e.timeframe,
-    additional_balances: e.additionalBalances,
-    format: e.format,
-    balances_filter: Te(e.balancesFilter),
-    account_view_mode: e.accountViewMode,
-    classes_to_filter_out: e.classesToFilterOut,
-    data_available: Oe(e.dataAvailable),
-    is_zeni_coa_used: e.isZeniCOAUsed
-  };
-}
-async function ho(e, c, r) {
-  const t = ee.getLocalizedStrings().downloadReport, s = `${e}?query=${encodeURIComponent(
-    JSON.stringify(Pe(r))
-  )}`;
-  try {
-    const h = await we({
-      urlEndPoint: s,
-      authParams: c,
-      fileType: r.statementFileType
-    });
-    if (h.ok) {
-      const x = $e(
-        h.headers,
-        t.defaultFileName
-      ), y = await h.arrayBuffer();
-      fe(y, x);
-    } else
-      console.error(`${t.reportErrorMessage} ${h.statusText}`);
-  } catch (h) {
-    console.error(`${t.reportErrorMessage} ${JSON.stringify(h)}`);
-  }
-}
-const Be = d.div`
-  padding: 0 ${a.sp3} 0 ${a.sp3};
-  border: 1px solid ${(e) => e.theme.colors.primary};
-  background: ${(e) => e.theme.colors.grey5};
-  border-radius: ${a.sp1};
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  position: relative;
-  height: ${a.sp8};
-  cursor: pointer;
-`, Ee = d(ve)`
-  color: ${(e) => e.theme.colors.primary};
-  margin-top: -2px;
-`, ze = d(ke)`
-  color: ${(e) => e.theme.colors.hero};
-  width: 12px;
-  height: 12px;
-  margin: auto ${a.sp0};
-  :hover {
-    color: ${(e) => e.theme.colors.primary};
-  }
-`, Ae = (e) => {
-  const { value: c, onClick: r } = e, t = X();
-  return /* @__PURE__ */ o.jsxs(Be, { onClick: r, children: [
-    /* @__PURE__ */ o.jsx(Ee, { style: { color: t.colors.primary }, children: c }),
-    /* @__PURE__ */ o.jsx(ze, {})
-  ] });
-}, Le = he.memo(Ae);
-function We({
-  backgroundColor: e,
-  foregroundColor: c,
-  animated: r,
-  width: t,
-  height: s
-}) {
-  return /* @__PURE__ */ o.jsxs(
-    ge,
-    {
-      speed: 2,
-      width: t,
-      height: s,
-      viewBox: `0 0 ${t} ${s}`,
-      animate: r != !1,
-      backgroundColor: e,
-      foregroundColor: c,
-      style: { marginBottom: a.sp2 },
-      children: [
-        /* @__PURE__ */ o.jsx("rect", { x: "45", y: p[3], rx: "5", ry: "5", width: "120", height: p[4] }),
-        /* @__PURE__ */ o.jsx("rect", { x: "45", y: p[8], rx: "5", ry: "5", width: "120", height: p[4] }),
-        /* @__PURE__ */ o.jsx("rect", { x: "45", y: "96", rx: "5", ry: "5", width: "120", height: p[4] }),
-        /* @__PURE__ */ o.jsx("rect", { x: "45", y: "136", rx: "5", ry: "5", width: "120", height: p[4] })
-      ]
-    }
-  );
-}
-function ue({
-  nestedClass: e,
-  isLastNode: c,
-  config: r,
-  parentNodeIDs: t
-}) {
-  const s = R("checkbox_and_name_only", [], e.classId[0]), h = {
-    children: [],
-    id: s,
-    isLastNode: c,
-    reportElementData: {
-      element: {
-        kind: "checkbox_and_name_only",
-        title: e.className,
-        data: e,
-        numOfBalances: 0
-      },
-      config: r
-    }
-  };
-  return h.children = e.children.map(
-    (x, y) => ue({
-      nestedClass: x,
-      config: r,
-      isLastNode: y === e.children.length - 1,
-      parentNodeIDs: [...t, s]
-    })
-  ), h;
-}
-function Me(e, c) {
-  const r = e.map((t, s) => {
-    const h = R(
-      "checkbox_and_name_only",
-      [],
-      t.classId[0]
-    ), x = {
-      children: [],
-      id: h,
-      isLastNode: t.children.length !== 0,
-      reportElementData: {
-        element: {
-          kind: "checkbox_and_name_only",
-          title: t.className,
-          data: t,
-          numOfBalances: 0
-        },
-        config: c
-      }
-    }, y = t.children.map(
-      (T) => ue({
-        nestedClass: T,
-        config: c,
-        isLastNode: s === t.children.length - 1,
-        parentNodeIDs: [h]
-      })
-    );
-    return x.children.push(...y), x;
-  });
-  return {
-    config: c,
-    headerNodes: [],
-    contentNodes: [...r]
-  };
-}
-function Fe(e, c) {
-  Object.assign(e.config, c);
-  const r = e.contentNodes;
-  return r.forEach(
-    (t) => pe(t, c)
-  ), {
-    config: c,
-    headerNodes: [],
-    contentNodes: [...r]
-  };
-}
-function pe(e, c) {
-  Object.assign(e.reportElementData.config, c), e.children.forEach(
-    (r) => pe(r, c)
-    // Note: recursive call!
-  );
-}
-const te = {
-  contentPaddingLeft: new I(p[3], p[3], p[2]),
-  contentPaddingRight: new I(p[3], p[3], p[2])
-}, He = d.div`
-  height: ${(e) => e.height}px;
-  width: 100%;
-`, Ye = ({
-  reportId: e,
-  firstMonthOfFY: c,
-  nestedClassHierarchy: r,
-  classesToBeFilteredOut: t,
-  selectedView: s,
-  showClassAccountNumber: h,
-  scrollPosition: x,
-  onScroll: y,
-  nodeOpenStatus: T,
-  onNodeCollapseToggled: V,
-  onToggleCheck: O
-}) => {
-  const H = X(), Y = ce(), [$, N] = _(
-    void 0
-  ), [A, b] = _(!1), [L, P] = _({}), [f, W] = _(
-    void 0
-  ), [B, v] = _(s), q = "none", E = (i) => s === "account_group" ? !0 : t?.length > 0 ? t.find((l) => l[0] === i[0]) != null : !1, C = (i, l) => {
-    b(!0), P(i), O?.(
-      i,
-      l,
-      s === "account_group" ? !0 : void 0
-    ), w(i, l);
-  }, w = (i, l) => {
-    const m = G(i);
-    for (const k of m.children)
-      O?.(k.classId, l), w(k.classId, l);
-  }, G = (i) => {
-    let l = r.filter(
-      (m) => m.classId[0] === i[i.length - 1]
-    )[0];
-    for (let m = i.length - 2; m >= 0; m--)
-      l = l.children.filter(
-        (k) => k.classId[0] === i[m]
-      )[0];
-    return l;
-  }, U = (i) => {
-    if (i.length > 1) {
-      const l = G(i.slice(1));
-      let m = !1;
-      for (const k of l.children)
-        if (t.find(
-          (n) => n[0] === k.classId[0]
-        ) === void 0) {
-          m = !0;
-          break;
-        }
-      m === !0 ? O?.(l.classId, !0) : O?.(l.classId, !1), P(l.classId);
-    }
-  };
-  Q(() => {
-    A && U(L);
-  }), Q(() => {
-    const i = {
-      reportId: e,
-      displayOrder: "ascending_date",
-      reportFormat: "more_detailed",
-      mode: q,
-      firstMonthOfFY: c,
-      filterAccountsWithNilBalances: "off",
-      filterAccountGroupsWithNilBalances: "off",
-      showNegativeAmountInParenthesis: !1,
-      isClassToBeFilteredOut: E,
-      showClassAccountNumber: h
-    };
-    if ($ == null || !K(f, r) || !K(B, s) || A === !0) {
-      const l = Me(
-        r,
-        i
-      );
-      W(r), N(l), v(s);
-    } else {
-      const l = Fe(
-        $,
-        i
-      );
-      N(l), v(s);
-    }
-  }, [r, s, t]);
-  const [J, Z] = _(5), z = (i) => {
-    const l = i + p[6];
-    Z(l);
-  };
-  return $ != null ? /* @__PURE__ */ o.jsx(He, { height: J, children: /* @__PURE__ */ o.jsx(
-    Ie,
-    {
-      backgroundColor: s === "classes" ? new xe(H.colors.background) : void 0,
-      rootNodes: $,
-      type: "name_only",
-      compareMode: "compare_mode_amount",
-      isSticky: {
-        isStickyHeader: !1,
-        isStickyName: !1
-      },
-      treeNodePadding: {
-        left: te.contentPaddingLeft.value(Y),
-        right: te.contentPaddingRight.value(Y)
-      },
-      scrollPosition: x,
-      onScroll: y,
-      nodeOpenStatus: T,
-      onNodeCollapseToggled: V,
-      onToggleCheck: C,
-      onReportTableHeightChanged: z
-    }
-  ) }) : null;
-}, j = {
-  width: new I(350, 400, 400),
-  height: new I(165, 165, 165),
-  buttonWidth: new I(62, 62),
-  buttonHeight: new I(p[5], p[5]),
-  containerWidth: new I(150, 400, 400)
-}, qe = d.div`
-  position: relative;
-  pointer-events: ${(e) => e.isDisabled === !0 ? "none" : "initial"};
-`, Ge = d.div`
-  display: flex;
-  flex-direction: column;
-  width: ${(e) => j.containerWidth.valuePx(e.windowSize)};
-`, Ue = d(Ce)`
-  display: flex;
-  flex-direction: row;
-  width: fit-content;
-  cursor: pointer;
-  color: ${(e) => e.theme.colors.primary};
-  .dropdownIcon {
-    color: ${(e) => e.theme.colors.hero};
-  }
-  &:hover {
-    .dropdownIcon {
-      color: ${(e) => e.theme.colors.primary};
-    }
-  }
-  gap: ${a.sp2};
-  margin-top: 12px;
-  align-items: center;
-`, Je = d(Re)`
-  color: ${(e) => e.theme.colors.hero};
-  width: ${a.sp4};
-  height: ${a.sp4};
-  &:hover {
-    color: ${(e) => e.theme.colors.primary};
-  }
-`, Ve = d.div`
-  display: flex;
-  width: ${(e) => e.width}px;
-  align-items: flex-start;
-  justify-content: space-between;
-  flex-direction: column;
-  border: 1px solid ${(e) => e.theme.colors.grey5};
-  border-radius: ${a.sp1};
-  box-shadow: ${(e) => `${a.sp0} 2px ${a.sp2} ${e.theme.colors.dropShadowHover}`};
-  margin-top: 10px;
-  padding-top: ${a.sp1};
-  background: ${(e) => e.theme.colors.grey5};
-`, ne = d.div`
-  display: flex;
-  align-items: flex-start;
-  justify-content: space-between;
-  flex-direction: column;
-  width: 100%;
-  background-color: ${(e) => e.checked === !0 ? e.theme.colors.background : "transparent"};
-  & input[type="radio"] {
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    appearance: none;
-    display: inline-block;
-    width: ${a.sp3};
-    height: ${a.sp3};
-    padding: 2px;
-    background-clip: content-box;
-    border: 1px solid ${(e) => e.theme.colors.primary};
-    border-radius: 50%;
-    margin: ${a.sp0} ${a.sp2} ${a.sp0} ${a.sp2};
-    cursor: pointer;
-  }
-
-  input[type="radio"]:checked {
-    background-color: ${(e) => e.theme.colors.primary};
-  }
-
-  input[type="radio"]:disabled {
-    cursor: default;
-  }
-
-  &:hover {
-    background: ${(e) => e.theme.colors.background};
-  }
-`, re = d(Se)`
-  height: ${a.sp6};
-  display: flex;
-  justify-content: center;
-  align-items: center;
-`, Ze = d.div`
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: flex-start;
-  height: 100%;
-  width: inherit;
-  overflow-y: auto;
-  .hide-icon {
-    display: none;
-  }
-  min-height: 165px;
-  max-height: 353px;
-  overscroll-behavior: contain;
-`, Ke = d.div`
-  width: 100%;
-  height: 65px;
-`, ae = d.label`
-  color: ${(e) => e.theme.colors.primary};
-  cursor: ${(e) => e.disabled === !0 ? "default" : "pointer"};
-`, Qe = d(de)`
-  display: flex;
-  align-items: center;
-  column-gap: ${a.sp2};
-  margin-left: ${a.sp5};
-  color: ${(e) => e.theme.colors.hero};
-  &:hover {
-    cursor: pointer;
-    color: ${(e) => e.theme.colors.primary};
-  }
-`, Xe = d.div`
-  display: flex;
-  flex: 1;
-  width: inherit;
-  background-color: ${(e) => e.theme.colors.grey3};
-  min-height: 1px;
-  max-height: 1px;
-`, eo = d(De)`
-  width: ${a.sp3};
-  height: ${a.sp3};
-`, oo = d(de)`
-  margin-left: ${a.sp5};
-  margin-top: -12px;
-  color: ${(e) => e.theme.colors.hero};
-`, {
-  reportViewSelector: S,
-  common: { footer: se }
-} = ee.getLocalizedStrings(), le = "tableViewSelector", ie = (e) => `${e}_form`;
-function uo({
-  reportId: e,
-  firstMonthOfFY: c,
-  nodes: r,
-  classesListFetchState: t,
-  selectedView: s,
-  classesToBeFilteredOut: h,
-  showClassAccountNumber: x,
-  onOpenAccountViewMode: y,
-  onSaveClick: T,
-  isClassViewDisabled: V,
-  downloadPage: O,
-  showAccountGroups: H = !0,
-  onResyncReports: Y,
-  isPageFetchInProgress: $ = !1,
-  lastRefreshSuccessTime: N
-}) {
-  const A = X(), b = ce(), [L, P] = _(!1), [f, W] = _(s), [B, v] = _(
-    {}
-  ), q = (n, u) => (n.forEach((g) => {
-    u.push(g.classId), u = q(g.children, u);
-  }), u), E = q(r, []), [C, w] = _(
-    f === "classes" ? h : E
-  ), G = t !== "Completed" || f === "classes" && C.length === E.length;
-  je({
-    componentName: `reports.${e}`
-  });
-  const U = (n) => n === "classes" ? S.classes.label : H === !0 ? S.accountGroups.label : S.accounts.label, J = ye({
-    mode: "all"
-  }), Z = J.handleSubmit(() => {
-    P(!1), f === "classes" ? T?.("classes", C) : T?.("account_group");
-  }), z = (n) => {
-    if (W(n), n === "classes")
-      v({}), w([]);
-    else {
-      w(E);
-      let u = {};
-      r.forEach((g) => {
-        const D = R(
-          "checkbox_and_name_only",
-          [],
-          g.classId[0]
-        );
-        u = Object.assign({}, u, { [D]: !1 });
-      }), v(u);
-    }
-  }, i = () => {
-    L === !0 && m(), P(!L);
-    let n = {};
-    r.forEach((u) => {
-      const g = R(
-        "checkbox_and_name_only",
-        [],
-        u.classId[0]
-      );
-      s === "account_group" || C.find((D) => D[0] === u.classId[0]) !== void 0 ? n = Object.assign({}, n, { [g]: !1 }) : n = Object.assign({}, n, { [g]: !0 });
-    }), v(n);
-  }, l = (n, u, g) => {
-    if (g === !0 && (W("classes"), w(E)), u === !0) {
-      const D = R("checkbox_and_name_only", [], n[0]);
-      B[D] = !0, v(B), w(
-        (M) => M.filter((me) => me[0] !== n[0])
-      );
-    } else {
-      const D = R("checkbox_and_name_only", [], n[0]);
-      B[D] = !1, C.find((M) => M[0] === n[0]) === void 0 && w((M) => [...M, n]);
-    }
-  }, m = () => {
-    P(!1), W(s), w(h);
-  }, k = () => {
-    $ === !1 && Y?.();
-  };
-  return Q(() => {
-    if (t === "Completed" && f === "account_group") {
-      let n = {};
-      r.forEach((u) => {
-        const g = R(
-          "checkbox_and_name_only",
-          [],
-          u.classId[0]
-        );
-        n = Object.assign({}, n, { [g]: !1 });
-      }), v(n);
-    }
-  }, [t]), /* @__PURE__ */ o.jsx(be, { onClickAway: m, children: /* @__PURE__ */ o.jsxs(qe, { isDisabled: V ?? !1, children: [
-    O === !0 ? /* @__PURE__ */ o.jsx(
-      Le,
-      {
-        value: U(s),
-        onClick: () => {
-          y?.(), i();
-        }
-      }
-    ) : /* @__PURE__ */ o.jsxs(Ge, { windowSize: b, children: [
-      /* @__PURE__ */ o.jsxs(
-        Ue,
-        {
-          onClick: (n) => {
-            n.preventDefault(), y?.(), i();
-          },
-          children: [
-            /* @__PURE__ */ o.jsx(Je, { className: "dropdownIcon" }),
-            U(s)
-          ]
-        }
-      ),
-      s === "classes" ? /* @__PURE__ */ o.jsx(Qe, { onClick: k, children: $ ? S.generatingReportByClass : /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
-        N && `${oe(N)}`,
-        /* @__PURE__ */ o.jsx(eo, {})
-      ] }) }) : null
-    ] }),
-    L ? /* @__PURE__ */ o.jsx(_e, { ...J, children: /* @__PURE__ */ o.jsx("form", { id: ie(le), onSubmit: Z, children: /* @__PURE__ */ o.jsxs(Ve, { width: j.width.value(b), children: [
-      /* @__PURE__ */ o.jsx(ne, { checked: f === "account_group", children: /* @__PURE__ */ o.jsxs(
-        re,
-        {
-          onClick: () => f !== "account_group" ? z("account_group") : null,
-          children: [
-            /* @__PURE__ */ o.jsx(
-              "input",
-              {
-                type: "radio",
-                value: "account_group",
-                id: "accountGroups",
-                name: "formgroup",
-                onChange: (n) => z(
-                  n.currentTarget.value
-                ),
-                checked: f === "account_group",
-                disabled: t !== "Completed"
-              }
-            ),
-            /* @__PURE__ */ o.jsx(
-              ae,
-              {
-                disabled: t !== "Completed",
-                children: H === !0 ? S.accountGroups.dropdownLabel : S.accounts.dropdownLabel
-              }
-            )
-          ]
-        }
-      ) }),
-      /* @__PURE__ */ o.jsx(Xe, {}),
-      /* @__PURE__ */ o.jsxs(ne, { checked: f === "classes", children: [
-        /* @__PURE__ */ o.jsxs(
-          re,
-          {
-            onClick: () => t === "Completed" ? z("classes") : null,
-            children: [
-              /* @__PURE__ */ o.jsx(
-                "input",
-                {
-                  type: "radio",
-                  value: "classes",
-                  id: "classes",
-                  name: "formgroup",
-                  onChange: (n) => t === "Completed" ? z(
-                    n.currentTarget.value
-                  ) : null,
-                  checked: f === "classes",
-                  disabled: t !== "Completed"
-                }
-              ),
-              /* @__PURE__ */ o.jsx(
-                ae,
-                {
-                  disabled: t !== "Completed",
-                  children: S.classes.dropdownLabel
-                }
-              )
-            ]
-          }
-        ),
-        $ || t !== "Completed" ? null : /* @__PURE__ */ o.jsx(oo, { children: N && `${oe(N)}` }),
-        t === "Completed" ? /* @__PURE__ */ o.jsx(Ze, { id: "sectionformcontainer", children: /* @__PURE__ */ o.jsx(
-          to,
-          {
-            reportId: e,
-            firstMonthOfFY: c,
-            nestedClassHierarchy: r,
-            classesToBeFilteredOut: C,
-            selectedView: f,
-            nodeOpenStatus: B,
-            showClassAccountNumber: x,
-            onToggleCheck: l
-          }
-        ) }) : /* @__PURE__ */ o.jsx(
-          We,
-          {
-            backgroundColor: A.colors.grey3,
-            foregroundColor: A.colors.grey4,
-            width: j.width.value(b),
-            height: j.height.value(b),
-            animated: !0
-          }
-        )
-      ] }),
-      /* @__PURE__ */ o.jsx(Ke, { children: /* @__PURE__ */ o.jsx(
-        Ne,
-        {
-          formId: ie(le),
-          primaryBtn: {
-            label: se.save,
-            style: {
-              width: j.buttonWidth.valuePx(b),
-              height: j.buttonHeight.valuePx(b)
-            },
-            isLoading: !1,
-            isDisabled: G,
-            size: "small"
-          },
-          showCancel: !0,
-          cancelBtn: {
-            label: se.cancel,
-            style: {
-              width: j.buttonWidth.valuePx(b),
-              height: j.buttonHeight.valuePx(b)
-            },
-            onClick: m,
-            size: "small",
-            shouldResetOnCancel: !0
-          },
-          style: {
-            padding: a.sp3
-          }
-        }
-      ) })
-    ] }) }) }) : null
-  ] }) });
-}
-const to = he.memo(Ye, K);
-export {
-  uo as R,
-  ho as d
-};