@zeniai/web-components 3.16.56 → 3.16.57

package/dist/IssueChargeCardPage-BlLGPqoK.cjs

@@ -0,0 +1,532 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./vendor-.pnpm-BW93Fnli.cjs"),U=require("react"),l=require("@emotion/styled"),e=require("./index-C8marfrT.cjs"),qe=require("./LabeledUserSingleSelectWithSubtitlesField-C-GvQ5SR.cjs"),nt=require("@zeniai/client-epic-state"),He=require("./RoleWithToolTip-B3Pd437z.cjs"),de=t=>{const{common:a,spendManagement:{chargeCard:{issueCard:d}}}=e.appLocale.getLocalizedStrings();switch(t){case"monthly":return d.frequencySubLabels.monthly;case"quarterly":return d.frequencySubLabels.quarterly;case"weekly":return d.frequencySubLabels.weekly;case"yearly":return d.frequencySubLabels.yearly;default:return a.strings.empty}},ct=["creditCard","debitCard"],$e=t=>nt.stringToUnion(t,ct),h=(t,a)=>`${t}.${a}`,{commonSetUp:{businessVerification:{addressPlaceholder:we,customAddressPlaceholder:pt}},spendManagement:{chargeCard:{issueCard:A}}}=e.appLocale.getLocalizedStrings(),M={largeLabelWidth:new e.ResponsiveSized(120,120,200),labelMarginRight:new e.ResponsiveSized(e.sp[3],e.sp[4]),labelMarginBottom:new e.ResponsiveSized(e.sp[2],e.sp[0]),infoLabelMarginTop:new e.ResponsiveSized(e.sp[1],e.sp[0]),radioLabelPaddingLeftRight:new e.ResponsiveSized(e.sp[2],e.sp[3]),radioLabelPaddingLeft:new e.ResponsiveSized(e.sp[0],e.sp[3]),radioLabelPaddingRight:new e.ResponsiveSized(10,e.sp[3]),labeledFieldPaddingLeft:new e.ResponsiveSized(e.sp[3],e.sp[0]),labeledFieldPaddingRight:new e.ResponsiveSized(e.sp[3],e.sp[2]),labeledFieldPaddingBottom:new e.ResponsiveSized(e.sp[3],e.sp[2])},ut={infoLabel:new e.ResponsiveSizedStyle("smallRegular","smallRegular")},mt="creditCard.physicalCard.amount",ht="creditCard.physicalCard.cardName",xt="creditCard.physicalCard.user",gt="creditCard.physicalCard.frequency",te="creditCard.physicalCard.addressType",bt=({lineData:t,issueCardSectionId:a,limit:d,creditLimitFrequency:x,activeChargeCardCount:f,allRoles:g,allAccountingClasses:E,companyAddress:m,customAddress:j,userAddress:$,userList:n,maxPhysicalChargeCardPerUser:P,openAddAddressDrawerHandler:c})=>{const o=e.useWindowSizeContext(),W=r.useTheme(),{getValues:O}=r.useFormContext(),y=M.largeLabelWidth.value(o),k=()=>{c(t.lineId,"creditCard")},N=(i,u)=>r.jsxRuntimeExports.jsx(yt,{isOptionSelected:u,children:de(i)}),s=t.creditCard.physicalCard.addressType,p=t.creditCard.physicalCard.amount,L=e.currencyAmountCompactFormatter(d.amount),S=p!=null&&p>d.amount,b=S?A.amountExceedError.replace("_amount_",L):void 0,w=t.creditCard.physicalCard.user,T=w.allUsers.find(i=>i.userId===w.selectedUser),G=T?.userId,D=G!=null?$[G]:void 0,J=i=>{let u=f[i]?.physicalCardCount??0;return O().lineInfo.forEach(_=>{_.creditCard.cardType==="business_physical_credit_card"&&_.creditCard.physicalCard.user.selectedUser===i&&(u+=1)}),u>=P};return r.jsxRuntimeExports.jsxs(r.jsxRuntimeExports.Fragment,{children:[r.jsxRuntimeExports.jsx(qe.LabeledUserSingleSelectWithSubtitlesField,{label:{label:A.cardholderLabel,width:y},userSingleSelectWithSubTitlesField:{name:h(a,xt),placeholderLabel:A.usersPlaceholder,value:{allUsers:n,selectedUser:t.creditCard.physicalCard.user.selectedUser},registerOptions:{required:!0,validate:i=>i?.selectedUser?.length>0},valueToSubtitle:i=>{const u=g.find(_=>_.userId===i),R=[];return u?.accountingClassIDs.forEach(_=>{const Z=E.find(ee=>ee.classId===_);Z!=null&&Z.className&&R.push(Z.className)}),R},additionalLabelInfo:A.additionalInfoPhysical,showOnlyAvatar:!0,showAvatarAndSubtitles:!1,isOptionDisabled:J,disabledOptionHint:A.cardLimitWarning,bigMarginRightForSmallScreens:!0,optionStyles:{maxHeight:e.Space.sp10,minHeight:e.Space.sp6,height:"max-content"}},style:{width:"100%",paddingLeft:M.labelMarginBottom.value(o)}}),r.jsxRuntimeExports.jsx(pe,{}),r.jsxRuntimeExports.jsx(e.LabeledTextField,{label:{label:A.cardNameLabel,width:y},style:{width:"auto",paddingLeft:M.labelMarginBottom.value(o)},text:{type:"text",name:h(a,ht),defaultValue:t.creditCard.physicalCard.cardName,placeholder:A.cardNamePlaceholder,options:{required:!0,validate:i=>i!=null}}}),r.jsxRuntimeExports.jsx(pe,{}),r.jsxRuntimeExports.jsx(e.LabeledFormattedTextField,{label:{label:A.amountLabel,width:y},showAdditionalInfoLabel:S,additionalInfoLabel:b,formattedTextField:{type:"number",name:h(a,mt),defaultValue:t.creditCard.physicalCard.amount,placeholder:A.amountPlaceholder,returnValueType:"floatValue",prefix:"$",allowNegative:!0,isNumericString:!1,registerOptions:{required:!0,validate:i=>!!i&&i>0&&i<=d.amount},autoComplete:"off",decimalSeparator:".",decimalScale:2,fixedDecimalScale:!1,thousandSeparator:!0},isFieldError:S,style:{width:"auto",paddingLeft:M.labelMarginBottom.value(o)}}),r.jsxRuntimeExports.jsx(pe,{}),r.jsxRuntimeExports.jsx(e.LabeledSingleSelectPickerField,{isDisabled:"readonly",label:{label:A.frequencyLabel,width:y,style:{marginBottom:M.labelMarginBottom.valuePx(o),marginRight:M.labelMarginRight.valuePx(o)}},style:{width:"100%",paddingLeft:M.labelMarginBottom.valuePx(o)},infoLabelStyle:{...e.textStyles.smallRegular.cssObject,textAlign:"right",paddingRight:e.Space.sp3,marginTop:M.infoLabelMarginTop.valuePx(o),color:W.colors.hero},valueToAdditionalLabel:i=>de(i),singleSelectPickerField:{name:h(a,gt),placeholder:A.frequencyPlaceholder,style:{position:"relative"},capitalizeOptions:!0,showSubLabelsInSingleValue:!1,defaultValue:{selectedOption:t.creditCard.physicalCard.frequency.selectedOption,allOptions:x.map(i=>({label:i.name,value:i.code}))},valueToSubLabels:(i,u)=>N(i,u),textAlignment:"right",registerOptions:{required:!0,validate:i=>i!=null&&!!i.selectedOption}}}),r.jsxRuntimeExports.jsx(pe,{}),r.jsxRuntimeExports.jsxs(St,{windowSize:o,children:[r.jsxRuntimeExports.jsxs(Ct,{windowSize:o,children:[r.jsxRuntimeExports.jsx(e.Label,{label:A.address.shippingAddressLabel,htmlFor:h(a,te),style:{marginLeft:e.Space.sp4,marginRight:M.labelMarginRight.valuePx(o),marginTop:e.Space.sp2,width:o==="small"?"auto":y}}),r.jsxRuntimeExports.jsx(vt,{windowSize:o,children:r.jsxRuntimeExports.jsxs(jt,{isDisabled:T==null,children:[D!=null&&r.jsxRuntimeExports.jsx(e.LabeledRadioField,{isContainerClickable:!0,label:{label:A.address.personal},isDisabled:T==null?"disabled":void 0,style:{padding:`${e.Space.sp2} ${e.Space.sp0}`,paddingLeft:M.radioLabelPaddingLeftRight.value(o),paddingRight:M.radioLabelPaddingRight.value(o),width:"fit-content"},radioField:{name:h(a,te),id:`${h(a,te)}.${A.address.personal}`,value:"card_holder_personal_address",radioSize:"small",registerOptions:{required:!0}}}),r.jsxRuntimeExports.jsx(e.LabeledRadioField,{isContainerClickable:!0,label:{label:A.address.company},isDisabled:T==null?"disabled":void 0,style:{padding:`${e.Space.sp2} ${e.Space.sp0}`,paddingLeft:M.radioLabelPaddingLeft.value(o),paddingRight:M.radioLabelPaddingRight.value(o),width:"fit-content"},radioField:{name:h(a,te),id:`${h(a,te)}.${A.address.company}`,value:"company_address",radioSize:"small",registerOptions:{required:!0}}}),r.jsxRuntimeExports.jsx(e.LabeledRadioField,{isContainerClickable:!0,label:{label:A.address.custom},isDisabled:T==null?"disabled":void 0,style:{padding:`${e.Space.sp2} ${e.Space.sp0}`,paddingLeft:M.radioLabelPaddingLeft.value(o),paddingRight:M.radioLabelPaddingLeftRight.value(o),width:"fit-content"},radioField:{name:h(a,te),id:`${h(a,te)}.${A.address.custom}`,value:"custom_address",radioSize:"small",registerOptions:{required:!0}}})]})})]}),r.jsxRuntimeExports.jsx(Rt,{windowSize:o,children:T?.user!=null&&s!=null&&r.jsxRuntimeExports.jsx(ft,{children:s==="card_holder_personal_address"?r.jsxRuntimeExports.jsxs(r.jsxRuntimeExports.Fragment,{children:[r.jsxRuntimeExports.jsx(e.AddressValueField,{name:"personal_address_value_field",defaultValue:D,isDisabled:"readonly",placeholder:we,style:{minHeight:e.Space.sp4,paddingTop:e.Space.sp2,paddingBottom:e.Space.sp2,width:"100%",display:"flex",flexGrow:1}}),r.jsxRuntimeExports.jsx(Le,{windowSize:o,children:A.address.personalAddressText.replace("_name_",T.user.firstName)})]}):s==="company_address"?r.jsxRuntimeExports.jsx(e.AddressValueField,{name:"company_address_value_field",defaultValue:m,isDisabled:"readonly",placeholder:we,style:{minHeight:e.Space.sp4,paddingTop:e.Space.sp2,paddingBottom:e.Space.sp2,width:"100%",display:"flex",flexGrow:1}}):r.jsxRuntimeExports.jsxs(r.jsxRuntimeExports.Fragment,{children:[r.jsxRuntimeExports.jsx(e.AddressValueField,{name:"custom_address_value_field",defaultValue:j[t.lineId],placeholder:pt,style:{minHeight:e.Space.sp4,paddingTop:e.Space.sp2,paddingBottom:e.Space.sp2,width:"100%",display:"flex",flexGrow:1},onClick:k}),r.jsxRuntimeExports.jsx(Le,{windowSize:o,children:A.address.customAddressText})]})})})]})]})},ft=l.div`
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  align-items: flex-end;
+  flex-grow: 1;
+`,Le=l(e.SmallRegular)`
+  display: flex;
+  color: ${t=>t.theme.colors.hero};
+  padding-right: 12px;
+  text-align: right;
+  ${t=>`${ut.infoLabel.style(t.windowSize)}`};
+`,yt=l(e.SmallRegular)`
+  color: ${t=>t.isOptionSelected?t.theme.colors.primary:t.theme.colors.grey1};
+`,pe=l.div`
+  display: flex;
+  flex: 1;
+  background-color: ${t=>t.theme.colors.grey3};
+  min-height: 1px;
+  max-height: 1px;
+`,St=l.div`
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  background-color: ${t=>t.theme.colors.grey5};
+  min-height: ${e.Space.sp6};
+  padding-right: ${e.Space.sp2};
+  padding-top: ${e.Space.sp2};
+  padding-bottom: ${e.Space.sp2};
+
+  &:focus-within {
+    border-color: ${t=>t.theme.colors.primary};
+    color: ${t=>t.theme.colors.primary};
+    z-index: 2;
+    outline: 1px solid ${t=>t.theme.colors.primary};
+  }
+
+  :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;
+  }
+
+  &:hover {
+    z-index: 1;
+    outline: 1px solid ${t=>t.theme.colors.primary};
+    .user-multi-select-field__control {
+      background-color: ${t=>t.theme.colors.background};
+    }
+  }
+`,vt=l.div`
+  flex-grow: 1;
+  display: flex;
+  width: ${t=>t.windowSize==="small"?"auto":`calc(100% - ${M.largeLabelWidth.valuePx(t.windowSize)})`};
+  align-items: center;
+  justify-content: flex-end;
+  padding-right: ${t=>M.labelMarginBottom.valuePx(t.windowSize)};
+`,Rt=l.div`
+  display: flex;
+  flex-direction: column;
+  text-align: right;
+  color: ${t=>t.theme.colors.primary};
+  padding-left: ${e.Space.sp4};
+  width: 100%;
+`,Ct=l.div`
+  color: ${t=>t.theme.colors.primary};
+  width: 100%;
+  display: flex;
+  flex-direction: ${t=>t.windowSize==="small"?"column":"row"};
+`,jt=l.div`
+  width: 100%;
+  display: flex;
+  justify-content: flex-end;
+  &:hover {
+    fill: ${t=>t.theme.colors.primary};
+  }
+`,{spendManagement:{chargeCard:{issueCard:q}}}=e.appLocale.getLocalizedStrings(),Y={largeLabelWidth:new e.ResponsiveSized(120,120,200),labelMarginRight:new e.ResponsiveSized(e.sp[3],e.sp[4]),largeLabelMarginRight:new e.ResponsiveSized(e.sp[2],12),labelMarginBottom:new e.ResponsiveSized(e.sp[2],e.sp[0]),infoLabelMarginTop:new e.ResponsiveSized(e.sp[1],e.sp[0])},$t={infoLabel:new e.ResponsiveSizedStyle("smallRegular","smallRegular")},wt="debitCard.virtualCard.amount",Lt="debitCard.virtualCard.cardName",Ee="debitCard.virtualCard.users",Et="debitCard.virtualCard.frequency",Tt="debitCard.virtualCard.connectedAccount",Pt=({lineData:t,issueCardSectionId:a,cardHolderCandidates:d,creditLimitFrequency:x,allRoles:f,depositAccounts:g,allAccountingClasses:E,activeDebitCardCount:m,maxVirtualDebitCardPerUser:j})=>{const $=r.useTheme(),n=e.useWindowSizeContext(),{getValues:P}=r.useFormContext(),c=Y.largeLabelWidth.value(n),o=t.debitCard.virtualCard.amount,O=g.find(s=>s.id===t.debitCard.virtualCard.connectedAccount.selectedOption)?.cardLimits.dailyCardTransactionLimit.amount,y=o!=null&&O!=null&&o>O,k=y?q.amountExceedDebitCardError.replace("_amount_",e.currencyAmountCompactFormatter(O)):void 0,N=s=>{let p=0;const L=t.debitCard.virtualCard.connectedAccount.selectedOption;return L!=null&&m?.[L]?.[s]!=null&&(p=m[L][s].virtualCardCount),P().lineInfo.forEach(b=>{b.debitCard.cardType==="business_virtual_debit_card"&&b.debitCard.virtualCard.users.selectedUsers.forEach(w=>{w.userId===s&&(p+=1)})}),p>=j};return r.jsxRuntimeExports.jsxs(r.jsxRuntimeExports.Fragment,{children:[r.jsxRuntimeExports.jsx(Pe,{label:{label:q.connectedAccountLabel,width:c,style:{marginLeft:e.Space.sp4,marginRight:Y.largeLabelMarginRight.value(n),marginTop:e.Space.sp2,width:c}},style:{width:"auto"},singleSelectPickerField:{name:h(a,Tt),placeholder:q.selectAccountPlaceholder,style:{position:"relative"},capitalizeOptions:!0,valueToLogo:(s,p)=>Ge(g,s,p),valueToSubLabels:(s,p)=>xe(g,s,p),defaultValue:{selectedOption:t.debitCard.virtualCard.connectedAccount.selectedOption,allOptions:g.map(s=>({label:s.accountName,value:s.id}))},isOptionRemovable:!1,textAlignment:"right",registerOptions:{required:!0,validate:s=>s!=null&&!!s.selectedOption}}}),r.jsxRuntimeExports.jsx(ue,{}),r.jsxRuntimeExports.jsxs(Nt,{windowSize:n,children:[r.jsxRuntimeExports.jsx(e.Label,{label:q.cardholdersLabel,htmlFor:h(a,Ee),style:{marginLeft:e.Space.sp4,marginRight:Y.labelMarginRight.value(n),marginTop:e.Space.sp2,width:c}}),r.jsxRuntimeExports.jsxs(Mt,{windowSize:n,children:[r.jsxRuntimeExports.jsx(e.UserMultiSelectField,{hideEmailTooltip:!0,shouldHaveBackgroundColor:!1,showBackgroundColorIfHasAnySelectedOption:!1,placeholderLabel:q.usersPlaceholder,name:h(a,Ee),value:{allUsers:d,selectedUsers:t.debitCard.virtualCard.users.selectedUsers,allNonUsers:[],selectedNonUsers:[]},registerOptions:{required:!0,validate:s=>s?.selectedUsers?.length>0},valueToSubtitle:s=>{const p=f.find(S=>S.userId===s),L=[];return p!=null&&(L.push(r.jsxRuntimeExports.jsx(He.RoleWithToolTip,{roles:p.userRoles})),p.accountingClassIDs.forEach(S=>{const b=E.find(w=>w.classId===S);b!=null&&b.className&&L.push(b.className)})),L},disableCurrentOption:N,disabledOptionHint:q.cardLimitWarning,customStyleConfig:{placeholder:()=>({margin:e.Space.sp0}),input:(s,{selectProps:p})=>({display:p.menuIsOpen===!1&&t.debitCard.virtualCard.users.selectedUsers.length>0&&n!=="small"?"none":"unset",width:n==="small"&&t.debitCard.virtualCard.users.selectedUsers.length>0?"100%":`calc(100% - ${e.Space.sp5})`,padding:t.debitCard.virtualCard.users.selectedUsers.length===0?`${e.Space.sp0} ${e.Space.sp3}`:e.Space.sp0,...e.textStyles.standardRegular.cssObject,height:e.Space.sp4,zIndex:0,position:t.debitCard.virtualCard.users.selectedUsers.length===0||n==="small"&&p.menuIsOpen===!1?"absolute":"unset",left:e.Space.sp0,">input":{...e.textStyles.smallBold.cssObject,height:"100%",cursor:"pointer"}})}}),r.jsxRuntimeExports.jsx(Bt,{size:n,children:q.additionalInfoVirtual})]})]}),r.jsxRuntimeExports.jsx(ue,{}),r.jsxRuntimeExports.jsx(e.LabeledTextField,{label:{label:q.cardNameLabel,width:c},style:{width:"auto",paddingLeft:Y.labelMarginBottom.value(n)},text:{type:"text",name:h(a,Lt),defaultValue:t.debitCard.virtualCard.cardName,placeholder:q.cardNamePlaceholder,options:{required:!0,validate:s=>s!=null}}}),r.jsxRuntimeExports.jsx(ue,{}),r.jsxRuntimeExports.jsx(e.LabeledFormattedTextField,{label:{label:q.amountLabel,width:c},showAdditionalInfoLabel:y,additionalInfoLabel:k,formattedTextField:{type:"number",name:h(a,wt),defaultValue:t.debitCard.virtualCard.amount,placeholder:q.amountPlaceholder,returnValueType:"floatValue",prefix:"$",allowNegative:!0,isNumericString:!1,registerOptions:{required:!0,validate:s=>O!=null?!!s&&s>0&&s<=O:!!s&&s>0},autoComplete:"off",decimalSeparator:".",decimalScale:2,fixedDecimalScale:!1,thousandSeparator:!0},style:{width:"auto",paddingLeft:Y.labelMarginBottom.value(n)},isFieldError:y}),r.jsxRuntimeExports.jsx(ue,{}),r.jsxRuntimeExports.jsx(_t,{size:n,children:r.jsxRuntimeExports.jsx(Pe,{isDisabled:"readonly",label:{label:q.frequencyLabel,width:c,style:{marginLeft:e.Space.sp0,marginBottom:Y.labelMarginBottom.valuePx(n),marginRight:Y.labelMarginRight.valuePx(n)}},style:{width:"100%",padding:e.Space.sp0,display:n==="small"?"flex":"inherit"},infoLabelStyle:{...e.textStyles.smallRegular.cssObject,textAlign:"right",paddingRight:e.Space.sp3,marginTop:Y.infoLabelMarginTop.valuePx(n),color:$.colors.hero},valueToAdditionalLabel:s=>de(s),singleSelectPickerField:{name:h(a,Et),placeholder:q.frequencyPlaceholder,style:{position:"relative"},capitalizeOptions:!0,showSubLabelsInSingleValue:!1,defaultValue:{selectedOption:t.debitCard.virtualCard.frequency.selectedOption,allOptions:x.map(s=>({label:s.name,value:s.code}))},valueToSubLabels:(s,p)=>xe(g,s,p),textAlignment:"right",registerOptions:{required:!0,validate:s=>s!=null&&!!s.selectedOption}}})})]})},Ge=(t,a,d)=>{if(a==="")return r.jsxRuntimeExports.jsx(Ft,{});const x=t.find(g=>g.id===a),f=t.findIndex(g=>g.id===a);return x!=null?r.jsxRuntimeExports.jsx(Ot,{isOptionSelected:d,children:r.jsxRuntimeExports.jsx(At,{color:e.getAccountsColorMappingFromIndex(f)})}):null},xe=(t,a,d)=>{if(!a)return null;const x=t.find(f=>f.id===a);return d===!0?r.jsxRuntimeExports.jsx(It,{children:x?.maskedAccountNumber}):r.jsxRuntimeExports.jsxs(Ut,{className:"option-sublabel",children:[r.jsxRuntimeExports.jsx(Te,{children:x?.maskedAccountNumber}),x?.accountBalance?.available?r.jsxRuntimeExports.jsx(zt,{}):null,x?.accountBalance?.available?r.jsxRuntimeExports.jsx(Te,{children:e.amountToString("0,0[.]00",x.accountBalance.available)}):null]})},It=l.span`
+  margin-left: ${e.Space.sp2};
+`,Te=l.div``,zt=l.div`
+  width: ${e.Space.sp1};
+  height: ${e.Space.sp1};
+  min-width: ${e.Space.sp1};
+  background-color: ${t=>t.theme.colors.grey1};
+  border-radius: 50%;
+`,Ot=l.div`
+  min-width: ${t=>t.isOptionSelected?e.Space.sp4:e.Space.sp5};
+  width: ${t=>t.isOptionSelected?e.Space.sp4:e.Space.sp5};
+  height: ${t=>t.isOptionSelected?e.Space.sp4:e.Space.sp5};
+  margin-right: ${e.Space.sp2};
+`,At=l(e.SvgZeniBrandCheckingAcc)`
+  min-width: inherit;
+  width: inherit;
+  height: inherit;
+`,Ft=l(e.SvgAddRound)`
+  min-width: ${e.Space.sp4};
+  width: ${e.Space.sp4};
+  height: ${e.Space.sp4};
+  margin-right: 12px;
+  margin-left: ${e.Space.sp1};
+  color: ${t=>t.theme.colors.hero};
+`,_t=l.div`
+  display: flex;
+  flex-direction: row;
+  padding: ${e.Space.sp2};
+  padding-left: ${e.Space.sp4};
+  justify-content: space-between;
+  color: ${t=>t.theme.colors.hero};
+  :last-of-type {
+    border-bottom-left-radius: inherit;
+    border-bottom-right-radius: inherit;
+  }
+`,Ut=l(e.ExtraSmallRegular)`
+  color: ${t=>t.theme.colors.grey1};
+  display: flex;
+  align-items: center;
+  gap: ${e.Space.sp2};
+`,Bt=l.label`
+  color: ${t=>t.theme.colors.hero};
+  width: 100%;
+  ${t=>`${$t.infoLabel.style(t.size)}`};
+  padding-right: ${e.Space.sp3};
+  text-align: right;
+  white-space: pre-line;
+`,ue=l.div`
+  display: flex;
+  flex: 1;
+  background-color: ${t=>t.theme.colors.grey3};
+  min-height: 1px;
+  max-height: 1px;
+`,Mt=l.div`
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+  width: ${t=>`calc(100% - ${Y.largeLabelWidth.valuePx(t.windowSize)})`};
+  align-items: flex-end;
+  flex-grow: 1;
+`,Pe=l(e.LabeledSingleSelectPickerField)`
+  border-radius: ${e.Space.sp2};
+  border: 1px solid ${t=>t.theme.colors.grey3};
+`,Nt=l.div`
+  display: flex;
+  flex-direction: row;
+  align-items: flex-start;
+  background-color: ${t=>t.theme.colors.grey5};
+  min-height: ${e.Space.sp6};
+  padding-right: ${e.Space.sp2};
+  padding-top: ${e.Space.sp2};
+  padding-bottom: ${e.Space.sp2};
+
+  &:focus-within {
+    border-color: ${t=>t.theme.colors.primary};
+    color: ${t=>t.theme.colors.primary};
+    z-index: 2;
+    outline: 1px solid ${t=>t.theme.colors.primary};
+  }
+
+  :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;
+  }
+
+  &:hover {
+    z-index: 1;
+    outline: 1px solid ${t=>t.theme.colors.primary};
+    .user-multi-select-field__control {
+      background-color: ${t=>t.theme.colors.background};
+    }
+  }
+`,{commonSetUp:{businessVerification:{addressPlaceholder:Ie,customAddressPlaceholder:kt}},spendManagement:{chargeCard:{issueCard:z}}}=e.appLocale.getLocalizedStrings(),B={largeLabelWidth:new e.ResponsiveSized(120,120,200),labelMarginRight:new e.ResponsiveSized(e.sp[3],e.sp[4]),largeLabelMarginRight:new e.ResponsiveSized(e.sp[2],12),labelMarginBottom:new e.ResponsiveSized(e.sp[2],e.sp[0]),infoLabelMarginTop:new e.ResponsiveSized(e.sp[1],e.sp[0]),radioLabelPaddingLeftRight:new e.ResponsiveSized(e.sp[2],e.sp[3]),radioLabelPaddingLeft:new e.ResponsiveSized(e.sp[0],e.sp[3]),radioLabelPaddingRight:new e.ResponsiveSized(10,e.sp[3]),labeledFieldPaddingLeft:new e.ResponsiveSized(e.sp[3],e.sp[0]),labeledFieldPaddingRight:new e.ResponsiveSized(e.sp[3],e.sp[2]),labeledFieldPaddingBottom:new e.ResponsiveSized(e.sp[3],e.sp[2])},Vt={infoLabel:new e.ResponsiveSizedStyle("smallRegular","smallRegular")},Wt="debitCard.physicalCard.amount",qt="debitCard.physicalCard.cardName",Ht="debitCard.physicalCard.user",Gt="debitCard.physicalCard.frequency",re="debitCard.physicalCard.addressType",Zt="debitCard.physicalCard.connectedAccount",Dt=({lineData:t,issueCardSectionId:a,creditLimitFrequency:d,activeDebitCardCount:x,allRoles:f,depositAccounts:g,allAccountingClasses:E,companyAddress:m,customAddress:j,userAddress:$,userList:n,maxPhysicalDebitCardPerUser:P,openAddAddressDrawerHandler:c})=>{const o=e.useWindowSizeContext(),W=r.useTheme(),{getValues:O}=r.useFormContext(),y=B.largeLabelWidth.value(o),k=()=>{c(t.lineId,"debitCard")},N=t.debitCard.physicalCard.amount,p=g.find(i=>i.id===t.debitCard.physicalCard.connectedAccount.selectedOption)?.cardLimits.dailyCardTransactionLimit.amount,L=N!=null&&p!=null&&N>p,S=L?z.amountExceedDebitCardError.replace("_amount_",e.currencyAmountCompactFormatter(p)):void 0,b=t.debitCard.physicalCard.addressType,w=t.debitCard.physicalCard.user,T=w.allUsers.find(i=>i.userId===w.selectedUser),G=T?.userId,D=G!=null?$[G]:void 0,J=i=>{let u=0;const R=t.debitCard.physicalCard.connectedAccount.selectedOption;return R!=null&&x?.[R]?.[i]!=null&&(u=x[R][i].physicalCardCount),O().lineInfo.forEach(Z=>{Z.debitCard.cardType==="business_physical_debit_card"&&Z.debitCard.physicalCard.user.selectedUser===i&&(u+=1)}),u>=P};return r.jsxRuntimeExports.jsxs(r.jsxRuntimeExports.Fragment,{children:[r.jsxRuntimeExports.jsx(Xt,{label:{label:z.connectedAccountLabel,width:y,style:{marginLeft:e.Space.sp4,marginRight:B.largeLabelMarginRight.value(o),marginTop:e.Space.sp2,width:y}},style:{width:"auto"},singleSelectPickerField:{name:h(a,Zt),placeholder:z.selectAccountPlaceholder,style:{position:"relative"},capitalizeOptions:!0,valueToLogo:(i,u)=>Ge(g,i,u),valueToSubLabels:(i,u)=>xe(g,i,u),defaultValue:{selectedOption:t.debitCard.physicalCard.connectedAccount.selectedOption,allOptions:g.map(i=>({label:i.accountName,value:i.id}))},textAlignment:"right",isOptionRemovable:!1,registerOptions:{required:!0,validate:i=>i!=null&&!!i.selectedOption}}}),r.jsxRuntimeExports.jsx(ne,{}),r.jsxRuntimeExports.jsx(qe.LabeledUserSingleSelectWithSubtitlesField,{label:{label:z.cardholderLabel,width:y},userSingleSelectWithSubTitlesField:{name:h(a,Ht),placeholderLabel:z.usersPlaceholder,value:{allUsers:n,selectedUser:t.debitCard.physicalCard.user.selectedUser},registerOptions:{required:!0,validate:i=>i?.selectedUser?.length>0},valueToSubtitle:i=>{const u=f.find(_=>_.userId===i),R=[];return u?.accountingClassIDs.forEach(_=>{const Z=E.find(ee=>ee.classId===_);Z!=null&&Z.className&&R.push(Z.className)}),R},additionalLabelInfo:z.additionalInfoPhysical,showOnlyAvatar:!0,showAvatarAndSubtitles:!1,isOptionDisabled:J,disabledOptionHint:z.cardLimitWarning,bigMarginRightForSmallScreens:!0,optionStyles:{maxHeight:e.Space.sp10,minHeight:e.Space.sp6,height:"max-content"}},style:{width:"auto",paddingLeft:B.labelMarginBottom.value(o)}}),r.jsxRuntimeExports.jsx(ne,{}),r.jsxRuntimeExports.jsx(e.LabeledTextField,{label:{label:z.cardNameLabel,width:y},style:{width:"auto",paddingLeft:B.labelMarginBottom.value(o)},text:{type:"text",name:h(a,qt),defaultValue:t.debitCard.physicalCard.cardName,placeholder:z.cardNamePlaceholder,options:{required:!0,validate:i=>i!=null}}}),r.jsxRuntimeExports.jsx(ne,{}),r.jsxRuntimeExports.jsx(e.LabeledFormattedTextField,{label:{label:z.amountLabel,width:y},showAdditionalInfoLabel:L,additionalInfoLabel:S,formattedTextField:{type:"number",name:h(a,Wt),defaultValue:t.debitCard.physicalCard.amount,placeholder:z.amountPlaceholder,returnValueType:"floatValue",prefix:"$",allowNegative:!0,isNumericString:!1,registerOptions:{required:!0,validate:i=>p!=null?!!i&&i>0&&i<=p:!!i&&i>0},autoComplete:"off",decimalSeparator:".",decimalScale:2,fixedDecimalScale:!1,thousandSeparator:!0},style:{width:"auto",paddingLeft:B.labelMarginBottom.value(o)},isFieldError:L}),r.jsxRuntimeExports.jsx(ne,{}),r.jsxRuntimeExports.jsx(e.LabeledSingleSelectPickerField,{isDisabled:"readonly",label:{label:z.frequencyLabel,width:y,style:{marginBottom:B.labelMarginBottom.valuePx(o),marginRight:B.labelMarginRight.valuePx(o)}},style:{width:"auto",paddingLeft:B.labelMarginBottom.valuePx(o)},infoLabelStyle:{...e.textStyles.smallRegular.cssObject,textAlign:"right",paddingRight:e.Space.sp3,marginTop:B.infoLabelMarginTop.valuePx(o),color:W.colors.hero},valueToAdditionalLabel:i=>de(i),singleSelectPickerField:{name:h(a,Gt),placeholder:z.frequencyPlaceholder,style:{position:"relative"},capitalizeOptions:!0,showSubLabelsInSingleValue:!1,defaultValue:{selectedOption:t.debitCard.physicalCard.frequency.selectedOption,allOptions:d.map(i=>({label:i.name,value:i.code}))},valueToSubLabels:(i,u)=>xe(g,i,u),textAlignment:"right",registerOptions:{required:!0,validate:i=>i!=null&&!!i.selectedOption}}}),r.jsxRuntimeExports.jsx(ne,{}),r.jsxRuntimeExports.jsxs(Yt,{windowSize:o,children:[r.jsxRuntimeExports.jsxs(er,{windowSize:o,children:[r.jsxRuntimeExports.jsx(e.Label,{label:z.address.shippingAddressLabel,htmlFor:h(a,re),style:{marginLeft:e.Space.sp4,marginRight:B.labelMarginRight.valuePx(o),marginTop:e.Space.sp2,width:o==="small"?"auto":y}}),r.jsxRuntimeExports.jsx(Kt,{windowSize:o,children:r.jsxRuntimeExports.jsxs(tr,{isDisabled:T==null,children:[D!=null&&r.jsxRuntimeExports.jsx(e.LabeledRadioField,{isContainerClickable:!0,label:{label:z.address.personal},isDisabled:T==null?"disabled":void 0,style:{padding:`${e.Space.sp2} ${e.Space.sp0}`,paddingLeft:B.radioLabelPaddingLeftRight.value(o),paddingRight:B.radioLabelPaddingRight.value(o),width:"fit-content"},radioField:{name:h(a,re),id:`${h(a,re)}.${z.address.personal}`,value:"card_holder_personal_address",radioSize:"small",registerOptions:{required:!0}}}),r.jsxRuntimeExports.jsx(e.LabeledRadioField,{isContainerClickable:!0,label:{label:z.address.company},isDisabled:T==null?"disabled":void 0,style:{padding:`${e.Space.sp2} ${e.Space.sp0}`,paddingLeft:B.radioLabelPaddingLeft.value(o),paddingRight:B.radioLabelPaddingRight.value(o),width:"fit-content"},radioField:{name:h(a,re),id:`${h(a,re)}.${z.address.company}`,value:"company_address",radioSize:"small",registerOptions:{required:!0}}}),r.jsxRuntimeExports.jsx(e.LabeledRadioField,{isContainerClickable:!0,label:{label:z.address.custom},isDisabled:T==null?"disabled":void 0,style:{padding:`${e.Space.sp2} ${e.Space.sp0}`,paddingLeft:B.radioLabelPaddingLeft.value(o),paddingRight:B.radioLabelPaddingLeftRight.value(o),width:"fit-content"},radioField:{name:h(a,re),id:`${h(a,re)}.${z.address.custom}`,value:"custom_address",radioSize:"small",registerOptions:{required:!0}}})]})})]}),r.jsxRuntimeExports.jsx(Qt,{windowSize:o,children:T?.user!=null&&b!=null&&r.jsxRuntimeExports.jsx(Jt,{children:b==="card_holder_personal_address"?r.jsxRuntimeExports.jsxs(r.jsxRuntimeExports.Fragment,{children:[r.jsxRuntimeExports.jsx(e.AddressValueField,{name:"personal_address_value_field",defaultValue:D,isDisabled:"readonly",placeholder:Ie,style:{minHeight:e.Space.sp4,paddingTop:e.Space.sp2,paddingBottom:e.Space.sp2,width:"100%",display:"flex",flexGrow:1}}),r.jsxRuntimeExports.jsx(ze,{windowSize:o,children:z.address.personalAddressText.replace("_name_",T.user.firstName)})]}):b==="company_address"?r.jsxRuntimeExports.jsx(e.AddressValueField,{name:"company_address_value_field",defaultValue:m,isDisabled:"readonly",placeholder:Ie,style:{minHeight:e.Space.sp4,paddingTop:e.Space.sp2,paddingBottom:e.Space.sp2,width:"100%",display:"flex",flexGrow:1}}):r.jsxRuntimeExports.jsxs(r.jsxRuntimeExports.Fragment,{children:[r.jsxRuntimeExports.jsx(e.AddressValueField,{name:"custom_address_value_field",defaultValue:j[t.lineId],placeholder:kt,style:{minHeight:e.Space.sp4,paddingTop:e.Space.sp2,paddingBottom:e.Space.sp2,width:"100%",display:"flex",flexGrow:1},onClick:k}),r.jsxRuntimeExports.jsx(ze,{windowSize:o,children:z.address.customAddressText})]})})})]})]})},Jt=l.div`
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  align-items: flex-end;
+  flex-grow: 1;
+`,Xt=l(e.LabeledSingleSelectPickerField)`
+  border-radius: ${e.Space.sp2};
+  border: 1px solid ${t=>t.theme.colors.grey3};
+`,ze=l(e.SmallRegular)`
+  display: flex;
+  color: ${t=>t.theme.colors.hero};
+  padding-right: 12px;
+  text-align: right;
+  ${t=>`${Vt.infoLabel.style(t.windowSize)}`};
+`,ne=l.div`
+  display: flex;
+  flex: 1;
+  background-color: ${t=>t.theme.colors.grey3};
+  min-height: 1px;
+  max-height: 1px;
+`,Yt=l.div`
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  background-color: ${t=>t.theme.colors.grey5};
+  min-height: ${e.Space.sp6};
+  padding-right: ${e.Space.sp2};
+  padding-top: ${e.Space.sp2};
+  padding-bottom: ${e.Space.sp2};
+
+  &:focus-within {
+    border-color: ${t=>t.theme.colors.primary};
+    color: ${t=>t.theme.colors.primary};
+    z-index: 2;
+    outline: 1px solid ${t=>t.theme.colors.primary};
+  }
+
+  :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;
+  }
+
+  &:hover {
+    z-index: 1;
+    outline: 1px solid ${t=>t.theme.colors.primary};
+    .user-multi-select-field__control {
+      background-color: ${t=>t.theme.colors.background};
+    }
+  }
+`,Kt=l.div`
+  flex-grow: 1;
+  display: flex;
+  width: ${t=>t.windowSize==="small"?"auto":`calc(100% - ${B.largeLabelWidth.valuePx(t.windowSize)})`};
+  align-items: center;
+  justify-content: flex-end;
+  padding-right: ${t=>B.labelMarginBottom.valuePx(t.windowSize)};
+`,Qt=l.div`
+  display: flex;
+  flex-direction: column;
+  text-align: right;
+  color: ${t=>t.theme.colors.primary};
+  padding-left: ${e.Space.sp4};
+  width: 100%;
+`,er=l.div`
+  color: ${t=>t.theme.colors.primary};
+  width: 100%;
+  display: flex;
+  flex-direction: ${t=>t.windowSize==="small"?"column":"row"};
+`,tr=l.div`
+  width: 100%;
+  display: flex;
+  justify-content: flex-end;
+  &:hover {
+    fill: ${t=>t.theme.colors.primary};
+  }
+`,{spendManagement:{chargeCard:{issueCard:X}}}=e.appLocale.getLocalizedStrings(),K={largeLabelWidth:new e.ResponsiveSized(120,120,200),labelMarginRight:new e.ResponsiveSized(e.sp[3],e.sp[4]),labelMarginBottom:new e.ResponsiveSized(e.sp[2],e.sp[0]),infoLabelMarginTop:new e.ResponsiveSized(e.sp[1],e.sp[0])},rr={infoLabel:new e.ResponsiveSizedStyle("smallRegular","smallRegular")},ar="creditCard.virtualCard.amount",sr="creditCard.virtualCard.cardName",Oe="creditCard.virtualCard.users",ir="creditCard.virtualCard.frequency",lr=({lineData:t,issueCardSectionId:a,cardHolderCandidates:d,limit:x,creditLimitFrequency:f,allRoles:g,allAccountingClasses:E,activeChargeCardCount:m,maxVirtualChargeCardPerUser:j})=>{const $=r.useTheme(),n=e.useWindowSizeContext(),{getValues:P}=r.useFormContext(),c=K.largeLabelWidth.value(n),o=(s,p)=>r.jsxRuntimeExports.jsx(or,{isOptionSelected:p,children:de(s)}),W=t.creditCard.virtualCard.amount,O=e.currencyAmountCompactFormatter(x.amount),y=W!=null&&W>x.amount,k=y?X.amountExceedError.replace("_amount_",O):void 0,N=s=>{let p=m[s]?.virtualCardCount??0;return P().lineInfo.forEach(S=>{S.creditCard.cardType==="business_virtual_credit_card"&&S.creditCard.virtualCard.users.selectedUsers.forEach(b=>{b.userId===s&&(p+=1)})}),p>=j};return r.jsxRuntimeExports.jsxs(r.jsxRuntimeExports.Fragment,{children:[r.jsxRuntimeExports.jsxs(ur,{windowSize:n,children:[r.jsxRuntimeExports.jsx(e.Label,{label:X.cardholdersLabel,htmlFor:h(a,Oe),style:{marginLeft:e.Space.sp4,marginRight:K.labelMarginRight.value(n),marginTop:e.Space.sp2,width:c}}),r.jsxRuntimeExports.jsxs(cr,{windowSize:n,children:[r.jsxRuntimeExports.jsx(e.UserMultiSelectField,{hideEmailTooltip:!0,shouldHaveBackgroundColor:!1,showBackgroundColorIfHasAnySelectedOption:!1,placeholderLabel:X.usersPlaceholder,name:h(a,Oe),value:{allUsers:d,selectedUsers:t.creditCard.virtualCard.users.selectedUsers,allNonUsers:[],selectedNonUsers:[]},registerOptions:{required:!0,validate:s=>s?.selectedUsers?.length>0},valueToSubtitle:s=>{const p=g.find(S=>S.userId===s),L=[];return p!=null&&(L.push(r.jsxRuntimeExports.jsx(He.RoleWithToolTip,{roles:p.userRoles})),p.accountingClassIDs.forEach(S=>{const b=E.find(w=>w.classId===S);b!=null&&b.className&&L.push(b.className)})),L},disableCurrentOption:N,disabledOptionHint:X.cardLimitWarning,customStyleConfig:{placeholder:()=>({margin:e.Space.sp0}),input:(s,{selectProps:p})=>({display:p.menuIsOpen===!1&&t.creditCard.virtualCard.users.selectedUsers.length>0&&n!=="small"?"none":"unset",width:n==="small"&&t.creditCard.virtualCard.users.selectedUsers.length>0?"100%":`calc(100% - ${e.Space.sp5})`,padding:t.creditCard.virtualCard.users.selectedUsers.length===0?`${e.Space.sp0} ${e.Space.sp3}`:e.Space.sp0,...e.textStyles.standardRegular.cssObject,height:e.Space.sp4,position:t.creditCard.virtualCard.users.selectedUsers.length===0||n==="small"&&p.menuIsOpen===!1?"absolute":"unset",left:e.Space.sp0,">input":{...e.textStyles.smallBold.cssObject,height:"100%",cursor:"pointer"}})}}),r.jsxRuntimeExports.jsx(nr,{size:n,children:X.additionalInfoVirtual})]})]}),r.jsxRuntimeExports.jsx(fe,{}),r.jsxRuntimeExports.jsx(e.LabeledTextField,{label:{label:X.cardNameLabel,width:c},style:{width:"auto",paddingLeft:K.labelMarginBottom.value(n)},text:{type:"text",name:h(a,sr),defaultValue:t.creditCard.virtualCard.cardName,placeholder:X.cardNamePlaceholder,options:{required:!0,validate:s=>s!=null}}}),r.jsxRuntimeExports.jsx(fe,{}),r.jsxRuntimeExports.jsx(e.LabeledFormattedTextField,{label:{label:X.amountLabel,width:c},showAdditionalInfoLabel:y,additionalInfoLabel:k,formattedTextField:{type:"number",name:h(a,ar),defaultValue:t.creditCard.virtualCard.amount,placeholder:X.amountPlaceholder,returnValueType:"floatValue",prefix:"$",allowNegative:!0,isNumericString:!1,registerOptions:{required:!0,validate:s=>!!s&&s>0&&s<=x.amount},autoComplete:"off",decimalSeparator:".",decimalScale:2,fixedDecimalScale:!1,thousandSeparator:!0},style:{width:"auto",paddingLeft:K.labelMarginBottom.value(n)},isFieldError:y}),r.jsxRuntimeExports.jsx(fe,{}),r.jsxRuntimeExports.jsx(dr,{size:n,children:r.jsxRuntimeExports.jsx(pr,{isDisabled:"readonly",label:{label:X.frequencyLabel,width:c,style:{marginLeft:e.Space.sp0,marginBottom:K.labelMarginBottom.valuePx(n),marginRight:K.labelMarginRight.valuePx(n)}},style:{width:"100%",padding:e.Space.sp0,display:n==="small"?"flex":"inherit"},infoLabelStyle:{...e.textStyles.smallRegular.cssObject,textAlign:"right",paddingRight:e.Space.sp3,marginTop:K.infoLabelMarginTop.valuePx(n),color:$.colors.hero},valueToAdditionalLabel:s=>de(s),singleSelectPickerField:{name:h(a,ir),placeholder:X.frequencyPlaceholder,style:{position:"relative"},capitalizeOptions:!0,showSubLabelsInSingleValue:!1,defaultValue:{selectedOption:t.creditCard.virtualCard.frequency.selectedOption,allOptions:f.map(s=>({label:s.name,value:s.code}))},valueToSubLabels:(s,p)=>o(s,p),textAlignment:"right",registerOptions:{required:!0,validate:s=>s!=null&&!!s.selectedOption}}})})]})},dr=l.div`
+  display: flex;
+  flex-direction: row;
+  padding: ${e.Space.sp2};
+  padding-left: ${e.Space.sp4};
+  justify-content: space-between;
+  color: ${t=>t.theme.colors.hero};
+  :last-of-type {
+    border-bottom-left-radius: inherit;
+    border-bottom-right-radius: inherit;
+  }
+`,or=l(e.SmallRegular)`
+  color: ${t=>t.isOptionSelected?t.theme.colors.primary:t.theme.colors.grey1};
+`,nr=l.label`
+  color: ${t=>t.theme.colors.hero};
+  width: 100%;
+  ${t=>`${rr.infoLabel.style(t.size)}`};
+  padding-right: ${e.Space.sp3};
+  text-align: right;
+  white-space: pre-line;
+`,fe=l.div`
+  display: flex;
+  flex: 1;
+  background-color: ${t=>t.theme.colors.grey3};
+  min-height: 1px;
+  max-height: 1px;
+`,cr=l.div`
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+  width: ${t=>`calc(100% - ${K.largeLabelWidth.valuePx(t.windowSize)})`};
+  align-items: flex-end;
+  flex-grow: 1;
+`,pr=l(e.LabeledSingleSelectPickerField)`
+  border-radius: ${e.Space.sp2};
+  border: 1px solid ${t=>t.theme.colors.grey3};
+`,ur=l.div`
+  display: flex;
+  flex-direction: row;
+  align-items: flex-start;
+  background-color: ${t=>t.theme.colors.grey5};
+  min-height: ${e.Space.sp6};
+  padding-right: ${e.Space.sp2};
+  padding-top: ${e.Space.sp2};
+  padding-bottom: ${e.Space.sp2};
+
+  &:focus-within {
+    border-color: ${t=>t.theme.colors.primary};
+    color: ${t=>t.theme.colors.primary};
+    z-index: 2;
+    outline: 1px solid ${t=>t.theme.colors.primary};
+  }
+
+  :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;
+  }
+
+  &:hover {
+    z-index: 1;
+    outline: 1px solid ${t=>t.theme.colors.primary};
+    .user-multi-select-field__control {
+      background-color: ${t=>t.theme.colors.background};
+    }
+  }
+`,H={containerPaddingBottom:new e.ResponsiveSized(e.sp[3],e.sp[4]),sectionTitleContainerPadding:new e.ResponsiveSized(e.sp[2],e.sp[3]),largeLabelWidth:new e.ResponsiveSized(120,120,200),labelPaddingLeft:new e.ResponsiveSized(e.sp[3],e.sp[4]),radioLabelPaddingLeft:new e.ResponsiveSized(e.sp[4],e.sp[4]),radioLabelPaddingRight:new e.ResponsiveSized(e.sp[2],e.sp[3]),labelPaddingRight:new e.ResponsiveSized(e.sp[4],e.sp[4]),firstItemMarginTop:new e.ResponsiveSized(e.sp[4],e.sp[2]),paddingLeft:new e.ResponsiveSized(e.sp[3],e.sp[5])},{spendManagement:{chargeCard:{issueCard:V}}}=e.appLocale.getLocalizedStrings(),mr=t=>{const{lineData:a,issueCardSectionId:d,cardHolderCandidates:x,userList:f,limit:g,creditLimitFrequency:E,allRoles:m,allAccountingClasses:j,hasMultipleLineItems:$,depositAccounts:n,isIssuePhysicalCardEnabled:P,isDebitCardFeatureEnabled:c,isChargeCardFeatureEnabled:o,isChargeCardSetupEnabled:W,isDebitCardSetupEnabled:O,lineIndex:y,customAddress:k,userAddress:N,onRemoveIssueCardLine:s,companyAddress:p,maxPhysicalChargeCardPerUser:L,maxVirtualChargeCardPerUser:S,maxPhysicalDebitCardPerUser:b,maxVirtualDebitCardPerUser:w,cardsSectionRef:T,openAddAddressDrawerHandler:G,clearTentativeNameForLine:D,activeChargeCardCount:J,activeDebitCardCount:i}=t,u=e.useWindowSizeContext(),R=H.largeLabelWidth.value(u);return r.jsxRuntimeExports.jsxs(xr,{windowSize:u,ref:T,className:"cards-item",children:[$&&r.jsxRuntimeExports.jsxs(fr,{windowSize:u,children:[r.jsxRuntimeExports.jsx(yr,{windowSize:u,children:`${V.card} ${y+1}`}),r.jsxRuntimeExports.jsx(Sr,{className:"deleteIconWrapper",windowSize:u,"data-testid":e.generateDataTestId("delete-icon",a.lineId),onClick:()=>{D?.(a.lineId??"1"),s(y)},children:r.jsxRuntimeExports.jsx(e.Tooltip,{enterDelay:600,title:V.deleteCard,placement:"left",children:r.jsxRuntimeExports.jsx(vr,{})})})]}),r.jsxRuntimeExports.jsxs(gr,{showTopMargin:!$,windowSize:u,children:[c&&O&&o&&W?r.jsxRuntimeExports.jsxs(r.jsxRuntimeExports.Fragment,{children:[r.jsxRuntimeExports.jsxs(hr,{children:[r.jsxRuntimeExports.jsx(e.LabeledRadioField,{isContainerClickable:!0,label:{label:V.creditCard},style:{padding:`${e.Space.sp3} ${e.Space.sp0}`,paddingLeft:H.labelPaddingLeft.value(u),borderTopLeftRadius:"inherit"},showOutline:!0,radioField:{name:h(d,"chargeCardType"),id:`${h(d,"chargeCardType")}.creditCard`,value:"credit_card",radioSize:"small"}}),r.jsxRuntimeExports.jsx(br,{}),r.jsxRuntimeExports.jsx(e.LabeledRadioField,{isContainerClickable:!0,label:{label:V.debitCard},style:{padding:`${e.Space.sp3} ${e.Space.sp0}`,paddingLeft:H.labelPaddingLeft.value(u),borderTopRightRadius:"inherit"},showOutline:!0,radioField:{name:h(d,"chargeCardType"),id:`${h(d,"chargeCardType")}.debitCard`,value:"debit_card",radioSize:"small"}})]}),r.jsxRuntimeExports.jsx(ye,{})]}):null,a.chargeCardType==="credit_card"?r.jsxRuntimeExports.jsxs(r.jsxRuntimeExports.Fragment,{children:[r.jsxRuntimeExports.jsxs(Fe,{size:u,isDebitCardSetupEnabled:O,isDebitCardFeatureEnabled:c,children:[r.jsxRuntimeExports.jsx(e.Label,{label:V.type,htmlFor:h(d,"creditCard.cardType"),style:{padding:`${e.Space.sp2} ${e.Space.sp0}`,paddingLeft:H.radioLabelPaddingLeft.value(u),paddingRight:H.radioLabelPaddingRight.value(u),width:"fit-content"}}),r.jsxRuntimeExports.jsxs(Ae,{labelWidth:R,children:[r.jsxRuntimeExports.jsx(e.LabeledRadioField,{label:{label:V.virtualCard},style:{width:"auto"},radioField:{name:h(d,"creditCard.cardType"),id:`${h(d,"creditCard.cardType")}.${V.virtualCard}`,value:"business_virtual_credit_card",style:{height:e.Space.sp3,width:e.Space.sp3,opacity:P?1:0},radioSize:"small"}}),P&&r.jsxRuntimeExports.jsx(e.LabeledRadioField,{label:{label:V.physicalCard},style:{width:"auto",paddingLeft:H.paddingLeft.valuePx(u)},radioField:{name:h(d,"creditCard.cardType"),id:`${h(d,"creditCard.cardType")}.${V.physicalCard}`,value:"business_physical_credit_card",style:{height:e.Space.sp3,width:e.Space.sp3},radioSize:"small"}})]})]}),r.jsxRuntimeExports.jsx(ye,{}),a.creditCard.cardType==="business_physical_credit_card"?r.jsxRuntimeExports.jsx(bt,{lineData:a,issueCardSectionId:`${d}`,limit:g,creditLimitFrequency:E,companyAddress:p,openAddAddressDrawerHandler:G,customAddress:k,userAddress:N,activeChargeCardCount:J,userList:f,allRoles:m,allAccountingClasses:j,maxPhysicalChargeCardPerUser:L}):r.jsxRuntimeExports.jsx(lr,{lineData:a,issueCardSectionId:`${d}`,cardHolderCandidates:x,limit:g,creditLimitFrequency:E,allRoles:m,allAccountingClasses:j,activeChargeCardCount:J,maxVirtualChargeCardPerUser:S})]}):null,a.chargeCardType==="debit_card"?r.jsxRuntimeExports.jsxs(r.jsxRuntimeExports.Fragment,{children:[r.jsxRuntimeExports.jsxs(Fe,{size:u,isDebitCardSetupEnabled:O,isDebitCardFeatureEnabled:c,children:[r.jsxRuntimeExports.jsx(e.Label,{label:V.type,htmlFor:h(d,"debitCard.cardType"),style:{padding:`${e.Space.sp2} ${e.Space.sp0}`,paddingLeft:H.radioLabelPaddingLeft.value(u),paddingRight:H.radioLabelPaddingRight.value(u),width:"fit-content"}}),r.jsxRuntimeExports.jsxs(Ae,{labelWidth:R,children:[r.jsxRuntimeExports.jsx(e.LabeledRadioField,{label:{label:V.virtualCard},style:{width:"auto"},radioField:{name:h(d,"debitCard.cardType"),id:`${h(d,"debitCard.cardType")}.${V.virtualCard}`,value:"business_virtual_debit_card",style:{height:e.Space.sp3,width:e.Space.sp3,opacity:1},radioSize:"small"}}),r.jsxRuntimeExports.jsx(e.LabeledRadioField,{label:{label:V.physicalCard},style:{width:"auto",paddingLeft:H.paddingLeft.valuePx(u)},radioField:{name:h(d,"debitCard.cardType"),id:`${h(d,"debitCard.cardType")}.${V.physicalCard}`,value:"business_physical_debit_card",style:{height:e.Space.sp3,width:e.Space.sp3},radioSize:"small"}})]})]}),r.jsxRuntimeExports.jsx(ye,{}),a.debitCard.cardType==="business_physical_debit_card"?r.jsxRuntimeExports.jsx(Dt,{lineData:a,issueCardSectionId:`${d}`,creditLimitFrequency:E,companyAddress:p,openAddAddressDrawerHandler:G,customAddress:k,userAddress:N,depositAccounts:n,activeDebitCardCount:i,userList:f,allRoles:m,allAccountingClasses:j,maxPhysicalDebitCardPerUser:b}):r.jsxRuntimeExports.jsx(Pt,{lineData:a,issueCardSectionId:`${d}`,cardHolderCandidates:x,depositAccounts:n,creditLimitFrequency:E,allRoles:m,allAccountingClasses:j,activeDebitCardCount:i,maxVirtualDebitCardPerUser:w})]}):null]})]})},hr=l.div`
+  display: flex;
+  flex-direction: row;
+  border-top-left-radius: inherit;
+  border-top-right-radius: inherit;
+`,Ae=l.div`
+  display: flex;
+  flex-direction: row;
+  width: ${t=>`calc(100% - ${t.labelWidth}px)`};
+  align-items: flex-end;
+  justify-content: flex-end;
+  flex-grow: 1;
+  height: ${e.Space.sp6};
+  align-items: center;
+`,xr=l.div`
+  display: flex;
+  flex-direction: column;
+  padding-bottom: ${t=>H.containerPaddingBottom.valuePx(t.windowSize)};
+  .deleteIconWrapper {
+    ${t=>t.windowSize==="small"&&" display: block; "}
+  }
+  &:hover {
+    .deleteIconWrapper {
+      display: block;
+    }
+  }
+`,gr=l.div`
+  display: flex;
+  flex-direction: column;
+  background-color: ${t=>t.theme.colors.grey5};
+  border: 1px solid ${t=>t.theme.colors.grey3};
+  box-shadow: ${t=>`${e.Space.sp0} 1px 2px ${e.Space.sp0} ${t.theme.colors.issueChargeCardBackgroundShadow}`};
+  border-radius: ${e.Space.sp2};
+  margin-top: ${t=>t.showTopMargin?H.firstItemMarginTop.valuePx(t.windowSize):e.Space.sp0};
+`,br=l.div`
+  background-color: ${t=>t.theme.colors.grey3};
+  min-width: 1px;
+  max-width: 1px;
+`,ye=l.div`
+  display: flex;
+  flex: 1;
+  background-color: ${t=>t.theme.colors.grey3};
+  min-height: 1px;
+  max-height: 1px;
+`,Fe=l.div`
+  display: flex;
+  flex-direction: row;
+  align-items: flex-start;
+  background-color: ${t=>t.theme.colors.grey5};
+  min-height: ${e.Space.sp6};
+  padding-right: ${t=>H.labelPaddingRight.valuePx(t.size)};
+  padding-top: ${e.Space.sp2};
+  padding-bottom: ${e.Space.sp2};
+  align-items: center;
+  border-top-left-radius: ${t=>t.isDebitCardFeatureEnabled&&t.isDebitCardSetupEnabled?"unset":"inherit"};
+  border-top-right-radius: ${t=>t.isDebitCardFeatureEnabled&&t.isDebitCardSetupEnabled?"unset":"inherit"};
+  &:hover {
+    z-index: 1;
+    outline: 1px solid ${t=>t.theme.colors.primary};
+  }
+`,fr=l.div`
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  padding: ${t=>`${H.sectionTitleContainerPadding.valuePx(t.windowSize)} ${e.Space.sp0}`};
+`,yr=l(e.LargeBold)`
+  color: ${t=>t.theme.colors.primary};
+`,Sr=l.div`
+  width: ${e.Space.sp3};
+  height: ${e.Space.sp3};
+  cursor: pointer;
+  display: none;
+  color: ${t=>t.theme.colors.hero};
+  &:hover {
+    color: ${e.Colors.important};
+  }
+`,vr=l(e.SvgDelete)`
+  width: ${e.Space.sp3};
+  height: ${e.Space.sp3};
+  cursor: pointer;
+`,me={marginTop:new e.ResponsiveSized(e.sp[3],e.sp[4]),addCardButtonMarginBottom:new e.ResponsiveSized(e.sp[3],e.sp[4]),addCardButtonMarginTop:new e.ResponsiveSized(e.sp[2],e.sp[0]),addCardButtonPaddingTopBottom:new e.ResponsiveSized(e.sp[2],e.sp[2]),addCardButtonPaddingLeftRight:new e.ResponsiveSized(e.sp[3],e.sp[4])},Rr={title:new e.ResponsiveSizedStyle("standardMedium","standardMedium")},Cr=({issueChargeCards:t,issueCardSectionId:a,cardHolderCandidates:d,userList:x,limit:f,creditLimitFrequency:g,allRoles:E,allAccountingClasses:m,isIssuePhysicalCardEnabled:j,isDebitCardFeatureEnabled:$,isChargeCardFeatureEnabled:n,isChargeCardSetupEnabled:P,isDebitCardSetupEnabled:c,defaultCardType:o,getInitialLineFormData:W,clearTentativeNameForLine:O,companyAddress:y,containerRef:k,cardsSectionRef:N,openAddAddressDrawerHandler:s})=>{const{control:p,watch:L,setValue:S}=r.useFormContext(),{fields:b}=r.useFieldArray({name:a,control:p}),w=L(a,b),T=Math.max(...Object.keys(t.localData??{}).map(u=>Number(u)),0),G=()=>{const u=w[w.length-1],R=W(w.length,Number(u.lineId)>T?String(Number(u.lineId)+1):String(T+1),d,g,x,t.depositAccounts,n,$,P,c,y,o);S(a,[...w,R]),setTimeout(()=>{e.scrollContainerToTargetAdjusted(N.current,k.current)},50)},D=u=>{S(a,w.filter((R,_)=>_!==u))},J=e.useWindowSizeContext(),{spendManagement:{chargeCard:{issueCard:i}}}=e.appLocale.getLocalizedStrings();return r.jsxRuntimeExports.jsxs(jr,{ref:k,children:[w.map((u,R)=>r.jsxRuntimeExports.jsx(mr,{lineIndex:R,lineData:u,issueCardSectionId:`${a}.${R}`,cardHolderCandidates:d,userList:x,limit:f,creditLimitFrequency:g,allRoles:E,allAccountingClasses:m,hasMultipleLineItems:w.length>1,clearTentativeNameForLine:O,onRemoveIssueCardLine:D,companyAddress:y,cardsSectionRef:N,openAddAddressDrawerHandler:s,depositAccounts:t.depositAccounts,customAddress:t.customAddress,userAddress:t.userAddress,activeChargeCardCount:t.activeChargeCardCount,activeDebitCardCount:t.activeDebitCardCountByDepositAccountId,maxPhysicalChargeCardPerUser:t.chargeCardConfig.creditTerm.maxPhysicalChargeCardPerUser,maxVirtualChargeCardPerUser:t.chargeCardConfig.creditTerm.maxVirtualChargeCardPerUser,maxVirtualDebitCardPerUser:t.chargeCardConfig.creditTerm.maxVirtualDebitCardPerUser,maxPhysicalDebitCardPerUser:t.chargeCardConfig.creditTerm.maxPhysicalDebitCardPerUser,isIssuePhysicalCardEnabled:j,isDebitCardFeatureEnabled:$,isChargeCardFeatureEnabled:n,isChargeCardSetupEnabled:P,isDebitCardSetupEnabled:c},R)),r.jsxRuntimeExports.jsxs($r,{windowSize:J,onClick:()=>{G()},"data-testid":e.generateDataTestId("add-card-button"),children:[r.jsxRuntimeExports.jsx(Lr,{}),r.jsxRuntimeExports.jsx(wr,{windowSize:J,children:i.addCard})]})]})},jr=l.div`
+  display: flex;
+  flex-direction: column;
+`,$r=l.div`
+  padding: ${t=>`${me.addCardButtonPaddingTopBottom.valuePx(t.windowSize)} ${me.addCardButtonPaddingLeftRight.valuePx(t.windowSize)}`};
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid
+    ${t=>t.hasError===!0?e.Colors.important:t.theme.colors.grey1};
+  border-radius: ${e.Space.sp2};
+  color: ${t=>t.hasError===!0?e.Colors.important:t.theme.colors.primary};
+  cursor: pointer;
+  &:hover {
+    border: 1px solid
+      ${t=>t.hasError===!0?e.Colors.important:t.theme.colors.primary};
+  }
+  margin-bottom: ${t=>me.addCardButtonMarginBottom.valuePx(t.windowSize)};
+  margin-top: ${t=>me.addCardButtonMarginTop.valuePx(t.windowSize)};
+`,wr=l(e.StyledText)`
+  ${t=>`${Rr.title.style(t.windowSize)}`};
+  color: inherit;
+`,Lr=l(e.SvgAddRound)`
+  margin-right: ${e.Space.sp2};
+  width: ${e.Space.sp3};
+  height: ${e.Space.sp3};
+`,Er="user",_e="addressType",Ue="physicalCard",Be="virtualCard",Ze="lineInfo",Me="issueCardDetailPage",Tr=100,Se=t=>`${t}_form`,{common:Q,spendManagement:{chargeCard:{issueCard:he}}}=e.appLocale.getLocalizedStrings(),De=t=>t!=null?{amount:t,currencyCode:Q.currency.currencyCode,currencySymbol:Q.currency.currencySymbol}:void 0,Ne=(t,a=!1)=>{const d={userIds:t.users.selectedUsers.map(x=>x.userId),cardName:t.cardName,amount:De(t.amount),frequency:t.frequency.selectedOption};return a?{...d,connectedAccountId:t.connectedAccount.selectedOption}:d},ke=(t,a=!1)=>{const d={userId:t.user.selectedUser,cardName:t.cardName,amount:De(t.amount),frequency:t.frequency.selectedOption,addressType:t.addressType,addressId:t.addressId};return a?{...d,connectedAccountId:t.connectedAccount.selectedOption}:d},ae={containerPaddingLeft:new e.ResponsiveSized(e.sp[4],e.sp[6],e.sp[8]),containerPaddingRight:new e.ResponsiveSized(e.sp[4],e.sp[6],e.sp[8]),navbarHeight:new e.ResponsiveSized(44,e.sp[9]),navBarContainerPaddingXaxis:new e.ResponsiveSized(10,e.sp[4]),closeIconMarginRight:new e.ResponsiveSized(e.sp[4],e.sp[8]),rightSectionWidth:new e.ResponsiveSized(e.sp[12],58),footerTopPadding:new e.ResponsiveSized(e.sp[3],10)},Pr={title:new e.ResponsiveSizedStyle("standardMedium","largeSemiBold")},Ir=({issueChargeCards:t,cardHolderCandidates:a,userList:d,companyName:x,allRoles:f,allAccountingClasses:g,isIssuePhysicalCardEnabled:E,isDebitCardFeatureEnabled:m,isChargeCardFeatureEnabled:j,isDebitCardSetupEnabled:$,isChargeCardSetupEnabled:n,signedInUser:P,defaultCardType:c,onSaveChangesToLocalStore:o,onIssueCardClick:W,onDismissClick:O,resetCustomAddressByLineID:y,handleZeniLogoClick:k,openAddAddressDrawerHandler:N,clearTentativeNameForLine:s})=>{const{chargeCardConfig:{creditLimitFrequency:p},creditAccount:{limit:L},companyAddress:S}=t,b=e.useWindowSizeContext(),w=U.useRef(null),T=U.useRef(null),[G,D]=U.useState(!0),[J,i]=U.useState(!0),u=U.useRef(null),R=U.useRef(null),[_,Z]=U.useState(0),[ee,Xe]=U.useState(0),[ce,Ye]=U.useState(0),[Ke,Qe]=U.useState(0),[et,tt]=U.useState(t.localData);U.useEffect(()=>{const v=new IntersectionObserver(F=>{F.forEach(se=>{se.target===w.current&&D(se.isIntersecting),se.target===T.current&&i(se.isIntersecting)})},{threshold:.1}),C=w.current,I=T.current;return C&&v.observe(C),I&&v.observe(I),()=>{C&&v.unobserve(C),I&&v.unobserve(I)}},[]);const oe=r.useForm({mode:"all",reValidateMode:"onChange",defaultValues:U.useMemo(()=>We(t.localData,a,p,d,t.depositAccounts,j,m,n,$,S,c),[t,a,p,d,j,m,n,$,S,c]),values:U.useMemo(()=>We(t.localData,a,p,d,t.depositAccounts,j,m,n,$,S,c),[t.localData,t.depositAccounts,a,p,d,j,m,n,$,S,c])}),{isValid:rt}=oe.formState,Re=v=>v.map(C=>({lineId:C.lineId,chargeCardType:C.chargeCardType,creditCard:{cardType:C.creditCard.cardType,virtualCard:Ne(C.creditCard[Be]),physicalCard:ke(C.creditCard[Ue])},debitCard:{cardType:C.debitCard.cardType,virtualCard:Ne(C.debitCard[Be],!0),physicalCard:ke(C.debitCard[Ue],!0)}})),at=async(v,C)=>{if(v!=null){const{lineInfo:I}=C,F=Number(v.split(".")[1]);if(v.includes("cardName")||v.includes("amount"))return;if(v.includes("physicalCard.user")){const ie=$e(v.split(".")[2]);I[F][ie].physicalCard.addressType=void 0,I[F].creditCard.physicalCard.addressId=void 0;const le=I[F].lineId;t.customAddress[le]?.addressId!=null&&y(le,ie)}if(v.includes("physicalCard.addressType")){const ie=$e(v.split(".")[2]),le=I[F][ie].physicalCard;if(le[_e]==="card_holder_personal_address"){const be=le[Er].selectedUser;if(be!=null){const ot=t.userAddress[be];I[F][ie].physicalCard.addressId=ot.addressId}}else le[_e]==="company_address"&&(I[F][ie].physicalCard.addressId=S?.addressId)}const se=Re(I);o(se)}};U.useEffect(()=>{const v=oe.watch((C,{name:I})=>{I!=null&&C!=null&&r.defer(()=>at(I,C))});return()=>{v.unsubscribe()}});const st=oe.handleSubmit(()=>{if(rt){const{lineInfo:v}=oe.getValues(),C=Re(v);o(C),W()}}),it=t.issueCardStatus.error?.message??Q.strings.empty,lt=t.issueCardStatus.error?.title??Q.strings.empty,ge=U.useCallback(()=>{Z(R.current?.scrollTop??0),Math.abs(_-ee)>Tr&&Xe(_),document.querySelectorAll(".cards-item").forEach((C,I)=>{const F=C.getBoundingClientRect();F.top>=0&&F.bottom<=window.innerHeight&&Ye(I),F.top<window.innerHeight&&F.bottom>0&&Qe(I)})},[_,ee]);U.useEffect(()=>{const v=R.current;return v?.addEventListener("scroll",ge),()=>{v?.removeEventListener("scroll",ge)}},[ge,R]);const Ce=t.localData;U.useEffect(()=>{if(ce!==null){const v=Math.max(0,ce-2),C=ce+1,I=Ce.slice(v,C);tt(I)}},[ce,Ke,Ce]);const dt=((v,C,I)=>v.length===0?[{cardId:"1",cardType:Je(j,C,n,$,I)==="debit_card"?"business_virtual_debit_card":"business_virtual_credit_card",cardUUID:"1",limit:{amount:0,currencyCode:Q.currency.currencyCode,currencySymbol:Q.currency.currencySymbol}}]:v.map(F=>({cardId:F.lineId,cardType:F.chargeCardType==="credit_card"?F.creditCard.cardType:F.debitCard.cardType,cardUUID:F.lineId,limit:{amount:0,currencyCode:Q.currency.currencyCode,currencySymbol:Q.currency.currencySymbol}})))(et,m,c),je=!(G&&J)||b==="small";return r.jsxRuntimeExports.jsxs(Fr,{windowSize:b,children:[b!=="small"?r.jsxRuntimeExports.jsxs(Or,{children:[r.jsxRuntimeExports.jsxs(Wr,{children:[r.jsxRuntimeExports.jsx(qr,{onClick:k,"data-testid":e.generateDataTestId("issue-card-nav-bar-zeni-logo")}),r.jsxRuntimeExports.jsxs(Hr,{showContent:P?.userEmailDomain==="zeni.ai",children:[r.jsxRuntimeExports.jsx(Gr,{}),r.jsxRuntimeExports.jsx(Zr,{children:x})]})]}),r.jsxRuntimeExports.jsx(e.MemoAnimatedCardStack,{cardArrProp:dt,insertFromTop:_<ee,containerScale:1.2})]}):null,r.jsxRuntimeExports.jsxs(Ar,{windowSize:b,children:[r.jsxRuntimeExports.jsxs(Ur,{windowSize:b,shouldShowTitle:je,children:[je&&r.jsxRuntimeExports.jsx(_r,{windowSize:b,children:he.title}),r.jsxRuntimeExports.jsx(Br,{windowSize:b,onClick:O,"data-testid":e.generateDataTestId("issue-card-nav-bar-close")})]}),r.jsxRuntimeExports.jsxs(zr,{windowSize:b,ref:R,children:[b!=="small"?r.jsxRuntimeExports.jsx(Mr,{ref:w,children:he.title}):null,t.issueCardStatus.fetchState==="Error"?r.jsxRuntimeExports.jsxs(Nr,{children:[r.jsxRuntimeExports.jsx(Vr,{}),r.jsxRuntimeExports.jsxs(kr,{children:[r.jsxRuntimeExports.jsx(Ve,{style:{fontWeight:e.FontWeight.medium},children:lt}),r.jsxRuntimeExports.jsx(Ve,{children:it})]})]}):null,r.jsxRuntimeExports.jsx(r.FormProvider,{...oe,children:r.jsxRuntimeExports.jsx("form",{id:Se(Me),onSubmit:st,children:r.jsxRuntimeExports.jsx(Cr,{issueChargeCards:t,issueCardSectionId:Ze,cardHolderCandidates:a,userList:d,limit:L,creditLimitFrequency:p,allRoles:f,allAccountingClasses:g,getInitialLineFormData:ve,clearTentativeNameForLine:s,companyAddress:S,containerRef:R,cardsSectionRef:u,openAddAddressDrawerHandler:N,isIssuePhysicalCardEnabled:E,isDebitCardFeatureEnabled:m,isChargeCardFeatureEnabled:j,isChargeCardSetupEnabled:n,isDebitCardSetupEnabled:$,defaultCardType:c})})})]}),r.jsxRuntimeExports.jsx(e.Footer,{style:{zIndex:1,padding:ae.footerTopPadding.valuePx(b)},formId:Se(Me),helperStyle:{paddingTop:e.Space.sp0,paddingBottom:e.Space.sp0},primaryBtn:{label:he.primaryBtnText,isLoading:t.issueCardStatus.fetchState==="In-Progress",style:{minWidth:110}},cancelBtn:{label:he.secondaryBtnText,onClick:O,style:{minWidth:110}},separatorStyle:{marginRight:e.Space.sp4}})]})]})},zr=l.div`
+  padding-left: ${t=>ae.containerPaddingLeft.valuePx(t.windowSize)};
+  padding-right: ${t=>ae.containerPaddingRight.valuePx(t.windowSize)};
+  height: 100%;
+  overflow-y: auto;
+`,Or=l.div`
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  overflow: hidden;
+  width: 42%;
+  background-color: ${t=>t.theme.colors.background};
+  margin-top: unset;
+`,Ar=l.div`
+  background-color: ${t=>t.theme.colors.grey4};
+  display: flex;
+  flex-direction: column;
+  width: ${t=>ae.rightSectionWidth.valuePercentage(t.windowSize)};
+  overflow: auto;
+  box-shadow: ${t=>`${e.Space.sp0} 2px ${e.Space.sp1} ${t.theme.colors.dropShadowNormal}`};
+`,Fr=l.div`
+  display: flex;
+  height: 100vh;
+  flex-direction: row;
+  width: 100vw;
+  overflow-y: scroll;
+`,_r=l(e.StyledText)`
+  ${t=>`${Pr.title.style(t.windowSize)}`};
+  color: ${t=>t.theme.colors.primary};
+  padding-left: ${t=>ae.containerPaddingLeft.valuePx(t.windowSize)};
+`,Ur=l.div`
+  position: sticky;
+  display: flex;
+  justify-content: ${t=>t.shouldShowTitle?"space-between":"flex-end"};
+  align-items: center;
+  width: 100%;
+  min-height: ${t=>ae.navbarHeight.valuePx(t.windowSize)};
+  top: ${e.Space.sp0};
+  z-index: 2;
+  background-color: ${t=>t.theme.colors.grey4};
+`,Br=l(e.SvgClose)`
+  cursor: pointer;
+  color: ${t=>t.theme.colors.hero};
+  width: ${e.Space.sp4};
+  height: ${e.Space.sp4};
+  min-height: ${e.Space.sp4};
+  margin-right: ${t=>ae.closeIconMarginRight.valuePx(t.windowSize)};
+  &:hover {
+    color: ${t=>t.theme.colors.primary};
+  }
+  padding: 0;
+`,Mr=l(e.H5Regular)`
+  color: ${t=>t.theme.colors.primary};
+  margin-top: ${e.Space.sp3};
+  margin-bottom: ${e.Space.sp3};
+`,Nr=l.div`
+  background-color: ${e.Colors.alertLight};
+  border: 1px solid ${e.Colors.brandColorGoldDark};
+  border-radius: ${e.Space.sp2};
+  display: flex;
+  gap: ${e.Space.sp2};
+  padding: ${e.Space.sp3} ${e.Space.sp4};
+  margin-bottom: ${e.Space.sp2};
+`,kr=l.div`
+  display: flex;
+  flex-direction: column;
+`,Ve=l(e.StandardMedium)`
+  color: ${e.Colors.brandColorGoldDark};
+`,Vr=l(e.SvgHighImportanceFilled)`
+  min-width: ${e.Space.sp4};
+  min-height: ${e.Space.sp4};
+  width: ${e.Space.sp4};
+  height: ${e.Space.sp4};
+  color: ${e.Colors.brandColorGoldDark};
+`,Wr=l.div`
+  margin-bottom: ${e.Space.sp3};
+  margin-top: ${e.Space.sp3};
+  margin-left: ${e.Space.sp8};
+  position: relative;
+  display: flex;
+  align-items: center;
+`,qr=l(e.SvgZeniIconOnly)`
+  width: ${e.Space.sp4};
+  height: ${e.Space.sp4};
+  cursor: pointer;
+  color: ${t=>t.theme.colors.brandColorJade};
+`,Hr=l.div`
+  display: ${t=>t.showContent?"flex":"none"};
+  align-items: center;
+`,Gr=l.div`
+  width: 1px;
+  height: ${e.Space.sp3};
+  margin: ${e.Space.sp0} ${e.Space.sp3};
+  background-color: ${t=>t.theme.colors.hero};
+`,Zr=l(e.LargeSemiBold)`
+  color: ${t=>t.theme.colors.primary};
+`,Dr=(t,a,d,x,f,g,E)=>({lineIndex:a,lineId:t.lineId??String(a+1),chargeCardType:t.chargeCardType,creditCard:{cardType:t.creditCard.cardType,virtualCard:{cardName:t.creditCard.virtualCard?.cardName??"",amount:t.creditCard.virtualCard?.amount?.amount??void 0,users:{allUsers:d,selectedUsers:d.filter(m=>t.creditCard.virtualCard?.userIds.includes(m.userId)),allNonUsers:[],selectedNonUsers:[]},frequency:{allOptions:x.map(m=>({label:m.name,value:m.code})),selectedOption:t.creditCard.virtualCard?.frequency}},physicalCard:{cardName:t.creditCard.physicalCard?.cardName??"",amount:t.creditCard.physicalCard?.amount?.amount??void 0,user:{allUsers:f,selectedUser:t.creditCard.physicalCard.userId},frequency:{allOptions:x.map(m=>({label:m.name,value:m.code})),selectedOption:t.creditCard.physicalCard?.frequency},addressType:t.creditCard.physicalCard?.addressType,addressId:t.creditCard.physicalCard?.addressId??E?.addressId}},debitCard:{cardType:t.debitCard.cardType,virtualCard:{cardName:t.debitCard.virtualCard?.cardName??"",amount:t.debitCard.virtualCard?.amount?.amount??void 0,users:{allUsers:d,selectedUsers:d.filter(m=>t.debitCard.virtualCard?.userIds.includes(m.userId)),allNonUsers:[],selectedNonUsers:[]},connectedAccount:{allOptions:g.map(m=>({label:m.accountName,value:m.id})),selectedOption:t.debitCard.virtualCard.connectedAccountId},frequency:{allOptions:x.map(m=>({label:m.name,value:m.code})),selectedOption:t.debitCard.virtualCard?.frequency}},physicalCard:{cardName:t.debitCard.physicalCard?.cardName??"",amount:t.debitCard.physicalCard?.amount?.amount??void 0,user:{allUsers:f,selectedUser:t.debitCard.physicalCard.userId},connectedAccount:{allOptions:g.map(m=>({label:m.accountName,value:m.id})),selectedOption:t.debitCard.physicalCard.connectedAccountId},frequency:{allOptions:x.map(m=>({label:m.name,value:m.code})),selectedOption:t.debitCard.physicalCard?.frequency},addressType:t.debitCard.physicalCard?.addressType,addressId:t.debitCard.physicalCard?.addressId??E?.addressId}}}),ve=(t,a,d,x,f,g,E,m,j,$,n,P)=>({lineIndex:t,lineId:a,chargeCardType:Je(E,m,j,$,P),creditCard:{cardType:"business_virtual_credit_card",physicalCard:{cardName:"",amount:void 0,user:{allUsers:f,selectedUser:void 0},frequency:{allOptions:x.map(c=>({label:c.name,value:c.code})),selectedOption:"monthly"},addressType:void 0,addressId:n?.addressId},virtualCard:{cardName:"",amount:void 0,users:{allUsers:d,selectedUsers:[],allNonUsers:[],selectedNonUsers:[]},frequency:{allOptions:x.map(c=>({label:c.name,value:c.code})),selectedOption:"monthly"}}},debitCard:{cardType:"business_virtual_debit_card",physicalCard:{cardName:"",amount:void 0,user:{allUsers:f,selectedUser:void 0},frequency:{allOptions:x.map(c=>({label:c.name,value:c.code})),selectedOption:"monthly"},addressType:void 0,addressId:n?.addressId,connectedAccount:{allOptions:g.map(c=>({label:c.accountName,value:c.id})),selectedOption:g.length===1?g[0].id:void 0}},virtualCard:{cardName:"",amount:void 0,users:{allUsers:d,selectedUsers:[],allNonUsers:[],selectedNonUsers:[]},frequency:{allOptions:x.map(c=>({label:c.name,value:c.code})),selectedOption:"monthly"},connectedAccount:{allOptions:g.map(c=>({label:c.accountName,value:c.id})),selectedOption:g.length===1?g[0].id:void 0}}}}),Je=(t,a,d,x,f)=>{if(f!=null){if(a&&x&&f==="debitCard")return"debit_card";if(t&&d&&f==="creditCard")return"credit_card"}return a&&x&&(!t||!d)?"debit_card":"credit_card"},We=(t,a,d,x,f,g,E,m,j,$,n)=>{const P=[];return Object.values(t).forEach((c,o)=>{c?.lineId!=null&&P.push(Dr(c,o,a,d,x,f,$))}),P.length===0&&P.push(ve(0,"1",a,d,x,f,g,E,m,j,$,n)),{[Ze]:P}};exports.default=Ir;exports.getInitialLineFormData=ve;exports.uniqueFormName=Se;