@frigade/react 1.32.49 → 1.32.50
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/index.d.ts +1 -0
- package/lib/index.js +282 -270
- package/lib/index.js.map +1 -1
- package/lib/index.mjs +286 -274
- package/lib/index.mjs.map +1 -1
- package/package.json +1 -1
package/lib/index.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import{ThemeProvider as Da}from"styled-components";import gt,{useContext as Na,useEffect as wo,useState as Xo}from"react";import{useCallback as dt,useContext as il,useEffect as nl}from"react";import Lo,{useMemo as qs}from"react";var mr="1.32.49 ";var Fe="https://api.frigade.com/v1/public/",Ae="NOT_STARTED_STEP",Y="COMPLETED_FLOW",no="ABORTED_FLOW",pt="STARTED_FLOW",Le="NOT_STARTED_FLOW",Oe="COMPLETED_STEP",so="STARTED_STEP";function $e(){let{publicApiKey:e,userId:t}=Lo.useContext(G);return{config:qs(()=>({headers:{Authorization:`Bearer ${e}`,"Content-Type":"application/json","X-Frigade-SDK-Version":mr,"X-Frigade-SDK-Platform":"React"}}),[e,t])}}var Ks="frigade-last-call-at-",Ys="frigade-last-call-data-";function Tt(){let{shouldGracefullyDegrade:e}=Lo.useContext(G);return async(t,o)=>{if(e)return console.log(`Skipping ${t} call to Frigade due to error`),zt();let i=Ks+t,n=Ys+t;if(window&&window.localStorage&&o&&o.body&&o.method==="POST"){let s=window.localStorage.getItem(i),p=window.localStorage.getItem(n);if(s&&p&&p==o.body){let d=new Date(s);if(new Date().getTime()-d.getTime()<1e3)return zt()}window.localStorage.setItem(i,new Date().toISOString()),window.localStorage.setItem(n,o.body)}let r;try{r=await fetch(t,o)}catch(s){return zt(s)}return r?r.ok?r:zt(r.statusText):zt()}}function zt(e){return e&&console.log("Call to Frigade failed",e),{json:()=>({})}}function Ft(){let{publicApiKey:e,shouldGracefullyDegrade:t}=Lo.useContext(G);function o(){if(t){console.error("Frigade hooks cannot be used when Frigade SDK has failed to initialize");return}e||console.error("Frigade hooks cannot be used outside the scope of FrigadeProvider")}return{verifySDKInitiated:o}}import{useContext as tl,useState as ur}from"react";import{useContext as Js,useEffect as Qs,useState as Zs}from"react";import Rs from"swr";import{useContext as Xs}from"react";function ve(){let{openFlowStates:e,setOpenFlowStates:t,hasActiveFullPageFlow:o,setCompletedFlowsToKeepOpenDuringSession:i,completedFlowsToKeepOpenDuringSession:n}=Xs(G);function r(c,u=!1){return e[c]??u}function s(c,u){t(w=>({...w,[c]:u}))}function p(c){t(u=>{let{[c]:w,...T}=u;return{...T}})}function d(c){n.includes(c)||i(u=>[...u,c])}function a(c){return n.includes(c)}function f(){return Object.values(e).some(c=>c)||o}return{getOpenFlowState:r,setOpenFlowState:s,resetOpenFlowState:p,hasOpenModals:f,setKeepCompletedFlowOpenDuringSession:d,shouldKeepCompletedFlowOpenDuringSession:a}}var el="unknown";function Ie(){let{config:e}=$e(),{publicApiKey:t,userId:o,flows:i,setShouldGracefullyDegrade:n}=Js(G),{resetOpenFlowState:r}=ve(),[s,p]=Zs(!1),d={data:i.map(y=>({flowId:y.id,flowState:Y,lastStepId:null,userId:o,foreignUserId:o,stepStates:{},shouldTrigger:!1}))},a=y=>fetch(y,e).then(C=>{if(C.ok)return C.json();throw new Error("Failed to fetch user flow states")}).catch(C=>(console.log(`Error fetching ${y}: ${C}. Will gracefully degrade and hide Frigade`),n(!0),d)),{data:f,isLoading:c,mutate:u,error:w}=Rs(t&&i&&o?`${Fe}userFlowStates?foreignUserId=${encodeURIComponent(o)}`:null,a,{revalidateIfStale:!0,keepPreviousData:!0,revalidateOnMount:!0,errorRetryInterval:1e4,errorRetryCount:3,onError:()=>d,onLoadingSlow:()=>d}),T=f==null?void 0:f.data;Qs(()=>{!s&&!c&&T&&p(!0)},[T,s,c]);async function S(y){if(T){let C=T.find(m=>m.flowId===y);C&&C.flowState!==Y&&(C.flowState=Y),await u(Promise.resolve({...f,data:T}),{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1})}}async function x(y,C,m){if(T){let h=T.find(F=>F.flowId===y);h&&(h.stepStates[C]=m,h.flowState=pt),await u(Promise.resolve({...f,data:T}),{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1})}}async function E(y,C,m){if(T){let h=T.find(F=>F.flowId===y);h&&(h.lastStepId=C,h.stepStates[C]=m,h.flowState=pt),await u({...f,data:T},{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1})}}async function P(y){if(T){let C=T.find(m=>m.flowId===y);C&&C.flowState!==Le&&(C.flowState=Le,C.lastStepId=el,Object.keys(C.stepStates).forEach(m=>{C.stepStates[m].actionType=Ae,C.stepStates[m].createdAt=new Date().toISOString()}),await u({...f,data:T},{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1}),r(y))}}async function B(y,C){if(T){let m=T.find(h=>h.flowId===y);m&&m.stepStates[C]!==Ae&&(m.stepStates[C]=Ae),await u({...f,data:T},{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1})}}return{userFlowStatesData:T,isLoadingUserFlowStateData:!s,mutateUserFlowState:u,optimisticallyMarkFlowCompleted:S,optimisticallyMarkFlowNotStarted:P,optimisticallyMarkStepCompleted:x,optimisticallyMarkStepNotStarted:B,optimisticallyMarkStepStarted:E,error:w}}function Wt(){let{config:e}=$e(),{userFlowStatesData:t,mutateUserFlowState:o}=Ie(),{failedFlowResponses:i,setFailedFlowResponses:n,flowResponses:r,setFlowResponses:s}=tl(G),[p,d]=ur(new Set),[a,f]=ur(new Set),c=Tt();function u(S){let x=JSON.stringify(S);if(p.has(x))return null;p.add(x),d(p),a.add(S),f(a);let E=r==null?void 0:r.find(P=>P.flowSlug===S.flowSlug&&P.stepId===S.stepId&&P.actionType===S.actionType&&P.createdAt===S.createdAt);return c(`${Fe}flowResponses`,{...e,method:"POST",body:x}).then(P=>{P.status!==200&&P.status!==201?(console.log("Failed to send flow response for step "+S.stepId+". Will retry again later."),n([...i,S])):E||s(B=>[...B??[],S])})}async function w(S){S.foreignUserId&&(S.actionType===pt||S.actionType===Le?await u(S):S.actionType===Y?await u(S):S.actionType===so?await u(S):S.actionType===Oe?await u(S):S.actionType===no?await u(S):S.actionType===Ae&&await u(S))}function T(){let S=[];return t==null||t.forEach(x=>{if(x&&x.stepStates&&Object.keys(x.stepStates).length!==0)for(let E in x.stepStates){let P=x.stepStates[E];S.push({foreignUserId:x.foreignUserId,flowSlug:x.flowId,stepId:P.stepId,actionType:P.actionType,data:{},createdAt:new Date(P.createdAt),blocked:P.blocked,hidden:P.hidden})}}),[...S,...r]}return{addResponse:w,setFlowResponses:s,getFlowResponses:T}}import sl from"swr";var ol=/user.flow\(([^\)]+)\) == '?COMPLETED_FLOW'?/gm,fr=e=>{let t=ol.exec(e);if(t===null)return null;let o=null;return t.forEach((i,n)=>{let r=rl(i,"'","");r.startsWith("flow_")&&(o=r)}),o},rl=function(e,t,o){return e.replace(new RegExp(t,"g"),o)};function X(){let{config:e}=$e(),{flows:t,setFlows:o,userId:i,publicApiKey:n,customVariables:r,setCustomVariables:s,hasActiveFullPageFlow:p,setHasActiveFullPageFlow:d,setFlowResponses:a,setShouldGracefullyDegrade:f}=il(G),c={data:[]},{verifySDKInitiated:u}=Ft(),{addResponse:w,getFlowResponses:T}=Wt(),S=g=>fetch(g,e).then(b=>b.ok?b.json():(console.log(`Error fetching ${g} (${b.status}): ${b.statusText}. .Will gracefully degrade and hide Frigade`),f(!0),c)).catch(b=>(console.log(`Error fetching ${g}: ${b}. Will gracefully degrade and hide Frigade`),f(!0),c)),{userFlowStatesData:x,isLoadingUserFlowStateData:E,optimisticallyMarkFlowCompleted:P,optimisticallyMarkFlowNotStarted:B,optimisticallyMarkStepCompleted:y,optimisticallyMarkStepNotStarted:C,optimisticallyMarkStepStarted:m}=Ie(),{data:h,error:F,isLoading:L}=sl(n?`${Fe}flows`:null,S,{keepPreviousData:!0});nl(()=>{if(F){console.error(F);return}h&&h.data&&(h.data=o(h.data))},[h,F]);function U(g){if(L)return null;let b=t.find(v=>v.slug===g);return!b&&t.length>0&&!E&&!L?(console.log(`Flow with slug ${g} not found`),null):(b==null?void 0:b.active)===!1?null:b}function $(g){var H;if(!U(g))return[];let b=U(g).data;return b?(b=A(b),(((H=JSON.parse(b))==null?void 0:H.data)??[]).map(ce=>{let W=oe(ce);return{handleSecondaryButtonClick:()=>{ce.skippable===!0&&z(g,ce.id,{skipped:!0})},...ce,complete:I(g,ce.id)===Oe||W>=1,blocked:te(g,ce.id),hidden:xe(g,ce.id),handlePrimaryButtonClick:()=>{(!ce.completionCriteria&&(ce.autoMarkCompleted||ce.autoMarkCompleted===void 0)||ce.completionCriteria&&ce.autoMarkCompleted===!0)&&z(g,ce.id)},progress:W}}).filter(ce=>ce.hidden!==!0)):[]}function A(g){return g.replace(/\${(.*?)}/g,(b,v)=>r[v]!==void 0?String(r[v]):"")}function _(g){if(!U(g))return[];let b=U(g).data;return b?(b=A(b),JSON.parse(b)??{}):[]}function N(g,b){s(v=>({...v,[g]:b}))}function M(g){!E&&!L&&g&&JSON.stringify(r)!=JSON.stringify({...r,...g})&&Object.keys(g).forEach(b=>{N(b,g[b])})}let Z=dt(async(g,b,v)=>{u();let H={foreignUserId:i,flowSlug:g,stepId:b,actionType:so,data:v??{},createdAt:new Date,blocked:!1,hidden:!1};ne(H)&&(await m(g,b,H),w(H))},[i,x]),R=dt(async(g,b,v)=>{u();let H={foreignUserId:i,flowSlug:g,stepId:b,actionType:Ae,data:v??{},createdAt:new Date,blocked:!1,hidden:!1};ne(H)&&(await C(g,b),w(H))},[i,x]),z=dt(async(g,b,v)=>{u();let H={foreignUserId:i,flowSlug:g,stepId:b,actionType:Oe,data:v??{},createdAt:new Date,blocked:!1,hidden:!1};ne(H)&&(await y(g,b,H),w(H))},[i,x]),Pe=dt(async(g,b)=>{if(u(),q(g)===Le)return;let v={foreignUserId:i,flowSlug:g,stepId:"unknown",actionType:Le,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};await B(g),ne(v)&&w(v)},[i,x]),ge=dt(async(g,b)=>{u();let v={foreignUserId:i,flowSlug:g,stepId:"unknown",actionType:pt,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};ne(v)&&w(v)},[i,x]),V=dt(async(g,b)=>{u();let v={foreignUserId:i,flowSlug:g,stepId:"unknown",actionType:Y,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};ne(v)&&(await P(g),w(v))},[i,x]),re=dt(async(g,b)=>{u();let v={foreignUserId:i,flowSlug:g,stepId:"unknown",actionType:no,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};ne(v)&&(await P(g),w(v))},[i,x]);function ne(g){var b;if(!x&&g.actionType===Ae)return!1;if(x){let v=x.find(H=>H.flowId===g.flowSlug);if(g.actionType===Ae&&(!(v!=null&&v.stepStates[g.stepId])||v.stepStates[g.stepId].actionType===Ae)||v&&((b=v.stepStates[g.stepId])==null?void 0:b.actionType)===g.actionType||v&&v.flowState===Y&&g.actionType===Y)return!1}return!0}function I(g,b){let v=Ce(g,b);return E?null:v?v.actionType:Ae}function te(g,b){let v=Ce(g,b);return v?v.blocked:!1}function xe(g,b){let v=Ce(g,b);return v?v.hidden:!1}function Ce(g,b){if(E)return null;let v=x==null?void 0:x.find(H=>H.flowId===g);return!v||!v.stepStates[b]?null:v.stepStates[b]??null}function j(g){var v;if(E||!x)return null;if(q(g)===Le)return $(g)[0]??null;let b=(v=x.find(H=>H.flowId===g))==null?void 0:v.lastStepId;return b?$(g).find(H=>H.id===b):null}function de(g){let b=j(g);if(!b)return 0;let v=$(g).findIndex(H=>H.id===b.id)??0;return I(g,b.id)===Oe&&v<$(g).length-1?v+1:v}function oe(g){if(!g.completionCriteria)return;let b=fr(g.completionCriteria);if(b===null)return;let v=je(b),H=Ge(b);return H===0?void 0:v/H}function q(g){let b=x==null?void 0:x.find(v=>v.flowId===g);return b?b.flowState:null}function je(g){let b=$(g);return b.length===0?0:b.filter(H=>I(g,H.id)===Oe).length}function Ge(g){return $(g).length}function K(g){return JSON.parse(t.find(b=>b.slug===g).data)}function Se(g){if(E)return!0;if(g!=null&&g.targetingLogic&&x){let b=x.find(v=>v.flowId===g.slug);if(b)return b.shouldTrigger===!1}return!!(g!=null&&g.targetingLogic&&i&&i.startsWith("guest_"))}function lt(g){return!Se(U(g))}return{getFlow:U,getFlowData:K,isLoading:E||L,getStepStatus:I,getFlowSteps:$,getCurrentStepIndex:de,markStepStarted:Z,markStepCompleted:z,markFlowNotStarted:Pe,markFlowStarted:ge,markFlowCompleted:V,markFlowAborted:re,markStepNotStarted:R,getFlowStatus:q,getNumberOfStepsCompleted:je,getNumberOfSteps:Ge,targetingLogicShouldHideFlow:Se,setCustomVariable:N,updateCustomVariables:M,customVariables:r,getStepOptionalProgress:oe,getFlowMetadata:_,isStepBlocked:te,isStepHidden:xe,hasActiveFullPageFlow:p,setHasActiveFullPageFlow:d,isFlowAvailableToUser:lt}}import{useCallback as gr,useContext as ll,useEffect as al}from"react";var kt="guest_";function Ht(){let{userId:e,organizationId:t,setUserId:o,setUserProperties:i,shouldGracefullyDegrade:n}=ll(G),{config:r}=$e(),{mutateUserFlowState:s}=Ie(),p=Tt(),{verifySDKInitiated:d}=Ft();al(()=>{if(e&&!t){if(e.startsWith(kt))return;let c=`frigade-user-registered-${e}`;localStorage.getItem(c)||(p(`${Fe}users`,{...r,method:"POST",body:JSON.stringify({foreignId:e})}),localStorage.setItem(c,"true"))}},[e,n,t]);let a=gr(async c=>{d();let u={foreignId:e,properties:c};await p(`${Fe}users`,{...r,method:"POST",body:JSON.stringify(u)}),i(w=>({...w,...c})),s()},[e,r,n,s]),f=gr(async(c,u)=>{d();let T={foreignId:e,events:[{event:c,properties:u}]};await p(`${Fe}users`,{...r,method:"POST",body:JSON.stringify(T)}),s()},[e,r,s]);return{userId:e,setUserId:o,addPropertiesToUser:a,trackEventForUser:f}}import{v4 as La}from"uuid";import _e,{useEffect as Ea,useState as Ba}from"react";import De,{useEffect as gl}from"react";import ao from"styled-components";import pl from"react";import dl from"styled-components";var hr="fr-",Vt="cfr-";function l(e,t){let o=`${hr}${e}`;if(!t)return o;if(t.styleOverrides&&t.styleOverrides[e]){if(typeof t.styleOverrides[e]=="string")return o+" "+t.styleOverrides[e];if(typeof t.styleOverrides[e]=="object")return o+" "+Vt+e}return o}function k(e){if(!e.className||e.className.indexOf(Vt)!==-1)return"";let o=e.className.replace(/\s+/g," ").split(" ");return o.length==1&&o[0].startsWith(hr)?"":`:not(${o.map(i=>`.${i}`).join(", ")})`}function Oo(e){return e.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g,"$1-$2").toLowerCase()}function ct(e){return e!=null&&e.styleOverrides?Object.keys(e.styleOverrides).map(t=>`${Oo(t)}: ${e.styleOverrides[t]};`).join(" "):""}function ye(...e){return e.filter(Boolean).join(" ")}function xr(e){return e.charAt(0).toUpperCase()+e.slice(1)}var cl=dl.div`
|
|
2
|
+
import gt,{createContext as Da,useEffect as Ro,useState as Ne}from"react";import{ThemeProvider as $a}from"styled-components";import ft,{useContext as La,useEffect as Fo,useState as Zo}from"react";import{useCallback as pt,useContext as nl,useEffect as sl}from"react";import Do,{useMemo as Ks}from"react";var gr="1.32.50 ";var Te="https://api.frigade.com/v1/public/",Ae="NOT_STARTED_STEP",Y="COMPLETED_FLOW",no="ABORTED_FLOW",at="STARTED_FLOW",Le="NOT_STARTED_FLOW",Oe="COMPLETED_STEP",so="STARTED_STEP";function Me(){let{publicApiKey:e,userId:t}=Do.useContext(q);return{config:Ks(()=>({headers:{Authorization:`Bearer ${e}`,"Content-Type":"application/json","X-Frigade-SDK-Version":gr,"X-Frigade-SDK-Platform":"React"}}),[e,t])}}var Ys="frigade-last-call-at-",Xs="frigade-last-call-data-";function Tt(){let{shouldGracefullyDegrade:e}=Do.useContext(q);return async(t,o)=>{if(e)return console.log(`Skipping ${t} call to Frigade due to error`),zt();let i=Ys+t,n=Xs+t;if(window&&window.localStorage&&o&&o.body&&o.method==="POST"){let s=window.localStorage.getItem(i),p=window.localStorage.getItem(n);if(s&&p&&p==o.body){let d=new Date(s);if(new Date().getTime()-d.getTime()<1e3)return zt()}window.localStorage.setItem(i,new Date().toISOString()),window.localStorage.setItem(n,o.body)}let r;try{r=await fetch(t,o)}catch(s){return zt(s)}return r?r.ok?r:zt(r.statusText):zt()}}function zt(e){return e&&console.log("Call to Frigade failed",e),{json:()=>({})}}function Ft(){let{publicApiKey:e,shouldGracefullyDegrade:t}=Do.useContext(q);function o(){if(t){console.error("Frigade hooks cannot be used when Frigade SDK has failed to initialize");return}e||console.error("Frigade hooks cannot be used outside the scope of FrigadeProvider")}return{verifySDKInitiated:o}}import{useContext as ol,useState as hr}from"react";import{useContext as Qs,useEffect as Zs,useState as Rs}from"react";import el from"swr";import{useContext as Js}from"react";function Pe(){let{openFlowStates:e,setOpenFlowStates:t,hasActiveFullPageFlow:o,setCompletedFlowsToKeepOpenDuringSession:i,completedFlowsToKeepOpenDuringSession:n}=Js(q);function r(c,u=!1){return e[c]??u}function s(c,u){t(w=>({...w,[c]:u}))}function p(c){t(u=>{let{[c]:w,...T}=u;return{...T}})}function d(c){n.includes(c)||i(u=>[...u,c])}function a(c){return n.includes(c)}function f(){return Object.values(e).some(c=>c)||o}return{getOpenFlowState:r,setOpenFlowState:s,resetOpenFlowState:p,hasOpenModals:f,setKeepCompletedFlowOpenDuringSession:d,shouldKeepCompletedFlowOpenDuringSession:a}}var tl="unknown";function Ie(){let{config:e}=Me(),{publicApiKey:t,userId:o,flows:i,setShouldGracefullyDegrade:n}=Qs(q),{resetOpenFlowState:r}=Pe(),[s,p]=Rs(!1),d={data:i.map(y=>({flowId:y.id,flowState:Y,lastStepId:null,userId:o,foreignUserId:o,stepStates:{},shouldTrigger:!1}))},a=y=>fetch(y,e).then(h=>{if(h.ok)return h.json();throw new Error("Failed to fetch user flow states")}).catch(h=>(console.log(`Error fetching ${y}: ${h}. Will gracefully degrade and hide Frigade`),n(!0),d)),{data:f,isLoading:c,mutate:u,error:w}=el(t&&i&&o?`${Te}userFlowStates?foreignUserId=${encodeURIComponent(o)}`:null,a,{revalidateIfStale:!0,keepPreviousData:!0,revalidateOnMount:!0,errorRetryInterval:1e4,errorRetryCount:3,onError:()=>d,onLoadingSlow:()=>d}),T=f==null?void 0:f.data;Zs(()=>{!s&&!c&&T&&p(!0)},[T,s,c]);async function S(y){if(T){let h=T.find(m=>m.flowId===y);h&&h.flowState!==Y&&(h.flowState=Y),await u(Promise.resolve({...f,data:T}),{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1})}}async function C(y,h,m){if(T){let x=T.find(F=>F.flowId===y);x&&(x.stepStates[h]=m,x.flowState=at),await u(Promise.resolve({...f,data:T}),{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1})}}async function P(y,h,m){if(T){let x=T.find(F=>F.flowId===y);x&&(x.lastStepId=h,x.stepStates[h]=m,x.flowState=at),await u({...f,data:T},{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1})}}async function v(y){if(T){let h=T.find(m=>m.flowId===y);h&&h.flowState!==Le&&(h.flowState=Le,h.lastStepId=tl,Object.keys(h.stepStates).forEach(m=>{h.stepStates[m].actionType=Ae,h.stepStates[m].createdAt=new Date().toISOString()}),await u({...f,data:T},{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1}),r(y))}}async function B(y,h){if(T){let m=T.find(x=>x.flowId===y);m&&m.stepStates[h]!==Ae&&(m.stepStates[h]=Ae),await u({...f,data:T},{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1})}}return{userFlowStatesData:T,isLoadingUserFlowStateData:!s,mutateUserFlowState:u,optimisticallyMarkFlowCompleted:S,optimisticallyMarkFlowNotStarted:v,optimisticallyMarkStepCompleted:C,optimisticallyMarkStepNotStarted:B,optimisticallyMarkStepStarted:P,error:w}}function Wt(){let{config:e}=Me(),{userFlowStatesData:t,mutateUserFlowState:o}=Ie(),{failedFlowResponses:i,setFailedFlowResponses:n,flowResponses:r,setFlowResponses:s}=ol(q),[p,d]=hr(new Set),[a,f]=hr(new Set),c=Tt();function u(S){let C=JSON.stringify(S);if(p.has(C))return null;p.add(C),d(p),a.add(S),f(a);let P=r==null?void 0:r.find(v=>v.flowSlug===S.flowSlug&&v.stepId===S.stepId&&v.actionType===S.actionType&&v.createdAt===S.createdAt);return c(`${Te}flowResponses`,{...e,method:"POST",body:C}).then(v=>{v.status!==200&&v.status!==201?(console.log("Failed to send flow response for step "+S.stepId+". Will retry again later."),n([...i,S])):P||s(B=>[...B??[],S])})}async function w(S){S.foreignUserId&&(S.actionType===at||S.actionType===Le?await u(S):S.actionType===Y?await u(S):S.actionType===so?await u(S):S.actionType===Oe?await u(S):S.actionType===no?await u(S):S.actionType===Ae&&await u(S))}function T(){let S=[];return t==null||t.forEach(C=>{if(C&&C.stepStates&&Object.keys(C.stepStates).length!==0)for(let P in C.stepStates){let v=C.stepStates[P];S.push({foreignUserId:C.foreignUserId,flowSlug:C.flowId,stepId:v.stepId,actionType:v.actionType,data:{},createdAt:new Date(v.createdAt),blocked:v.blocked,hidden:v.hidden})}}),[...S,...r]}return{addResponse:w,setFlowResponses:s,getFlowResponses:T}}import ll from"swr";var rl=/user.flow\(([^\)]+)\) == '?COMPLETED_FLOW'?/gm,xr=e=>{let t=rl.exec(e);if(t===null)return null;let o=null;return t.forEach((i,n)=>{let r=il(i,"'","");r.startsWith("flow_")&&(o=r)}),o},il=function(e,t,o){return e.replace(new RegExp(t,"g"),o)};function X(){let{config:e}=Me(),{flows:t,setFlows:o,userId:i,publicApiKey:n,customVariables:r,setCustomVariables:s,hasActiveFullPageFlow:p,setHasActiveFullPageFlow:d,setFlowResponses:a,setShouldGracefullyDegrade:f}=nl(q),c={data:[]},{verifySDKInitiated:u}=Ft(),{addResponse:w,getFlowResponses:T}=Wt(),S=g=>fetch(g,e).then(b=>b.ok?b.json():(console.log(`Error fetching ${g} (${b.status}): ${b.statusText}. .Will gracefully degrade and hide Frigade`),f(!0),c)).catch(b=>(console.log(`Error fetching ${g}: ${b}. Will gracefully degrade and hide Frigade`),f(!0),c)),{userFlowStatesData:C,isLoadingUserFlowStateData:P,optimisticallyMarkFlowCompleted:v,optimisticallyMarkFlowNotStarted:B,optimisticallyMarkStepCompleted:y,optimisticallyMarkStepNotStarted:h,optimisticallyMarkStepStarted:m}=Ie(),{data:x,error:F,isLoading:O}=ll(n?`${Te}flows`:null,S,{keepPreviousData:!0});sl(()=>{if(F){console.error(F);return}x&&x.data&&(x.data=o(x.data))},[x,F]);function _(g){if(O)return null;let b=t.find(E=>E.slug===g);return!b&&t.length>0&&!P&&!O?(console.log(`Flow with slug ${g} not found`),null):(b==null?void 0:b.active)===!1?null:b}function z(g){var V;if(!_(g))return[];let b=_(g).data;return b?(b=A(b),(((V=JSON.parse(b))==null?void 0:V.data)??[]).map(de=>{let W=R(de);return{handleSecondaryButtonClick:()=>{de.skippable===!0&&L(g,de.id,{skipped:!0})},...de,complete:I(g,de.id)===Oe||W>=1,blocked:ne(g,de.id),hidden:fe(g,de.id),handlePrimaryButtonClick:()=>{(!de.completionCriteria&&(de.autoMarkCompleted||de.autoMarkCompleted===void 0)||de.completionCriteria&&de.autoMarkCompleted===!0)&&L(g,de.id)},progress:W}}).filter(de=>de.hidden!==!0)):[]}function A(g){return g.replace(/\${(.*?)}/g,(b,E)=>r[E]!==void 0?String(r[E]):"")}function U(g){if(!_(g))return[];let b=_(g).data;return b?(b=A(b),JSON.parse(b)??{}):[]}function $(g,b){s(E=>({...E,[g]:b}))}function N(g){!P&&!O&&g&&JSON.stringify(r)!=JSON.stringify({...r,...g})&&Object.keys(g).forEach(b=>{$(b,g[b])})}let ie=pt(async(g,b,E)=>{u();let V={foreignUserId:i,flowSlug:g,stepId:b,actionType:so,data:E??{},createdAt:new Date,blocked:!1,hidden:!1};oe(V)&&(await m(g,b,V),w(V))},[i,C]),pe=pt(async(g,b,E)=>{u();let V={foreignUserId:i,flowSlug:g,stepId:b,actionType:Ae,data:E??{},createdAt:new Date,blocked:!1,hidden:!1};oe(V)&&(await h(g,b),w(V))},[i,C]),L=pt(async(g,b,E)=>{u();let V={foreignUserId:i,flowSlug:g,stepId:b,actionType:Oe,data:E??{},createdAt:new Date,blocked:!1,hidden:!1};oe(V)&&(await y(g,b,V),w(V))},[i,C]),we=pt(async(g,b)=>{if(u(),K(g)===Le)return;let E={foreignUserId:i,flowSlug:g,stepId:"unknown",actionType:Le,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};await B(g),oe(E)&&w(E)},[i,C]),xe=pt(async(g,b)=>{u();let E={foreignUserId:i,flowSlug:g,stepId:"unknown",actionType:at,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};oe(E)&&w(E)},[i,C]),ee=pt(async(g,b)=>{u();let E={foreignUserId:i,flowSlug:g,stepId:"unknown",actionType:Y,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};oe(E)&&(await v(g),w(E))},[i,C]),j=pt(async(g,b)=>{u();let E={foreignUserId:i,flowSlug:g,stepId:"unknown",actionType:no,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};oe(E)&&(await v(g),w(E))},[i,C]);function oe(g){var b;if(!C&&g.actionType===Ae)return!1;if(C){let E=C.find(V=>V.flowId===g.flowSlug);if(g.actionType===Ae&&(!(E!=null&&E.stepStates[g.stepId])||E.stepStates[g.stepId].actionType===Ae)||E&&((b=E.stepStates[g.stepId])==null?void 0:b.actionType)===g.actionType||E&&E.flowState===Y&&g.actionType===Y)return!1}return!0}function I(g,b){let E=ke(g,b);return P?null:E?E.actionType:Ae}function ne(g,b){let E=ke(g,b);return E?E.blocked:!1}function fe(g,b){let E=ke(g,b);return E?E.hidden:!1}function ke(g,b){if(P)return null;let E=C==null?void 0:C.find(V=>V.flowId===g);return!E||!E.stepStates[b]?null:E.stepStates[b]??null}function G(g){var E;if(P||!C)return null;if(K(g)===Le)return z(g)[0]??null;let b=(E=C.find(V=>V.flowId===g))==null?void 0:E.lastStepId;return b?z(g).find(V=>V.id===b):null}function ge(g){let b=G(g);if(!b)return 0;let E=z(g).findIndex(V=>V.id===b.id)??0;return I(g,b.id)===Oe&&E<z(g).length-1?E+1:E}function R(g){if(!g.completionCriteria)return;let b=xr(g.completionCriteria);if(b===null)return;let E=je(b),V=Ge(b);return V===0?void 0:E/V}function K(g){let b=C==null?void 0:C.find(E=>E.flowId===g);return b?b.flowState:null}function je(g){let b=z(g);return b.length===0?0:b.filter(V=>I(g,V.id)===Oe).length}function Ge(g){return z(g).length}function wt(g){return JSON.parse(t.find(b=>b.slug===g).data)}function H(g){if(P)return!0;if(g!=null&&g.targetingLogic&&C){let b=C.find(E=>E.flowId===g.slug);if(b)return b.shouldTrigger===!1}return!!(g!=null&&g.targetingLogic&&i&&i.startsWith("guest_"))}function Be(g){return!H(_(g))}return{getFlow:_,getFlowData:wt,isLoading:P||O,getStepStatus:I,getFlowSteps:z,getCurrentStepIndex:ge,markStepStarted:ie,markStepCompleted:L,markFlowNotStarted:we,markFlowStarted:xe,markFlowCompleted:ee,markFlowAborted:j,markStepNotStarted:pe,getFlowStatus:K,getNumberOfStepsCompleted:je,getNumberOfSteps:Ge,targetingLogicShouldHideFlow:H,setCustomVariable:$,updateCustomVariables:N,customVariables:r,getStepOptionalProgress:R,getFlowMetadata:U,isStepBlocked:ne,isStepHidden:fe,hasActiveFullPageFlow:p,setHasActiveFullPageFlow:d,isFlowAvailableToUser:Be}}import{useCallback as Cr,useContext as al,useEffect as pl}from"react";var kt="guest_";function Ht(){let{userId:e,organizationId:t,setUserId:o,setUserProperties:i,shouldGracefullyDegrade:n}=al(q),{config:r}=Me(),{mutateUserFlowState:s}=Ie(),p=Tt(),{verifySDKInitiated:d}=Ft();pl(()=>{if(e&&!t){if(e.startsWith(kt))return;let c=`frigade-user-registered-${e}`;localStorage.getItem(c)||(p(`${Te}users`,{...r,method:"POST",body:JSON.stringify({foreignId:e})}),localStorage.setItem(c,"true"))}},[e,n,t]);let a=Cr(async c=>{d();let u={foreignId:e,properties:c};await p(`${Te}users`,{...r,method:"POST",body:JSON.stringify(u)}),i(w=>({...w,...c})),s()},[e,r,n,s]),f=Cr(async(c,u)=>{d();let T={foreignId:e,events:[{event:c,properties:u}]};await p(`${Te}users`,{...r,method:"POST",body:JSON.stringify(T)}),s()},[e,r,s]);return{userId:e,setUserId:o,addPropertiesToUser:a,trackEventForUser:f}}import{v4 as Oa}from"uuid";import _e,{useEffect as Ba,useState as Aa}from"react";import De,{useEffect as hl}from"react";import co from"styled-components";import dl from"react";import cl from"styled-components";var Sr="fr-",Vt="cfr-";function l(e,t){let o=`${Sr}${e}`;if(!t)return o;if(t.styleOverrides&&t.styleOverrides[e]){if(typeof t.styleOverrides[e]=="string")return o+" "+t.styleOverrides[e];if(typeof t.styleOverrides[e]=="object")return o+" "+Vt+e}return o}function k(e){if(!e.className||e.className.indexOf(Vt)!==-1)return"";let o=e.className.replace(/\s+/g," ").split(" ");return o.length==1&&o[0].startsWith(Sr)?"":`:not(${o.map(i=>`.${i}`).join(", ")})`}function $o(e){return e.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g,"$1-$2").toLowerCase()}function dt(e){return e!=null&&e.styleOverrides?Object.keys(e.styleOverrides).map(t=>`${$o(t)}: ${e.styleOverrides[t]};`).join(" "):""}function Ce(...e){return e.filter(Boolean).join(" ")}function yr(e){return e.charAt(0).toUpperCase()+e.slice(1)}var ml=cl.div`
|
|
3
3
|
display: flex;
|
|
4
4
|
justify-content: center;
|
|
5
5
|
position: fixed;
|
|
@@ -23,11 +23,88 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
23
23
|
opacity: 1;
|
|
24
24
|
}
|
|
25
25
|
}
|
|
26
|
-
`,
|
|
26
|
+
`,br=({onClose:e,appearance:t})=>dl.createElement(ml,{className:l("modalBackground",t),onClick:()=>e()});import lo from"react";import ul from"styled-components";var fl=ul.div`
|
|
27
27
|
:hover {
|
|
28
28
|
opacity: 0.8;
|
|
29
29
|
}
|
|
30
|
-
`,
|
|
30
|
+
`,ve=()=>lo.createElement(fl,null,lo.createElement("svg",{width:"12",height:"12",viewBox:"0 0 14 14",fill:"none",xmlns:"http://www.w3.org/2000/svg"},lo.createElement("rect",{y:"1.39844",width:"1.97669",height:"17.8213",rx:"0.988346",transform:"rotate(-45 0 1.39844)",fill:"currentColor"}),lo.createElement("rect",{x:"12.6023",width:"1.97669",height:"17.8213",rx:"0.988346",transform:"rotate(45 12.6023 0)",fill:"currentColor"})));import{Portal as xl}from"react-portal";import Lr from"react";import Mo from"react";function gl({style:e,className:t}){return Mo.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"54",height:"14",fill:"none",viewBox:"0 0 54 14",style:e,className:t},Mo.createElement("path",{fill:"currentColor",d:"M16.293 3.476v1.036h1.593v1.256h-1.593v5.098h-1.41V5.768H14V4.512h.883V3.244c0-.67.294-1.744 1.777-1.744.515 0 .969.049 1.361.146l-.233 1.232a5.939 5.939 0 00-.833-.073c-.442 0-.662.22-.662.67zm6.534.975V5.83c-.846 0-1.63.159-2.342.476v4.56h-1.41V4.513h1.263l.086.61c.846-.451 1.655-.67 2.403-.67zm2.505-.951c-.331.33-.944.33-1.287 0a.93.93 0 01-.246-.659c0-.268.086-.487.246-.646.343-.33.956-.33 1.287 0 .343.33.343.964 0 1.305zm.061 7.366h-1.41V4.512h1.41v6.354zm6.928-5.756c.246.146.368.402.368.756v4.976c0 1.804-.858 2.658-2.672 2.658-.92 0-1.753-.146-2.514-.439l.417-1.073c.674.22 1.336.33 1.974.33.98 0 1.385-.379 1.385-1.403v-.171c-.588.134-1.09.207-1.52.207-.907 0-1.655-.305-2.231-.902-.576-.598-.87-1.39-.87-2.354 0-.963.294-1.756.87-2.354.576-.61 1.324-.914 2.231-.914 1.005 0 1.864.232 2.562.683zm-2.488 4.634a5.15 5.15 0 001.446-.22V5.951a3.695 3.695 0 00-1.446-.292c-1.08 0-1.778.841-1.778 2.048 0 1.22.699 2.037 1.778 2.037zm7.34-5.317c1.52 0 2.28.878 2.28 2.634v3.805h-1.275l-.073-.524c-.601.414-1.288.621-2.084.621-1.263 0-2.06-.658-2.06-1.731 0-1.269 1.25-2.025 3.408-2.025.135 0 .503.013.662.013v-.171c0-1.012-.343-1.451-1.115-1.451-.675 0-1.435.158-2.256.475l-.466-1.012c1.017-.427 2.01-.634 2.979-.634zm-1.839 4.756c0 .427.343.695 1.017.695.528 0 1.251-.22 1.68-.512V8.22h-.441c-1.508 0-2.256.317-2.256.963zm9.953-4.549v-2.83h1.41v7.72c0 .354-.123.598-.368.757-.71.45-1.57.67-2.562.67-.907 0-1.655-.305-2.231-.902-.577-.61-.87-1.39-.87-2.354 0-.963.293-1.756.87-2.354.576-.61 1.324-.914 2.23-.914.43 0 .933.073 1.521.207zM43.84 9.72c.503 0 .981-.098 1.447-.293V5.854a5.15 5.15 0 00-1.447-.22c-1.078 0-1.777.817-1.777 2.037s.699 2.049 1.777 2.049zM54 7.866v.439h-4.573c.184.963.858 1.512 1.827 1.512.613 0 1.275-.146 1.986-.451l.466 1.024c-.87.378-1.729.573-2.575.573-.931 0-1.692-.304-2.268-.902-.576-.61-.87-1.402-.87-2.366 0-.975.294-1.768.87-2.366.576-.597 1.324-.902 2.244-.902.968 0 1.691.33 2.17.975.478.647.723 1.464.723 2.464zm-4.61-.586h3.298c-.086-1.073-.613-1.731-1.581-1.731-.969 0-1.582.695-1.717 1.731z"}),Mo.createElement("path",{fill:"currentColor",fillRule:"evenodd",d:"M1.196 1.229A4.009 4.009 0 014.08 0l4.092.027C9.183.027 10 .867 10 1.904c0 .6-.273 1.133-.7 1.478-.31.25-.7.399-1.126.4h-.001l-4.09-.027h-.002a4.804 4.804 0 00-2.614.77A4.986 4.986 0 000 5.974v-1.78C0 3.036.456 1.988 1.196 1.23zm4.525 4.65a4.282 4.282 0 00-1.184 2.513l3.637.023c.131 0 .259-.015.382-.042h.002c.81-.178 1.42-.908 1.44-1.788v-.046a1.9 1.9 0 00-.533-1.328 1.813 1.813 0 00-.908-.508h-.002l-.002-.001a1.68 1.68 0 00-.366-.042A4.084 4.084 0 005.72 5.88zm-4.525-.016A4.235 4.235 0 000 8.829C0 10.997 1.601 12.78 3.654 13V9.265h-.005l.005-.439v-.437h.023a5.175 5.175 0 011.439-3.13 5.05 5.05 0 01.72-.614l-1.754-.011H4.08c-.787 0-1.521.229-2.144.625a4.11 4.11 0 00-.74.603z",clipRule:"evenodd"}))}var wr=gl;import Uo from"styled-components";import Re from"styled-components";var ao=Re.div`
|
|
31
|
+
${e=>k(e)} {
|
|
32
|
+
background: ${e=>e.appearance.theme.colorBackground};
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
box-shadow: 0px 6px 25px rgba(0, 0, 0, 0.06);
|
|
36
|
+
border-radius: ${e=>e.appearance.theme.borderRadius}px;
|
|
37
|
+
max-width: ${e=>e.maxWidth}px;
|
|
38
|
+
min-width: 300px;
|
|
39
|
+
padding: 22px 22px 12px;
|
|
40
|
+
z-index: ${e=>e.zIndex};
|
|
41
|
+
`,Tr=Re.div`
|
|
42
|
+
display: block;
|
|
43
|
+
cursor: pointer;
|
|
44
|
+
position: absolute;
|
|
45
|
+
top: 25px;
|
|
46
|
+
right: 22px;
|
|
47
|
+
`,Fr=Re.img`
|
|
48
|
+
${e=>k(e)} {
|
|
49
|
+
display: block;
|
|
50
|
+
width: 100%;
|
|
51
|
+
height: auto;
|
|
52
|
+
min-height: 200px;
|
|
53
|
+
margin-top: ${e=>e.dismissible?"24px":"0px"};
|
|
54
|
+
margin-bottom: 16px;
|
|
55
|
+
}
|
|
56
|
+
`,kr=Re.div`
|
|
57
|
+
${e=>k(e)} {
|
|
58
|
+
display: block;
|
|
59
|
+
width: 100%;
|
|
60
|
+
height: auto;
|
|
61
|
+
min-height: 200px;
|
|
62
|
+
margin-top: ${e=>e.dismissible?"24px":"0px"};
|
|
63
|
+
margin-bottom: 16px;
|
|
64
|
+
}
|
|
65
|
+
`,Pr=Re.div`
|
|
66
|
+
display: flex;
|
|
67
|
+
flex-direction: row;
|
|
68
|
+
justify-content: space-between;
|
|
69
|
+
align-content: center;
|
|
70
|
+
`,vr=Re.div`
|
|
71
|
+
display: flex;
|
|
72
|
+
flex: 1;
|
|
73
|
+
flex-direction: column;
|
|
74
|
+
justify-content: center;
|
|
75
|
+
`,Er=Re.div`
|
|
76
|
+
display: flex;
|
|
77
|
+
flex: 2;
|
|
78
|
+
flex-shrink: 1;
|
|
79
|
+
gap: 8px;
|
|
80
|
+
height: 64px;
|
|
81
|
+
${e=>k(e)} {
|
|
82
|
+
flex-direction: row;
|
|
83
|
+
justify-content: ${e=>e.showStepCount?"flex-end":"flex-start"};
|
|
84
|
+
align-content: center;
|
|
85
|
+
align-items: center;
|
|
86
|
+
}
|
|
87
|
+
`,Br=Re.p`
|
|
88
|
+
${e=>k(e)} {
|
|
89
|
+
font-style: normal;
|
|
90
|
+
font-weight: 600;
|
|
91
|
+
font-size: 15px;
|
|
92
|
+
line-height: 22px;
|
|
93
|
+
color: #808080;
|
|
94
|
+
}
|
|
95
|
+
margin: 0;
|
|
96
|
+
`;var Ar=Uo.div`
|
|
97
|
+
background-color: ${e=>{var t;return(t=e.appearance)==null?void 0:t.theme.colorBackground}};
|
|
98
|
+
position: absolute;
|
|
99
|
+
bottom: -47px;
|
|
100
|
+
left: 0;
|
|
101
|
+
width: 100%;
|
|
102
|
+
height: 40px;
|
|
103
|
+
display: inline-flex;
|
|
104
|
+
align-items: center;
|
|
105
|
+
justify-content: center;
|
|
106
|
+
border-radius: ${e=>{var t;return(t=e.appearance)==null?void 0:t.theme.borderRadius}}px;
|
|
107
|
+
`,Ir=Uo(ao)`
|
|
31
108
|
background-color: ${e=>{var t;return(t=e.appearance)==null?void 0:t.theme.colorBackground}};
|
|
32
109
|
position: absolute;
|
|
33
110
|
bottom: -47px;
|
|
@@ -38,7 +115,8 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
38
115
|
align-items: center;
|
|
39
116
|
justify-content: center;
|
|
40
117
|
border-radius: ${e=>{var t;return(t=e.appearance)==null?void 0:t.theme.borderRadius}}px;
|
|
41
|
-
|
|
118
|
+
padding: 0;
|
|
119
|
+
`,Nr=Uo.div`
|
|
42
120
|
display: flex;
|
|
43
121
|
justify-content: center;
|
|
44
122
|
align-items: center;
|
|
@@ -47,7 +125,7 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
47
125
|
font-size: 12px;
|
|
48
126
|
line-height: 18px;
|
|
49
127
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextSecondary}};
|
|
50
|
-
`;function
|
|
128
|
+
`;function po({appearance:e}){return Lr.createElement(Nr,{className:l("poweredByFrigadeContainer",e),appearance:e},"Powered by \xA0",Lr.createElement(wr,null))}var Cl=co.div`
|
|
51
129
|
${e=>k(e)} {
|
|
52
130
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
53
131
|
background-color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBackground}};
|
|
@@ -62,7 +140,7 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
62
140
|
width: ${e=>e.width??"1000px"};
|
|
63
141
|
z-index: 1500;
|
|
64
142
|
border-radius: ${e=>{var t,o;return((o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.borderRadius)??8}}px;
|
|
65
|
-
${e=>
|
|
143
|
+
${e=>dt(e)}
|
|
66
144
|
}
|
|
67
145
|
|
|
68
146
|
padding: 32px;
|
|
@@ -89,10 +167,10 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
89
167
|
opacity: 1;
|
|
90
168
|
}
|
|
91
169
|
}
|
|
92
|
-
`,
|
|
170
|
+
`,Sl=co.div`
|
|
93
171
|
position: relative;
|
|
94
172
|
flex: 0 1 auto;
|
|
95
|
-
`,
|
|
173
|
+
`,yl=co.div`
|
|
96
174
|
position: absolute;
|
|
97
175
|
top: 24px;
|
|
98
176
|
right: 24px;
|
|
@@ -102,14 +180,14 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
102
180
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
103
181
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
104
182
|
}
|
|
105
|
-
`,
|
|
183
|
+
`,bl=co.div`
|
|
106
184
|
overflow: scroll;
|
|
107
185
|
flex: 1 1;
|
|
108
186
|
display: flex;
|
|
109
187
|
::-webkit-scrollbar {
|
|
110
188
|
display: none;
|
|
111
189
|
}
|
|
112
|
-
`,
|
|
190
|
+
`,et=({onClose:e,visible:t,headerContent:o=null,style:i=null,children:n,appearance:r,dismissible:s=!0,showFrigadeBranding:p=!1})=>(hl(()=>{let d=a=>{a.key==="Escape"&&e()};return document.addEventListener("keydown",d),t?document.body.style.overflow="hidden":document.body.style.overflow="unset",()=>{document.body.style.overflow="unset",document.removeEventListener("keydown",d)}},[e,t]),t?De.createElement(xl,null,De.createElement(br,{appearance:r,onClose:()=>{s&&e()}}),De.createElement(Cl,{appearance:r,className:l("modalContainer",r),styleOverrides:i},s&&De.createElement(yl,{className:l("modalClose",r),onClick:()=>e(),appearance:r},De.createElement(ve,null)),o&&De.createElement(Sl,null,o),De.createElement(bl,null,n),p&&De.createElement(Ar,{appearance:r,className:l("poweredByFrigadeRibbon",r)},De.createElement(po,{appearance:r})))):De.createElement(De.Fragment,null));import tt,{useEffect as wl}from"react";import mo from"styled-components";import{Portal as Tl}from"react-portal";var Fl=mo.div`
|
|
113
191
|
${e=>k(e)} {
|
|
114
192
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
115
193
|
background: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBackground}};
|
|
@@ -127,10 +205,10 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
127
205
|
bottom: 0;
|
|
128
206
|
margin-right: 28px;
|
|
129
207
|
margin-bottom: 28px;
|
|
130
|
-
`,
|
|
208
|
+
`,kl=mo.div`
|
|
131
209
|
position: relative;
|
|
132
210
|
flex: 1;
|
|
133
|
-
`,
|
|
211
|
+
`,Pl=mo.div`
|
|
134
212
|
position: absolute;
|
|
135
213
|
top: 24px;
|
|
136
214
|
right: 24px;
|
|
@@ -140,13 +218,13 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
140
218
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
141
219
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
142
220
|
}
|
|
143
|
-
`,
|
|
221
|
+
`,vl=mo.div`
|
|
144
222
|
overflow: scroll;
|
|
145
223
|
flex: 5;
|
|
146
224
|
::-webkit-scrollbar {
|
|
147
225
|
display: none;
|
|
148
226
|
}
|
|
149
|
-
`,
|
|
227
|
+
`,Or=({onClose:e,visible:t,headerContent:o=null,children:i,appearance:n})=>(wl(()=>{let r=s=>{s.key==="Escape"&&e()};return document.addEventListener("keydown",r),t?document.body.style.overflow="hidden":document.body.style.overflow="unset",()=>{document.body.style.overflow="unset",document.removeEventListener("keydown",r)}},[e,t]),t?tt.createElement(Tl,null,tt.createElement(Fl,{appearance:n,className:l("cornerModalContainer",n)},tt.createElement(Pl,{className:l("cornerModalClose",n),onClick:()=>e()},tt.createElement(ve,null)),o&&tt.createElement(kl,null,o),tt.createElement(vl,null,i))):tt.createElement(tt.Fragment,null));import{useContext as El}from"react";function J(){let{defaultAppearance:e}=El(q);function t(o){let i=JSON.parse(JSON.stringify(e));return o?{styleOverrides:Object.assign(i.styleOverrides??{},o.styleOverrides??{}),theme:Object.assign(i.theme,o.theme??{})}:i}return{mergeAppearanceWithDefault:t}}import jt,{useEffect as _l,useState as jo}from"react";import Go from"styled-components";import go,{useEffect as Bl,useState as zr}from"react";import Wo from"styled-components";import uo from"styled-components";var Dr=uo.label`
|
|
150
228
|
${e=>k(e)} {
|
|
151
229
|
font-size: 14px;
|
|
152
230
|
line-height: 20px;
|
|
@@ -154,14 +232,14 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
154
232
|
margin-top: 10px;
|
|
155
233
|
}
|
|
156
234
|
display: flex;
|
|
157
|
-
|
|
235
|
+
`,$r=uo.label`
|
|
158
236
|
${e=>k(e)} {
|
|
159
237
|
font-size: 12px;
|
|
160
238
|
line-height: 20px;
|
|
161
239
|
margin-bottom: 5px;
|
|
162
240
|
}
|
|
163
241
|
display: flex;
|
|
164
|
-
`,
|
|
242
|
+
`,Mr=uo.span`
|
|
165
243
|
font-weight: 400;
|
|
166
244
|
font-size: 14px;
|
|
167
245
|
line-height: 22px;
|
|
@@ -169,16 +247,16 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
169
247
|
display: flex;
|
|
170
248
|
margin-right: 5px;
|
|
171
249
|
margin-top: 10px;
|
|
172
|
-
`,
|
|
250
|
+
`,fo=uo.div`
|
|
173
251
|
display: flex;
|
|
174
252
|
align-items: flex-start;
|
|
175
253
|
justify-content: left;
|
|
176
254
|
margin-bottom: 10px;
|
|
177
|
-
`;import
|
|
255
|
+
`;import _o from"react";var qe={theme:{colorPrimary:"#000000",colorText:"#000000",colorBackground:"#ffffff",colorBackgroundSecondary:"#d2d2d2",colorTextOnPrimaryBackground:"#ffffff",colorTextSecondary:"#505050",colorTextDisabled:"#999999",colorBorder:"#E5E5E5",colorTextError:"#c00000",borderRadius:20}};function ot({title:e,required:t,appearance:o=qe}){return _o.createElement(fo,null,t?_o.createElement(Mr,{className:l("formLabelRequired",o),appearance:o},"*"):null,_o.createElement(Dr,{className:l("formLabel",o)},e))}import Ur from"react";function Pt({title:e,appearance:t}){return e?Ur.createElement(fo,null,Ur.createElement($r,{className:l("formSubLabel",t)},e)):null}import{z as zo}from"zod";function _r(e,t){try{if(t){if(t.type=="number"){let o=zo.number();if(t.props)for(let i of t.props)i.requirement=="min"?o=o.min(Number(i.value),i.message??"Value is too small"):i.requirement=="max"?o=o.max(Number(i.value),i.message??"Value is too large"):i.requirement=="positive"?o=o.positive(i.message??"Value must be positive"):i.requirement=="negative"&&(o=o.nonpositive(i.message??"Value must be negative"));o.parse(Number(e))}if(t.type=="string"){let o=zo.string();if(t.props)for(let i of t.props)i.requirement=="min"?o=o.min(Number(i.value),i.message??"Value is too short"):i.requirement=="max"?o=o.max(Number(i.value),i.message??"Value is too long"):i.requirement=="regex"&&(o=o.regex(new RegExp(String(i.value)),i.message??"Value does not match requirements"));o.parse(e)}return}}catch(o){if(o instanceof zo.ZodError)return o.issues&&o.issues.length>0?o.issues[0].message:null;console.error("Frigade Form validation failed for rule ",t,o)}return null}var Al=Wo.div`
|
|
178
256
|
display: flex;
|
|
179
257
|
flex-direction: column;
|
|
180
258
|
width: 100%;
|
|
181
|
-
`,
|
|
259
|
+
`,Ho=Wo.input`
|
|
182
260
|
${e=>k(e)} {
|
|
183
261
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
184
262
|
border: 1px solid ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBorder}};
|
|
@@ -194,7 +272,7 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
194
272
|
box-sizing: border-box;
|
|
195
273
|
padding: 0 10px;
|
|
196
274
|
margin-bottom: 10px;
|
|
197
|
-
`,
|
|
275
|
+
`,Il=Wo.textarea`
|
|
198
276
|
${e=>k(e)} {
|
|
199
277
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
200
278
|
border: 1px solid ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBorder}};
|
|
@@ -210,13 +288,13 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
210
288
|
min-height: 70px;
|
|
211
289
|
box-sizing: border-box;
|
|
212
290
|
margin-bottom: 10px;
|
|
213
|
-
`;function
|
|
291
|
+
`;function Vo({formInput:e,customFormTypeProps:t,onSaveInputData:o,setFormValidationErrors:i,inputData:n}){let r=e,[s,p]=zr((n==null?void 0:n.text)||""),[d,a]=zr(!1),f=Ho;Bl(()=>{s===""&&!d&&(a(!0),c(""))},[]);function c(w){if(p(w),o({text:w}),r.required===!0&&w.trim()===""){i([{id:r.id,message:`${r.title} is required`}]);return}let T=_r(w,r.validation);if(T){i([{id:r.id,message:T}]);return}i([])}r.multiline&&(f=Il);function u(){var w;switch((w=r==null?void 0:r.validation)==null?void 0:w.type){case"email":return"email";case"number":return"number";case"password":return"password"}return null}return go.createElement(Al,null,go.createElement(ot,{title:r.title,required:r.required,appearance:t.appearance}),go.createElement(f,{className:l("inputComponent",t.appearance),value:s,onChange:w=>{c(w.target.value)},appearance:t.appearance,placeholder:r.placeholder,type:u()}),go.createElement(Pt,{title:r.subtitle,appearance:t.appearance}))}import Ue,{useEffect as Wr,useState as Hr}from"react";import Vr from"styled-components";var Nl=Vr.div`
|
|
214
292
|
display: flex;
|
|
215
293
|
flex-direction: column;
|
|
216
294
|
width: 100%;
|
|
217
295
|
-webkit-appearance: none;
|
|
218
296
|
appearance: none;
|
|
219
|
-
`,
|
|
297
|
+
`,Ll=Vr.select`
|
|
220
298
|
${e=>k(e)} {
|
|
221
299
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
222
300
|
border: 1px solid ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBorder}};
|
|
@@ -240,13 +318,13 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
240
318
|
background-repeat: no-repeat;
|
|
241
319
|
background-size: 1.5em 1.5em;
|
|
242
320
|
-webkit-print-color-adjust: exact;
|
|
243
|
-
`,
|
|
321
|
+
`,ho="null";function jr({formInput:e,customFormTypeProps:t,onSaveInputData:o,inputData:i,setFormValidationErrors:n}){var f,c,u,w,T,S;let r=e,[s,p]=Hr(((f=i==null?void 0:i.choice)==null?void 0:f[0])||""),[d,a]=Hr(!1);return Wr(()=>{var C,P,v,B;if(s===""&&!d){if(a(!0),r.requireSelection){p(ho);return}if(r.defaultValue&&((C=r.props.options)!=null&&C.find(y=>y.id===r.defaultValue))){let y=(P=r.props.options)==null?void 0:P.find(h=>h.id===r.defaultValue);p(y.id),o({choice:[y.id]})}else p(((v=r.props.options)==null?void 0:v[0].id)||""),o({choice:[((B=r.props.options)==null?void 0:B[0].id)||""]})}},[]),Wr(()=>{r.requireSelection&&s===ho?n([{message:"Please select an option",id:r.id}]):n([])},[s]),Ue.createElement(Nl,null,Ue.createElement(ot,{title:r.title,required:!1,appearance:t.appearance}),Ue.createElement(Ll,{value:s,onChange:C=>{p(C.target.value),o({choice:[C.target.value]})},placeholder:r.placeholder,appearance:t.appearance,className:l("multipleChoiceSelect",t.appearance)},r.requireSelection&&Ue.createElement("option",{key:ho,value:ho},"Select an option"),(c=r.props.options)==null?void 0:c.map(C=>Ue.createElement("option",{key:C.id,value:C.id},C.title))),((w=(u=r.props.options)==null?void 0:u.find(C=>C.id===s))==null?void 0:w.isOpenEnded)&&Ue.createElement(Ue.Fragment,null,Ue.createElement(ot,{title:((S=(T=r.props.options)==null?void 0:T.find(C=>C.id===s))==null?void 0:S.openEndedLabel)??"Please specify",required:!1,appearance:t.appearance}),Ue.createElement(Ho,{type:"text",placeholder:"Enter your answer here",onChange:C=>{o({choice:[C.target.value]})},appearance:t.appearance})),Ue.createElement(Pt,{title:r.subtitle,appearance:t.appearance}))}import xo,{useEffect as Gr,useState as qr}from"react";import Kr from"styled-components";var Ol=Kr.div`
|
|
244
322
|
display: flex;
|
|
245
323
|
flex-direction: column;
|
|
246
324
|
width: 100%;
|
|
247
325
|
-webkit-appearance: none;
|
|
248
326
|
appearance: none;
|
|
249
|
-
`,
|
|
327
|
+
`,Dl=Kr.button`
|
|
250
328
|
${e=>k(e)} {
|
|
251
329
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
252
330
|
border: 1px solid ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBorder}};
|
|
@@ -268,7 +346,7 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
268
346
|
height: 60px;
|
|
269
347
|
padding: 0 18px;
|
|
270
348
|
margin-bottom: 10px;
|
|
271
|
-
`;function
|
|
349
|
+
`;function Yr({formInput:e,customFormTypeProps:t,onSaveInputData:o,inputData:i}){var a;let n=e,[r,s]=qr((i==null?void 0:i.choice)||[]),[p,d]=qr(!1);return Gr(()=>{r.length==0&&!p&&(d(!0),o({choice:[]}))},[]),Gr(()=>{o({choice:r})},[r]),xo.createElement(Ol,null,xo.createElement(ot,{title:n.title,required:n.required,appearance:t.appearance}),(a=n.props.options)==null?void 0:a.map(f=>xo.createElement(Dl,{appearance:t.appearance,className:l("multipleChoiceListItem",t.appearance),key:f.id,value:f.id,"data-selected":r.includes(f.id),onClick:()=>{if(r.includes(f.id)){s(r.filter(c=>c!==f.id));return}r.length<n.props.maxChoices?s([...r,f.id]):r.length==1&&n.props.maxChoices==1&&s([f.id])}},f.title)),xo.createElement(Pt,{title:n.subtitle,appearance:t.appearance}))}import Co from"react";import Xr from"styled-components";import $l from"dompurify";function ce(e){return{__html:$l.sanitize(e,{ALLOWED_TAGS:["b","i","a","span","div","p","pre","u","br","img"],ALLOWED_ATTR:["style","class","target","id","href","alt","src"]})}}var Ml=Xr.h1`
|
|
272
350
|
${e=>k(e)} {
|
|
273
351
|
font-style: normal;
|
|
274
352
|
font-weight: 600;
|
|
@@ -279,7 +357,7 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
279
357
|
margin-bottom: 4px;
|
|
280
358
|
color: ${e=>e.appearance.theme.colorText};
|
|
281
359
|
}
|
|
282
|
-
|
|
360
|
+
`,Ul=Xr.h2`
|
|
283
361
|
${e=>k(e)} {
|
|
284
362
|
font-style: normal;
|
|
285
363
|
font-weight: 400;
|
|
@@ -287,35 +365,35 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
287
365
|
line-height: 20px;
|
|
288
366
|
color: ${e=>e.appearance.theme.colorTextSecondary};
|
|
289
367
|
}
|
|
290
|
-
`;function
|
|
368
|
+
`;function Se({appearance:e,title:t,subtitle:o,size:i="medium"}){return Co.createElement(Co.Fragment,null,Co.createElement(Ml,{appearance:e,className:l(`${i}Title`,e),dangerouslySetInnerHTML:ce(t),size:i}),o&&Co.createElement(Ul,{appearance:e,className:l(`${i}Subtitle`,e),dangerouslySetInnerHTML:ce(o),size:i}))}var zl=Go.div`
|
|
291
369
|
display: flex;
|
|
292
370
|
flex-direction: column;
|
|
293
371
|
justify-content: flex-end;
|
|
294
372
|
padding-bottom: 14px;
|
|
295
373
|
overflow: visible;
|
|
296
|
-
`,
|
|
374
|
+
`,Wl=Go.div`
|
|
297
375
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextError}};
|
|
298
376
|
font-size: 12px;
|
|
299
377
|
margin-bottom: 12px;
|
|
300
|
-
`,
|
|
378
|
+
`,Hl=Go.div`
|
|
301
379
|
padding-left: 1px;
|
|
302
380
|
padding-right: 1px;
|
|
303
|
-
`,
|
|
381
|
+
`,Vl={text:Vo,multipleChoice:jr,multipleChoiceList:Yr};function Jr({flowId:e,stepData:t,canContinue:o,setCanContinue:i,onSaveData:n,appearance:r,customFormElements:s}){var B;let p=t.props,[d,a]=jo([]),[f,c]=jo([]),{userId:u}=Ht(),[w,T]=jo(P()||{}),S={...Vl,...s};_l(()=>{i(d.length===0)},[d,i]);function C(y,h){let m={...w,[y.id]:h};T(m),n(m),window&&window.localStorage&&window.localStorage.setItem(v(),JSON.stringify(m))}function P(){if(window&&window.localStorage){let y=window.localStorage.getItem(v());if(y)return JSON.parse(y)}return{}}function v(){return`frigade-multiInputStepTypeData-${e}-${t.id}-${u}`}return jt.createElement(Hl,{className:l("multiInput",r)},jt.createElement(Se,{appearance:r,title:t.title,subtitle:t.subtitle}),jt.createElement(zl,{className:l("multiInputContainer",r)},(B=p.data)==null?void 0:B.map(y=>{var m;let h=(m=d.reverse().find(x=>x.id===y.id))==null?void 0:m.message;return S[y.type]?jt.createElement("span",{key:y.id},S[y.type]({formInput:y,customFormTypeProps:{flowId:e,stepData:t,canContinue:o,setCanContinue:i,onSaveData:n,appearance:r},onSaveInputData:x=>{!f.includes(y.id)&&x&&(x==null?void 0:x.text)!==""&&c(F=>[...F,y.id]),C(y,x)},inputData:w[y.id],setFormValidationErrors:x=>{a(F=>x.length===0?F.filter(O=>O.id!==y.id):[...F,...x])}}),h&&f.includes(y.id)&&jt.createElement(Wl,{appearance:r,className:l("multiInputValidationError",r)},h)):null})))}import ct from"styled-components";var Qr=ct.div`
|
|
304
382
|
align-items: center;
|
|
305
383
|
display: flex;
|
|
306
384
|
justify-content: ${e=>e.showBackButton?"space-between":"flex-end"};
|
|
307
385
|
padding-top: 14px;
|
|
308
|
-
`,
|
|
386
|
+
`,Zr=ct.div`
|
|
309
387
|
color: ${e=>e.appearance.theme.colorTextError};
|
|
310
388
|
font-size: 12px;
|
|
311
|
-
`,
|
|
389
|
+
`,Rr=ct.div`
|
|
312
390
|
display: flex;
|
|
313
391
|
gap: 12px;
|
|
314
|
-
`,
|
|
392
|
+
`,ei=ct.div`
|
|
315
393
|
display: flex;
|
|
316
394
|
flex-direction: row;
|
|
317
395
|
flex: 1 1;
|
|
318
|
-
`,
|
|
396
|
+
`,ti=ct.div`
|
|
319
397
|
display: flex;
|
|
320
398
|
// If type is set to large-modal, use padding 60px horizontal, 80px vertical
|
|
321
399
|
// Otherwise, use 4px padding
|
|
@@ -323,11 +401,11 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
323
401
|
flex-grow: 1;
|
|
324
402
|
flex-basis: 0;
|
|
325
403
|
position: relative;
|
|
326
|
-
`,
|
|
404
|
+
`,oi=ct.div`
|
|
327
405
|
padding: ${e=>e.type==="large-modal"?"50px":"0px"};
|
|
328
406
|
position: relative;
|
|
329
407
|
overflow-y: auto;
|
|
330
|
-
`,
|
|
408
|
+
`,ri=ct.div`
|
|
331
409
|
display: flex;
|
|
332
410
|
align-self: stretch;
|
|
333
411
|
flex-grow: 1;
|
|
@@ -339,7 +417,7 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
339
417
|
background-position: center;
|
|
340
418
|
border-top-right-radius: ${e=>e.appearance.theme.borderRadius}px;
|
|
341
419
|
border-bottom-right-radius: ${e=>e.appearance.theme.borderRadius}px;
|
|
342
|
-
`;import
|
|
420
|
+
`;import rt from"react";import jl from"react";import ii from"styled-components";var Gl=ii.button`
|
|
343
421
|
justify-content: center;
|
|
344
422
|
align-content: center;
|
|
345
423
|
${e=>k(e)} {
|
|
@@ -369,7 +447,7 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
369
447
|
opacity: 0.3;
|
|
370
448
|
cursor: not-allowed;
|
|
371
449
|
}
|
|
372
|
-
`,
|
|
450
|
+
`,So=ii.div`
|
|
373
451
|
${e=>k(e)} {
|
|
374
452
|
display: flex;
|
|
375
453
|
flex-direction: row;
|
|
@@ -379,14 +457,14 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
379
457
|
margin-right: 8px;
|
|
380
458
|
}
|
|
381
459
|
}
|
|
382
|
-
`,
|
|
460
|
+
`,Z=({onClick:e,title:t,style:o,disabled:i,type:n="inline",size:r="medium",secondary:s=!1,appearance:p,withMargin:d=!0,classPrefix:a=""})=>{function f(){let c=s?"buttonSecondary":"button";return a===""?c:`${a}${yr(c)}`}return jl.createElement(Gl,{secondary:s,appearance:p,disabled:i,onClick:e,style:o,type:n,withMargin:d,size:r,className:l(f(),p)},t)};var ni=({step:e,canContinue:t,appearance:o,onPrimaryClick:i,onSecondaryClick:n,formType:r,selectedStep:s,steps:p,onBack:d,allowBackNavigation:a,errorMessage:f})=>{let c=r==="inline"?"inline":"full-width",u=p.length>1&&s!=0&&a;return rt.createElement(rt.Fragment,null,f&&rt.createElement(Zr,{appearance:o,className:l("formCTAError",o)},f),rt.createElement(Qr,{showBackButton:u,className:l("formCTAContainer",o)},u&&rt.createElement(Z,{title:"\u2190",onClick:d,secondary:!0,withMargin:!1,type:c,appearance:o}),rt.createElement(Rr,{className:l("ctaWrapper",o)},e.secondaryButtonTitle?rt.createElement(Z,{title:e.secondaryButtonTitle,onClick:n,secondary:!0,withMargin:!1,type:c,appearance:o}):null," ",e.primaryButtonTitle?rt.createElement(Z,{disabled:!t,withMargin:!1,title:e.primaryButtonTitle,onClick:i,type:c,appearance:o}):null)))};import qo from"react";import ql from"styled-components";var Kl=ql.div`
|
|
383
461
|
text-align: center;
|
|
384
|
-
`,
|
|
462
|
+
`,si=({stepCount:e=0,currentStep:t=0,className:o,appearance:i})=>{let{theme:n}=J().mergeAppearanceWithDefault(i);return qo.createElement(Kl,{className:o},qo.createElement("svg",{width:16*e-8,height:8,viewBox:`0 0 ${16*e-8} 8`,fill:"none"},Array(e).fill(null).map((r,s)=>qo.createElement("rect",{key:s,x:16*s,y:0,width:8,height:8,rx:4,fill:t===s?n.colorPrimary:"#E6E6E6"}))))};import mt from"react";import vt from"styled-components";import{useContext as Yl}from"react";function re(){let e=Yl(q);function t(n){i(n.primaryButtonUri,n.primaryButtonUriTarget)}function o(n){i(n.secondaryButtonUri,n.secondaryButtonUriTarget)}function i(n,r){if(!n)return;let s=n.startsWith("http")?"_blank":"_self";r&&r!=="_blank"&&(s="_self"),e.navigate(n,s)}return{primaryCTAClickSideEffects:t,secondaryCTAClickSideEffects:o,handleUrl:i}}var Xl=vt.div`
|
|
385
463
|
display: flex;
|
|
386
464
|
flex-wrap: wrap;
|
|
387
465
|
align-content: center;
|
|
388
466
|
justify-content: center;
|
|
389
|
-
`,
|
|
467
|
+
`,Jl=vt.div`
|
|
390
468
|
align-content: center;
|
|
391
469
|
align-items: center;
|
|
392
470
|
display: flex;
|
|
@@ -400,10 +478,10 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
400
478
|
flex-basis: 255px;
|
|
401
479
|
flex-grow: 0;
|
|
402
480
|
flex-shrink: 0;
|
|
403
|
-
`,
|
|
481
|
+
`,Ql=vt.img`
|
|
404
482
|
width: 78px;
|
|
405
483
|
height: auto;
|
|
406
|
-
`,
|
|
484
|
+
`,Zl=vt.button`
|
|
407
485
|
font-style: normal;
|
|
408
486
|
font-weight: 600;
|
|
409
487
|
font-size: 13px;
|
|
@@ -416,11 +494,11 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
416
494
|
border-radius: 100px;
|
|
417
495
|
padding: 8px 12px;
|
|
418
496
|
margin-top: 16px;
|
|
419
|
-
`,
|
|
497
|
+
`,Rl=vt.h1`
|
|
420
498
|
font-weight: 700;
|
|
421
499
|
font-size: 28px;
|
|
422
500
|
line-height: 34px;
|
|
423
|
-
`,
|
|
501
|
+
`,ea=vt.h2`
|
|
424
502
|
font-style: normal;
|
|
425
503
|
font-weight: 400;
|
|
426
504
|
font-size: 16px;
|
|
@@ -429,7 +507,7 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
429
507
|
margin-top: 12px;
|
|
430
508
|
margin-bottom: 16px;
|
|
431
509
|
max-width: 70%;
|
|
432
|
-
`;function
|
|
510
|
+
`;function li({stepData:e,appearance:t}){var i,n;let{handleUrl:o}=re();return mt.createElement("div",null,mt.createElement(Rl,null,e.title),mt.createElement(ea,null,e.subtitle),mt.createElement(Xl,null,(n=(i=e.props)==null?void 0:i.links)==null?void 0:n.map(r=>mt.createElement(Jl,{key:r.title},mt.createElement(Ql,{src:r.imageUri}),mt.createElement(Zl,{style:{borderColor:t.theme.colorPrimary,color:t.theme.colorPrimary},onClick:()=>{r.uri&&o(r.uri,r.uriTarget??"_blank")}},r.title)))))}import Bt,{useEffect as la}from"react";import wo from"styled-components";import Ko from"react";var yo=({style:e,className:t})=>Ko.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",strokeWidth:1.5,stroke:"currentColor",className:t,style:e},Ko.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M21 12a9 9 0 11-18 0 9 9 0 0118 0z"}),Ko.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M15.91 11.672a.375.375 0 010 .656l-5.603 3.113a.375.375 0 01-.557-.328V8.887c0-.286.307-.466.557-.327l5.603 3.112z"}));import Gt,{useRef as ta,useState as oa}from"react";import bo from"styled-components";var ra=bo.div`
|
|
433
511
|
display: flex;
|
|
434
512
|
align-items: center;
|
|
435
513
|
justify-content: flex-start;
|
|
@@ -437,7 +515,7 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
437
515
|
width: 100%;
|
|
438
516
|
height: 100%;
|
|
439
517
|
position: relative;
|
|
440
|
-
`,
|
|
518
|
+
`,ia=bo.div`
|
|
441
519
|
position: absolute;
|
|
442
520
|
display: flex;
|
|
443
521
|
align-items: center;
|
|
@@ -456,59 +534,59 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
456
534
|
box-shadow: 0px 6px 25px rgba(0, 0, 0, 0.06);
|
|
457
535
|
border-radius: 50%;
|
|
458
536
|
}
|
|
459
|
-
`,
|
|
537
|
+
`,na=bo.video`
|
|
460
538
|
width: 100%;
|
|
461
539
|
height: 100%;
|
|
462
540
|
min-height: 200px;
|
|
463
541
|
border-radius: ${e=>e.appearance.theme.borderRadius}px;
|
|
464
|
-
`,
|
|
542
|
+
`,sa=bo.iframe`
|
|
465
543
|
width: 100%;
|
|
466
544
|
height: 100%;
|
|
467
545
|
min-height: 200px;
|
|
468
546
|
border-radius: ${e=>e.appearance.theme.borderRadius}px;
|
|
469
|
-
`;function Et({appearance:e,videoUri:t}){let o=
|
|
547
|
+
`;function Et({appearance:e,videoUri:t}){let o=ta(),[i,n]=oa(!1);if(t.includes("youtube")){let r=t.split("v=")[1],s=r.indexOf("&");return s!==-1&&(r=r.substring(0,s)),Gt.createElement(sa,{width:"100%",height:"100%",src:`https://www.youtube.com/embed/${r}`,frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0,appearance:e})}return Gt.createElement(ra,{appearance:e},!i&&Gt.createElement(ia,{onClick:()=>{n(!0),o.current.play()},appearance:e},Gt.createElement(yo,null)),Gt.createElement(na,{appearance:e,controls:i,ref:o,play:i,src:t}))}var aa=wo.div`
|
|
470
548
|
${e=>k(e)} {
|
|
471
549
|
display: flex;
|
|
472
550
|
flex-direction: column;
|
|
473
551
|
justify-content: center;
|
|
474
552
|
}
|
|
475
|
-
`,
|
|
553
|
+
`,pa=wo.img`
|
|
476
554
|
${e=>k(e)} {
|
|
477
555
|
width: 100%;
|
|
478
556
|
height: auto;
|
|
479
557
|
max-height: 250px;
|
|
480
558
|
margin-bottom: 24px;
|
|
481
559
|
}
|
|
482
|
-
`,
|
|
560
|
+
`,da=wo.div`
|
|
483
561
|
${e=>k(e)} {
|
|
484
562
|
margin-bottom: 24px;
|
|
485
563
|
}
|
|
486
|
-
`,
|
|
564
|
+
`,ca=wo.div`
|
|
487
565
|
${e=>k(e)} {
|
|
488
566
|
width: 100%;
|
|
489
567
|
height: auto;
|
|
490
568
|
max-height: 250px;
|
|
491
569
|
margin-bottom: 24px;
|
|
492
570
|
}
|
|
493
|
-
`;function
|
|
494
|
-
${e=>
|
|
495
|
-
`,
|
|
571
|
+
`;function ai({stepData:e,appearance:t,setCanContinue:o}){return la(()=>{o(!0)},[]),Bt.createElement(aa,{className:l("callToActionContainer",t)},Bt.createElement(da,{className:l("callToActionTextContainer",t)},Bt.createElement(Se,{appearance:t,title:e.title,subtitle:e.subtitle})),e.imageUri&&Bt.createElement(pa,{className:l("callToActionImage",t),src:e.imageUri}),!e.imageUri&&e.videoUri&&Bt.createElement(ca,{appearance:t,className:l("callToActionVideo",t)},Bt.createElement(Et,{appearance:t,videoUri:e.videoUri})))}import Ke,{useEffect as Yo,useState as Xo}from"react";import Kt from"react";import qt from"react";import{motion as ma}from"framer-motion";var pi=({color:e,percentage:t,size:o})=>{let i=o*.5-2,n=2*Math.PI*i,r=(1-t)*n,s={duration:.3,delay:0,ease:"easeIn"},p={hidden:{strokeDashoffset:n,transition:s},show:{strokeDashoffset:r,transition:s}};return qt.createElement(ma.circle,{r:i,cx:o*.5,cy:o*.5,fill:"transparent",stroke:r!==n?e:"",strokeWidth:"3px",strokeDasharray:n,strokeDashoffset:t?r:0,variants:p,transition:s,initial:"hidden",animate:"show"})},ua=({fillColor:e,size:t,percentage:o,children:i,bgColor:n="#D9D9D9",className:r,style:s})=>qt.createElement("svg",{style:s,className:r,width:t,height:t,overflow:"visible"},qt.createElement("g",{transform:`rotate(-90 ${`${t*.5} ${t*.5}`})`},qt.createElement(pi,{color:n,size:t}),qt.createElement(pi,{color:e,percentage:o,size:t})),i),At=ua;import fa from"styled-components";var ga=({color:e="#FFFFFF"})=>Kt.createElement("svg",{width:10,height:8,viewBox:"0 0 10 8",fill:"none",xmlns:"http://www.w3.org/2000/svg"},Kt.createElement("path",{d:"M1 4.34815L3.4618 7L3.4459 6.98287L9 1",stroke:e,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})),ha={width:"22px",height:"22px",borderRadius:"8px",display:"flex",justifyContent:"center",alignItems:"center"},xa={width:"22px",height:"22px",borderRadius:"40px",display:"flex",justifyContent:"center",alignItems:"center"},Ca={border:"1px solid #000000",color:"#FFFFFF"},Sa={border:"1px solid #E6E6E6"},ya={color:"#FFFFFF"},ba={border:"3px solid #D9D9D9"},wa=e=>e==="square"?ha:xa,Ta=(e,t)=>e==="square"?t?Ca:Sa:t?ya:ba,Fa=fa.div`
|
|
572
|
+
${e=>dt(e)}
|
|
573
|
+
`,ut=({value:e,type:t="square",primaryColor:o="#000000",progress:i,appearance:n=qe,style:r,className:s})=>{let p=wa(t),d=Ta(t,e);return e===!0?p={...p,...d,backgroundColor:o,borderColor:t==="square"?o:"none"}:p={...p,...d},e!==!0&&t==="round"&&i!==void 0&&i!==1?Kt.createElement(At,{fillColor:o,percentage:i,size:22}):Kt.createElement(Fa,{styleOverrides:p,style:r,role:"checkbox",className:Ce(l("checkIconContainer",n),l(e?"checkIconContainerChecked":"checkIconContainerUnchecked",n),e?"checkIconContainerChecked":"checkIconContainerUnchecked",s)},e&&Kt.createElement(ga,{color:"#FFFFFF"}))};import it from"styled-components";var di=it.div`
|
|
496
574
|
width: auto;
|
|
497
575
|
display: flex;
|
|
498
576
|
flex-direction: column;
|
|
499
577
|
justify-content: center;
|
|
500
578
|
align-items: center;
|
|
501
579
|
padding: 4px;
|
|
502
|
-
`,
|
|
580
|
+
`,ci=it.div`
|
|
503
581
|
width: 100%;
|
|
504
582
|
text-align: left;
|
|
505
|
-
`,
|
|
583
|
+
`,mi=it.h1`
|
|
506
584
|
font-style: normal;
|
|
507
585
|
font-weight: 700;
|
|
508
586
|
font-size: 32px;
|
|
509
587
|
line-height: 38px;
|
|
510
588
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
511
|
-
`,
|
|
589
|
+
`,ui=it.h1`
|
|
512
590
|
font-style: normal;
|
|
513
591
|
font-weight: 400;
|
|
514
592
|
font-size: 16px;
|
|
@@ -516,7 +594,7 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
516
594
|
margin-top: 16px;
|
|
517
595
|
margin-bottom: 16px;
|
|
518
596
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextSecondary}};
|
|
519
|
-
`,
|
|
597
|
+
`,fi=it.div`
|
|
520
598
|
padding-top: 12px;
|
|
521
599
|
padding-bottom: 12px;
|
|
522
600
|
flex-direction: row;
|
|
@@ -527,17 +605,17 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
527
605
|
cursor: pointer;
|
|
528
606
|
border-bottom: ${e=>e.hideBottomBorder?"none":"1px solid #D8D8D8"};
|
|
529
607
|
width: 100%;
|
|
530
|
-
`,
|
|
608
|
+
`,gi=it.div`
|
|
531
609
|
padding-top: 10px;
|
|
532
610
|
padding-bottom: 10px;
|
|
533
611
|
flex-direction: row;
|
|
534
612
|
display: flex;
|
|
535
613
|
justify-content: flex-start;
|
|
536
|
-
`,
|
|
614
|
+
`,hi=it.img`
|
|
537
615
|
width: 42px;
|
|
538
616
|
height: 42px;
|
|
539
617
|
margin-right: 12px;
|
|
540
|
-
`,
|
|
618
|
+
`,xi=it.p`
|
|
541
619
|
font-style: normal;
|
|
542
620
|
font-weight: 500;
|
|
543
621
|
font-size: 17px;
|
|
@@ -545,8 +623,8 @@ import ht,{createContext as Oa,useEffect as Jo,useState as Ne}from"react";import
|
|
|
545
623
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
546
624
|
display: flex;
|
|
547
625
|
align-self: center;
|
|
548
|
-
`;var
|
|
549
|
-
${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map(([s,p])=>`${
|
|
626
|
+
`;var Ci=({stepData:e,setCanContinue:t,onSaveData:o,appearance:i})=>{let n=e.props,[r,s]=Xo([]),[p,d]=Xo(!1),[a,f]=Xo(e.id);return Yo(()=>{r.length==0&&!p&&(d(!0),o({choice:[]}))},[p]),Yo(()=>{a!==e.id&&(f(e.id),s([]))},[e]),Yo(()=>{o({choice:r}),r.length>=n.minChoices?t(!0):t(!1)},[r]),Ke.createElement(di,{className:l("selectListContainer",i)},Ke.createElement(ci,null,Ke.createElement(mi,{className:l("selectListTitle",i)},e.title),Ke.createElement(ui,{appearance:i,className:l("selectListSubtitle",i)},e.subtitle)),n.options.map((c,u)=>{let w=r.includes(c.id);return Ke.createElement(fi,{key:`select-item-${u}`,onClick:()=>{if(r.includes(c.id)){s(r.filter(T=>T!==c.id));return}r.length<n.maxChoices?s([...r,c.id]):r.length==1&&n.maxChoices==1&&s([c.id])},hideBottomBorder:u===n.options.length-1,className:l("selectListSelectItem",i)},Ke.createElement(gi,{className:l("selectListItemImage",i)},c.imageUri&&Ke.createElement(hi,{src:c.imageUri,alt:`select-icon-${u}`}),Ke.createElement(xi,{appearance:i,className:l("selectListSelectItemText",i)},c.title)),Ke.createElement(ut,{appearance:i,value:w,primaryColor:i.theme.colorPrimary}))}))};import ye,{useEffect as Jo,useState as Yt}from"react";import{AnimatePresence as ka,motion as Pa}from"framer-motion";var va=({children:e,id:t,shouldWrap:o=!1})=>ye.createElement(ye.Fragment,null,o?ye.createElement(ka,{initial:!1},ye.createElement(Pa.div,{key:t,initial:{opacity:1,y:"100%"},animate:{opacity:1,y:0},exit:{opacity:0,y:"-100%"},transition:{duration:.5,ease:"easeInOut"},style:{width:"100%",height:"100%",position:"absolute",top:0,left:0,zIndex:1,overflowY:"auto"}},e)):e),To=({appearance:e,steps:t,selectedStep:o,customStepTypes:i,customVariables:n,onButtonClick:r,onStepCompletion:s,flowId:p,type:d,hideOnFlowCompletion:a,onComplete:f,setVisible:c,setShowModal:u,onDismiss:w,showPagination:T=!1,customFormElements:S,allowBackNavigation:C,validationHandler:P})=>{var ke;let B={...{linkCollection:li,multiInput:Jr,callToAction:ai,selectList:Ci},...i},{primaryCTAClickSideEffects:y,secondaryCTAClickSideEffects:h}=re(),[m,x]=Yt(!1),[F,O]=Yt({}),[_,z]=Yt(!1),[A,U]=Yt(!1),[$,N]=Yt(null),ie=t[o]??null,{markStepCompleted:pe,markStepStarted:L,isLoading:we,updateCustomVariables:xe,markFlowCompleted:ee}=X();Jo(()=>{xe(n)},[n,we]),Jo(()=>{window&&C&&!A&&(window.location.hash=t[o].id,U(!0))},[C,A,U]),Jo(()=>{var G;if(window&&((G=window==null?void 0:window.location)!=null&&G.hash)&&window.location.hash.replace("#","")!==t[o].id){let ge=window.location.hash.replace("#",""),R=t.findIndex(K=>K.id===ge);R!==-1&&L(p,t[R].id)}},[(ke=window==null?void 0:window.location)==null?void 0:ke.hash,L,o,t]);function j(){return{data:F[t[o].id]??{},stepId:t[o].id,customVariables:n}}function oe(G,ge,R){let K=o+1<t.length?t[o+1]:null;r&&r(G,o,ge,K),s&&s(G,R,K,F,j())}function I(G,ge){O(R=>{let K={};return K[G.id]=ge,{...R,...K}})}function ne(G){return G.selectedStep.imageUri?ye.createElement(ri,{image:G.selectedStep.imageUri,appearance:e,className:l("formContainerSidebarImage",e)}):null}let fe=ye.createElement(ni,{step:t[o],canContinue:m&&!_,formType:d,selectedStep:o,appearance:e,onPrimaryClick:async()=>{if(z(!0),P){let ge=await P(t[o],o,t[o+1],F,j());if(ge){N(ge),z(!1);return}else N(null)}let G={...j()};await pe(p,t[o].id,G),o+1<t.length&&await L(p,t[o+1].id),oe(t[o],"primary",o),o+1>=t.length&&(f&&f(),w&&w(),a&&(c&&c(!1),u(!1)),await ee(p)),y(t[o]),z(!1),window&&C&&o+1<t.length&&(window.location.hash=t[o+1].id)},onSecondaryClick:()=>{oe(t[o],"secondary",o),h(t[o])},onBack:async()=>{o-1>=0&&(z(!0),await L(p,t[o-1].id),z(!1))},steps:t,allowBackNavigation:C,errorMessage:$});return ye.createElement(ye.Fragment,null,ye.createElement(ei,{className:l("formContainer",e)},ye.createElement(ti,null,ye.createElement(va,{id:o,shouldWrap:d==="large-modal"},ye.createElement(oi,{key:ie.id,type:d,className:l("formContent",e)},t.map(G=>{let ge=B[G.type];return ie.id!==G.id?null:ye.createElement(ge,{key:G.id,stepData:G,canContinue:m,setCanContinue:x,onSaveData:R=>{I(G,R)},appearance:e,customFormElements:S,flowId:p})}),T&&ye.createElement(si,{className:l("formPagination",e),appearance:e,stepCount:t.length,currentStep:o}),fe))),d=="large-modal"&&ye.createElement(ne,{selectedStep:t[o]})))};import Xt from"react";import{createGlobalStyle as Ea}from"styled-components";function te({appearance:e}){if(!e||!e.styleOverrides)return Xt.createElement(Xt.Fragment,null);let t=Object.entries(e.styleOverrides).filter(([i,n])=>typeof n=="object");if(t.length===0)return Xt.createElement(Xt.Fragment,null);let o=Ea`
|
|
627
|
+
${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map(([s,p])=>`${$o(s)}: ${p};`).join(" ")} }`).join(" ")}`;return Xt.createElement(o,{inlineStyles:t})}var Si=({flowId:e,customStepTypes:t={},type:o="inline",visible:i,setVisible:n,customVariables:r,customFormElements:s,onComplete:p,appearance:d,hideOnFlowCompletion:a=!0,onStepCompletion:f,onButtonClick:c,dismissible:u=!0,endFlowOnDismiss:w=!1,modalPosition:T="center",repeatable:S=!1,onDismiss:C,showPagination:P=!1,allowBackNavigation:v=!1,validationHandler:B,showFrigadeBranding:y=!1})=>{let{getFlow:h,getFlowSteps:m,isLoading:x,targetingLogicShouldHideFlow:F,getFlowStatus:O,getCurrentStepIndex:_,markFlowCompleted:z,markFlowNotStarted:A}=X(),U=_(e),{mergeAppearanceWithDefault:$}=J(),[N,ie]=Aa(!1),{setOpenFlowState:pe,getOpenFlowState:L}=Pe();d=$(d);let[we,xe]=i!==void 0&&n!==void 0?[i,n]:[L(e,!0),I=>pe(e,I)];if(Ba(()=>{!N&&!x&&(ie(!0),O(e)===Y&&S&&A(e),ie(!0))},[N,ie,x]),x)return null;let ee=h(e);if(!ee||F(ee))return null;let j=m(e);if(!j||i!==void 0&&i===!1||O(e)===Y&&a)return null;let oe=()=>{xe(!1),C&&C(),w===!0&&z(e)};if(T=="center"&&o==="modal"||o==="large-modal"){let I={padding:"24px"};return o==="large-modal"?(I.width="85%",I.height="90%",I.maxHeight="800px",I.minHeight="500px",I.padding="0"):I.width="400px",_e.createElement(et,{appearance:d,onClose:oe,visible:we,style:I,dismissible:u,showFrigadeBranding:y},_e.createElement(te,{appearance:d}),_e.createElement(To,{appearance:d,steps:j,selectedStep:U,customStepTypes:t,customVariables:r,onButtonClick:c,onStepCompletion:f,flowId:e,type:o,hideOnFlowCompletion:a,onComplete:p,setVisible:n,setShowModal:xe,onDismiss:C,showPagination:P,customFormElements:s,allowBackNavigation:v,validationHandler:B}))}return o==="modal"&&T!=="center"?_e.createElement(Or,{appearance:d,onClose:oe,visible:we},_e.createElement(te,{appearance:d}),_e.createElement(To,{appearance:d,steps:j,selectedStep:U,customStepTypes:t,customVariables:r,onButtonClick:c,onStepCompletion:f,flowId:e,type:o,hideOnFlowCompletion:a,onComplete:p,setVisible:n,setShowModal:xe,onDismiss:C,showPagination:P,customFormElements:s,allowBackNavigation:v,validationHandler:B})):_e.createElement(_e.Fragment,null,_e.createElement(te,{appearance:d}),_e.createElement(To,{appearance:d,steps:j,selectedStep:U,customStepTypes:t,customVariables:r,onButtonClick:c,onStepCompletion:f,flowId:e,type:o,hideOnFlowCompletion:a,onComplete:p,setVisible:n,setShowModal:xe,onDismiss:C,showPagination:P,customFormElements:s,allowBackNavigation:v,validationHandler:B}))},yi=Si;import{useCallback as bi,useContext as Ia,useEffect as Na}from"react";function Qo(){let{organizationId:e,userId:t,setOrganizationId:o}=Ia(q),{mutateUserFlowState:i}=Ie(),{config:n}=Me(),r=Tt(),{verifySDKInitiated:s}=Ft();Na(()=>{if(t&&e){if(t.startsWith(kt))return;let a=`frigade-user-group-registered-${t}-${e}`;localStorage.getItem(a)||(r(`${Te}userGroups`,{...n,method:"POST",body:JSON.stringify({foreignUserId:t,foreignUserGroupId:e})}),localStorage.setItem(a,"true"))}},[t,e]);let p=bi(async a=>{if(s(),!e||!t){console.error("Cannot add properties to organization: Organization ID and User ID must both be set.",{organizationId:e,userId:t});return}let f={foreignUserId:t,foreignUserGroupId:e,properties:a};await r(`${Te}userGroups`,{...n,method:"POST",body:JSON.stringify(f)}),i()},[e,t,n,i]),d=bi(async(a,f)=>{if(s(),!e||!t){console.error("Cannot track event for organization: Organization ID and User ID must both be set.",{organizationId:e,userId:t});return}let u={foreignUserId:t,foreignUserGroupId:e,events:[{event:a,properties:f}]};await r(`${Te}userGroups`,{...n,method:"POST",body:JSON.stringify(u)}),i()},[e,t,n,i]);return{organizationId:e,setOrganizationId:o,addPropertiesToOrganization:p,trackEventForOrganization:d}}var wi="xFrigade_guestUserId",Ti="xFrigade_userId",Fi=({})=>{let{setFlowResponses:e}=Wt(),{userFlowStatesData:t,isLoadingUserFlowStateData:o,mutateUserFlowState:i}=Ie(),{userId:n,setUserId:r}=Ht(),[s,p]=Zo(null),{getFlowStatus:d}=X(),{flows:a,userProperties:f,setIsNewGuestUser:c,flowResponses:u}=La(q),[w,T]=Zo([]),[S,C]=Zo([]),{organizationId:P}=Qo();Fo(()=>{if(!o&&t)for(let h=0;h<t.length;h++){let m=t[h],x=a.find(F=>F.slug===(m==null?void 0:m.flowId));if(x&&m&&m.shouldTrigger===!0&&x.type=="FORM"&&x.triggerType==="AUTOMATIC"&&!S.includes(x.slug)){setTimeout(()=>{v(m.flowId)},500);break}}},[o,t]),Fo(()=>{u.length>0&&i()},[u]);function v(h){let m=a.find(x=>x.slug===h);m&&m.triggerType==="AUTOMATIC"&&!S.includes(m.slug)&&(C([...S,m.slug]),T([m]))}function B(){if(!n){let h=localStorage.getItem(Ti);if(h){r(h);return}let m=localStorage.getItem(wi);if(m){r(m);return}c(!0);let x=kt+Oa();try{localStorage.setItem(wi,x)}catch(F){console.log("Failed to save guest user id locally: Local storage unavailable",F)}r(F=>F||x)}}Fo(()=>{try{if(a){let h=[];a.forEach(m=>{if(m.data){let x=m.data.match(/"imageUri":"(.*?)"/g);x&&x.forEach(F=>{let O=F.replace('"imageUri":"',"").replace('"',"");if(h.includes(O))return;let _=new Image;_.src=O,h.push(O)})}})}}catch{}},[a]),Fo(()=>{if(n!==s&&e([]),p(n),n&&!n.startsWith(kt))try{localStorage.setItem(Ti,n)}catch(h){console.log("Failed to save user id locally: Local storage available",h)}n===null&&setTimeout(()=>{n===null&&B()},50)},[n,a,f]);function y(){return ft.createElement(ft.Fragment,null,w.map(h=>d(h.slug)!==Le?null:ft.createElement("span",{key:h.slug},ft.createElement(yi,{flowId:h.slug,type:"modal",modalPosition:"center",endFlowOnDismiss:!0}))))}return ft.createElement(ft.Fragment,null,ft.createElement(y,null))};import{ErrorBoundary as Ma}from"react-error-boundary";var q=Da({publicApiKey:"",setUserId:()=>{},flows:[],setFlows:()=>{},failedFlowResponses:[],setFailedFlowResponses:()=>{},flowResponses:[],setFlowResponses:()=>{},userProperties:{},setUserProperties:()=>{},openFlowStates:{},setOpenFlowStates:()=>{},completedFlowsToKeepOpenDuringSession:[],setCompletedFlowsToKeepOpenDuringSession:()=>{},customVariables:{},setCustomVariables:()=>{},isNewGuestUser:!1,setIsNewGuestUser:()=>{},hasActiveFullPageFlow:!1,setHasActiveFullPageFlow:()=>{},organizationId:"",setOrganizationId:()=>{},navigate:()=>{},defaultAppearance:qe,shouldGracefullyDegrade:!1,setShouldGracefullyDegrade:()=>{}}),Ua=({publicApiKey:e,userId:t,organizationId:o,config:i,children:n})=>{var ie,pe;let[r,s]=Ne(t||null),[p,d]=Ne(o||null),[a,f]=Ne([]),[c,u]=Ne([]),[w,T]=Ne([]),[S,C]=Ne({}),[P,v]=Ne({}),[B,y]=Ne([]),[h,m]=Ne({}),[x,F]=Ne(!1),[O,_]=Ne(!1),[z,A]=Ne(!N(e)),U=(L,we)=>{if(we==="_blank"){window.open(L,"_blank");return}setTimeout(()=>{window.location.href=L},50)},$={theme:{...qe.theme,...((ie=i==null?void 0:i.defaultAppearance)==null?void 0:ie.theme)??{}},styleOverrides:{...qe.styleOverrides,...((pe=i==null?void 0:i.defaultAppearance)==null?void 0:pe.styleOverrides)??{}}};function N(L){return!!(L&&L.length>10&&L.substring(0,10)==="api_public")}return Ro(()=>{t&&s(t)},[t]),Ro(()=>{o&&d(o)},[o]),Ro(()=>{if(N(e))A(!1);else{console.error("Frigade SDK failed to initialize. API key provided is either missing or valid."),A(!0);return}},[e,A]),z?gt.createElement(q.Provider,{value:{publicApiKey:e,userId:r,setUserId:s,setFlows:f,flows:a,failedFlowResponses:c,setFailedFlowResponses:u,flowResponses:w,setFlowResponses:T,userProperties:S,setUserProperties:C,openFlowStates:P,setOpenFlowStates:v,completedFlowsToKeepOpenDuringSession:B,setCompletedFlowsToKeepOpenDuringSession:y,customVariables:h,setCustomVariables:m,isNewGuestUser:x,setIsNewGuestUser:F,hasActiveFullPageFlow:O,setHasActiveFullPageFlow:_,organizationId:p,setOrganizationId:d,navigate:i&&i.navigate?i.navigate:U,defaultAppearance:$,shouldGracefullyDegrade:z,setShouldGracefullyDegrade:A}},n):gt.createElement(Ma,{fallback:gt.createElement(gt.Fragment,null,n)},gt.createElement(q.Provider,{value:{publicApiKey:e,userId:r,setUserId:s,setFlows:f,flows:a,failedFlowResponses:c,setFailedFlowResponses:u,flowResponses:w,setFlowResponses:T,userProperties:S,setUserProperties:C,openFlowStates:P,setOpenFlowStates:v,completedFlowsToKeepOpenDuringSession:B,setCompletedFlowsToKeepOpenDuringSession:y,customVariables:h,setCustomVariables:m,isNewGuestUser:x,setIsNewGuestUser:F,hasActiveFullPageFlow:O,setHasActiveFullPageFlow:_,organizationId:p,setOrganizationId:d,navigate:i&&i.navigate?i.navigate:U,defaultAppearance:$,shouldGracefullyDegrade:z,setShouldGracefullyDegrade:A}},gt.createElement($a,{theme:$.theme},n,gt.createElement(Fi,null))))};import Dp from"react";import ae,{useEffect as ts,useState as os}from"react";import $e,{useState as sp}from"react";import Ct from"styled-components";import vo from"react";import ht from"react";import Pi from"styled-components";var ki=Pi.span`
|
|
550
628
|
font-weight: 400;
|
|
551
629
|
font-size: 15px;
|
|
552
630
|
line-height: 20px;
|
|
@@ -555,7 +633,7 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
555
633
|
vertical-align: middle;
|
|
556
634
|
margin-left: 12px;
|
|
557
635
|
padding-right: 12px;
|
|
558
|
-
`,
|
|
636
|
+
`,_a=Pi.div`
|
|
559
637
|
flex-direction: row;
|
|
560
638
|
justify-content: space-between;
|
|
561
639
|
display: flex;
|
|
@@ -563,24 +641,24 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
563
641
|
padding-bottom: 20px;
|
|
564
642
|
border-top: 1px solid ${e=>e.theme.colorBorder};
|
|
565
643
|
width: 100%;
|
|
566
|
-
`,
|
|
644
|
+
`,ko=({label:e,value:t,labelStyle:o={},labelPosition:i="right",style:n,primaryColor:r="#000000",checkBoxType:s="square",appearance:p})=>ht.createElement(ht.Fragment,null,ht.createElement(_a,{className:l("checklistStepsContainer",p),appearance:p,style:{...n}},i==="left"&&e&&ht.createElement(ki,{className:l("checklistStepLabel",p),style:o},e),ht.createElement(ut,{appearance:p,value:t,type:s,primaryColor:r}),i==="right"&&e&&ht.createElement(ki,{className:l("checklistStepLabel",p),style:o},e)),ht.createElement(te,{appearance:p}));import{motion as za}from"framer-motion";import Jt from"styled-components";var vi=Jt.div`
|
|
567
645
|
font-weight: 700;
|
|
568
646
|
font-size: 18px;
|
|
569
647
|
line-height: 22px;
|
|
570
|
-
`,
|
|
648
|
+
`,Ei=Jt.p`
|
|
571
649
|
font-weight: 700;
|
|
572
650
|
font-size: 18px;
|
|
573
651
|
line-height: 22px;
|
|
574
652
|
margin: 20px 0px 0px 0px;
|
|
575
653
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
576
|
-
`,
|
|
654
|
+
`,Bi=Jt.p`
|
|
577
655
|
font-weight: 400;
|
|
578
656
|
font-size: 15px;
|
|
579
657
|
line-height: 28px;
|
|
580
658
|
max-width: 540px;
|
|
581
659
|
margin: 8px 0px 0px 0px;
|
|
582
660
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextSecondary}};
|
|
583
|
-
`,
|
|
661
|
+
`,Po=Jt.div`
|
|
584
662
|
width: 4px;
|
|
585
663
|
position: absolute;
|
|
586
664
|
left: 0;
|
|
@@ -588,35 +666,35 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
588
666
|
height: 80%;
|
|
589
667
|
border-top-right-radius: 8px;
|
|
590
668
|
border-bottom-right-radius: 8px;
|
|
591
|
-
`,
|
|
669
|
+
`,Ai=Jt.div`
|
|
592
670
|
flex-direction: row;
|
|
593
671
|
justify-content: flex-start;
|
|
594
|
-
`;var
|
|
672
|
+
`;var Ii=({data:e,index:t,isSelected:o,primaryColor:i,style:n,onClick:r,appearance:s})=>{var p,d;return vo.createElement("div",{style:{position:"relative",paddingLeft:"20px"},onClick:()=>{r()}},o&&vo.createElement(Po,{className:l("checklistStepItemSelectedIndicator",s),as:za.div,layoutId:"checklis-step-selected",style:{backgroundColor:((p=s==null?void 0:s.theme)==null?void 0:p.colorPrimary)??i}}),vo.createElement(Ai,{className:l("checklistStepItem",s),key:`hero-checklist-step-${t}`,role:"listitem"},vo.createElement(ko,{value:e.complete,labelPosition:"left",label:e.stepName,style:n,primaryColor:((d=s==null?void 0:s.theme)==null?void 0:d.colorPrimary)??i,appearance:s})))};import xt from"react";import{motion as Wa}from"framer-motion";import er from"styled-components";var Ha={backgroundColor:"#E6E6E6"},Va=er.div`
|
|
595
673
|
display: flex;
|
|
596
674
|
flex-direction: ${e=>e.textLocation=="top"?"column":"row"};
|
|
597
675
|
justify-content: flex-start;
|
|
598
676
|
align-items: ${e=>e.textLocation=="top"?"flex-end":"center"};
|
|
599
677
|
|
|
600
|
-
${e=>
|
|
601
|
-
`,
|
|
678
|
+
${e=>dt(e)}
|
|
679
|
+
`,ja=er.div`
|
|
602
680
|
flex-grow: 1;
|
|
603
681
|
position: relative;
|
|
604
682
|
${e=>e.textLocation=="top"?"width: 100%;":""}
|
|
605
|
-
`,
|
|
683
|
+
`,Ga=er.span`
|
|
606
684
|
font-weight: 500;
|
|
607
685
|
font-size: 15px;
|
|
608
686
|
line-height: 18px;
|
|
609
687
|
padding-right: ${e=>e.padding};
|
|
610
688
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextSecondary}};
|
|
611
689
|
margin-bottom: ${e=>e.textLocation=="top"?"8px":"0px"};
|
|
612
|
-
${e=>
|
|
613
|
-
`,
|
|
690
|
+
${e=>dt(e)}
|
|
691
|
+
`,qa={position:"relative",left:0,top:0,width:"100%",minWidth:"40px",height:"10px",borderRadius:"20px"},Ka={position:"absolute",left:0,top:0,height:"10px",borderRadius:"20px"},ze=({count:e,total:t,fillColor:o,bgColor:i=Ha.backgroundColor,display:n="count",textLocation:r="left",style:s={},textStyle:p={},appearance:d})=>{var T,S;if(t===0)return xt.createElement(xt.Fragment,null);let a=e===0?"10px":`${e/t*100}%`,f=n==="compact"?"5px":"10px",c=Math.round(e/t*100),u=n==="compact"?"5px":"20px",w;return n==="count"?w=`${e} of ${t}`:n==="compact"?w=`${c}%`:n==="percent"&&(w=`${c}% complete`),r==="top"&&(u="0px"),xt.createElement(Va,{className:l("progressBarContainer",d),textLocation:r,styleOverrides:s},xt.createElement(Ga,{className:l("progressBarStepText",d),style:{...p,fontSize:n==="compact"?12:15,fontWeight:n==="compact"?400:500},appearance:d,padding:u,textLocation:r},w),xt.createElement(ja,{textLocation:r,className:l("progressBar",d)},xt.createElement(Wa.div,{style:{...Ka,width:a,height:f,backgroundColor:((T=d==null?void 0:d.theme)==null?void 0:T.colorPrimary)??o,zIndex:n=="compact"?1:5},className:l("progressBarFill",d)}),xt.createElement("div",{className:l("progressBarBackground",d),style:{...qa,height:f,backgroundColor:((S=d==null?void 0:d.theme)==null?void 0:S.colorSecondary)??i}})))};import Zt from"react";import Ya from"styled-components";import Bo from"react";import Eo from"react";var It=({stepData:e,appearance:t})=>Eo.createElement(Eo.Fragment,null,Eo.createElement(Ei,{appearance:t,className:l("checklistStepTitle",t),dangerouslySetInnerHTML:ce(e.title)}),Eo.createElement(Bi,{appearance:t,className:l("checklistStepSubtitle",t),dangerouslySetInnerHTML:ce(e.subtitle)}));import Qt from"react";var Nt=({stepData:e,appearance:t})=>{let o=()=>{e.handlePrimaryButtonClick&&e.handlePrimaryButtonClick()},i=()=>{e.handleSecondaryButtonClick&&e.handleSecondaryButtonClick()};return Qt.createElement(Qt.Fragment,null,Qt.createElement(So,null,e.secondaryButtonTitle&&Qt.createElement(Z,{appearance:t,secondary:!0,title:e.secondaryButtonTitle,onClick:i,style:{width:"auto",marginRight:"12px"}}),Qt.createElement(Z,{appearance:t,title:e.primaryButtonTitle,onClick:o})))};var Lt=({stepData:e,appearance:t})=>Bo.createElement(Bo.Fragment,null,Bo.createElement(It,{stepData:e,appearance:t}),Bo.createElement(Nt,{stepData:e,appearance:t}));import Ni from"react";function Li(e){if(e.videoUri.includes("youtube")){let t=e.videoUri.split("v=")[1],o=t.indexOf("&");return o!==-1&&(t=t.substring(0,o)),Ni.createElement("iframe",{width:"480",height:"260",src:`https://www.youtube.com/embed/${t}`,frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0,className:l("checklistStepVideo",e.appearance)})}else return Ni.createElement("video",{width:"480",height:"260",controls:!0,src:e.videoUri})}var tr="default",Xa=Ya.img`
|
|
614
692
|
border-radius: 4px;
|
|
615
693
|
max-height: 260px;
|
|
616
694
|
min-height: 200px;
|
|
617
|
-
`,
|
|
695
|
+
`,Oi=({stepData:e,appearance:t})=>{if(e!=null&&e.StepContent){let o=e.StepContent;return Zt.createElement("div",null,o)}return Zt.createElement(vi,{className:l("checklistStepContent",t)},e.imageUri?Zt.createElement(Xa,{className:l("checklistStepImage",t),src:e.imageUri,style:e.imageStyle}):null,e.videoUri?Zt.createElement(Li,{videoUri:e.videoUri,appearance:t}):null,Zt.createElement(Lt,{stepData:e,appearance:t}))};import Ee,{useRef as Ja,useState as Qa}from"react";import Ot from"styled-components";var Di=Ot.div`
|
|
618
696
|
display: block;
|
|
619
|
-
`,
|
|
697
|
+
`,Za=Ot.div`
|
|
620
698
|
display: flex;
|
|
621
699
|
flex-direction: row;
|
|
622
700
|
flex-wrap: wrap;
|
|
@@ -626,20 +704,20 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
626
704
|
align-content: center;
|
|
627
705
|
margin-top: 24px;
|
|
628
706
|
margin-bottom: 24px;
|
|
629
|
-
`,
|
|
707
|
+
`,Ra=Ot.div`
|
|
630
708
|
display: flex;
|
|
631
709
|
align-items: center;
|
|
632
710
|
justify-content: flex-start;
|
|
633
711
|
flex-direction: column;
|
|
634
712
|
margin-right: 16px;
|
|
635
|
-
`,
|
|
713
|
+
`,ep=Ot.video`
|
|
636
714
|
width: 200px;
|
|
637
715
|
height: 120px;
|
|
638
|
-
`,
|
|
716
|
+
`,tp=Ot.div`
|
|
639
717
|
font-size: 14px;
|
|
640
718
|
line-height: 20px;
|
|
641
719
|
text-align: center;
|
|
642
|
-
`,
|
|
720
|
+
`,op=Ot.div`
|
|
643
721
|
position: absolute;
|
|
644
722
|
width: 200px;
|
|
645
723
|
height: 120px;
|
|
@@ -659,9 +737,9 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
659
737
|
box-shadow: 0px 6px 25px rgba(0, 0, 0, 0.06);
|
|
660
738
|
border-radius: 50%;
|
|
661
739
|
}
|
|
662
|
-
|
|
740
|
+
`,$i="videoCarousel",Mi=({stepData:e,appearance:t})=>{var n;if(!((n=e.props)!=null&&n.videos))return Ee.createElement(Di,null,Ee.createElement(Lt,{stepData:e,appearance:t}));function o({video:r}){let s=Ja(),[p,d]=Qa(!1);return Ee.createElement(Ra,null,!p&&Ee.createElement(op,{onClick:()=>{d(!0),s.current.play()},appearance:t},Ee.createElement(yo,null)),Ee.createElement(ep,{controls:p,ref:s,play:p,src:r.uri}),Ee.createElement(tp,null,r.title))}let i=e.props;return i.videos?Ee.createElement(Di,null,Ee.createElement(It,{stepData:e,appearance:t}),Ee.createElement(Za,null,i.videos.map((r,s)=>Ee.createElement("span",{key:`${r.uri}-${s}`},Ee.createElement(o,{video:r})))),Ee.createElement(Nt,{stepData:e,appearance:t})):null};import Ye from"react";import Ao from"styled-components";var Ui=Ao.div`
|
|
663
741
|
display: block;
|
|
664
|
-
`,
|
|
742
|
+
`,rp=Ao.pre`
|
|
665
743
|
display: block;
|
|
666
744
|
background-color: #2a2a2a;
|
|
667
745
|
color: #f8f8f8;
|
|
@@ -677,68 +755,68 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
677
755
|
white-space: -o-pre-wrap; /* Opera 7 */
|
|
678
756
|
word-wrap: break-word; /* Internet Explorer 5.5+ */
|
|
679
757
|
margin-bottom: 24px;
|
|
680
|
-
`,
|
|
758
|
+
`,ip=Ao.div`
|
|
681
759
|
font-size: 15px;
|
|
682
760
|
line-height: 20px;
|
|
683
761
|
margin-bottom: 12px;
|
|
684
762
|
margin-top: 12px;
|
|
685
|
-
`,
|
|
763
|
+
`,np=Ao.div`
|
|
686
764
|
margin-top: 24px;
|
|
687
|
-
`,
|
|
765
|
+
`,_i="codeSnippet",zi=({stepData:e,appearance:t})=>{var i;if(!((i=e.props)!=null&&i.codeSnippets))return Ye.createElement(Ui,null,Ye.createElement(Lt,{stepData:e,appearance:t}));let o=e.props;return o.codeSnippets?Ye.createElement(Ui,null,Ye.createElement(It,{stepData:e,appearance:t}),Ye.createElement(np,null,o.codeSnippets.map((n,r)=>Ye.createElement("div",{key:r},n.title?Ye.createElement(ip,null,n.title):null,n.code?Ye.createElement(rp,null,n.code):null))),Ye.createElement(Nt,{stepData:e,appearance:t})):null};var lp=Ct.div`
|
|
688
766
|
display: flex;
|
|
689
767
|
flex-direction: row;
|
|
690
768
|
min-width: ${e=>e.type!="modal"?"1000px":"100%"};
|
|
691
769
|
background: ${e=>{var t;return(t=e.appearance)==null?void 0:t.theme.colorBackground}};
|
|
692
770
|
box-shadow: ${e=>e.type!="modal"?"0px 6px 25px rgba(0, 0, 0, 0.06)":"none"};
|
|
693
771
|
border-radius: 8px;
|
|
694
|
-
`,
|
|
772
|
+
`,ap=Ct.h1`
|
|
695
773
|
font-size: 24px;
|
|
696
774
|
font-weight: 600;
|
|
697
775
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
698
|
-
`,
|
|
776
|
+
`,pp=Ct.h2`
|
|
699
777
|
font-size: 15px;
|
|
700
778
|
line-height: 20px;
|
|
701
779
|
color: ${e=>{var t,o;return((o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextSecondary)??"#4d4d4d"}};
|
|
702
780
|
margin: 10px 0px 0px 0px;
|
|
703
|
-
`,
|
|
781
|
+
`,Wi=Ct.div`
|
|
704
782
|
padding-bottom: 16px;
|
|
705
|
-
`,
|
|
783
|
+
`,dp=Ct.div`
|
|
706
784
|
list-style: none;
|
|
707
785
|
padding: 0;
|
|
708
786
|
margin: 0;
|
|
709
787
|
cursor: pointer;
|
|
710
788
|
width: 300px;
|
|
711
|
-
`,
|
|
789
|
+
`,cp=Ct.div`
|
|
712
790
|
width: 1px;
|
|
713
791
|
margin: 40px;
|
|
714
792
|
background: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBorder}};
|
|
715
|
-
`,
|
|
793
|
+
`,mp=Ct.div`
|
|
716
794
|
flex: 2;
|
|
717
795
|
padding: 2rem;
|
|
718
|
-
`,
|
|
796
|
+
`,up=({title:e,subtitle:t,steps:o=[],style:i={},selectedStep:n,setSelectedStep:r,className:s="",customStepTypes:p=new Map,appearance:d,type:a})=>{let{mergeAppearanceWithDefault:f}=J();d=f(d);let u={...{[tr]:Oi,[$i]:Mi,[_i]:zi},...p},[w,T]=sp(0),S=n??w,C=r??T,P=o.filter(B=>B.complete===!0).length,v=()=>{var B;return!((B=o[S])!=null&&B.type)||!u[o[S].type]?u[tr]({stepData:o[S],appearance:d}):u[o[S].type]({stepData:o[S],appearance:d})};return $e.createElement(lp,{type:a,style:i,className:s,appearance:d},$e.createElement(Wi,{style:{flex:1}},$e.createElement(Wi,{style:{padding:"30px 0px 30px 30px",borderBottom:"none"}},$e.createElement(ap,{className:l("checklistTitle",d),appearance:d},e),$e.createElement(pp,{className:l("checklistSubtitle",d),appearance:d},t),$e.createElement(ze,{total:o.length,count:P,fillColor:d.theme.colorPrimary,style:{marginTop:"24px"},appearance:d})),$e.createElement(dp,{className:l("checklistStepsContainer",d)},o.map((B,y)=>$e.createElement(Ii,{data:B,index:y,key:y,listLength:o.length,isSelected:y===S,primaryColor:d.theme.colorPrimary,style:{justifyContent:"space-between"},onClick:()=>{C(y)}})))),$e.createElement(cp,{appearance:d,className:l("checklistDivider",d)}),$e.createElement(mp,null,$e.createElement(v,null)))},or=up;import M,{useState as Sp}from"react";import Hi from"react";import fp from"styled-components";var gp=fp.svg`
|
|
719
797
|
transition: 'transform 0.35s ease-in-out';
|
|
720
|
-
`,Dt=({color:e="#323232",style:t,className:o})=>
|
|
798
|
+
`,Dt=({color:e="#323232",style:t,className:o})=>Hi.createElement(gp,{width:"7",height:"10",viewBox:"0 0 9 15",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:t,className:o},Hi.createElement("path",{d:"M1 13L7.5 7L0.999999 1",stroke:e,strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"}));import{motion as yp}from"framer-motion";import me from"styled-components";var rr={boxShadow:"0px 6px 25px rgba(0, 0, 0, 0.06)",padding:"32px",maxHeight:"700px",msOverflowStyle:"none",scrollbarWidth:"none",paddingBottom:"12px",minHeight:"610px"},Vi=me.div`
|
|
721
799
|
max-height: 350px;
|
|
722
800
|
padding-bottom: 40px;
|
|
723
|
-
`,
|
|
801
|
+
`,ji=me.div`
|
|
724
802
|
display: flex;
|
|
725
803
|
flex-direction: column;
|
|
726
804
|
margin-top: 20px;
|
|
727
|
-
`,
|
|
805
|
+
`,Gi=me.h1`
|
|
728
806
|
font-style: normal;
|
|
729
807
|
font-weight: 600;
|
|
730
808
|
font-size: 30px;
|
|
731
809
|
line-height: 36px;
|
|
732
810
|
margin-bottom: 16px;
|
|
733
811
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
734
|
-
|
|
812
|
+
`,qi=me.h2`
|
|
735
813
|
font-weight: 400;
|
|
736
814
|
font-size: 16px;
|
|
737
815
|
line-height: 20px;
|
|
738
816
|
margin-bottom: 16px;
|
|
739
817
|
padding-left: 1px;
|
|
740
818
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextSecondary}};
|
|
741
|
-
`,
|
|
819
|
+
`,Ki=me.div`
|
|
742
820
|
${e=>k(e)} {
|
|
743
821
|
border: 1px solid #fafafa;
|
|
744
822
|
}
|
|
@@ -748,11 +826,11 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
748
826
|
flex-direction: column;
|
|
749
827
|
min-height: 240px;
|
|
750
828
|
overflow: hidden;
|
|
751
|
-
`,
|
|
829
|
+
`,Yi=me.div`
|
|
752
830
|
display: flex;
|
|
753
831
|
flex-direction: row;
|
|
754
832
|
justify-content: space-between;
|
|
755
|
-
`,
|
|
833
|
+
`,Xi=me.p`
|
|
756
834
|
${e=>k(e)} {
|
|
757
835
|
font-weight: 400;
|
|
758
836
|
font-size: 10px;
|
|
@@ -761,12 +839,12 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
761
839
|
color: #8c8c8c;
|
|
762
840
|
margin: 20px;
|
|
763
841
|
}
|
|
764
|
-
`,
|
|
842
|
+
`,Ji=me.div`
|
|
765
843
|
display: flex;
|
|
766
844
|
flex-direction: row;
|
|
767
|
-
`,
|
|
845
|
+
`,Qi=me.div`
|
|
768
846
|
flex: 1;
|
|
769
|
-
`,
|
|
847
|
+
`,Zi=me.div`
|
|
770
848
|
${e=>k(e)} {
|
|
771
849
|
display: flex;
|
|
772
850
|
justify-content: center;
|
|
@@ -776,7 +854,7 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
776
854
|
padding-left: 8px;
|
|
777
855
|
padding-right: 8px;
|
|
778
856
|
}
|
|
779
|
-
`,
|
|
857
|
+
`,Ri=me.p`
|
|
780
858
|
${e=>k(e)} {
|
|
781
859
|
font-style: normal;
|
|
782
860
|
font-weight: 600;
|
|
@@ -788,7 +866,7 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
788
866
|
margin-top: 20px;
|
|
789
867
|
margin-bottom: 16px;
|
|
790
868
|
}
|
|
791
|
-
`,
|
|
869
|
+
`,en=me.p`
|
|
792
870
|
${e=>k(e)} {
|
|
793
871
|
font-weight: 400;
|
|
794
872
|
font-size: 14px;
|
|
@@ -797,14 +875,14 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
797
875
|
color: ${e=>e.appearance.theme.colorTextSecondary};
|
|
798
876
|
margin-bottom: 8px;
|
|
799
877
|
}
|
|
800
|
-
`,
|
|
878
|
+
`,tn=me.div`
|
|
801
879
|
${e=>k(e)} {
|
|
802
880
|
display: flex;
|
|
803
881
|
flex-direction: row;
|
|
804
882
|
justify-content: center;
|
|
805
883
|
gap: 8px;
|
|
806
884
|
}
|
|
807
|
-
`,
|
|
885
|
+
`,on=me.div`
|
|
808
886
|
${e=>k(e)} {
|
|
809
887
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
810
888
|
background-color: ${e=>e.selected?"#FAFAFA":"#FFFFFF"};
|
|
@@ -824,7 +902,7 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
824
902
|
justify-content: space-between;
|
|
825
903
|
position: relative;
|
|
826
904
|
cursor: pointer;
|
|
827
|
-
`,
|
|
905
|
+
`,rn=me.p`
|
|
828
906
|
${e=>k(e)} {
|
|
829
907
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
830
908
|
color: ${e=>e.selected?"#434343":"#BFBFBF"};
|
|
@@ -833,12 +911,12 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
833
911
|
font-size: 14px;
|
|
834
912
|
line-height: 22px;
|
|
835
913
|
margin: 0;
|
|
836
|
-
`,
|
|
914
|
+
`,nn=me.div`
|
|
837
915
|
display: flex;
|
|
838
916
|
flex-direction: row;
|
|
839
917
|
justify-content: flex-end;
|
|
840
918
|
align-content: center;
|
|
841
|
-
`,
|
|
919
|
+
`,sn=me.div`
|
|
842
920
|
display: flex;
|
|
843
921
|
flex: 1;
|
|
844
922
|
flex-direction: row;
|
|
@@ -846,14 +924,14 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
846
924
|
align-content: center;
|
|
847
925
|
align-items: center;
|
|
848
926
|
margin-right: 20px;
|
|
849
|
-
`,
|
|
927
|
+
`,ln=me.div`
|
|
850
928
|
display: block;
|
|
851
929
|
width: 100%;
|
|
852
|
-
`;import
|
|
930
|
+
`;import hp from"styled-components";var an=hp.div`
|
|
853
931
|
flex-direction: column;
|
|
854
932
|
justify-content: center;
|
|
855
933
|
display: flex;
|
|
856
|
-
`;import Je from"react";import{motion as
|
|
934
|
+
`;import Je from"react";import{motion as xp}from"framer-motion";import Xe from"styled-components";var pn=Xe.div`
|
|
857
935
|
border: 1px solid #fafafa;
|
|
858
936
|
box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.05);
|
|
859
937
|
border-radius: 14px;
|
|
@@ -861,13 +939,13 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
861
939
|
display: flex;
|
|
862
940
|
flex-direction: column;
|
|
863
941
|
overflow: hidden;
|
|
864
|
-
`,
|
|
942
|
+
`,dn=Xe.div`
|
|
865
943
|
display: flex;
|
|
866
944
|
flex-wrap: wrap;
|
|
867
945
|
justify-content: space-between;
|
|
868
946
|
overflow: hidden;
|
|
869
947
|
row-gap: 10px;
|
|
870
|
-
`,
|
|
948
|
+
`,cn=Xe.div`
|
|
871
949
|
${e=>k(e)} {
|
|
872
950
|
color: #595959;
|
|
873
951
|
}
|
|
@@ -877,7 +955,7 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
877
955
|
line-height: 12px;
|
|
878
956
|
letter-spacing: 0.09em;
|
|
879
957
|
margin-bottom: 12px;
|
|
880
|
-
`,
|
|
958
|
+
`,mn=Xe.div`
|
|
881
959
|
${e=>k(e)} {
|
|
882
960
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
883
961
|
background: #ffffff;
|
|
@@ -890,7 +968,7 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
890
968
|
|
|
891
969
|
max-width: 150px;
|
|
892
970
|
min-width: 200px;
|
|
893
|
-
`,
|
|
971
|
+
`,un=Xe.div`
|
|
894
972
|
${e=>k(e)} {
|
|
895
973
|
background: radial-gradient(50% 50% at 50% 50%, #ffffff 0%, #f7f7f7 100%);
|
|
896
974
|
}
|
|
@@ -902,13 +980,13 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
902
980
|
justify-content: center;
|
|
903
981
|
align-content: center;
|
|
904
982
|
align-items: center;
|
|
905
|
-
`,
|
|
983
|
+
`,fn=Xe.div`
|
|
906
984
|
font-weight: 600;
|
|
907
985
|
font-size: 20px;
|
|
908
986
|
line-height: 24px;
|
|
909
987
|
width: 20px;
|
|
910
988
|
height: 20px;
|
|
911
|
-
`,
|
|
989
|
+
`,gn=Xe.div`
|
|
912
990
|
${e=>k(e)} {
|
|
913
991
|
color: #434343;
|
|
914
992
|
}
|
|
@@ -917,20 +995,20 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
917
995
|
line-height: 17px;
|
|
918
996
|
margin-top: 12px;
|
|
919
997
|
margin-bottom: 8px;
|
|
920
|
-
`,
|
|
998
|
+
`,hn=Xe.div`
|
|
921
999
|
${e=>k(e)} {
|
|
922
1000
|
color: #8c8c8c;
|
|
923
1001
|
}
|
|
924
1002
|
font-weight: 400;
|
|
925
1003
|
font-size: 12px;
|
|
926
1004
|
line-height: 14px;
|
|
927
|
-
`,
|
|
1005
|
+
`,xn=Xe.a`
|
|
928
1006
|
color: ${e=>e.color};
|
|
929
1007
|
font-size: 12px;
|
|
930
1008
|
line-height: 14px;
|
|
931
1009
|
font-weight: 400;
|
|
932
1010
|
cursor: pointer;
|
|
933
|
-
`;var
|
|
1011
|
+
`;var Cp=({steps:e,style:t,title:o,primaryColor:i,appearance:n,onButtonClick:r})=>{let{primaryCTAClickSideEffects:s}=re();return Je.createElement(pn,{style:t,className:l("guideContainer",n)},Je.createElement(cn,{className:l("guideTitle",n)},o),Je.createElement(dn,{className:l("guideItemContainer",n)},e.map((p,d)=>Je.createElement(mn,{key:`guide-${p.id??d}`,as:xp.div,whileHover:{boxShadow:"0px 2px 8px rgba(0, 0, 0, 0.05)",transition:{duration:.25}},className:l("guideItem",n)},p.icon&&Je.createElement(un,{className:l("guideIcon",n)},Je.createElement(fn,null,p.icon)),Je.createElement(gn,{className:l("guideItemTitle",n),dangerouslySetInnerHTML:ce(p.title)}),Je.createElement(hn,{className:l("guideItemSubtitle",n),dangerouslySetInnerHTML:ce(p.subtitle)}),Je.createElement(xn,{className:l("guideItemLink",n),color:i,onClick:()=>{p.primaryButtonUri&&s(p),r&&r(p)}},p.primaryButtonTitle)))))},Rt=Cp;var bp=({steps:e,title:t,subtitle:o,stepsTitle:i,visible:n,onClose:r,selectedStep:s,setSelectedStep:p,customStepTypes:d,appearance:a,guideData:f,guideTitle:c,onGuideButtonClick:u})=>{let w=({stepData:m,handleSecondaryCTAClick:x,handleCTAClick:F})=>m?M.createElement(Zi,{className:l("checklistStepContainer",a),"data-testid":"checklistStepContainer"},M.createElement(Ri,{appearance:a,className:l("checklistStepTitle",a),dangerouslySetInnerHTML:ce(m.title)}),M.createElement(en,{appearance:a,className:l("checklistStepSubtitle",a),dangerouslySetInnerHTML:ce(m.subtitle)}),M.createElement(tn,{className:l("checklistCTAContainer",a)},m.secondaryButtonTitle&&M.createElement(Z,{title:m.secondaryButtonTitle,onClick:x,appearance:a,secondary:!0}),M.createElement(Z,{title:m.primaryButtonTitle,onClick:F,appearance:a}))):M.createElement(M.Fragment,null),S={...{default:m=>{var _;if((_=e[v])!=null&&_.StepContent){let z=e[v].StepContent;return M.createElement("div",null,z)}let x=e[v];return M.createElement(w,{stepData:m,handleCTAClick:()=>{x.handlePrimaryButtonClick&&x.handlePrimaryButtonClick()},handleSecondaryCTAClick:()=>{x.handleSecondaryButtonClick&&x.handleSecondaryButtonClick()}})}},...d},[C,P]=Sp(0),v=s??C,B=p??P,y=()=>{var m;return e?!((m=e[v])!=null&&m.type)||!S[e[v].type]?S.default(e[v]):S[e[v].type]({stepData:e[v],primaryColor:a.theme.colorPrimary}):M.createElement(M.Fragment,null)},h=e.filter(m=>m.complete).length;return n?(a.theme.modalContainer||(a.theme.borderRadius&&(rr.borderRadius=a.theme.borderRadius+"px"),a.theme.modalContainer=rr),M.createElement(et,{onClose:r,visible:n,appearance:a},M.createElement(ln,null,M.createElement(ji,null,M.createElement(Gi,{appearance:a,className:l("checklistTitle",a)},t),M.createElement(qi,{appearance:a,className:l("checklistSubtitle",a)},o)),M.createElement(Vi,null,e&&e.length>0&&M.createElement(Ki,{className:l("stepsContainer",a)},M.createElement(Yi,null,M.createElement("div",{style:{flex:3}},M.createElement(Xi,{className:l("stepsTitle",a)},i)),M.createElement(sn,null,M.createElement(ze,{fillColor:a.theme.colorPrimary,style:{width:"100%"},count:h,total:e.length,appearance:a}))),M.createElement(Ji,null,M.createElement(Qi,{className:l("checklistStepListContainer",a),appearance:a},e.map((m,x)=>{let F=v===x;return M.createElement(on,{selected:F,className:l(`checklistStepListItem${F?"Selected":""}`,a),key:`checklist-guide-step-${m.id??x}`,disabled:m.blocked,onClick:()=>{m.blocked||B(x)},title:m.blocked?"Finish remaining steps to continue":void 0},F&&M.createElement(Po,{className:l("checklistStepItemSelectedIndicator",a),as:yp.div,layoutId:"checklist-step-selected",style:{backgroundColor:a.theme.colorPrimary,borderRadius:0,height:"100%",top:"0%",width:"2px"}}),M.createElement(rn,{selected:F,className:l(`checklistStepListStepName${F?"Selected":""}`,a)},m.stepName),M.createElement(nn,null,M.createElement(ut,{value:m.complete,type:"round",primaryColor:a.theme.colorPrimary,progress:m.progress,appearance:a}),M.createElement(an,null,M.createElement(Dt,{style:{marginLeft:"10px"},color:a.theme.colorBackgroundSecondary}))))})),M.createElement(y,null))),f&&f.length>0&&M.createElement(Rt,{steps:f,title:c,primaryColor:a.theme.colorPrimary,style:{border:"none",boxShadow:"none"},appearance:a,onButtonClick:m=>(u&&u(m),!0)}))))):M.createElement(M.Fragment,null)},ir=bp;import{useEffect as wp,useState as Tp}from"react";var Cn=()=>{let e={isSmall:"(max-width: 480px)",isMedium:"(min-width: 481px) AND (max-width: 1023px)",isLarge:"(min-width: 1025px)"},t=Object.fromEntries(Object.entries(e).map(([p])=>[p,!1])),[o,i]=Tp(t),n=null,r=()=>{n!==null?clearTimeout(n):s(),n=setTimeout(()=>{s()},16)},s=()=>{let p=Object.fromEntries(Object.entries(e).map(([d,a])=>{if(!window)return[d,!1];let f=window.matchMedia(a);return f.addEventListener("change",r),[d,f.matches]}));i(p)};return wp(()=>{s()},[]),o};import Fe,{useEffect as Ln,useState as Pp}from"react";import ue from"react";import{AnimatePresence as Fp,motion as kp}from"framer-motion";import Qe from"styled-components";var Sn=Qe.div`
|
|
934
1012
|
background-color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBackground}};
|
|
935
1013
|
border: 1px solid;
|
|
936
1014
|
border-color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBorder}};
|
|
@@ -942,42 +1020,42 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
942
1020
|
display: flex;
|
|
943
1021
|
flex-direction: column;
|
|
944
1022
|
transition: max-height 0.25s;
|
|
945
|
-
`,
|
|
1023
|
+
`,yn=Qe.div`
|
|
946
1024
|
display: flex;
|
|
947
1025
|
margin-bottom: 20px;
|
|
948
|
-
`,
|
|
1026
|
+
`,bn=Qe.img`
|
|
949
1027
|
border-radius: 4px;
|
|
950
1028
|
max-height: 260px;
|
|
951
1029
|
min-height: 200px;
|
|
952
|
-
`,
|
|
1030
|
+
`,wn=Qe.div`
|
|
953
1031
|
display: flex;
|
|
954
1032
|
flex-direction: row;
|
|
955
1033
|
justify-content: space-between;
|
|
956
1034
|
align-items: center;
|
|
957
|
-
`,
|
|
1035
|
+
`,Tn=Qe.p`
|
|
958
1036
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
959
1037
|
font-style: normal;
|
|
960
1038
|
font-weight: 500;
|
|
961
1039
|
font-size: 16px;
|
|
962
1040
|
line-height: 18px;
|
|
963
1041
|
margin-left: 8px;
|
|
964
|
-
`,
|
|
1042
|
+
`,Fn=Qe.div`
|
|
965
1043
|
padding: 20px;
|
|
966
1044
|
cursor: pointer;
|
|
967
1045
|
:hover {
|
|
968
1046
|
opacity: 0.8;
|
|
969
1047
|
}
|
|
970
|
-
`,
|
|
1048
|
+
`,mx=Qe.div``,kn=Qe.p`
|
|
971
1049
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
972
1050
|
font-weight: 400;
|
|
973
1051
|
font-size: 14px;
|
|
974
1052
|
line-height: 22px;
|
|
975
|
-
`,
|
|
1053
|
+
`,Pn=Qe.div`
|
|
976
1054
|
display: flex;
|
|
977
1055
|
flex-direction: row;
|
|
978
1056
|
justify-content: flex-start;
|
|
979
1057
|
align-items: center;
|
|
980
|
-
`;var
|
|
1058
|
+
`;var vn=({stepData:e,collapsed:t,onClick:o,onPrimaryButtonClick:i,onSecondaryButtonClick:n,appearance:r,customStepTypes:s})=>{var f,c;let p=t?{}:{transform:"rotate(90deg)"};function d(){return ue.createElement(ue.Fragment,null,e.imageUri||e.videoUri?ue.createElement(yn,{className:l("stepMediaContainer",r)},e.imageUri?ue.createElement(bn,{className:l("stepImage",r),src:e.imageUri,style:e.imageStyle}):null,e.videoUri?ue.createElement(Et,{appearance:r,videoUri:e.videoUri}):null):null,ue.createElement(kn,{className:l("stepSubtitle",r),appearance:r,dangerouslySetInnerHTML:ce(e.subtitle)}),ue.createElement(So,{className:l("checklistCTAContainer",r)},e.secondaryButtonTitle?ue.createElement(Z,{secondary:!0,title:e.secondaryButtonTitle,onClick:()=>n(),appearance:r}):null,ue.createElement(Z,{title:e.primaryButtonTitle??"Continue",onClick:()=>i(),appearance:r})))}function a(){if(!s)return null;let u=s[e.type];return u?u(e,r):null}return ue.createElement(Sn,{onClick:()=>t?o():null,"data-testid":`step-${e.id}`,className:l("checklistStepContainer",r),appearance:r},ue.createElement(wn,{className:l("stepHeader",r)},ue.createElement(Pn,null,ue.createElement(ko,{value:e.complete,style:{width:"auto",borderTop:0},primaryColor:(f=r==null?void 0:r.theme)==null?void 0:f.colorPrimary,appearance:r}),ue.createElement(Tn,{appearance:r,className:l("stepTitle",r),dangerouslySetInnerHTML:ce(e.title)})),ue.createElement(Fn,{className:l("stepChevronContainer",r),onClick:()=>o()},ue.createElement(Dt,{style:{...p,transition:"transform 0.1s ease-in-out"},color:(c=r==null?void 0:r.theme)==null?void 0:c.colorTextSecondary}))),ue.createElement(Fp,null,!t&&ue.createElement(kp.div,{initial:{opacity:1,height:0},animate:{opacity:1,height:"auto"},exit:{opacity:1,height:0},key:e.id,style:{overflow:"hidden"}},a()??d())))};import $t from"styled-components";var Px=$t.div`
|
|
981
1059
|
background: #ffffff;
|
|
982
1060
|
box-shadow: 0px 6px 25px rgba(0, 0, 0, 0.06);
|
|
983
1061
|
border-radius: 6px;
|
|
@@ -991,49 +1069,49 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
991
1069
|
|
|
992
1070
|
max-width: 800px;
|
|
993
1071
|
min-width: 350px;
|
|
994
|
-
`,
|
|
1072
|
+
`,En=$t.div`
|
|
995
1073
|
display: flex;
|
|
996
1074
|
flex-direction: column;
|
|
997
|
-
`,
|
|
1075
|
+
`,Bn=$t.h1`
|
|
998
1076
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
999
1077
|
font-style: normal;
|
|
1000
1078
|
font-weight: 700;
|
|
1001
1079
|
font-size: 20px;
|
|
1002
1080
|
line-height: 24px;
|
|
1003
1081
|
margin-bottom: 8px;
|
|
1004
|
-
`,
|
|
1082
|
+
`,An=$t.h2`
|
|
1005
1083
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextSecondary}};
|
|
1006
1084
|
font-weight: 400;
|
|
1007
1085
|
font-size: 14px;
|
|
1008
1086
|
line-height: 23px;
|
|
1009
1087
|
margin: 2px 0 0 0;
|
|
1010
|
-
`,
|
|
1088
|
+
`,In=$t.div`
|
|
1011
1089
|
display: block;
|
|
1012
1090
|
width: 100%;
|
|
1013
|
-
`,
|
|
1091
|
+
`,Nn=$t.div`
|
|
1014
1092
|
display: flex;
|
|
1015
1093
|
width: 100%;
|
|
1016
1094
|
flex-direction: column;
|
|
1017
1095
|
justify-content: space-between;
|
|
1018
1096
|
background-color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBackground}};
|
|
1019
1097
|
border-radius: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.borderRadius}}px;
|
|
1020
|
-
`;var
|
|
1098
|
+
`;var vp=({title:e,subtitle:t,steps:o,onClose:i,visible:n,onCompleteStep:r,autoExpandFirstIncompleteStep:s=!0,autoCollapse:p=!0,autoExpandNextStep:d=!0,primaryColor:a="#000000",selectedStep:f,setSelectedStep:c,appearance:u,type:w,className:T,customStepTypes:S})=>{let C=o.filter(m=>m.complete).length,[P,v]=Pp(Array(o.length).fill(!0));Ln(()=>{let m=[...P];if(s){for(let x=0;x<o.length;x++)if(!o[x].complete){m[x]=!1;break}v(m)}},[]),Ln(()=>{B(f)},[f]);let B=m=>{let x=[...P];if(p)for(let F=0;F<P.length;++F)F!==m&&(x[F]=!0);x[m]=!x[m],v(x)};if(!n&&w=="modal")return Fe.createElement(Fe.Fragment,null);let y=Fe.createElement(Fe.Fragment,null,Fe.createElement(En,null,Fe.createElement(Bn,{appearance:u,className:l("checklistTitle",u),dangerouslySetInnerHTML:ce(e)}),Fe.createElement(An,{appearance:u,className:l("checklistSubtitle",u),dangerouslySetInnerHTML:ce(t)})),Fe.createElement(ze,{display:"percent",count:C,total:o.length,fillColor:a,style:{margin:"14px 0px 8px 0px"},appearance:u})),h=Fe.createElement(In,{className:Ce(l("checklistContainer",u),T)},o.map((m,x)=>{let F=P[x];return Fe.createElement(vn,{appearance:u,stepData:m,collapsed:F,key:`modal-checklist-${m.id??x}`,onClick:()=>{if(f===x){B(x);return}c(x)},onPrimaryButtonClick:()=>{r&&r(x,m),m.handlePrimaryButtonClick&&m.handlePrimaryButtonClick(),d&&!m.completionCriteria&&x<P.length-1&&P[x+1]&&c(x+1)},onSecondaryButtonClick:()=>{m.handleSecondaryButtonClick&&m.handleSecondaryButtonClick()},customStepTypes:S})}));return w==="inline"?Fe.createElement(Nn,{appearance:u,className:Ce(l("checklistInlineContainer",u),T)},y,h):Fe.createElement(Fe.Fragment,null,Fe.createElement(et,{onClose:i,visible:n,appearance:u,style:{maxWidth:"600px"},headerContent:y},h))},nr=vp;import le,{useEffect as sr,useRef as Lp,useState as yt}from"react";import St from"react";import se,{css as On,keyframes as Dn}from"styled-components";var $n=On`
|
|
1021
1099
|
border: 1px solid ${({theme:e})=>e.colorBorder};
|
|
1022
|
-
`,
|
|
1100
|
+
`,Ep=On`
|
|
1023
1101
|
box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.06);
|
|
1024
|
-
`,
|
|
1102
|
+
`,Bp=Dn`
|
|
1025
1103
|
from {
|
|
1026
1104
|
opacity: 0;
|
|
1027
1105
|
} to {
|
|
1028
1106
|
opacity: 1;
|
|
1029
1107
|
}
|
|
1030
|
-
`,
|
|
1108
|
+
`,Ap=Dn`
|
|
1031
1109
|
from {
|
|
1032
1110
|
opacity: 1;
|
|
1033
1111
|
} to {
|
|
1034
1112
|
opacity: 0;
|
|
1035
1113
|
}
|
|
1036
|
-
`,
|
|
1114
|
+
`,Mn=se.div`
|
|
1037
1115
|
margin: 0 -20px;
|
|
1038
1116
|
overflow-x: auto;
|
|
1039
1117
|
padding-left: 20px;
|
|
@@ -1050,14 +1128,14 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1050
1128
|
::-webkit-scrollbar {
|
|
1051
1129
|
display: none;
|
|
1052
1130
|
}
|
|
1053
|
-
`,
|
|
1131
|
+
`,Un=se.div`
|
|
1054
1132
|
display: flex;
|
|
1055
1133
|
flex-flow: row nowrap;
|
|
1056
1134
|
gap: 0 16px;
|
|
1057
1135
|
scroll-snap-align: center;
|
|
1058
1136
|
scroll-snap-stop: always;
|
|
1059
|
-
`,
|
|
1060
|
-
animation: ${e=>e.reversed?Bp
|
|
1137
|
+
`,_n=se.div`
|
|
1138
|
+
animation: ${e=>e.reversed?Ap:Bp} 0.25s ease-out;
|
|
1061
1139
|
background: linear-gradient(
|
|
1062
1140
|
to right,
|
|
1063
1141
|
${({theme:e})=>e.colorBackground}00,
|
|
@@ -1065,8 +1143,8 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1065
1143
|
);
|
|
1066
1144
|
position: absolute;
|
|
1067
1145
|
width: 64px;
|
|
1068
|
-
`,
|
|
1069
|
-
${
|
|
1146
|
+
`,zn=se.button`
|
|
1147
|
+
${$n}
|
|
1070
1148
|
box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.1);
|
|
1071
1149
|
align-items: center;
|
|
1072
1150
|
border-radius: 50%;
|
|
@@ -1077,11 +1155,11 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1077
1155
|
justify-content: center;
|
|
1078
1156
|
position: absolute;
|
|
1079
1157
|
width: 48px;
|
|
1080
|
-
`,
|
|
1158
|
+
`,Wn=se.div`
|
|
1081
1159
|
border-radius: ${({theme:e})=>e.borderRadius}px;
|
|
1082
1160
|
padding: 20px;
|
|
1083
|
-
`,
|
|
1084
|
-
${
|
|
1161
|
+
`,Hn=se(Wn)`
|
|
1162
|
+
${$n}
|
|
1085
1163
|
background: ${({theme:e})=>e.colorBackground};
|
|
1086
1164
|
|
|
1087
1165
|
&:active {
|
|
@@ -1092,94 +1170,94 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1092
1170
|
${e=>e.blocked?"":`border: 1px solid ${e.theme.colorPrimary};`}
|
|
1093
1171
|
${e=>e.blocked?"cursor: default":"cursor: pointer"}
|
|
1094
1172
|
}
|
|
1095
|
-
`,
|
|
1173
|
+
`,Vn=se.img`
|
|
1096
1174
|
border-radius: 50%;
|
|
1097
1175
|
height: 40px;
|
|
1098
1176
|
margin-bottom: 12px;
|
|
1099
1177
|
width: 40px;
|
|
1100
|
-
`,
|
|
1178
|
+
`,jn=se(Wn)`
|
|
1101
1179
|
${e=>k(e)} {
|
|
1102
|
-
${
|
|
1180
|
+
${Ep}
|
|
1103
1181
|
|
|
1104
1182
|
background: ${({theme:e})=>e.colorBackground};
|
|
1105
1183
|
}
|
|
1106
|
-
`,
|
|
1184
|
+
`,Gn=se.div`
|
|
1107
1185
|
color: ${({theme:e})=>e.colorPrimary};
|
|
1108
1186
|
display: flex;
|
|
1109
1187
|
flex-flow: row nowrap;
|
|
1110
1188
|
align-items: center;
|
|
1111
1189
|
margin-left: 20px;
|
|
1112
|
-
|
|
1190
|
+
`,qn=se.div`
|
|
1113
1191
|
white-space: nowrap;
|
|
1114
|
-
`,
|
|
1192
|
+
`,Kn=se.div`
|
|
1115
1193
|
background: #d8fed8;
|
|
1116
1194
|
border-radius: 6px;
|
|
1117
1195
|
margin-bottom: 12px;
|
|
1118
1196
|
padding: 4px 10px;
|
|
1119
|
-
`,
|
|
1197
|
+
`,Ip=se.p`
|
|
1120
1198
|
font-weight: bold;
|
|
1121
1199
|
font-size: 18px;
|
|
1122
1200
|
line-height: 22px;
|
|
1123
1201
|
letter-spacing: calc(18px * -0.01);
|
|
1124
1202
|
margin: 0;
|
|
1125
|
-
`,
|
|
1203
|
+
`,Yn=se(Ip)`
|
|
1126
1204
|
margin-bottom: 4px;
|
|
1127
|
-
`,
|
|
1205
|
+
`,Np=se.p`
|
|
1128
1206
|
font-weight: bold;
|
|
1129
1207
|
font-size: 16px;
|
|
1130
1208
|
line-height: 20px;
|
|
1131
1209
|
letter-spacing: calc(16px * -0.01);
|
|
1132
1210
|
margin: 0;
|
|
1133
|
-
`,
|
|
1211
|
+
`,Xn=se(Np)`
|
|
1134
1212
|
margin-bottom: 4px;
|
|
1135
1213
|
${e=>e.blocked||e.complete?"opacity: 0.4;":`
|
|
1136
1214
|
`}
|
|
1137
|
-
`,We=
|
|
1215
|
+
`,We=se.p`
|
|
1138
1216
|
color: ${({theme:e})=>e.colorText};
|
|
1139
1217
|
font-weight: normal;
|
|
1140
1218
|
font-size: 14px;
|
|
1141
1219
|
line-height: 22px;
|
|
1142
1220
|
margin: 0;
|
|
1143
|
-
`,
|
|
1221
|
+
`,Jn=se.p`
|
|
1144
1222
|
color: ${({theme:e})=>e.colorText};
|
|
1145
1223
|
font-weight: 600;
|
|
1146
1224
|
font-size: 12px;
|
|
1147
1225
|
line-height: 16px;
|
|
1148
1226
|
margin: 0;
|
|
1149
|
-
`;We.Loud=
|
|
1227
|
+
`;We.Loud=se(We)`
|
|
1150
1228
|
font-weight: 600;
|
|
1151
|
-
`;We.Quiet=
|
|
1229
|
+
`;We.Quiet=se(We)`
|
|
1152
1230
|
color: ${({theme:e})=>e.colorTextSecondary};
|
|
1153
1231
|
${e=>e.blocked||e.complete?"opacity: 0.4;":`
|
|
1154
1232
|
`}
|
|
1155
|
-
`;var
|
|
1233
|
+
`;var Qn=({stepData:e,style:t={},appearance:o})=>{let{mergeAppearanceWithDefault:i}=J(),{primaryCTAClickSideEffects:n}=re(),{theme:r,styleOverrides:s}=i(o),{imageUri:p=null,subtitle:d=null,title:a=null,complete:f=!1,blocked:c=!1}=e,u=()=>{n(e)};return St.createElement(Hn,{className:l("carouselCard",o),onClick:c?null:u,style:t,blocked:c,complete:f},St.createElement("div",{style:{alignItems:"flex-start",display:"flex",justifyContent:"space-between"}},p&&St.createElement(Vn,{className:l("carouselCardImage",o),src:p,alt:a,style:{opacity:f||c?.4:1}}),f&&St.createElement(Kn,{className:l("carouselCompletedPill",o)},St.createElement(Jn,{style:{color:"#108E0B"}},"Complete"))),a&&St.createElement(Xn,{blocked:c,complete:f,className:l("carouselCardTitle",o)},a),d&&St.createElement(We.Quiet,{blocked:c,complete:f,className:l("carouselCardSubtitle",o)},d))};import eo from"react";var Zn=({numberOfStepsCompleted:e,numberOfSteps:t,appearance:o})=>{let i=t>0?e/t:0,n=200,r=Math.min(n,Math.max(10,Math.round(n*i)));return eo.createElement(Gn,{className:l("carouselProgressBar",o)},eo.createElement(qn,{as:We.Loud,style:{marginRight:8}},e," of ",t),eo.createElement("svg",{height:10,width:n},eo.createElement("rect",{x:0,y:0,rx:5,width:n,height:10,fill:"#E6E6E6"}),eo.createElement("rect",{x:0,y:0,rx:5,width:r,height:10,fill:"currentColor"})))};var Op=()=>le.createElement("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},le.createElement("path",{d:"M14 6L20 12",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round"}),le.createElement("path",{d:"M14 18L20 12",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round"}),le.createElement("path",{d:"M4 12H20",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round"})),Rn=({side:e="left",show:t=!1,onClick:o=()=>{}})=>{let[i,n]=yt(!1),[r,s]=yt(!1);sr(()=>{t===!0&&i===!1?n(!0):t===!1&&i===!0&&s(!0)},[t]);let p=()=>{n(!1),s(!1)},d=e=="left"?{top:0,bottom:0,left:-20,transform:"rotate(180deg)"}:{top:0,bottom:0,right:-20};return i?le.createElement(_n,{style:d,reversed:r,onAnimationEnd:r?p:null},le.createElement(zn,{onClick:()=>o(),style:{right:16,top:"calc(50% - 24px)"}},le.createElement(Op,null))):null},es=({flowId:e,appearance:t,customVariables:o,className:i})=>{let n=Lp(null),[r,s]=yt(!1),[p,d]=yt(!1),[a,f]=yt(null),[c,u]=yt([]),[w,T]=yt(0),{getFlowMetadata:S,getFlowSteps:C,getNumberOfStepsCompleted:P,updateCustomVariables:v,getFlowStatus:B,isLoading:y,targetingLogicShouldHideFlow:h,getFlow:m}=X();sr(()=>{v(o)},[o,y]),sr(()=>{if(y)return;let A=S(e),U=P(e),$=C(e);f(A),A.data!==null&&(u($.sort((N,ie)=>Number(N.complete)-Number(ie.complete))),d($.length>3),T(U))},[y]);let x=[];for(let A=0;A<c.length;A+=3)x.push(c.slice(A,A+3));let F=A=>{let U=A.target,$=U.scrollWidth-U.clientWidth,N=Math.ceil(U.scrollLeft);N>0&&r===!1&&s(!0),N===0&&r===!0&&s(!1),N<$&&p===!1&&d(!0),N===$&&p===!0&&d(!1)},O=(A=!0)=>{let U=A?1:-1;n.current!==null&&n.current.scrollBy({left:n.current.clientWidth*U,behavior:"smooth"})},_=null,z=A=>{_!==null?clearTimeout(_):F(A),_=setTimeout(()=>{F(A)},16)};return y?null:le.createElement(jn,{className:Ce(l("carouselContainer",t),i)},le.createElement("div",{style:{display:"flex",justifyContent:"space-between",marginBottom:20}},le.createElement("div",null,le.createElement(Yn,{className:l("carouselTitle",t)},a==null?void 0:a.title),le.createElement(We.Quiet,{className:l("carouselSubtitle",t)},a==null?void 0:a.subtitle)),le.createElement(Zn,{numberOfStepsCompleted:w,numberOfSteps:c.length})),le.createElement("div",{style:{position:"relative"}},le.createElement(Rn,{show:r,onClick:()=>O(!1)}),le.createElement(Rn,{side:"right",show:p,onClick:O}),le.createElement(Mn,{ref:n,onScroll:z},x.map((A,U)=>le.createElement(Un,{key:U,style:{flex:`0 0 calc(100% - ${c.length>3?36:0}px)`}},A.map(($,N)=>le.createElement(Qn,{key:N,stepData:$,style:{flex:c.length>3?"0 1 calc(33% - 16px * 2 / 3)":1},appearance:t})))))))};var lr=({flowId:e,title:t,subtitle:o,style:i,initialSelectedStep:n,className:r,type:s="inline",onDismiss:p,visible:d,customVariables:a,onStepCompletion:f,onButtonClick:c,appearance:u,hideOnFlowCompletion:w,setVisible:T,customStepTypes:S,checklistStyle:C="default",autoExpandFirstIncompleteStep:P,autoExpandNextStep:v,...B})=>{let{getFlow:y,getFlowSteps:h,markStepCompleted:m,getStepStatus:x,getNumberOfStepsCompleted:F,isLoading:O,targetingLogicShouldHideFlow:_,updateCustomVariables:z,getFlowMetadata:A,isStepBlocked:U,getFlowStatus:$,hasActiveFullPageFlow:N,setHasActiveFullPageFlow:ie}=X(),{primaryCTAClickSideEffects:pe,secondaryCTAClickSideEffects:L}=re(),{getOpenFlowState:we,setOpenFlowState:xe}=Pe(),[ee,j]=os(n||0),[oe,I]=os(!1),ne=d===void 0?we(e):d,fe=s==="modal",{mergeAppearanceWithDefault:ke}=J(),{isLarge:G}=Cn();if(u=ke(u),ts(()=>{z(a)},[a,O]),ts(()=>{d!==void 0&&(fe&&d===!0?ie(!0):fe&&d===!1&&ie(!1))},[d,T,N]),O)return null;let ge=y(e);if(!ge||_(ge))return null;let R=h(e);if(!R||w===!0&&$(e)===Y)return null;let K=A(e);if(K!=null&&K.title&&(t=K.title),K!=null&&K.subtitle&&(o=K.subtitle),!oe&&n===void 0&&F(e)>0){let W=Math.min(F(e),R.length-1);j(W),I(!0)}function je(){if(ee+1>=R.length){fe&&xe(e,!1);return}U(e,R[ee+1].id)||j(ee+1)}function Ge(W,lt,io){let fr=ee+1<R.length?R[ee+1]:null;c&&c(W,ee,lt,fr)===!0&&fe&&g(),f&&f(W,io,fr),!f&&!c&&(W.primaryButtonUri||W.secondaryButtonUri)&&fe&&g()}function wt(){return R.map((W,lt)=>({...W,handleSecondaryButtonClick:()=>{je(),L(W),W.skippable===!0&&m(e,W.id,{skipped:!0}),Ge(W,"secondary",lt)},handlePrimaryButtonClick:()=>{(!W.completionCriteria&&(W.autoMarkCompleted||W.autoMarkCompleted===void 0)||W.completionCriteria&&W.autoMarkCompleted===!0)&&(m(e,W.id),je()),Ge(W,"primary",lt),pe(W),x(e,W.id)===Oe&&je()}}))}function H(){return ae.createElement(te,{appearance:u})}let Be={steps:wt(),title:t,subtitle:o,primaryColor:u.theme.colorPrimary,appearance:u,customStepTypes:S,type:s,className:r,autoExpandFirstIncompleteStep:P,autoExpandNextStep:v};function g(){xe(e,!1),p&&p(),T&&T(!1)}function b(){return ae.createElement(ae.Fragment,null,ae.createElement(H,null),ae.createElement(es,{flowId:e,appearance:u,customVariables:a,className:r}))}function E(){return ae.createElement(ae.Fragment,null,ae.createElement(H,null),ae.createElement(nr,{visible:ne,onClose:()=>{g()},selectedStep:ee,setSelectedStep:j,autoExpandNextStep:!0,appearance:u,...Be}))}function V(){if(!G)return E();let W=B.guideFlowId,lt;return W&&y(W)&&(lt=h(W)),ae.createElement(ae.Fragment,null,ae.createElement(H,null),ae.createElement(ir,{visible:ne,stepsTitle:K.stepsTitle?K.stepsTitle:"Your quick start guide",onClose:()=>{g()},selectedStep:ee,setSelectedStep:j,guideData:lt,guideTitle:B.guideTitle??"Guide",appearance:u,title:t,subtitle:o,onGuideButtonClick:io=>{Ge(io,"link",0)},customStepTypes:S,...Be}))}function de(){if(!G)return E();let W=ae.createElement(or,{flowId:e,style:i,selectedStep:ee,setSelectedStep:j,appearance:u,type:s,...Be});return fe?ae.createElement(et,{onClose:()=>{g()},visible:ne,appearance:u,style:{paddingTop:"0px",padding:"12px",paddingLeft:0}},ae.createElement(H,null),W):ae.createElement(ae.Fragment,null,ae.createElement(H,null),W)}switch(C){case"condensed":return E();case"with-guide":return V();case"default":return de();case"carousel":return b();default:return de()}};var $p=e=>Dp.createElement(lr,{type:"inline",...e});import st,{useEffect as Up}from"react";import He from"react";import Io from"styled-components";var rs=Io.div`
|
|
1156
1234
|
border: 1px solid ${e=>e.appearance.theme.colorBorder};
|
|
1157
1235
|
border-radius: 8px;
|
|
1158
1236
|
padding: 6px 10px 6px 10px;
|
|
1159
1237
|
min-width: 160px;
|
|
1160
1238
|
cursor: pointer;
|
|
1161
1239
|
background-color: ${e=>e.appearance.theme.colorBackground}};
|
|
1162
|
-
`,
|
|
1240
|
+
`,is=Io.div`
|
|
1163
1241
|
display: flex;
|
|
1164
1242
|
flex-direction: row;
|
|
1165
1243
|
justify-content: space-between;
|
|
1166
1244
|
align-items: center;
|
|
1167
1245
|
margin-bottom: 2px;
|
|
1168
1246
|
flex-grow: 2;
|
|
1169
|
-
`,
|
|
1247
|
+
`,ns=Io.div`
|
|
1170
1248
|
text-overflow: ellipsis;
|
|
1171
1249
|
font-weight: 600;
|
|
1172
1250
|
font-size: 12px;
|
|
1173
1251
|
line-height: 15px;
|
|
1174
1252
|
text-align: ${e=>e.type==="condensed"?"left":"right"};
|
|
1175
1253
|
color: ${e=>e.appearance.theme.colorPrimary};
|
|
1176
|
-
`,
|
|
1254
|
+
`,ss=Io.div`
|
|
1177
1255
|
width: 20px;
|
|
1178
1256
|
margin-right: 8px;
|
|
1179
1257
|
display: flex;
|
|
1180
1258
|
height: 100%;
|
|
1181
1259
|
align-items: center;
|
|
1182
|
-
`;import{motion as Mp}from"framer-motion";var
|
|
1260
|
+
`;import{motion as Mp}from"framer-motion";var ls=({title:e,count:t,total:o,onClick:i,style:n={},className:r,appearance:s,type:p="default"})=>He.createElement(He.Fragment,null,He.createElement(te,{appearance:s}),He.createElement(rs,{as:Mp.div,whileHover:{opacity:.9},whileTap:{scale:.98},onClick:()=>i!==void 0&&i(),style:{...p=="condensed"?{display:"flex",justifyContent:"space-between"}:{},...n},className:Ce(r??"",l("progressRingContainer",s)),appearance:s},p=="condensed"&&o&&o!==0&&He.createElement(ss,{className:l("progressRingContainer",s)},He.createElement(At,{size:19,percentage:t/o,fillColor:s.theme.colorPrimary,bgColor:s.theme.colorBackgroundSecondary})),He.createElement(is,{type:p,className:l("badgeTitleContainer",s)},He.createElement(ns,{type:p,appearance:s,className:l("badgeTitle",s)},e),i!==void 0&&He.createElement(Dt,{className:l("badgeChevron",s),color:s.theme.colorPrimary})),p=="default"&&o&&o!==0&&He.createElement(ze,{display:"compact",count:t,total:o,fillColor:s.theme.colorPrimary,bgColor:s.theme.colorBackgroundSecondary,style:{width:"100%"},appearance:s})));import nt from"react";import to from"styled-components";var as=to.div`
|
|
1183
1261
|
display: flex;
|
|
1184
1262
|
flex-direction: row;
|
|
1185
1263
|
width: 100%;
|
|
@@ -1190,25 +1268,25 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1190
1268
|
border-width: 1px;
|
|
1191
1269
|
border-color: ${e=>e.appearance.theme.colorPrimary};
|
|
1192
1270
|
border-radius: 12px;
|
|
1193
|
-
`,
|
|
1271
|
+
`,ps=to.div`
|
|
1194
1272
|
${e=>k(e)} {
|
|
1195
1273
|
display: flex;
|
|
1196
1274
|
justify-content: center;
|
|
1197
1275
|
align-items: center;
|
|
1198
1276
|
margin-right: 16px;
|
|
1199
1277
|
}
|
|
1200
|
-
`,
|
|
1278
|
+
`,ds=to.div`
|
|
1201
1279
|
display: flex;
|
|
1202
1280
|
flex-direction: column;
|
|
1203
1281
|
flex: 1;
|
|
1204
1282
|
margin-top: 0;
|
|
1205
|
-
`,
|
|
1283
|
+
`,cs=to.div`
|
|
1206
1284
|
display: flex;
|
|
1207
1285
|
flex-direction: column;
|
|
1208
1286
|
justify-content: center;
|
|
1209
1287
|
margin-left: 16px;
|
|
1210
1288
|
min-width: 200px;
|
|
1211
|
-
|
|
1289
|
+
`,HC=to.div`
|
|
1212
1290
|
display: flex;
|
|
1213
1291
|
justify-content: center;
|
|
1214
1292
|
align-items: flex-end;
|
|
@@ -1217,73 +1295,7 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1217
1295
|
:hover {
|
|
1218
1296
|
opacity: 0.8;
|
|
1219
1297
|
}
|
|
1220
|
-
`;var
|
|
1221
|
-
${e=>k(e)} {
|
|
1222
|
-
background: ${e=>e.appearance.theme.colorBackground};
|
|
1223
|
-
}
|
|
1224
|
-
|
|
1225
|
-
box-shadow: 0px 6px 25px rgba(0, 0, 0, 0.06);
|
|
1226
|
-
border-radius: 20px;
|
|
1227
|
-
max-width: ${e=>e.maxWidth}px;
|
|
1228
|
-
min-width: 300px;
|
|
1229
|
-
padding: 22px 22px 12px;
|
|
1230
|
-
z-index: ${e=>e.zIndex};
|
|
1231
|
-
`,ls=st.div`
|
|
1232
|
-
display: block;
|
|
1233
|
-
cursor: pointer;
|
|
1234
|
-
position: absolute;
|
|
1235
|
-
top: 25px;
|
|
1236
|
-
right: 22px;
|
|
1237
|
-
`,as=st.img`
|
|
1238
|
-
${e=>k(e)} {
|
|
1239
|
-
display: block;
|
|
1240
|
-
width: 100%;
|
|
1241
|
-
height: auto;
|
|
1242
|
-
min-height: 200px;
|
|
1243
|
-
margin-top: ${e=>e.dismissible?"24px":"0px"};
|
|
1244
|
-
margin-bottom: 16px;
|
|
1245
|
-
}
|
|
1246
|
-
`,ps=st.div`
|
|
1247
|
-
${e=>k(e)} {
|
|
1248
|
-
display: block;
|
|
1249
|
-
width: 100%;
|
|
1250
|
-
height: auto;
|
|
1251
|
-
min-height: 200px;
|
|
1252
|
-
margin-top: ${e=>e.dismissible?"24px":"0px"};
|
|
1253
|
-
margin-bottom: 16px;
|
|
1254
|
-
}
|
|
1255
|
-
`,ds=st.div`
|
|
1256
|
-
display: flex;
|
|
1257
|
-
flex-direction: row;
|
|
1258
|
-
justify-content: space-between;
|
|
1259
|
-
align-content: center;
|
|
1260
|
-
`,cs=st.div`
|
|
1261
|
-
display: flex;
|
|
1262
|
-
flex: 1;
|
|
1263
|
-
flex-direction: column;
|
|
1264
|
-
justify-content: center;
|
|
1265
|
-
`,ms=st.div`
|
|
1266
|
-
display: flex;
|
|
1267
|
-
flex: 2;
|
|
1268
|
-
flex-shrink: 1;
|
|
1269
|
-
gap: 8px;
|
|
1270
|
-
height: 64px;
|
|
1271
|
-
${e=>k(e)} {
|
|
1272
|
-
flex-direction: row;
|
|
1273
|
-
justify-content: ${e=>e.showStepCount?"flex-end":"flex-start"};
|
|
1274
|
-
align-content: center;
|
|
1275
|
-
align-items: center;
|
|
1276
|
-
}
|
|
1277
|
-
`,us=st.p`
|
|
1278
|
-
${e=>k(e)} {
|
|
1279
|
-
font-style: normal;
|
|
1280
|
-
font-weight: 600;
|
|
1281
|
-
font-size: 15px;
|
|
1282
|
-
line-height: 22px;
|
|
1283
|
-
color: #808080;
|
|
1284
|
-
}
|
|
1285
|
-
margin: 0;
|
|
1286
|
-
`;var gs=300,hs=100,qp=500,$t=12,Kp=ro.div`
|
|
1298
|
+
`;var ms=({title:e,subtitle:t,icon:o,appearance:i,count:n,total:r,className:s,style:p})=>nt.createElement(nt.Fragment,null,nt.createElement(as,{appearance:i,className:Ce(l("fullWidthProgressBadgeContainer",i),s??""),style:p},o&&nt.createElement(ps,{className:l("fullWidthProgressBadgeIcon",i)},o),nt.createElement(ds,null,nt.createElement(Se,{size:"small",appearance:i,title:e,subtitle:t})),nt.createElement(cs,{className:l("fullWidthProgressBadgeProgressContainer",i)},nt.createElement(ze,{count:n,total:r,display:"percent",textLocation:"top",fillColor:i.theme.colorPrimary}))));var _p=({flowId:e,title:t,subtitle:o,icon:i,style:n,onClick:r,className:s,customVariables:p,hideOnFlowCompletion:d,appearance:a,type:f="default"})=>{let{getFlow:c,getFlowSteps:u,getFlowStatus:w,getNumberOfStepsCompleted:T,isLoading:S,targetingLogicShouldHideFlow:C,updateCustomVariables:P}=X(),{mergeAppearanceWithDefault:v}=J();a=v(a);let{setOpenFlowState:B,getOpenFlowState:y}=Pe();if(Up(()=>{P(p)},[p,S]),S)return null;let h=c(e);if(!h||C(h)||d===!0&&w(e)===Y)return null;let m=u(e),x=T(e);return f==="full-width"?st.createElement(st.Fragment,null,st.createElement(te,{appearance:a}),st.createElement(ms,{title:t,subtitle:o,count:x,total:m.length,style:n,className:s,appearance:a,icon:i,onClick:()=>{}})):st.createElement(st.Fragment,null,st.createElement(te,{appearance:a}),st.createElement(ls,{count:x,total:m.length,title:t,style:n,onClick:()=>{B(e,!0),r&&r()},type:f,className:s,appearance:a}))};import zp from"react";var Wp=({flowId:e,style:t,appearance:o,...i})=>{let{getFlow:n,targetingLogicShouldHideFlow:r,getFlowSteps:s}=X(),{mergeAppearanceWithDefault:p}=J();o=p(o);let d=n(e);if(!d||r(d))return null;let a=s(e);return zp.createElement(Rt,{steps:a,style:t,appearance:o,...i})};import Ut,{useContext as Rp,useEffect as ed}from"react";import D,{useEffect as No,useLayoutEffect as gs,useRef as qp,useState as oo}from"react";import ro from"styled-components";import{useCallback as Hp,useEffect as Vp,useState as jp}from"react";var ar=(e,t,o,i={x:20,y:20},n)=>{let r=n=="fixed"?0:window.scrollY,s=n=="fixed"?0:window.scrollX;return!e||!e.left||!e.top?{x:0,y:0}:t==="left"?{x:e.left-o+i.x+s,y:e.top-i.y+r}:t==="right"?{x:e.left+e.width+i.x+s,y:e.top-i.y+r}:{x:0,y:0}},us={bottom:0,height:0,left:0,right:0,top:0,width:0,x:0,y:0};function Gp(e){let t=us;return e&&(t=e.getBoundingClientRect()),t}function fs(e,t){let[o,i]=jp(us),n=Hp(()=>{e&&i(Gp(e))},[e]);return Vp(()=>(n(),window.addEventListener("resize",n),()=>window.removeEventListener("resize",n)),[e,t]),o}var hs=300,xs=100,Kp=500,Mt=12,Yp=ro.div`
|
|
1287
1299
|
width: 100%;
|
|
1288
1300
|
height: 100%;
|
|
1289
1301
|
border-radius: 9999px;
|
|
@@ -1306,25 +1318,25 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1306
1318
|
opacity: 0;
|
|
1307
1319
|
}
|
|
1308
1320
|
}
|
|
1309
|
-
`,
|
|
1310
|
-
width: ${
|
|
1311
|
-
height: ${
|
|
1321
|
+
`,Xp=ro.div`
|
|
1322
|
+
width: ${Mt}px;
|
|
1323
|
+
height: ${Mt}px;
|
|
1312
1324
|
border-radius: 100px;
|
|
1313
1325
|
background-color: ${e=>e.primaryColor};
|
|
1314
1326
|
z-index: 20;
|
|
1315
1327
|
opacity: 1;
|
|
1316
|
-
`,
|
|
1328
|
+
`,Jp=ro.div`
|
|
1317
1329
|
pointer-events: all;
|
|
1318
|
-
`,
|
|
1330
|
+
`,Cs=ro.div`
|
|
1319
1331
|
display: flex;
|
|
1320
1332
|
align-content: center;
|
|
1321
1333
|
justify-content: center;
|
|
1322
1334
|
align-items: center;
|
|
1323
1335
|
z-index: ${e=>e.zIndex?e.zIndex:90};
|
|
1324
|
-
`,
|
|
1325
|
-
width: ${
|
|
1326
|
-
height: ${
|
|
1327
|
-
`,
|
|
1336
|
+
`,Qp=ro(Cs)`
|
|
1337
|
+
width: ${Mt+12}px;
|
|
1338
|
+
height: ${Mt+12}px;
|
|
1339
|
+
`,Zp=({steps:e=[],onDismiss:t,onComplete:o=()=>{},tooltipPosition:i="auto",showHighlight:n=!0,primaryColor:r="#000000",offset:s={x:0,y:0},visible:p=!0,containerStyle:d={},selectedStep:a=0,customStepTypes:f,appearance:c,dismissible:u=!1,showHighlightOnly:w,showStepCount:T=!0,completedStepsCount:S=0,showFrigadeBranding:C=!1})=>{var K,je,Ge,wt;let[P,v]=oo(),[B,y]=oo(new Date),h=qp(null),[m,x]=oo(document.querySelector(e[a].selector)),F=fs(m,B),[O,_]=oo(),[z,A]=oo(!w),U=(je=(K=e[a])==null?void 0:K.props)!=null&&je.position?e[a].props.position:"absolute",$=((wt=(Ge=e[a])==null?void 0:Ge.props)==null?void 0:wt.zIndex)??90,N=(P==null?void 0:P.width)??hs,ie=(P==null?void 0:P.height)??xs;gs(()=>{h.current&&v({width:h.current.clientWidth,height:h.current.clientHeight})},[a,B,U]),No(()=>{w||A(!0)},[a]);let pe=i==="auto"?"right":i,L=ar(F,pe,N,s,U),we=F.right+N>(window.innerWidth||document.documentElement.clientWidth),xe=F.bottom+xs>(window.innerHeight||document.documentElement.clientHeight);we&&i==="auto"&&(L=ar(F,"left",N,s,U),pe="left");let ee=window.location.pathname.split("/").pop(),j=()=>{let H=document.querySelector(e[a].selector);O&&O===JSON.stringify(H==null?void 0:H.getBoundingClientRect())||(x(H),y(new Date),H&&_(JSON.stringify(H.getBoundingClientRect())))};if(No(()=>{let H=new MutationObserver(j);return H.observe(document.body,{subtree:!0,childList:!0}),()=>H.disconnect()},[j]),No(()=>{let H=new MutationObserver(j);return H.observe(document.body,{subtree:!0,childList:!0,attributes:!0,attributeFilter:["style","class"]}),()=>H.disconnect()},[j]),No(()=>{let H=setInterval(()=>{j()},10);return()=>clearInterval(H)},[j]),gs(()=>{setTimeout(()=>{j()},Kp),j()},[a,ee]),m===null)return D.createElement(D.Fragment,null);if(L.x==0&&L.y==0)return D.createElement(D.Fragment,null);if(!p)return D.createElement(D.Fragment,null);let oe=()=>{let H=()=>{if(e[a].handlePrimaryButtonClick&&(e[a].handlePrimaryButtonClick(),A(!1),setTimeout(()=>{j()},30)),S===e.length-1)return o()},Be=()=>{e[a].handleSecondaryButtonClick&&(e[a].handleSecondaryButtonClick(),w&&A(!1))};return D.createElement(D.Fragment,null,T&&D.createElement(vr,null,D.createElement(Br,{className:l("tooltipStepCounter",c)},a+1," of ",e.length)),D.createElement(Er,{showStepCount:T,className:l("tooltipCTAContainer",c)},e[a].secondaryButtonTitle&&D.createElement(Z,{title:e[a].secondaryButtonTitle,appearance:c,onClick:Be,size:"small",withMargin:!1,secondary:!0}),e[a].primaryButtonTitle&&D.createElement(Z,{title:e[a].primaryButtonTitle,appearance:c,onClick:H,withMargin:!1,size:"small"})))},I=()=>D.createElement(D.Fragment,null,u&&D.createElement(Tr,{"data-testid":"tooltip-dismiss",onClick:()=>{t&&t()},className:l("tooltipClose",c)},D.createElement(ve,null)),e[a].imageUri&&D.createElement(Fr,{dismissible:u,appearance:c,src:e[a].imageUri,className:l("tooltipImageContainer",c)}),e[a].videoUri&&!e[a].imageUri&&D.createElement(kr,{dismissible:u,appearance:c,className:l("tooltipVideoContainer",c)},D.createElement(Et,{appearance:c,videoUri:e[a].videoUri})),D.createElement(Se,{appearance:c,title:e[a].title,subtitle:e[a].subtitle,size:"small"}),D.createElement(Pr,{className:l("tooltipFooter",c)},D.createElement(oe,null))),fe={...{default:H=>{var Be;if((Be=e[a])!=null&&Be.StepContent){let g=e[a].StepContent;return D.createElement("div",null,g)}return D.createElement(I,null)}},...f},ke=()=>{var H;return e?!((H=e[a])!=null&&H.type)||!fe[e[a].type]?fe.default(e[a]):fe[e[a].type]({stepData:e[a],primaryColor:r}):D.createElement(D.Fragment,null)};if(w&&e[a].complete===!0)return null;let G={top:(L==null?void 0:L.y)-Mt,left:(pe=="left"?F.x+s.x:(L==null?void 0:L.x)-Mt)??0,cursor:w?"pointer":"default",position:U},ge=()=>{let Be=G.left+(pe=="left"?-N:24);return Math.min(Math.max(Be,20),window.innerWidth-N-20)},R=()=>{w&&(y(new Date),A(!z))};return D.createElement(Jp,null,D.createElement(Qp,{style:G,zIndex:$,className:l("tourHighlightContainer",c)},n&&e[a].showHighlight!==!1&&D.createElement(D.Fragment,null,D.createElement(Xp,{style:{position:U},onClick:R,primaryColor:c.theme.colorPrimary}),D.createElement(Yp,{style:{position:"absolute"},onClick:R,primaryColor:c.theme.colorPrimary}))),D.createElement(Cs,{style:{...G,left:ge()},zIndex:$+1,className:l("tooltipContainerWrapper",c)},z&&D.createElement(ao,{ref:h,layoutId:"tooltip-container",style:{position:"relative",width:"max-content",right:0,top:12,...d},appearance:c,className:l("tooltipContainer",c),maxWidth:hs,zIndex:$+10},D.createElement(ke,null),C&&D.createElement(Ir,{className:l("poweredByFrigadeTooltipRibbon",c),appearance:c},D.createElement(po,{appearance:c})))))},Lo=Zp;import{Portal as td}from"react-portal";var od=({flowId:e,customVariables:t,appearance:o,onStepCompletion:i,onButtonClick:n,showTooltipsSimultaneously:r=!1,onDismiss:s,dismissible:p,tooltipPosition:d="auto",showHighlightOnly:a=!1,dismissBehavior:f="complete-flow",onComplete:c,...u})=>{let{getFlow:w,getFlowSteps:T,isLoading:S,targetingLogicShouldHideFlow:C,markStepCompleted:P,markStepStarted:v,markFlowCompleted:B,updateCustomVariables:y,getCurrentStepIndex:h,getStepStatus:m,isStepBlocked:x,getFlowStatus:F,getNumberOfStepsCompleted:O}=X(),{isLoadingUserFlowStateData:_}=Ie(),{primaryCTAClickSideEffects:z,secondaryCTAClickSideEffects:A}=re(),{hasOpenModals:U}=Pe(),$=h(e),{openFlowStates:N}=Rp(q),{mergeAppearanceWithDefault:ie}=J();if(o=ie(o),ed(()=>{y(t)},[t,S]),_)return null;let pe=w(e);if(!pe||C(pe)||F(e)==Y||U())return null;let L=T(e);if(Object.keys(N).length>0){let I=Object.keys(N).find(ne=>N[ne]===!0);if(I!==void 0&&I!==e)return Ut.createElement(Ut.Fragment,null)}async function we(I){if(await P(e,I.id),L.map(ne=>m(e,ne.id)).every(ne=>ne===Oe)){await B(e);return}if(!a&&$+1<L.length){if(x(e,L[$+1].id))return;await v(e,L[$+1].id)}}function xe(I,ne,fe){let ke=$+1<L.length?L[$+1]:null;n&&n(I,$,ne,ke),i&&i(I,fe,ke)}function ee(){return L.map(I=>({...I,handleSecondaryButtonClick:async()=>{A(I),I.skippable===!0&&await P(e,I.id,{skipped:!0}),xe(I,"secondary",$)},handlePrimaryButtonClick:async()=>{(!I.completionCriteria&&(I.autoMarkCompleted||I.autoMarkCompleted===void 0)||I.completionCriteria&&I.autoMarkCompleted===!0)&&await we(I),xe(I,"primary",$),z(I)}}))}async function j(I){s&&s(),f==="complete-flow"?await B(e):await P(e,I.id)}function oe(){c&&c()}return Ut.createElement(td,null,Ut.createElement(te,{appearance:o}),r?L.map((I,ne)=>Ut.createElement(Lo,{key:I.id,appearance:o,steps:ee(),selectedStep:ne,showTooltipsSimultaneously:r,dismissible:p,onDismiss:()=>j(I),tooltipPosition:d,showHighlightOnly:a,completedStepsCount:O(e),onComplete:oe,...u})):Ut.createElement(Lo,{appearance:o,steps:ee(),selectedStep:$,showTooltipsSimultaneously:r,dismissible:p,onDismiss:()=>j(L[$]),tooltipPosition:d,completedStepsCount:O(e),showHighlightOnly:a,onComplete:oe,...u}))};import be,{useEffect as rd,useRef as id,useState as nd}from"react";import{Portal as sd}from"react-portal";import bt from"styled-components";var Ss=bt.button`
|
|
1328
1340
|
${e=>k(e)} {
|
|
1329
1341
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
1330
1342
|
|
|
@@ -1342,17 +1354,17 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1342
1354
|
opacity: 0.8;
|
|
1343
1355
|
}
|
|
1344
1356
|
}
|
|
1345
|
-
`,
|
|
1357
|
+
`,ys=bt.span`
|
|
1346
1358
|
${e=>k(e)} {
|
|
1347
1359
|
font-size: 12px;
|
|
1348
1360
|
display: inline-block;
|
|
1349
1361
|
}
|
|
1350
|
-
`,
|
|
1362
|
+
`,bs=bt.span`
|
|
1351
1363
|
${e=>k(e)} {
|
|
1352
1364
|
font-size: 12px;
|
|
1353
1365
|
display: inline-block;
|
|
1354
1366
|
}
|
|
1355
|
-
`,
|
|
1367
|
+
`,ws=bt.div`
|
|
1356
1368
|
position: fixed;
|
|
1357
1369
|
right: 0;
|
|
1358
1370
|
bottom: 0;
|
|
@@ -1362,7 +1374,7 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1362
1374
|
flex-direction: column;
|
|
1363
1375
|
align-items: flex-end;
|
|
1364
1376
|
z-index: 50;
|
|
1365
|
-
`,
|
|
1377
|
+
`,Ts=bt.button`
|
|
1366
1378
|
${e=>k(e)} {
|
|
1367
1379
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
1368
1380
|
background-color: #ffffff;
|
|
@@ -1378,7 +1390,7 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1378
1390
|
0px 3px 6px -4px rgba(0, 0, 0, 0.12);
|
|
1379
1391
|
border-radius: 45px;
|
|
1380
1392
|
cursor: pointer;
|
|
1381
|
-
`,
|
|
1393
|
+
`,Fs=bt.div`
|
|
1382
1394
|
${e=>k(e)} {
|
|
1383
1395
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
1384
1396
|
background: #ffffff;
|
|
@@ -1395,7 +1407,7 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1395
1407
|
position: ${e=>e.type=="inline"?"absolute":"relative"};
|
|
1396
1408
|
top: ${e=>e.type=="inline"?"68px":0};
|
|
1397
1409
|
margin-left: ${e=>e.type=="inline"?"-127px":0};
|
|
1398
|
-
`,
|
|
1410
|
+
`,ks=bt.button`
|
|
1399
1411
|
${e=>k(e)} {
|
|
1400
1412
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
1401
1413
|
color: #434343;
|
|
@@ -1412,7 +1424,7 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1412
1424
|
font-size: 14px;
|
|
1413
1425
|
|
|
1414
1426
|
padding: 8px 12px;
|
|
1415
|
-
`;import{AnimatePresence as
|
|
1427
|
+
`;import{AnimatePresence as As,motion as Is}from"framer-motion";import Ps from"react";var vs=({style:e,className:t})=>Ps.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"18",height:"18",fill:"none",viewBox:"0 0 18 18",style:e,className:t},Ps.createElement("path",{fill:"currentColor",d:"M13.43 4.938a4.494 4.494 0 00-1.043-1.435A4.955 4.955 0 009 2.197c-1.276 0-2.48.464-3.387 1.305A4.502 4.502 0 004.57 4.938a4.242 4.242 0 00-.386 1.773v.475c0 .109.087.197.196.197h.95a.197.197 0 00.197-.197V6.71c0-1.749 1.557-3.17 3.473-3.17s3.473 1.421 3.473 3.17c0 .718-.254 1.393-.738 1.955a3.537 3.537 0 01-1.9 1.125 1.928 1.928 0 00-1.085.682c-.271.343-.42.768-.42 1.206v.552c0 .109.088.197.197.197h.95a.197.197 0 00.196-.197v-.552c0-.276.192-.519.457-.578a4.904 4.904 0 002.625-1.56c.335-.392.597-.828.778-1.3a4.256 4.256 0 00-.103-3.303zM9 13.834a.985.985 0 10.001 1.97.985.985 0 00-.001-1.97z"}));import Es from"react";var Bs=({style:e,className:t})=>Es.createElement("svg",{style:e,className:t,xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",strokeWidth:"1.5",stroke:"currentColor"},Es.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M9.879 7.519c1.171-1.025 3.071-1.025 4.242 0 1.172 1.025 1.172 2.687 0 3.712-.203.179-.43.326-.67.442-.745.361-1.45.999-1.45 1.827v.75M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9 5.25h.008v.008H12v-.008z"}));var ld=({flowId:e,style:t,onStepCompletion:o,visible:i=!0,type:n="inline",title:r="Help",appearance:s})=>{let{getFlow:p,getFlowSteps:d,markStepCompleted:a,getStepStatus:f,getNumberOfStepsCompleted:c,isLoading:u,targetingLogicShouldHideFlow:w}=X(),{primaryCTAClickSideEffects:T}=re(),S=id(null),[C,P]=nd(!1),{mergeAppearanceWithDefault:v}=J();s=v(s),rd(()=>(document.addEventListener("click",B,!1),()=>{document.removeEventListener("click",B,!1)}),[]);let B=F=>{S.current&&!S.current.contains(F.target)&&P(!1)};if(u)return null;let y=p(e);if(!y||w(y))return null;let h=d(e);if(!h||!i)return null;function m(F,O){!F.completionCriteria&&(F.autoMarkCompleted||F.autoMarkCompleted===void 0)&&a(e,F.id),T(F),o&&o(F,O),P(!1)}function x(){return C&&be.createElement(Fs,{className:l("floatingWidgetMenu",s),as:Is.div,initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.1},type:n},h.map((F,O)=>be.createElement(ks,{className:l("floatingWidgetMenuItem",s),key:O,onClick:()=>m(F,O)},F.title)))}return n=="inline"?be.createElement("span",{ref:S},be.createElement(Ss,{style:t,onClick:()=>{P(!C)},className:l("supportButton",s)},be.createElement(bs,{className:l("supportIconContainer",s)},be.createElement(Bs,{className:l("supportIcon",s),style:{width:"18px",height:"18px"}})),be.createElement(ys,{className:l("supportButtonTitle",s)},r)),be.createElement(As,null,be.createElement(x,null))):be.createElement(sd,null,be.createElement(ws,{style:t,ref:S},be.createElement(As,null,be.createElement(x,null)),be.createElement(Ts,{onClick:()=>{P(!C)},as:Is.button,whileHover:{scale:1.1},className:l("floatingWidgetButton",s)},be.createElement(vs,{className:l("floatingWidgetButtonIcon",s),style:{display:"flex",width:"20px",height:"20px"}}))))};import Ve,{useEffect as ad}from"react";import Oo from"styled-components";var Ns=Oo.div`
|
|
1416
1428
|
${e=>k(e)} {
|
|
1417
1429
|
display: flex;
|
|
1418
1430
|
flex-direction: column;
|
|
@@ -1427,17 +1439,17 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1427
1439
|
border-radius: 12px;
|
|
1428
1440
|
position: relative;
|
|
1429
1441
|
}
|
|
1430
|
-
`,
|
|
1442
|
+
`,Ls=Oo.div`
|
|
1431
1443
|
display: flex;
|
|
1432
1444
|
flex-direction: column;
|
|
1433
1445
|
flex: 1;
|
|
1434
|
-
`,
|
|
1446
|
+
`,Os=Oo.div`
|
|
1435
1447
|
display: flex;
|
|
1436
1448
|
flex-direction: column;
|
|
1437
1449
|
justify-content: center;
|
|
1438
1450
|
align-items: flex-start;
|
|
1439
1451
|
margin-top: 16px;
|
|
1440
|
-
`,
|
|
1452
|
+
`,Ds=Oo.div`
|
|
1441
1453
|
${e=>k(e)} {
|
|
1442
1454
|
position: absolute;
|
|
1443
1455
|
top: 16px;
|
|
@@ -1448,7 +1460,7 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1448
1460
|
opacity: 0.8;
|
|
1449
1461
|
}
|
|
1450
1462
|
}
|
|
1451
|
-
`;var
|
|
1463
|
+
`;var pd=({flowId:e,onDismiss:t,customVariables:o,onButtonClick:i,appearance:n,className:r,style:s,dismissible:p})=>{let{getFlow:d,markFlowCompleted:a,markStepCompleted:f,isLoading:c,targetingLogicShouldHideFlow:u,updateCustomVariables:w,getFlowSteps:T,getFlowStatus:S,getCurrentStepIndex:C}=X(),{primaryCTAClickSideEffects:P}=re(),{mergeAppearanceWithDefault:v}=J();if(n=v(n),ad(()=>{w(o)},[o,c]),c)return null;let B=d(e);if(!B||u(B)||S(e)===Y)return null;let h=T(e)[C(e)];return Ve.createElement(Ve.Fragment,null,Ve.createElement(te,{appearance:n}),Ve.createElement(Ns,{appearance:n,className:Ce(l("embeddedTipContainer",n),r),style:s},(p===!0||h.dismissible)&&Ve.createElement(Ds,{onClick:async()=>{await a(e),t&&t()},className:l("embeddedTipDismissButton",n)},Ve.createElement(ve,null)),Ve.createElement(Ls,null,Ve.createElement(Se,{size:"small",appearance:n,title:h.title,subtitle:h.subtitle})),h.primaryButtonTitle&&Ve.createElement(Os,{className:l("embeddedTipCallToActionContainer",n)},Ve.createElement(Z,{classPrefix:"embeddedTip",title:h.primaryButtonTitle,appearance:n,withMargin:!1,size:"small",type:"inline",onClick:async()=>{h.handlePrimaryButtonClick(),P(h),!(i&&i(h,C(e),"primary")===!1)&&(await f(e,h.id),await a(e))}}))))};import he,{useEffect as dd}from"react";import _t from"styled-components";var $s=_t.div`
|
|
1452
1464
|
// use the :not annotation
|
|
1453
1465
|
${e=>k(e)} {
|
|
1454
1466
|
display: flex;
|
|
@@ -1468,18 +1480,18 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1468
1480
|
width: 36px;
|
|
1469
1481
|
height: 36px;
|
|
1470
1482
|
}
|
|
1471
|
-
|
|
1483
|
+
`,Us=_t.div`
|
|
1472
1484
|
display: flex;
|
|
1473
1485
|
flex-direction: column;
|
|
1474
1486
|
flex: 1;
|
|
1475
1487
|
margin-left: ${e=>e.type==="square"?"0px":"16px"};
|
|
1476
1488
|
margin-top: ${e=>e.type==="square"?"12px":"0"};
|
|
1477
|
-
`,
|
|
1489
|
+
`,_s=_t.div`
|
|
1478
1490
|
display: flex;
|
|
1479
1491
|
flex-direction: column;
|
|
1480
1492
|
justify-content: center;
|
|
1481
1493
|
margin-left: ${e=>e.type==="square"?"0px":"16px"};
|
|
1482
|
-
`,
|
|
1494
|
+
`,pr=_t.div`
|
|
1483
1495
|
display: flex;
|
|
1484
1496
|
justify-content: ${e=>e.type==="square"?"flex-end":"center"};
|
|
1485
1497
|
align-items: flex-end;
|
|
@@ -1488,12 +1500,12 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1488
1500
|
:hover {
|
|
1489
1501
|
opacity: 0.8;
|
|
1490
1502
|
}
|
|
1491
|
-
`,
|
|
1503
|
+
`,dr=_t.div`
|
|
1492
1504
|
display: flex;
|
|
1493
1505
|
justify-content: ${e=>e.type==="square"?"flex-end":"center"};
|
|
1494
1506
|
align-items: flex-end;
|
|
1495
1507
|
margin-left: ${e=>e.type==="square"?"0px":"16px"};
|
|
1496
|
-
`;import
|
|
1508
|
+
`;import zs from"react";var Ws=({style:e,className:t})=>zs.createElement("svg",{style:e,className:t,xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",strokeWidth:1.5,stroke:"currentColor"},zs.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M11.25 11.25l.041-.02a.75.75 0 011.063.852l-.708 2.836a.75.75 0 001.063.853l.041-.021M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3.75h.008v.008H12V8.25z"}));var cd=({flowId:e,title:t,subtitle:o,onDismiss:i,customVariables:n,onButtonClick:r,appearance:s,type:p="full-width",icon:d})=>{let{getFlow:a,markFlowCompleted:f,isLoading:c,targetingLogicShouldHideFlow:u,updateCustomVariables:w,getFlowMetadata:T,getFlowStatus:S,getFlowSteps:C,getCurrentStepIndex:P}=X(),{primaryCTAClickSideEffects:v}=re(),{mergeAppearanceWithDefault:B}=J();if(s=B(s),dd(()=>{w(n)},[n,c]),c)return null;let y=a(e);if(!y||u(y)||S(e)===Y)return null;let h=C(e),m=h.length>0?h[P(e)]:T(e);return m!=null&&m.title&&(t=m.title),m!=null&&m.subtitle&&(o=m.subtitle),he.createElement(he.Fragment,null,he.createElement(te,{appearance:s}),he.createElement($s,{type:p,appearance:s,className:l("bannerContainer",s)},p!="square"&&he.createElement(Ms,{className:l("bannerIconContainer",s)},d||he.createElement(Ws,null)),p==="square"&&m.dismissible&&he.createElement(dr,{type:p,className:l("bannerDismissButtonContainer",s)},he.createElement(pr,{type:p,onClick:async()=>{await f(e),i&&i()},className:l("bannerDismissButton",s)},he.createElement(ve,null))),he.createElement(Us,{type:p},he.createElement(Se,{appearance:s,title:t,subtitle:o})),he.createElement(_s,{type:p,className:l("bannerCallToActionContainer",s)},he.createElement(Z,{title:(m==null?void 0:m.primaryButtonTitle)??"Get started",appearance:s,onClick:()=>{v(m),r&&r(m,0,"primary")}})),p!=="square"&&m.dismissible&&he.createElement(dr,{type:p,className:l("bannerDismissButtonContainer",s)},he.createElement(pr,{type:p,onClick:async()=>{await f(e),i&&i()},className:l("bannerDismissButton",s)},he.createElement(ve,null)))))};import Q,{useEffect as md}from"react";import{Portal as ud}from"react-portal";import Ze from"styled-components";var Hs=Ze.div`
|
|
1497
1509
|
${e=>k(e)} {
|
|
1498
1510
|
display: flex;
|
|
1499
1511
|
flex-direction: column;
|
|
@@ -1514,7 +1526,7 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1514
1526
|
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
|
|
1515
1527
|
min-width: 550px;
|
|
1516
1528
|
}
|
|
1517
|
-
`,
|
|
1529
|
+
`,Vs=Ze.button`
|
|
1518
1530
|
border: 1px solid ${e=>e.appearance.theme.colorBorder};
|
|
1519
1531
|
border-radius: ${e=>e.appearance.theme.borderRadius}px;
|
|
1520
1532
|
// If selected make border color primary and text color color priamry
|
|
@@ -1535,30 +1547,30 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1535
1547
|
display: flex;
|
|
1536
1548
|
justify-content: center;
|
|
1537
1549
|
align-items: center;
|
|
1538
|
-
`,
|
|
1550
|
+
`,cr=Ze.div`
|
|
1539
1551
|
display: flex;
|
|
1540
1552
|
justify-content: flex-end;
|
|
1541
1553
|
margin-top: 24px;
|
|
1542
1554
|
gap: 8px;
|
|
1543
|
-
`,
|
|
1555
|
+
`,js=Ze.div`
|
|
1544
1556
|
display: flex;
|
|
1545
1557
|
justify-content: space-between;
|
|
1546
1558
|
margin-top: 24px;
|
|
1547
|
-
`,
|
|
1559
|
+
`,mr=Ze.div`
|
|
1548
1560
|
font-size: 12px;
|
|
1549
1561
|
line-height: 16px;
|
|
1550
1562
|
color: ${e=>e.appearance.theme.colorTextDisabled};
|
|
1551
|
-
`,
|
|
1563
|
+
`,ur=Ze.div`
|
|
1552
1564
|
display: flex;
|
|
1553
1565
|
flex-direction: column;
|
|
1554
1566
|
flex: 1;
|
|
1555
|
-
`,
|
|
1567
|
+
`,RS=Ze.div`
|
|
1556
1568
|
display: flex;
|
|
1557
1569
|
flex-direction: column;
|
|
1558
1570
|
justify-content: center;
|
|
1559
1571
|
align-items: flex-start;
|
|
1560
1572
|
margin-top: 16px;
|
|
1561
|
-
`,
|
|
1573
|
+
`,Gs=Ze.textarea`
|
|
1562
1574
|
${e=>k(e)} {
|
|
1563
1575
|
margin-top: 16px;
|
|
1564
1576
|
border: 1px solid ${e=>e.appearance.theme.colorBorder};
|
|
@@ -1569,7 +1581,7 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1569
1581
|
width: 100%;
|
|
1570
1582
|
height: 100px;
|
|
1571
1583
|
}
|
|
1572
|
-
`,
|
|
1584
|
+
`,qs=Ze.div`
|
|
1573
1585
|
${e=>k(e)} {
|
|
1574
1586
|
position: absolute;
|
|
1575
1587
|
top: 16px;
|
|
@@ -1580,5 +1592,5 @@ ${i=>i.inlineStyles.map(([n,r])=>`.${Vt}${n}.${Vt}${n} { ${Object.entries(r).map
|
|
|
1580
1592
|
opacity: 0.8;
|
|
1581
1593
|
}
|
|
1582
1594
|
}
|
|
1583
|
-
`;var
|
|
1595
|
+
`;var fd=({flowId:e,onDismiss:t,customVariables:o,onButtonClick:i,appearance:n,className:r,style:s})=>{let{getFlow:p,markFlowCompleted:d,markStepCompleted:a,getNumberOfStepsCompleted:f,isLoading:c,targetingLogicShouldHideFlow:u,updateCustomVariables:w,getFlowSteps:T,getFlowStatus:S,getCurrentStepIndex:C}=X(),{primaryCTAClickSideEffects:P}=re(),{mergeAppearanceWithDefault:v}=J(),[B,y]=Q.useState(null),[h,m]=Q.useState(""),{hasOpenModals:x,setKeepCompletedFlowOpenDuringSession:F,shouldKeepCompletedFlowOpenDuringSession:O}=Pe();if(n=v(n),md(()=>{w(o)},[o,c]),c)return null;let _=p(e);if(!_||u(_)||S(e)===Y||f(e)===1&&!O(e)||x())return null;let A=T(e)[C(e)];function U(){return Q.createElement(Q.Fragment,null,Q.createElement(ur,null,Q.createElement(Se,{size:"large",appearance:n,title:A.title,subtitle:A.subtitle})),Q.createElement(cr,{className:l("npsNumberButtonContainer",n),appearance:n},Array.from(Array(10).keys()).map(N=>Q.createElement(Vs,{className:l("npsNumberButton",n),selected:B===N+1,key:N,onClick:async()=>{F(e),y(N+1),await a(e,A.id,{score:N+1})},appearance:n},N+1))),Q.createElement(js,{appearance:n},Q.createElement(mr,{appearance:n},"Not likely at all"),Q.createElement(mr,{appearance:n},"Extremely likely")))}function $(){return Q.createElement(Q.Fragment,null,Q.createElement(ur,null,Q.createElement(Se,{appearance:n,title:"Why did you choose this score?",size:"large"})),Q.createElement(Gs,{appearance:n,value:h,onChange:N=>{m(N.target.value)},placeHolder:"Add your optional fedback here..."}),Q.createElement(cr,{appearance:n,className:l("npsNumberButtonContainer",n)},Q.createElement(Z,{size:"large",withMargin:!1,onClick:async()=>{await d(e),i&&i(A,1,"primary")},appearance:n,title:A.secondaryButtonTitle||"Skip",secondary:!0}),Q.createElement(Z,{size:"large",withMargin:!1,onClick:async()=>{await a(e,A.id,{feedbackText:h}),await d(e),i&&i(A,1,"primary")},appearance:n,title:A.primaryButtonTitle||"Submit"})))}return Q.createElement(ud,null,Q.createElement(te,{appearance:n}),Q.createElement(Hs,{appearance:n,className:Ce(l("npsSurveyContainer",n),r),style:s},Q.createElement(qs,{onClick:async()=>{await d(e),t&&t()},className:l("npsSurveyDismissButton",n)},Q.createElement(ve,null)),f(e)==0&&U(),f(e)==1&&$()))};export{ut as CheckBox,ot as FormLabel,Vo as FormTextField,cd as FrigadeBanner,lr as FrigadeChecklist,qe as FrigadeDefaultAppearance,pd as FrigadeEmbeddedTip,Si as FrigadeForm,Wp as FrigadeGuide,$p as FrigadeHeroChecklist,fd as FrigadeNPSSurvey,_p as FrigadeProgressBadge,Ua as FrigadeProvider,ld as FrigadeSupportWidget,od as FrigadeTour,At as ProgressRing,Pe as useFlowOpens,Wt as useFlowResponses,X as useFlows,Qo as useOrganization,Ht as useUser};
|
|
1584
1596
|
//# sourceMappingURL=index.mjs.map
|