@zeniai/web-components 3.16.71 → 3.16.72

package/dist/NotificationsPage-DtLLEHUr.cjs

@@ -0,0 +1,685 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./vendor-.pnpm-CT-Z_-kn.cjs"),S=require("react"),_=require("@emotion/react"),a=require("@emotion/styled"),g=require("@zeniai/client-epic-state"),e=require("./index-DaOROfUT.cjs"),me=require("./double-tick-BkY2cNWK.cjs"),xe=require("./SubTabSwitcher--JsxD49f.cjs"),At=require("./useLongPress-CfU5Fhb6.cjs"),z=require("./NotificationsListConfig-B9MErmDx.cjs");function he({tabs:t,selectedTab:s,subTabs:i,selectedSubTab:n,subTabRightComponent:r,tabStyle:c,subTabStyle:d,onTabChange:l,onSubTabChange:m}){const h=e.useWindowSizeContext(),u=o.useTheme(),p=S.useCallback(f=>{l(f.id)},[l]),x=S.useCallback(f=>{m(f.id)},[m]);return t.length===0?null:o.jsxRuntimeExports.jsxs(fe,{windowSize:h,children:[o.jsxRuntimeExports.jsx(e.TabSwitcher,{allTabs:t,selectedTab:s,containerStyle:{...c,borderBottom:`1px solid ${u.colors.grey3}`},onTabChange:p}),o.jsxRuntimeExports.jsx(xe.SubTabSwitcher,{allTabs:i,selectedTab:n,containerStyle:{...d},rightComponent:r,onTabChange:x})]})}const fe=a.div`
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+`,{common:{timeStrings:Mt,strings:ge},dateFormat:pt,timeFormat:Se}=e.appLocale.getLocalizedStrings(),Ot=["today","yesterday","last_7_days_this_month","earlier_this_month","earlier_that_month"],X=t=>t.type.concat(ge.underscore).concat(t.start.format(pt.visual.DdashMMdashYYYYFormat)),et=t=>{switch(t.type){case"today":case"yesterday":case"earlier_this_month":case"last_7_days_this_month":return Mt[t.type];case"earlier_that_month":return t.start.format(pt.visual.MMMYYYYFormat)}},Ft=t=>{const s=g.zeniDate(t.toUTCString()),i=g.dateNow(),n=i.diff(s,"minutes"),r=i.diff(s,"seconds"),c=60,d=24*60;return r<=c?Mt.justNow:n<d&&e.isDateOfNDay(s,0)?s.format(Se.hhmmAFormat):s.format(pt.visual.MMMDFormat)},xt=t=>{switch(t.code){case"todo":return e.Colors.important;case"in_progress":return e.Colors.info;case"on_hold":return e.Colors.alert;case"done":return e.Colors.championLight;case"resolved":return e.Colors.successDark;default:return e.Colors.neutralGrey2Light}},{commentsAndNotifications:{notifications:{actionStrings:{comments:je}}}}=e.appLocale.getLocalizedStrings(),Pt=t=>{t.sort((r,c)=>g.zeniDate(r.inboxNotification.notifiedAt.toUTCString()).isAfter(g.zeniDate(c.inboxNotification.notifiedAt.toUTCString()))===!0?1:-1);let s=[...t];const i=[];let n={singleGroup:[],remainingData:[]};for(const r of Ot){let c=0,d=0,l=g.dateNow().subtract(Math.min(g.dateNow().date(),c),"d").startOf("d"),m=g.dateNow().subtract(Math.min(g.dateNow().date(),d),"d").endOf("d"),h=1;switch(r){case"today":case"yesterday":c=r==="today"?0:1,d=r==="today"?0:1,l=g.dateNow().subtract(Math.min(g.dateNow().date(),c),"d").startOf("d"),m=g.dateNow().subtract(Math.min(g.dateNow().date(),d),"d").endOf("d"),n=Y(s,l,m),s=n.remainingData,i.push({start:l,end:m,type:r,notifications:n.singleGroup});break;case"last_7_days_this_month":s.length>0&&g.dateNow().date()>2&&(l=g.dateNow().subtract(Math.min(g.dateNow().date()-1,8),"d").startOf("d"),m=g.dateNow().subtract(2,"d").endOf("d"),n=Y(s,l,m),s=n.remainingData,i.push({start:l,end:m,type:r,notifications:n.singleGroup}));break;case"earlier_this_month":s.length>0&&g.dateNow().date()>9&&(l=g.dateNow().startOf("M").startOf("d"),m=g.dateNow().subtract(9,"d").endOf("d"),n=Y(s,l,m),s=n.remainingData,i.push({start:l,end:m,type:r,notifications:n.singleGroup}));break;case"earlier_that_month":for(;s.length>0;){const u=g.dateNow().subtract(h,"month").startOf("M").startOf("d"),p=g.dateNow().subtract(h,"month").endOf("M").endOf("d");h++,n=Y(s,u,p),s=n.remainingData,i.push({start:u,end:p,type:r,notifications:n.singleGroup})}break}}return i},Y=(t,s,i)=>{const n=[],r=t.map(c=>e.isDateOnOrBetweenRange(s,i,g.zeniDate(c.inboxNotification.notifiedAt.toUTCString()))?(n.push(c),null):c).filter(c=>!!c);return n.sort((c,d)=>g.zeniDate(c.inboxNotification.notifiedAt.toUTCString()).isAfter(g.zeniDate(d.inboxNotification.notifiedAt.toUTCString()))===!0?-1:1),{singleGroup:n,remainingData:r}},be=t=>{const{thread:s}=t,{newRepliesAdded:i,newCommentAdded:n}=je;return s.comments.length===1?n:i},Bt=new e.ResponsiveSized(3,2,1,1,1),Wt=new e.ResponsiveSized(e.sp[8],e.sp[6],35,35,e.sp[6]),Q={lineClamp:Bt,sectionWidth:Wt},{common:{texts:ht,timeStrings:we,strings:H},commentsAndNotifications:{notifications:{strings:{newMessage:Re},actionStrings:{comments:{newCommentAdded:ye}}}}}=e.appLocale.getLocalizedStrings(),Ce=({notificationData:t,users:s,isHighlighted:i=!1,style:n,onNotificationTileClick:r})=>{const c=e.useGlobalInfoContext(),l=e.useToolkitContext().analytics,{inboxNotification:{id:m,readAt:h,notifiedAt:u},thread:p}=t,{setRequestToOpenThread:x}=S.useContext(e.ThreadsContext),f=h!=null?"read":"unread",{metadata:{url:R,companyId:N,entityType:L},id:v}=p;return o.jsxRuntimeExports.jsxs(ke,{readStatus:f,isClickable:!!R,isHighlighted:i,style:n,onClick:()=>{R&&(r(m,g.toZeniUrl(R),f),(p.metadata.tab==="bill"||p.metadata.tab==="reimbursement")&&x({threadId:v,companyId:N,entityType:L})),p.metadata.application!=="cockpit"&&l.trackCommentActivity("notification","clicked",p.metadata.companyName,c.controllersList.controllers.map($=>e.getFullName($)),p.resolved?"resolved":"open",{name:e.getLoggedInUserName(c.loggedInUser),email:c.loggedInUser?.userEmail??""},"db notification")},children:[o.jsxRuntimeExports.jsx($e,{notificationData:t,users:s}),o.jsxRuntimeExports.jsx(Ne,{...t}),o.jsxRuntimeExports.jsx(ve,{timestamp:u,readStatus:f})]})},Gt=({notificationData:t,users:s})=>{const{thread:i}=t,{comments:n}=i,r=n[0];return n.length===0||r.body==null?o.jsxRuntimeExports.jsx(nt,{children:Re}):o.jsxRuntimeExports.jsx(nt,{children:r.body.content.map(c=>{switch(c.type){case"paragraph":return c.children.map((d,l)=>{if(Le(d)){const h=s.find(u=>u.userId===d.id);return d.id?o.jsxRuntimeExports.jsx(Ee,{notificationData:t,user:h},`${d.id}${H.underscore}${l}`):null}if(Te(d)){const h=e.toAbsoluteUrl(d.url)??d.url;return o.jsxRuntimeExports.jsx(Fe,{href:h,target:"_blank",rel:"noopener noreferrer nofollow",children:d.text??d.url},l)}let m=d.text;return d.bold===!0&&(m=o.jsxRuntimeExports.jsx(_e,{children:m},l)),d.italic===!0&&(m=o.jsxRuntimeExports.jsx(Ae,{children:m},l)),d.strikethrough===!0&&(m=o.jsxRuntimeExports.jsx(Me,{children:m},l)),d.code===!0&&(m=o.jsxRuntimeExports.jsx(De,{children:m},l)),o.jsxRuntimeExports.jsx(Oe,{children:m},l)});default:return o.jsxRuntimeExports.jsx(nt,{children:ye})}})})},$e=({notificationData:t,users:s})=>{const i=e.useWindowSizeContext();return o.jsxRuntimeExports.jsx(Pe,{windowSize:i,children:o.jsxRuntimeExports.jsx(Gt,{notificationData:t,users:s})})},Ee=({notificationData:t,user:s})=>{const{inboxNotification:{readAt:i}}=t,n=i!=null?"read":"unread";let r=o.jsxRuntimeExports.jsxs(ft,{className:"userText",readStatus:n,children:[H.atTheRate,ht.user,H.space]});if(s!=null){const c=e.getFullName(s,!1);r=o.jsxRuntimeExports.jsx(o.jsxRuntimeExports.Fragment,{children:o.jsxRuntimeExports.jsxs(ft,{className:"userText",readStatus:n,children:[H.atTheRate,c||ht.user,H.space]})})}return r},Ut=t=>{const s=be(t);return o.jsxRuntimeExports.jsx(o.jsxRuntimeExports.Fragment,{children:s})},Ne=t=>{const s=e.useWindowSizeContext();return o.jsxRuntimeExports.jsx(ze,{windowSize:s,children:o.jsxRuntimeExports.jsx(Ut,{...t})})},Ht=t=>{const{timestamp:s,readStatus:i}=t,n=Ft(s);return o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[o.jsxRuntimeExports.jsx(Be,{isNewNotification:n===we.justNow,children:n}),o.jsxRuntimeExports.jsx(We,{readStatus:i})]})},ve=t=>{const s=e.useWindowSizeContext();return o.jsxRuntimeExports.jsx(Ie,{windowSize:s,children:o.jsxRuntimeExports.jsx(Ht,{...t})})};function Le(t){return"type"in t&&t.type==="mention"}function Te(t){return"type"in t&&t.type==="link"}const ke=a.div`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  cursor: ${t=>t.isClickable?"pointer":"not-allowed"};
+
+  background-color: ${t=>t.readStatus==="read"&&t.isClickable?t.theme.colors.grey4:t.theme.colors.grey5};
+
+  color: ${t=>t.readStatus==="read"&&t.isClickable?t.theme.colors.grey1:t.theme.colors.hero};
+  border: 1px solid ${t=>t.theme.colors.grey3};
+  margin-bottom: -1px;
+  box-shadow: ${t=>`${e.Space.sp0} 2px ${e.Space.sp1} ${t.theme.colors.dropShadowNormal}`};
+
+  padding: ${e.Space.sp3} ${e.Space.sp2} ${e.Space.sp3} ${e.Space.sp4};
+
+  .userText {
+    color: ${e.Colors.brandColorJade};
+  }
+
+  :first-of-type {
+    border-top-left-radius: inherit;
+    border-top-right-radius: inherit;
+  }
+
+  :last-of-type {
+    border-bottom-left-radius: inherit;
+    border-bottom-right-radius: inherit;
+  }
+
+  ${t=>t.isHighlighted?_.css`
+          z-index: 1;
+          color: ${t.theme.colors.primary};
+          border: 1px solid ${t.theme.colors.primary};
+
+          .userText {
+            color: ${e.Colors.brandColorJade};
+          }
+        `:null};
+
+  ${t=>t.isClickable?_.css`
+          &:hover {
+            z-index: 1;
+            color: ${t.theme.colors.primary};
+            border: 1px solid ${t.theme.colors.primary};
+
+            .userText {
+              color: ${e.Colors.brandColorJade};
+            }
+          }
+        `:null};
+`,Ie=a(e.ExtraSmallRegular)`
+  width: ${t=>t.windowSize==="small"?"unset":"10%"};
+  gap: ${e.Space.sp2};
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+  justify-content: end;
+`,ze=a(e.StandardRegular)`
+  color: inherit;
+  display: -webkit-box;
+  overflow: hidden;
+  -webkit-line-clamp: ${t=>Q.lineClamp.value(t.windowSize)};
+  -webkit-box-orient: vertical;
+  width: ${t=>Q.sectionWidth.valuePercentage(t.windowSize)};
+`,_e=a.strong``,De=a.code``,Ae=a.em``,Me=a.s``,Oe=a.span``,Fe=a.a``,Pe=a(e.StandardRegular)`
+  color: inherit;
+  display: -webkit-box;
+  overflow: hidden;
+  -webkit-line-clamp: ${t=>Q.lineClamp.value(t.windowSize)};
+  -webkit-box-orient: vertical;
+  width: ${t=>Q.sectionWidth.valuePercentage(t.windowSize)};
+`,ft=a(e.StandardRegularSp)`
+  color: ${t=>t.readStatus==="read"?t.theme.colors.grey1:e.Colors.brandColorJade};
+`,nt=a(e.StandardRegularSp)`
+  color: inherit;
+`,Be=a(e.ExtraSmallRegularSp)`
+  flex-shrink: 0;
+  color: ${t=>t.isNewNotification?t.theme.colors.primary:"inherit"};
+`,We=a.div`
+  display: flex;
+  height: ${e.Space.sp2};
+  width: ${e.Space.sp2};
+  border-radius: ${e.Space.sp2};
+  flex-shrink: 0;
+  background-color: ${t=>t.readStatus==="unread"?e.Colors.info:"transparent"};
+`,at={emptyRowItemSectionWidth:new e.ResponsiveSized(120,200,250,330,400),emptyLastRowItemSectionWidth:new e.ResponsiveSized(e.sp[6],50,60,e.sp[11],120)},Ge=()=>{const t=e.useWindowSizeContext();return o.jsxRuntimeExports.jsxs(Ue,{windowSize:t,children:[o.jsxRuntimeExports.jsx(rt,{windowSize:t,isLastItem:!1,children:o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:at.emptyRowItemSectionWidth.value(t),height:e.sp[4]})}),o.jsxRuntimeExports.jsx(rt,{windowSize:t,isLastItem:!1,children:o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:at.emptyRowItemSectionWidth.value(t),height:e.sp[4]})}),o.jsxRuntimeExports.jsx(rt,{windowSize:t,isLastItem:!0,children:o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:at.emptyLastRowItemSectionWidth.value(t),height:18})})]})},Ue=a.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+
+  padding: ${e.Space.sp3} ${e.Space.sp2} ${e.Space.sp3} ${e.Space.sp4};
+  border: 1px solid ${t=>t.theme.colors.grey3};
+  margin-bottom: -1px;
+  box-shadow: ${t=>`${e.Space.sp0} 2px ${e.Space.sp1} ${t.theme.colors.dropShadowNormal}`};
+
+  :hover {
+    z-index: 1;
+    border: ${t=>`1px solid ${t.theme.colors.primary}`};
+  }
+
+  :first-of-type {
+    border-top-left-radius: ${e.Space.sp2};
+    border-top-right-radius: ${e.Space.sp2};
+  }
+
+  :last-of-type {
+    border-bottom-left-radius: ${e.Space.sp2};
+    border-bottom-right-radius: ${e.Space.sp2};
+  }
+`,rt=a.div`
+  display: flex;
+  align-items: center;
+  position: relative;
+  flex: 1 1 auto;
+  justify-content: ${t=>t.isLastItem?"flex-end":"start"};
+  width: ${t=>t.isLastItem?"10%":Wt.valuePercentage(t.windowSize)};
+`,He=()=>{const t=e.useWindowSizeContext();return o.jsxRuntimeExports.jsxs(Ve,{windowSize:t,children:[o.jsxRuntimeExports.jsxs(Ye,{children:[o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:180,height:e.sp[4]}),o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:180,height:e.sp[4]})]}),o.jsxRuntimeExports.jsx(Je,{children:o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:60,height:18})})]})},Ve=a.div`
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  flex-direction: row;
+  gap: ${e.Space.sp4};
+
+  padding: ${e.Space.sp3} ${e.Space.sp2} ${e.Space.sp3} ${e.Space.sp3};
+  border: 1px solid ${t=>t.theme.colors.grey3};
+  margin-bottom: -1px;
+  box-shadow: ${t=>`${e.Space.sp0} 2px ${e.Space.sp1} ${t.theme.colors.dropShadowNormal}`};
+
+  :hover {
+    z-index: 1;
+    border: ${t=>`1px solid ${t.theme.colors.primary}`};
+  }
+
+  :first-of-type {
+    border-top-left-radius: ${e.Space.sp2};
+    border-top-right-radius: ${e.Space.sp2};
+  }
+
+  :last-of-type {
+    border-bottom-left-radius: ${e.Space.sp2};
+    border-bottom-right-radius: ${e.Space.sp2};
+  }
+`,Ye=a.div`
+  display: flex;
+  align-items: start;
+  flex-direction: column;
+  gap: ${e.Space.sp2};
+  flex: 1 1 auto;
+  justify-content: start;
+`,Je=a.div`
+  display: flex;
+  align-items: baseline;
+  flex-direction: row;
+  justify-content: end;
+`,qe=()=>e.useWindowSizeContext()==="small"?o.jsxRuntimeExports.jsx(He,{}):o.jsxRuntimeExports.jsx(Ge,{}),Ke={marginLeft:new e.ResponsiveSized(e.sp[2],e.sp[5],e.sp[7])},Ze=()=>o.jsxRuntimeExports.jsxs(Xe,{children:[o.jsxRuntimeExports.jsx(ct,{numberOfRows:5}),o.jsxRuntimeExports.jsx(ct,{numberOfRows:3})]}),ct=({numberOfRows:t})=>{const s=e.useWindowSizeContext();return o.jsxRuntimeExports.jsxs(Qe,{windowSize:s,children:[o.jsxRuntimeExports.jsx(eo,{children:o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:e.sp[12],height:e.textStyles.standardRegular.lineHeightValue})}),o.jsxRuntimeExports.jsx(to,{children:[...Array(t)].map(i=>o.jsxRuntimeExports.jsx(qe,{},o.nanoid()))})]})},Xe=a.div`
+  display: block;
+  min-height: 100%;
+  flex-direction: column;
+  width: 100%;
+`,Qe=a.div`
+  display: flex;
+  flex-direction: column;
+  margin-bottom: ${e.Space.sp5};
+  margin-left: ${t=>Ke.marginLeft.valuePx(t.windowSize)};
+`,to=a.div`
+  display: flex;
+  flex-direction: column;
+  border-radius: ${e.Space.sp2};
+`,eo=a.div`
+  display: flex;
+  padding: ${e.Space.sp3} ${e.Space.sp0};
+`,oo=({notificationData:t,users:s,isSelectionMode:i=!1,isHighlighted:n=!1,style:r,onNotificationTileClick:c,onNotificationTileLongPress:d})=>{const l=e.useGlobalInfoContext(),h=e.useToolkitContext().analytics,{inboxNotification:{id:u,readAt:p,notifiedAt:x},thread:f}=t,R=p!=null?"read":"unread",N=f.metadata.url,L=S.useCallback(()=>{d?.()},[d]),v=S.useCallback(w=>{w.stopPropagation(),w.cancelable&&w.preventDefault(),i?d?.():N!=null&&(c(u,g.toZeniUrl(f.metadata.url),R),f.metadata.application!=="cockpit"&&h.trackCommentActivity("notification","clicked",f.metadata.companyName,l.controllersList.controllers.map(E=>e.getFullName(E)),f.resolved?"resolved":"open",{name:e.getLoggedInUserName(l.loggedInUser),email:l.loggedInUser?.userEmail??""},"db notification"))},[i,N,d,c,u,f.metadata.url,f.metadata.application,R,l.controllersList,l.loggedInUser,h,f.metadata.companyName,f.resolved]),j={shouldPreventDefault:!1,delay:1e3},$=At.useLongPress({onLongPress:L},j);return o.jsxRuntimeExports.jsxs(ao,{readStatus:R,isClickable:N!=null,isHighlighted:n,style:r,...$,onClick:v,children:[o.jsxRuntimeExports.jsxs(co,{children:[o.jsxRuntimeExports.jsx(so,{notificationData:t,users:s}),o.jsxRuntimeExports.jsx(io,{...t})]}),o.jsxRuntimeExports.jsx(no,{timestamp:x,readStatus:R})]})},so=({notificationData:t,users:s})=>o.jsxRuntimeExports.jsx(Vt,{children:o.jsxRuntimeExports.jsx(Gt,{notificationData:t,users:s})}),io=t=>o.jsxRuntimeExports.jsx(Vt,{children:o.jsxRuntimeExports.jsx(Ut,{...t})}),no=t=>o.jsxRuntimeExports.jsx(ro,{children:o.jsxRuntimeExports.jsx(Ht,{...t})}),ao=a.div`
+  display: flex;
+  flex-direction: row;
+  align-items: baseline;
+  justify-content: space-between;
+  width: 100%;
+  gap: ${e.Space.sp2};
+  cursor: ${t=>t.isClickable?"pointer":"not-allowed"};
+
+  background-color: ${t=>t.readStatus==="read"&&t.isClickable?t.theme.colors.grey4:t.theme.colors.grey5};
+
+  color: ${t=>t.readStatus==="read"&&t.isClickable?t.theme.colors.grey1:t.theme.colors.hero};
+  border: 1px solid ${t=>t.theme.colors.grey3};
+  margin-bottom: -1px;
+  box-shadow: ${t=>`${e.Space.sp0} 2px ${e.Space.sp1} ${t.theme.colors.dropShadowNormal}`};
+
+  padding: ${e.Space.sp3} ${e.Space.sp2} ${e.Space.sp3} ${e.Space.sp3};
+
+  .userText {
+    color: ${e.Colors.brandColorJade};
+  }
+
+  :first-of-type {
+    border-top-left-radius: inherit;
+    border-top-right-radius: inherit;
+  }
+
+  :last-of-type {
+    border-bottom-left-radius: inherit;
+    border-bottom-right-radius: inherit;
+  }
+
+  ${t=>t.isHighlighted?_.css`
+          z-index: 1;
+          color: ${t.theme.colors.primary};
+          border: 1px solid ${t.theme.colors.primary};
+
+          .userText {
+            color: ${e.Colors.brandColorJade};
+          }
+        `:null};
+
+  ${t=>t.isClickable?_.css`
+          &:hover {
+            z-index: 1;
+            color: ${t.theme.colors.primary};
+            border: 1px solid ${t.theme.colors.primary};
+
+            .userText {
+              color: ${e.Colors.brandColorJade};
+            }
+          }
+        `:null};
+`,ro=a(e.ExtraSmallRegular)`
+  width: 25%;
+  gap: ${e.Space.sp2};
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+  justify-content: end;
+`,co=a.div`
+  display: flex;
+  flex-direction: column;
+  gap: ${e.Space.sp2};
+`,Vt=a(e.StandardRegular)`
+  color: inherit;
+  display: -webkit-box;
+  overflow: hidden;
+  -webkit-box-orient: vertical;
+`,Yt=t=>e.useWindowSizeContext()==="small"?o.jsxRuntimeExports.jsx(oo,{...t}):o.jsxRuntimeExports.jsx(Ce,{...t}),{common:{all:gt}}=e.appLocale.getLocalizedStrings(),lo=({notificationGroup:t,users:s,sectionId:i,checkBoxMode:n,style:r,isDisabled:c,onNotificationTileClick:d})=>{const l=o.useTheme(),{getValues:m}=o.useFormContext(),h=m(i);return o.jsxRuntimeExports.jsx(uo,{style:r,children:o.jsxRuntimeExports.jsx(e.LabeledGroupedCheckBoxField,{mode:n,checkBoxes:[{label:o.jsxRuntimeExports.jsx(po,{htmlFor:`${i}.${gt.toLocaleLowerCase()}`,style:{color:l.colors.primary},children:et(t)}),value:gt.toLocaleLowerCase(),defaultChecked:!1,groupLabel:!0},...t.notifications.map((u,p)=>{const x=p===0,f=t.notifications.length-1===p;return{label:o.jsxRuntimeExports.jsx(Yt,{notificationData:u,users:s,style:{borderTopLeftRadius:x?e.Space.sp2:void 0,borderTopRightRadius:x?e.Space.sp2:void 0,borderBottomLeftRadius:f?e.Space.sp2:void 0,borderBottomRightRadius:f?e.Space.sp2:void 0},isHighlighted:h?.includes(u.inboxNotification.id)===!0,onNotificationTileClick:d}),value:u.inboxNotification.id,defaultChecked:!1,groupLabel:!1}})],name:i,isDisabled:c,style:{width:"100%"},checkBoxStyle:{padding:e.Space.sp3},labelCheckBoxStyle:{padding:e.Space.sp3}})})},uo=a.div`
+  display: flex;
+  align-items: center;
+  width: 100%;
+`,po=a(e.LargeMediumLabel)`
+  display: flex;
+  align-items: flex-start;
+  width: 100%;
+  padding: ${e.Space.sp3} ${e.Space.sp0} ${e.Space.sp3} ${e.Space.sp0};
+`,{common:{all:St}}=e.appLocale.getLocalizedStrings(),mo=({notificationGroup:t,users:s,sectionId:i,checkBoxMode:n,style:r,isDisabled:c,onNotificationTileClick:d})=>{const l=o.useTheme(),{getValues:m}=o.useFormContext(),h=m(i),u=S.useRef([]);return S.useEffect(()=>{u.current=u.current.slice(0,t.notifications.length)},[t.notifications.length]),o.jsxRuntimeExports.jsx(xo,{style:r,children:o.jsxRuntimeExports.jsx(e.LabeledGroupedCheckBoxField,{mode:n,checkBoxes:[{label:o.jsxRuntimeExports.jsx(jt,{htmlFor:`${i}.${St.toLocaleLowerCase()}`,style:{color:l.colors.primary,marginLeft:e.Space.sp2},children:et(t)}),value:St.toLocaleLowerCase(),defaultChecked:!1,groupLabel:!0},...t.notifications.map((p,x)=>{const f=x===0,R=t.notifications.length-1===x;return{label:o.jsxRuntimeExports.jsx(jt,{ref:N=>u.current[x]=N,htmlFor:`${i}.${p.inboxNotification.id}`,style:{padding:e.Space.sp0},children:o.jsxRuntimeExports.jsx(ho,{notificationData:p,users:s,style:{borderTopLeftRadius:f?e.Space.sp2:void 0,borderTopRightRadius:f?e.Space.sp2:void 0,borderBottomLeftRadius:R?e.Space.sp2:void 0,borderBottomRightRadius:R?e.Space.sp2:void 0,marginLeft:e.Space.sp2},isHighlighted:h?.includes(p.inboxNotification.id)===!0,isSelectionMode:n==="always_on",onNotificationTileClick:d,onNotificationTileLongPress:()=>{u.current[x]?.click()}})}),value:p.inboxNotification.id,defaultChecked:!1,groupLabel:!1}})],name:i,isDisabled:c,style:{width:"100%",position:"relative"},checkBoxStyle:{padding:e.Space.sp1,zIndex:2,left:`-${e.Space.sp1}`,position:"absolute"},checkBoxIconStyle:{backgroundColor:l.colors.grey5}})})},xo=a.div`
+  display: flex;
+  align-items: center;
+  width: 100%;
+`,jt=a(e.LargeMediumLabel)`
+  display: flex;
+  align-items: flex-start;
+  width: 100%;
+  padding: ${e.Space.sp3} ${e.Space.sp0} ${e.Space.sp3} ${e.Space.sp0};
+`,ho=a(Yt)``,fo=t=>e.useWindowSizeContext()==="small"?o.jsxRuntimeExports.jsx(mo,{...t}):o.jsxRuntimeExports.jsx(lo,{...t}),{commentsAndNotifications:{notifications:{message:go}}}=e.appLocale.getLocalizedStrings(),bt={rowGap:new e.ResponsiveSized(e.sp[0],e.sp[5],e.sp[5])},So=({notificationGroups:t,users:s,isFetching:i,hasMore:n,sectionId:r,checkBoxMode:c,scrollYOffset:d,currentSubTab:l,isDisabled:m,onUpdateScrollYOffset:h,onFetchNotificationGroups:u,onNotificationClick:p})=>{const x=e.useWindowSizeContext(),f=S.useRef(null),R=S.useRef({});S.useEffect(()=>{f.current?.resetAfterIndex(0,!0)},[x,f,t]),S.useEffect(()=>{f.current?.scrollTo(d)},[l]);const N=S.useCallback(y=>{if(R.current?.[y]!=null){const A=x==="small"&&n===!1&&y===t.length-1?bt.rowGap.value("medium-regular"):bt.rowGap.value(x);return R.current[y]+A}return(z.DEFAULT_LIST_ITEM_LINE_HEIGHT*Bt.value(x)+z.DEFAULT_LIST_ITEM_PADDING)*3+z.DEFAULT_LIST_GROUP_LABEL_HEIGHT_REGULAR+z.DEFAULT_LIST_GROUP_GAP},[x,R,t]),L=S.useCallback((y,A)=>{R.current={...R.current,[y]:A},f.current?.resetAfterIndex(0,!0)},[x,f,t]),v=S.useCallback(()=>{u()},[u]),j=S.useCallback(()=>{},[]),$=o.debounce(y=>h(y),1e3,{trailing:!0}),w=y=>!n||y<t.length,O=S.useCallback(()=>n&&!i?v():j(),[n,i,v,j]),E=n?t.length+1:t.length;return o.jsxRuntimeExports.jsx(bo,{children:o.jsxRuntimeExports.jsx(wo,{windowSize:x,children:i&&t.length===0?o.jsxRuntimeExports.jsx(Ze,{}):i===!1&&t.length===0?o.jsxRuntimeExports.jsx(e.NoListDataPage,{message:go.noNotificationsMessage,style:{padding:e.Space.sp0}}):o.jsxRuntimeExports.jsx(Ro,{windowSize:x,children:o.jsxRuntimeExports.jsx(o.AutoSizer,{children:({height:y,width:A})=>o.jsxRuntimeExports.jsx(o.InfiniteLoader,{isItemLoaded:w,itemCount:z.ARBITRARY_ITEM_COUNT,loadMoreItems:O,children:({onItemsRendered:F,ref:M})=>o.jsxRuntimeExports.jsx(o.VariableSizeList,{ref:P=>{M(P),f.current=P},height:y,itemCount:E,itemData:{notificationGroups:t,users:s,sectionId:r,checkBoxMode:c,isDisabled:m,isItemLoaded:w,setRowHeight:L,onNotificationClick:p},onItemsRendered:F,itemSize:N,width:A,style:{willChange:"auto"},overscanCount:z.OVERSCAN_COUNT,onScroll:({scrollOffset:P})=>{$(P)},initialScrollOffset:d,children:jo})})})})})})},jo=({index:t,style:s,data:i})=>{const{notificationGroups:n,users:r,sectionId:c,checkBoxMode:d,isItemLoaded:l,isDisabled:m,setRowHeight:h,onNotificationClick:u}=i,p=S.useRef(null),x=e.useWindowSizeContext();if(S.useEffect(()=>{p.current?.firstElementChild!=null&&h(t,p.current.firstElementChild.clientHeight)},[t,p,x,n[t]?.notifications]),l(t)===!0){const f=n[t],R=X(f);return o.jsxRuntimeExports.jsx(wt,{style:{...s,paddingBottom:e.Space.sp0,width:"100%"},ref:p,children:o.jsxRuntimeExports.jsx(fo,{notificationGroup:f,sectionId:`${c}.${R}`,checkBoxMode:d,isDisabled:m,users:r,onNotificationTileClick:u})},R)}return o.jsxRuntimeExports.jsx(wt,{ref:p,style:{...s,paddingBottom:e.Space.sp0},children:o.jsxRuntimeExports.jsx(ct,{numberOfRows:3})},o.nanoid())},bo=a.div`
+  display: block;
+  background-color: ${t=>t.theme.colors.grey4};
+  height: 100%;
+  width: 100%;
+`,wo=a.div`
+  height: 100%;
+  width: 100%;
+`,Ro=a.div`
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  max-width: 99.9%;
+`,wt=a.div`
+  top: ${e.Space.sp0};
+  left: ${e.Space.sp0};
+  box-sizing: border-box;
+`,{common:{in:yo,strings:Jt},dateFormat:Co,commentsAndNotifications:{notifications:{actionStrings:{notifications:I}}}}=e.appLocale.getLocalizedStrings(),qt=t=>{t.sort((r,c)=>r.createTime.isAfter(c.createTime)===!0?1:-1);let s=[...t];const i=[];let n={singleGroup:[],remainingData:[]};for(const r of Ot){let c=0,d=0,l=g.dateNow().subtract(Math.min(g.dateNow().date(),c),"d").startOf("d"),m=g.dateNow().subtract(Math.min(g.dateNow().date(),d),"d").endOf("d"),h=1;switch(r){case"today":case"yesterday":c=r==="today"?0:1,d=r==="today"?0:1,l=g.dateNow().subtract(Math.min(g.dateNow().date(),c),"d").startOf("d"),m=g.dateNow().subtract(Math.min(g.dateNow().date(),d),"d").endOf("d"),n=J(s,l,m),s=n.remainingData,i.push({start:l,end:m,type:r,notifications:n.singleGroup});break;case"last_7_days_this_month":s.length>0&&g.dateNow().date()>2&&(l=g.dateNow().subtract(Math.min(g.dateNow().date()-1,8),"d").startOf("d"),m=g.dateNow().subtract(2,"d").endOf("d"),n=J(s,l,m),s=n.remainingData,i.push({start:l,end:m,type:r,notifications:n.singleGroup}));break;case"earlier_this_month":s.length>0&&g.dateNow().date()>9&&(l=g.dateNow().startOf("M").startOf("d"),m=g.dateNow().subtract(9,"d").endOf("d"),n=J(s,l,m),s=n.remainingData,i.push({start:l,end:m,type:r,notifications:n.singleGroup}));break;case"earlier_that_month":for(;s.length>0;){const u=g.dateNow().subtract(h,"month").startOf("M").startOf("d"),p=g.dateNow().subtract(h,"month").endOf("M").endOf("d");h++,n=J(s,u,p),s=n.remainingData,i.push({start:u,end:p,type:r,notifications:n.singleGroup})}break}}return i},J=(t,s,i)=>{const n=[],r=t.map(c=>e.isDateOnOrBetweenRange(s,i,c.createTime)?(n.push(c),null):c).filter(c=>!!c);return n.sort((c,d)=>c.createTime.isAfter(d.createTime)===!0?-1:1),{singleGroup:n,remainingData:r}},$o=t=>{let s=I.newActivity;return t.code==="in_progress"?s=I.due.replace("__task_status__",e.capitalizeFirstLetterString(t.name.toLocaleLowerCase())):s=I.due.replace("__task_status__",yo.toLocaleLowerCase().concat(Jt.space,e.capitalizeFirstLetterString(t.name.toLocaleLowerCase()))),s},Eo=t=>{const{eventData:{activities:s}}=t;let i=I.newActivity;if(s.length>0){const n=s[0].activityType,r=s[0].metadata.eventStatus;switch(n){case"task_archived":i=I.archive;break;case"task_deleted":i=I.delete;break;case"task_activities":i=I.activities;break;case"task_assigned":i=I.assign;break;case"task_created":i=I.create;break;case"task_due":i=r!=null?$o(r):I.dueTomorrow;break;case"task_overdue":i=I.overdue.replace("__date__",s[0].metadata.additionalInfo?.dueDate.format(Co.visual.MMMDFormat)??Jt.empty);break;case"task_status_updated":i=I.statusUpdate;break}}return i},Kt=new e.ResponsiveSized(3,2,1,1,1),Zt=new e.ResponsiveSized(e.sp[8],33,33,33,35),tt={lineClamp:Kt,sectionWidth:Zt},{common:{and:Rt,other:No,others:vo,texts:Lo,timeStrings:To,strings:k,tags:ko}}=e.appLocale.getLocalizedStrings(),Io=({notificationData:t,isHighlighted:s=!1,style:i,onNotificationTileClick:n})=>{const{status:r,notificationId:c,eventData:{entitiyId:d,activities:l},createTime:m}=t;return o.jsxRuntimeExports.jsxs(Fo,{notificationStatus:r,isHighlighted:s,style:i,onClick:()=>{n(c,d,r,l.length>0?l[0].activityType:void 0)},children:[o.jsxRuntimeExports.jsx(zo,{...t}),o.jsxRuntimeExports.jsx(Ao,{...t}),o.jsxRuntimeExports.jsx(Oo,{...t}),o.jsxRuntimeExports.jsx(Mo,{createTime:m,notificationStatus:r})]})},Xt=t=>{const{status:s,eventData:{title:i}}=t;return o.jsxRuntimeExports.jsx(Uo,{notificationStatus:s,children:i||k.hyphen})},zo=t=>{const s=e.useWindowSizeContext();return o.jsxRuntimeExports.jsx(Go,{windowSize:s,children:o.jsxRuntimeExports.jsx(Xt,{...t})})},_o=t=>{const{eventData:{activities:s}}=t;if(s.length>0&&s[0].activityType==="task_status_updated"){const i=s[0].metadata.updates.find(n=>n.type==="code_name_pair"&&n.field==="status");if(i?.oldValue.codeNamePair!=null&&i.newValue.codeNamePair!=null)return o.jsxRuntimeExports.jsxs(Vo,{children:[o.jsxRuntimeExports.jsx(yt,{backgroundColor:xt(i.oldValue.codeNamePair),children:i.oldValue.codeNamePair.name}),o.jsxRuntimeExports.jsx(Yo,{}),o.jsxRuntimeExports.jsx(yt,{backgroundColor:xt(i.newValue.codeNamePair),children:i.newValue.codeNamePair.name})]})}return null},Do=t=>{const{status:s,eventData:{authors:i,activities:n}}=t,r=i.length;if(n[0].activityType==="task_due"||n[0].activityType==="task_overdue"||n[0].activityType==="task_status_updated")return null;let c=o.jsxRuntimeExports.jsxs(W,{className:"userText",notificationStatus:s,children:[k.atTheRate,Lo.user,k.space]});return r>0&&(r>2?c=o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[o.jsxRuntimeExports.jsxs(W,{className:"userText",notificationStatus:s,children:[k.atTheRate,e.getFullName(i[0],!1),k.space]}),Rt,o.jsxRuntimeExports.jsxs(W,{className:"userText",notificationStatus:s,children:[k.space,r-1,k.space,vo,k.space]})]}):r===2?c=o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[o.jsxRuntimeExports.jsxs(W,{className:"userText",notificationStatus:s,children:[k.atTheRate,e.getFullName(i[0],!1),k.space]}),Rt,o.jsxRuntimeExports.jsxs(W,{className:"userText",notificationStatus:s,children:[k.space,i.length===2?k.atTheRate+e.getFullName(i[1],!1):No,k.space]})]}):c=o.jsxRuntimeExports.jsxs(W,{className:"userText",notificationStatus:s,children:[k.atTheRate,e.getFullName(i[0],!1),k.space]})),c},Qt=t=>o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[o.jsxRuntimeExports.jsx(Do,{...t}),Eo(t),o.jsxRuntimeExports.jsx(_o,{...t})]}),Ao=t=>{const s=e.useWindowSizeContext(),{eventData:{activities:i}}=t;return o.jsxRuntimeExports.jsx(Wo,{windowSize:s,statusUpdate:i.length>0&&i[0].activityType==="task_status_updated"&&i[0].metadata.updates.find(n=>n.field==="status")!=null,children:o.jsxRuntimeExports.jsx(Qt,{...t})})},te=t=>{const{createTime:s,notificationStatus:i}=t,n=Ft(s.toDate());return o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[o.jsxRuntimeExports.jsx(Ho,{isNewNotification:n===To.justNow,children:n}),o.jsxRuntimeExports.jsx(qo,{notificationStatus:i})]})},Mo=t=>{const s=e.useWindowSizeContext();return o.jsxRuntimeExports.jsx(Po,{windowSize:s,children:o.jsxRuntimeExports.jsx(te,{...t})})},ee=t=>{const{eventData:{activities:s}}=t;return s[0].activityType==="task_overdue"?o.jsxRuntimeExports.jsx(e.ItemWithTag,{tagTitle:ko.overdue,textColor:{color:new o.Color(e.Colors.alert),backgroundColor:new o.Color("transparent"),borderColor:new o.Color(e.Colors.alert)},showLoader:!1}):o.jsxRuntimeExports.jsx(Jo,{})},Oo=t=>{const s=e.useWindowSizeContext();return o.jsxRuntimeExports.jsx(Bo,{windowSize:s,children:o.jsxRuntimeExports.jsx(ee,{...t})})},Fo=a.div`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  cursor: pointer;
+
+  background-color: ${t=>t.notificationStatus==="read"?t.theme.colors.grey4:t.theme.colors.grey5};
+
+  color: ${t=>t.notificationStatus==="read"?t.theme.colors.grey1:t.theme.colors.hero};
+  border: 1px solid ${t=>t.theme.colors.grey3};
+  margin-bottom: -1px;
+  box-shadow: ${t=>`${e.Space.sp0} 2px ${e.Space.sp1} ${t.theme.colors.dropShadowNormal}`};
+
+  padding: ${e.Space.sp3} ${e.Space.sp2} ${e.Space.sp3} ${e.Space.sp4};
+
+  .userText {
+    color: ${e.Colors.brandColorJade};
+  }
+
+  :first-of-type {
+    border-top-left-radius: inherit;
+    border-top-right-radius: inherit;
+  }
+
+  :last-of-type {
+    border-bottom-left-radius: inherit;
+    border-bottom-right-radius: inherit;
+  }
+
+  ${t=>t.isHighlighted?_.css`
+          z-index: 1;
+          color: ${t.theme.colors.primary};
+          border: 1px solid ${t.theme.colors.primary};
+
+          .userText {
+            color: ${e.Colors.brandColorJade};
+          }
+        `:null};
+
+  &:hover {
+    z-index: 1;
+    color: ${t=>t.theme.colors.primary};
+    border: 1px solid ${t=>t.theme.colors.primary};
+
+    .userText {
+      color: ${e.Colors.brandColorJade};
+    }
+  }
+`,Po=a(e.ExtraSmallRegular)`
+  width: ${t=>t.windowSize==="small"?"unset":"10%"};
+  gap: ${e.Space.sp2};
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+  justify-content: end;
+`,Bo=a(e.ExtraSmallRegular)`
+  width: ${t=>t.windowSize==="small"?"unset":"10%"};
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+  justify-content: end;
+`,Wo=a(e.StandardRegular)`
+  color: inherit;
+
+  ${t=>t.statusUpdate?_.css`
+          display: flex;
+          flex-wrap: wrap;
+          gap: ${e.Space.sp1};
+        `:_.css`
+          display: -webkit-box;
+          overflow: hidden;
+          -webkit-line-clamp: ${tt.lineClamp.value(t.windowSize)};
+          gap: ${e.Space.sp1};
+          -webkit-box-orient: vertical;
+        `};
+  width: ${t=>tt.sectionWidth.valuePercentage(t.windowSize)};
+`,Go=a(e.StandardRegular)`
+  color: inherit;
+  display: -webkit-box;
+  overflow: hidden;
+  -webkit-line-clamp: ${t=>tt.lineClamp.value(t.windowSize)};
+  -webkit-box-orient: vertical;
+  width: ${t=>tt.sectionWidth.valuePercentage(t.windowSize)};
+`,W=a(e.StandardRegularSp)`
+  color: ${t=>t.notificationStatus==="read"?t.theme.colors.grey1:e.Colors.brandColorJade};
+`,Uo=a(e.StandardRegularSp)`
+  color: inherit;
+`,Ho=a(e.ExtraSmallRegularSp)`
+  flex-shrink: 0;
+  color: ${t=>t.isNewNotification?t.theme.colors.primary:"inherit"};
+`,Vo=a.div`
+  display: flex;
+  align-items: center;
+  flex-direction: row;
+  gap: ${e.Space.sp2};
+  flex-wrap: wrap;
+`,yt=a(e.ExtraSmallRegular)`
+  color: ${e.Colors.neutralGrey5Light};
+  background: ${t=>t.backgroundColor};
+  border: 1px solid ${t=>t.backgroundColor};
+  padding: ${e.Space.sp0} 6px;
+  border-radius: ${e.Space.sp1};
+`,Yo=a(e.SvgArrowTailRight)`
+  width: ${e.Space.sp3};
+  height: ${e.Space.sp3};
+  color: ${t=>t.theme.colors.hero};
+`,Jo=a.div`
+  display: flex;
+  flex: 1 1 auto;
+`,qo=a.div`
+  display: flex;
+  height: ${e.Space.sp2};
+  width: ${e.Space.sp2};
+  border-radius: ${e.Space.sp2};
+  flex-shrink: 0;
+  background-color: ${t=>t.notificationStatus==="unread"?e.Colors.info:"transparent"};
+`,q={emptyRowItemSectionWidth:new e.ResponsiveSized(120,200,280,330,400),emptyLastRowItemSectionWidth:new e.ResponsiveSized(e.sp[6],50,60,e.sp[11],120)},Ko=()=>{const t=e.useWindowSizeContext();return o.jsxRuntimeExports.jsxs(Zo,{windowSize:t,children:[o.jsxRuntimeExports.jsx(K,{windowSize:t,isLastItem:!1,children:o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:q.emptyRowItemSectionWidth.value(t),height:e.sp[4]})}),o.jsxRuntimeExports.jsx(K,{windowSize:t,isLastItem:!1,children:o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:q.emptyRowItemSectionWidth.value(t),height:e.sp[4]})}),o.jsxRuntimeExports.jsx(K,{windowSize:t,isLastItem:!0,children:o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:q.emptyLastRowItemSectionWidth.value(t),height:18})}),o.jsxRuntimeExports.jsx(K,{windowSize:t,isLastItem:!0,children:o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:q.emptyLastRowItemSectionWidth.value(t),height:18})})]})},Zo=a.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+
+  padding: ${e.Space.sp3} ${e.Space.sp2} ${e.Space.sp3} ${e.Space.sp4};
+  border: 1px solid ${t=>t.theme.colors.grey3};
+  margin-bottom: -1px;
+  box-shadow: ${t=>`${e.Space.sp0} 2px ${e.Space.sp1} ${t.theme.colors.dropShadowNormal}`};
+
+  :hover {
+    z-index: 1;
+    border: ${t=>`1px solid ${t.theme.colors.primary}`};
+  }
+
+  :first-of-type {
+    border-top-left-radius: ${e.Space.sp2};
+    border-top-right-radius: ${e.Space.sp2};
+  }
+
+  :last-of-type {
+    border-bottom-left-radius: ${e.Space.sp2};
+    border-bottom-right-radius: ${e.Space.sp2};
+  }
+`,K=a.div`
+  display: flex;
+  align-items: center;
+  position: relative;
+  flex: 1 1 auto;
+  justify-content: ${t=>t.isLastItem?"flex-end":"start"};
+  width: ${t=>t.isLastItem?"10%":Zt.valuePercentage(t.windowSize)};
+`,Xo=()=>{const t=e.useWindowSizeContext();return o.jsxRuntimeExports.jsxs(Qo,{windowSize:t,children:[o.jsxRuntimeExports.jsxs(Ct,{children:[o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:180,height:e.sp[4]}),o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:60,height:18})]}),o.jsxRuntimeExports.jsxs(Ct,{children:[o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:180,height:e.sp[4]}),o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:60,height:18})]})]})},Qo=a.div`
+  display: flex;
+  flex-direction: column;
+  align-items: baseline;
+  justify-content: space-between;
+  gap: ${e.Space.sp4};
+
+  padding: ${e.Space.sp3} ${e.Space.sp2} ${e.Space.sp3} ${e.Space.sp3};
+  border: 1px solid ${t=>t.theme.colors.grey3};
+  margin-bottom: -1px;
+  box-shadow: ${t=>`${e.Space.sp0} 2px ${e.Space.sp1} ${t.theme.colors.dropShadowNormal}`};
+
+  :hover {
+    z-index: 1;
+    border: ${t=>`1px solid ${t.theme.colors.primary}`};
+  }
+
+  :first-of-type {
+    border-top-left-radius: ${e.Space.sp2};
+    border-top-right-radius: ${e.Space.sp2};
+  }
+
+  :last-of-type {
+    border-bottom-left-radius: ${e.Space.sp2};
+    border-bottom-right-radius: ${e.Space.sp2};
+  }
+`,Ct=a.div`
+  display: flex;
+  flex-direction: row;
+  align-items: start;
+  justify-content: space-between;
+  gap: ${e.Space.sp2};
+  flex: 1 1 auto;
+  width: 100%;
+`,ts=()=>e.useWindowSizeContext()==="small"?o.jsxRuntimeExports.jsx(Xo,{}):o.jsxRuntimeExports.jsx(Ko,{}),es={marginLeft:new e.ResponsiveSized(e.sp[2],e.sp[5],e.sp[7])},os=()=>o.jsxRuntimeExports.jsxs(ss,{children:[o.jsxRuntimeExports.jsx(lt,{numberOfRows:5}),o.jsxRuntimeExports.jsx(lt,{numberOfRows:3})]}),lt=({numberOfRows:t})=>{const s=e.useWindowSizeContext();return o.jsxRuntimeExports.jsxs(is,{windowSize:s,children:[o.jsxRuntimeExports.jsx(as,{children:o.jsxRuntimeExports.jsx(e.RectangularContentLoader,{width:e.sp[12],height:e.textStyles.standardRegular.lineHeightValue})}),o.jsxRuntimeExports.jsx(ns,{children:[...Array(t)].map(i=>o.jsxRuntimeExports.jsx(ts,{},o.nanoid()))})]})},ss=a.div`
+  display: block;
+  min-height: 100%;
+  flex-direction: column;
+  width: 100%;
+`,is=a.div`
+  display: flex;
+  flex-direction: column;
+  margin-bottom: ${e.Space.sp5};
+  margin-left: ${t=>es.marginLeft.valuePx(t.windowSize)};
+`,ns=a.div`
+  display: flex;
+  flex-direction: column;
+  border-radius: ${e.Space.sp2};
+`,as=a.div`
+  display: flex;
+  padding: ${e.Space.sp3} ${e.Space.sp0};
+`,rs=({notificationData:t,isSelectionMode:s=!1,isHighlighted:i=!1,style:n,onNotificationTileClick:r,onNotificationTileLongPress:c})=>{const{status:d,createTime:l,eventData:{entitiyId:m,activities:h},notificationId:u}=t,p=S.useCallback(()=>{c?.()},[c]),x=S.useCallback(N=>{N.stopPropagation(),N.cancelable&&N.preventDefault(),s?c?.():r(u,m,d,h.length>0?h[0].activityType:void 0)},[u,m,d,h,s,c,r]),f={shouldPreventDefault:!1,delay:1e3},R=At.useLongPress({onLongPress:p},f);return o.jsxRuntimeExports.jsxs(ps,{notificationStatus:d,isHighlighted:i,style:n,...R,onClick:x,children:[o.jsxRuntimeExports.jsxs($t,{children:[o.jsxRuntimeExports.jsx(cs,{...t}),o.jsxRuntimeExports.jsx(ds,{createTime:l,notificationStatus:d})]}),o.jsxRuntimeExports.jsxs($t,{children:[o.jsxRuntimeExports.jsx(ls,{...t}),h.length>0&&h[0].activityType==="task_status_updated"?null:o.jsxRuntimeExports.jsx(us,{...t})]})]})},cs=t=>o.jsxRuntimeExports.jsx(oe,{statusUpdate:!1,children:o.jsxRuntimeExports.jsx(Xt,{...t})}),ls=t=>{const{eventData:{activities:s}}=t;return o.jsxRuntimeExports.jsx(oe,{statusUpdate:s.length>0&&s[0].activityType==="task_status_updated"&&s[0].metadata.updates.find(i=>i.field==="status")!=null,children:o.jsxRuntimeExports.jsx(Qt,{...t})})},ds=t=>o.jsxRuntimeExports.jsx(ms,{children:o.jsxRuntimeExports.jsx(te,{...t})}),us=t=>o.jsxRuntimeExports.jsx(xs,{children:o.jsxRuntimeExports.jsx(ee,{...t})}),ps=a.div`
+  display: flex;
+  flex-direction: column;
+  align-items: baseline;
+  justify-content: space-between;
+  width: 100%;
+  gap: ${e.Space.sp2};
+  cursor: pointer;
+
+  background-color: ${t=>t.notificationStatus==="read"?t.theme.colors.grey4:t.theme.colors.grey5};
+
+  color: ${t=>t.notificationStatus==="read"?t.theme.colors.grey1:t.theme.colors.hero};
+  border: 1px solid ${t=>t.theme.colors.grey3};
+  margin-bottom: -1px;
+  box-shadow: ${t=>`${e.Space.sp0} 2px ${e.Space.sp1} ${t.theme.colors.dropShadowNormal}`};
+
+  padding: ${e.Space.sp3} ${e.Space.sp2} ${e.Space.sp3} ${e.Space.sp3};
+
+  .userText {
+    color: ${e.Colors.brandColorJade};
+  }
+
+  :first-of-type {
+    border-top-left-radius: inherit;
+    border-top-right-radius: inherit;
+  }
+
+  :last-of-type {
+    border-bottom-left-radius: inherit;
+    border-bottom-right-radius: inherit;
+  }
+
+  ${t=>t.isHighlighted?_.css`
+          z-index: 1;
+          color: ${t.theme.colors.primary};
+          border: 1px solid ${t.theme.colors.primary};
+
+          .userText {
+            color: ${e.Colors.brandColorJade};
+          }
+        `:null};
+
+  &:hover {
+    z-index: 1;
+    color: ${t=>t.theme.colors.primary};
+    border: 1px solid ${t=>t.theme.colors.primary};
+
+    .userText {
+      color: ${e.Colors.brandColorJade};
+    }
+  }
+`,ms=a(e.ExtraSmallRegular)`
+  width: 25%;
+  gap: ${e.Space.sp2};
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+  justify-content: end;
+`,xs=a(e.ExtraSmallRegular)`
+  width: 25%;
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+  justify-content: end;
+`,$t=a.div`
+  display: flex;
+  flex-direction: row;
+  gap: ${e.Space.sp3};
+  width: 100%;
+  justify-content: space-between;
+  align-items: start;
+`,oe=a(e.StandardRegular)`
+  color: inherit;
+  ${t=>t.statusUpdate?_.css`
+          display: flex;
+          flex-wrap: wrap;
+          gap: ${e.Space.sp2};
+        `:_.css`
+          display: -webkit-box;
+          -webkit-box-orient: horizontal;
+          gap: ${e.Space.sp1};
+        `};
+`,se=t=>e.useWindowSizeContext()==="small"?o.jsxRuntimeExports.jsx(rs,{...t}):o.jsxRuntimeExports.jsx(Io,{...t}),{common:{all:Et}}=e.appLocale.getLocalizedStrings(),hs=({notificationGroup:t,sectionId:s,checkBoxMode:i,style:n,isDisabled:r,onNotificationTileClick:c})=>{const d=o.useTheme(),{getValues:l}=o.useFormContext(),m=l(s);return o.jsxRuntimeExports.jsx(fs,{style:n,children:o.jsxRuntimeExports.jsx(e.LabeledGroupedCheckBoxField,{mode:i,checkBoxes:[{label:o.jsxRuntimeExports.jsx(gs,{htmlFor:`${s}.${Et.toLocaleLowerCase()}`,style:{color:d.colors.primary},children:et(t)}),value:Et.toLocaleLowerCase(),defaultChecked:!1,groupLabel:!0},...t.notifications.map((h,u)=>{const p=u===0,x=t.notifications.length-1===u;return{label:o.jsxRuntimeExports.jsx(se,{notificationData:h,style:{borderTopLeftRadius:p?e.Space.sp2:void 0,borderTopRightRadius:p?e.Space.sp2:void 0,borderBottomLeftRadius:x?e.Space.sp2:void 0,borderBottomRightRadius:x?e.Space.sp2:void 0},isHighlighted:m?.includes(h.notificationId)===!0,onNotificationTileClick:c}),value:h.notificationId,defaultChecked:!1,groupLabel:!1}})],name:s,isDisabled:r,style:{width:"100%"},checkBoxStyle:{padding:e.Space.sp3},labelCheckBoxStyle:{padding:e.Space.sp3}})})},fs=a.div`
+  display: flex;
+  align-items: center;
+  width: 100%;
+`,gs=a(e.LargeMediumLabel)`
+  display: flex;
+  align-items: flex-start;
+  width: 100%;
+  padding: ${e.Space.sp3} ${e.Space.sp0} ${e.Space.sp3} ${e.Space.sp0};
+`,{common:{all:Nt}}=e.appLocale.getLocalizedStrings(),Ss=({notificationGroup:t,sectionId:s,checkBoxMode:i,style:n,isDisabled:r,onNotificationTileClick:c})=>{const d=o.useTheme(),{getValues:l}=o.useFormContext(),m=l(s),h=S.useRef([]);return S.useEffect(()=>{h.current=h.current.slice(0,t.notifications.length)},[t.notifications.length]),o.jsxRuntimeExports.jsx(js,{style:n,children:o.jsxRuntimeExports.jsx(e.LabeledGroupedCheckBoxField,{mode:i,checkBoxes:[{label:o.jsxRuntimeExports.jsx(vt,{htmlFor:`${s}.${Nt.toLocaleLowerCase()}`,style:{color:d.colors.primary,marginLeft:e.Space.sp2},children:et(t)}),value:Nt.toLocaleLowerCase(),defaultChecked:!1,groupLabel:!0},...t.notifications.map((u,p)=>{const x=p===0,f=t.notifications.length-1===p;return{label:o.jsxRuntimeExports.jsx(vt,{ref:R=>h.current[p]=R,htmlFor:`${s}.${u.notificationId}`,style:{padding:e.Space.sp0},children:o.jsxRuntimeExports.jsx(bs,{notificationData:u,style:{borderTopLeftRadius:x?e.Space.sp2:void 0,borderTopRightRadius:x?e.Space.sp2:void 0,borderBottomLeftRadius:f?e.Space.sp2:void 0,borderBottomRightRadius:f?e.Space.sp2:void 0,marginLeft:e.Space.sp2},isHighlighted:m?.includes(u.notificationId)===!0,isSelectionMode:i==="always_on",onNotificationTileClick:c,onNotificationTileLongPress:()=>{h.current[p]?.click()}})}),value:u.notificationId,defaultChecked:!1,groupLabel:!1}})],name:s,isDisabled:r,style:{width:"100%",position:"relative"},checkBoxStyle:{padding:e.Space.sp1,zIndex:2,left:`-${e.Space.sp1}`,position:"absolute"},checkBoxIconStyle:{backgroundColor:d.colors.grey5}})})},js=a.div`
+  display: flex;
+  align-items: center;
+  width: 100%;
+`,vt=a(e.LargeMediumLabel)`
+  display: flex;
+  align-items: flex-start;
+  width: 100%;
+  padding: ${e.Space.sp3} ${e.Space.sp0} ${e.Space.sp3} ${e.Space.sp0};
+`,bs=a(se)``,ws=t=>e.useWindowSizeContext()==="small"?o.jsxRuntimeExports.jsx(Ss,{...t}):o.jsxRuntimeExports.jsx(hs,{...t}),{commentsAndNotifications:{notifications:{message:Rs}}}=e.appLocale.getLocalizedStrings(),Lt={rowGap:new e.ResponsiveSized(e.sp[0],e.sp[5],e.sp[5])},ys=({notificationGroups:t,isFetching:s,hasMore:i,sectionId:n,checkBoxMode:r,scrollYOffset:c,currentSubTab:d,isDisabled:l,onUpdateScrollYOffset:m,onFetchNotificationGroups:h,onNotificationClick:u})=>{const p=e.useWindowSizeContext(),x=S.useRef(null),f=S.useRef({});S.useEffect(()=>{x.current?.resetAfterIndex(0,!0)},[p,x,t]),S.useEffect(()=>{x.current?.scrollTo(c)},[d]);const R=S.useCallback(E=>{if(f.current?.[E]!=null){const y=p==="small"&&i===!1&&E===t.length-1?Lt.rowGap.value("medium-regular"):Lt.rowGap.value(p);return f.current[E]+y}return(z.DEFAULT_LIST_ITEM_LINE_HEIGHT*Kt.value(p)+z.DEFAULT_LIST_ITEM_PADDING)*3+z.DEFAULT_LIST_GROUP_LABEL_HEIGHT_REGULAR+z.DEFAULT_LIST_GROUP_GAP},[p,f,t]),N=S.useCallback((E,y)=>{f.current={...f.current,[E]:y},x.current?.resetAfterIndex(0,!0)},[p,x,t]),L=S.useCallback(()=>{h()},[h]),v=S.useCallback(()=>{},[]),j=o.debounce(E=>m(E),1e3,{trailing:!0}),$=E=>!i||E<t.length,w=S.useCallback(()=>i&&!s?L():v(),[i,s,L,v]),O=i?t.length+1:t.length;return o.jsxRuntimeExports.jsx($s,{children:o.jsxRuntimeExports.jsx(Es,{windowSize:p,children:s&&t.length===0?o.jsxRuntimeExports.jsx(os,{}):s===!1&&t.length===0?o.jsxRuntimeExports.jsx(e.NoListDataPage,{message:Rs.noNotificationsMessage,style:{padding:e.Space.sp0}}):o.jsxRuntimeExports.jsx(Ns,{windowSize:p,children:o.jsxRuntimeExports.jsx(o.AutoSizer,{children:({height:E,width:y})=>o.jsxRuntimeExports.jsx(o.InfiniteLoader,{isItemLoaded:$,itemCount:z.ARBITRARY_ITEM_COUNT,loadMoreItems:w,children:({onItemsRendered:A,ref:F})=>o.jsxRuntimeExports.jsx(o.VariableSizeList,{ref:M=>{F(M),x.current=M},height:E,itemCount:O,itemData:{notificationGroups:t,sectionId:n,checkBoxMode:r,isDisabled:l,isItemLoaded:$,setRowHeight:N,onNotificationClick:u},onItemsRendered:A,itemSize:R,width:y,style:{willChange:"auto"},overscanCount:z.OVERSCAN_COUNT,onScroll:({scrollOffset:M})=>{j(M)},initialScrollOffset:c,children:Cs})})})})})})},Cs=({index:t,style:s,data:i})=>{const{notificationGroups:n,sectionId:r,checkBoxMode:c,isItemLoaded:d,isDisabled:l,setRowHeight:m,onNotificationClick:h}=i,u=S.useRef(null),p=e.useWindowSizeContext();if(S.useEffect(()=>{u.current?.firstElementChild!=null&&m(t,u.current.firstElementChild.clientHeight)},[t,u,p,n[t]?.notifications]),d(t)===!0){const x=n[t],f=X(x);return o.jsxRuntimeExports.jsx(Tt,{style:{...s,paddingBottom:e.Space.sp0,width:"100%"},ref:u,children:o.jsxRuntimeExports.jsx(ws,{notificationGroup:x,sectionId:`${r}.${f}`,checkBoxMode:c,isDisabled:l,onNotificationTileClick:h})},f)}return o.jsxRuntimeExports.jsx(Tt,{ref:u,style:{...s,paddingBottom:e.Space.sp0},children:o.jsxRuntimeExports.jsx(lt,{numberOfRows:3})},o.nanoid())},$s=a.div`
+  display: block;
+  background-color: ${t=>t.theme.colors.grey4};
+  height: 100%;
+  width: 100%;
+`,Es=a.div`
+  height: 100%;
+  width: 100%;
+`,Ns=a.div`
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  max-width: 99.9%;
+`,Tt=a.div`
+  top: ${e.Space.sp0};
+  left: ${e.Space.sp0};
+  box-sizing: border-box;
+`,{common:{all:dt,texts:Z,footer:vs,strings:{plus:Ls},numbers:{maximumCount:kt}},commentsAndNotifications:{notifications:{title:Ts,texts:ie,strings:It}}}=e.appLocale.getLocalizedStrings(),V={tableContainerLeftPadding:new e.ResponsiveSized(e.sp[2],e.sp[2],e.sp[2]),tableContainerRightPadding:new e.ResponsiveSized(e.sp[3],e.sp[6],e.sp[8]),tabsContainerLeftRightPadding:new e.ResponsiveSized(e.sp[3],e.sp[6],e.sp[8]),selectedNotificationsTextMarginLeft:new e.ResponsiveSized(e.sp[0],e.sp[6],e.sp[6])},ks={selectedNotificationsText:new e.ResponsiveSizedStyle("smallRegular","standardRegular")},zt="notificationsPage",G="commentsNotificationsTable",U="notificationsTable",ne=20,Is=({notificationView:t,users:s,isNotificationSettingsVisible:i,isDisabled:n,onNotificationClick:r,onCommentNotificationClick:c,onUpdateNotificationViewUIState:d,onUpdateNotificationTabState:l,onUpdateNotificationViewCurrentTabAndSubTab:m,onUpdateNotificationViewSubTab:h,onFetchMoreNotifications:u,onUpdateNotificationStatus:p,onSettingsClick:x,onBackClick:f,onMarkAllNotificationsAsRead:R})=>{const N=o.useTheme(),L=e.useWindowSizeContext(),v=o.useForm({mode:"all",reValidateMode:"onChange",defaultValues:S.useMemo(()=>Dt(t),[t]),values:S.useMemo(()=>Dt(t),[t])}),{currentTab:j,currentSubTab:$,notificationDetailsByTab:w,allSubTabs:O,allNotifications:E,allExternalNotifications:y,notificationsForCurrentTabAndSubTab:A,externalNotificationsForCurrentTabAndSubTab:F}=t,M=S.useMemo(()=>Object.keys(w).map(b=>({label:Z[b],id:Z[b].toLocaleLowerCase(),countDetails:{count:w[b].uiState.unreadCount,isFetching:w[b].fetchCountState.fetchState==="In-Progress"}})),[w]),P=S.useMemo(()=>O.map(b=>({label:b==="all"?dt:Z[b],id:b})),[O]),ae=S.useMemo(()=>Pt(F).filter(b=>b.notifications.length>0),[F]),re=S.useMemo(()=>qt(A).filter(b=>b.notifications.length>0),[A]),ce=async(b,C)=>{const D=b.split(".")[0],B=[];D!=null&&(D===G||D===U)&&(Object.values(C[D]).forEach(T=>{B.push(...T.filter(pe=>pe.includes(dt.toLowerCase())===!1))}),l({selectedNotificationIds:B},j))};S.useEffect(()=>{const b=v.watch((C,{name:D})=>{D!=null&&C!=null&&o.defer(()=>ce(D,C))});return()=>{b.unsubscribe()}});const ot=S.useCallback(()=>{const b=[],C=w[j].selectedNotificationIdsForSubTab,D="read";if(j==="comments"){const B=y.filter(T=>T.inboxNotification.readAt==null).map(T=>T.inboxNotification.id);C.forEach(T=>{B.includes(T)&&b.push(T)})}else{const B=E.filter(T=>T.status!==D).map(T=>T.notificationId);C.forEach(T=>{B.includes(T)&&b.push(T)})}return b},[y,E,j,w]),le=ot().length>ne?"disabled":n,st=v.watch(G),it=v.watch(U),mt=S.useCallback(()=>{u(j,$)},[u,j,$]),de=S.useCallback(()=>{if(j==="comments"){const b={};Object.keys(st).forEach(C=>{b[C]=[]}),v.reset({[G]:b,[U]:it},{keepDefaultValues:!1,keepDirty:!1,keepValues:!1})}else{const b={};Object.keys(it).forEach(C=>{b[C]=[]}),v.reset({[U]:b,[G]:st},{keepDefaultValues:!1,keepDirty:!1,keepValues:!1})}l({selectedNotificationIds:[]},j)},[it,st]),ue=S.useCallback(()=>{const b=w[j].selectedNotificationIdsForSubTab,C="read",D=ot();p(j,b,C,D)},[j,w,ot,p]);return o.jsxRuntimeExports.jsxs(_s,{children:[o.jsxRuntimeExports.jsx(e.NavBar,{source:"NotificationsPage",title:Ts.notifications,backgroundColor:N.colors.grey4,onBackClick:f,rightSideComponent:i===!0?o.jsxRuntimeExports.jsx(qs,{onClick:x}):o.jsxRuntimeExports.jsx(Js,{})}),o.jsxRuntimeExports.jsx(Ms,{}),o.jsxRuntimeExports.jsx(As,{windowSize:L,children:o.jsxRuntimeExports.jsx(he,{tabs:M,selectedTab:j,onTabChange:b=>{const C=g.toNotificationTabTypeStrict(b);C!=null&&m(C)},subTabs:P,selectedSubTab:$,onSubTabChange:b=>{const C=g.toNotificationSubTabTypeStrict(b);C!=null&&h(C)},subTabRightComponent:o.jsxRuntimeExports.jsx(zs,{notificationCount:w[j].uiState.unreadCount,markAsAllReadUpdateState:w[j].markAsAllReadState.fetchState,markAsReadUpdateState:w[j].markAsReadState.fetchState,onMarkAsAllReadClick:()=>{R(j)}})})}),o.jsxRuntimeExports.jsx(Ds,{windowSize:L,children:o.jsxRuntimeExports.jsx(o.FormProvider,{...v,children:o.jsxRuntimeExports.jsx("form",{id:ut(zt),onSubmit:v.handleSubmit(ue),style:{width:"100%"},children:j==="comments"?o.jsxRuntimeExports.jsx(So,{users:s,hasMore:w[j].uiState.hasMore,isFetching:w[j].fetchState==="In-Progress",scrollYOffset:w[j].uiState.scrollYOffset[$],currentSubTab:$,checkBoxMode:w[j].selectedNotificationIdsForSubTab.length>0?"always_on":"checked_or_hover",notificationGroups:ae,sectionId:G,onFetchNotificationGroups:mt,onUpdateScrollYOffset:b=>d({scrollYOffset:{...w[j].uiState.scrollYOffset,[$]:b}},j),onNotificationClick:c}):o.jsxRuntimeExports.jsx(ys,{hasMore:w[j].uiState.hasMore,isFetching:w[j].fetchState==="In-Progress",scrollYOffset:w[j].uiState.scrollYOffset[$],currentSubTab:$,checkBoxMode:w[j].selectedNotificationIdsForSubTab.length>0?"always_on":"checked_or_hover",notificationGroups:re,sectionId:U,onFetchNotificationGroups:mt,onUpdateScrollYOffset:b=>d({scrollYOffset:{...w[j].uiState.scrollYOffset,[$]:b}},j),onNotificationClick:r})})})}),w[j].selectedNotificationIdsForSubTab.length?o.jsxRuntimeExports.jsx(e.Footer,{formId:ut(zt),primaryBtn:{label:ie.markAsRead,isLoading:w[j].markAsReadState.fetchState==="In-Progress",style:{width:"135px"},isDisabled:le!=null},cancelBtn:{label:vs.cancel,isDisabled:w[j].markAsReadState.fetchState==="In-Progress",style:{width:"135px"},onClick:de},helperContainerStyle:L==="small"?{width:"100%"}:{rowGap:e.Space.sp0},footerContentStyle:{gap:e.Space.sp2},leftSideComponent:o.jsxRuntimeExports.jsx(e.ControlledComponent,{controller:L!=="small",children:o.jsxRuntimeExports.jsx(_t,{selectedNotificationsCount:w[j].selectedNotificationIdsForSubTab.length})}),topComponent:o.jsxRuntimeExports.jsx(e.ControlledComponent,{controller:L==="small",children:o.jsxRuntimeExports.jsx(_t,{selectedNotificationsCount:w[j].selectedNotificationIdsForSubTab.length})}),rightSideComponent:o.jsxRuntimeExports.jsx(e.ControlledComponent,{controller:L!=="small",children:o.jsxRuntimeExports.jsx(Ps,{})})}):null]})},zs=({markAsAllReadUpdateState:t,markAsReadUpdateState:s,notificationCount:i,onMarkAsAllReadClick:n})=>{const r=i===0,c=S.useCallback(()=>{t!=="In-Progress"&&s!=="In-Progress"&&!r&&n()},[t,s,r,n]);return o.jsxRuntimeExports.jsx(Os,{variant:"tertiary",size:"small",label:ie.markAllAsRead,onClick:c,prefixIcon:t==="In-Progress"?o.jsxRuntimeExports.jsx(e.ActivityIndicator,{size:"Small",start:!0}):o.jsxRuntimeExports.jsx(Fs,{className:"mark-as-read"}),disabled:r,textStyle:{fontWeight:e.textStyles.smallRegular.fontWeight},style:{borderRadius:e.Space.sp1,border:"none",backgroundColor:"transparent",flexShrink:0,padding:e.Space.sp0,cursor:s==="In-Progress"||t==="In-Progress"||r?"default":"pointer"}})},_t=({selectedNotificationsCount:t})=>{const s=e.useWindowSizeContext();return o.jsxRuntimeExports.jsxs(Bs,{windowSize:s,children:[o.jsxRuntimeExports.jsx(Gs,{children:o.jsxRuntimeExports.jsx(Ws,{isCircular:t<10,children:o.jsxRuntimeExports.jsx(Us,{children:t>kt?`${kt}${Ls}`:t})})}),o.jsxRuntimeExports.jsxs(Ys,{windowSize:s,children:[o.jsxRuntimeExports.jsx(Hs,{children:t>1?It.notificationsSelected:It.notificationSelected}),t>ne?o.jsxRuntimeExports.jsx(Vs,{children:Z.maxLimit}):null]})]})},_s=a.div`
+  display: flex;
+  height: 100vh;
+  width: 100%;
+  flex-direction: column;
+  background-color: ${t=>t.theme.colors.grey4};
+`,Ds=a.div`
+  display: flex;
+  height: 100%;
+  overflow: auto;
+  padding-top: ${e.Space.sp0};
+  padding-bottom: ${e.Space.sp0};
+  padding-left: ${t=>V.tableContainerLeftPadding.valuePx(t.windowSize)};
+  padding-right: ${t=>V.tableContainerRightPadding.valuePx(t.windowSize)};
+`,As=a.div`
+  padding-top: ${e.Space.sp0};
+  padding-bottom: ${e.Space.sp0};
+  padding-left: ${t=>V.tabsContainerLeftRightPadding.valuePx(t.windowSize)};
+  padding-right: ${t=>V.tabsContainerLeftRightPadding.valuePx(t.windowSize)};
+`,Ms=a.div`
+  min-height: ${e.Space.sp3};
+  width: 100%;
+`,Os=a(e.Button)`
+  .mark-as-read {
+    color: ${t=>t.disabled===!0?t.theme.colors.grey2:t.theme.colors.hero};
+  }
+  :hover {
+    .mark-as-read {
+      color: ${t=>t.disabled===!0?t.theme.colors.grey2:t.theme.colors.primary};
+    }
+  }
+`,Fs=a(me.SvgDoubleTick)`
+  width: ${e.Space.sp3};
+  height: ${e.Space.sp3};
+`,Ps=a.div``,Bs=a.div`
+  display: flex;
+  align-items: center;
+  flex-direction: row;
+  gap: ${e.Space.sp2};
+  margin-left: ${t=>V.selectedNotificationsTextMarginLeft.valuePx(t.windowSize)};
+`,Ws=a.div`
+  ${t=>t.isCircular?_.css`
+          height: ${e.Space.sp3};
+          width: ${e.Space.sp3};
+          padding: ${e.Space.sp0};
+        `:_.css`
+          height: 18px;
+          min-width: ${e.Space.sp3};
+          padding: ${e.Space.sp0} ${e.Space.sp1};
+        `}
+  background-color: transparent;
+  border-radius: inherit;
+`,Gs=a.div`
+  border: 1px solid ${t=>t.theme.colors.grey1};
+  border-radius: ${e.Space.sp12};
+  padding: 2px;
+`,Us=a(e.ExtraSmallMediumSp)`
+  height: 100%;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: ${t=>t.theme.colors.hero};
+`,Hs=a(e.StyledText)`
+  display: flex;
+`,Vs=a(e.SmallRegular)`
+  display: flex;
+  color: ${e.Colors.important};
+  margin-left: ${e.Space.sp1};
+`,Ys=a(e.StyledText)`
+  ${t=>`${ks.selectedNotificationsText.style(t.windowSize)}`};
+  color: ${t=>t.theme.colors.primary};
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+`,Js=a.div`
+  width: ${e.Space.sp4};
+  height: ${e.Space.sp4};
+`,qs=a(e.SvgSettings)`
+  color: ${t=>t.theme.colors.hero};
+  width: ${e.Space.sp4};
+  height: ${e.Space.sp4};
+  cursor: pointer;
+  &:hover {
+    color: ${t=>t.theme.colors.primary};
+  }
+`,ut=t=>`${t}_form`,Dt=t=>{const{allNotifications:s,allExternalNotifications:i,notificationDetailsByTab:{tasks:{selectedNotificationIds:n},comments:{selectedNotificationIds:r}}}=t,c={};qt(s).filter(u=>u.notifications.length>0).forEach(u=>{const p=u.notifications.map(x=>x.notificationId);c[X(u)]=n.filter(x=>p.includes(x))});const l={};return Pt(i).filter(u=>u.notifications.length>0).forEach(u=>{const p=u.notifications.map(x=>x.inboxNotification.id);l[X(u)]=r.filter(x=>p.includes(x))}),{[G]:l,[U]:c}},Ks=(t,s)=>{const i=[];return Object.values(t).forEach(n=>{n.forEach(r=>{r.includes(dt.toLocaleLowerCase())===!1&&s.includes(r)&&i.push(r)})}),i};exports.default=Is;exports.getSelectedNotificationIds=Ks;exports.uniqueFormName=ut;