@zeniai/web-components 3.17.12 → 3.17.14

package/dist/uploadAttachment-CgcI09wH.cjs

@@ -0,0 +1,286 @@
+"use strict";const n=require("./vendor-.pnpm-D0ILHvHB.cjs"),R=require("react"),ce=require("@emotion/react"),r=require("@emotion/styled"),t=require("./index-DHSetD4K.cjs");function de(e){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const s in e)if(s!=="default"){const c=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(i,s,c.get?c:{enumerable:!0,get:()=>e[s]})}}return i.default=e,Object.freeze(i)}const $=de(R);new t.ResponsiveSized(t.sp[0],t.sp[5]);const pe=r(t.StandardRegular)`
+  margin-left: ${e=>!e.hasChildren&&e.depth!==0?t.Space.sp3:t.Space.sp2};
+`,me=r(t.StandardSemiBold)``,ue=r.div`
+  display: flex;
+  height: ${e=>e.isRecommended?"auto":t.Space.sp6};
+  align-items: center;
+`,xe=r.div`
+  display: flex;
+  height: ${t.Space.sp6};
+  align-items: center;
+`,he=r.div`
+  height: ${t.Space.sp6};
+  width: ${t.Space.sp3};
+`,ge=r.div`
+  display: flex;
+`,fe=({ancestorMetadata:e,depth:i,name:s})=>n.jsxRuntimeExports.jsx(n.jsxRuntimeExports.Fragment,{children:i>0&&e!=null?[...Array(i).keys()].map(c=>{const l=e[c];return l==null?null:n.jsxRuntimeExports.jsxs(ge,{children:[l.depth===0?n.jsxRuntimeExports.jsx(t.AccountDepthComponent,{depth:l.depth}):null,l.depth>=1?l.hasSibling&&!l.isLastNode?n.jsxRuntimeExports.jsx(t.LineComponent,{},c):n.jsxRuntimeExports.jsx(t.NoLineComponent,{}):null,l.depth>=1?n.jsxRuntimeExports.jsx(t.AccountDepthComponent,{depth:l.depth}):null]},s+c)}):null}),Se=({depth:e,isLastNode:i,isLeaf:s,hasSiblings:c,hasChildren:l,collapsed:m,isOptionRecommended:x})=>{let p=n.jsxRuntimeExports.jsx(he,{});return x===!0||(e===0&&l&&(p=n.jsxRuntimeExports.jsx(t.RootIcon,{collapsed:m})),e>0&&(l&&!c&&i&&(p=n.jsxRuntimeExports.jsx(t.LineLIconComponent,{collapsed:m})),s&&c&&i&&(p=n.jsxRuntimeExports.jsx(t.LineLComponent,{})),!l&&s&&!c&&!i&&(p=n.jsxRuntimeExports.jsx(t.LineTComponent,{})),l&&c&&i&&(p=n.jsxRuntimeExports.jsx(t.LineLIconComponent,{collapsed:m})),l&&!i&&(p=n.jsxRuntimeExports.jsx(t.LineTIconComponent,{collapsed:m})),i&&s&&(p=n.jsxRuntimeExports.jsx(t.LineLComponent,{})))),p},je=({depth:e,isLastNode:i,isLeaf:s,hasSiblings:c,hasChildren:l,collapsed:m,isOptionRecommended:x})=>n.jsxRuntimeExports.jsx(xe,{children:n.jsxRuntimeExports.jsx(Se,{depth:e,isLastNode:i,isLeaf:s,hasSiblings:c,hasChildren:l,collapsed:m,isOptionRecommended:x})});function Re(e){const{displayName:i}=e;return e.depth>4&&console.warn("cannot handle depth more than 4"),n.jsxRuntimeExports.jsxs(ue,{isRecommended:e.isOptionRecommended??!1,children:[e.isOptionRecommended===!0?null:n.jsxRuntimeExports.jsx(fe,{ancestorMetadata:e.subAccountAncestorMetadata,depth:e.depth,name:e.displayName}),e.isOptionRecommended===!0?null:n.jsxRuntimeExports.jsx(je,{...e}),e.isOptionRecommended===!0?n.jsxRuntimeExports.jsx(me,{children:i}):n.jsxRuntimeExports.jsx(pe,{hasChildren:e.hasChildren,depth:e.depth,children:i})]})}const X={infoLabel:new t.ResponsiveSizedStyle("extraSmallRegular","smallRegular"),selectFieldInput:new t.ResponsiveSizedStyle("smallRegular","standardRegular")},ye={menuMinWidth:new t.ResponsiveSized(343,400,428)},{common:{texts:{confidence:Ce},strings:{empty:N}},expenseAutomation:{accountRecon:{review:{zeniGptRecommendation:we}}}}=t.appLocale.getLocalizedStrings(),Oe=(e,i,s,c,l,m,x)=>e.isOptionRecommended!==!0||!e.chainOfThought||e.chainOfThought.length===0?null:{recommendations:[{id:e.id??e.value,name:e.label??e.displayName??e.value,reason:e.recommendationReason??e.additionalNote??we,cot:e.chainOfThought,isSelected:i,source:e.source,type:m,confidencePercentage:e.confidencePercentage}],isThoughtProcessOnly:!0,existingOption:{label:void 0,value:void 0},pageSource:c,transactionStatus:l,isCOTEnabled:s,onPrimaryRecommendationConfirmationClick:()=>{},onAlternateRecommendationConfirmationClick:()=>{},onAlternateRecommendationExpandClick:()=>{},width:x},be=({name:e,registerOptions:i,defaultValue:s,isDisabled:c,style:l,placeholder:m,autoFocus:x=!1,menuIsOpen:p,pageSource:h,type:a,transactionStatus:u,showEmptyState:j,additionalLabelInfo:y,customStyleConfig:f,customPlaceholderString:C,allowEmpty:I=!0,tooltip:A,noOptionsMessage:M,customPlaceholderColor:B,menuPortal:z,showCOT:F=!0,tooltipPosition:_="right-start",tooltipWidth:V,disableCurrentOption:E,valueToInfo:b,valueToId:w,onMenuClose:D,getStyles:q,menuPlacement:P="auto",onCOTView:W})=>{const{control:J,formState:{dirtyFields:G,errors:H}}=n.useFormContext(),S=n.has(H,e??""),v=t.useWindowSizeContext(),T=n.useTheme(),[Y,ee]=R.useState(!1),te=n.has(G,e),{dropDowns:U,common:{strings:{empty:L}}}=t.appLocale.getLocalizedStrings(),Z=R.useCallback(o=>({value:o.value,label:o.label??o.displayName,info:b?.(o.value)??L,id:w?.(o.value)??null,isDisabled:o.isDisabled,additionalNote:o?.additionalNote,isOptionRecommended:o.isOptionRecommended,recommendedOptionIndex:o.recommendedOptionIndex,displayName:o.displayName,depth:o.depth,isLeaf:o.isLeaf,isLastNode:o.isLastNode,hasSiblings:o.isLastNode,hasChildren:o.hasChildren,collapsed:o.collapsed,numberOfLines:o.numberOfLines,coaId:o.coaId,ancestorMetadata:o.ancestorMetadata,chainOfThought:o.chainOfThought,confidencePercentage:o.confidencePercentage,recommendationReason:o.recommendationReason,source:o.source}),[b,w,L]),ne=R.useCallback(o=>o.map(d=>({label:d.label,options:d.options.map(O=>Z(O))})),[Z]),oe=R.useCallback(o=>{if(o==null||!o)return;let d=[];return s.allOptions.forEach(O=>{d=d.concat(O.options)}),{value:o,label:d.find(O=>O.value===o)?.label??o,info:b?.(o)??L}},[s.allOptions,b,L]);if(j===!0&&Y===!1&&te===!1&&!s.selectedOption&&c==null)return n.jsxRuntimeExports.jsx(t.ItemWithButton,{style:l,buttonTitle:U.add,onClick:()=>ee(!0),name:e});const ie=s.allOptions.some(o=>o.options.some(d=>d.isOptionRecommended===!0)),se={...f,container:(o,d)=>({...o,width:"100%",...l,...q?.(d.selectProps.menuIsOpen)||{}}),menu:(o,d)=>({...o,backgroundColor:T.colors.grey5,borderRadius:t.Space.sp1,boxShadow:`${t.Space.sp0} 2px ${t.Space.sp2} ${T.colors.dropShadowHover}`,whiteSpace:"nowrap",zIndex:2,width:"100%",minWidth:ie?ye.menuMinWidth.valuePx(v):"300px",margin:0,...f?.menu?.(o,d)}),control:(o,d)=>({...o,height:t.Space.sp6,...f?.control?.(o,d)}),valueContainer:(o,d)=>({...o,padding:0,paddingLeft:10,justifyContent:d.selectProps.menuIsOpen===!1?"flex-end":"flex-start",...f?.valueContainer?.(o,d)}),singleValue:(o,d)=>({...o,color:T.colors.primary,...f?.singleValue?.(o,d)}),menuList:(o,d)=>({...o,borderRadius:4,...f?.menuList?.(o,d)}),group:o=>({...o,paddingBottom:0,"&:first-of-type":{paddingTop:t.Space.sp0},"&:not(:first-of-type)":{paddingTop:t.Space.sp1},"&:not(:last-of-type)":{paddingBottom:t.Space.sp1,borderBottom:`1px solid ${T.colors.grey3}`}}),menuPortal:(o,d)=>({...o,...f?.menuPortal?.(o,d)})},re=M??{line1:U.noOptions.standard,line2:L},le={hasError:S,noOptions:re,customPlaceholderColor:B,customPlaceholderString:C};return n.jsxRuntimeExports.jsx(n.Controller,{name:e,control:J,defaultValue:s,rules:i,"data-testid":t.generateDataTestId("grouped-single-select-field",e),render:({field:{onChange:o,onBlur:d,value:O,name:K,ref:ae}})=>{const k=O;return n.jsxRuntimeExports.jsxs(n.jsxRuntimeExports.Fragment,{children:[R.createElement(n.StateManagedSelect$1,{...le,menuPortalTarget:z,ref:ae,name:K,isMulti:!1,isSearchable:!0,isClearable:!0,defaultValue:oe(s.selectedOption??k.selectedOption),autoFocus:x,controlShouldRenderValue:!0,placeholder:m,options:ne(s?.allOptions??k.allOptions),onChange:g=>{g==null||g?.value!=null&&k?.selectedOption===g.value?I===!0&&o({selectedOption:void 0,allOptions:k.allOptions}):o({selectedOption:g.value,allOptions:k.allOptions})},key:n.nanoid(),tabSelectsValue:!1,openMenuOnFocus:!0,classNamePrefix:"grouped-single-select-field",onBlur:d,menuPlacement:P,menuIsOpen:p,maxMenuHeight:288,menuShouldScrollIntoView:!1,closeMenuOnSelect:!0,onMenuClose:D,closeMenuOnScroll:!1,components:{Control:Ee,Option:g=>Te(g,F,I,h,a,u,_,V,W),Input:Le,Group:ke,GroupHeading:Ie,NoOptionsMessage:$e,SingleValue:g=>De(g,A),ValueContainer:g=>ve(g),DropdownIndicator:ot,IndicatorSeparator:it,Placeholder:Pe,ClearIndicator:st},hideSelectedOptions:!1,styles:se,isDisabled:c!=null,isOptionDisabled:g=>E?.(g.value)??!1,"data-testid":t.generateDataTestId("grouped-single-select",K)}),y!=null?n.jsxRuntimeExports.jsx(Ke,{size:v,children:y}):null]})}})},$e=e=>{const i=e.selectProps.noOptions;return n.jsxRuntimeExports.jsxs(Ae,{children:[n.jsxRuntimeExports.jsx(Q,{children:i?.line1}),n.jsxRuntimeExports.jsx(Q,{children:i?.line2})]})},Ee=e=>{const{menuIsOpen:i,isFocused:s,isDisabled:c,selectProps:l,data:m,options:x}=e,{value:p,hasError:h,customPlaceholderColor:a,customPlaceholderString:u}=l;let j=[];x.forEach(C=>{j=j.concat(C.options)});const y=j.find(C=>C.value===m?.value),f=t.useWindowSizeContext();return n.jsxRuntimeExports.jsx(Ve,{title:u!=null&&p!=null?p.label:void 0,windowSize:f,menuIsOpen:i,isFocused:s,customPlaceholderColor:a,isDisabled:c,selectedValue:p,hasError:h,customPlaceholderString:u,isRecommended:y?.isOptionRecommended,"data-testid":t.generateDataTestId("grouped-single-select-field-control",x[0]?.label),children:n.jsxRuntimeExports.jsx(n.components.Control,{...e,className:"select-control",children:e.children})})},ve=e=>n.jsxRuntimeExports.jsx(n.components.ValueContainer,{...e,className:"select-value-container",children:e.children}),Le=e=>{const{selectProps:i,innerRef:s,innerProps:c}=e,{placeholder:l,value:m,customPlaceholderString:x,menuIsOpen:p,onMenuOpen:h,hasError:a}=i;return x!=null&&m==null&&p===!1?n.jsxRuntimeExports.jsx(ct,{ref:s,...c,onClick:h,style:{display:"flex",width:"100%",height:"100%",alignItems:"center",justifyContent:"flex-start",cursor:"pointer"},className:"custom-placeholder","data-testid":t.generateDataTestId("grouped-single-select-field-input",i.name),children:n.jsxRuntimeExports.jsxs(rt,{children:[n.jsxRuntimeExports.jsx(lt,{hasError:a}),n.jsxRuntimeExports.jsx(at,{hasError:a,children:x})]})}):n.jsxRuntimeExports.jsx(n.components.Input,{...e,autoComplete:"new-password",autoFocus:p,placeholder:m==null?l:void 0,children:e.children})},ke=e=>n.jsxRuntimeExports.jsx(n.components.Group,{...e,children:e.children}),Ie=e=>{const[i,s]=R.useState(!0);return n.jsxRuntimeExports.jsx(Qe,{className:"group-heading-container",isGroupOpen:i,onClick:()=>s(!i),"data-testid":t.generateDataTestId("group-heading",e.data.label),children:n.jsxRuntimeExports.jsxs(n.components.GroupHeading,{...e,children:[n.jsxRuntimeExports.jsx(Xe,{isGroupOpen:i,children:n.jsxRuntimeExports.jsx(Me,{})}),e.children]})})},De=({children:e,...i},s)=>{const c=s==null||i.selectProps.menuIsOpen===!0?e:s.sticky===!0?n.jsxRuntimeExports.jsx(Ne,{title:s.text,children:e}):n.jsxRuntimeExports.jsx(t.Tooltip,{style:{padding:`12px ${t.Space.sp3}`},title:s.text,placement:"top",children:e});return n.jsxRuntimeExports.jsx(n.components.SingleValue,{...i,children:n.jsxRuntimeExports.jsx(Be,{children:c})})},Pe=()=>null,Te=(e,i,s,c,l,m,x,p,h)=>{const{data:a,isSelected:u,isDisabled:j,isFocused:y,selectProps:f}=e,{customPlaceholderString:C}=f,{depth:I,isLeaf:A,isLastNode:M,hasSiblings:B,hasChildren:z,collapsed:F,displayName:_,ancestorMetadata:V,label:E}=a,b=V,w=Oe(a,u,i,c,m,l,p),D=n.jsxRuntimeExports.jsx(Ge,{title:C!=null?e.label:void 0,className:"select-option-wrapper",isFocused:y,isSelected:u,isDisabled:j,isOptionRecommended:!!a?.isOptionRecommended,showBottomBorder:a?.additionalNote==null||a?.isOptionRecommended!==!0,allowEmpty:s,"data-testid":t.generateDataTestId("grouped-single-select-option",E),children:n.jsxRuntimeExports.jsx(n.components.Option,{...e,className:"select-option",children:n.jsxRuntimeExports.jsxs(He,{isOptionRecommended:a?.isOptionRecommended,children:[!!a?.isOptionRecommended&&n.jsxRuntimeExports.jsx(et,{children:n.jsxRuntimeExports.jsx(tt,{})}),n.jsxRuntimeExports.jsxs(Ue,{children:[n.jsxRuntimeExports.jsxs(Ze,{isSelected:u,isOptionRecommended:a?.isOptionRecommended,children:[n.jsxRuntimeExports.jsx(qe,{isSelected:u,isDisabled:j,children:n.jsxRuntimeExports.jsx(Re,{displayName:_??E,depth:I,isLastNode:M,isLeaf:A,hasSiblings:B,collapsed:F,hasChildren:z,isOptionRecommended:a?.isOptionRecommended,subAccountAncestorMetadata:b})}),y===!0&&a.coaId!=null&&a?.info!=null&&n.jsxRuntimeExports.jsx(nt,{children:a.coaId??a?.info})]}),a?.isOptionRecommended&&a.additionalNote?n.jsxRuntimeExports.jsx(Je,{isSelected:u,isDisabled:j,children:a.additionalNote}):null]}),n.jsxRuntimeExports.jsxs(dt,{children:[a?.isOptionRecommended?n.jsxRuntimeExports.jsxs(pt,{children:[n.jsxRuntimeExports.jsx(mt,{confidence:a.confidencePercentage,children:t.getConfidenceLevel(a.confidencePercentage)}),n.jsxRuntimeExports.jsx(ut,{className:"confidence-label",children:Ce})]}):null,u===!0&&a?.additionalNote==null?n.jsxRuntimeExports.jsxs(Ye,{children:[n.jsxRuntimeExports.jsx(t.SvgTick,{className:"right-tick-icon",height:t.Space.sp3,width:t.Space.sp3}),n.jsxRuntimeExports.jsx(t.SvgClose,{className:"close-tick-icon",height:t.Space.sp3,width:t.Space.sp3,"data-testid":t.generateDataTestId("grouped-single-select-option-cancel",E)})]}):a?.isOptionRecommended===!0?u===!0?n.jsxRuntimeExports.jsx(xt,{children:n.jsxRuntimeExports.jsx(t.SvgTick,{height:t.Space.sp3,width:t.Space.sp3,style:{transform:"rotate(0deg)"}})}):n.jsxRuntimeExports.jsx(We,{}):null]})]})})}),P=t.useToolkitContext().analytics,W=R.useCallback(()=>{const G=(e.value!=null&&e.value!==N?e?.getValue(e.value):null)?.[0]?.label??N,H=a.recommendedOptionIndex===1?"alternative":"primary",S=w?.recommendations[0],v=S?.cot??[];P.trackTransactionCotDropdownView({recommendationType:H,recommendationFor:l,currentValue:G,recommendation:S?.name??N,recommendationCot:v,isRecommendationCotAvailable:v.length>0,recommendationReason:S?.reason??N,recommendationConfidenceLevel:t.toConfidenceLevelType(t.getConfidenceLevel(S?.confidencePercentage).toLocaleLowerCase()),transactionPage:c,transactionCurrentStatus:m,recommendationConfidencePercentage:S?.confidencePercentage??null}),h!=null&&S!=null&&S.cot.length>0&&h(l,S.source)},[P,w,c,m,l,e,a.recommendedOptionIndex]);return w!=null&&a?.isOptionRecommended&&i?n.jsxRuntimeExports.jsx(t.Tooltip,{variant:"chain-of-thought",data:w,placement:x??"right-start",enterDelay:300,leaveDelay:100,offset:[0,0],position:"static",display:"block",style:{width:"100%",height:"100%",marginLeft:"0px",marginRight:"0px"},onOpen:W,children:D}):D},Ne=({children:e,title:i})=>n.jsxRuntimeExports.jsxs(ze,{children:[n.jsxRuntimeExports.jsxs(Fe,{children:[i,n.jsxRuntimeExports.jsx(_e,{})]}),e]}),Ae=r.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding-top: ${t.Space.sp2};
+  padding-right: ${t.Space.sp3};
+  padding-bottom: ${t.Space.sp2};
+  padding-left: ${t.Space.sp3};
+`,Q=r(t.SmallRegular)`
+  color: ${e=>e.theme.colors.hero};
+`,Me=r(t.SvgArrowCircleBottom)`
+  width: ${t.Space.sp3};
+  height: ${t.Space.sp3};
+  color: ${e=>e.theme.colors.primary};
+`,Be=r.div`
+  display: flex;
+  align-items: center;
+  column-gap: 6px;
+`,ze=r.div`
+  position: relative;
+  display: contents;
+`,Fe=r.div`
+  position: absolute;
+  background: ${t.lightColors.primary};
+  color: ${t.lightColors.grey5};
+  padding: ${t.Space.sp3};
+  border-radius: ${t.Space.sp1};
+  top: -${t.Space.sp2};
+  right: 225px;
+  opacity: 0.85;
+  pointer-events: none;
+`,_e=r.span`
+  position: absolute;
+  top: 30%;
+  right: -8%;
+  border-width: 10px;
+  border-style: solid;
+  border-color: transparent transparent transparent ${t.lightColors.primary};
+`,Ve=r.span`
+  width: 100%;
+  background-color: ${e=>e.menuIsOpen?e.theme.colors.background:e.theme.colors.grey5};
+  border-radius: ${t.Space.sp1};
+  cursor: ${e=>e.isDisabled?"not-allowed":"pointer"};
+  .select-control {
+    border: none;
+    background-color: ${e=>e.hasError?t.Colors.importantLight:"inherit"};
+    &:hover {
+      color: ${e=>e.isDisabled?e.theme.colors.grey3:e.hasError?t.Colors.important:e.theme.colors.primary};
+      background-color: ${e=>e.isDisabled?e.theme.colors.grey5:e.hasError?t.Colors.importantLight:e.theme.colors.background};
+      border-color: none;
+    }
+    box-shadow: none;
+    width: auto;
+    min-height: auto;
+    cursor: pointer;
+  }
+
+  .select-value-container {
+    width: 100%;
+    display: flex;
+    max-width: 100%;
+    height: 100%;
+    min-width: 100%;
+    align-items: center;
+    flex-wrap: nowrap;
+    cursor: pointer;
+
+    padding-right: ${t.Space.sp3};
+    .grouped-single-select-field__single-value {
+      display: flex;
+      ${e=>`${X.selectFieldInput.style(e.windowSize)}`};
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    .grouped-single-select-field__input-container {
+      display: flex;
+      width: ${e=>e.menuIsOpen===!1&&e.selectedValue!=null?t.Space.sp0:"100%"};
+      position: ${e=>e.isFocused===!1&&e.selectedValue==null?"initial":"absolute"};
+      ${t.textStyles.standardRegular.css};
+      color: ${e=>e.theme.colors.primary};
+      margin: ${t.Space.sp0};
+      cursor: inherit;
+
+      > input {
+        text-align: ${e=>e.customPlaceholderString!=null?"left":e.isFocused===!1&&e.selectedValue==null?"right":"initial"};
+        align-items: center;
+        overflow: hidden;
+        cursor: inherit;
+        :disabled {
+          visibility: visible;
+        }
+        ::placeholder {
+          color: ${e=>e.hasError?t.Colors.important:e.customPlaceholderColor!=null?e.customPlaceholderColor:e.theme.colors.grey1};
+        }
+      }
+    }
+  }
+`,We=r(t.SvgArrowRight)`
+  width: ${t.Space.sp3};
+  height: ${t.Space.sp3};
+`,Ge=r.div`
+  border-bottom: ${e=>e.showBottomBorder===!0?"inherit":"none"} !important;
+  .select-option {
+    padding: ${t.Space.sp0} ${t.Space.sp3};
+    ${t.textStyles.smallRegular.css};
+    color: ${e=>e.isSelected?e.theme.colors.primary:e.theme.colors.hero};
+
+    .confidence-label {
+      color: ${e=>e.isSelected?e.theme.colors.primary:e.theme.colors.grey1};
+    }
+
+    opacity: ${e=>e.isDisabled?.32:1};
+    background-color: ${e=>e.isSelected?e.theme.colors.background:e.theme.colors.grey5};
+
+    cursor: ${e=>e.isDisabled?"not-allowed":"pointer"};
+    border-top: none;
+
+    .close-tick-icon {
+      display: none;
+    }
+    &:hover {
+      padding: 22 ${t.Space.sp3};
+      background-color: ${e=>e.isDisabled?e.theme.colors.grey5:e.theme.colors.background};
+      color: ${e=>e.isDisabled?e.theme.colors.champion:e.theme.colors.primary};
+
+      .confidence-label {
+        color: ${e=>e.theme.colors.primary};
+      }
+
+      ${({allowEmpty:e})=>e&&ce.css`
+          .right-tick-icon {
+            display: none;
+          }
+          .close-tick-icon {
+            display: inline-block;
+          }
+        `}
+    }
+  }
+`,He=r.div`
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  width: 100%;
+  padding-top: ${e=>e.isOptionRecommended===!0?"12px":t.Space.sp0};
+  padding-bottom: ${e=>e.isOptionRecommended===!0?"12px":t.Space.sp0};
+  height: ${e=>e.isOptionRecommended===!0?"auto":t.Space.sp6};
+`,qe=r.label`
+  padding: ${t.Space.sp0};
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  cursor: ${e=>e.isDisabled?"not-allowed":"pointer"};
+  ${e=>e.isSelected&&"cursor: default"};
+`,Je=r(t.SmallRegular)`
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: inherit;
+`,Ue=r.div`
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  overflow: hidden;
+`,Ze=r.div`
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  height: ${e=>e.isOptionRecommended?t.Space.sp5:t.Space.sp6};
+  min-width: 0;
+  gap: ${t.Space.sp3};
+`,Ke=r.label`
+  color: ${e=>e.theme.colors.grey1};
+  width: 100%;
+  ${e=>`${X.infoLabel.style(e.size)}`};
+  padding-right: ${t.Space.sp3};
+  text-align: right;
+  white-space: pre-line;
+`,Qe=r(t.SmallMedium)`
+  display: flex;
+  color: ${e=>e.theme.colors.primary};
+  align-items: center;
+  flex-direction: row;
+  margin-bottom: ${t.Space.sp0};
+  padding: ${t.Space.sp2} ${t.Space.sp0};
+
+  ~ div .select-option-wrapper {
+    display: ${e=>e.isGroupOpen?"flex":"none"};
+  }
+
+  .grouped-single-select-field__group-heading {
+    display: flex;
+    font-size: ${t.textStyles.standardMedium.fontSize};
+    font-weight: ${t.textStyles.standardMedium.fontWeight};
+    line-height: ${t.textStyles.standardMedium.lineHeight};
+    font-family: ${t.textStyles.standardMedium.fontFamily};
+    color: inherit;
+    text-transform: capitalize;
+    cursor: pointer;
+    padding: 0 ${t.Space.sp3};
+    margin-bottom: ${t.Space.sp0};
+  }
+`,Xe=r.div`
+  display: flex;
+  align-items: center;
+  margin-left: ${t.Space.sp0};
+  transform: ${e=>e.isGroupOpen?"rotate(0deg)":"rotate(180deg)"};
+  color: ${e=>e.theme.colors.primary};
+  margin-right: ${t.Space.sp2};
+`,Ye=r.div`
+  display: flex;
+  color: ${e=>e.theme.colors.primary};
+`,et=r.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: ${t.Space.sp4};
+  width: ${t.Space.sp3};
+  margin-right: ${t.Space.sp2};
+`,tt=r(t.SvgAiIcon)`
+  height: ${t.Space.sp3};
+  width: ${t.Space.sp3};
+  path {
+    stroke-width: 2;
+  }
+`,nt=r(t.ExtraSmallRegular)`
+  display: flex;
+  color: ${e=>e.theme.colors.primary};
+  align-items: center;
+  flex-direction: row;
+  justify-content: flex-end;
+  padding: ${t.Space.sp0} 6px;
+  border: 1px solid ${e=>e.theme.colors.primary};
+  border-radius: ${t.Space.sp1};
+`,ot=()=>null,it=()=>null,st=()=>null,rt=r.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+`,lt=r(t.SvgAddRound)`
+  margin-right: ${t.Space.sp1};
+  width: ${t.Space.sp3};
+  height: ${t.Space.sp3};
+  color: ${e=>e.hasError?t.Colors.important:e.theme.colors.grey1};
+`,at=r(t.StandardRegular)`
+  color: ${e=>e.hasError?t.Colors.important:e.theme.colors.grey1};
+`,ct=r.div``,dt=r.div`
+  display: flex;
+  align-items: center;
+  gap: ${t.Space.sp4};
+  margin-left: ${t.Space.sp2};
+`,pt=r.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+`,mt=r(t.ExtraSmallMediumSp)`
+  display: flex;
+  width: 100%;
+  align-items: center;
+  justify-content: center;
+  color: ${e=>e.confidence==null?e.theme.mode==="dark"?t.Colors.alert:t.Colors.alertDark:e.confidence>=90?e.theme.mode==="dark"?t.Colors.success:t.Colors.successDark:e.confidence>=70?e.theme.mode==="dark"?t.Colors.alert:t.Colors.alertDark:e.theme.mode==="dark"?t.Colors.important:t.Colors.importantDark};
+`,ut=r(t.ExtraSmallRegular)``,xt=r.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: ${e=>e.theme.colors.primary};
+`,ht=e=>$.createElement("svg",{viewBox:"0 0 32 32",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},$.createElement("path",{d:"M14.498 12.047L15.4956 9.35122C15.6688 8.88293 16.3312 8.88293 16.5044 9.35122L17.502 12.047C17.9222 13.1826 18.8174 14.0778 19.953 14.498L22.6488 15.4956C23.1171 15.6688 23.1171 16.3312 22.6488 16.5044L19.953 17.502C18.8174 17.9222 17.9222 18.8174 17.502 19.953L16.5044 22.6488C16.3312 23.1171 15.6688 23.1171 15.4956 22.6488L14.498 19.953C14.0778 18.8174 13.1826 17.9222 12.047 17.502L9.35122 16.5044C8.88293 16.3312 8.88293 15.6688 9.35122 15.4956L12.047 14.498C13.1826 14.0778 14.0778 13.1826 14.498 12.047Z",fill:"currentColor",stroke:"currentColor",strokeWidth:1.25}),$.createElement("path",{d:"M29.2611 5.55236L24.3943 10.1902C24.333 10.2488 24.2604 10.2943 24.181 10.3239C24.1016 10.3535 24.017 10.3667 23.9323 10.3626C23.8488 10.3586 23.7669 10.3379 23.6915 10.3018C23.6162 10.2656 23.5488 10.2146 23.4935 10.152L21.2781 7.63528",stroke:"currentColor",strokeWidth:1.25,strokeLinecap:"round",strokeLinejoin:"round"})),gt=e=>$.createElement("svg",{viewBox:"0 0 32 32",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},$.createElement("path",{d:"M14.498 12.047L15.4956 9.35122C15.6688 8.88293 16.3312 8.88293 16.5044 9.35122L17.502 12.047C17.9222 13.1826 18.8174 14.0778 19.953 14.498L22.6488 15.4956C23.1171 15.6688 23.1171 16.3312 22.6488 16.5044L19.953 17.502C18.8174 17.9222 17.9222 18.8174 17.502 19.953L16.5044 22.6488C16.3312 23.1171 15.6688 23.1171 15.4956 22.6488L14.498 19.953C14.0778 18.8174 13.1826 17.9222 12.047 17.502L9.35122 16.5044C8.88293 16.3312 8.88293 15.6688 9.35122 15.4956L12.047 14.498C13.1826 14.0778 14.0778 13.1826 14.498 12.047Z",stroke:"currentColor",strokeWidth:1.25}),$.createElement("path",{d:"M29.2611 5.55236L24.3943 10.1902C24.333 10.2488 24.2604 10.2943 24.181 10.3239C24.1016 10.3535 24.017 10.3667 23.9323 10.3626C23.8488 10.3586 23.7669 10.3379 23.6915 10.3018C23.6162 10.2656 23.5488 10.2146 23.4935 10.152L21.2781 7.63528",stroke:"currentColor",strokeWidth:1.25,strokeLinecap:"round",strokeLinejoin:"round"}));async function ft(e,i,s,c,l){let m,x;const p=`${e}/1.0/transactions/${l.id}/attachments`,h=new FormData;h.append("attachment_file_0",s);const a=JSON.stringify({transaction_type:l.type,transaction_id:l.id.split(":")[1],file_name:c,content_type:s.type});h.append("attachment_json_0",a);try{await n.fetch(p,{method:"POST",body:h,headers:{"zeni-user-id":i.userId,"zeni-tenant-id":i.tenantId,"zeni-session-id":i.sessionId}}).then(u=>u.json()).then(u=>{u.status.code>=200&&u.status.code<300?m=u.data:(x=u.status.message,console.error(`Upload attachment failed with ${u.status.message}`))})}catch(u){console.error(`Upload attachment failed with ${JSON.stringify(u)}`)}return{uploadResponse:m,errorMessage:x}}exports.GroupedSingleSelectFieldWithCOT=be;exports.SvgAiIconSelectedFilledPlain=ht;exports.SvgAiIconSelectedPlain=gt;exports.uploadAttachment=ft;

package/dist/zeniDatePicker.helpers-B0FocrGK.js

@@ -0,0 +1,14 @@
+import { dateNow as n, dateFromYearMonthDate as u } from "@zeniai/client-epic-state";
+import { a as o } from "./index-De4lhuEW.js";
+const d = u((/* @__PURE__ */ new Date()).getFullYear(), 0), f = [...Array(12)].map((t, r) => d.add(r, "month").format(o.getLocalizedStrings().dateFormat.visual.MMMMFormat)), s = () => n().subtract(1, "quarter").endOf("quarter"), m = () => n().subtract(1, "month").endOf("month"), h = ({
+  options: t,
+  selectedDate: r
+}) => {
+  const e = o.getLocalizedStrings().dateFormat.analytics.MMSlashDDSlashYYYYFormat;
+  return t.find((a) => a.value === "month" ? r.format(e) === m().format(e) : a.value === "quarter" ? r.format(e) === s().format(e) : !1)?.value;
+}, p = (t) => t === "month" ? m() : s(), g = (t) => f.findIndex((r) => r === t) + 1;
+export {
+  p as a,
+  h as f,
+  g
+};

package/dist/zeniDatePicker.helpers-DmyVDuXa.cjs

@@ -0,0 +1 @@
+"use strict";const n=require("@zeniai/client-epic-state"),o=require("./index-DHSetD4K.cjs"),s=n.dateFromYearMonthDate(new Date().getFullYear(),0),i=[...Array(12)].map((t,e)=>s.add(e,"month").format(o.appLocale.getLocalizedStrings().dateFormat.visual.MMMMFormat)),u=()=>n.dateNow().subtract(1,"quarter").endOf("quarter"),d=()=>n.dateNow().subtract(1,"month").endOf("month"),c=({options:t,selectedDate:e})=>{const r=o.appLocale.getLocalizedStrings().dateFormat.analytics.MMSlashDDSlashYYYYFormat;return t.find(a=>a.value==="month"?e.format(r)===d().format(r):a.value==="quarter"?e.format(r)===u().format(r):!1)?.value},m=t=>t==="month"?d():u(),l=t=>i.findIndex(e=>e===t)+1;exports.findSelectedPreComputedOption=c;exports.getMonthIndex=l;exports.getPreComputedOptionValue=m;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zeniai/web-components",
-  "version": "3.17.12",
+  "version": "3.17.14",
   "private": false,
   "type": "module",
   "sideEffects": [

package/dist/ACHDetailsPage-BZ460o0e.cjs

@@ -1,21 +0,0 @@
-"use strict";const t=require("./vendor-.pnpm-D0ILHvHB.cjs"),h=require("react"),l=require("@emotion/styled"),n=require("./index-CDBWihyC.cjs"),R=require("./BankAccountWarningSection-KvZva52q.cjs"),q=require("./MagicLinkTitleSection-ACtSS16T.cjs"),I=require("./BankAccountSection-DLgqEH1Z.cjs"),i={paddingTopBottomContainer:new n.ResponsiveSized(n.sp[3],n.sp[3]),paddingLeftContainer:new n.ResponsiveSized(n.sp[3],n.sp[6]),paddingRightContainer:new n.ResponsiveSized(n.sp[3],n.sp[8]),sectionTitleMarginLeft:new n.ResponsiveSized(n.sp[4],n.sp[6]),sectionTitleMarginTop:new n.ResponsiveSized(12,n.sp[3]),buttonWidth:new n.ResponsiveSized(140,140)},v="achDetailsPage",m="bankAccountSection",P=e=>`${e}_form`,M=({bankAccountCreationState:e,bankAccountToCreate:x,fetchBankNameByRoutingStatus:S,isDisabled:b,style:C,onSaveHandler:w,onBackClick:g,onACHDetailsUpdated:z,onFetchBankName:E,isMagicLink:u,companyName:y,currencySymbol:D,amount:N,bankAccountContext:A})=>{const r=n.useWindowSizeContext(),o=t.useForm({mode:"onBlur",reValidateMode:"onChange",defaultValues:h.useMemo(()=>W(x),[x])}),[B,d]=h.useState(!1),a=n.appLocale.getLocalizedStrings().spendManagement.billPay.vendorCreation,T=n.appLocale.getLocalizedStrings().common.footer,{achDetails:j,bankAccountCommon:f}=a,k={onOkClick:()=>{d(!1),o.reset(),g?.()},onCancelClick:()=>{d(!1)}},$=async(p,c)=>{const s=c[m].bankRoutingNumber;z(c),p===`${m}.bankRoutingNumber`&&s?.length===9&&n.DIGITS_PATTERN.test(s)===!0&&E?.(s)};h.useEffect(()=>{const p=o.watch((c,{name:s})=>{s!=null&&c!=null&&t.defer(()=>$(s,c))});return()=>{p.unsubscribe()}});const L=o.handleSubmit(p=>{S.fetchState!=="In-Progress"&&w("ach")});return t.jsxRuntimeExports.jsxs(_,{children:[t.jsxRuntimeExports.jsxs(F,{style:C,size:r,children:[B===!0?t.jsxRuntimeExports.jsx(n.ConfirmationPopup,{titleComponent:t.jsxRuntimeExports.jsx(n.ConfirmationPopUpTitle,{children:a.discardTitle}),descriptionComponent:t.jsxRuntimeExports.jsx(n.ConfirmationPopUpDescription,{children:a.discardDescription}),primaryButtonText:a.discard,secondaryButtonText:a.cancel,action:k}):null,t.jsxRuntimeExports.jsx(R.BankAccountPageNavSection,{header:u?t.jsxRuntimeExports.jsx(q.MagicLinkTitleSection,{companyName:y??"",currencySymbol:D??"",amount:N??0}):j.addACHDetails,isMagicLink:u,isDirty:o.formState.isDirty,onBackClick:g,setShowConfirmationPopup:d}),e?.fetchState==="Error"&&e.error?.code===409?t.jsxRuntimeExports.jsx(R.BankAccountWarningSection,{warningText:f.accountExistWarning}):null,A==="express-pay"?null:t.jsxRuntimeExports.jsx(V,{size:r,children:j.title}),t.jsxRuntimeExports.jsx(O,{children:t.jsxRuntimeExports.jsx(t.FormProvider,{...o,children:t.jsxRuntimeExports.jsx("form",{id:P(v),onSubmit:L,children:t.jsxRuntimeExports.jsx(H,{size:r,children:t.jsxRuntimeExports.jsx(I.BankAccountSection,{bankAccountToCreate:x,fetchBankNameByRoutingStatus:S,sectionId:m,isDisabled:b})})})})})]}),t.jsxRuntimeExports.jsx(n.Footer,{formId:P(v),primaryBtn:{label:u?f.submitDetails:f.saveAccount,isLoading:e.fetchState==="In-Progress",style:{width:i.buttonWidth.value(r)},isDisabled:b!=null},showCancel:!u,cancelBtn:{label:T.cancel,style:{width:i.buttonWidth.value(r)},shouldResetOnCancel:!1,onClick:()=>{o.formState.isDirty?d(!0):(o.reset(),g?.())}}})]})},W=e=>({[m]:{bankRoutingNumber:e?.bankRoutingNumber,bankName:e?.bankName,bankAccountNumber:e?.bankAccountNumber,confirmedBankAccountNumber:e?.confirmedBankAccountNumber,bankAccountName:e?.bankAccountName,bankAccountType:e?.bankAccountType}}),H=l.div`
-  padding-left: ${e=>i.paddingLeftContainer.valuePx(e.size)};
-  padding-right: ${e=>i.paddingRightContainer.valuePx(e.size)};
-  padding-top: ${e=>i.paddingTopBottomContainer.valuePx(e.size)};
-  padding-bottom: ${e=>i.paddingTopBottomContainer.valuePx(e.size)};
-`,_=l.div`
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  height: 100%;
-`,F=l.div`
-  display: flex;
-  flex-direction: column;
-  flex-grow: 1;
-`,V=l(n.LargeSemiBold)`
-  color: ${e=>e.theme.colors.champion};
-  margin-left: ${e=>i.sectionTitleMarginLeft.valuePx(e.size)};
-  margin-top: ${e=>i.sectionTitleMarginTop.valuePx(e.size)};
-`,O=l.div`
-  margin-top: ${n.Space.sp5};
-`;exports.ACHDetailsPage=M;

package/dist/ACHDetailsPage-C2CeBBx-.js

@@ -1,160 +0,0 @@
-import { g as M, h as W, j as n, F as E } from "./vendor-.pnpm-B2klaOGU.js";
-import { useMemo as F, useState as H, useEffect as V } from "react";
-import d from "@emotion/styled";
-import { u as _, a as C, aP as O, aQ as U, aR as q, ao as G, R as s, aX as Q, k as X, S as J, D as t } from "./index-HuMzFv1o.js";
-import { B as K, a as Y } from "./BankAccountWarningSection-BLMWE4__.js";
-import { M as Z } from "./MagicLinkTitleSection-CZ7CLpj3.js";
-import { B as ee } from "./BankAccountSection-CUEcWOPO.js";
-const o = {
-  paddingTopBottomContainer: new s(t[3], t[3]),
-  paddingLeftContainer: new s(t[3], t[6]),
-  paddingRightContainer: new s(t[3], t[8]),
-  sectionTitleMarginLeft: new s(t[4], t[6]),
-  sectionTitleMarginTop: new s(12, t[3]),
-  buttonWidth: new s(140, 140)
-}, w = "achDetailsPage", f = "bankAccountSection", y = (e) => `${e}_form`, fe = ({
-  bankAccountCreationState: e,
-  bankAccountToCreate: g,
-  fetchBankNameByRoutingStatus: b,
-  isDisabled: S,
-  style: j,
-  onSaveHandler: v,
-  onBackClick: h,
-  onACHDetailsUpdated: D,
-  onFetchBankName: N,
-  isMagicLink: u,
-  companyName: B,
-  currencySymbol: z,
-  amount: T,
-  bankAccountContext: A
-}) => {
-  const r = _(), i = M({
-    mode: "onBlur",
-    reValidateMode: "onChange",
-    defaultValues: F(
-      () => ne(g),
-      [g]
-    )
-  }), [R, m] = H(!1), c = C.getLocalizedStrings().spendManagement.billPay.vendorCreation, k = C.getLocalizedStrings().common.footer, { achDetails: P, bankAccountCommon: x } = c, $ = {
-    onOkClick: () => {
-      m(!1), i.reset(), h?.();
-    },
-    onCancelClick: () => {
-      m(!1);
-    }
-  }, I = async (p, l) => {
-    const a = l[f].bankRoutingNumber;
-    D(l), p === `${f}.bankRoutingNumber` && a?.length === 9 && Q.test(a) === !0 && N?.(a);
-  };
-  V(() => {
-    const p = i.watch((l, { name: a }) => {
-      a != null && l != null && W(() => I(a, l));
-    });
-    return () => {
-      p.unsubscribe();
-    };
-  });
-  const L = i.handleSubmit((p) => {
-    b.fetchState !== "In-Progress" && v("ach");
-  });
-  return /* @__PURE__ */ n.jsxs(oe, { children: [
-    /* @__PURE__ */ n.jsxs(ie, { style: j, size: r, children: [
-      R === !0 ? /* @__PURE__ */ n.jsx(
-        O,
-        {
-          titleComponent: /* @__PURE__ */ n.jsx(q, { children: c.discardTitle }),
-          descriptionComponent: /* @__PURE__ */ n.jsx(U, { children: c.discardDescription }),
-          primaryButtonText: c.discard,
-          secondaryButtonText: c.cancel,
-          action: $
-        }
-      ) : null,
-      /* @__PURE__ */ n.jsx(
-        K,
-        {
-          header: u ? /* @__PURE__ */ n.jsx(
-            Z,
-            {
-              companyName: B ?? "",
-              currencySymbol: z ?? "",
-              amount: T ?? 0
-            }
-          ) : P.addACHDetails,
-          isMagicLink: u,
-          isDirty: i.formState.isDirty,
-          onBackClick: h,
-          setShowConfirmationPopup: m
-        }
-      ),
-      e?.fetchState === "Error" && e.error?.code === 409 ? /* @__PURE__ */ n.jsx(
-        Y,
-        {
-          warningText: x.accountExistWarning
-        }
-      ) : null,
-      A === "express-pay" ? null : /* @__PURE__ */ n.jsx(ae, { size: r, children: P.title }),
-      /* @__PURE__ */ n.jsx(se, { children: /* @__PURE__ */ n.jsx(E, { ...i, children: /* @__PURE__ */ n.jsx("form", { id: y(w), onSubmit: L, children: /* @__PURE__ */ n.jsx(te, { size: r, children: /* @__PURE__ */ n.jsx(
-        ee,
-        {
-          bankAccountToCreate: g,
-          fetchBankNameByRoutingStatus: b,
-          sectionId: f,
-          isDisabled: S
-        }
-      ) }) }) }) })
-    ] }),
-    /* @__PURE__ */ n.jsx(
-      G,
-      {
-        formId: y(w),
-        primaryBtn: {
-          label: u ? x.submitDetails : x.saveAccount,
-          isLoading: e.fetchState === "In-Progress",
-          style: { width: o.buttonWidth.value(r) },
-          isDisabled: S != null
-        },
-        showCancel: !u,
-        cancelBtn: {
-          label: k.cancel,
-          style: { width: o.buttonWidth.value(r) },
-          shouldResetOnCancel: !1,
-          onClick: () => {
-            i.formState.isDirty ? m(!0) : (i.reset(), h?.());
-          }
-        }
-      }
-    )
-  ] });
-}, ne = (e) => ({
-  [f]: {
-    bankRoutingNumber: e?.bankRoutingNumber,
-    bankName: e?.bankName,
-    bankAccountNumber: e?.bankAccountNumber,
-    confirmedBankAccountNumber: e?.confirmedBankAccountNumber,
-    bankAccountName: e?.bankAccountName,
-    bankAccountType: e?.bankAccountType
-  }
-}), te = d.div`
-  padding-left: ${(e) => o.paddingLeftContainer.valuePx(e.size)};
-  padding-right: ${(e) => o.paddingRightContainer.valuePx(e.size)};
-  padding-top: ${(e) => o.paddingTopBottomContainer.valuePx(e.size)};
-  padding-bottom: ${(e) => o.paddingTopBottomContainer.valuePx(e.size)};
-`, oe = d.div`
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  height: 100%;
-`, ie = d.div`
-  display: flex;
-  flex-direction: column;
-  flex-grow: 1;
-`, ae = d(X)`
-  color: ${(e) => e.theme.colors.champion};
-  margin-left: ${(e) => o.sectionTitleMarginLeft.valuePx(e.size)};
-  margin-top: ${(e) => o.sectionTitleMarginTop.valuePx(e.size)};
-`, se = d.div`
-  margin-top: ${J.sp5};
-`;
-export {
-  fe as A
-};