@zeniai/web-components 3.17.10 → 3.17.12

package/dist/NotificationSettingsPage-YdTDwRGq.cjs

@@ -0,0 +1,163 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("./vendor-.pnpm-D0ILHvHB.cjs"),b=require("react"),o=require("@emotion/styled"),w=require("@zeniai/client-epic-state"),t=require("./index-CDBWihyC.cjs"),J=require("./BusyIndication-DGF5d74O.cjs"),{common:K}=t.appLocale.getLocalizedStrings(),z={notePadding:new t.ResponsiveSized(t.sp[3],t.sp[4]),noteGap:new t.ResponsiveSized(t.sp[0],6)},O=(e,i)=>`${e}.${i}`,Q=o.div`
+  display: flex;
+  flex-direction: column;
+  row-gap: ${t.Space.sp3};
+`,X=o.div`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+`,Z=o(t.LargeMedium)`
+  color: ${e=>e.theme.colors.primary};
+`,ee=o.div`
+  border-radius: ${t.Space.sp2};
+  border: 1px solid ${e=>e.theme.colors.grey3};
+  box-shadow: ${e=>`${t.Space.sp0} 2px ${t.Space.sp1} ${e.theme.colors.dropShadowNormal}`};
+`,te=o.div`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  border-bottom: 1px solid ${e=>e.theme.colors.grey3};
+  padding: ${t.Space.sp3} ${t.Space.sp7} ${t.Space.sp3} ${t.Space.sp4};
+  pointer-events: ${e=>e.disabled?"none":"all"};
+  background-color: ${e=>e.theme.colors.grey5};
+  &:hover {
+    outline: 1px solid ${e=>e.theme.colors.primary};
+    border-top-right-radius: ${t.Space.sp2};
+    border-top-left-radius: ${t.Space.sp2};
+  }
+`,ne=o.div`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  border-bottom: ${e=>e.lastElement===!0?"unset":`1px solid ${e.theme.colors.grey3}`};
+  padding: ${t.Space.sp2} ${t.Space.sp1} ${t.Space.sp2} ${t.Space.sp4};
+  background-color: ${e=>e.theme.colors.grey5};
+  &:hover {
+    outline: 1px solid ${e=>e.theme.colors.primary};
+    border-bottom-right-radius: ${t.Space.sp2};
+    border-bottom-left-radius: ${t.Space.sp2};
+  }
+`,oe=o.a`
+  color: ${e=>e.theme.colors.hero};
+  text-decoration: none;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  .arrowIcon {
+    cursor: pointer;
+    height: 12px;
+    width: 12px;
+  }
+  :hover {
+    color: ${e=>e.theme.colors.primary};
+    .arrowIcon {
+      color: ${e=>e.theme.colors.primary};
+    }
+  }
+`,F=o.div`
+  flex: 1;
+`,q=o(t.StandardRegular)`
+  color: ${e=>e.theme.colors.hero};
+`,ie=o(t.SmallRegular)`
+  color: ${e=>e.theme.colors.primary};
+  flex: 1;
+  width: 120px;
+  text-align: center;
+`,se=o(t.ExtraSmallRegular)`
+  padding: ${e=>`${t.Space.sp1}  ${z.notePadding.valuePx(e.windowSize)}`};
+  background: ${e=>e.theme.colors.grey4};
+  border-radius: ${t.Space.sp0} ${t.Space.sp0} ${t.Space.sp2} ${t.Space.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=>z.noteGap.valuePx(e.windowSize)};
+`,re=o.div``,le=o.span``;function ce({sectionId:e,monthEndInsightsNotificationLocalData:i,monthEndInsightsNotificationSettings:s,managersList:l,allUsers:g,classList:u,controllersList:f}){const m=n.useTheme(),a=t.useWindowSizeContext(),{sectionTitle:S,monthEndInsights:c,mode:j}=K.settings.notifications,x=f[0],I=f.slice(1).reduce((d,r)=>d.concat(`${r.email},`),"");return n.jsxRuntimeExports.jsxs(Q,{children:[n.jsxRuntimeExports.jsxs(X,{children:[n.jsxRuntimeExports.jsx(Z,{children:S.monthEndInsights}),n.jsxRuntimeExports.jsx(re,{children:n.jsxRuntimeExports.jsx(ie,{children:j.email})})]}),n.jsxRuntimeExports.jsxs(ee,{children:[n.jsxRuntimeExports.jsxs(te,{disabled:s.enabled==null,children:[n.jsxRuntimeExports.jsx(q,{children:c.labels.notifyMe}),n.jsxRuntimeExports.jsx(t.ControlledCheckBoxField,{defaultChecked:i.notify,checkBoxValue:O(e,"notify"),name:O(e,"notify"),checkedIconColor:s.enabled==null?m.colors.grey2:void 0})]}),n.jsxRuntimeExports.jsx(t.ControlledComponent,{controller:s.enabled!=null,children:n.jsxRuntimeExports.jsxs(ne,{children:[n.jsxRuntimeExports.jsx(F,{children:n.jsxRuntimeExports.jsx(q,{children:c.labels.notifyOthers})}),n.jsxRuntimeExports.jsx(F,{children:n.jsxRuntimeExports.jsx(t.UserMultiSelectField,{hideEmailTooltip:!1,showBackgroundColorIfHasAnySelectedOption:!1,shouldHaveBackgroundColor:!1,value:{allUsers:g,selectedUsers:g.filter(d=>i.recipientEmailIds.includes(d.email)),allNonUsers:[],selectedNonUsers:[]},hideMultiValueOnBlur:!1,valueToSubtitle:d=>{const r=l.findIndex(p=>p.userId===d),$=[];if(r!==-1){const p=l[r],E=t.getSingleRoleInOrder(p.userRole.userRoles);E.length>0&&$.push(E);const y=u.find(N=>N.classId===p.userRole.accountingClassIDs[0]);return y!=null&&$.push(y.className),$}else return[]},name:O(e,"recipientEmailIds"),placeholderLabel:c.userFieldPlaceholder,customStyleConfig:{valueContainer:(d,{selectProps:r})=>({justifyContent:r.menuIsOpen===!1?"flex-end":"flex-start"}),input:(d,{selectProps:r})=>({display:r.menuIsOpen===!1?"none":"inline-grid"}),control:(d,{selectProps:r})=>({backgroundColor:r.menuIsOpen===!0?m.colors.background:"unset"}),container:(d,{selectProps:r})=>({backgroundColor:r.menuIsOpen===!0?m.colors.background:"unset"}),multiValue:(d,{selectProps:r})=>({outline:r.menuIsOpen===!1?"unset":`1px solid ${m.colors.primary}`})}})})]})}),n.jsxRuntimeExports.jsx(t.ControlledComponent,{controller:s.enabled==null,children:n.jsxRuntimeExports.jsxs(se,{windowSize:a,children:[c.stopReceivingEmailsText,x?n.jsxRuntimeExports.jsxs(oe,{href:`mailto:${x.email}?cc=${I}&subject=${encodeURIComponent(c.stopReceivingMonthEndInsightsSubject)}`,children:[n.jsxRuntimeExports.jsx(le,{children:`${x.firstName} ${x.lastName}`}),n.jsxRuntimeExports.jsx(t.SvgArrowRight,{className:"arrowIcon"})]}):null]})})]})]})}const B=(e,i,s)=>`${e}.${i}.${s}`,ae=o.div`
+  display: flex;
+  flex-direction: column;
+  row-gap: ${t.Space.sp3};
+`,de=o.div`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+`,pe=o(t.LargeMedium)`
+  color: ${e=>e.theme.colors.primary};
+`,T=o.div`
+  display: flex;
+`,A=o(t.SmallRegular)`
+  color: ${e=>e.theme.colors.primary};
+  flex: 1;
+  width: 120px;
+  text-align: center;
+`,ue=o.div`
+  width: 120px;
+  display: flex;
+`,me=o.div`
+  width: 120px;
+  display: flex;
+  padding-right: 12px;
+`,xe=o(t.StandardRegular)`
+  color: ${e=>e.theme.colors.hero};
+`,ge=o.div`
+  border-radius: ${t.Space.sp2};
+  border: 1px solid ${e=>e.theme.colors.grey3};
+  box-shadow: ${e=>`${t.Space.sp0} 2px ${t.Space.sp1} ${e.theme.colors.dropShadowNormal}`};
+`,he=o.div`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  border-bottom: ${e=>e.lastElement===!0?"unset":`1px solid ${e.theme.colors.grey3}`};
+  background-color: ${e=>e.theme.colors.grey5};
+  padding: ${t.Space.sp2} ${t.Space.sp0} ${t.Space.sp2} ${t.Space.sp4};
+  &:hover {
+    outline: 1px solid ${e=>e.theme.colors.primary};
+    border-top-right-radius: ${e=>e.firstElement===!0?t.Space.sp2:t.Space.sp0};
+    border-top-left-radius: ${e=>e.firstElement===!0?t.Space.sp2:t.Space.sp0};
+    border-bottom-left-radius: ${e=>e.lastElement===!0?t.Space.sp2:t.Space.sp0};
+    border-bottom-right-radius: ${e=>e.lastElement===!0?t.Space.sp2:t.Space.sp0};
+  }
+`;function fe({sectionId:e,remindersLocalData:i,reminderNotificationSettings:s}){const{texts:l,settings:g}=t.appLocale.getLocalizedStrings().common,{notifications:u}=g,f=w.NOTIFICATION_MODES.slice(0,1),m=w.REMINDER_NOTIFICATION_TYPES.filter(a=>s[a]!=null);return n.jsxRuntimeExports.jsxs(ae,{children:[n.jsxRuntimeExports.jsxs(de,{children:[n.jsxRuntimeExports.jsx(pe,{children:u.sectionTitle.reminders}),n.jsxRuntimeExports.jsxs(T,{children:[n.jsxRuntimeExports.jsx(A,{children:l.frequency}),n.jsxRuntimeExports.jsx(A,{children:u.mode.email})]})]}),n.jsxRuntimeExports.jsx(ge,{children:m.map((a,S)=>n.jsxRuntimeExports.jsxs(he,{firstElement:S===0,lastElement:S===m.length-1,children:[n.jsxRuntimeExports.jsx(xe,{children:u.reminders[a]}),n.jsxRuntimeExports.jsxs(T,{children:[n.jsxRuntimeExports.jsx(me,{children:n.jsxRuntimeExports.jsx(t.SingleSelectPickerField,{defaultValue:{allOptions:u.reminderFrequencyOptions,selectedOption:i[a].frequency},name:B(e,a,"frequency")})}),n.jsxRuntimeExports.jsx(ue,{children:n.jsxRuntimeExports.jsx(t.LabeledGroupedCheckBoxField,{mode:"always_on",checkBoxes:f.map(c=>({label:"",value:c,defaultChecked:i[a].preferredMode.includes(c),groupLabel:!1})),name:B(e,a,"preferredMode"),style:{flexDirection:"row"},checkBoxContainerStyle:{justifyContent:"center"}})})]})]},a))})]})}const P={contentPadding:new t.ResponsiveSized(t.sp[3],t.sp[8])},h="reminders",R="monthEndInsights",U="notificationSettingsPage",L=e=>`${e}_form`,{settings:H,reloadPage:Se}=t.appLocale.getLocalizedStrings().common,je=e=>{const i=n.useTheme(),s=t.useWindowSizeContext(),{notificationSettingsView:l,signedInUser:g,onFormDataChange:u,resetUpdateStatus:f,onSave:m,onCancel:a,onClickMenuIcon:S}=e,{notificationSettingsLocalData:c,allUsers:j,notificationSettings:x,classList:I,managersList:d,updateStatus:r,controllersList:$}=l,p=n.useForm({defaultValues:_(c,j)}),E=b.useCallback(k=>{u(ve(k))},[u]),y=p.handleSubmit(()=>{m()}),N=b.useCallback(()=>{p.reset(),a()},[a]);b.useEffect(()=>{l.updateStatus.fetchState==="Completed"&&(p.reset(_(c,j)),f())},[c,l.updateStatus.fetchState,j]),b.useEffect(()=>{const k=p.watch((M,{name:Y})=>{Y!=null&&M!=null&&n.defer(()=>E(M))});return()=>{k.unsubscribe()}},[p,E]);const D=Object.keys(p.formState.dirtyFields).length>0,G=g.userEmail!=null?w.isMonthEndNotificationsSectionVisibleOnSettingsPage(x.monthEndInsightsNotificationSettings,g.userEmail):!1,W=w.isRemindersSectionVisibleOnSettingsPage(x.reminderNotificationSettings);return n.jsxRuntimeExports.jsxs(n.jsxRuntimeExports.Fragment,{children:[n.jsxRuntimeExports.jsxs(Ee,{children:[n.jsxRuntimeExports.jsx(t.NavBar,{source:"NotificationSettingsPage",title:H.title.notifications,backgroundColor:i.colors.grey4,showBackButton:!1,showMenuIcon:s==="medium-compact"||s==="small",onClickMenuIcon:S}),n.jsxRuntimeExports.jsx(Re,{windowSize:s,children:n.jsxRuntimeExports.jsx(n.FormProvider,{...p,children:n.jsxRuntimeExports.jsx("form",{id:L(U),onSubmit:y,children:n.jsxRuntimeExports.jsxs(ye,{children:[n.jsxRuntimeExports.jsx(t.ControlledComponent,{controller:W,children:n.jsxRuntimeExports.jsx(fe,{reminderNotificationSettings:x.reminderNotificationSettings,remindersLocalData:c.reminders,sectionId:h})}),n.jsxRuntimeExports.jsx(t.ControlledComponent,{controller:G,children:n.jsxRuntimeExports.jsx(ce,{monthEndInsightsNotificationLocalData:c.monthEndInsights,monthEndInsightsNotificationSettings:x.monthEndInsightsNotificationSettings,sectionId:R,allUsers:j,classList:I,managersList:d,controllersList:$})})]})})})})]}),n.jsxRuntimeExports.jsx(t.ControlledComponent,{controller:D,children:n.jsxRuntimeExports.jsx(t.Footer,{style:{width:"100%"},formId:L(U),primaryBtn:{label:t.appLocale.getLocalizedStrings().common.footer.save,isLoading:r.fetchState==="In-Progress",style:{width:"82px"}},cancelBtn:{label:t.appLocale.getLocalizedStrings().common.footer.cancel,onClick:N,style:{width:"82px"}}})})]})};function $e(e){const{notificationSettingsView:i,onRefresh:s}=e,{fetchState:l}=i;return l==="Not-Started"||l==="In-Progress"?n.jsxRuntimeExports.jsx(V,{children:n.jsxRuntimeExports.jsx(J.BusyIndication,{fetchState:l,styles:{margin:t.Space.sp0}})}):l==="Error"?n.jsxRuntimeExports.jsxs(V,{children:[n.jsxRuntimeExports.jsx(be,{onClick:s,children:n.jsxRuntimeExports.jsx(t.SvgReload,{})}),n.jsxRuntimeExports.jsx(Ce,{children:Se.label})]}):n.jsxRuntimeExports.jsx(je,{...e})}const Ee=o.div`
+  display: flex;
+  width: 100%;
+  min-height: 100vh;
+  flex-direction: column;
+  row-gap: ${t.Space.sp3};
+  background-color: ${e=>e.theme.colors.grey4};
+`,V=o.div`
+  display: flex;
+  height: 100vh;
+  width: 100%;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  row-gap: ${t.Space.sp3};
+  background-color: ${e=>e.theme.colors.grey4};
+`,Re=o.div`
+  padding-left: ${e=>P.contentPadding.valuePx(e.windowSize)};
+  padding-right: ${e=>P.contentPadding.valuePx(e.windowSize)};
+  padding-bottom: ${e=>P.contentPadding.valuePx(e.windowSize)};
+`,ye=o.div`
+  display: flex;
+  flex-direction: column;
+  row-gap: ${t.Space.sp8};
+`,be=o.div`
+  height: 96px;
+  width: 96px;
+  background: ${e=>e.theme.colors.background};
+  border-radius: 50%;
+  cursor: pointer;
+  & svg {
+    margin: ${t.Space.sp5};
+    color: ${e=>e.theme.colors.grey1};
+  }
+  &:hover {
+    & svg {
+      color: ${e=>e.theme.colors.primary};
+    }
+  }
+`,Ce=o(t.SmallRegularSp)`
+  margin-top: ${t.Space.sp3};
+  color: ${e=>e.theme.colors.hero};
+`;function C(e){const i=H.notifications.reminderFrequencyOptions;return{preferredMode:e.preferredMode,frequency:{selectedOption:e.frequency,allOptions:i}}}function _(e,i){return{[h]:{missingReceiptNotification:C(e.reminders.missingReceiptNotification),uncategorizedTransactionNotification:C(e.reminders.uncategorizedTransactionNotification),pendingBillApprovalNotification:C(e.reminders.pendingBillApprovalNotification),pendingReimbursementApprovalNotification:C(e.reminders.pendingReimbursementApprovalNotification)},[R]:{notify:e.monthEndInsights.notify,recipientEmailIds:{allNonUsers:[],selectedNonUsers:[],allUsers:i,selectedUsers:i.filter(l=>e.monthEndInsights.recipientEmailIds.includes(l.email))}}}}function v(e){return{preferredMode:e.preferredMode,frequency:e.frequency.selectedOption}}function ve(e){return{[h]:{missingReceiptNotification:v(e[h].missingReceiptNotification),uncategorizedTransactionNotification:v(e[h].uncategorizedTransactionNotification),pendingBillApprovalNotification:v(e[h].pendingBillApprovalNotification),pendingReimbursementApprovalNotification:v(e[h].pendingReimbursementApprovalNotification)},[R]:{...e[R],recipientEmailIds:e[R].recipientEmailIds.selectedUsers.map(s=>s.email)}}}exports.default=$e;exports.uniqueName=L;

package/dist/NotificationsListConfig-Bgf4NE0c.cjs

@@ -0,0 +1 @@
+"use strict";const _=require("./index-CDBWihyC.cjs"),T=_.sp[5],E=59,I=_.sp[5],L=_.textStyles.standardRegular.lineHeightValue,A=1,U=1e3;exports.ARBITRARY_ITEM_COUNT=U;exports.DEFAULT_LIST_GROUP_GAP=I;exports.DEFAULT_LIST_GROUP_LABEL_HEIGHT_REGULAR=E;exports.DEFAULT_LIST_ITEM_LINE_HEIGHT=L;exports.DEFAULT_LIST_ITEM_PADDING=T;exports.OVERSCAN_COUNT=A;

package/dist/NotificationsListConfig-DpRgkfQu.js

@@ -0,0 +1,10 @@
+import { t as s, D as _ } from "./index-HuMzFv1o.js";
+const t = _[5], a = 59, E = _[5], A = s.standardRegular.lineHeightValue, I = 1, L = 1e3;
+export {
+  L as A,
+  A as D,
+  I as O,
+  t as a,
+  a as b,
+  E as c
+};