@zeniai/web-components 3.17.21 → 3.17.23

package/dist/DrawerPage-DHx5jAsN.cjs

@@ -0,0 +1,118 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./vendor-.pnpm-DLVCFIC_.cjs"),n=require("@emotion/styled"),t=require("./index-DU9PIUCs.cjs"),j=require("./hyperlink-x_2Dp7cf.cjs"),S=require("./money-CJCMJZfW.cjs"),r={drawerItemPadding:new t.ResponsiveSized(t.sp[3],t.sp[3],t.sp[4]),styledDivMarginLeft:new t.ResponsiveSized(t.sp[6],t.sp[7]),verticalLineLeftMargin:new t.ResponsiveSized(32,42),iconWidth:new t.ResponsiveSized(t.sp[5],t.sp[6]),iconHeight:new t.ResponsiveSized(t.sp[5],t.sp[6]),iconSize:new t.ResponsiveSized(20,t.sp[4])},g={title:new t.ResponsiveSizedStyle("standardRegular","largeRegular"),content:new t.ResponsiveSizedStyle("smallRegular","standardRegular")},l=t.appLocale.getLocalizedStrings().rewardsPage.drawerPage,v=({rewardsPlan:e})=>{const o=[$(),R(),z({rewardsPlan:e})],s=t.useWindowSizeContext();return i.jsxRuntimeExports.jsx(C,{children:o.map((w,m)=>i.jsxRuntimeExports.jsxs(P,{children:[i.jsxRuntimeExports.jsx(b,{children:w}),m<o.length-1?i.jsxRuntimeExports.jsx(L,{windowSize:s}):null]},`step_${m}`))})},$=()=>{const e=t.useWindowSizeContext(),o=l.item1;return i.jsxRuntimeExports.jsxs(d,{windowSize:e,children:[i.jsxRuntimeExports.jsxs(a,{children:[i.jsxRuntimeExports.jsx(x,{windowSize:e,icon:"link",children:i.jsxRuntimeExports.jsx(y,{windowSize:e})}),i.jsxRuntimeExports.jsx(h,{windowSize:e,children:o.title})]}),i.jsxRuntimeExports.jsx(p,{windowSize:e,children:i.jsxRuntimeExports.jsx(u,{windowSize:e,children:o.content})})]})},R=()=>{const e=t.useWindowSizeContext(),o=l.item2;return i.jsxRuntimeExports.jsxs(d,{windowSize:e,children:[i.jsxRuntimeExports.jsxs(a,{children:[i.jsxRuntimeExports.jsx(x,{windowSize:e,icon:"user",children:i.jsxRuntimeExports.jsx(f,{windowSize:e})}),i.jsxRuntimeExports.jsx(h,{windowSize:e,children:o.title})]}),i.jsxRuntimeExports.jsx(p,{windowSize:e,children:i.jsxRuntimeExports.jsx(u,{windowSize:e,children:o.content})})]})},z=({rewardsPlan:e})=>{const o=t.useWindowSizeContext(),s=l.item3;return i.jsxRuntimeExports.jsxs(d,{windowSize:o,children:[i.jsxRuntimeExports.jsxs(a,{children:[i.jsxRuntimeExports.jsx(x,{windowSize:o,icon:"money",children:i.jsxRuntimeExports.jsx(E,{windowSize:o})}),i.jsxRuntimeExports.jsx(h,{windowSize:o,children:s.title[e.planName]})]}),i.jsxRuntimeExports.jsx(p,{windowSize:o,children:i.jsxRuntimeExports.jsx(u,{windowSize:o,children:s.content[e.planName].replace("__reward-amount__",t.amountToString("0,0",e.referrerAmount))})})]})},d=n.div`
+  border: 1px solid ${e=>e.theme.colors.grey3};
+  border-radius: ${t.Space.sp2};
+  box-shadow: ${e=>`${t.Space.sp0} 1px 2px ${t.Space.sp0} ${e.theme.colors.dropShadowNormal}`};
+  padding: ${e=>r.drawerItemPadding.valuePx(e.windowSize)};
+  width: ${e=>`calc(100%- ${r.drawerItemPadding.valuePx(e.windowSize)})`};
+  background-color: ${e=>e.theme.colors.grey5};
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: flex-start;
+`,a=n.div`
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+`,p=n.div`
+  margin-left: ${e=>r.styledDivMarginLeft.valuePx(e.windowSize)};
+`,y=n(j.SvgHyperlink)`
+  height: ${e=>r.iconSize.valuePx(e.windowSize)};
+  width: ${e=>r.iconSize.valuePx(e.windowSize)};
+  color: ${e=>e.theme.colors.graphColor12Dark};
+`,f=n(S.SvgInvitation)`
+  height: ${e=>r.iconSize.valuePx(e.windowSize)};
+  width: ${e=>r.iconSize.valuePx(e.windowSize)};
+  color: ${e=>e.theme.colors.graphColor06Dark};
+`,E=n(S.SvgMoney)`
+  height: ${e=>r.iconSize.valuePx(e.windowSize)};
+  width: ${e=>r.iconSize.valuePx(e.windowSize)};
+  color: ${e=>e.theme.colors.success};
+`,x=n.div`
+  width: ${e=>r.iconWidth.valuePx(e.windowSize)};
+  height: ${e=>r.iconHeight.valuePx(e.windowSize)};
+  border-radius: 50%;
+  background-color: ${e=>e.icon==="link"?e.theme.colors.graphColor14Light:e.icon==="user"?e.theme.colors.graphColor06Light:e.theme.colors.graphColor20Light};
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-right: ${t.Space.sp2};
+`,h=n(t.StyledText)`
+  color: ${e=>e.theme.colors.primary};
+  ${e=>`${g.title.style(e.windowSize)}`};
+`,u=n(t.StyledText)`
+  color: ${e=>e.theme.colors.hero};
+  ${e=>`${g.content.style(e.windowSize)}`};
+`,P=n.div`
+  display: flex;
+  flex-direction: row;
+  position: relative;
+  z-index: 1;
+`,C=n.div`
+  margin-top: ${t.Space.sp4};
+`,L=n.div`
+  top: ${t.Space.sp0};
+  width: 1px;
+  height: 100%;
+  position: absolute;
+  left: ${e=>r.verticalLineLeftMargin.valuePx(e.windowSize)};
+  width: 2px;
+  background: ${e=>e.theme.colors.grey2};
+  z-index: -1;
+`,b=n.div`
+  padding-bottom: ${t.Space.sp4};
+`,{common:{navBar:{back:k}}}=t.appLocale.getLocalizedStrings(),c={navBarContainerPaddingXaxis:new t.ResponsiveSized(10,t.sp[3]),containerPaddingLeft:new t.ResponsiveSized(t.sp[3],t.sp[6],t.sp[8]),containerPaddingRight:new t.ResponsiveSized(t.sp[3],t.sp[6],t.sp[8])},T={title:new t.ResponsiveSizedStyle("standardRegular","largeRegular")},{referAndEarn:I}=t.appLocale.getLocalizedStrings().rewardsPage;function W({rewardsPlan:e,onDismissClick:o}){const s=t.useWindowSizeContext();return i.jsxRuntimeExports.jsxs(B,{windowSize:s,children:[i.jsxRuntimeExports.jsx(q,{windowSize:s,children:i.jsxRuntimeExports.jsxs(D,{windowSize:s,children:[s==="small"&&i.jsxRuntimeExports.jsx(A,{children:i.jsxRuntimeExports.jsx(t.Tooltip,{enterDelay:600,title:k,placement:"bottom",style:{padding:`${t.Space.sp1} ${t.Space.sp2}`},children:i.jsxRuntimeExports.jsx(H,{onClick:o})})}),i.jsxRuntimeExports.jsx(M,{windowSize:s,children:I}),s!=="small"&&i.jsxRuntimeExports.jsx(N,{onClick:o})]})}),i.jsxRuntimeExports.jsx(_,{windowSize:s,children:i.jsxRuntimeExports.jsx(v,{rewardsPlan:e})})]})}const B=n.div`
+  display: flex;
+  flex-direction: column;
+  background-color: ${e=>e.theme.colors.grey4};
+  overflow-x: hidden;
+  width: 100%;
+  height: 100vh;
+  position: relative;
+`,D=n.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 100%;
+  width: ${e=>e.windowSize==="small"?"100%":"76%"};
+`,M=n(t.StyledText)`
+  color: ${e=>e.theme.colors.primary};
+  width: 96%;
+  text-align: center;
+  ${e=>`${T.title.style(e.windowSize)}`};
+`,_=n.div`
+  padding-left: ${e=>c.containerPaddingLeft.valuePx(e.windowSize)};
+  padding-right: ${e=>c.containerPaddingRight.valuePx(e.windowSize)};
+`,q=n.div`
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  top: ${t.Space.sp0};
+  padding: ${e=>`${c.navBarContainerPaddingXaxis.valuePx(e.windowSize)} ${t.Space.sp0}`};
+  z-index: 2;
+  background-color: ${e=>e.theme.colors.grey4};
+`,N=n(t.SvgClose)`
+  cursor: pointer;
+  color: ${e=>e.theme.colors.hero};
+  width: ${t.Space.sp4};
+  height: ${t.Space.sp4};
+  min-height: ${t.Space.sp3};
+  &:hover {
+    color: ${e=>e.theme.colors.primary};
+  }
+`,A=n.div`
+  height: ${t.Space.sp4};
+  width: ${t.Space.sp4};
+  display: flex;
+  align-items: center;
+  margin-left: ${t.Space.sp3};
+`,H=n(t.SvgArrowLeft)`
+  height: ${t.Space.sp4};
+  width: ${t.Space.sp4};
+  cursor: pointer;
+  color: ${e=>e.theme.colors.hero};
+  &:hover {
+    color: ${e=>e.theme.colors.primary};
+  }
+`;exports.default=W;

