@zeniai/web-components 3.16.92 → 3.16.93

package/dist/AllUserItems-D2oB4oCJ.js

@@ -1,979 +0,0 @@
-import { d as Q, i as te, j as t, m as ye, o as Re } from "./vendor-.pnpm-B2klaOGU.js";
-import p from "@emotion/styled";
-import { hasInvestorBankerLevelAccess as G, toUserRoleTypeStrict as ze } from "@zeniai/client-epic-state";
-import { u as E, R as b, fe as J, e as z, S as l, i4 as U, a as q, i5 as K, i6 as X, i7 as se, O as ae, E as ne, D as u, iI as Ie, eq as De, w as de, B as le, o as ce, y as Ne, _ as Ue, Z as Ce, C as pe, x as me } from "./index-B_vMG-7O.js";
-import { useMemo as ue, useEffect as ge } from "react";
-import { L as he } from "./LabeledEmailInputField-BEJQ8J01.js";
-import { L as xe } from "./LabeledSingleSelectWithoutClearableField-CTB0ozQP.js";
-import { L as ve } from "./LabeledUserSingleSelectWithSubtitlesField-BGamxotP.js";
-import { L as fe, a as be } from "./LabeledZeniRolesDropDownField-BV1g6-FT.js";
-const Z = (e, o) => `${e}.${o}`, oe = {
-  largeLabelWidth: new b(120, 120, 160),
-  paddingBottom: new b(u[3], u[2]),
-  textFieldPaddingHorizontal: new b(u[2], u[3]),
-  toolTipWidth: new b(215, 237)
-}, h = q.getLocalizedStrings().peoplePage, We = ({
-  user: e,
-  sectionId: o,
-  mode: r,
-  managersList: s,
-  classList: i,
-  controllersList: x,
-  customerRoleOptions: P,
-  isBankingOnlyTenant: m,
-  isCardsOnlyTenant: $,
-  isEdit: A,
-  person: v,
-  analytics: w
-}) => {
-  const S = E(), I = oe.largeLabelWidth.value(S), { setValue: D } = Q(), W = te(x), j = W.splice(0, 1), L = W.reduce(
-    (a, n) => a.concat(`${n.email},`),
-    ""
-  ), _ = ue(() => te(J.roles), []), g = G(e.role);
-  return ge(() => {
-    (g || m || $) && D("userItems.0.department", {
-      allOptions: [],
-      selectedOption: void 0
-    }), g && D("userItems.0.manager", {
-      allUsers: [],
-      selectedUser: void 0
-    });
-  }, [g, m, $]), /* @__PURE__ */ t.jsxs(
-    Ae,
-    {
-      windowSize: S,
-      "data-testid": z("edit-people-user-item-section"),
-      children: [
-        /* @__PURE__ */ t.jsx(
-          he,
-          {
-            label: h.invitePage.email,
-            name: Z(o, "email"),
-            registerOptions: {
-              required: !0,
-              value: e.email,
-              disabled: !0
-            },
-            placeholder: U(
-              h.addPlaceholderPrefix,
-              h.invitePage.email
-            ),
-            style: {
-              paddingTop: l.sp2,
-              paddingBottom: l.sp2
-            }
-          }
-        ),
-        /* @__PURE__ */ t.jsx(k, {}),
-        r === "off" ? /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-          /* @__PURE__ */ t.jsx(
-            fe,
-            {
-              label: { label: h.invitePage.role, width: I },
-              style: { width: "auto" },
-              rolesDropDownField: {
-                name: Z(o, "nonZeniRole"),
-                defaultValue: {
-                  userRole: {
-                    selectedRole: se(e.role),
-                    allRootRole: X(
-                      m,
-                      $
-                    )
-                  },
-                  productsByUserRole: K(
-                    e.role,
-                    P
-                  )
-                },
-                registerOptions: { required: !0 }
-              }
-            }
-          ),
-          /* @__PURE__ */ t.jsx(k, {}),
-          /* @__PURE__ */ t.jsx(
-            ve,
-            {
-              label: {
-                label: h.invitePage.manager,
-                width: I
-              },
-              showTooltip: !0,
-              toolTipWidth: oe.toolTipWidth.valuePx(S),
-              tooltipTitle: /* @__PURE__ */ t.jsx(Fe, {}),
-              userSingleSelectWithSubTitlesField: {
-                name: Z(o, "manager"),
-                value: {
-                  allUsers: s,
-                  selectedUser: e?.managerId ? e?.managerId : "no_manager"
-                },
-                valueToSubtitle: (a) => {
-                  const n = s.findIndex(
-                    (d) => d.userId === a
-                  );
-                  if (n !== -1) {
-                    const d = s[n], y = i.find(
-                      (F) => F.classId === d.userRole.accountingClassIDs[0]
-                    ), R = [];
-                    return y != null && R.push(y.className), R;
-                  } else
-                    return [];
-                },
-                placeholderLabel: g ? h.notApplicable : U(
-                  h.selectPlaceholderPrefix,
-                  h.invitePage.manager
-                ),
-                registerOptions: {
-                  required: !g
-                },
-                showOneOffLabel: {
-                  label: "No Manager",
-                  value: "no_manager",
-                  position: "top",
-                  subtitles: []
-                },
-                isDisabled: g ? "disabled" : void 0,
-                isOptionDisabled: (a) => a === v?.user?.userId
-              },
-              style: { width: "auto" },
-              isDisabled: g ? "disabled" : void 0,
-              opacity: g ? 0.32 : 1
-            }
-          ),
-          /* @__PURE__ */ t.jsx(k, {}),
-          /* @__PURE__ */ t.jsx(
-            xe,
-            {
-              label: {
-                label: h.invitePage.department,
-                width: I
-              },
-              singleSelectWithoutClearableField: {
-                name: Z(o, "department"),
-                defaultValue: {
-                  allOptions: i.map((a) => ({
-                    label: a.fullyQualifiedAccountingClassName ?? "",
-                    value: a.classId,
-                    hoverText: a.accountingClassNumber
-                  })),
-                  selectedOption: i.map((a) => ({
-                    label: a.fullyQualifiedAccountingClassName ?? "",
-                    value: a.classId,
-                    hoverText: a.accountingClassNumber
-                  })).find((a) => a.value === e.departmentId)
-                },
-                placeholder: g || m || $ ? h.notApplicable : U(
-                  h.selectPlaceholderPrefix,
-                  h.invitePage.department
-                ),
-                registerOptions: {
-                  required: !g || !(m || $)
-                },
-                isDisabled: g || m || $ ? "disabled" : void 0,
-                showOptionOnHover: !0
-              },
-              style: { width: "auto" },
-              isDisabled: g || m || $ ? "disabled" : void 0,
-              opacity: g || m || $ ? 0.32 : 1
-            }
-          ),
-          A ? null : /* @__PURE__ */ t.jsxs(Le, { windowSize: S, children: [
-            h.invitePage.controllerText,
-            j[0] ? /* @__PURE__ */ t.jsxs(
-              Me,
-              {
-                href: `mailto:${j[0].email}?cc=${L}&subject=${encodeURIComponent(
-                  h.invitePage.emailSubject
-                )}`,
-                children: [
-                  /* @__PURE__ */ t.jsx("span", { children: `${j[0].firstName} ${j[0].lastName}` }),
-                  /* @__PURE__ */ t.jsx(ae, { className: "arrowIcon" })
-                ]
-              }
-            ) : null
-          ] })
-        ] }) : /* @__PURE__ */ t.jsx(
-          be,
-          {
-            label: { label: h.invitePage.role, width: I },
-            zeniRolesDropDownField: {
-              name: Z(o, "role"),
-              defaultValue: {
-                selectedOptions: e.role,
-                allOptions: _
-              },
-              registerOptions: { required: !0 },
-              placeholderLabel: U(
-                h.selectPlaceholderPrefix,
-                h.invitePage.role
-              ),
-              isMulti: !0,
-              forZeniUser: !0,
-              onSelectionChanged: (a) => {
-                v != null && w?.trackRoleChanged(
-                  v.userRole.userRoles,
-                  a[0],
-                  v?.userRole.userEmail
-                );
-              }
-            },
-            style: { width: "auto" }
-          }
-        )
-      ]
-    }
-  );
-}, Fe = () => q.getLocalizedStrings().peoplePage.invitePage.managerTooltipText, Ae = p.div`
-  display: flex;
-  flex-direction: column;
-  background-color: ${(e) => e.theme.colors.grey5};
-  border: 1px solid ${(e) => e.theme.colors.grey3};
-  box-shadow: ${(e) => `${l.sp0} 2px ${l.sp1} ${e.theme.colors.dropShadowNormal}`};
-  border-radius: ${l.sp2};
-  margin-bottom: ${l.sp3};
-  .single-select-field__menu {
-    border: ${(e) => e.windowSize === "small" ? `1px solid ${e.theme.colors.grey3}` : "unset"};
-  }
-`, k = p.div`
-  display: flex;
-  flex: 1;
-  background-color: ${(e) => e.theme.colors.grey3};
-  min-height: 1px;
-  max-height: 1px;
-`, Le = p(ne)`
-  padding: ${(e) => `${l.sp1}  ${e.windowSize === "small" ? l.sp3 : l.sp4}`};
-  background: ${(e) => e.theme.colors.grey4};
-  border-radius: ${l.sp0} ${l.sp0} ${l.sp2} ${l.sp2};
-  text-align: left;
-  color: ${(e) => e.theme.colors.grey1};
-  display: flex;
-  flex-direction: ${(e) => e.windowSize === "small" ? "column" : "row"};
-  align-items: ${(e) => e.windowSize === "small" ? "flex-start" : "center"};
-  gap: ${(e) => e.windowSize === "small" ? l.sp0 : "6px"};
-`, Me = p.a`
-  color: ${(e) => e.theme.colors.hero};
-  text-decoration: none;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  .arrowIcon {
-    cursor: pointer;
-    height: ${l.sp3};
-    width: ${l.sp3};
-  }
-  :hover {
-    color: ${(e) => e.theme.colors.primary};
-    .arrowIcon {
-      color: ${(e) => e.theme.colors.primary};
-    }
-  }
-`, M = (e, o) => `${e}.${o}`, ie = {
-  largeLabelWidth: new b(125, 140, 160),
-  paddingBottom: new b(u[3], u[2]),
-  toolTipWidth: new b(246, 250)
-}, c = q.getLocalizedStrings().peoplePage, Te = ({
-  user: e,
-  sectionId: o,
-  mode: r,
-  isZeniTenant: s,
-  managersList: i,
-  classList: x,
-  controllersList: P,
-  index: m,
-  customerRoleOptions: $,
-  isEdit: A,
-  isBankingOnlyTenant: v,
-  isCardsOnlyTenant: w
-}) => {
-  const S = E(), {
-    getValues: I,
-    formState: { errors: D },
-    setValue: W
-  } = Q(), j = ie.largeLabelWidth.value(S), [L, ..._] = P, g = _.map((d) => d.email).join(","), a = ue(() => J.roles.filter(
-    (d) => !["admin", "bookkeeping_admin"].includes(d.value)
-  ), []), n = G(e.role);
-  return ge(() => {
-    (n || v || w) && W(`userItems.${m}.department`, {
-      allOptions: [],
-      selectedOption: void 0
-    }), n && W(`userItems.${m}.manager`, {
-      allUsers: [],
-      selectedUser: void 0
-    });
-  }, [n, v, w]), /* @__PURE__ */ t.jsxs(
-    Ze,
-    {
-      windowSize: S,
-      "data-testid": z("invite-people-user-item-section"),
-      children: [
-        /* @__PURE__ */ t.jsx(
-          he,
-          {
-            label: c.invitePage.email,
-            name: M(o, "email"),
-            registerOptions: {
-              required: !0,
-              value: e.email,
-              validate: {
-                duplicate: (d) => !_e(d, I("userItems"), m),
-                notZeniMail: (d) => r === "zeni_only" ? !0 : s || d.map((y) => !y.match(Ie)).reduce((y, R) => y && R)
-              }
-            },
-            placeholder: U(
-              c.addPlaceholderPrefix,
-              c.invitePage.email
-            ),
-            style: {
-              paddingTop: l.sp2,
-              paddingBottom: l.sp2
-            },
-            additionalInfoLabel: He(
-              I("userItems"),
-              M(o, "email"),
-              m,
-              r,
-              D
-            )
-          }
-        ),
-        /* @__PURE__ */ t.jsx(B, {}),
-        r === "off" ? /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-          /* @__PURE__ */ t.jsx(
-            fe,
-            {
-              label: { label: c.invitePage.role, width: j },
-              style: { width: "auto" },
-              rolesDropDownField: {
-                name: M(o, "nonZeniRole"),
-                defaultValue: {
-                  userRole: {
-                    selectedRole: se(e.role),
-                    allRootRole: X(
-                      v,
-                      w
-                    )
-                  },
-                  productsByUserRole: K(
-                    e.role,
-                    $
-                  )
-                },
-                registerOptions: { required: !0 }
-              }
-            }
-          ),
-          /* @__PURE__ */ t.jsx(B, {}),
-          /* @__PURE__ */ t.jsx(
-            ve,
-            {
-              label: {
-                label: c.invitePage.manager,
-                width: j
-              },
-              showTooltip: !0,
-              toolTipWidth: ie.toolTipWidth.valuePx(S),
-              tooltipTitle: /* @__PURE__ */ t.jsx(Ee, {}),
-              userSingleSelectWithSubTitlesField: {
-                name: M(o, "manager"),
-                value: {
-                  allUsers: i,
-                  selectedUser: e.managerId
-                },
-                valueToSubtitle: (d) => {
-                  const y = i.findIndex(
-                    (R) => R.userId === d
-                  );
-                  if (y !== -1) {
-                    const R = i[y], F = x.find(
-                      (N) => N.classId === R.userRole.accountingClassIDs[0]
-                    ), f = [];
-                    return F != null && f.push(F.className), f;
-                  } else
-                    return [];
-                },
-                placeholderLabel: n ? c.notApplicable : U(
-                  c.selectPlaceholderPrefix,
-                  c.invitePage.manager
-                ),
-                registerOptions: {
-                  required: !n
-                },
-                isDisabled: n ? "disabled" : void 0,
-                showOneOffLabel: {
-                  label: "No Manager",
-                  value: "no_manager",
-                  position: "top",
-                  subtitles: []
-                }
-              },
-              style: {
-                width: "auto",
-                height: e.managerId == null ? l.sp8 : "74px",
-                boxSizing: "border-box"
-              },
-              isDisabled: n ? "disabled" : void 0,
-              opacity: n ? 0.32 : 1
-            }
-          ),
-          /* @__PURE__ */ t.jsx(B, {}),
-          /* @__PURE__ */ t.jsx(
-            xe,
-            {
-              label: {
-                label: c.invitePage.department,
-                width: j
-              },
-              singleSelectWithoutClearableField: {
-                name: M(o, "department"),
-                defaultValue: {
-                  allOptions: x.map((d) => ({
-                    label: d.fullyQualifiedAccountingClassName ?? "",
-                    value: d.classId,
-                    hoverText: d.accountingClassNumber
-                  })),
-                  selectedOption: x.map((d) => ({
-                    label: d.fullyQualifiedAccountingClassName ?? "",
-                    value: d.classId,
-                    hoverText: d.accountingClassNumber
-                  })).find((d) => d.value === e.departmentId)
-                },
-                placeholder: n || v || w ? c.notApplicable : U(
-                  c.selectPlaceholderPrefix,
-                  c.invitePage.department
-                ),
-                registerOptions: {
-                  required: !n || !(v || w)
-                },
-                isDisabled: n || v || w ? "disabled" : void 0,
-                showOptionOnHover: !0
-              },
-              style: { width: "auto" },
-              isDisabled: n || v || w ? "disabled" : void 0,
-              opacity: n || v || w ? 0.32 : 1
-            }
-          ),
-          /* @__PURE__ */ t.jsx(B, {}),
-          A ? null : /* @__PURE__ */ t.jsxs(qe, { windowSize: S, isDisabled: n, children: [
-            c.invitePage.controllerText,
-            L ? /* @__PURE__ */ t.jsx(
-              Oe,
-              {
-                firstController: [L],
-                isInvestorBanker: n,
-                restControllerEmailsStr: g
-              }
-            ) : null
-          ] })
-        ] }) : /* @__PURE__ */ t.jsx(
-          be,
-          {
-            label: {
-              label: c.invitePage.role,
-              width: j
-            },
-            zeniRolesDropDownField: {
-              defaultValue: {
-                allOptions: a,
-                selectedOptions: e.role
-              },
-              name: M(o, "role"),
-              placeholderLabel: U(
-                c.selectPlaceholderPrefix,
-                c.invitePage.role
-              ),
-              registerOptions: { required: r === "zeni_only" },
-              isMulti: !1,
-              forZeniUser: !1
-            },
-            style: { width: "auto" }
-          }
-        )
-      ]
-    }
-  );
-}, Ee = () => q.getLocalizedStrings().peoplePage.invitePage.managerTooltipText, _e = (e, o, r) => {
-  const s = o.filter((i) => i.userIndex !== r).map((i) => i.email).flat();
-  return s.length > 0 && e.every((i) => s.includes(i));
-}, Ze = p.div`
-  display: flex;
-  flex-direction: column;
-  background-color: ${(e) => e.theme.colors.grey5};
-  border: 1px solid ${(e) => e.theme.colors.grey3};
-  box-shadow: ${(e) => `${l.sp0} 2px ${l.sp1} ${e.theme.colors.dropShadowNormal}`};
-  border-radius: ${l.sp2};
-  margin-bottom: ${l.sp3};
-  .single-select-field__menu {
-    border: ${(e) => e.windowSize === "small" ? `1px solid ${e.theme.colors.grey3}` : "unset"};
-  }
-`, B = p.div`
-  display: flex;
-  flex: 1;
-  background-color: ${(e) => e.theme.colors.grey3};
-  min-height: 1px;
-  max-height: 1px;
-`, qe = p(ne)`
-  padding: ${(e) => `${l.sp1}  ${e.windowSize === "small" ? l.sp3 : l.sp4}`};
-  background: ${(e) => e.theme.colors.grey4};
-  border-radius: ${l.sp0} ${l.sp0} ${l.sp2} ${l.sp2};
-  text-align: left;
-  color: ${(e) => e.theme.colors.grey1};
-  display: flex;
-  flex-direction: ${(e) => e.windowSize === "small" ? "column" : "row"};
-  align-items: ${(e) => e.windowSize === "small" ? "flex-start" : "center"};
-  gap: ${(e) => e.windowSize === "small" ? l.sp0 : "6px"};
-  opacity: ${(e) => e.isDisabled ? 0.32 : 1};
-`, Be = p.a`
-  color: ${(e) => e.theme.colors.hero};
-  text-decoration: none;
-  cursor: ${(e) => e.isDisabled ? "unset" : "pointer"};
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  .arrowIcon {
-    cursor: pointer;
-    height: ${l.sp2};
-    width: ${l.sp2};
-  }
-  :hover {
-    color: ${(e) => e.isDisabled ? e.theme.colors.grey1 : e.theme.colors.primary};
-    .arrowIcon {
-      color: ${(e) => e.isDisabled ? e.theme.colors.grey1 : e.theme.colors.primary};
-    }
-  }
-`, He = (e, o, r, s, i) => {
-  if (ye(i, o) && i?.userItems && i?.userItems[r]?.email)
-    switch (i?.userItems[r]?.email.type) {
-      case "required":
-        return c.invitePage.defaultHelpText;
-      case "pattern":
-        return e[r].email.forEach((m) => {
-          if (!De.test(m))
-            return c.invitePage.defaultHelpText;
-        }), s === "zeni_only" ? c.invitePage.otherThanZeniMailIDForZeniModeText : c.invitePage.zeniMailIDForNormalModeText;
-      case "duplicate":
-        return c.invitePage.emailAlreadyExist;
-      case "notZeniMail":
-        return c.invitePage.zeniMailIDForNormalModeText;
-      case "validate":
-        return c.invitePage.defaultHelpText;
-      default:
-        return;
-    }
-}, Oe = ({
-  isInvestorBanker: e,
-  firstController: o,
-  restControllerEmailsStr: r
-}) => {
-  let s = "";
-  const i = o[0];
-  return i?.firstName && i?.lastName ? s = `${i?.firstName} ${i?.lastName}` : i?.firstName ? s = i?.firstName : i?.lastName ? s = i?.lastName : s = i?.email ?? "", /* @__PURE__ */ t.jsxs(
-    Be,
-    {
-      isDisabled: e,
-      href: e ? void 0 : `mailto:${o[0]?.email}?cc=${r}&subject=${encodeURIComponent(
-        c.invitePage.emailSubject
-      )}`,
-      children: [
-        /* @__PURE__ */ t.jsx("span", { children: s }),
-        /* @__PURE__ */ t.jsx(ae, { className: "arrowIcon" })
-      ]
-    }
-  );
-}, Ve = (e) => /* @__PURE__ */ t.jsx(
-  ke,
-  {
-    style: e.style,
-    "data-testid": z("user-item-section"),
-    children: e.isEdit ? /* @__PURE__ */ t.jsx(We, { ...e }) : /* @__PURE__ */ t.jsx(Te, { ...e })
-  }
-), ke = p.div`
-  display: flex;
-  flex-direction: column;
-`, T = {
-  paddingBottom: new b(u[3], u[2]),
-  buttonWidth: new b(70, 70),
-  marginBottom: new b(12, u[3]),
-  marginRight: new b(u[2], u[3]),
-  deleteContentMarginLeft: new b(u[0], u[3]),
-  sectionHeaderTitlePaddingTop: new b(u[2], u[2]),
-  containerPaddingTop: new b(u[0], u[3]),
-  addUserWrapperGap: new b(u[1], u[2])
-}, Qe = (e, o, r, s, i, x, P) => ({
-  userIndex: e,
-  email: [],
-  role: s === "zeni_only" ? { allOptions: J.roles, selectedOptions: [] } : void 0,
-  nonZeniRole: s !== "zeni_only" ? {
-    userRole: {
-      selectedRole: void 0,
-      allRootRole: X(
-        x,
-        P
-      )
-    },
-    productsByUserRole: K(
-      [],
-      i
-    )
-  } : void 0,
-  manager: {
-    allUsers: o,
-    selectedUser: void 0
-  },
-  department: {
-    allOptions: r.map((m) => ({
-      label: m.className,
-      value: m.classId
-    })),
-    selectedOption: void 0
-  }
-}), C = q.getLocalizedStrings().peoplePage, ft = ({
-  isDisabled: e,
-  control: o,
-  deleteConfirmationIndex: r,
-  updateDeleteConfirmationIndex: s,
-  style: i,
-  sectionId: x,
-  mode: P,
-  isZeniTenant: m,
-  managersList: $,
-  classList: A,
-  controllersList: v,
-  customerRoleOptions: w,
-  isBankingOnlyTenant: S,
-  isCardsOnlyTenant: I,
-  isEdit: D = !1,
-  person: W,
-  analytics: j
-}) => {
-  const { getValues: L } = Q(), { append: _, remove: g } = Re({
-    name: x,
-    control: o
-  }), a = E(), n = L().userItems, d = () => {
-    const f = n.length - 1, N = Qe(
-      f + 1,
-      $,
-      A,
-      P,
-      w,
-      S,
-      I
-    );
-    setTimeout(() => _(N, { shouldFocus: !0 }));
-  }, y = (f) => {
-    s(f);
-  }, R = () => {
-    s(-1);
-  }, F = () => {
-    setTimeout(() => g(r)), s(-1);
-  };
-  return /* @__PURE__ */ t.jsxs(
-    Xe,
-    {
-      style: i,
-      windowSize: a,
-      "data-testid": z("user-items"),
-      children: [
-        n.length > 0 ? n.map((f, N) => {
-          const je = n.length;
-          let H = {};
-          if (P === "zeni_only")
-            H = {
-              email: f.email,
-              role: Ke(
-                f.role.selectedOptions,
-                D
-              ) ?? void 0
-            };
-          else {
-            const Y = f.nonZeniRole?.userRole.selectedRole, O = Y != null ? (f.nonZeniRole?.productsByUserRole[Y] ?? []).map(
-              (V) => ze(
-                V.selectedOption?.value
-              )
-            ).filter(
-              (V) => V != null
-            ) : [], ee = O.length > 0 ? G(O) : !1;
-            H = {
-              email: f.email,
-              role: O,
-              managerId: ee ? void 0 : f.manager?.selectedUser,
-              departmentId: ee ? void 0 : f.department?.selectedOption?.value
-            };
-          }
-          return /* @__PURE__ */ t.jsxs(
-            Ye,
-            {
-              "data-testid": z(
-                "user-item",
-                f.userIndex.toString()
-              ),
-              children: [
-                D ? null : /* @__PURE__ */ t.jsx(t.Fragment, { children: je > 1 ? /* @__PURE__ */ t.jsx(re, { windowSize: a, children: /* @__PURE__ */ t.jsx(
-                  Ge,
-                  {
-                    curIndex: N,
-                    isDisabled: e,
-                    deleteConfirmationIndex: r,
-                    onDeleteClick: y,
-                    onCancelClick: R,
-                    onRemoveUserItem: F
-                  }
-                ) }) : /* @__PURE__ */ t.jsx(re, { windowSize: a, children: /* @__PURE__ */ t.jsx(we, { children: /* @__PURE__ */ t.jsx(Se, { children: /* @__PURE__ */ t.jsx(Pe, { windowSize: a, children: C.invitePage.user }) }) }) }) }),
-                /* @__PURE__ */ t.jsx(
-                  Ve,
-                  {
-                    isDisabled: e,
-                    sectionId: `${x}.${N}`,
-                    control: o,
-                    user: H,
-                    mode: P,
-                    isZeniTenant: m,
-                    managersList: $,
-                    classList: A,
-                    controllersList: v,
-                    customerRoleOptions: w,
-                    isBankingOnlyTenant: S,
-                    isCardsOnlyTenant: I,
-                    isEdit: D,
-                    person: W,
-                    analytics: j,
-                    index: N
-                  }
-                ),
-                r === N && a === "small" ? /* @__PURE__ */ t.jsx(lt, { children: /* @__PURE__ */ t.jsx(
-                  $e,
-                  {
-                    onCancelClick: R,
-                    onRemoveUserItem: F
-                  }
-                ) }) : null
-              ]
-            },
-            N
-          );
-        }) : null,
-        D ? null : /* @__PURE__ */ t.jsxs(
-          st,
-          {
-            "data-testid": z("all-user-items-add-user-button"),
-            windowSize: a,
-            onClick: () => {
-              d?.();
-            },
-            children: [
-              /* @__PURE__ */ t.jsx(at, {}),
-              /* @__PURE__ */ t.jsx(nt, { children: `${C.invitePage.add} ${C.invitePage.user}` })
-            ]
-          }
-        )
-      ]
-    }
-  );
-}, Ge = ({
-  curIndex: e,
-  deleteConfirmationIndex: o,
-  onDeleteClick: r,
-  onCancelClick: s,
-  onRemoveUserItem: i,
-  isDisabled: x
-}) => {
-  const P = E();
-  return /* @__PURE__ */ t.jsxs(we, { children: [
-    /* @__PURE__ */ t.jsx(Se, { children: /* @__PURE__ */ t.jsx(Pe, { windowSize: P, children: `#${e + 1} ${C.invitePage.user}` }) }),
-    x === void 0 ? /* @__PURE__ */ t.jsx(
-      Je,
-      {
-        curIndex: e,
-        deleteConfirmationIndex: o,
-        onDeleteClick: r,
-        onCancelClick: s,
-        onRemoveUserItem: i
-      }
-    ) : null
-  ] });
-}, Je = ({
-  curIndex: e,
-  deleteConfirmationIndex: o,
-  onDeleteClick: r,
-  onCancelClick: s,
-  onRemoveUserItem: i
-}) => {
-  const x = E();
-  return /* @__PURE__ */ t.jsx(t.Fragment, { children: x === "small" ? /* @__PURE__ */ t.jsx(t.Fragment, { children: o !== e ? /* @__PURE__ */ t.jsx(
-    rt,
-    {
-      "data-testid": z(
-        "delete-icon",
-        e.toString()
-      ),
-      onClick: () => r(e)
-    }
-  ) : null }) : /* @__PURE__ */ t.jsx(t.Fragment, { children: o === e ? /* @__PURE__ */ t.jsx(tt, { children: /* @__PURE__ */ t.jsx(
-    $e,
-    {
-      onCancelClick: s,
-      onRemoveUserItem: i
-    }
-  ) }) : /* @__PURE__ */ t.jsx(
-    et,
-    {
-      "data-testid": z(
-        "all-user-items-delete-icon-wrapper"
-      ),
-      className: "delete-icon-wrapper",
-      onClick: () => r(e),
-      children: /* @__PURE__ */ t.jsx(
-        Ce,
-        {
-          style: { padding: "2px 5px" },
-          enterDelay: 600,
-          title: C.invitePage.remove,
-          placement: "left",
-          children: /* @__PURE__ */ t.jsx(it, {})
-        }
-      )
-    }
-  ) }) });
-}, $e = ({
-  onCancelClick: e,
-  onRemoveUserItem: o
-}) => {
-  const r = E();
-  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-    C.invitePage.deleteConfirmation,
-    /* @__PURE__ */ t.jsxs(
-      ot,
-      {
-        windowSize: r,
-        "data-testid": z("delete-confirmation-wrapper"),
-        children: [
-          /* @__PURE__ */ t.jsx(
-            le,
-            {
-              "data-testid": z("delete-confirmation-cancel-button"),
-              label: C.invitePage.cancel,
-              onClick: e,
-              style: {
-                width: T.buttonWidth.value(r),
-                marginRight: l.sp3
-              },
-              size: "small",
-              variant: "secondary"
-            }
-          ),
-          /* @__PURE__ */ t.jsx(
-            le,
-            {
-              "data-testid": z("delete-confirmation-remove-button"),
-              label: C.invitePage.remove,
-              onClick: o,
-              style: { width: T.buttonWidth.value(r) },
-              size: "small",
-              variant: "danger"
-            }
-          )
-        ]
-      }
-    )
-  ] });
-}, Ke = (e, o) => o ? e : e != null ? [e] : [], Xe = p.div`
-  display: flex;
-  flex-direction: column;
-  padding-top: ${(e) => T.containerPaddingTop.valuePx(e.windowSize)};
-`, Ye = p.div`
-  .delete-icon-wrapper {
-    visibility: hidden;
-  }
-  &:hover {
-    .delete-icon-wrapper {
-      visibility: visible;
-    }
-  }
-`, we = p(de)`
-  display: flex;
-  width: 100%;
-  align-items: center;
-  justify-content: space-between;
-  color: ${(e) => e.theme.colors.champion};
-  margin-top: ${l.sp3};
-  height: ${l.sp5};
-`, Pe = p(de)`
-  color: ${(e) => e.theme.colors.primary};
-`, Se = p.div`
-  display: flex;
-  align-items: center;
-`, et = p.div`
-  width: ${l.sp3};
-  height: ${l.sp3};
-  cursor: pointer;
-  position: relative;
-`, tt = p(ce)`
-  display: flex;
-  color: ${(e) => e.theme.colors.hero};
-  align-items: center;
-`, lt = p.div`
-  display: flex;
-  color: ${(e) => e.theme.colors.hero};
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  padding: ${l.sp0} ${l.sp0} ${l.sp7};
-  gap: ${l.sp2};
-`, ot = p.div`
-  display: flex;
-  margin-left: ${(e) => T.deleteContentMarginLeft.valuePx(e.windowSize)};
-`, re = p.div`
-  display: flex;
-  margin-bottom: ${(e) => T.marginBottom.valuePx(e.windowSize)};
-`, it = p(me)`
-  width: ${l.sp3};
-  height: ${l.sp3};
-  cursor: pointer;
-  color: ${(e) => e.theme.colors.grey1};
-  &:hover {
-    color: ${pe.important};
-  }
-`, rt = p(me)`
-  width: ${l.sp3};
-  height: ${l.sp3};
-  cursor: pointer;
-  color: ${pe.important};
-`, st = p(ce)`
-  cursor: pointer;
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  padding: ${l.sp3} ${l.sp4};
-  gap: ${(e) => T.addUserWrapperGap.valuePx(e.windowSize)};
-
-  width: auto;
-  height: ${l.sp8};
-
-  border: 1px solid ${(e) => e.theme.colors.hero};
-  border-radius: ${l.sp2};
-  color: ${(e) => e.theme.colors.grey1};
-  box-sizing: border-box;
-  &:hover {
-    svg {
-      color: ${(e) => e.theme.colors.primary};
-    }
-    div {
-      color: ${(e) => e.theme.colors.primary};
-    }
-    color: ${(e) => e.theme.colors.primary};
-    border-color: ${(e) => e.theme.colors.primary};
-  }
-  margin-top: ${l.sp3};
-  margin-bottom: ${l.sp9};
-`, at = p(Ne)`
-  width: ${l.sp4};
-  height: ${l.sp4};
-  color: ${(e) => e.theme.colors.hero};
-`, nt = p(Ue)`
-  color: ${(e) => e.theme.colors.hero};
-`;
-export {
-  ft as A
-};