@zeniai/web-components 3.16.99 → 3.17.1

package/dist/CurrencySelectField-DkEjdkjo.cjs

@@ -1,139 +0,0 @@
-"use strict";const o=require("./vendor-.pnpm-D0ILHvHB.cjs"),b=require("react"),i=require("@emotion/styled"),t=require("./index-CZKgJQb3.cjs"),F=({name:e,registerOptions:s,defaultValue:n,isDisabled:c,style:a,placeholder:d,isOptionRemovable:r=!0,menuItemHeight:u=40,controlStyle:p})=>{const{control:x,formState:{errors:g}}=o.useFormContext(),m=o.useTheme(),[f,j]=b.useState(!1),C=o.has(g,e??""),w=t.appLocale.getLocalizedStrings().common.currency,R=l=>{if(!(l==null||!l))return{value:l,label:n.allOptions.find(h=>h.value===l)?.label??l,countryCode:n.allOptions.find(h=>h.value===l)?.countryCode??w.countryCode}},E={container:l=>({...l,width:"100%",...a}),menu:l=>({...l,backgroundColor:m.colors.grey5,borderRadius:t.Space.sp1,boxShadow:`${t.Space.sp0} 2px ${t.Space.sp2} ${m.colors.dropShadowHover}`,border:`1px solid ${m.colors.grey3}`,whiteSpace:"nowrap",zIndex:2,width:"100%",margin:`1px ${t.Space.sp0} ${t.Space.sp0} ${t.Space.sp0}`,overflow:"hidden"}),menuList:l=>({...l,borderRadius:t.Space.sp1}),input:()=>({color:m.colors.primary,margin:0}),singleValue:l=>({...l,margin:0,position:"absolute"})},O={hasError:C,menuItemHeight:u,controlStyle:p,isOptionRemovable:r};return o.jsxRuntimeExports.jsx(o.Controller,{name:e,control:x,defaultValue:n,rules:s,"data-testid":t.generateDataTestId("currency-select-field",e),render:({field:{onChange:l,onBlur:h,value:v,ref:k}})=>{const y=v;return b.createElement(o.StateManagedSelect$1,{...O,ref:k,isMulti:!1,isSearchable:!0,isClearable:r,autoFocus:f===!0,openMenuOnClick:!0,controlShouldRenderValue:!0,placeholder:d,value:R(y.selectedOption),options:n.allOptions,"data-testid":t.generateDataTestId("currency-select",e),onChange:S=>{r&&S?.value!=null&&y?.selectedOption===S.value?l({selectedOption:void 0,allOptions:n.allOptions}):l({selectedOption:S?.value,allOptions:n.allOptions})},onMenuClose:()=>j(!1),key:o.nanoid(),tabSelectsValue:!1,openMenuOnFocus:!0,classNamePrefix:"currency-select-field",onBlur:h,menuPlacement:"auto",maxMenuHeight:240,menuShouldScrollIntoView:!1,closeMenuOnSelect:!0,components:{Control:I,Option:D,Input:M,SingleValue:P,ValueContainer:V,DropdownIndicator:Q,IndicatorSeparator:U,Placeholder:N,ClearIndicator:X,MenuList:L},hideSelectedOptions:!1,styles:E,isDisabled:c!=null})}})},I=e=>{const{menuIsOpen:s,isFocused:n,isDisabled:c,selectProps:a}=e,{value:d,hasError:r,controlStyle:u}=a;return o.jsxRuntimeExports.jsx(_,{controlStyle:u,menuIsOpen:s,isFocused:n,isDisabled:c,selectedValue:d,hasError:r,children:o.jsxRuntimeExports.jsx(o.components.Control,{...e,className:"select-control",children:e.children})})},D=e=>{const{data:s,isSelected:n,isDisabled:c,isFocused:a,selectProps:d}=e,{isOptionRemovable:r}=d,u=s.countryCode,p=typeof s.label=="string"?s.label:s.value;return o.jsxRuntimeExports.jsx(q,{isOptionRemovable:r,className:"select-option-wrapper",isFocused:a,isSelected:n,isDisabled:c,"data-testid":t.generateDataTestId("currency-select-field-option",p),children:o.jsxRuntimeExports.jsx(o.components.Option,{...e,className:"select-option",children:o.jsxRuntimeExports.jsxs(z,{children:[o.jsxRuntimeExports.jsx(T,{countryCode:u}),o.jsxRuntimeExports.jsx(A,{isSelected:n,children:o.jsxRuntimeExports.jsx(B,{isSelected:n,isDisabled:c,children:s.label})}),n?o.jsxRuntimeExports.jsxs(G,{children:[o.jsxRuntimeExports.jsx(J,{className:"right-tick-icon"}),o.jsxRuntimeExports.jsx(K,{className:"close-tick-icon"})]}):null]})})})},L=e=>{const{options:s,children:n,maxHeight:c,getValue:a,selectProps:d}=e,{menuItemHeight:r}=d,[u]=a(),p=s.indexOf(u)*r;return o.jsxRuntimeExports.jsx(o.VariableSizeList,{height:n.length>7?c:n.length*r,width:"100%",itemCount:n.length,itemSize:()=>r,initialScrollOffset:p,children:({index:x,style:g})=>o.jsxRuntimeExports.jsx(W,{style:g,children:n[x]})})},V=e=>o.jsxRuntimeExports.jsx(o.components.ValueContainer,{...e,className:"select-value-container",children:e.children}),M=e=>{const{selectProps:s}=e,{placeholder:n,value:c}=s;return o.jsxRuntimeExports.jsx($,{children:o.jsxRuntimeExports.jsx(o.components.Input,{...e,autoComplete:"new-password",placeholder:c==null?n:void 0,children:e.children})})},P=e=>{const{data:s}=e;return o.jsxRuntimeExports.jsx(o.components.SingleValue,{...e,children:o.jsxRuntimeExports.jsx($,{children:s.label})})},$=i(t.StandardRegular)`
-  color: ${e=>e.theme.colors.primary};
-`,N=()=>null,T=({countryCode:e})=>{if(e!=null&&o.hasFlag(e)===!1)return o.jsxRuntimeExports.jsx(o.jsxRuntimeExports.Fragment,{});{const s=e??"",n=o.Flags[`${t.toAlpha2CountryCodeSupportedByProvider(s)}`];return o.jsxRuntimeExports.jsx(H,{children:o.jsxRuntimeExports.jsx(n,{width:t.Space.sp4,height:t.Space.sp3})})}},_=i.span`
-  width: 100%;
-  background-color: ${e=>e.hasError?t.Colors.importantLight:e.menuIsOpen?e.theme.colors.background:e.controlStyle?.backgroundColor!=null?e.controlStyle?.backgroundColor:e.theme.colors.grey5};
-  border-radius: ${t.Space.sp1};
-  cursor: ${e=>e.isDisabled?"not-allowed":"pointer"};
-  .select-control {
-    border: none;
-    height: ${t.Space.sp6};
-    background-color: inherit;
-    box-shadow: none;
-    &:hover {
-      fill: ${e=>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;
-    }
-    width: auto;
-    min-height: auto;
-    cursor: pointer;
-  }
-
-  .select-value-container {
-    width: 100%;
-    display: flex;
-    margin: ${t.Space.sp0} ${t.Space.sp3};
-    padding: 0;
-    max-width: 100%;
-    height: 100%;
-    min-width: auto;
-    align-items: center;
-    flex-wrap: nowrap;
-    cursor: pointer;
-    justify-content: ${e=>e.controlStyle?.justifyContent!=null?e.controlStyle?.justifyContent:e.menuIsOpen===!1?"flex-end":"flex-start"};
-
-    .currency-select-field__single-value {
-      display: flex;
-      margin: ${t.Space.sp0};
-      color: ${e=>e.hasError?t.Colors.important:e.theme.colors.primary};
-      ${t.textStyles.standardRegular.css};
-    }
-
-    .currency-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.hasError===!0?t.Colors.important:e.theme.colors.primary};
-      margin: ${t.Space.sp0};
-      cursor: inherit;
-      top: ${t.Space.sp2};
-
-      > input {
-        text-align: ${e=>e.isFocused===!1&&e.selectedValue==null?"right":"initial"};
-        text-align: ${e=>e.isFocused===!1?"right":"left"};
-        align-items: center;
-        overflow: hidden;
-        cursor: inherit;
-        :disabled {
-          visibility: visible;
-        }
-        ::placeholder {
-          color: ${e=>e.hasError?t.Colors.important:e.theme.colors.grey1};
-        }
-      }
-    }
-  }
-`,q=i.div`
-  border-radius: inherit;
-  .select-option {
-    ${t.textStyles.smallRegular.css};
-    height: ${t.Space.sp6};
-    padding: 9px ${t.Space.sp3};
-    color: ${e=>e.isSelected?e.theme.colors.primary:e.theme.colors.champion};
-    opacity: ${e=>e.isDisabled?.32:1};
-    background-color: ${e=>e.isSelected?e.theme.colors.grey3:e.theme.colors.grey5};
-    ${e=>e.isFocused&&`background-color: ${e.theme.colors.background}`};
-    cursor: ${e=>e.isDisabled?"not-allowed":"pointer"};
-    border-top: none;
-    border-radius: inherit;
-    .close-tick-icon {
-      display: none;
-    }
-
-    &:hover {
-      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};
-      .right-tick-icon {
-        display: ${e=>e.isOptionRemovable?"none":"inline-block"};
-      }
-      .close-tick-icon {
-        display: ${e=>e.isOptionRemovable?"inline-block":"none"};
-      }
-    }
-  }
-`,z=i.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: space-between;
-`,H=i.div`
-  padding-right: ${t.Space.sp2};
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  fill: initial;
-  color: initial;
-`,B=i(t.SmallRegular)`
-  padding-right: 10px;
-  cursor: ${e=>e.isDisabled?"not-allowed":"pointer"};
-  ${e=>e.isSelected&&"cursor: default"};
-`,A=i.div`
-  width: ${e=>e.isSelected?`calc(100% - ${t.Space.sp3})`:"100%"};
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-`,W=i.div`
-  :first-of-type {
-    border-top-left-radius: ${t.Space.sp1};
-    border-top-right-radius: ${t.Space.sp1};
-  }
-
-  :last-of-type {
-    border-bottom-left-radius: ${t.Space.sp1};
-    border-bottom-right-radius: ${t.Space.sp1};
-  }
-`,G=i.div`
-  display: flex;
-`,J=i(t.SvgTick)`
-  width: 12px;
-  height: 12px;
-  margin-right: 2px;
-  margin-left: ${t.Space.sp1};
-  color: ${e=>e.theme.colors.primary};
-`,K=i(t.SvgClose)`
-  width: ${t.Space.sp3};
-  height: ${t.Space.sp3};
-  color: ${e=>e.theme.colors.primary};
-`,Q=()=>null,U=()=>null,X=()=>null;exports.CurrencySelectField=F;

package/dist/CustomerOnboardingActivationPage-Co7TiXDY.js

@@ -1,143 +0,0 @@
-import { j as t } from "./vendor-.pnpm-B2klaOGU.js";
-import { useEffect as l } from "react";
-import o from "@emotion/styled";
-import { a as d, aD as g, e as p, A as x, S as i, j as u, H as m, ai as h, u as $ } from "./index-CD9fwr4J.js";
-const f = o.div`
-  display: flex;
-  width: 100%;
-  flex-direction: column;
-`, b = o.div`
-  display: flex;
-  flex: 1 1 auto;
-  flex-direction: column;
-  padding: ${i.sp0} 20px;
-  width: 240px;
-  box-sizing: border-box;
-  position: fixed;
-  justify-content: space-between;
-  height: 100%;
-  z-index: 4;
-  background: ${(e) => e.theme.colors.background};
-`, j = o(u)`
-  margin: 20px 12px ${i.sp0} ${i.sp0};
-  height: ${i.sp4};
-  width: 102px;
-  color: ${(e) => e.theme.colors.primary};
-  cursor: pointer;
-`, v = o.div`
-  display: flex;
-  flex: 1 1 auto;
-  flex-direction: column;
-  padding-right: 240px;
-  width: calc(100% - 240px);
-  box-sizing: border-box;
-  position: fixed;
-  align-items: center;
-  justify-content: center;
-  height: 100%;
-  left: 240px;
-  background: ${(e) => e.theme.colors.background};
-`, y = o(m)`
-  color: ${(e) => e.theme.colors.primary};
-  margin-bottom: ${i.sp1};
-  padding: ${i.sp0} ${i.sp3};
-  text-align: center;
-`, w = o(h)`
-  color: ${(e) => e.theme.colors.hero};
-  padding: ${i.sp0} ${i.sp3};
-  text-align: center;
-`, k = o.div`
-  margin-top: ${i.sp3};
-`, z = ({
-  dashboardFetchState: e,
-  onZeniLogoClick: s,
-  onDashboardFetchDone: n
-}) => {
-  const { title: a, subTitle: c } = d.getLocalizedStrings().customerOnboardingPage.thankYou, r = g(e);
-  return l(() => {
-    r === "In-Progress" && e !== "In-Progress" && n();
-  }, [e, r, n]), /* @__PURE__ */ t.jsxs(f, { children: [
-    /* @__PURE__ */ t.jsx(b, { children: /* @__PURE__ */ t.jsx(
-      j,
-      {
-        "data-testid": p(
-          "zeni-logo-customer-onboarding-activation-page"
-        ),
-        onClick: s
-      }
-    ) }),
-    /* @__PURE__ */ t.jsxs(v, { children: [
-      /* @__PURE__ */ t.jsx(y, { children: a }),
-      /* @__PURE__ */ t.jsx(w, { children: c }),
-      /* @__PURE__ */ t.jsx(k, { children: /* @__PURE__ */ t.jsx(x, { size: "Large", start: !0 }) })
-    ] })
-  ] });
-}, C = o.div`
-  display: flex;
-  flex-direction: column;
-  height: 100vh;
-  position: relative;
-`, S = o.div`
-  width: 100%;
-  position: absolute;
-`, P = o.div`
-  position: relative;
-  display: flex;
-  -webkit-box-align: center;
-  align-items: center;
-  justify-content: center;
-  padding: ${i.sp0} ${i.sp3};
-  min-height: ${i.sp8};
-`, T = o(u)`
-  height: ${i.sp4};
-  width: 102px;
-  color: ${(e) => e.theme.colors.primary};
-  cursor: pointer;
-`, L = o.div`
-  display: flex;
-  flex: 1 1 auto;
-  flex-direction: column;
-  box-sizing: border-box;
-  align-items: center;
-  justify-content: center;
-  background: ${(e) => e.theme.colors.background};
-  padding: ${i.sp0} ${i.sp3};
-`, A = o(m)`
-  color: ${(e) => e.theme.colors.primary};
-  margin-bottom: ${i.sp1};
-  text-align: center;
-  width: 100%;
-`, I = o(h)`
-  color: ${(e) => e.theme.colors.hero};
-  text-align: center;
-  width: 100%;
-`, O = o.div`
-  margin-top: ${i.sp3};
-`, Y = ({
-  dashboardFetchState: e,
-  onZeniLogoClick: s,
-  onDashboardFetchDone: n
-}) => {
-  const { title: a, subTitle: c } = d.getLocalizedStrings().customerOnboardingPage.thankYou, r = g(e);
-  return l(() => {
-    r === "In-Progress" && e !== "In-Progress" && n();
-  }, [e, r, n]), /* @__PURE__ */ t.jsxs(C, { children: [
-    /* @__PURE__ */ t.jsx(S, { children: /* @__PURE__ */ t.jsx(P, { children: /* @__PURE__ */ t.jsx(
-      T,
-      {
-        "data-testid": p(
-          "zeni-logo-customer-onboarding-activation-page"
-        ),
-        onClick: s
-      }
-    ) }) }),
-    /* @__PURE__ */ t.jsxs(L, { children: [
-      /* @__PURE__ */ t.jsx(A, { children: a }),
-      /* @__PURE__ */ t.jsx(I, { children: c }),
-      /* @__PURE__ */ t.jsx(O, { children: /* @__PURE__ */ t.jsx(x, { size: "Large", start: !0 }) })
-    ] })
-  ] });
-}, D = (e) => $() === "small" ? /* @__PURE__ */ t.jsx(Y, { ...e }) : /* @__PURE__ */ t.jsx(z, { ...e });
-export {
-  D as default
-};

package/dist/CustomerOnboardingActivationPage-DOk08ksi.cjs

@@ -1,88 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./vendor-.pnpm-D0ILHvHB.cjs"),l=require("react"),o=require("@emotion/styled"),e=require("./index-CZKgJQb3.cjs"),p=o.div`
-  display: flex;
-  width: 100%;
-  flex-direction: column;
-`,x=o.div`
-  display: flex;
-  flex: 1 1 auto;
-  flex-direction: column;
-  padding: ${e.Space.sp0} 20px;
-  width: 240px;
-  box-sizing: border-box;
-  position: fixed;
-  justify-content: space-between;
-  height: 100%;
-  z-index: 4;
-  background: ${t=>t.theme.colors.background};
-`,d=o(e.SvgZeniLogoFull)`
-  margin: 20px 12px ${e.Space.sp0} ${e.Space.sp0};
-  height: ${e.Space.sp4};
-  width: 102px;
-  color: ${t=>t.theme.colors.primary};
-  cursor: pointer;
-`,u=o.div`
-  display: flex;
-  flex: 1 1 auto;
-  flex-direction: column;
-  padding-right: 240px;
-  width: calc(100% - 240px);
-  box-sizing: border-box;
-  position: fixed;
-  align-items: center;
-  justify-content: center;
-  height: 100%;
-  left: 240px;
-  background: ${t=>t.theme.colors.background};
-`,g=o(e.H5Regular)`
-  color: ${t=>t.theme.colors.primary};
-  margin-bottom: ${e.Space.sp1};
-  padding: ${e.Space.sp0} ${e.Space.sp3};
-  text-align: center;
-`,m=o(e.LargeRegular)`
-  color: ${t=>t.theme.colors.hero};
-  padding: ${e.Space.sp0} ${e.Space.sp3};
-  text-align: center;
-`,j=o.div`
-  margin-top: ${e.Space.sp3};
-`,h=({dashboardFetchState:t,onZeniLogoClick:r,onDashboardFetchDone:n})=>{const{title:c,subTitle:a}=e.appLocale.getLocalizedStrings().customerOnboardingPage.thankYou,s=e.usePrevious(t);return l.useEffect(()=>{s==="In-Progress"&&t!=="In-Progress"&&n()},[t,s,n]),i.jsxRuntimeExports.jsxs(p,{children:[i.jsxRuntimeExports.jsx(x,{children:i.jsxRuntimeExports.jsx(d,{"data-testid":e.generateDataTestId("zeni-logo-customer-onboarding-activation-page"),onClick:r})}),i.jsxRuntimeExports.jsxs(u,{children:[i.jsxRuntimeExports.jsx(g,{children:c}),i.jsxRuntimeExports.jsx(m,{children:a}),i.jsxRuntimeExports.jsx(j,{children:i.jsxRuntimeExports.jsx(e.ActivityIndicator,{size:"Large",start:!0})})]})]})},$=o.div`
-  display: flex;
-  flex-direction: column;
-  height: 100vh;
-  position: relative;
-`,b=o.div`
-  width: 100%;
-  position: absolute;
-`,S=o.div`
-  position: relative;
-  display: flex;
-  -webkit-box-align: center;
-  align-items: center;
-  justify-content: center;
-  padding: ${e.Space.sp0} ${e.Space.sp3};
-  min-height: ${e.Space.sp8};
-`,f=o(e.SvgZeniLogoFull)`
-  height: ${e.Space.sp4};
-  width: 102px;
-  color: ${t=>t.theme.colors.primary};
-  cursor: pointer;
-`,v=o.div`
-  display: flex;
-  flex: 1 1 auto;
-  flex-direction: column;
-  box-sizing: border-box;
-  align-items: center;
-  justify-content: center;
-  background: ${t=>t.theme.colors.background};
-  padding: ${e.Space.sp0} ${e.Space.sp3};
-`,R=o(e.H5Regular)`
-  color: ${t=>t.theme.colors.primary};
-  margin-bottom: ${e.Space.sp1};
-  text-align: center;
-  width: 100%;
-`,y=o(e.LargeRegular)`
-  color: ${t=>t.theme.colors.hero};
-  text-align: center;
-  width: 100%;
-`,E=o.div`
-  margin-top: ${e.Space.sp3};
-`,w=({dashboardFetchState:t,onZeniLogoClick:r,onDashboardFetchDone:n})=>{const{title:c,subTitle:a}=e.appLocale.getLocalizedStrings().customerOnboardingPage.thankYou,s=e.usePrevious(t);return l.useEffect(()=>{s==="In-Progress"&&t!=="In-Progress"&&n()},[t,s,n]),i.jsxRuntimeExports.jsxs($,{children:[i.jsxRuntimeExports.jsx(b,{children:i.jsxRuntimeExports.jsx(S,{children:i.jsxRuntimeExports.jsx(f,{"data-testid":e.generateDataTestId("zeni-logo-customer-onboarding-activation-page"),onClick:r})})}),i.jsxRuntimeExports.jsxs(v,{children:[i.jsxRuntimeExports.jsx(R,{children:c}),i.jsxRuntimeExports.jsx(y,{children:a}),i.jsxRuntimeExports.jsx(E,{children:i.jsxRuntimeExports.jsx(e.ActivityIndicator,{size:"Large",start:!0})})]})]})},k=t=>e.useWindowSizeContext()==="small"?i.jsxRuntimeExports.jsx(w,{...t}):i.jsxRuntimeExports.jsx(h,{...t});exports.default=k;

package/dist/CustomerOnboardingContainerPage-2-p0xECd.js

@@ -1,7 +0,0 @@
-import { j as r } from "./vendor-.pnpm-B2klaOGU.js";
-import e from "./CustomerOnboardingNoStepsPage-CqCWPljL.js";
-import o from "./CustomerOnboardingPage-DmGISgmG.js";
-const i = (t) => t.currentTenant?.productSettings.isOtherProductsEnabled === !0 ? /* @__PURE__ */ r.jsx(e, { ...t }) : /* @__PURE__ */ r.jsx(o, { ...t });
-export {
-  i as default
-};

package/dist/CustomerOnboardingContainerPage-CbBVBjxi.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./vendor-.pnpm-D0ILHvHB.cjs"),r=require("./CustomerOnboardingNoStepsPage-B9f6Fyho.cjs"),n=require("./CustomerOnboardingPage-ViirXnMF.cjs"),o=e=>e.currentTenant?.productSettings.isOtherProductsEnabled===!0?t.jsxRuntimeExports.jsx(r.default,{...e}):t.jsxRuntimeExports.jsx(n.default,{...e});exports.default=o;

package/dist/CustomerOnboardingDetailPageSkeleton-CERd2g7A.cjs

@@ -1,162 +0,0 @@
-"use strict";const s=require("./vendor-.pnpm-D0ILHvHB.cjs"),r=require("@emotion/styled"),t=require("./index-CZKgJQb3.cjs"),h=require("react"),w=r(s.CircularProgressbar)`
-  /* Size is controlled by styles.root prop */
-`,E=r.div`
-  position: relative;
-  width: ${t.Space.sp3};
-  height: ${t.Space.sp3};
-  border-radius: 50%;
-  background-color: ${t.Colors.brandColorJadeLight};
-  display: flex;
-  align-items: center;
-  justify-content: center;
-
-  &::before {
-    content: "";
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    border-radius: 50%;
-    border: 2px solid ${({theme:e})=>e.colors.grey2};
-    pointer-events: none;
-    z-index: 1;
-  }
-`,k=({valueEnd:e,valueStart:o,children:i})=>{const[n,a]=h.useState(o);return h.useEffect(()=>{const c=setTimeout(()=>{a(e)},100);return()=>clearTimeout(c)},[e]),s.jsxRuntimeExports.jsx(s.jsxRuntimeExports.Fragment,{children:i(n)})},A=({valueEnd:e=50})=>{const o=s.useTheme();return s.jsxRuntimeExports.jsx(k,{valueStart:0,valueEnd:e,children:i=>s.jsxRuntimeExports.jsx(E,{theme:o,children:s.jsxRuntimeExports.jsx(w,{value:i,strokeWidth:50,circleRatio:1,styles:{...s.buildStyles({pathColor:t.Colors.success,trailColor:"transparent",pathTransitionDuration:1.5,rotation:1,strokeLinecap:"butt"}),root:{width:t.Space.sp3,height:t.Space.sp3,position:"relative",zIndex:2,display:"flex",alignItems:"center",justifyContent:"center"}}})})})},j=({isActive:e,isCompleted:o,isDisabled:i,isError:n,isHalfCompleted:a,theme:c})=>e||o||a||n?n?t.Colors.runwayRed:c.colors.primary:i?c.colors.grey1:c.colors.hero,C=({isActive:e,isCompleted:o,isDisabled:i,isHalfCompleted:n,theme:a})=>e||o||n?a.colors.primary:i?a.colors.grey1:a.colors.hero,D=r.div`
-  width: 100%;
-  display: flex;
-  background: ${e=>e.isActive?e.theme.colors.grey5:null};
-  transition: background-color 0.2s ease-in;
-  box-shadow: ${e=>e.isActive?`${t.Space.sp0} 2px ${t.Space.sp1} ${e.theme.colors.dropShadowNormal}`:null};
-  border-radius: ${t.Space.sp2};
-  padding: ${t.Space.sp3};
-  cursor: ${e=>e.isDisabled?"no-drop":"pointer"};
-  box-sizing: border-box;
-  &:hover {
-    background: ${e=>{const o=e.isCompleted||e.isHalfCompleted;return e.isActive?e.theme.colors.grey3:o&&e.isDisabled===!1?e.theme.colors.grey5:"initial"}};
-    .step-content-title {
-      color: ${e=>j({isActive:e.isActive,isCompleted:e.isCompleted,isDisabled:e.isDisabled,isError:e.isError,isHalfCompleted:e.isHalfCompleted,theme:e.theme})};
-    }
-    .step-content-subtitle {
-      color: ${e=>C({isActive:e.isActive,isCompleted:e.isCompleted,isDisabled:e.isDisabled,isHalfCompleted:e.isHalfCompleted,theme:e.theme})};
-    }
-  }
-`,z=r.div`
-  margin-right: ${t.Space.sp2};
-  margin-top: 2px;
-`,T=r(t.SvgSuccessRound)`
-  width: ${t.Space.sp3};
-  height: ${t.Space.sp3};
-  color: ${t.Colors.success};
-`,P=r(t.SvgHighImportanceFilled)`
-  width: ${t.Space.sp3};
-  height: ${t.Space.sp3};
-  color: ${t.Colors.runwayRed};
-`,I=r.div`
-  height: ${t.Space.sp3};
-  width: ${t.Space.sp3};
-  border: 1px solid
-    ${e=>e.isActive?e.theme.colors.primary:e.disabledStep?e.theme.colors.grey2:e.theme.colors.hero};
-  border-radius: 50%;
-`,L=r.div`
-  display: flex;
-  flex-direction: column;
-`,H=r(t.SmallMedium)`
-  color: ${e=>j({isActive:e.isActive,isCompleted:e.isCompleted,isDisabled:e.disabledStep,isError:e.isError,isHalfCompleted:e.isHalfCompleted,theme:e.theme})};
-`,W=r(t.ExtraSmallRegular)`
-  color: ${e=>C({isActive:e.isActive,isCompleted:e.isCompleted,isDisabled:e.disabledStep,isHalfCompleted:e.isHalfCompleted,theme:e.theme})};
-`;function N({onboardingStep:e,isActive:o,isCompleted:i,isHalfCompleted:n,isDisabled:a,isError:c,stepText:p,stepSubText:u,onUpdateStep:m,setIsStepClicked:d,disabledSteps:l}){const x=a||l.includes(e)&&o===!1;return s.jsxRuntimeExports.jsxs(D,{isActive:o,isDisabled:x,isCompleted:i,isHalfCompleted:n,isError:c,onClick:a===!1?()=>{l.includes(e)&&o===!1||(d(!0),m(e))}:void 0,"data-testid":t.generateDataTestId("step-box",e),children:[s.jsxRuntimeExports.jsx(z,{children:c?s.jsxRuntimeExports.jsx(P,{}):n?s.jsxRuntimeExports.jsx(A,{}):i?s.jsxRuntimeExports.jsx(T,{}):s.jsxRuntimeExports.jsx(I,{isActive:o,disabledStep:x})}),s.jsxRuntimeExports.jsxs(L,{children:[s.jsxRuntimeExports.jsx(H,{className:"step-content-title",isActive:o,isCompleted:i,isHalfCompleted:n,disabledStep:x,isError:c,children:p}),s.jsxRuntimeExports.jsx(W,{className:"step-content-subtitle",isActive:o,isCompleted:i,isHalfCompleted:n,disabledStep:x,children:u})]})]})}const O=r.div`
-  display: flex;
-  flex: 1 1 auto;
-  margin-top: 84px;
-  flex-direction: column;
-  justify-content: start;
-  gap: ${t.Space.sp6};
-  width: 198px;
-`,B=r.div`
-  width: 100%;
-`;function _({allSteps:e,completedSteps:o,halfCompletedSteps:i,errorSteps:n,currentStep:a,isDisabled:c,onUpdateStep:p,setIsStepClicked:u,disabledSteps:m}){const d=t.appLocale.getLocalizedStrings().customerOnboardingPage.steps;return s.jsxRuntimeExports.jsx(O,{children:e.map(l=>s.jsxRuntimeExports.jsx(B,{children:s.jsxRuntimeExports.jsx(N,{isActive:l===a,isCompleted:o.includes(l),isHalfCompleted:i.includes(l),isError:n.includes(l),isDisabled:c,onboardingStep:l,stepText:d[l].stepText,stepSubText:d[l].stepSubText,onUpdateStep:p,setIsStepClicked:u,disabledSteps:m})},l))})}const q=r.div`
-  display: flex;
-  flex: 1 1 auto;
-  margin-top: 84px;
-  flex-direction: column;
-  justify-content: start;
-  gap: ${t.Space.sp6};
-  width: 198px;
-`,F=r.div`
-  height: 89px; // As per figma specs
-  border-radius: ${t.Space.sp2};
-  width: 100%;
-  display: flex;
-  box-sizing: border-box;
-`,U=()=>{const e=s.useTheme();return s.jsxRuntimeExports.jsx(q,{children:[...Array(2)].map((o,i)=>s.jsxRuntimeExports.jsx(F,{children:s.jsxRuntimeExports.jsx(t.RectangularContentLoader,{width:198,height:89,backgroundColor:e.colors.grey3,style:{borderRadius:t.Space.sp2}})},i))})},g=240,Z=r.div`
-  display: flex;
-  flex: 1 1 auto;
-  flex-direction: column;
-  padding: ${t.Space.sp0} 20px;
-  width: ${g}px;
-  box-sizing: border-box;
-  position: fixed;
-  height: 100%;
-  z-index: 4;
-  background: ${e=>e.theme.colors.background};
-  box-shadow: ${e=>`${t.Space.sp0} 2px ${t.Space.sp1} ${e.theme.colors.dropShadowNormal}`};
-  ${e=>e.theme.breakpoints.down("md")} {
-    display: none;
-  }
-  border-right: ${e=>`1px solid ${e.theme.colors.grey3}`};
-`,J=r.div`
-  margin: ${t.Space.sp0} ${t.Space.sp0} ${t.Space.sp3} ${t.Space.sp0};
-  width: fit-content;
-`,M=r(t.SvgZeniLogoFull)`
-  margin: 20px 12px ${t.Space.sp0} 12px;
-  height: ${t.Space.sp4};
-  width: 102px;
-  color: ${e=>e.theme.colors.primary};
-  cursor: pointer;
-  flex-shrink: 0;
-`,V=e=>{const{isOnAddressPage:o,allSteps:i,completedSteps:n,halfCompletedSteps:a,errorSteps:c,currentStep:p,signedInUser:u,currentTenant:m,fetchStatus:d,onUpdateStep:l,onZeniLogoClick:x,handleLogOutClick:$,handleCockpitClick:f,setIsStepClicked:y}=e,R=d.fetchState==="In-Progress"||d.fetchState==="Not-Started",v=[];return s.jsxRuntimeExports.jsxs(Z,{children:[s.jsxRuntimeExports.jsx(M,{"data-testid":t.generateDataTestId("zeni-logo-customer-onboarding-drawer"),onClick:x}),R?s.jsxRuntimeExports.jsx(U,{}):s.jsxRuntimeExports.jsx(_,{allSteps:i,isDisabled:o,disabledSteps:v,completedSteps:n,halfCompletedSteps:a,errorSteps:c,currentStep:p,onUpdateStep:l,setIsStepClicked:y}),s.jsxRuntimeExports.jsx(J,{children:s.jsxRuntimeExports.jsx(t.LogoutButton,{signedInUser:u,currentTenant:m,onLogOutClick:$,onCockpitClick:f})})]})},S={titleRectangleWidth:new t.ResponsiveSized(250,500,550,600),subTitleRectangleWidth:new t.ResponsiveSized(343,600,700,800)},G=r.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  height: 100vh;
-  min-width: ${e=>e.isNoStepsPage?"100%":`calc(100% - ${g}px)`};
-  padding-left: ${e=>e.isNoStepsPage?t.Space.sp0:`${g}px`};
-  flex: 1;
-
-  ${e=>e.theme.breakpoints.down("md")} {
-    width: 100%;
-    padding-left: ${t.Space.sp0};
-  }
-`,K=r.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  flex: 1;
-  width: 100%;
-  min-height: 100vh;
-  background-image: ${e=>`url(https://storage.googleapis.com/zeni-apis.appspot.com/images/signin-background-${e.windowSize==="small"?"m":"w"}-${e.theme.mode==="dark"?"d":"l"}.svg)`};
-  background-color: ${e=>e.theme.colors.grey4};
-  background-size: inherit;
-  background-attachment: fixed;
-  background-position: ${e=>e.windowSize==="small"?"center center":"right center"};
-  background-repeat: no-repeat;
-
-  ${e=>e.theme.breakpoints.down("lg")} {
-    background-size: cover;
-  }
-`,Q=r.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: ${t.Space.sp3};
-  margin-top: 94px; // As per Figma Specs - Nav Bar Height + 32 px
-`,b=r.div`
-  border-radius: ${t.Space.sp2};
-  width: 100%;
-  display: flex;
-  box-sizing: border-box;
-  align-items: center;
-  justify-content: center;
-`,X=({isNoStepsPage:e=!1})=>{const o=s.useTheme(),i=t.useWindowSizeContext();return s.jsxRuntimeExports.jsx(G,{isNoStepsPage:e,children:s.jsxRuntimeExports.jsx(K,{windowSize:i,children:s.jsxRuntimeExports.jsxs(Q,{children:[s.jsxRuntimeExports.jsx(b,{children:s.jsxRuntimeExports.jsx(t.RectangularContentLoader,{width:S.titleRectangleWidth.value(i),height:t.sp[6],backgroundColor:o.colors.grey3,style:{borderRadius:t.Space.sp2}})}),s.jsxRuntimeExports.jsx(b,{children:s.jsxRuntimeExports.jsx(t.RectangularContentLoader,{width:S.subTitleRectangleWidth.value(i),height:27,backgroundColor:o.colors.grey3,style:{borderRadius:t.Space.sp2}})})]})})})};exports.CustomerOnboardingDetailPageSkeleton=X;exports.CustomerOnboardingDrawer=V;exports.DRAWER_WIDTH=g;