package/dist/DrawerPage-DXGL0DM7.js

@@ -0,0 +1,208 @@
+import { j as i } from "./vendor-.pnpm-UYinI_7q.js";
+import t from "@emotion/styled";
+import { u as c, a2 as z, S as n, R as a, a as g, aw as d, J as w, D as r, Z as P, G as C, b as L } from "./index-DOFSm78O.js";
+import { S as b } from "./hyperlink-DQyCeXx2.js";
+import { S as k, a as R } from "./money-2cg1MuG4.js";
+const l = {
+  drawerItemPadding: new a(r[3], r[3], r[4]),
+  styledDivMarginLeft: new a(r[6], r[7]),
+  verticalLineLeftMargin: new a(32, 42),
+  iconWidth: new a(r[5], r[6]),
+  iconHeight: new a(r[5], r[6]),
+  iconSize: new a(20, r[4])
+}, f = {
+  title: new d("standardRegular", "largeRegular"),
+  content: new d("smallRegular", "standardRegular")
+}, x = g.getLocalizedStrings().rewardsPage.drawerPage, I = ({
+  rewardsPlan: e
+}) => {
+  const o = [T(), D(), B({ rewardsPlan: e })], s = c();
+  return /* @__PURE__ */ i.jsx(A, { children: o.map((j, y) => /* @__PURE__ */ i.jsxs(W, { children: [
+    /* @__PURE__ */ i.jsx(E, { children: j }),
+    y < o.length - 1 ? /* @__PURE__ */ i.jsx(H, { windowSize: s }) : null
+  ] }, `step_${y}`)) });
+}, T = () => {
+  const e = c(), o = x.item1;
+  return /* @__PURE__ */ i.jsxs(p, { windowSize: e, children: [
+    /* @__PURE__ */ i.jsxs(m, { children: [
+      /* @__PURE__ */ i.jsx(S, { windowSize: e, icon: "link", children: /* @__PURE__ */ i.jsx(M, { windowSize: e }) }),
+      /* @__PURE__ */ i.jsx(u, { windowSize: e, children: o.title })
+    ] }),
+    /* @__PURE__ */ i.jsx($, { windowSize: e, children: /* @__PURE__ */ i.jsx(v, { windowSize: e, children: o.content }) })
+  ] });
+}, D = () => {
+  const e = c(), o = x.item2;
+  return /* @__PURE__ */ i.jsxs(p, { windowSize: e, children: [
+    /* @__PURE__ */ i.jsxs(m, { children: [
+      /* @__PURE__ */ i.jsx(S, { windowSize: e, icon: "user", children: /* @__PURE__ */ i.jsx(_, { windowSize: e }) }),
+      /* @__PURE__ */ i.jsx(u, { windowSize: e, children: o.title })
+    ] }),
+    /* @__PURE__ */ i.jsx($, { windowSize: e, children: /* @__PURE__ */ i.jsx(v, { windowSize: e, children: o.content }) })
+  ] });
+}, B = ({ rewardsPlan: e }) => {
+  const o = c(), s = x.item3;
+  return /* @__PURE__ */ i.jsxs(p, { windowSize: o, children: [
+    /* @__PURE__ */ i.jsxs(m, { children: [
+      /* @__PURE__ */ i.jsx(S, { windowSize: o, icon: "money", children: /* @__PURE__ */ i.jsx(N, { windowSize: o }) }),
+      /* @__PURE__ */ i.jsx(u, { windowSize: o, children: s.title[e.planName] })
+    ] }),
+    /* @__PURE__ */ i.jsx($, { windowSize: o, children: /* @__PURE__ */ i.jsx(v, { windowSize: o, children: s.content[e.planName].replace(
+      "__reward-amount__",
+      z("0,0", e.referrerAmount)
+    ) }) })
+  ] });
+}, p = t.div`
+  border: 1px solid ${(e) => e.theme.colors.grey3};
+  border-radius: ${n.sp2};
+  box-shadow: ${(e) => `${n.sp0} 1px 2px ${n.sp0} ${e.theme.colors.dropShadowNormal}`};
+  padding: ${(e) => l.drawerItemPadding.valuePx(e.windowSize)};
+  width: ${(e) => `calc(100%- ${l.drawerItemPadding.valuePx(e.windowSize)})`};
+  background-color: ${(e) => e.theme.colors.grey5};
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: flex-start;
+`, m = t.div`
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+`, $ = t.div`
+  margin-left: ${(e) => l.styledDivMarginLeft.valuePx(e.windowSize)};
+`, M = t(b)`
+  height: ${(e) => l.iconSize.valuePx(e.windowSize)};
+  width: ${(e) => l.iconSize.valuePx(e.windowSize)};
+  color: ${(e) => e.theme.colors.graphColor12Dark};
+`, _ = t(k)`
+  height: ${(e) => l.iconSize.valuePx(e.windowSize)};
+  width: ${(e) => l.iconSize.valuePx(e.windowSize)};
+  color: ${(e) => e.theme.colors.graphColor06Dark};
+`, N = t(R)`
+  height: ${(e) => l.iconSize.valuePx(e.windowSize)};
+  width: ${(e) => l.iconSize.valuePx(e.windowSize)};
+  color: ${(e) => e.theme.colors.success};
+`, S = t.div`
+  width: ${(e) => l.iconWidth.valuePx(e.windowSize)};
+  height: ${(e) => l.iconHeight.valuePx(e.windowSize)};
+  border-radius: 50%;
+  background-color: ${(e) => e.icon === "link" ? e.theme.colors.graphColor14Light : e.icon === "user" ? e.theme.colors.graphColor06Light : e.theme.colors.graphColor20Light};
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-right: ${n.sp2};
+`, u = t(w)`
+  color: ${(e) => e.theme.colors.primary};
+  ${(e) => `${f.title.style(e.windowSize)}`};
+`, v = t(w)`
+  color: ${(e) => e.theme.colors.hero};
+  ${(e) => `${f.content.style(e.windowSize)}`};
+`, W = t.div`
+  display: flex;
+  flex-direction: row;
+  position: relative;
+  z-index: 1;
+`, A = t.div`
+  margin-top: ${n.sp4};
+`, H = t.div`
+  top: ${n.sp0};
+  width: 1px;
+  height: 100%;
+  position: absolute;
+  left: ${(e) => l.verticalLineLeftMargin.valuePx(e.windowSize)};
+  width: 2px;
+  background: ${(e) => e.theme.colors.grey2};
+  z-index: -1;
+`, E = t.div`
+  padding-bottom: ${n.sp4};
+`, {
+  common: {
+    navBar: { back: X }
+  }
+} = g.getLocalizedStrings(), h = {
+  navBarContainerPaddingXaxis: new a(10, r[3]),
+  containerPaddingLeft: new a(r[3], r[6], r[8]),
+  containerPaddingRight: new a(r[3], r[6], r[8])
+}, G = {
+  title: new d("standardRegular", "largeRegular")
+}, { referAndEarn: J } = g.getLocalizedStrings().rewardsPage;
+function oe({
+  rewardsPlan: e,
+  onDismissClick: o
+}) {
+  const s = c();
+  return /* @__PURE__ */ i.jsxs(V, { windowSize: s, children: [
+    /* @__PURE__ */ i.jsx(K, { windowSize: s, children: /* @__PURE__ */ i.jsxs(Z, { windowSize: s, children: [
+      s === "small" && /* @__PURE__ */ i.jsx(Q, { children: /* @__PURE__ */ i.jsx(
+        P,
+        {
+          enterDelay: 600,
+          title: X,
+          placement: "bottom",
+          style: { padding: `${n.sp1} ${n.sp2}` },
+          children: /* @__PURE__ */ i.jsx(U, { onClick: o })
+        }
+      ) }),
+      /* @__PURE__ */ i.jsx(q, { windowSize: s, children: J }),
+      s !== "small" && /* @__PURE__ */ i.jsx(O, { onClick: o })
+    ] }) }),
+    /* @__PURE__ */ i.jsx(F, { windowSize: s, children: /* @__PURE__ */ i.jsx(I, { rewardsPlan: e }) })
+  ] });
+}
+const V = t.div`
+  display: flex;
+  flex-direction: column;
+  background-color: ${(e) => e.theme.colors.grey4};
+  overflow-x: hidden;
+  width: 100%;
+  height: 100vh;
+  position: relative;
+`, Z = t.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 100%;
+  width: ${(e) => e.windowSize === "small" ? "100%" : "76%"};
+`, q = t(w)`
+  color: ${(e) => e.theme.colors.primary};
+  width: 96%;
+  text-align: center;
+  ${(e) => `${G.title.style(e.windowSize)}`};
+`, F = t.div`
+  padding-left: ${(e) => h.containerPaddingLeft.valuePx(e.windowSize)};
+  padding-right: ${(e) => h.containerPaddingRight.valuePx(e.windowSize)};
+`, K = t.div`
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  top: ${n.sp0};
+  padding: ${(e) => `${h.navBarContainerPaddingXaxis.valuePx(e.windowSize)} ${n.sp0}`};
+  z-index: 2;
+  background-color: ${(e) => e.theme.colors.grey4};
+`, O = t(L)`
+  cursor: pointer;
+  color: ${(e) => e.theme.colors.hero};
+  width: ${n.sp4};
+  height: ${n.sp4};
+  min-height: ${n.sp3};
+  &:hover {
+    color: ${(e) => e.theme.colors.primary};
+  }
+`, Q = t.div`
+  height: ${n.sp4};
+  width: ${n.sp4};
+  display: flex;
+  align-items: center;
+  margin-left: ${n.sp3};
+`, U = t(C)`
+  height: ${n.sp4};
+  width: ${n.sp4};
+  cursor: pointer;
+  color: ${(e) => e.theme.colors.hero};
+  &:hover {
+    color: ${(e) => e.theme.colors.primary};
+  }
+`;
+export {
+  oe as default
+};

package/dist/EditPeoplePage-CgrsD_MU.cjs

@@ -0,0 +1,55 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./vendor-.pnpm-DLVCFIC_.cjs"),j=require("react"),n=require("@emotion/styled"),F=require("@zeniai/client-epic-state"),e=require("./index-DU9PIUCs.cjs"),re=require("./ZeniAvatar-DaRPOzH9.cjs"),ne=require("./AllUserItems-BRfNKMVH.cjs"),E={containerPaddingTop:new e.ResponsiveSized(e.sp[3],e.sp[3]),containerPaddingLeft:new e.ResponsiveSized(e.sp[3],e.sp[6],e.sp[6]),containerPaddingRight:new e.ResponsiveSized(e.sp[3],e.sp[6],e.sp[8]),buttonWidth:new e.ResponsiveSized(85,85),marginBottom:new e.ResponsiveSized(e.sp[3],e.sp[3])},L="editPeoplePage",S="userItems",a=e.appLocale.getLocalizedStrings().peoplePage,ie=({peopleDetails:t,managersList:p,classList:P,controllersList:w,mode:c,isZeniTenant:b,onCloseClick:$,onResetClick:I,onSaveClick:u,onDeleteUser:H,onPeopleLocalDataUpdated:G,analytics:q,isReimbursementDisabled:B,isZeniAccountsDisabled:k,isChargeCardDisabled:A,isTreasuryDisabled:O,isBankingOnlyTenant:R,isCardsOnlyTenant:h,isLiteRoleDisabled:V})=>{const y=e.useWindowSizeContext(),[Q,_]=j.useState(!1),[J,K]=j.useState(-1),X=c==="zeni_only"?a.invitePage.editZeniTitle:a.invitePage.editTitle,Y=j.useRef(null),z=j.useMemo(()=>e.getUpdatedRoles(B,k,A,R,h,V,O),[B,k,A,R,h,V,O]),Z=o.useTheme(),i=o.useForm({mode:"onBlur",reValidateMode:"onChange",defaultValues:M(t.people,p,P,c,z,R,h),values:M(t.people,p,P,c,z,R,h)}),D=i.handleSubmit(()=>{T()&&u()},()=>{T(),console.warn("Edit Profile form error")}),T=()=>{const m=i.getValues();let r=!0;return m.userItems.forEach((x,v)=>{const{role:N,department:l,nonZeniRole:g,manager:d}=x;if(c==="zeni_only"){const s=N.selectedOptions;(!s?.length||s?.length===1&&s?.includes("company_officer"))&&(i.setError(`${S}.${v}.role`,{type:"required"}),r=!1)}else{const s=g?.userRole.selectedRole;(s!=null&&g!=null?g.productsByUserRole[s].map(f=>f.selectedOption).filter(f=>f!=null):[]).length<1&&(i.setError(`${S}.${v}.nonZeniRole.userRole.selectedRole`,{type:"required"}),r=!1),s!=="investor_or_banker"&&l?.selectedOption==null&&(R||h||(i.setError(`${S}.${v}.department`,{type:"required"}),r=!1)),d?.selectedUser==null&&s!=="investor_or_banker"&&(i.setError(`${S}.${v}.manager`,{type:"required"}),r=!1)}}),r},ee=async(m,r)=>{const x=[],{userItems:v}=r,N=t.person?.userRole?.userRoleId;v.forEach(l=>{let g={};if(N!=null){if(c==="zeni_only")g={email:l.email,role:l.role.selectedOptions};else{const d=l.nonZeniRole?.userRole.selectedRole;let s=[];d==="admin"||d==="investor_or_banker"?s.push(d):s=d!=null?(l.nonZeniRole?.productsByUserRole[d]??[]).map(f=>F.toUserRoleTypeStrict(f.selectedOption?.value)).filter(f=>f!=null):[],d==="employee"&&s.length===0&&s.push("reimbursements_user");const U=F.hasInvestorBankerLevelAccess(s);g={email:l.email,role:s,departmentId:U?void 0:l.department?.selectedOption?.value,managerId:U?void 0:l.manager?.selectedUser}}x.push(g)}}),G(x)};j.useEffect(()=>{const m=i.watch((r,{name:x})=>{x!=null&&r!=null&&ee(x,r)});return()=>{m.unsubscribe()}});const te=()=>{_(!0)},oe={onOkClick:()=>{const m=t.person;q?.trackRemoveUserAccess(m.userRole.userRoles,m.userRole.userEmail),H?.(t.person)},onCancelClick:()=>{_(!1)}},W=e.usePrevious(t.person?.update),C=t.person?.update,se=a.deleteOverlay.description.replace("‘_user-name_’",`"${t.person?.user?.firstName} ${t.person?.user?.lastName}"`);return j.useEffect(()=>{C==null&&W==="removeUsers"&&(_(!1),I?.())},[C,W]),o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[Q===!0?o.jsxRuntimeExports.jsx(e.ConfirmationPopup,{titleComponent:o.jsxRuntimeExports.jsx(e.ConfirmationPopUpTitle,{children:a.deleteOverlay.title}),descriptionComponent:o.jsxRuntimeExports.jsx(e.ConfirmationPopUpDescription,{children:se}),primaryButtonText:a.deleteOverlay.remove,secondaryButtonText:a.deleteOverlay.cancel,action:oe,proceedButtonVariant:"danger",isLoading:C==="removeUsers",isDisabled:C==="removeUsers",style:{background:Z.colors.overlayColor},children:t.person?.user!=null?o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[o.jsxRuntimeExports.jsx(ge,{}),o.jsxRuntimeExports.jsx(me,{children:o.jsxRuntimeExports.jsx(xe,{src:t.person?.user.photo?.toString()??e.AvatarSVG,alt:t.person?.user.userId,loading:"lazy"})})]}):null}):null,o.jsxRuntimeExports.jsx(e.NavBarWithClose,{title:X,backgroundColor:Z.colors.grey4,style:{zIndex:4},onCloseClick:$,isTitleAlignLeft:y==="small"}),o.jsxRuntimeExports.jsxs(ae,{"data-testid":e.generateDataTestId("edit-people-page-container"),windowSize:y,ref:Y,children:[o.jsxRuntimeExports.jsxs(ue,{children:[o.jsxRuntimeExports.jsx(re.ZeniAvatar,{personBasic:t.person?.user,styles:{height:e.Space.sp6,width:e.Space.sp6}}),o.jsxRuntimeExports.jsxs(ce,{children:[o.jsxRuntimeExports.jsx(de,{children:t.person?.user?.firstName?o.jsxRuntimeExports.jsxs(pe,{children:[t.person?.user?.firstName??""," ",t.person?.user?.lastName??""]}):null}),o.jsxRuntimeExports.jsx(Re,{className:"delete-icon-wrapper","data-testid":e.generateDataTestId("edit-people-page-delete-icon-wrapper"),onClick:te,children:o.jsxRuntimeExports.jsx(e.Tooltip,{style:{padding:"2px 5px"},enterDelay:600,title:a.deleteOverlay.title,placement:"top",children:o.jsxRuntimeExports.jsx(fe,{windowsize:y})})})]})]}),o.jsxRuntimeExports.jsx(o.FormProvider,{...i,children:o.jsxRuntimeExports.jsx("form",{id:`${L}_form`,onSubmit:D,children:o.jsxRuntimeExports.jsx(ne.AllUserItems,{control:i.control,sectionId:S,deleteConfirmationIndex:J,updateDeleteConfirmationIndex:K,mode:c,isZeniTenant:b,classList:P,managersList:p,controllersList:w,customerRoleOptions:z,isBankingOnlyTenant:R,isCardsOnlyTenant:h,isEdit:!0,person:t.person,analytics:q})})})]}),o.jsxRuntimeExports.jsx(e.Footer,{formId:`${L}_form`,"data-testid":e.generateDataTestId("edit-people-page-footer"),primaryBtn:{label:a.invitePage.update,style:{width:E.buttonWidth.value(y)},isLoading:t.updatePersonState.fetchState==="In-Progress",isDisabled:t.updatePersonState.fetchState==="In-Progress"},showCancel:!0,cancelBtn:{label:a.invitePage.cancel,style:{width:E.buttonWidth.value(y)},shouldResetOnCancel:!1,onClick:$},separatorStyle:{marginRight:e.Space.sp4}})]})},M=(t,p,P,w,c,b,$)=>{const I=P.map(u=>({label:u.fullyQualifiedAccountingClassName??"",value:u.classId,hoverText:u.accountingClassNumber}));return{[S]:[{userIndex:0,email:t[0].email,role:w==="zeni_only"?{allOptions:e.ZeniRolesConstants.roles,selectedOptions:t[0]?.role}:void 0,nonZeniRole:w!=="zeni_only"?{userRole:{selectedRole:e.getSelectedRootRole(t[0]?.role),allRootRole:e.getAllRootRoles(b,$)},productsByUserRole:e.getProductWiseRoleOptions(t[0]?.role,c)}:void 0,manager:{allUsers:p,selectedUser:t[0]?.managerId?t[0]?.managerId:"no_manager"},department:{allOptions:I,selectedOption:I.find(u=>u.value===t[0]?.departmentId)}}]}},le=(t,p)=>`${t}.${p}`,ae=n.div`
+  display: flex;
+  flex-direction: column;
+  background-color: ${t=>t.theme.colors.grey4};
+  padding-left: ${t=>`${E.containerPaddingLeft.valuePx(t.windowSize)}`};
+  padding-right: ${t=>`${E.containerPaddingRight.valuePx(t.windowSize)}`};
+  overflow-x: hidden;
+  height: 100%;
+  padding-top: ${t=>`${E.containerPaddingTop.valuePx(t.windowSize)}`};
+  gap: ${e.Space.sp2};
+`,ce=n.div`
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  gap: 5px;
+  flex: 1;
+`,de=n.div``,pe=n(e.LargeMedium)`
+  color: ${t=>t.theme.colors.primary};
+`,ue=n.div`
+  display: flex;
+  gap: ${e.Space.sp2};
+  align-items: center;
+  margin: ${e.Space.sp0} ${e.Space.sp1};
+`,me=n.div`
+  position: absolute;
+  top: -26px;
+`,xe=n.img`
+  height: 60px;
+  width: 60px;
+  border-radius: 50%;
+  color: ${t=>t.theme.colors.hero};
+`,ge=n.div`
+  position: absolute;
+  top: 1%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  height: 62px;
+  width: ${e.Space.sp9};
+  border-radius: 50% 50% 0 0;
+  background-color: ${t=>t.theme.colors.grey5};
+`,fe=n(e.SvgDelete)`
+  width: ${e.Space.sp3};
+  height: ${e.Space.sp3};
+  cursor: pointer;
+  color: ${t=>t.windowsize==="small"?e.Colors.important:t.theme.colors.hero};
+  &:hover {
+    color: ${e.Colors.important};
+  }
+`,Re=n.div`
+  width: ${e.Space.sp3};
+  height: ${e.Space.sp3};
+  cursor: pointer;
+  position: relative;
+`;exports.default=ie;exports.uniqueName=le;