@frigade/react 1.32.40 → 1.32.42
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/README.md +1 -0
- package/lib/index.d.ts +5 -0
- package/lib/index.js +204 -201
- package/lib/index.js.map +1 -1
- package/lib/index.mjs +216 -213
- 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 ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import{ThemeProvider as Pa}from"styled-components";import mt,{useContext as Ta,useEffect as bo,useState as Ko}from"react";import{useCallback as at,useContext as Js,useEffect as Qs}from"react";import No,{useMemo as Us}from"react";var dr="1.32.40 ";var Te="https://api.frigade.com/v1/public/",Ie="NOT_STARTED_STEP",K="COMPLETED_FLOW",ro="ABORTED_FLOW",lt="STARTED_FLOW",Ne="NOT_STARTED_FLOW",Le="COMPLETED_STEP",io="STARTED_STEP";function De(){let{publicApiKey:e,userId:t}=No.useContext(V);return{config:Us(()=>({headers:{Authorization:`Bearer ${e}`,"Content-Type":"application/json","X-Frigade-SDK-Version":dr,"X-Frigade-SDK-Platform":"React"}}),[e,t])}}var _s="frigade-last-call-at-",Ws="frigade-last-call-data-";function yt(){let{shouldGracefullyDegrade:e}=No.useContext(V);return async(t,o)=>{if(e)return console.log(`Skipping ${t} call to Frigade due to error`),_t();let i=_s+t,r=Ws+t;if(window&&window.localStorage&&o&&o.body&&o.method==="POST"){let s=window.localStorage.getItem(i),p=window.localStorage.getItem(r);if(s&&p&&p==o.body){let d=new Date(s);if(new Date().getTime()-d.getTime()<1e3)return _t()}window.localStorage.setItem(i,new Date().toISOString()),window.localStorage.setItem(r,o.body)}let n;try{n=await fetch(t,o)}catch(s){return _t(s)}return n?n.ok?n:_t(n.statusText):_t()}}function _t(e){return e&&console.log("Call to Frigade failed",e),{json:()=>({})}}function bt(){let{publicApiKey:e,shouldGracefullyDegrade:t}=No.useContext(V);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 Ks,useState as cr}from"react";import{useContext as Hs,useEffect as Gs,useState as js}from"react";import Vs from"swr";import{useContext as zs}from"react";function Pe(){let{openFlowStates:e,setOpenFlowStates:t,hasActiveFullPageFlow:o,setCompletedFlowsToKeepOpenDuringSession:i,completedFlowsToKeepOpenDuringSession:r}=zs(V);function n(c,f=!1){return e[c]??f}function s(c,f){t(w=>({...w,[c]:f}))}function p(c){t(f=>{let{[c]:w,...T}=f;return{...T}})}function d(c){r.includes(c)||i(f=>[...f,c])}function a(c){return r.includes(c)}function u(){return Object.values(e).some(c=>c)||o}return{getOpenFlowState:n,setOpenFlowState:s,resetOpenFlowState:p,hasOpenModals:u,setKeepCompletedFlowOpenDuringSession:d,shouldKeepCompletedFlowOpenDuringSession:a}}var qs="unknown";function Ae(){let{config:e}=De(),{publicApiKey:t,userId:o,flows:i,setShouldGracefullyDegrade:r}=Hs(V),{resetOpenFlowState:n}=Pe(),[s,p]=js(!1),d={data:i.map(F=>({flowId:F.id,flowState:K,lastStepId:null,userId:o,foreignUserId:o,stepStates:{},shouldTrigger:!1}))},a=F=>fetch(F,e).then(g=>{if(g.ok)return g.json();throw new Error("Failed to fetch user flow states")}).catch(g=>(console.log(`Error fetching ${F}: ${g}. Will gracefully degrade and hide Frigade`),r(!0),d)),{data:u,isLoading:c,mutate:f,error:w}=Vs(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=u==null?void 0:u.data;Gs(()=>{!s&&!c&&T&&p(!0)},[T,s,c]);async function S(F){if(T){let g=T.find(m=>m.flowId===F);g&&g.flowState!==K&&(g.flowState=K),await f(Promise.resolve({...u,data:T}),{optimisticData:{...u,data:T},revalidate:!1,rollbackOnError:!1})}}async function x(F,g,m){if(T){let C=T.find(v=>v.flowId===F);C&&(C.stepStates[g]=m,C.flowState=lt),await f(Promise.resolve({...u,data:T}),{optimisticData:{...u,data:T},revalidate:!1,rollbackOnError:!1})}}async function E(F,g,m){if(T){let C=T.find(v=>v.flowId===F);C&&(C.lastStepId=g,C.stepStates[g]=m,C.flowState=lt),await f({...u,data:T},{optimisticData:{...u,data:T},revalidate:!1,rollbackOnError:!1})}}async function y(F){if(T){let g=T.find(m=>m.flowId===F);g&&g.flowState!==Ne&&(g.flowState=Ne,g.lastStepId=qs,Object.keys(g.stepStates).forEach(m=>{g.stepStates[m].actionType=Ie,g.stepStates[m].createdAt=new Date().toISOString()}),await f({...u,data:T},{optimisticData:{...u,data:T},revalidate:!1,rollbackOnError:!1}),n(F))}}async function I(F,g){if(T){let m=T.find(C=>C.flowId===F);m&&m.stepStates[g]!==Ie&&(m.stepStates[g]=Ie),await f({...u,data:T},{optimisticData:{...u,data:T},revalidate:!1,rollbackOnError:!1})}}return{userFlowStatesData:T,isLoadingUserFlowStateData:!s,mutateUserFlowState:f,optimisticallyMarkFlowCompleted:S,optimisticallyMarkFlowNotStarted:y,optimisticallyMarkStepCompleted:x,optimisticallyMarkStepNotStarted:I,optimisticallyMarkStepStarted:E,error:w}}function Wt(){let{config:e}=De(),{userFlowStatesData:t,mutateUserFlowState:o}=Ae(),{failedFlowResponses:i,setFailedFlowResponses:r,flowResponses:n,setFlowResponses:s}=Ks(V),[p,d]=cr(new Set),[a,u]=cr(new Set),c=yt();function f(S){let x=JSON.stringify(S);if(p.has(x))return null;p.add(x),d(p),a.add(S),u(a);let E=n==null?void 0:n.find(y=>y.flowSlug===S.flowSlug&&y.stepId===S.stepId&&y.actionType===S.actionType&&y.createdAt===S.createdAt);return c(`${Te}flowResponses`,{...e,method:"POST",body:x}).then(y=>{y.status!==200&&y.status!==201?(console.log("Failed to send flow response for step "+S.stepId+". Will retry again later."),r([...i,S])):E||s(I=>[...I??[],S])})}async function w(S){S.foreignUserId&&(S.actionType===lt||S.actionType===Ne?await f(S):S.actionType===K?await f(S):S.actionType===io?await f(S):S.actionType===Le?await f(S):S.actionType===ro?await f(S):S.actionType===Ie&&await f(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 y=x.stepStates[E];S.push({foreignUserId:x.foreignUserId,flowSlug:x.flowId,stepId:y.stepId,actionType:y.actionType,data:{},createdAt:new Date(y.createdAt),blocked:y.blocked,hidden:y.hidden})}}),[...S,...n]}return{addResponse:w,setFlowResponses:s,getFlowResponses:T}}import Zs from"swr";var Ys=/user.flow\(([^\)]+)\) == '?COMPLETED_FLOW'?/gm,mr=e=>{let t=Ys.exec(e);if(t===null)return null;let o=null;return t.forEach((i,r)=>{let n=Xs(i,"'","");n.startsWith("flow_")&&(o=n)}),o},Xs=function(e,t,o){return e.replace(new RegExp(t,"g"),o)};function Y(){let{config:e}=De(),{flows:t,setFlows:o,userId:i,publicApiKey:r,customVariables:n,setCustomVariables:s,hasActiveFullPageFlow:p,setHasActiveFullPageFlow:d,setFlowResponses:a,setShouldGracefullyDegrade:u}=Js(V),c={data:[]},{verifySDKInitiated:f}=bt(),{addResponse:w,getFlowResponses:T}=Wt(),S=h=>fetch(h,e).then(b=>b.ok?b.json():(console.log(`Error fetching ${h} (${b.status}): ${b.statusText}. .Will gracefully degrade and hide Frigade`),u(!0),c)).catch(b=>(console.log(`Error fetching ${h}: ${b}. Will gracefully degrade and hide Frigade`),u(!0),c)),{userFlowStatesData:x,isLoadingUserFlowStateData:E,optimisticallyMarkFlowCompleted:y,optimisticallyMarkFlowNotStarted:I,optimisticallyMarkStepCompleted:F,optimisticallyMarkStepNotStarted:g,optimisticallyMarkStepStarted:m}=Ae(),{data:C,error:v,isLoading:U}=Zs(r?`${Te}flows`:null,S,{keepPreviousData:!0});Qs(()=>{if(v){console.error(v);return}C&&C.data&&(C.data=o(C.data))},[C,v]);function $(h){if(U)return null;let b=t.find(P=>P.slug===h);return!b&&t.length>0&&!E&&!U?(console.log(`Flow with slug ${h} not found`),null):(b==null?void 0:b.active)===!1?null:b}function _(h){var G;if(!$(h))return[];let b=$(h).data;return b?(b=A(b),(((G=JSON.parse(b))==null?void 0:G.data)??[]).map(ae=>{let z=ke(ae);return{handleSecondaryButtonClick:()=>{ae.skippable===!0&&W(h,ae.id,{skipped:!0})},...ae,complete:L(h,ae.id)===Le||z>=1,blocked:N(h,ae.id),hidden:ee(h,ae.id),handlePrimaryButtonClick:()=>{(!ae.completionCriteria&&(ae.autoMarkCompleted||ae.autoMarkCompleted===void 0)||ae.completionCriteria&&ae.autoMarkCompleted===!0)&&W(h,ae.id)},progress:z}}).filter(ae=>ae.hidden!==!0)):[]}function A(h){return h.replace(/\${(.*?)}/g,(b,P)=>n[P]!==void 0?String(n[P]):"")}function H(h){if(!$(h))return[];let b=$(h).data;return b?(b=A(b),JSON.parse(b)??{}):[]}function B(h,b){s(P=>({...P,[h]:b}))}function M(h){!E&&!U&&h&&JSON.stringify(n)!=JSON.stringify({...n,...h})&&Object.keys(h).forEach(b=>{B(b,h[b])})}let re=at(async(h,b,P)=>{f();let G={foreignUserId:i,flowSlug:h,stepId:b,actionType:io,data:P??{},createdAt:new Date,blocked:!1,hidden:!1};fe(G)&&(await m(h,b,G),w(G))},[i,x]),X=at(async(h,b,P)=>{f();let G={foreignUserId:i,flowSlug:h,stepId:b,actionType:Ie,data:P??{},createdAt:new Date,blocked:!1,hidden:!1};fe(G)&&(await g(h,b),w(G))},[i,x]),W=at(async(h,b,P)=>{f();let G={foreignUserId:i,flowSlug:h,stepId:b,actionType:Le,data:P??{},createdAt:new Date,blocked:!1,hidden:!1};fe(G)&&(await F(h,b,G),w(G))},[i,x]),be=at(async(h,b)=>{if(f(),ue(h)===Ne)return;let P={foreignUserId:i,flowSlug:h,stepId:"unknown",actionType:Ne,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};await I(h),fe(P)&&w(P)},[i,x]),me=at(async(h,b)=>{f();let P={foreignUserId:i,flowSlug:h,stepId:"unknown",actionType:lt,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};fe(P)&&w(P)},[i,x]),j=at(async(h,b)=>{f();let P={foreignUserId:i,flowSlug:h,stepId:"unknown",actionType:K,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};fe(P)&&(await y(h),w(P))},[i,x]),J=at(async(h,b)=>{f();let P={foreignUserId:i,flowSlug:h,stepId:"unknown",actionType:ro,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};fe(P)&&(await y(h),w(P))},[i,x]);function fe(h){var b;if(!x&&h.actionType===Ie)return!1;if(x){let P=x.find(G=>G.flowId===h.flowSlug);if(h.actionType===Ie&&(!(P!=null&&P.stepStates[h.stepId])||P.stepStates[h.stepId].actionType===Ie)||P&&((b=P.stepStates[h.stepId])==null?void 0:b.actionType)===h.actionType||P&&P.flowState===K&&h.actionType===K)return!1}return!0}function L(h,b){let P=te(h,b);return E?null:P?P.actionType:Ie}function N(h,b){let P=te(h,b);return P?P.blocked:!1}function ee(h,b){let P=te(h,b);return P?P.hidden:!1}function te(h,b){if(E)return null;let P=x==null?void 0:x.find(G=>G.flowId===h);return!P||!P.stepStates[b]?null:P.stepStates[b]??null}function we(h){var P;if(E||!x)return null;if(ue(h)===Ne)return _(h)[0]??null;let b=(P=x.find(G=>G.flowId===h))==null?void 0:P.lastStepId;return b?_(h).find(G=>G.id===b):null}function it(h){let b=we(h);if(!b)return 0;let P=_(h).findIndex(G=>G.id===b.id)??0;return L(h,b.id)===Le&&P<_(h).length-1?P+1:P}function ke(h){if(!h.completionCriteria)return;let b=mr(h.completionCriteria);if(b===null)return;let P=He(b),G=Ge(b);return G===0?void 0:P/G}function ue(h){let b=x==null?void 0:x.find(P=>P.flowId===h);return b?b.flowState:null}function He(h){let b=_(h);return b.length===0?0:b.filter(G=>L(h,G.id)===Le).length}function Ge(h){return _(h).length}function q(h){return JSON.parse(t.find(b=>b.slug===h).data)}function he(h){if(E)return!0;if(h!=null&&h.targetingLogic&&x){let b=x.find(P=>P.flowId===h.slug);if(b)return b.shouldTrigger===!1}return!!(h!=null&&h.targetingLogic&&i&&i.startsWith("guest_"))}function nt(h){return!he($(h))}return{getFlow:$,getFlowData:q,isLoading:E||U,getStepStatus:L,getFlowSteps:_,getCurrentStepIndex:it,markStepStarted:re,markStepCompleted:W,markFlowNotStarted:be,markFlowStarted:me,markFlowCompleted:j,markFlowAborted:J,markStepNotStarted:X,getFlowStatus:ue,getNumberOfStepsCompleted:He,getNumberOfSteps:Ge,targetingLogicShouldHideFlow:he,setCustomVariable:B,updateCustomVariables:M,customVariables:n,getStepOptionalProgress:ke,getFlowMetadata:H,isStepBlocked:N,isStepHidden:ee,hasActiveFullPageFlow:p,setHasActiveFullPageFlow:d,isFlowAvailableToUser:nt}}import{useCallback as ur,useContext as Rs,useEffect as el}from"react";var wt="guest_";function Lo(){let{userId:e,organizationId:t,setUserId:o,setUserProperties:i,shouldGracefullyDegrade:r}=Rs(V),{config:n}=De(),{mutateUserFlowState:s}=Ae(),p=yt(),{verifySDKInitiated:d}=bt();el(()=>{if(e&&!t){if(e.startsWith(wt))return;let c=`frigade-user-registered-${e}`;localStorage.getItem(c)||(p(`${Te}users`,{...n,method:"POST",body:JSON.stringify({foreignId:e})}),localStorage.setItem(c,"true"))}},[e,r,t]);let a=ur(async c=>{d();let f={foreignId:e,properties:c};await p(`${Te}users`,{...n,method:"POST",body:JSON.stringify(f)}),i(w=>({...w,...c})),s()},[e,n,r,s]),u=ur(async(c,f)=>{d();let T={foreignId:e,events:[{event:c,properties:f}]};await p(`${Te}users`,{...n,method:"POST",body:JSON.stringify(T)}),s()},[e,n,s]);return{userId:e,setUserId:o,addPropertiesToUser:a,trackEventForUser:u}}import{v4 as Fa}from"uuid";import Me,{useEffect as Sa,useState as ya}from"react";import je,{useEffect as sl}from"react";import so from"styled-components";import tl from"react";import ol from"styled-components";var fr="fr-",zt="cfr-";function l(e,t){let o=`${fr}${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+" "+zt+e}return o}function k(e){if(!e.className||e.className.indexOf(zt)!==-1)return"";let o=e.className.replace(/\s+/g," ").split(" ");return o.length==1&&o[0].startsWith(fr)?"":`:not(${o.map(i=>`.${i}`).join(", ")})`}function Oo(e){return e.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g,"$1-$2").toLowerCase()}function pt(e){return e!=null&&e.styleOverrides?Object.keys(e.styleOverrides).map(t=>`${Oo(t)}: ${e.styleOverrides[t]};`).join(" "):""}function xe(...e){return e.filter(Boolean).join(" ")}function gr(e){return e.charAt(0).toUpperCase()+e.slice(1)}var rl=ol.div`
|
|
2
|
+
import gt,{createContext as Pa,useEffect as Yo,useState as Ne}from"react";import{ThemeProvider as va}from"styled-components";import ft,{useContext as Fa,useEffect as bo,useState as Ko}from"react";import{useCallback as pt,useContext as Qs,useEffect as Zs}from"react";import No,{useMemo as _s}from"react";var dr="1.32.42 ";var ke="https://api.frigade.com/v1/public/",Ie="NOT_STARTED_STEP",X="COMPLETED_FLOW",io="ABORTED_FLOW",at="STARTED_FLOW",Le="NOT_STARTED_FLOW",Oe="COMPLETED_STEP",no="STARTED_STEP";function $e(){let{publicApiKey:e,userId:t}=No.useContext(q);return{config:_s(()=>({headers:{Authorization:`Bearer ${e}`,"Content-Type":"application/json","X-Frigade-SDK-Version":dr,"X-Frigade-SDK-Platform":"React"}}),[e,t])}}var Ws="frigade-last-call-at-",zs="frigade-last-call-data-";function wt(){let{shouldGracefullyDegrade:e}=No.useContext(q);return async(t,o)=>{if(e)return console.log(`Skipping ${t} call to Frigade due to error`),Wt();let i=Ws+t,r=zs+t;if(window&&window.localStorage&&o&&o.body&&o.method==="POST"){let s=window.localStorage.getItem(i),p=window.localStorage.getItem(r);if(s&&p&&p==o.body){let d=new Date(s);if(new Date().getTime()-d.getTime()<1e3)return Wt()}window.localStorage.setItem(i,new Date().toISOString()),window.localStorage.setItem(r,o.body)}let n;try{n=await fetch(t,o)}catch(s){return Wt(s)}return n?n.ok?n:Wt(n.statusText):Wt()}}function Wt(e){return e&&console.log("Call to Frigade failed",e),{json:()=>({})}}function Tt(){let{publicApiKey:e,shouldGracefullyDegrade:t}=No.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 Ys,useState as cr}from"react";import{useContext as js,useEffect as Gs,useState as Vs}from"react";import qs from"swr";import{useContext as Hs}from"react";function ve(){let{openFlowStates:e,setOpenFlowStates:t,hasActiveFullPageFlow:o,setCompletedFlowsToKeepOpenDuringSession:i,completedFlowsToKeepOpenDuringSession:r}=Hs(q);function n(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){r.includes(c)||i(u=>[...u,c])}function a(c){return r.includes(c)}function f(){return Object.values(e).some(c=>c)||o}return{getOpenFlowState:n,setOpenFlowState:s,resetOpenFlowState:p,hasOpenModals:f,setKeepCompletedFlowOpenDuringSession:d,shouldKeepCompletedFlowOpenDuringSession:a}}var Ks="unknown";function Be(){let{config:e}=$e(),{publicApiKey:t,userId:o,flows:i,setShouldGracefullyDegrade:r}=js(q),{resetOpenFlowState:n}=ve(),[s,p]=Vs(!1),d={data:i.map(F=>({flowId:F.id,flowState:X,lastStepId:null,userId:o,foreignUserId:o,stepStates:{},shouldTrigger:!1}))},a=F=>fetch(F,e).then(x=>{if(x.ok)return x.json();throw new Error("Failed to fetch user flow states")}).catch(x=>(console.log(`Error fetching ${F}: ${x}. Will gracefully degrade and hide Frigade`),r(!0),d)),{data:f,isLoading:c,mutate:u,error:w}=qs(t&&i&&o?`${ke}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;Gs(()=>{!s&&!c&&T&&p(!0)},[T,s,c]);async function S(F){if(T){let x=T.find(m=>m.flowId===F);x&&x.flowState!==X&&(x.flowState=X),await u(Promise.resolve({...f,data:T}),{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1})}}async function h(F,x,m){if(T){let C=T.find(P=>P.flowId===F);C&&(C.stepStates[x]=m,C.flowState=at),await u(Promise.resolve({...f,data:T}),{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1})}}async function E(F,x,m){if(T){let C=T.find(P=>P.flowId===F);C&&(C.lastStepId=x,C.stepStates[x]=m,C.flowState=at),await u({...f,data:T},{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1})}}async function y(F){if(T){let x=T.find(m=>m.flowId===F);x&&x.flowState!==Le&&(x.flowState=Le,x.lastStepId=Ks,Object.keys(x.stepStates).forEach(m=>{x.stepStates[m].actionType=Ie,x.stepStates[m].createdAt=new Date().toISOString()}),await u({...f,data:T},{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1}),n(F))}}async function A(F,x){if(T){let m=T.find(C=>C.flowId===F);m&&m.stepStates[x]!==Ie&&(m.stepStates[x]=Ie),await u({...f,data:T},{optimisticData:{...f,data:T},revalidate:!1,rollbackOnError:!1})}}return{userFlowStatesData:T,isLoadingUserFlowStateData:!s,mutateUserFlowState:u,optimisticallyMarkFlowCompleted:S,optimisticallyMarkFlowNotStarted:y,optimisticallyMarkStepCompleted:h,optimisticallyMarkStepNotStarted:A,optimisticallyMarkStepStarted:E,error:w}}function zt(){let{config:e}=$e(),{userFlowStatesData:t,mutateUserFlowState:o}=Be(),{failedFlowResponses:i,setFailedFlowResponses:r,flowResponses:n,setFlowResponses:s}=Ys(q),[p,d]=cr(new Set),[a,f]=cr(new Set),c=wt();function u(S){let h=JSON.stringify(S);if(p.has(h))return null;p.add(h),d(p),a.add(S),f(a);let E=n==null?void 0:n.find(y=>y.flowSlug===S.flowSlug&&y.stepId===S.stepId&&y.actionType===S.actionType&&y.createdAt===S.createdAt);return c(`${ke}flowResponses`,{...e,method:"POST",body:h}).then(y=>{y.status!==200&&y.status!==201?(console.log("Failed to send flow response for step "+S.stepId+". Will retry again later."),r([...i,S])):E||s(A=>[...A??[],S])})}async function w(S){S.foreignUserId&&(S.actionType===at||S.actionType===Le?await u(S):S.actionType===X?await u(S):S.actionType===no?await u(S):S.actionType===Oe?await u(S):S.actionType===io?await u(S):S.actionType===Ie&&await u(S))}function T(){let S=[];return t==null||t.forEach(h=>{if(h&&h.stepStates&&Object.keys(h.stepStates).length!==0)for(let E in h.stepStates){let y=h.stepStates[E];S.push({foreignUserId:h.foreignUserId,flowSlug:h.flowId,stepId:y.stepId,actionType:y.actionType,data:{},createdAt:new Date(y.createdAt),blocked:y.blocked,hidden:y.hidden})}}),[...S,...n]}return{addResponse:w,setFlowResponses:s,getFlowResponses:T}}import Rs from"swr";var Xs=/user.flow\(([^\)]+)\) == '?COMPLETED_FLOW'?/gm,mr=e=>{let t=Xs.exec(e);if(t===null)return null;let o=null;return t.forEach((i,r)=>{let n=Js(i,"'","");n.startsWith("flow_")&&(o=n)}),o},Js=function(e,t,o){return e.replace(new RegExp(t,"g"),o)};function J(){let{config:e}=$e(),{flows:t,setFlows:o,userId:i,publicApiKey:r,customVariables:n,setCustomVariables:s,hasActiveFullPageFlow:p,setHasActiveFullPageFlow:d,setFlowResponses:a,setShouldGracefullyDegrade:f}=Qs(q),c={data:[]},{verifySDKInitiated:u}=Tt(),{addResponse:w,getFlowResponses:T}=zt(),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:h,isLoadingUserFlowStateData:E,optimisticallyMarkFlowCompleted:y,optimisticallyMarkFlowNotStarted:A,optimisticallyMarkStepCompleted:F,optimisticallyMarkStepNotStarted:x,optimisticallyMarkStepStarted:m}=Be(),{data:C,error:P,isLoading:$}=Rs(r?`${ke}flows`:null,S,{keepPreviousData:!0});Zs(()=>{if(P){console.error(P);return}C&&C.data&&(C.data=o(C.data))},[C,P]);function U(g){if($)return null;let b=t.find(v=>v.slug===g);return!b&&t.length>0&&!E&&!$?(console.log(`Flow with slug ${g} not found`),null):(b==null?void 0:b.active)===!1?null:b}function M(g){var H;if(!U(g))return[];let b=U(g).data;return b?(b=I(b),(((H=JSON.parse(b))==null?void 0:H.data)??[]).map(ce=>{let z=oe(ce);return{handleSecondaryButtonClick:()=>{ce.skippable===!0&&_(g,ce.id,{skipped:!0})},...ce,complete:L(g,ce.id)===Oe||z>=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)&&_(g,ce.id)},progress:z}}).filter(ce=>ce.hidden!==!0)):[]}function I(g){return g.replace(/\${(.*?)}/g,(b,v)=>n[v]!==void 0?String(n[v]):"")}function j(g){if(!U(g))return[];let b=U(g).data;return b?(b=I(b),JSON.parse(b)??{}):[]}function B(g,b){s(v=>({...v,[g]:b}))}function D(g){!E&&!$&&g&&JSON.stringify(n)!=JSON.stringify({...n,...g})&&Object.keys(g).forEach(b=>{B(b,g[b])})}let re=pt(async(g,b,v)=>{u();let H={foreignUserId:i,flowSlug:g,stepId:b,actionType:no,data:v??{},createdAt:new Date,blocked:!1,hidden:!1};G(H)&&(await m(g,b,H),w(H))},[i,h]),R=pt(async(g,b,v)=>{u();let H={foreignUserId:i,flowSlug:g,stepId:b,actionType:Ie,data:v??{},createdAt:new Date,blocked:!1,hidden:!1};G(H)&&(await x(g,b),w(H))},[i,h]),_=pt(async(g,b,v)=>{u();let H={foreignUserId:i,flowSlug:g,stepId:b,actionType:Oe,data:v??{},createdAt:new Date,blocked:!1,hidden:!1};G(H)&&(await F(g,b,H),w(H))},[i,h]),he=pt(async(g,b)=>{if(u(),K(g)===Le)return;let v={foreignUserId:i,flowSlug:g,stepId:"unknown",actionType:Le,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};await A(g),G(v)&&w(v)},[i,h]),Fe=pt(async(g,b)=>{u();let v={foreignUserId:i,flowSlug:g,stepId:"unknown",actionType:at,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};G(v)&&w(v)},[i,h]),W=pt(async(g,b)=>{u();let v={foreignUserId:i,flowSlug:g,stepId:"unknown",actionType:X,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};G(v)&&(await y(g),w(v))},[i,h]),se=pt(async(g,b)=>{u();let v={foreignUserId:i,flowSlug:g,stepId:"unknown",actionType:io,data:b??{},createdAt:new Date,blocked:!1,hidden:!1};G(v)&&(await y(g),w(v))},[i,h]);function G(g){var b;if(!h&&g.actionType===Ie)return!1;if(h){let v=h.find(H=>H.flowId===g.flowSlug);if(g.actionType===Ie&&(!(v!=null&&v.stepStates[g.stepId])||v.stepStates[g.stepId].actionType===Ie)||v&&((b=v.stepStates[g.stepId])==null?void 0:b.actionType)===g.actionType||v&&v.flowState===X&&g.actionType===X)return!1}return!0}function L(g,b){let v=Ce(g,b);return E?null:v?v.actionType:Ie}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=h==null?void 0:h.find(H=>H.flowId===g);return!v||!v.stepStates[b]?null:v.stepStates[b]??null}function V(g){var v;if(E||!h)return null;if(K(g)===Le)return M(g)[0]??null;let b=(v=h.find(H=>H.flowId===g))==null?void 0:v.lastStepId;return b?M(g).find(H=>H.id===b):null}function de(g){let b=V(g);if(!b)return 0;let v=M(g).findIndex(H=>H.id===b.id)??0;return L(g,b.id)===Oe&&v<M(g).length-1?v+1:v}function oe(g){if(!g.completionCriteria)return;let b=mr(g.completionCriteria);if(b===null)return;let v=je(b),H=Ge(b);return H===0?void 0:v/H}function K(g){let b=h==null?void 0:h.find(v=>v.flowId===g);return b?b.flowState:null}function je(g){let b=M(g);return b.length===0?0:b.filter(H=>L(g,H.id)===Oe).length}function Ge(g){return M(g).length}function Y(g){return JSON.parse(t.find(b=>b.slug===g).data)}function Se(g){if(E)return!0;if(g!=null&&g.targetingLogic&&h){let b=h.find(v=>v.flowId===g.slug);if(b)return b.shouldTrigger===!1}return!!(g!=null&&g.targetingLogic&&i&&i.startsWith("guest_"))}function st(g){return!Se(U(g))}return{getFlow:U,getFlowData:Y,isLoading:E||$,getStepStatus:L,getFlowSteps:M,getCurrentStepIndex:de,markStepStarted:re,markStepCompleted:_,markFlowNotStarted:he,markFlowStarted:Fe,markFlowCompleted:W,markFlowAborted:se,markStepNotStarted:R,getFlowStatus:K,getNumberOfStepsCompleted:je,getNumberOfSteps:Ge,targetingLogicShouldHideFlow:Se,setCustomVariable:B,updateCustomVariables:D,customVariables:n,getStepOptionalProgress:oe,getFlowMetadata:j,isStepBlocked:te,isStepHidden:xe,hasActiveFullPageFlow:p,setHasActiveFullPageFlow:d,isFlowAvailableToUser:st}}import{useCallback as ur,useContext as el,useEffect as tl}from"react";var Ft="guest_";function Lo(){let{userId:e,organizationId:t,setUserId:o,setUserProperties:i,shouldGracefullyDegrade:r}=el(q),{config:n}=$e(),{mutateUserFlowState:s}=Be(),p=wt(),{verifySDKInitiated:d}=Tt();tl(()=>{if(e&&!t){if(e.startsWith(Ft))return;let c=`frigade-user-registered-${e}`;localStorage.getItem(c)||(p(`${ke}users`,{...n,method:"POST",body:JSON.stringify({foreignId:e})}),localStorage.setItem(c,"true"))}},[e,r,t]);let a=ur(async c=>{d();let u={foreignId:e,properties:c};await p(`${ke}users`,{...n,method:"POST",body:JSON.stringify(u)}),i(w=>({...w,...c})),s()},[e,n,r,s]),f=ur(async(c,u)=>{d();let T={foreignId:e,events:[{event:c,properties:u}]};await p(`${ke}users`,{...n,method:"POST",body:JSON.stringify(T)}),s()},[e,n,s]);return{userId:e,setUserId:o,addPropertiesToUser:a,trackEventForUser:f}}import{v4 as ka}from"uuid";import Ue,{useEffect as ya,useState as ba}from"react";import Ve,{useEffect as ll}from"react";import lo from"styled-components";import ol from"react";import rl from"styled-components";var fr="fr-",Ht="cfr-";function l(e,t){let o=`${fr}${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+" "+Ht+e}return o}function k(e){if(!e.className||e.className.indexOf(Ht)!==-1)return"";let o=e.className.replace(/\s+/g," ").split(" ");return o.length==1&&o[0].startsWith(fr)?"":`:not(${o.map(i=>`.${i}`).join(", ")})`}function Oo(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=>`${Oo(t)}: ${e.styleOverrides[t]};`).join(" "):""}function ye(...e){return e.filter(Boolean).join(" ")}function gr(e){return e.charAt(0).toUpperCase()+e.slice(1)}var il=rl.div`
|
|
3
3
|
display: flex;
|
|
4
4
|
justify-content: center;
|
|
5
5
|
position: fixed;
|
|
@@ -23,11 +23,11 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
23
23
|
opacity: 1;
|
|
24
24
|
}
|
|
25
25
|
}
|
|
26
|
-
`,hr=({onClose:e,appearance:t})=>
|
|
26
|
+
`,hr=({onClose:e,appearance:t})=>ol.createElement(il,{className:l("modalBackground",t),onClick:()=>e()});import so from"react";import nl from"styled-components";var sl=nl.div`
|
|
27
27
|
:hover {
|
|
28
28
|
opacity: 0.8;
|
|
29
29
|
}
|
|
30
|
-
`,
|
|
30
|
+
`,Ee=()=>so.createElement(sl,null,so.createElement("svg",{width:"12",height:"12",viewBox:"0 0 14 14",fill:"none",xmlns:"http://www.w3.org/2000/svg"},so.createElement("rect",{y:"1.39844",width:"1.97669",height:"17.8213",rx:"0.988346",transform:"rotate(-45 0 1.39844)",fill:"currentColor"}),so.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 al}from"react-portal";var pl=lo.div`
|
|
31
31
|
${e=>k(e)} {
|
|
32
32
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
33
33
|
background-color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBackground}};
|
|
@@ -45,7 +45,7 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
45
45
|
|
|
46
46
|
border-radius: ${e=>{var t,o;return((o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.borderRadius)??8}}px;
|
|
47
47
|
|
|
48
|
-
${e=>
|
|
48
|
+
${e=>dt(e)}
|
|
49
49
|
}
|
|
50
50
|
|
|
51
51
|
padding: 32px;
|
|
@@ -72,10 +72,10 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
72
72
|
opacity: 1;
|
|
73
73
|
}
|
|
74
74
|
}
|
|
75
|
-
`,
|
|
75
|
+
`,dl=lo.div`
|
|
76
76
|
position: relative;
|
|
77
77
|
flex: 0 1 auto;
|
|
78
|
-
`,
|
|
78
|
+
`,cl=lo.div`
|
|
79
79
|
position: absolute;
|
|
80
80
|
top: 24px;
|
|
81
81
|
right: 24px;
|
|
@@ -85,14 +85,14 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
85
85
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
86
86
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
87
87
|
}
|
|
88
|
-
`,
|
|
88
|
+
`,ml=lo.div`
|
|
89
89
|
overflow: scroll;
|
|
90
90
|
flex: 1 1;
|
|
91
91
|
display: flex;
|
|
92
92
|
::-webkit-scrollbar {
|
|
93
93
|
display: none;
|
|
94
94
|
}
|
|
95
|
-
`,
|
|
95
|
+
`,Ze=({onClose:e,visible:t,headerContent:o=null,style:i=null,children:r,appearance:n,dismissible:s=!0})=>(ll(()=>{let p=d=>{d.key==="Escape"&&e()};return document.addEventListener("keydown",p),t?document.body.style.overflow="hidden":document.body.style.overflow="unset",()=>{document.body.style.overflow="unset",document.removeEventListener("keydown",p)}},[e,t]),t?Ve.createElement(al,null,Ve.createElement(hr,{appearance:n,onClose:()=>{s&&e()}}),Ve.createElement(pl,{appearance:n,className:l("modalContainer",n),styleOverrides:i},s&&Ve.createElement(cl,{className:l("modalClose",n),onClick:()=>e(),appearance:n},Ve.createElement(Ee,null)),o&&Ve.createElement(dl,null,o),Ve.createElement(ml,null,r))):Ve.createElement(Ve.Fragment,null));import Re,{useEffect as ul}from"react";import ao from"styled-components";import{Portal as fl}from"react-portal";var gl=ao.div`
|
|
96
96
|
${e=>k(e)} {
|
|
97
97
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
98
98
|
background: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBackground}};
|
|
@@ -110,10 +110,10 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
110
110
|
bottom: 0;
|
|
111
111
|
margin-right: 28px;
|
|
112
112
|
margin-bottom: 28px;
|
|
113
|
-
`,
|
|
113
|
+
`,hl=ao.div`
|
|
114
114
|
position: relative;
|
|
115
115
|
flex: 1;
|
|
116
|
-
`,
|
|
116
|
+
`,xl=ao.div`
|
|
117
117
|
position: absolute;
|
|
118
118
|
top: 24px;
|
|
119
119
|
right: 24px;
|
|
@@ -123,13 +123,13 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
123
123
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
124
124
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
125
125
|
}
|
|
126
|
-
`,
|
|
126
|
+
`,Cl=ao.div`
|
|
127
127
|
overflow: scroll;
|
|
128
128
|
flex: 5;
|
|
129
129
|
::-webkit-scrollbar {
|
|
130
130
|
display: none;
|
|
131
131
|
}
|
|
132
|
-
`,xr=({onClose:e,visible:t,headerContent:o=null,children:i,appearance:r})=>(
|
|
132
|
+
`,xr=({onClose:e,visible:t,headerContent:o=null,children:i,appearance:r})=>(ul(()=>{let n=s=>{s.key==="Escape"&&e()};return document.addEventListener("keydown",n),t?document.body.style.overflow="hidden":document.body.style.overflow="unset",()=>{document.body.style.overflow="unset",document.removeEventListener("keydown",n)}},[e,t]),t?Re.createElement(fl,null,Re.createElement(gl,{appearance:r,className:l("cornerModalContainer",r)},Re.createElement(xl,{className:l("cornerModalClose",r),onClick:()=>e()},Re.createElement(Ee,null)),o&&Re.createElement(hl,null,o),Re.createElement(Cl,null,i))):Re.createElement(Re.Fragment,null));import{useContext as Sl}from"react";function Q(){let{defaultAppearance:e}=Sl(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 Il,useState as _o}from"react";import Wo from"styled-components";import mo,{useEffect as yl,useState as Tr}from"react";import Mo from"styled-components";import po from"styled-components";var Cr=po.label`
|
|
133
133
|
${e=>k(e)} {
|
|
134
134
|
font-size: 14px;
|
|
135
135
|
line-height: 20px;
|
|
@@ -137,27 +137,27 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
137
137
|
margin-top: 10px;
|
|
138
138
|
}
|
|
139
139
|
display: flex;
|
|
140
|
-
`,Sr=
|
|
140
|
+
`,Sr=po.label`
|
|
141
141
|
${e=>k(e)} {
|
|
142
142
|
font-size: 12px;
|
|
143
143
|
line-height: 20px;
|
|
144
144
|
margin-bottom: 5px;
|
|
145
145
|
}
|
|
146
146
|
display: flex;
|
|
147
|
-
`,yr=
|
|
147
|
+
`,yr=po.span`
|
|
148
148
|
font-weight: 400;
|
|
149
149
|
font-size: 14px;
|
|
150
150
|
line-height: 22px;
|
|
151
|
-
color:
|
|
151
|
+
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextError}};
|
|
152
152
|
display: flex;
|
|
153
153
|
margin-right: 5px;
|
|
154
154
|
margin-top: 10px;
|
|
155
|
-
`,po
|
|
155
|
+
`,co=po.div`
|
|
156
156
|
display: flex;
|
|
157
157
|
align-items: flex-start;
|
|
158
158
|
justify-content: left;
|
|
159
159
|
margin-bottom: 10px;
|
|
160
|
-
`;import Do from"react";function
|
|
160
|
+
`;import Do from"react";function et({title:e,required:t,appearance:o}){return Do.createElement(co,null,t?Do.createElement(yr,{className:l("formLabelRequired",o),appearance:o},"*"):null,Do.createElement(Cr,{className:l("formLabel",o)},e))}import br from"react";function kt({title:e,appearance:t}){return e?br.createElement(co,null,br.createElement(Sr,{className:l("formSubLabel",t)},e)):null}import{z as $o}from"zod";function wr(e,t){try{if(t){if(t.type=="number"){let o=$o.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=$o.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 $o.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 bl=Mo.div`
|
|
161
161
|
display: flex;
|
|
162
162
|
flex-direction: column;
|
|
163
163
|
width: 100%;
|
|
@@ -177,7 +177,7 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
177
177
|
box-sizing: border-box;
|
|
178
178
|
padding: 0 10px;
|
|
179
179
|
margin-bottom: 10px;
|
|
180
|
-
`,
|
|
180
|
+
`,wl=Mo.textarea`
|
|
181
181
|
${e=>k(e)} {
|
|
182
182
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
183
183
|
border: 1px solid ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBorder}};
|
|
@@ -193,13 +193,13 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
193
193
|
min-height: 70px;
|
|
194
194
|
box-sizing: border-box;
|
|
195
195
|
margin-bottom: 10px;
|
|
196
|
-
`;function Fr({formInput:e,customFormTypeProps:t,onSaveInputData:o,setFormValidationErrors:i,inputData:r}){let n=e,[s,p]=Tr((r==null?void 0:r.text)||""),[d,a]=Tr(!1),
|
|
196
|
+
`;function Fr({formInput:e,customFormTypeProps:t,onSaveInputData:o,setFormValidationErrors:i,inputData:r}){let n=e,[s,p]=Tr((r==null?void 0:r.text)||""),[d,a]=Tr(!1),f=Uo;yl(()=>{s===""&&!d&&(a(!0),c(""))},[]);function c(w){if(p(w),o({text:w}),n.required===!0&&w.trim()===""){i([{id:n.id,message:`${n.title} is required`}]);return}let T=wr(w,n.validation);if(T){i([{id:n.id,message:T}]);return}i([])}n.multiline&&(f=wl);function u(){var w;switch((w=n==null?void 0:n.validation)==null?void 0:w.type){case"email":return"email";case"number":return"number";case"password":return"password"}return null}return mo.createElement(bl,null,mo.createElement(et,{title:n.title,required:n.required,appearance:t.appearance}),mo.createElement(f,{className:l("inputComponent",t.appearance),value:s,onChange:w=>{c(w.target.value)},appearance:t.appearance,placeholder:n.placeholder,type:u()}),mo.createElement(kt,{title:n.subtitle,appearance:t.appearance}))}import Me,{useEffect as kr,useState as Pr}from"react";import vr from"styled-components";var Tl=vr.div`
|
|
197
197
|
display: flex;
|
|
198
198
|
flex-direction: column;
|
|
199
199
|
width: 100%;
|
|
200
200
|
-webkit-appearance: none;
|
|
201
201
|
appearance: none;
|
|
202
|
-
`,
|
|
202
|
+
`,Fl=vr.select`
|
|
203
203
|
${e=>k(e)} {
|
|
204
204
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
205
205
|
border: 1px solid ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBorder}};
|
|
@@ -223,13 +223,13 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
223
223
|
background-repeat: no-repeat;
|
|
224
224
|
background-size: 1.5em 1.5em;
|
|
225
225
|
-webkit-print-color-adjust: exact;
|
|
226
|
-
`,
|
|
226
|
+
`,uo="null";function Er({formInput:e,customFormTypeProps:t,onSaveInputData:o,inputData:i,setFormValidationErrors:r}){var f,c,u,w,T,S;let n=e,[s,p]=Pr(((f=i==null?void 0:i.choice)==null?void 0:f[0])||""),[d,a]=Pr(!1);return kr(()=>{var h,E,y,A;if(s===""&&!d){if(a(!0),n.requireSelection){p(uo);return}if(n.defaultValue&&((h=n.props.options)!=null&&h.find(F=>F.id===n.defaultValue))){let F=(E=n.props.options)==null?void 0:E.find(x=>x.id===n.defaultValue);p(F.id),o({choice:[F.id]})}else p(((y=n.props.options)==null?void 0:y[0].id)||""),o({choice:[((A=n.props.options)==null?void 0:A[0].id)||""]})}},[]),kr(()=>{n.requireSelection&&s===uo?r([{message:"Please select an option",id:n.id}]):r([])},[s]),Me.createElement(Tl,null,Me.createElement(et,{title:n.title,required:!1,appearance:t.appearance}),Me.createElement(Fl,{value:s,onChange:h=>{p(h.target.value),o({choice:[h.target.value]})},placeholder:n.placeholder,appearance:t.appearance,className:l("multipleChoiceSelect",t.appearance)},n.requireSelection&&Me.createElement("option",{key:uo,value:uo},"Select an option"),(c=n.props.options)==null?void 0:c.map(h=>Me.createElement("option",{key:h.id,value:h.id},h.title))),((w=(u=n.props.options)==null?void 0:u.find(h=>h.id===s))==null?void 0:w.isOpenEnded)&&Me.createElement(Me.Fragment,null,Me.createElement(et,{title:((S=(T=n.props.options)==null?void 0:T.find(h=>h.id===s))==null?void 0:S.openEndedLabel)??"Please specify",required:!1,appearance:t.appearance}),Me.createElement(Uo,{type:"text",placeholder:"Enter your answer here",onChange:h=>{o({choice:[h.target.value]})},appearance:t.appearance})),Me.createElement(kt,{title:n.subtitle,appearance:t.appearance}))}import fo,{useEffect as Ar,useState as Ir}from"react";import Br from"styled-components";var kl=Br.div`
|
|
227
227
|
display: flex;
|
|
228
228
|
flex-direction: column;
|
|
229
229
|
width: 100%;
|
|
230
230
|
-webkit-appearance: none;
|
|
231
231
|
appearance: none;
|
|
232
|
-
`,
|
|
232
|
+
`,Pl=Br.button`
|
|
233
233
|
${e=>k(e)} {
|
|
234
234
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
235
235
|
border: 1px solid ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBorder}};
|
|
@@ -251,7 +251,7 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
251
251
|
height: 60px;
|
|
252
252
|
padding: 0 18px;
|
|
253
253
|
margin-bottom: 10px;
|
|
254
|
-
`;function Nr({formInput:e,customFormTypeProps:t,onSaveInputData:o,inputData:i}){var a;let r=e,[n,s]=
|
|
254
|
+
`;function Nr({formInput:e,customFormTypeProps:t,onSaveInputData:o,inputData:i}){var a;let r=e,[n,s]=Ir((i==null?void 0:i.choice)||[]),[p,d]=Ir(!1);return Ar(()=>{n.length==0&&!p&&(d(!0),o({choice:[]}))},[]),Ar(()=>{o({choice:n})},[n]),fo.createElement(kl,null,fo.createElement(et,{title:r.title,required:r.required,appearance:t.appearance}),(a=r.props.options)==null?void 0:a.map(f=>fo.createElement(Pl,{appearance:t.appearance,key:f.id,value:f.id,"data-selected":n.includes(f.id),onClick:()=>{if(n.includes(f.id)){s(n.filter(c=>c!==f.id));return}n.length<r.props.maxChoices?s([...n,f.id]):n.length==1&&r.props.maxChoices==1&&s([f.id])}},f.title)),fo.createElement(kt,{title:r.subtitle,appearance:t.appearance}))}import go from"react";import Lr from"styled-components";import vl from"dompurify";function me(e){return{__html:vl.sanitize(e,{ALLOWED_TAGS:["b","i","a","span","div","p","pre","u","br","img"],ALLOWED_ATTR:["style","class","target","id","href","alt","src"]})}}var El=Lr.h1`
|
|
255
255
|
${e=>k(e)} {
|
|
256
256
|
font-style: normal;
|
|
257
257
|
font-weight: 600;
|
|
@@ -262,7 +262,7 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
262
262
|
margin-bottom: 4px;
|
|
263
263
|
color: ${e=>e.appearance.theme.colorText};
|
|
264
264
|
}
|
|
265
|
-
`,
|
|
265
|
+
`,Al=Lr.h2`
|
|
266
266
|
${e=>k(e)} {
|
|
267
267
|
font-style: normal;
|
|
268
268
|
font-weight: 400;
|
|
@@ -270,32 +270,35 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
270
270
|
line-height: 20px;
|
|
271
271
|
color: ${e=>e.appearance.theme.colorTextSecondary};
|
|
272
272
|
}
|
|
273
|
-
`;function
|
|
273
|
+
`;function be({appearance:e,title:t,subtitle:o,size:i="medium"}){return go.createElement(go.Fragment,null,go.createElement(El,{appearance:e,className:l(`${i}Title`,e),dangerouslySetInnerHTML:me(t),size:i}),o&&go.createElement(Al,{appearance:e,className:l(`${i}Subtitle`,e),dangerouslySetInnerHTML:me(o),size:i}))}var Bl=Wo.div`
|
|
274
274
|
display: flex;
|
|
275
275
|
flex-direction: column;
|
|
276
276
|
justify-content: flex-end;
|
|
277
277
|
padding-bottom: 14px;
|
|
278
278
|
overflow: visible;
|
|
279
|
-
`,
|
|
279
|
+
`,Nl=Wo.div`
|
|
280
280
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextError}};
|
|
281
281
|
font-size: 12px;
|
|
282
282
|
margin-bottom: 12px;
|
|
283
|
-
`,
|
|
283
|
+
`,Ll=Wo.div`
|
|
284
284
|
padding-left: 1px;
|
|
285
285
|
padding-right: 1px;
|
|
286
|
-
`,
|
|
286
|
+
`,Ol={text:Fr,multipleChoice:Er,multipleChoiceList:Nr};function Or({stepData:e,canContinue:t,setCanContinue:o,onSaveData:i,appearance:r,customFormElements:n}){var E;let s=e.props,[p,d]=_o(S()||{}),[a,f]=_o([]),[c,u]=_o([]),w={...Ol,...n};Il(()=>{o(a.length===0)},[a,o]);function T(y,A){let F={...p,[y.id]:A};d(F),i(F),window&&window.localStorage&&window.localStorage.setItem(h(),JSON.stringify(F))}function S(){if(window&&window.localStorage){let y=window.localStorage.getItem(h());if(y)return JSON.parse(y)}return{}}function h(){return`frigade-multiInputStepTypeData-${e.id}`}return jt.createElement(Ll,{className:l("multiInput",r)},jt.createElement(be,{appearance:r,title:e.title,subtitle:e.subtitle}),jt.createElement(Bl,{className:l("multiInputContainer",r)},(E=s.data)==null?void 0:E.map(y=>{var F;let A=(F=a.reverse().find(x=>x.id===y.id))==null?void 0:F.message;return w[y.type]?jt.createElement("span",{key:y.id},w[y.type]({formInput:y,customFormTypeProps:{stepData:e,canContinue:t,setCanContinue:o,onSaveData:i,appearance:r},onSaveInputData:x=>{!c.includes(y.id)&&x&&(x==null?void 0:x.text)!==""&&u(m=>[...m,y.id]),T(y,x)},inputData:p[y.id],setFormValidationErrors:x=>{f(m=>x.length===0?m.filter(C=>C.id!==y.id):[...m,...x])}}),A&&c.includes(y.id)&&jt.createElement(Nl,{appearance:r,className:l("multiInputValidationError",r)},A)):null})))}import ct from"styled-components";var Dr=ct.div`
|
|
287
287
|
align-items: center;
|
|
288
288
|
display: flex;
|
|
289
289
|
justify-content: space-between;
|
|
290
290
|
padding-top: 14px;
|
|
291
|
-
`,$r=
|
|
291
|
+
`,$r=ct.div`
|
|
292
|
+
color: ${e=>e.appearance.theme.colorTextError};
|
|
293
|
+
font-size: 12px;
|
|
294
|
+
`,Mr=ct.div`
|
|
292
295
|
display: flex;
|
|
293
296
|
gap: 12px;
|
|
294
|
-
`,
|
|
297
|
+
`,Ur=ct.div`
|
|
295
298
|
display: flex;
|
|
296
299
|
flex-direction: row;
|
|
297
300
|
flex: 1 1;
|
|
298
|
-
`,
|
|
301
|
+
`,_r=ct.div`
|
|
299
302
|
display: flex;
|
|
300
303
|
// If type is set to large-modal, use padding 60px horizontal, 80px vertical
|
|
301
304
|
// Otherwise, use 4px padding
|
|
@@ -303,11 +306,11 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
303
306
|
flex-grow: 1;
|
|
304
307
|
flex-basis: 0;
|
|
305
308
|
position: relative;
|
|
306
|
-
`,
|
|
309
|
+
`,Wr=ct.div`
|
|
307
310
|
padding: ${e=>e.type==="large-modal"?"50px":"0px"};
|
|
308
311
|
position: relative;
|
|
309
312
|
overflow-y: auto;
|
|
310
|
-
`,
|
|
313
|
+
`,zr=ct.div`
|
|
311
314
|
display: flex;
|
|
312
315
|
align-self: stretch;
|
|
313
316
|
flex-grow: 1;
|
|
@@ -319,7 +322,7 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
319
322
|
background-position: center;
|
|
320
323
|
border-top-right-radius: ${e=>e.appearance.theme.borderRadius}px;
|
|
321
324
|
border-bottom-right-radius: ${e=>e.appearance.theme.borderRadius}px;
|
|
322
|
-
`;import
|
|
325
|
+
`;import tt from"react";import Dl from"react";import Hr from"styled-components";var $l=Hr.button`
|
|
323
326
|
justify-content: center;
|
|
324
327
|
align-content: center;
|
|
325
328
|
${e=>k(e)} {
|
|
@@ -349,7 +352,7 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
349
352
|
opacity: 0.3;
|
|
350
353
|
cursor: not-allowed;
|
|
351
354
|
}
|
|
352
|
-
`,
|
|
355
|
+
`,ho=Hr.div`
|
|
353
356
|
${e=>k(e)} {
|
|
354
357
|
display: flex;
|
|
355
358
|
flex-direction: row;
|
|
@@ -359,14 +362,14 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
359
362
|
margin-right: 8px;
|
|
360
363
|
}
|
|
361
364
|
}
|
|
362
|
-
`,
|
|
365
|
+
`,ee=({onClick:e,title:t,style:o,disabled:i,type:r="inline",size:n="medium",secondary:s=!1,appearance:p,withMargin:d=!0,classPrefix:a=""})=>{function f(){let c=s?"buttonSecondary":"button";return a===""?c:`${a}${gr(c)}`}return Dl.createElement($l,{secondary:s,appearance:p,disabled:i,onClick:e,style:o,type:r,withMargin:d,size:n,className:l(f(),p)},t)};var jr=({step:e,canContinue:t,appearance:o,onPrimaryClick:i,onSecondaryClick:r,formType:n,selectedStep:s,steps:p,onBack:d,allowBackNavigation:a,errorMessage:f})=>{let c=n==="inline"?"inline":"full-width";return tt.createElement(tt.Fragment,null,f&&tt.createElement($r,{appearance:o,className:l("formCTAError",o)},f),tt.createElement(Dr,{className:l("formCTAContainer",o)},p.length>1&&s!=0&&a&&tt.createElement(ee,{title:"\u2190",onClick:d,secondary:!0,withMargin:!1,type:c,appearance:o}),tt.createElement(Mr,{className:l("ctaWrapper",o)},e.secondaryButtonTitle?tt.createElement(ee,{title:e.secondaryButtonTitle,onClick:r,secondary:!0,withMargin:!1,type:c,appearance:o}):null," ",e.primaryButtonTitle?tt.createElement(ee,{disabled:!t,withMargin:!1,title:e.primaryButtonTitle,onClick:i,type:c,appearance:o}):null)))};import zo from"react";import Ml from"styled-components";var Ul=Ml.div`
|
|
363
366
|
text-align: center;
|
|
364
|
-
`,Gr=({stepCount:e=0,currentStep:t=0,className:o,appearance:i})=>{let{theme:r}=Q().mergeAppearanceWithDefault(i);return zo.createElement(
|
|
367
|
+
`,Gr=({stepCount:e=0,currentStep:t=0,className:o,appearance:i})=>{let{theme:r}=Q().mergeAppearanceWithDefault(i);return zo.createElement(Ul,{className:o},zo.createElement("svg",{width:16*e-8,height:8,viewBox:`0 0 ${16*e-8} 8`,fill:"none"},Array(e).fill(null).map((n,s)=>zo.createElement("rect",{key:s,x:16*s,y:0,width:8,height:8,rx:4,fill:t===s?r.colorPrimary:"#E6E6E6"}))))};import mt from"react";import Pt from"styled-components";import{useContext as _l}from"react";function ne(){let e=_l(q);function t(r){i(r.primaryButtonUri,r.primaryButtonUriTarget)}function o(r){i(r.secondaryButtonUri,r.secondaryButtonUriTarget)}function i(r,n){if(!r)return;let s=r.startsWith("http")?"_blank":"_self";n&&n!=="_blank"&&(s="_self"),e.navigate(r,s)}return{primaryCTAClickSideEffects:t,secondaryCTAClickSideEffects:o,handleUrl:i}}var Wl=Pt.div`
|
|
365
368
|
display: flex;
|
|
366
369
|
flex-wrap: wrap;
|
|
367
370
|
align-content: center;
|
|
368
371
|
justify-content: center;
|
|
369
|
-
`,
|
|
372
|
+
`,zl=Pt.div`
|
|
370
373
|
align-content: center;
|
|
371
374
|
align-items: center;
|
|
372
375
|
display: flex;
|
|
@@ -380,10 +383,10 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
380
383
|
flex-basis: 255px;
|
|
381
384
|
flex-grow: 0;
|
|
382
385
|
flex-shrink: 0;
|
|
383
|
-
`,
|
|
386
|
+
`,Hl=Pt.img`
|
|
384
387
|
width: 78px;
|
|
385
388
|
height: auto;
|
|
386
|
-
`,
|
|
389
|
+
`,jl=Pt.button`
|
|
387
390
|
font-style: normal;
|
|
388
391
|
font-weight: 600;
|
|
389
392
|
font-size: 13px;
|
|
@@ -396,11 +399,11 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
396
399
|
border-radius: 100px;
|
|
397
400
|
padding: 8px 12px;
|
|
398
401
|
margin-top: 16px;
|
|
399
|
-
`,Gl=
|
|
402
|
+
`,Gl=Pt.h1`
|
|
400
403
|
font-weight: 700;
|
|
401
404
|
font-size: 28px;
|
|
402
405
|
line-height: 34px;
|
|
403
|
-
`,
|
|
406
|
+
`,Vl=Pt.h2`
|
|
404
407
|
font-style: normal;
|
|
405
408
|
font-weight: 400;
|
|
406
409
|
font-size: 16px;
|
|
@@ -409,7 +412,7 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
409
412
|
margin-top: 12px;
|
|
410
413
|
margin-bottom: 16px;
|
|
411
414
|
max-width: 70%;
|
|
412
|
-
`;function
|
|
415
|
+
`;function Vr({stepData:e,appearance:t}){var i,r;let{handleUrl:o}=ne();return mt.createElement("div",null,mt.createElement(Gl,null,e.title),mt.createElement(Vl,null,e.subtitle),mt.createElement(Wl,null,(r=(i=e.props)==null?void 0:i.links)==null?void 0:r.map(n=>mt.createElement(zl,{key:n.title},mt.createElement(Hl,{src:n.imageUri}),mt.createElement(jl,{style:{borderColor:t.theme.colorPrimary,color:t.theme.colorPrimary},onClick:()=>{n.uri&&o(n.uri,n.uriTarget??"_blank")}},n.title)))))}import Et,{useEffect as Zl}from"react";import So from"styled-components";import Ho from"react";var xo=({style:e,className:t})=>Ho.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},Ho.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M21 12a9 9 0 11-18 0 9 9 0 0118 0z"}),Ho.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 ql,useState as Kl}from"react";import Co from"styled-components";var Yl=Co.div`
|
|
413
416
|
display: flex;
|
|
414
417
|
align-items: center;
|
|
415
418
|
justify-content: flex-start;
|
|
@@ -417,7 +420,7 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
417
420
|
width: 100%;
|
|
418
421
|
height: 100%;
|
|
419
422
|
position: relative;
|
|
420
|
-
`,
|
|
423
|
+
`,Xl=Co.div`
|
|
421
424
|
position: absolute;
|
|
422
425
|
display: flex;
|
|
423
426
|
align-items: center;
|
|
@@ -436,59 +439,59 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
436
439
|
box-shadow: 0px 6px 25px rgba(0, 0, 0, 0.06);
|
|
437
440
|
border-radius: 50%;
|
|
438
441
|
}
|
|
439
|
-
`,
|
|
442
|
+
`,Jl=Co.video`
|
|
440
443
|
width: 100%;
|
|
441
444
|
height: 100%;
|
|
442
445
|
min-height: 200px;
|
|
443
446
|
border-radius: ${e=>e.appearance.theme.borderRadius}px;
|
|
444
|
-
`,
|
|
447
|
+
`,Ql=Co.iframe`
|
|
445
448
|
width: 100%;
|
|
446
449
|
height: 100%;
|
|
447
450
|
min-height: 200px;
|
|
448
451
|
border-radius: ${e=>e.appearance.theme.borderRadius}px;
|
|
449
|
-
`;function
|
|
452
|
+
`;function vt({appearance:e,videoUri:t}){let o=ql(),[i,r]=Kl(!1);if(t.includes("youtube")){let n=t.split("v=")[1],s=n.indexOf("&");return s!==-1&&(n=n.substring(0,s)),Gt.createElement(Ql,{width:"100%",height:"100%",src:`https://www.youtube.com/embed/${n}`,frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0,appearance:e})}return Gt.createElement(Yl,{appearance:e},!i&&Gt.createElement(Xl,{onClick:()=>{r(!0),o.current.play()},appearance:e},Gt.createElement(xo,null)),Gt.createElement(Jl,{appearance:e,controls:i,ref:o,play:i,src:t}))}var Rl=So.div`
|
|
450
453
|
${e=>k(e)} {
|
|
451
454
|
display: flex;
|
|
452
455
|
flex-direction: column;
|
|
453
456
|
justify-content: center;
|
|
454
457
|
}
|
|
455
|
-
`,
|
|
458
|
+
`,ea=So.img`
|
|
456
459
|
${e=>k(e)} {
|
|
457
460
|
width: 100%;
|
|
458
461
|
height: auto;
|
|
459
462
|
max-height: 250px;
|
|
460
463
|
margin-bottom: 24px;
|
|
461
464
|
}
|
|
462
|
-
`,
|
|
465
|
+
`,ta=So.div`
|
|
463
466
|
${e=>k(e)} {
|
|
464
467
|
margin-bottom: 24px;
|
|
465
468
|
}
|
|
466
|
-
`,
|
|
469
|
+
`,oa=So.div`
|
|
467
470
|
${e=>k(e)} {
|
|
468
471
|
width: 100%;
|
|
469
472
|
height: auto;
|
|
470
473
|
max-height: 250px;
|
|
471
474
|
margin-bottom: 24px;
|
|
472
475
|
}
|
|
473
|
-
`;function
|
|
474
|
-
${e=>
|
|
475
|
-
`,
|
|
476
|
+
`;function qr({stepData:e,appearance:t,setCanContinue:o}){return Zl(()=>{o(!0)},[]),Et.createElement(Rl,{className:l("callToActionContainer",t)},Et.createElement(ta,{className:l("callToActionTextContainer",t)},Et.createElement(be,{appearance:t,title:e.title,subtitle:e.subtitle})),e.imageUri&&Et.createElement(ea,{className:l("callToActionImage",t),src:e.imageUri}),!e.imageUri&&e.videoUri&&Et.createElement(oa,{appearance:t,className:l("callToActionVideo",t)},Et.createElement(vt,{appearance:t,videoUri:e.videoUri})))}import qe,{useEffect as jo,useState as Go}from"react";import qt from"react";import Vt from"react";import{motion as ra}from"framer-motion";var Kr=({color:e,percentage:t,size:o})=>{let i=o*.5-2,r=2*Math.PI*i,n=(1-t)*r,s={duration:.3,delay:0,ease:"easeIn"},p={hidden:{strokeDashoffset:r,transition:s},show:{strokeDashoffset:n,transition:s}};return Vt.createElement(ra.circle,{r:i,cx:o*.5,cy:o*.5,fill:"transparent",stroke:n!==r?e:"",strokeWidth:"3px",strokeDasharray:r,strokeDashoffset:t?n:0,variants:p,transition:s,initial:"hidden",animate:"show"})},ia=({fillColor:e,size:t,percentage:o,children:i,bgColor:r="#D9D9D9",className:n,style:s})=>Vt.createElement("svg",{style:s,className:n,width:t,height:t,overflow:"visible"},Vt.createElement("g",{transform:`rotate(-90 ${`${t*.5} ${t*.5}`})`},Vt.createElement(Kr,{color:r,size:t}),Vt.createElement(Kr,{color:e,percentage:o,size:t})),i),At=ia;var It={theme:{colorPrimary:"#000000",colorText:"#000000",colorBackground:"#ffffff",colorBackgroundSecondary:"#d2d2d2",colorTextOnPrimaryBackground:"#ffffff",colorTextSecondary:"#505050",colorTextDisabled:"#999999",colorBorder:"#E5E5E5",colorTextError:"#c00000",borderRadius:20}};import na from"styled-components";var sa=({color:e="#FFFFFF"})=>qt.createElement("svg",{width:10,height:8,viewBox:"0 0 10 8",fill:"none",xmlns:"http://www.w3.org/2000/svg"},qt.createElement("path",{d:"M1 4.34815L3.4618 7L3.4459 6.98287L9 1",stroke:e,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})),la={width:"22px",height:"22px",borderRadius:"8px",display:"flex",justifyContent:"center",alignItems:"center"},aa={width:"22px",height:"22px",borderRadius:"40px",display:"flex",justifyContent:"center",alignItems:"center"},pa={border:"1px solid #000000",color:"#FFFFFF"},da={border:"1px solid #E6E6E6"},ca={color:"#FFFFFF"},ma={border:"3px solid #D9D9D9"},ua=e=>e==="square"?la:aa,fa=(e,t)=>e==="square"?t?pa:da:t?ca:ma,ga=na.div`
|
|
477
|
+
${e=>dt(e)}
|
|
478
|
+
`,ut=({value:e,type:t="square",primaryColor:o="#000000",progress:i,appearance:r=It,style:n,className:s})=>{let p=ua(t),d=fa(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?qt.createElement(At,{fillColor:o,percentage:i,size:22}):qt.createElement(ga,{styleOverrides:p,style:n,role:"checkbox",className:ye(l("checkIconContainer",r),l(e?"checkIconContainerChecked":"checkIconContainerUnchecked",r),e?"checkIconContainerChecked":"checkIconContainerUnchecked",s)},e&&qt.createElement(sa,{color:"#FFFFFF"}))};import ot from"styled-components";var Yr=ot.div`
|
|
476
479
|
width: auto;
|
|
477
480
|
display: flex;
|
|
478
481
|
flex-direction: column;
|
|
479
482
|
justify-content: center;
|
|
480
483
|
align-items: center;
|
|
481
484
|
padding: 4px;
|
|
482
|
-
`,
|
|
485
|
+
`,Xr=ot.div`
|
|
483
486
|
width: 100%;
|
|
484
487
|
text-align: left;
|
|
485
|
-
`,
|
|
488
|
+
`,Jr=ot.h1`
|
|
486
489
|
font-style: normal;
|
|
487
490
|
font-weight: 700;
|
|
488
491
|
font-size: 32px;
|
|
489
492
|
line-height: 38px;
|
|
490
493
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
491
|
-
`,
|
|
494
|
+
`,Qr=ot.h1`
|
|
492
495
|
font-style: normal;
|
|
493
496
|
font-weight: 400;
|
|
494
497
|
font-size: 16px;
|
|
@@ -496,7 +499,7 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
496
499
|
margin-top: 16px;
|
|
497
500
|
margin-bottom: 16px;
|
|
498
501
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextSecondary}};
|
|
499
|
-
`,
|
|
502
|
+
`,Zr=ot.div`
|
|
500
503
|
padding-top: 12px;
|
|
501
504
|
padding-bottom: 12px;
|
|
502
505
|
flex-direction: row;
|
|
@@ -507,17 +510,17 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
507
510
|
cursor: pointer;
|
|
508
511
|
border-bottom: ${e=>e.hideBottomBorder?"none":"1px solid #D8D8D8"};
|
|
509
512
|
width: 100%;
|
|
510
|
-
`,
|
|
513
|
+
`,Rr=ot.div`
|
|
511
514
|
padding-top: 10px;
|
|
512
515
|
padding-bottom: 10px;
|
|
513
516
|
flex-direction: row;
|
|
514
517
|
display: flex;
|
|
515
518
|
justify-content: flex-start;
|
|
516
|
-
`,
|
|
519
|
+
`,ei=ot.img`
|
|
517
520
|
width: 42px;
|
|
518
521
|
height: 42px;
|
|
519
522
|
margin-right: 12px;
|
|
520
|
-
`,
|
|
523
|
+
`,ti=ot.p`
|
|
521
524
|
font-style: normal;
|
|
522
525
|
font-weight: 500;
|
|
523
526
|
font-size: 17px;
|
|
@@ -525,8 +528,8 @@ import ut,{createContext as ka,useEffect as Yo,useState as Be}from"react";import
|
|
|
525
528
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
526
529
|
display: flex;
|
|
527
530
|
align-self: center;
|
|
528
|
-
`;var
|
|
529
|
-
${i=>i.inlineStyles.map(([r,n])=>`.${
|
|
531
|
+
`;var oi=({stepData:e,setCanContinue:t,onSaveData:o,appearance:i})=>{let r=e.props,[n,s]=Go([]),[p,d]=Go(!1),[a,f]=Go(e.id);return jo(()=>{n.length==0&&!p&&(d(!0),o({choice:[]}))},[p]),jo(()=>{a!==e.id&&(f(e.id),s([]))},[e]),jo(()=>{o({choice:n}),n.length>=r.minChoices?t(!0):t(!1)},[n]),qe.createElement(Yr,{className:l("selectListContainer",i)},qe.createElement(Xr,null,qe.createElement(Jr,{className:l("selectListTitle",i)},e.title),qe.createElement(Qr,{appearance:i,className:l("selectListSubtitle",i)},e.subtitle)),r.options.map((c,u)=>{let w=n.includes(c.id);return qe.createElement(Zr,{key:`select-item-${u}`,onClick:()=>{if(n.includes(c.id)){s(n.filter(T=>T!==c.id));return}n.length<r.maxChoices?s([...n,c.id]):n.length==1&&r.maxChoices==1&&s([c.id])},hideBottomBorder:u===r.options.length-1,className:l("selectListSelectItem",i)},qe.createElement(Rr,{className:l("selectListItemImage",i)},c.imageUri&&qe.createElement(ei,{src:c.imageUri,alt:`select-icon-${u}`}),qe.createElement(ti,{appearance:i,className:l("selectListSelectItemText",i)},c.title)),qe.createElement(ut,{appearance:i,value:w,primaryColor:i.theme.colorPrimary}))}))};import we,{useEffect as Vo,useState as Kt}from"react";import{AnimatePresence as ha,motion as xa}from"framer-motion";var Ca=({children:e,id:t,shouldWrap:o=!1})=>we.createElement(we.Fragment,null,o?we.createElement(ha,{initial:!1},we.createElement(xa.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),yo=({appearance:e,steps:t,selectedStep:o,customStepTypes:i,customVariables:r,onButtonClick:n,onStepCompletion:s,flowId:p,type:d,hideOnFlowCompletion:a,onComplete:f,setVisible:c,setShowModal:u,onDismiss:w,showPagination:T=!1,customFormElements:S,allowBackNavigation:h,validationHandler:E})=>{var Ce;let A={...{linkCollection:Vr,multiInput:Or,callToAction:qr,selectList:oi},...i},{primaryCTAClickSideEffects:F,secondaryCTAClickSideEffects:x}=ne(),[m,C]=Kt(!1),[P,$]=Kt({}),[U,M]=Kt(!1),[I,j]=Kt(!1),[B,D]=Kt(null),re=t[o]??null,{markStepCompleted:R,markStepStarted:_,isLoading:he,updateCustomVariables:Fe,markFlowCompleted:W}=J();Vo(()=>{Fe(r)},[r,he]),Vo(()=>{window&&h&&!I&&(window.location.hash=t[o].id,j(!0))},[h,I,j]),Vo(()=>{var V;if(window&&((V=window==null?void 0:window.location)!=null&&V.hash)&&window.location.hash.replace("#","")!==t[o].id){let de=window.location.hash.replace("#",""),oe=t.findIndex(K=>K.id===de);oe!==-1&&_(p,t[oe].id)}},[(Ce=window==null?void 0:window.location)==null?void 0:Ce.hash,_,o,t]);function se(){return{data:P[t[o].id]??{},stepId:t[o].id,customVariables:r}}function G(V,de,oe){let K=o+1<t.length?t[o+1]:null;n&&n(V,o,de,K),s&&s(V,oe,K,P,se())}function L(V,de){$(oe=>{let K={};return K[V.id]=de,{...oe,...K}})}function te(V){return V.selectedStep.imageUri?we.createElement(zr,{image:V.selectedStep.imageUri,appearance:e,className:l("formContainerSidebarImage",e)}):null}let xe=we.createElement(jr,{step:t[o],canContinue:m&&!U,formType:d,selectedStep:o,appearance:e,onPrimaryClick:async()=>{if(M(!0),E){let de=E(t[o],o,t[o+1],P,se());if(de){D(de),M(!1);return}else D(null)}let V={...se()};await R(p,t[o].id,V),o+1<t.length&&await _(p,t[o+1].id),G(t[o],"primary",o),o+1>=t.length&&(f&&f(),w&&w(),a&&(c&&c(!1),u(!1)),await W(p)),F(t[o]),M(!1),window&&h&&o+1<t.length&&(window.location.hash=t[o+1].id)},onSecondaryClick:()=>{G(t[o],"secondary",o),x(t[o])},onBack:async()=>{o-1>=0&&(M(!0),await _(p,t[o-1].id),M(!1))},steps:t,allowBackNavigation:h,errorMessage:B});return we.createElement(we.Fragment,null,we.createElement(Ur,{className:l("formContainer",e)},we.createElement(_r,null,we.createElement(Ca,{id:o,shouldWrap:d==="large-modal"},we.createElement(Wr,{key:re.id,type:d,className:l("formContent",e)},t.map(V=>{let de=A[V.type];return re.id!==V.id?null:we.createElement(de,{key:V.id,stepData:V,canContinue:m,setCanContinue:C,onSaveData:oe=>{L(V,oe)},appearance:e,customFormElements:S})}),T&&we.createElement(Gr,{className:l("formPagination",e),appearance:e,stepCount:t.length,currentStep:o}),xe))),d=="large-modal"&&we.createElement(te,{selectedStep:t[o]})))};import Yt from"react";import{createGlobalStyle as Sa}from"styled-components";function ie({appearance:e}){if(!e||!e.styleOverrides)return Yt.createElement(Yt.Fragment,null);let t=Object.entries(e.styleOverrides).filter(([i,r])=>typeof r=="object");if(t.length===0)return Yt.createElement(Yt.Fragment,null);let o=Sa`
|
|
532
|
+
${i=>i.inlineStyles.map(([r,n])=>`.${Ht}${r}.${Ht}${r} { ${Object.entries(n).map(([s,p])=>`${Oo(s)}: ${p};`).join(" ")} }`).join(" ")}`;return Yt.createElement(o,{inlineStyles:t})}var ri=({flowId:e,customStepTypes:t={},type:o="inline",visible:i,setVisible:r,customVariables:n,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:h,showPagination:E=!1,allowBackNavigation:y=!1,validationHandler:A})=>{let{getFlow:F,getFlowSteps:x,isLoading:m,targetingLogicShouldHideFlow:C,getFlowStatus:P,getCurrentStepIndex:$,markFlowCompleted:U,markFlowNotStarted:M}=J(),I=$(e),{mergeAppearanceWithDefault:j}=Q(),[B,D]=ba(!1),{setOpenFlowState:re,getOpenFlowState:R}=ve();d=j(d);let[_,he]=i!==void 0&&r!==void 0?[i,r]:[R(e,!0),G=>re(e,G)];if(ya(()=>{!B&&!m&&(D(!0),P(e)===X&&S&&M(e),D(!0))},[B,D,m]),m)return null;let Fe=F(e);if(!Fe||C(Fe))return null;let W=x(e);if(!W||i!==void 0&&i===!1||P(e)===X&&a)return null;let se=()=>{he(!1),h&&h(),w===!0&&U(e)};if(T=="center"&&o==="modal"||o==="large-modal"){let G={padding:"24px"};return o==="large-modal"?(G.width="85%",G.height="90%",G.maxHeight="800px",G.minHeight="500px",G.padding="0"):G.width="400px",Ue.createElement(Ze,{appearance:d,onClose:se,visible:_,style:G,dismissible:u},Ue.createElement(ie,{appearance:d}),Ue.createElement(yo,{appearance:d,steps:W,selectedStep:I,customStepTypes:t,customVariables:n,onButtonClick:c,onStepCompletion:f,flowId:e,type:o,hideOnFlowCompletion:a,onComplete:p,setVisible:r,setShowModal:he,onDismiss:h,showPagination:E,customFormElements:s,allowBackNavigation:y,validationHandler:A}))}return o==="modal"&&T!=="center"?Ue.createElement(xr,{appearance:d,onClose:se,visible:_},Ue.createElement(ie,{appearance:d}),Ue.createElement(yo,{appearance:d,steps:W,selectedStep:I,customStepTypes:t,customVariables:n,onButtonClick:c,onStepCompletion:f,flowId:e,type:o,hideOnFlowCompletion:a,onComplete:p,setVisible:r,setShowModal:he,onDismiss:h,showPagination:E,customFormElements:s,allowBackNavigation:y,validationHandler:A})):Ue.createElement(Ue.Fragment,null,Ue.createElement(ie,{appearance:d}),Ue.createElement(yo,{appearance:d,steps:W,selectedStep:I,customStepTypes:t,customVariables:n,onButtonClick:c,onStepCompletion:f,flowId:e,type:o,hideOnFlowCompletion:a,onComplete:p,setVisible:r,setShowModal:he,onDismiss:h,showPagination:E,customFormElements:s,allowBackNavigation:y,validationHandler:A}))},ii=ri;import{useCallback as ni,useContext as wa,useEffect as Ta}from"react";function qo(){let{organizationId:e,userId:t,setOrganizationId:o}=wa(q),{mutateUserFlowState:i}=Be(),{config:r}=$e(),n=wt(),{verifySDKInitiated:s}=Tt();Ta(()=>{if(t&&e){if(t.startsWith(Ft))return;let a=`frigade-user-group-registered-${t}-${e}`;localStorage.getItem(a)||(n(`${ke}userGroups`,{...r,method:"POST",body:JSON.stringify({foreignUserId:t,foreignUserGroupId:e})}),localStorage.setItem(a,"true"))}},[t,e]);let p=ni(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 n(`${ke}userGroups`,{...r,method:"POST",body:JSON.stringify(f)}),i()},[e,t,r,i]),d=ni(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 n(`${ke}userGroups`,{...r,method:"POST",body:JSON.stringify(u)}),i()},[e,t,r,i]);return{organizationId:e,setOrganizationId:o,addPropertiesToOrganization:p,trackEventForOrganization:d}}var si="xFrigade_guestUserId",li="xFrigade_userId",ai=({})=>{let{setFlowResponses:e}=zt(),{userFlowStatesData:t,isLoadingUserFlowStateData:o,mutateUserFlowState:i}=Be(),{userId:r,setUserId:n}=Lo(),[s,p]=Ko(null),{getFlowStatus:d}=J(),{flows:a,userProperties:f,setIsNewGuestUser:c,flowResponses:u}=Fa(q),[w,T]=Ko([]),[S,h]=Ko([]),{organizationId:E}=qo();bo(()=>{if(!o&&t)for(let x=0;x<t.length;x++){let m=t[x],C=a.find(P=>P.slug===(m==null?void 0:m.flowId));if(C&&m&&m.shouldTrigger===!0&&C.type=="FORM"&&C.triggerType==="AUTOMATIC"&&!S.includes(C.slug)){setTimeout(()=>{y(m.flowId)},500);break}}},[o,t]),bo(()=>{u.length>0&&i()},[u]);function y(x){let m=a.find(C=>C.slug===x);m&&m.triggerType==="AUTOMATIC"&&!S.includes(m.slug)&&(h([...S,m.slug]),T([m]))}function A(){if(!r){let x=localStorage.getItem(li);if(x){n(x);return}let m=localStorage.getItem(si);if(m){n(m);return}c(!0);let C=Ft+ka();try{localStorage.setItem(si,C)}catch(P){console.log("Failed to save guest user id locally: Local storage unavailable",P)}n(P=>P||C)}}bo(()=>{try{if(a){let x=[];a.forEach(m=>{if(m.data){let C=m.data.match(/"imageUri":"(.*?)"/g);C&&C.forEach(P=>{let $=P.replace('"imageUri":"',"").replace('"',"");if(x.includes($))return;let U=new Image;U.src=$,x.push($)})}})}}catch{}},[a]),bo(()=>{if(r!==s&&e([]),p(r),r&&!r.startsWith(Ft))try{localStorage.setItem(li,r)}catch(x){console.log("Failed to save user id locally: Local storage available",x)}r===null&&setTimeout(()=>{r===null&&A()},50)},[r,a,f]);function F(){return ft.createElement(ft.Fragment,null,w.map(x=>d(x.slug)!==Le?null:ft.createElement("span",{key:x.slug},ft.createElement(ii,{flowId:x.slug,type:"modal",modalPosition:"center",endFlowOnDismiss:!0}))))}return ft.createElement(ft.Fragment,null,ft.createElement(F,null))};import{ErrorBoundary as Ea}from"react-error-boundary";var q=Pa({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:It,shouldGracefullyDegrade:!1,setShouldGracefullyDegrade:()=>{}}),Aa=({publicApiKey:e,userId:t,organizationId:o,config:i,children:r})=>{var re,R;let[n,s]=Ne(t||null),[p,d]=Ne(o||null),[a,f]=Ne([]),[c,u]=Ne([]),[w,T]=Ne([]),[S,h]=Ne({}),[E,y]=Ne({}),[A,F]=Ne([]),[x,m]=Ne({}),[C,P]=Ne(!1),[$,U]=Ne(!1),[M,I]=Ne(!D(e)),j=(_,he)=>{if(he==="_blank"){window.open(_,"_blank");return}setTimeout(()=>{window.location.href=_},50)},B={theme:{...It.theme,...((re=i==null?void 0:i.defaultAppearance)==null?void 0:re.theme)??{}},styleOverrides:{...It.styleOverrides,...((R=i==null?void 0:i.defaultAppearance)==null?void 0:R.styleOverrides)??{}}};function D(_){return!!(_&&_.length>10&&_.substring(0,10)==="api_public")}return Yo(()=>{t&&s(t)},[t]),Yo(()=>{o&&d(o)},[o]),Yo(()=>{if(D(e))I(!1);else{console.error("Frigade SDK failed to initialize. API key provided is either missing or valid."),I(!0);return}},[e,I]),M?gt.createElement(q.Provider,{value:{publicApiKey:e,userId:n,setUserId:s,setFlows:f,flows:a,failedFlowResponses:c,setFailedFlowResponses:u,flowResponses:w,setFlowResponses:T,userProperties:S,setUserProperties:h,openFlowStates:E,setOpenFlowStates:y,completedFlowsToKeepOpenDuringSession:A,setCompletedFlowsToKeepOpenDuringSession:F,customVariables:x,setCustomVariables:m,isNewGuestUser:C,setIsNewGuestUser:P,hasActiveFullPageFlow:$,setHasActiveFullPageFlow:U,organizationId:p,setOrganizationId:d,navigate:i&&i.navigate?i.navigate:j,defaultAppearance:B,shouldGracefullyDegrade:M,setShouldGracefullyDegrade:I}},r):gt.createElement(Ea,{fallback:gt.createElement(gt.Fragment,null,r)},gt.createElement(q.Provider,{value:{publicApiKey:e,userId:n,setUserId:s,setFlows:f,flows:a,failedFlowResponses:c,setFailedFlowResponses:u,flowResponses:w,setFlowResponses:T,userProperties:S,setUserProperties:h,openFlowStates:E,setOpenFlowStates:y,completedFlowsToKeepOpenDuringSession:A,setCompletedFlowsToKeepOpenDuringSession:F,customVariables:x,setCustomVariables:m,isNewGuestUser:C,setIsNewGuestUser:P,hasActiveFullPageFlow:$,setHasActiveFullPageFlow:U,organizationId:p,setOrganizationId:d,navigate:i&&i.navigate?i.navigate:j,defaultAppearance:B,shouldGracefullyDegrade:M,setShouldGracefullyDegrade:I}},gt.createElement(va,{theme:B.theme},r,gt.createElement(ai,null))))};import Pp from"react";import pe,{useEffect as _n,useState as Wn}from"react";import De,{useState as Qa}from"react";import Ct from"styled-components";import Fo from"react";import ht from"react";import di from"styled-components";var pi=di.span`
|
|
530
533
|
font-weight: 400;
|
|
531
534
|
font-size: 15px;
|
|
532
535
|
line-height: 20px;
|
|
@@ -535,7 +538,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
535
538
|
vertical-align: middle;
|
|
536
539
|
margin-left: 12px;
|
|
537
540
|
padding-right: 12px;
|
|
538
|
-
`,Ia=
|
|
541
|
+
`,Ia=di.div`
|
|
539
542
|
flex-direction: row;
|
|
540
543
|
justify-content: space-between;
|
|
541
544
|
display: flex;
|
|
@@ -543,24 +546,24 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
543
546
|
padding-bottom: 20px;
|
|
544
547
|
border-top: 1px solid ${e=>e.theme.colorBorder};
|
|
545
548
|
width: 100%;
|
|
546
|
-
`,wo=({label:e,value:t,labelStyle:o={},labelPosition:i="right",style:r,primaryColor:n="#000000",checkBoxType:s="square",appearance:p})=>
|
|
549
|
+
`,wo=({label:e,value:t,labelStyle:o={},labelPosition:i="right",style:r,primaryColor:n="#000000",checkBoxType:s="square",appearance:p})=>ht.createElement(ht.Fragment,null,ht.createElement(Ia,{className:l("checklistStepsContainer",p),appearance:p,style:{...r}},i==="left"&&e&&ht.createElement(pi,{className:l("checklistStepLabel",p),style:o},e),ht.createElement(ut,{appearance:p,value:t,type:s,primaryColor:n}),i==="right"&&e&&ht.createElement(pi,{className:l("checklistStepLabel",p),style:o},e)),ht.createElement(ie,{appearance:p}));import{motion as Ba}from"framer-motion";import Xt from"styled-components";var ci=Xt.div`
|
|
547
550
|
font-weight: 700;
|
|
548
551
|
font-size: 18px;
|
|
549
552
|
line-height: 22px;
|
|
550
|
-
`,
|
|
553
|
+
`,mi=Xt.p`
|
|
551
554
|
font-weight: 700;
|
|
552
555
|
font-size: 18px;
|
|
553
556
|
line-height: 22px;
|
|
554
557
|
margin: 20px 0px 0px 0px;
|
|
555
558
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
556
|
-
`,
|
|
559
|
+
`,ui=Xt.p`
|
|
557
560
|
font-weight: 400;
|
|
558
561
|
font-size: 15px;
|
|
559
562
|
line-height: 28px;
|
|
560
563
|
max-width: 540px;
|
|
561
564
|
margin: 8px 0px 0px 0px;
|
|
562
565
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextSecondary}};
|
|
563
|
-
`,To=
|
|
566
|
+
`,To=Xt.div`
|
|
564
567
|
width: 4px;
|
|
565
568
|
position: absolute;
|
|
566
569
|
left: 0;
|
|
@@ -568,35 +571,35 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
568
571
|
height: 80%;
|
|
569
572
|
border-top-right-radius: 8px;
|
|
570
573
|
border-bottom-right-radius: 8px;
|
|
571
|
-
`,
|
|
574
|
+
`,fi=Xt.div`
|
|
572
575
|
flex-direction: row;
|
|
573
576
|
justify-content: flex-start;
|
|
574
|
-
`;var
|
|
577
|
+
`;var gi=({data:e,index:t,isSelected:o,primaryColor:i,style:r,onClick:n,appearance:s})=>{var p,d;return Fo.createElement("div",{style:{position:"relative",paddingLeft:"20px"},onClick:()=>{n()}},o&&Fo.createElement(To,{className:l("checklistStepItemSelectedIndicator",s),as:Ba.div,layoutId:"checklis-step-selected",style:{backgroundColor:((p=s==null?void 0:s.theme)==null?void 0:p.colorPrimary)??i}}),Fo.createElement(fi,{className:l("checklistStepItem",s),key:`hero-checklist-step-${t}`,role:"listitem"},Fo.createElement(wo,{value:e.complete,labelPosition:"left",label:e.stepName,style:r,primaryColor:((d=s==null?void 0:s.theme)==null?void 0:d.colorPrimary)??i,appearance:s})))};import xt from"react";import{motion as Na}from"framer-motion";import Xo from"styled-components";var La={backgroundColor:"#E6E6E6"},Oa=Xo.div`
|
|
575
578
|
display: flex;
|
|
576
579
|
flex-direction: ${e=>e.textLocation=="top"?"column":"row"};
|
|
577
580
|
justify-content: flex-start;
|
|
578
581
|
align-items: ${e=>e.textLocation=="top"?"flex-end":"center"};
|
|
579
582
|
|
|
580
|
-
${e=>
|
|
581
|
-
`,
|
|
583
|
+
${e=>dt(e)}
|
|
584
|
+
`,Da=Xo.div`
|
|
582
585
|
flex-grow: 1;
|
|
583
586
|
position: relative;
|
|
584
587
|
${e=>e.textLocation=="top"?"width: 100%;":""}
|
|
585
|
-
|
|
588
|
+
`,$a=Xo.span`
|
|
586
589
|
font-weight: 500;
|
|
587
590
|
font-size: 15px;
|
|
588
591
|
line-height: 18px;
|
|
589
592
|
padding-right: ${e=>e.padding};
|
|
590
593
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextSecondary}};
|
|
591
594
|
margin-bottom: ${e=>e.textLocation=="top"?"8px":"0px"};
|
|
592
|
-
${e=>
|
|
593
|
-
|
|
595
|
+
${e=>dt(e)}
|
|
596
|
+
`,Ma={position:"relative",left:0,top:0,width:"100%",minWidth:"40px",height:"10px",borderRadius:"20px"},Ua={position:"absolute",left:0,top:0,height:"10px",borderRadius:"20px"},_e=({count:e,total:t,fillColor:o,bgColor:i=La.backgroundColor,display:r="count",textLocation:n="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=r==="compact"?"5px":"10px",c=Math.round(e/t*100),u=r==="compact"?"5px":"20px",w;return r==="count"?w=`${e} of ${t}`:r==="compact"?w=`${c}%`:r==="percent"&&(w=`${c}% complete`),n==="top"&&(u="0px"),xt.createElement(Oa,{className:l("progressBarContainer",d),textLocation:n,styleOverrides:s},xt.createElement($a,{className:l("progressBarStepText",d),style:{...p,fontSize:r==="compact"?12:15,fontWeight:r==="compact"?400:500},appearance:d,padding:u,textLocation:n},w),xt.createElement(Da,{textLocation:n,className:l("progressBar",d)},xt.createElement(Na.div,{style:{...Ua,width:a,height:f,backgroundColor:((T=d==null?void 0:d.theme)==null?void 0:T.colorPrimary)??o,zIndex:r=="compact"?1:5},className:l("progressBarFill",d)}),xt.createElement("div",{className:l("progressBarBackground",d),style:{...Ma,height:f,backgroundColor:((S=d==null?void 0:d.theme)==null?void 0:S.colorSecondary)??i}})))};import Qt from"react";import _a from"styled-components";import Po from"react";import ko from"react";var Bt=({stepData:e,appearance:t})=>ko.createElement(ko.Fragment,null,ko.createElement(mi,{appearance:t,className:l("checklistStepTitle",t),dangerouslySetInnerHTML:me(e.title)}),ko.createElement(ui,{appearance:t,className:l("checklistStepSubtitle",t),dangerouslySetInnerHTML:me(e.subtitle)}));import Jt from"react";var Nt=({stepData:e,appearance:t})=>{let o=()=>{e.handlePrimaryButtonClick&&e.handlePrimaryButtonClick()},i=()=>{e.handleSecondaryButtonClick&&e.handleSecondaryButtonClick()};return Jt.createElement(Jt.Fragment,null,Jt.createElement(ho,null,e.secondaryButtonTitle&&Jt.createElement(ee,{appearance:t,secondary:!0,title:e.secondaryButtonTitle,onClick:i,style:{width:"auto",marginRight:"12px"}}),Jt.createElement(ee,{appearance:t,title:e.primaryButtonTitle,onClick:o})))};var Lt=({stepData:e,appearance:t})=>Po.createElement(Po.Fragment,null,Po.createElement(Bt,{stepData:e,appearance:t}),Po.createElement(Nt,{stepData:e,appearance:t}));import hi from"react";function xi(e){if(e.videoUri.includes("youtube")){let t=e.videoUri.split("v=")[1],o=t.indexOf("&");return o!==-1&&(t=t.substring(0,o)),hi.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 hi.createElement("video",{width:"480",height:"260",controls:!0,src:e.videoUri})}var Jo="default",Wa=_a.img`
|
|
594
597
|
border-radius: 4px;
|
|
595
598
|
max-height: 260px;
|
|
596
599
|
min-height: 200px;
|
|
597
|
-
`,
|
|
600
|
+
`,Ci=({stepData:e,appearance:t})=>{if(e!=null&&e.StepContent){let o=e.StepContent;return Qt.createElement("div",null,o)}return Qt.createElement(ci,{className:l("checklistStepContent",t)},e.imageUri?Qt.createElement(Wa,{className:l("checklistStepImage",t),src:e.imageUri,style:e.imageStyle}):null,e.videoUri?Qt.createElement(xi,{videoUri:e.videoUri,appearance:t}):null,Qt.createElement(Lt,{stepData:e,appearance:t}))};import Ae,{useRef as za,useState as Ha}from"react";import Ot from"styled-components";var Si=Ot.div`
|
|
598
601
|
display: block;
|
|
599
|
-
`,
|
|
602
|
+
`,ja=Ot.div`
|
|
600
603
|
display: flex;
|
|
601
604
|
flex-direction: row;
|
|
602
605
|
flex-wrap: wrap;
|
|
@@ -606,20 +609,20 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
606
609
|
align-content: center;
|
|
607
610
|
margin-top: 24px;
|
|
608
611
|
margin-bottom: 24px;
|
|
609
|
-
`,Ga=
|
|
612
|
+
`,Ga=Ot.div`
|
|
610
613
|
display: flex;
|
|
611
614
|
align-items: center;
|
|
612
615
|
justify-content: flex-start;
|
|
613
616
|
flex-direction: column;
|
|
614
617
|
margin-right: 16px;
|
|
615
|
-
`,
|
|
618
|
+
`,Va=Ot.video`
|
|
616
619
|
width: 200px;
|
|
617
620
|
height: 120px;
|
|
618
|
-
`,
|
|
621
|
+
`,qa=Ot.div`
|
|
619
622
|
font-size: 14px;
|
|
620
623
|
line-height: 20px;
|
|
621
624
|
text-align: center;
|
|
622
|
-
`,
|
|
625
|
+
`,Ka=Ot.div`
|
|
623
626
|
position: absolute;
|
|
624
627
|
width: 200px;
|
|
625
628
|
height: 120px;
|
|
@@ -639,9 +642,9 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
639
642
|
box-shadow: 0px 6px 25px rgba(0, 0, 0, 0.06);
|
|
640
643
|
border-radius: 50%;
|
|
641
644
|
}
|
|
642
|
-
`,
|
|
645
|
+
`,yi="videoCarousel",bi=({stepData:e,appearance:t})=>{var r;if(!((r=e.props)!=null&&r.videos))return Ae.createElement(Si,null,Ae.createElement(Lt,{stepData:e,appearance:t}));function o({video:n}){let s=za(),[p,d]=Ha(!1);return Ae.createElement(Ga,null,!p&&Ae.createElement(Ka,{onClick:()=>{d(!0),s.current.play()},appearance:t},Ae.createElement(xo,null)),Ae.createElement(Va,{controls:p,ref:s,play:p,src:n.uri}),Ae.createElement(qa,null,n.title))}let i=e.props;return i.videos?Ae.createElement(Si,null,Ae.createElement(Bt,{stepData:e,appearance:t}),Ae.createElement(ja,null,i.videos.map((n,s)=>Ae.createElement("span",{key:`${n.uri}-${s}`},Ae.createElement(o,{video:n})))),Ae.createElement(Nt,{stepData:e,appearance:t})):null};import Ke from"react";import vo from"styled-components";var wi=vo.div`
|
|
643
646
|
display: block;
|
|
644
|
-
`,
|
|
647
|
+
`,Ya=vo.pre`
|
|
645
648
|
display: block;
|
|
646
649
|
background-color: #2a2a2a;
|
|
647
650
|
color: #f8f8f8;
|
|
@@ -657,68 +660,68 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
657
660
|
white-space: -o-pre-wrap; /* Opera 7 */
|
|
658
661
|
word-wrap: break-word; /* Internet Explorer 5.5+ */
|
|
659
662
|
margin-bottom: 24px;
|
|
660
|
-
`,
|
|
663
|
+
`,Xa=vo.div`
|
|
661
664
|
font-size: 15px;
|
|
662
665
|
line-height: 20px;
|
|
663
666
|
margin-bottom: 12px;
|
|
664
667
|
margin-top: 12px;
|
|
665
|
-
`,
|
|
668
|
+
`,Ja=vo.div`
|
|
666
669
|
margin-top: 24px;
|
|
667
|
-
`,
|
|
670
|
+
`,Ti="codeSnippet",Fi=({stepData:e,appearance:t})=>{var i;if(!((i=e.props)!=null&&i.codeSnippets))return Ke.createElement(wi,null,Ke.createElement(Lt,{stepData:e,appearance:t}));let o=e.props;return o.codeSnippets?Ke.createElement(wi,null,Ke.createElement(Bt,{stepData:e,appearance:t}),Ke.createElement(Ja,null,o.codeSnippets.map((r,n)=>Ke.createElement("div",{key:n},r.title?Ke.createElement(Xa,null,r.title):null,r.code?Ke.createElement(Ya,null,r.code):null))),Ke.createElement(Nt,{stepData:e,appearance:t})):null};var Za=Ct.div`
|
|
668
671
|
display: flex;
|
|
669
672
|
flex-direction: row;
|
|
670
673
|
min-width: ${e=>e.type!="modal"?"1000px":"100%"};
|
|
671
674
|
background: ${e=>{var t;return(t=e.appearance)==null?void 0:t.theme.colorBackground}};
|
|
672
675
|
box-shadow: ${e=>e.type!="modal"?"0px 6px 25px rgba(0, 0, 0, 0.06)":"none"};
|
|
673
676
|
border-radius: 8px;
|
|
674
|
-
`,
|
|
677
|
+
`,Ra=Ct.h1`
|
|
675
678
|
font-size: 24px;
|
|
676
679
|
font-weight: 600;
|
|
677
680
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
678
|
-
`,
|
|
681
|
+
`,ep=Ct.h2`
|
|
679
682
|
font-size: 15px;
|
|
680
683
|
line-height: 20px;
|
|
681
684
|
color: ${e=>{var t,o;return((o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextSecondary)??"#4d4d4d"}};
|
|
682
685
|
margin: 10px 0px 0px 0px;
|
|
683
|
-
`,
|
|
686
|
+
`,ki=Ct.div`
|
|
684
687
|
padding-bottom: 16px;
|
|
685
|
-
`,
|
|
688
|
+
`,tp=Ct.div`
|
|
686
689
|
list-style: none;
|
|
687
690
|
padding: 0;
|
|
688
691
|
margin: 0;
|
|
689
692
|
cursor: pointer;
|
|
690
693
|
width: 300px;
|
|
691
|
-
`,
|
|
694
|
+
`,op=Ct.div`
|
|
692
695
|
width: 1px;
|
|
693
696
|
margin: 40px;
|
|
694
697
|
background: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBorder}};
|
|
695
|
-
`,
|
|
698
|
+
`,rp=Ct.div`
|
|
696
699
|
flex: 2;
|
|
697
700
|
padding: 2rem;
|
|
698
|
-
`,
|
|
701
|
+
`,ip=({title:e,subtitle:t,steps:o=[],style:i={},selectedStep:r,setSelectedStep:n,className:s="",customStepTypes:p=new Map,appearance:d,type:a})=>{let{mergeAppearanceWithDefault:f}=Q();d=f(d);let u={...{[Jo]:Ci,[yi]:bi,[Ti]:Fi},...p},[w,T]=Qa(0),S=r??w,h=n??T,E=o.filter(A=>A.complete===!0).length,y=()=>{var A;return!((A=o[S])!=null&&A.type)||!u[o[S].type]?u[Jo]({stepData:o[S],appearance:d}):u[o[S].type]({stepData:o[S],appearance:d})};return De.createElement(Za,{type:a,style:i,className:s,appearance:d},De.createElement(ki,{style:{flex:1}},De.createElement(ki,{style:{padding:"30px 0px 30px 30px",borderBottom:"none"}},De.createElement(Ra,{className:l("checklistTitle",d),appearance:d},e),De.createElement(ep,{className:l("checklistSubtitle",d),appearance:d},t),De.createElement(_e,{total:o.length,count:E,fillColor:d.theme.colorPrimary,style:{marginTop:"24px"},appearance:d})),De.createElement(tp,{className:l("checklistStepsContainer",d)},o.map((A,F)=>De.createElement(gi,{data:A,index:F,key:F,listLength:o.length,isSelected:F===S,primaryColor:d.theme.colorPrimary,style:{justifyContent:"space-between"},onClick:()=>{h(F)}})))),De.createElement(op,{appearance:d,className:l("checklistDivider",d)}),De.createElement(rp,null,De.createElement(y,null)))},Qo=ip;import N,{useState as dp}from"react";import Pi from"react";import np from"styled-components";var sp=np.svg`
|
|
699
702
|
transition: 'transform 0.35s ease-in-out';
|
|
700
|
-
`,
|
|
703
|
+
`,Dt=({color:e="#323232",style:t,className:o})=>Pi.createElement(sp,{width:"7",height:"10",viewBox:"0 0 9 15",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:t,className:o},Pi.createElement("path",{d:"M1 13L7.5 7L0.999999 1",stroke:e,strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"}));import{motion as cp}from"framer-motion";import ue from"styled-components";var Zo={boxShadow:"0px 6px 25px rgba(0, 0, 0, 0.06)",padding:"32px",maxHeight:"700px",msOverflowStyle:"none",scrollbarWidth:"none",paddingBottom:"12px",minHeight:"610px"},vi=ue.div`
|
|
701
704
|
max-height: 350px;
|
|
702
705
|
padding-bottom: 40px;
|
|
703
|
-
`,
|
|
706
|
+
`,Ei=ue.div`
|
|
704
707
|
display: flex;
|
|
705
708
|
flex-direction: column;
|
|
706
709
|
margin-top: 20px;
|
|
707
|
-
`,
|
|
710
|
+
`,Ai=ue.h1`
|
|
708
711
|
font-style: normal;
|
|
709
712
|
font-weight: 600;
|
|
710
713
|
font-size: 30px;
|
|
711
714
|
line-height: 36px;
|
|
712
715
|
margin-bottom: 16px;
|
|
713
716
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
714
|
-
`,Ii=
|
|
717
|
+
`,Ii=ue.h2`
|
|
715
718
|
font-weight: 400;
|
|
716
719
|
font-size: 16px;
|
|
717
720
|
line-height: 20px;
|
|
718
721
|
margin-bottom: 16px;
|
|
719
722
|
padding-left: 1px;
|
|
720
723
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextSecondary}};
|
|
721
|
-
`,
|
|
724
|
+
`,Bi=ue.div`
|
|
722
725
|
${e=>k(e)} {
|
|
723
726
|
border: 1px solid #fafafa;
|
|
724
727
|
}
|
|
@@ -728,11 +731,11 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
728
731
|
flex-direction: column;
|
|
729
732
|
min-height: 240px;
|
|
730
733
|
overflow: hidden;
|
|
731
|
-
`,
|
|
734
|
+
`,Ni=ue.div`
|
|
732
735
|
display: flex;
|
|
733
736
|
flex-direction: row;
|
|
734
737
|
justify-content: space-between;
|
|
735
|
-
`,
|
|
738
|
+
`,Li=ue.p`
|
|
736
739
|
${e=>k(e)} {
|
|
737
740
|
font-weight: 400;
|
|
738
741
|
font-size: 10px;
|
|
@@ -741,12 +744,12 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
741
744
|
color: #8c8c8c;
|
|
742
745
|
margin: 20px;
|
|
743
746
|
}
|
|
744
|
-
`,
|
|
747
|
+
`,Oi=ue.div`
|
|
745
748
|
display: flex;
|
|
746
749
|
flex-direction: row;
|
|
747
|
-
`,
|
|
750
|
+
`,Di=ue.div`
|
|
748
751
|
flex: 1;
|
|
749
|
-
|
|
752
|
+
`,$i=ue.div`
|
|
750
753
|
${e=>k(e)} {
|
|
751
754
|
display: flex;
|
|
752
755
|
justify-content: center;
|
|
@@ -756,7 +759,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
756
759
|
padding-left: 8px;
|
|
757
760
|
padding-right: 8px;
|
|
758
761
|
}
|
|
759
|
-
|
|
762
|
+
`,Mi=ue.p`
|
|
760
763
|
${e=>k(e)} {
|
|
761
764
|
font-style: normal;
|
|
762
765
|
font-weight: 600;
|
|
@@ -768,7 +771,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
768
771
|
margin-top: 20px;
|
|
769
772
|
margin-bottom: 16px;
|
|
770
773
|
}
|
|
771
|
-
`,
|
|
774
|
+
`,Ui=ue.p`
|
|
772
775
|
${e=>k(e)} {
|
|
773
776
|
font-weight: 400;
|
|
774
777
|
font-size: 14px;
|
|
@@ -777,14 +780,14 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
777
780
|
color: ${e=>e.appearance.theme.colorTextSecondary};
|
|
778
781
|
margin-bottom: 8px;
|
|
779
782
|
}
|
|
780
|
-
`,
|
|
783
|
+
`,_i=ue.div`
|
|
781
784
|
${e=>k(e)} {
|
|
782
785
|
display: flex;
|
|
783
786
|
flex-direction: row;
|
|
784
787
|
justify-content: center;
|
|
785
788
|
gap: 8px;
|
|
786
789
|
}
|
|
787
|
-
`,
|
|
790
|
+
`,Wi=ue.div`
|
|
788
791
|
${e=>k(e)} {
|
|
789
792
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
790
793
|
background-color: ${e=>e.selected?"#FAFAFA":"#FFFFFF"};
|
|
@@ -804,7 +807,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
804
807
|
justify-content: space-between;
|
|
805
808
|
position: relative;
|
|
806
809
|
cursor: pointer;
|
|
807
|
-
`,
|
|
810
|
+
`,zi=ue.p`
|
|
808
811
|
${e=>k(e)} {
|
|
809
812
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
810
813
|
color: ${e=>e.selected?"#434343":"#BFBFBF"};
|
|
@@ -813,12 +816,12 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
813
816
|
font-size: 14px;
|
|
814
817
|
line-height: 22px;
|
|
815
818
|
margin: 0;
|
|
816
|
-
`,
|
|
819
|
+
`,Hi=ue.div`
|
|
817
820
|
display: flex;
|
|
818
821
|
flex-direction: row;
|
|
819
822
|
justify-content: flex-end;
|
|
820
823
|
align-content: center;
|
|
821
|
-
`,
|
|
824
|
+
`,ji=ue.div`
|
|
822
825
|
display: flex;
|
|
823
826
|
flex: 1;
|
|
824
827
|
flex-direction: row;
|
|
@@ -826,14 +829,14 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
826
829
|
align-content: center;
|
|
827
830
|
align-items: center;
|
|
828
831
|
margin-right: 20px;
|
|
829
|
-
`,Gi=
|
|
832
|
+
`,Gi=ue.div`
|
|
830
833
|
display: block;
|
|
831
834
|
width: 100%;
|
|
832
|
-
`;import
|
|
835
|
+
`;import lp from"styled-components";var Vi=lp.div`
|
|
833
836
|
flex-direction: column;
|
|
834
837
|
justify-content: center;
|
|
835
838
|
display: flex;
|
|
836
|
-
`;import
|
|
839
|
+
`;import Xe from"react";import{motion as ap}from"framer-motion";import Ye from"styled-components";var qi=Ye.div`
|
|
837
840
|
border: 1px solid #fafafa;
|
|
838
841
|
box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.05);
|
|
839
842
|
border-radius: 14px;
|
|
@@ -841,13 +844,13 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
841
844
|
display: flex;
|
|
842
845
|
flex-direction: column;
|
|
843
846
|
overflow: hidden;
|
|
844
|
-
`,
|
|
847
|
+
`,Ki=Ye.div`
|
|
845
848
|
display: flex;
|
|
846
849
|
flex-wrap: wrap;
|
|
847
850
|
justify-content: space-between;
|
|
848
851
|
overflow: hidden;
|
|
849
852
|
row-gap: 10px;
|
|
850
|
-
`,
|
|
853
|
+
`,Yi=Ye.div`
|
|
851
854
|
${e=>k(e)} {
|
|
852
855
|
color: #595959;
|
|
853
856
|
}
|
|
@@ -857,7 +860,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
857
860
|
line-height: 12px;
|
|
858
861
|
letter-spacing: 0.09em;
|
|
859
862
|
margin-bottom: 12px;
|
|
860
|
-
`,
|
|
863
|
+
`,Xi=Ye.div`
|
|
861
864
|
${e=>k(e)} {
|
|
862
865
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
863
866
|
background: #ffffff;
|
|
@@ -870,7 +873,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
870
873
|
|
|
871
874
|
max-width: 150px;
|
|
872
875
|
min-width: 200px;
|
|
873
|
-
`,
|
|
876
|
+
`,Ji=Ye.div`
|
|
874
877
|
${e=>k(e)} {
|
|
875
878
|
background: radial-gradient(50% 50% at 50% 50%, #ffffff 0%, #f7f7f7 100%);
|
|
876
879
|
}
|
|
@@ -882,13 +885,13 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
882
885
|
justify-content: center;
|
|
883
886
|
align-content: center;
|
|
884
887
|
align-items: center;
|
|
885
|
-
`,
|
|
888
|
+
`,Qi=Ye.div`
|
|
886
889
|
font-weight: 600;
|
|
887
890
|
font-size: 20px;
|
|
888
891
|
line-height: 24px;
|
|
889
892
|
width: 20px;
|
|
890
893
|
height: 20px;
|
|
891
|
-
`,
|
|
894
|
+
`,Zi=Ye.div`
|
|
892
895
|
${e=>k(e)} {
|
|
893
896
|
color: #434343;
|
|
894
897
|
}
|
|
@@ -897,20 +900,20 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
897
900
|
line-height: 17px;
|
|
898
901
|
margin-top: 12px;
|
|
899
902
|
margin-bottom: 8px;
|
|
900
|
-
`,
|
|
903
|
+
`,Ri=Ye.div`
|
|
901
904
|
${e=>k(e)} {
|
|
902
905
|
color: #8c8c8c;
|
|
903
906
|
}
|
|
904
907
|
font-weight: 400;
|
|
905
908
|
font-size: 12px;
|
|
906
909
|
line-height: 14px;
|
|
907
|
-
`,
|
|
910
|
+
`,en=Ye.a`
|
|
908
911
|
color: ${e=>e.color};
|
|
909
912
|
font-size: 12px;
|
|
910
913
|
line-height: 14px;
|
|
911
914
|
font-weight: 400;
|
|
912
915
|
cursor: pointer;
|
|
913
|
-
`;var
|
|
916
|
+
`;var pp=({steps:e,style:t,title:o,primaryColor:i,appearance:r,onButtonClick:n})=>{let{primaryCTAClickSideEffects:s}=ne();return Xe.createElement(qi,{style:t,className:l("guideContainer",r)},Xe.createElement(Yi,{className:l("guideTitle",r)},o),Xe.createElement(Ki,{className:l("guideItemContainer",r)},e.map((p,d)=>Xe.createElement(Xi,{key:`guide-${p.id??d}`,as:ap.div,whileHover:{boxShadow:"0px 2px 8px rgba(0, 0, 0, 0.05)",transition:{duration:.25}},className:l("guideItem",r)},p.icon&&Xe.createElement(Ji,{className:l("guideIcon",r)},Xe.createElement(Qi,null,p.icon)),Xe.createElement(Zi,{className:l("guideItemTitle",r),dangerouslySetInnerHTML:me(p.title)}),Xe.createElement(Ri,{className:l("guideItemSubtitle",r),dangerouslySetInnerHTML:me(p.subtitle)}),Xe.createElement(en,{className:l("guideItemLink",r),color:i,onClick:()=>{p.primaryButtonUri&&s(p),n&&n(p)}},p.primaryButtonTitle)))))},Zt=pp;var mp=({steps:e,title:t,subtitle:o,stepsTitle:i,visible:r,onClose:n,selectedStep:s,setSelectedStep:p,customStepTypes:d,appearance:a,guideData:f,guideTitle:c,onGuideButtonClick:u})=>{let w=({stepData:m,handleSecondaryCTAClick:C,handleCTAClick:P})=>m?N.createElement($i,{className:l("checklistStepContainer",a),"data-testid":"checklistStepContainer"},N.createElement(Mi,{appearance:a,className:l("checklistStepTitle",a),dangerouslySetInnerHTML:me(m.title)}),N.createElement(Ui,{appearance:a,className:l("checklistStepSubtitle",a),dangerouslySetInnerHTML:me(m.subtitle)}),N.createElement(_i,{className:l("checklistCTAContainer",a)},m.secondaryButtonTitle&&N.createElement(ee,{title:m.secondaryButtonTitle,onClick:C,appearance:a,secondary:!0}),N.createElement(ee,{title:m.primaryButtonTitle,onClick:P,appearance:a}))):N.createElement(N.Fragment,null),S={...{default:m=>{var U;if((U=e[y])!=null&&U.StepContent){let M=e[y].StepContent;return N.createElement("div",null,M)}let C=e[y];return N.createElement(w,{stepData:m,handleCTAClick:()=>{C.handlePrimaryButtonClick&&C.handlePrimaryButtonClick()},handleSecondaryCTAClick:()=>{C.handleSecondaryButtonClick&&C.handleSecondaryButtonClick()}})}},...d},[h,E]=dp(0),y=s??h,A=p??E,F=()=>{var m;return e?!((m=e[y])!=null&&m.type)||!S[e[y].type]?S.default(e[y]):S[e[y].type]({stepData:e[y],primaryColor:a.theme.colorPrimary}):N.createElement(N.Fragment,null)},x=e.filter(m=>m.complete).length;return r?(a.theme.modalContainer||(a.theme.borderRadius&&(Zo.borderRadius=a.theme.borderRadius+"px"),a.theme.modalContainer=Zo),N.createElement(Ze,{onClose:n,visible:r,appearance:a},N.createElement(Gi,null,N.createElement(Ei,null,N.createElement(Ai,{appearance:a,className:l("checklistTitle",a)},t),N.createElement(Ii,{appearance:a,className:l("checklistSubtitle",a)},o)),N.createElement(vi,null,e&&e.length>0&&N.createElement(Bi,{className:l("stepsContainer",a)},N.createElement(Ni,null,N.createElement("div",{style:{flex:3}},N.createElement(Li,{className:l("stepsTitle",a)},i)),N.createElement(ji,null,N.createElement(_e,{fillColor:a.theme.colorPrimary,style:{width:"100%"},count:x,total:e.length,appearance:a}))),N.createElement(Oi,null,N.createElement(Di,{className:l("checklistStepListContainer",a),appearance:a},e.map((m,C)=>{let P=y===C;return N.createElement(Wi,{selected:P,className:l(`checklistStepListItem${P?"Selected":""}`,a),key:`checklist-guide-step-${m.id??C}`,disabled:m.blocked,onClick:()=>{m.blocked||A(C)},title:m.blocked?"Finish remaining steps to continue":void 0},P&&N.createElement(To,{className:l("checklistStepItemSelectedIndicator",a),as:cp.div,layoutId:"checklist-step-selected",style:{backgroundColor:a.theme.colorPrimary,borderRadius:0,height:"100%",top:"0%",width:"2px"}}),N.createElement(zi,{selected:P,className:l(`checklistStepListStepName${P?"Selected":""}`,a)},m.stepName),N.createElement(Hi,null,N.createElement(ut,{value:m.complete,type:"round",primaryColor:a.theme.colorPrimary,progress:m.progress,appearance:a}),N.createElement(Vi,null,N.createElement(Dt,{style:{marginLeft:"10px"},color:a.theme.colorBackgroundSecondary}))))})),N.createElement(F,null))),f&&f.length>0&&N.createElement(Zt,{steps:f,title:c,primaryColor:a.theme.colorPrimary,style:{border:"none",boxShadow:"none"},appearance:a,onButtonClick:m=>(u&&u(m),!0)}))))):N.createElement(N.Fragment,null)},Ro=mp;import{useEffect as up,useState as fp}from"react";var tn=()=>{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]=fp(t),r=null,n=()=>{r!==null?clearTimeout(r):s(),r=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",n),[d,f.matches]}));i(p)};return up(()=>{s()},[]),o};import Pe,{useEffect as xn,useState as xp}from"react";import fe from"react";import{AnimatePresence as gp,motion as hp}from"framer-motion";import Je from"styled-components";var on=Je.div`
|
|
914
917
|
background-color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBackground}};
|
|
915
918
|
border: 1px solid;
|
|
916
919
|
border-color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBorder}};
|
|
@@ -922,42 +925,42 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
922
925
|
display: flex;
|
|
923
926
|
flex-direction: column;
|
|
924
927
|
transition: max-height 0.25s;
|
|
925
|
-
`,
|
|
928
|
+
`,rn=Je.div`
|
|
926
929
|
display: flex;
|
|
927
930
|
margin-bottom: 20px;
|
|
928
|
-
`,
|
|
931
|
+
`,nn=Je.img`
|
|
929
932
|
border-radius: 4px;
|
|
930
933
|
max-height: 260px;
|
|
931
934
|
min-height: 200px;
|
|
932
|
-
`,
|
|
935
|
+
`,sn=Je.div`
|
|
933
936
|
display: flex;
|
|
934
937
|
flex-direction: row;
|
|
935
938
|
justify-content: space-between;
|
|
936
939
|
align-items: center;
|
|
937
|
-
`,
|
|
940
|
+
`,ln=Je.p`
|
|
938
941
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
939
942
|
font-style: normal;
|
|
940
943
|
font-weight: 500;
|
|
941
944
|
font-size: 16px;
|
|
942
945
|
line-height: 18px;
|
|
943
946
|
margin-left: 8px;
|
|
944
|
-
`,
|
|
947
|
+
`,an=Je.div`
|
|
945
948
|
padding: 20px;
|
|
946
949
|
cursor: pointer;
|
|
947
950
|
:hover {
|
|
948
951
|
opacity: 0.8;
|
|
949
952
|
}
|
|
950
|
-
`,
|
|
953
|
+
`,Uh=Je.div``,pn=Je.p`
|
|
951
954
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
952
955
|
font-weight: 400;
|
|
953
956
|
font-size: 14px;
|
|
954
957
|
line-height: 22px;
|
|
955
|
-
`,
|
|
958
|
+
`,dn=Je.div`
|
|
956
959
|
display: flex;
|
|
957
960
|
flex-direction: row;
|
|
958
961
|
justify-content: flex-start;
|
|
959
962
|
align-items: center;
|
|
960
|
-
`;var
|
|
963
|
+
`;var cn=({stepData:e,collapsed:t,onClick:o,onPrimaryButtonClick:i,onSecondaryButtonClick:r,appearance:n,customStepTypes:s})=>{var f,c;let p=t?{}:{transform:"rotate(90deg)"};function d(){return fe.createElement(fe.Fragment,null,e.imageUri||e.videoUri?fe.createElement(rn,{className:l("stepMediaContainer",n)},e.imageUri?fe.createElement(nn,{className:l("stepImage",n),src:e.imageUri,style:e.imageStyle}):null,e.videoUri?fe.createElement(vt,{appearance:n,videoUri:e.videoUri}):null):null,fe.createElement(pn,{className:l("stepSubtitle",n),appearance:n,dangerouslySetInnerHTML:me(e.subtitle)}),fe.createElement(ho,{className:l("checklistCTAContainer",n)},e.secondaryButtonTitle?fe.createElement(ee,{secondary:!0,title:e.secondaryButtonTitle,onClick:()=>r(),appearance:n}):null,fe.createElement(ee,{title:e.primaryButtonTitle??"Continue",onClick:()=>i(),appearance:n})))}function a(){if(!s)return null;let u=s[e.type];return u?u(e,n):null}return fe.createElement(on,{onClick:()=>t?o():null,"data-testid":`step-${e.id}`,className:l("checklistStepContainer",n),appearance:n},fe.createElement(sn,{className:l("stepHeader",n)},fe.createElement(dn,null,fe.createElement(wo,{value:e.complete,style:{width:"auto",borderTop:0},primaryColor:(f=n==null?void 0:n.theme)==null?void 0:f.colorPrimary,appearance:n}),fe.createElement(ln,{appearance:n,className:l("stepTitle",n),dangerouslySetInnerHTML:me(e.title)})),fe.createElement(an,{className:l("stepChevronContainer",n),onClick:()=>o()},fe.createElement(Dt,{style:{...p,transition:"transform 0.1s ease-in-out"},color:(c=n==null?void 0:n.theme)==null?void 0:c.colorTextSecondary}))),fe.createElement(gp,null,!t&&fe.createElement(hp.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 Zh=$t.div`
|
|
961
964
|
background: #ffffff;
|
|
962
965
|
box-shadow: 0px 6px 25px rgba(0, 0, 0, 0.06);
|
|
963
966
|
border-radius: 6px;
|
|
@@ -971,49 +974,49 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
971
974
|
|
|
972
975
|
max-width: 800px;
|
|
973
976
|
min-width: 350px;
|
|
974
|
-
`,
|
|
977
|
+
`,mn=$t.div`
|
|
975
978
|
display: flex;
|
|
976
979
|
flex-direction: column;
|
|
977
|
-
`,
|
|
980
|
+
`,un=$t.h1`
|
|
978
981
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
979
982
|
font-style: normal;
|
|
980
983
|
font-weight: 700;
|
|
981
984
|
font-size: 20px;
|
|
982
985
|
line-height: 24px;
|
|
983
986
|
margin-bottom: 8px;
|
|
984
|
-
`,
|
|
987
|
+
`,fn=$t.h2`
|
|
985
988
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorTextSecondary}};
|
|
986
989
|
font-weight: 400;
|
|
987
990
|
font-size: 14px;
|
|
988
991
|
line-height: 23px;
|
|
989
992
|
margin: 2px 0 0 0;
|
|
990
|
-
`,
|
|
993
|
+
`,gn=$t.div`
|
|
991
994
|
display: block;
|
|
992
995
|
width: 100%;
|
|
993
|
-
`,
|
|
996
|
+
`,hn=$t.div`
|
|
994
997
|
display: flex;
|
|
995
998
|
width: 100%;
|
|
996
999
|
flex-direction: column;
|
|
997
1000
|
justify-content: space-between;
|
|
998
1001
|
background-color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorBackground}};
|
|
999
1002
|
border-radius: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.borderRadius}}px;
|
|
1000
|
-
`;var
|
|
1003
|
+
`;var Cp=({title:e,subtitle:t,steps:o,onClose:i,visible:r,onCompleteStep:n,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 h=o.filter(m=>m.complete).length,[E,y]=xp(Array(o.length).fill(!0));xn(()=>{let m=[...E];if(s){for(let C=0;C<o.length;C++)if(!o[C].complete){m[C]=!1;break}y(m)}},[]),xn(()=>{A(f)},[f]);let A=m=>{let C=[...E];if(p)for(let P=0;P<E.length;++P)P!==m&&(C[P]=!0);C[m]=!C[m],y(C)};if(!r&&w=="modal")return Pe.createElement(Pe.Fragment,null);let F=Pe.createElement(Pe.Fragment,null,Pe.createElement(mn,null,Pe.createElement(un,{appearance:u,className:l("checklistTitle",u),dangerouslySetInnerHTML:me(e)}),Pe.createElement(fn,{appearance:u,className:l("checklistSubtitle",u),dangerouslySetInnerHTML:me(t)})),Pe.createElement(_e,{display:"percent",count:h,total:o.length,fillColor:a,style:{margin:"14px 0px 8px 0px"},appearance:u})),x=Pe.createElement(gn,{className:ye(l("checklistContainer",u),T)},o.map((m,C)=>{let P=E[C];return Pe.createElement(cn,{appearance:u,stepData:m,collapsed:P,key:`modal-checklist-${m.id??C}`,onClick:()=>{if(f===C){A(C);return}c(C)},onPrimaryButtonClick:()=>{n&&n(C,m),m.handlePrimaryButtonClick&&m.handlePrimaryButtonClick(),d&&!m.completionCriteria&&C<E.length-1&&E[C+1]&&c(C+1)},onSecondaryButtonClick:()=>{m.handleSecondaryButtonClick&&m.handleSecondaryButtonClick()},customStepTypes:S})}));return w==="inline"?Pe.createElement(hn,{appearance:u,className:ye(l("checklistInlineContainer",u),T)},F,x):Pe.createElement(Pe.Fragment,null,Pe.createElement(Ze,{onClose:i,visible:r,appearance:u,style:{maxWidth:"600px"},headerContent:F},x))},er=Cp;import ae,{useEffect as tr,useRef as Fp,useState as yt}from"react";import St from"react";import le,{css as Cn,keyframes as Sn}from"styled-components";var yn=Cn`
|
|
1001
1004
|
border: 1px solid ${({theme:e})=>e.colorBorder};
|
|
1002
|
-
`,Cp=xn`
|
|
1003
|
-
box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.06);
|
|
1004
1005
|
`,Sp=Cn`
|
|
1006
|
+
box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.06);
|
|
1007
|
+
`,yp=Sn`
|
|
1005
1008
|
from {
|
|
1006
1009
|
opacity: 0;
|
|
1007
1010
|
} to {
|
|
1008
1011
|
opacity: 1;
|
|
1009
1012
|
}
|
|
1010
|
-
`,
|
|
1013
|
+
`,bp=Sn`
|
|
1011
1014
|
from {
|
|
1012
1015
|
opacity: 1;
|
|
1013
1016
|
} to {
|
|
1014
1017
|
opacity: 0;
|
|
1015
1018
|
}
|
|
1016
|
-
`,
|
|
1019
|
+
`,bn=le.div`
|
|
1017
1020
|
margin: 0 -20px;
|
|
1018
1021
|
overflow-x: auto;
|
|
1019
1022
|
padding-left: 20px;
|
|
@@ -1030,14 +1033,14 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1030
1033
|
::-webkit-scrollbar {
|
|
1031
1034
|
display: none;
|
|
1032
1035
|
}
|
|
1033
|
-
`,
|
|
1036
|
+
`,wn=le.div`
|
|
1034
1037
|
display: flex;
|
|
1035
1038
|
flex-flow: row nowrap;
|
|
1036
1039
|
gap: 0 16px;
|
|
1037
1040
|
scroll-snap-align: center;
|
|
1038
1041
|
scroll-snap-stop: always;
|
|
1039
|
-
`,
|
|
1040
|
-
animation: ${e=>e.reversed?yp
|
|
1042
|
+
`,Tn=le.div`
|
|
1043
|
+
animation: ${e=>e.reversed?bp:yp} 0.25s ease-out;
|
|
1041
1044
|
background: linear-gradient(
|
|
1042
1045
|
to right,
|
|
1043
1046
|
${({theme:e})=>e.colorBackground}00,
|
|
@@ -1045,8 +1048,8 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1045
1048
|
);
|
|
1046
1049
|
position: absolute;
|
|
1047
1050
|
width: 64px;
|
|
1048
|
-
`,
|
|
1049
|
-
${
|
|
1051
|
+
`,Fn=le.button`
|
|
1052
|
+
${yn}
|
|
1050
1053
|
box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.1);
|
|
1051
1054
|
align-items: center;
|
|
1052
1055
|
border-radius: 50%;
|
|
@@ -1057,11 +1060,11 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1057
1060
|
justify-content: center;
|
|
1058
1061
|
position: absolute;
|
|
1059
1062
|
width: 48px;
|
|
1060
|
-
`,
|
|
1063
|
+
`,kn=le.div`
|
|
1061
1064
|
border-radius: ${({theme:e})=>e.borderRadius}px;
|
|
1062
1065
|
padding: 20px;
|
|
1063
|
-
`,
|
|
1064
|
-
${
|
|
1066
|
+
`,Pn=le(kn)`
|
|
1067
|
+
${yn}
|
|
1065
1068
|
background: ${({theme:e})=>e.colorBackground};
|
|
1066
1069
|
|
|
1067
1070
|
&:active {
|
|
@@ -1072,81 +1075,81 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1072
1075
|
${e=>e.blocked?"":`border: 1px solid ${e.theme.colorPrimary};`}
|
|
1073
1076
|
${e=>e.blocked?"cursor: default":"cursor: pointer"}
|
|
1074
1077
|
}
|
|
1075
|
-
`,
|
|
1078
|
+
`,vn=le.img`
|
|
1076
1079
|
border-radius: 50%;
|
|
1077
1080
|
height: 40px;
|
|
1078
1081
|
margin-bottom: 12px;
|
|
1079
1082
|
width: 40px;
|
|
1080
|
-
`,
|
|
1083
|
+
`,En=le(kn)`
|
|
1081
1084
|
${e=>k(e)} {
|
|
1082
|
-
${
|
|
1085
|
+
${Sp}
|
|
1083
1086
|
|
|
1084
1087
|
background: ${({theme:e})=>e.colorBackground};
|
|
1085
1088
|
}
|
|
1086
|
-
`,
|
|
1089
|
+
`,An=le.div`
|
|
1087
1090
|
color: ${({theme:e})=>e.colorPrimary};
|
|
1088
1091
|
display: flex;
|
|
1089
1092
|
flex-flow: row nowrap;
|
|
1090
1093
|
align-items: center;
|
|
1091
1094
|
margin-left: 20px;
|
|
1092
|
-
`,In=
|
|
1095
|
+
`,In=le.div`
|
|
1093
1096
|
white-space: nowrap;
|
|
1094
|
-
`,
|
|
1097
|
+
`,Bn=le.div`
|
|
1095
1098
|
background: #d8fed8;
|
|
1096
1099
|
border-radius: 6px;
|
|
1097
1100
|
margin-bottom: 12px;
|
|
1098
1101
|
padding: 4px 10px;
|
|
1099
|
-
`,
|
|
1102
|
+
`,wp=le.p`
|
|
1100
1103
|
font-weight: bold;
|
|
1101
1104
|
font-size: 18px;
|
|
1102
1105
|
line-height: 22px;
|
|
1103
1106
|
letter-spacing: calc(18px * -0.01);
|
|
1104
1107
|
margin: 0;
|
|
1105
|
-
`,
|
|
1108
|
+
`,Nn=le(wp)`
|
|
1106
1109
|
margin-bottom: 4px;
|
|
1107
|
-
`,
|
|
1110
|
+
`,Tp=le.p`
|
|
1108
1111
|
font-weight: bold;
|
|
1109
1112
|
font-size: 16px;
|
|
1110
1113
|
line-height: 20px;
|
|
1111
1114
|
letter-spacing: calc(16px * -0.01);
|
|
1112
1115
|
margin: 0;
|
|
1113
|
-
`,
|
|
1116
|
+
`,Ln=le(Tp)`
|
|
1114
1117
|
margin-bottom: 4px;
|
|
1115
1118
|
${e=>e.blocked||e.complete?"opacity: 0.4;":`
|
|
1116
1119
|
`}
|
|
1117
|
-
`,
|
|
1120
|
+
`,We=le.p`
|
|
1118
1121
|
color: ${({theme:e})=>e.colorText};
|
|
1119
1122
|
font-weight: normal;
|
|
1120
1123
|
font-size: 14px;
|
|
1121
1124
|
line-height: 22px;
|
|
1122
1125
|
margin: 0;
|
|
1123
|
-
`,
|
|
1126
|
+
`,On=le.p`
|
|
1124
1127
|
color: ${({theme:e})=>e.colorText};
|
|
1125
1128
|
font-weight: 600;
|
|
1126
1129
|
font-size: 12px;
|
|
1127
1130
|
line-height: 16px;
|
|
1128
1131
|
margin: 0;
|
|
1129
|
-
`;
|
|
1132
|
+
`;We.Loud=le(We)`
|
|
1130
1133
|
font-weight: 600;
|
|
1131
|
-
`;
|
|
1134
|
+
`;We.Quiet=le(We)`
|
|
1132
1135
|
color: ${({theme:e})=>e.colorTextSecondary};
|
|
1133
1136
|
${e=>e.blocked||e.complete?"opacity: 0.4;":`
|
|
1134
1137
|
`}
|
|
1135
|
-
`;var
|
|
1138
|
+
`;var Dn=({stepData:e,style:t={},appearance:o})=>{let{mergeAppearanceWithDefault:i}=Q(),{primaryCTAClickSideEffects:r}=ne(),{theme:n,styleOverrides:s}=i(o),{imageUri:p=null,subtitle:d=null,title:a=null,complete:f=!1,blocked:c=!1}=e,u=()=>{r(e)};return St.createElement(Pn,{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(Bn,{className:l("carouselCompletedPill",o)},St.createElement(On,{style:{color:"#108E0B"}},"Complete"))),a&&St.createElement(Ln,{blocked:c,complete:f,className:l("carouselCardTitle",o)},a),d&&St.createElement(We.Quiet,{blocked:c,complete:f,className:l("carouselCardSubtitle",o)},d))};import Rt from"react";var $n=({numberOfStepsCompleted:e,numberOfSteps:t,appearance:o})=>{let i=t>0?e/t:0,r=200,n=Math.min(r,Math.max(10,Math.round(r*i)));return Rt.createElement(An,{className:l("carouselProgressBar",o)},Rt.createElement(In,{as:We.Loud,style:{marginRight:8}},e," of ",t),Rt.createElement("svg",{height:10,width:r},Rt.createElement("rect",{x:0,y:0,rx:5,width:r,height:10,fill:"#E6E6E6"}),Rt.createElement("rect",{x:0,y:0,rx:5,width:n,height:10,fill:"currentColor"})))};var kp=()=>ae.createElement("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},ae.createElement("path",{d:"M14 6L20 12",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round"}),ae.createElement("path",{d:"M14 18L20 12",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round"}),ae.createElement("path",{d:"M4 12H20",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round"})),Mn=({side:e="left",show:t=!1,onClick:o=()=>{}})=>{let[i,r]=yt(!1),[n,s]=yt(!1);tr(()=>{t===!0&&i===!1?r(!0):t===!1&&i===!0&&s(!0)},[t]);let p=()=>{r(!1),s(!1)},d=e=="left"?{top:0,bottom:0,left:-20,transform:"rotate(180deg)"}:{top:0,bottom:0,right:-20};return i?ae.createElement(Tn,{style:d,reversed:n,onAnimationEnd:n?p:null},ae.createElement(Fn,{onClick:()=>o(),style:{right:16,top:"calc(50% - 24px)"}},ae.createElement(kp,null))):null},Un=({flowId:e,appearance:t,customVariables:o,className:i})=>{let r=Fp(null),[n,s]=yt(!1),[p,d]=yt(!1),[a,f]=yt(null),[c,u]=yt([]),[w,T]=yt(0),{getFlowMetadata:S,getFlowSteps:h,getNumberOfStepsCompleted:E,updateCustomVariables:y,getFlowStatus:A,isLoading:F,targetingLogicShouldHideFlow:x,getFlow:m}=J();tr(()=>{y(o)},[o,F]),tr(()=>{if(F)return;let I=S(e),j=E(e),B=h(e);f(I),I.data!==null&&(u(B.sort((D,re)=>Number(D.complete)-Number(re.complete))),d(B.length>3),T(j))},[F]);let C=[];for(let I=0;I<c.length;I+=3)C.push(c.slice(I,I+3));let P=I=>{let j=I.target,B=j.scrollWidth-j.clientWidth,D=Math.ceil(j.scrollLeft);D>0&&n===!1&&s(!0),D===0&&n===!0&&s(!1),D<B&&p===!1&&d(!0),D===B&&p===!0&&d(!1)},$=(I=!0)=>{let j=I?1:-1;r.current!==null&&r.current.scrollBy({left:r.current.clientWidth*j,behavior:"smooth"})},U=null,M=I=>{U!==null?clearTimeout(U):P(I),U=setTimeout(()=>{P(I)},16)};return F?null:ae.createElement(En,{className:ye(l("carouselContainer",t),i)},ae.createElement("div",{style:{display:"flex",justifyContent:"space-between",marginBottom:20}},ae.createElement("div",null,ae.createElement(Nn,{className:l("carouselTitle",t)},a==null?void 0:a.title),ae.createElement(We.Quiet,{className:l("carouselSubtitle",t)},a==null?void 0:a.subtitle)),ae.createElement($n,{numberOfStepsCompleted:w,numberOfSteps:c.length})),ae.createElement("div",{style:{position:"relative"}},ae.createElement(Mn,{show:n,onClick:()=>$(!1)}),ae.createElement(Mn,{side:"right",show:p,onClick:$}),ae.createElement(bn,{ref:r,onScroll:M},C.map((I,j)=>ae.createElement(wn,{key:j,style:{flex:`0 0 calc(100% - ${c.length>3?36:0}px)`}},I.map((B,D)=>ae.createElement(Dn,{key:D,stepData:B,style:{flex:c.length>3?"0 1 calc(33% - 16px * 2 / 3)":1},appearance:t})))))))};var or=({flowId:e,title:t,subtitle:o,style:i,initialSelectedStep:r,className:n,type:s="inline",onDismiss:p,visible:d,customVariables:a,onStepCompletion:f,onButtonClick:c,appearance:u,hideOnFlowCompletion:w,setVisible:T,customStepTypes:S,checklistStyle:h="default",autoExpandFirstIncompleteStep:E,autoExpandNextStep:y,...A})=>{let{getFlow:F,getFlowSteps:x,markStepCompleted:m,getStepStatus:C,getNumberOfStepsCompleted:P,isLoading:$,targetingLogicShouldHideFlow:U,updateCustomVariables:M,getFlowMetadata:I,isStepBlocked:j,getFlowStatus:B,hasActiveFullPageFlow:D,setHasActiveFullPageFlow:re}=J(),{primaryCTAClickSideEffects:R,secondaryCTAClickSideEffects:_}=ne(),{getOpenFlowState:he,setOpenFlowState:Fe}=ve(),[W,se]=Wn(r||0),[G,L]=Wn(!1),te=d===void 0?he(e):d,xe=s==="modal",{mergeAppearanceWithDefault:Ce}=Q(),{isLarge:V}=tn();if(u=Ce(u),_n(()=>{M(a)},[a,$]),_n(()=>{d!==void 0&&(xe&&d===!0?re(!0):xe&&d===!1&&re(!1))},[d,T,D]),$)return null;let de=F(e);if(!de||U(de))return null;let oe=x(e);if(!oe||w===!0&&B(e)===X)return null;let K=I(e);if(K!=null&&K.title&&(t=K.title),K!=null&&K.subtitle&&(o=K.subtitle),!G&&r===void 0&&P(e)>0){let z=Math.min(P(e),oe.length-1);se(z),L(!0)}function je(){if(W+1>=oe.length){xe&&Fe(e,!1);return}j(e,oe[W+1].id)||se(W+1)}function Ge(z,lt,ro){let pr=W+1<oe.length?oe[W+1]:null;c&&c(z,W,lt,pr)===!0&&xe&&g(),f&&f(z,ro,pr),!f&&!c&&(z.primaryButtonUri||z.secondaryButtonUri)&&xe&&g()}function Y(){return oe.map((z,lt)=>({...z,handleSecondaryButtonClick:()=>{je(),_(z),z.skippable===!0&&m(e,z.id,{skipped:!0}),Ge(z,"secondary",lt)},handlePrimaryButtonClick:()=>{(!z.completionCriteria&&(z.autoMarkCompleted||z.autoMarkCompleted===void 0)||z.completionCriteria&&z.autoMarkCompleted===!0)&&(m(e,z.id),je()),Ge(z,"primary",lt),R(z),C(e,z.id)===Oe&&je()}}))}function Se(){return pe.createElement(ie,{appearance:u})}let st={steps:Y(),title:t,subtitle:o,primaryColor:u.theme.colorPrimary,appearance:u,customStepTypes:S,type:s,className:n,autoExpandFirstIncompleteStep:E,autoExpandNextStep:y};function g(){Fe(e,!1),p&&p(),T&&T(!1)}function b(){return pe.createElement(pe.Fragment,null,pe.createElement(Se,null),pe.createElement(Un,{flowId:e,appearance:u,customVariables:a,className:n}))}function v(){return pe.createElement(pe.Fragment,null,pe.createElement(Se,null),pe.createElement(er,{visible:te,onClose:()=>{g()},selectedStep:W,setSelectedStep:se,autoExpandNextStep:!0,appearance:u,...st}))}function H(){if(!V)return v();let z=A.guideFlowId,lt;return z&&F(z)&&(lt=x(z)),pe.createElement(pe.Fragment,null,pe.createElement(Se,null),pe.createElement(Ro,{visible:te,stepsTitle:K.stepsTitle?K.stepsTitle:"Your quick start guide",onClose:()=>{g()},selectedStep:W,setSelectedStep:se,guideData:lt,guideTitle:A.guideTitle??"Guide",appearance:u,title:t,subtitle:o,onGuideButtonClick:ro=>{Ge(ro,"link",0)},customStepTypes:S,...st}))}function ce(){if(!V)return v();let z=pe.createElement(Qo,{flowId:e,style:i,selectedStep:W,setSelectedStep:se,appearance:u,type:s,...st});return xe?pe.createElement(Ze,{onClose:()=>{g()},visible:te,appearance:u,style:{paddingTop:"0px",padding:"12px",paddingLeft:0}},pe.createElement(Se,null),z):pe.createElement(pe.Fragment,null,pe.createElement(Se,null),z)}switch(h){case"condensed":return v();case"with-guide":return H();case"default":return ce();case"carousel":return b();default:return ce()}};var vp=e=>Pp.createElement(or,{type:"inline",...e});import it,{useEffect as Ap}from"react";import ze from"react";import Eo from"styled-components";var zn=Eo.div`
|
|
1136
1139
|
border: 1px solid ${e=>e.appearance.theme.colorBorder};
|
|
1137
1140
|
border-radius: 8px;
|
|
1138
1141
|
padding: 6px 10px 6px 10px;
|
|
1139
1142
|
min-width: 160px;
|
|
1140
1143
|
cursor: pointer;
|
|
1141
1144
|
background-color: ${e=>e.appearance.theme.colorBackground}};
|
|
1142
|
-
`,
|
|
1145
|
+
`,Hn=Eo.div`
|
|
1143
1146
|
display: flex;
|
|
1144
1147
|
flex-direction: row;
|
|
1145
1148
|
justify-content: space-between;
|
|
1146
1149
|
align-items: center;
|
|
1147
1150
|
margin-bottom: 2px;
|
|
1148
1151
|
flex-grow: 2;
|
|
1149
|
-
`,
|
|
1152
|
+
`,jn=Eo.div`
|
|
1150
1153
|
text-overflow: ellipsis;
|
|
1151
1154
|
font-weight: 600;
|
|
1152
1155
|
font-size: 12px;
|
|
@@ -1159,7 +1162,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1159
1162
|
display: flex;
|
|
1160
1163
|
height: 100%;
|
|
1161
1164
|
align-items: center;
|
|
1162
|
-
`;import{motion as
|
|
1165
|
+
`;import{motion as Ep}from"framer-motion";var Vn=({title:e,count:t,total:o,onClick:i,style:r={},className:n,appearance:s,type:p="default"})=>ze.createElement(ze.Fragment,null,ze.createElement(ie,{appearance:s}),ze.createElement(zn,{as:Ep.div,whileHover:{opacity:.9},whileTap:{scale:.98},onClick:()=>i!==void 0&&i(),style:{...p=="condensed"?{display:"flex",justifyContent:"space-between"}:{},...r},className:ye(n??"",l("progressRingContainer",s)),appearance:s},p=="condensed"&&o&&o!==0&&ze.createElement(Gn,{className:l("progressRingContainer",s)},ze.createElement(At,{size:19,percentage:t/o,fillColor:s.theme.colorPrimary,bgColor:s.theme.colorBackgroundSecondary})),ze.createElement(Hn,{type:p,className:l("badgeTitleContainer",s)},ze.createElement(jn,{type:p,appearance:s,className:l("badgeTitle",s)},e),i!==void 0&&ze.createElement(Dt,{className:l("badgeChevron",s),color:s.theme.colorPrimary})),p=="default"&&o&&o!==0&&ze.createElement(_e,{display:"compact",count:t,total:o,fillColor:s.theme.colorPrimary,bgColor:s.theme.colorBackgroundSecondary,style:{width:"100%"},appearance:s})));import rt from"react";import eo from"styled-components";var qn=eo.div`
|
|
1163
1166
|
display: flex;
|
|
1164
1167
|
flex-direction: row;
|
|
1165
1168
|
width: 100%;
|
|
@@ -1170,25 +1173,25 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1170
1173
|
border-width: 1px;
|
|
1171
1174
|
border-color: ${e=>e.appearance.theme.colorPrimary};
|
|
1172
1175
|
border-radius: 12px;
|
|
1173
|
-
`,
|
|
1176
|
+
`,Kn=eo.div`
|
|
1174
1177
|
${e=>k(e)} {
|
|
1175
1178
|
display: flex;
|
|
1176
1179
|
justify-content: center;
|
|
1177
1180
|
align-items: center;
|
|
1178
1181
|
margin-right: 16px;
|
|
1179
1182
|
}
|
|
1180
|
-
`,
|
|
1183
|
+
`,Yn=eo.div`
|
|
1181
1184
|
display: flex;
|
|
1182
1185
|
flex-direction: column;
|
|
1183
1186
|
flex: 1;
|
|
1184
1187
|
margin-top: 0;
|
|
1185
|
-
`,
|
|
1188
|
+
`,Xn=eo.div`
|
|
1186
1189
|
display: flex;
|
|
1187
1190
|
flex-direction: column;
|
|
1188
1191
|
justify-content: center;
|
|
1189
1192
|
margin-left: 16px;
|
|
1190
1193
|
min-width: 200px;
|
|
1191
|
-
`,
|
|
1194
|
+
`,fC=eo.div`
|
|
1192
1195
|
display: flex;
|
|
1193
1196
|
justify-content: center;
|
|
1194
1197
|
align-items: flex-end;
|
|
@@ -1197,7 +1200,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1197
1200
|
:hover {
|
|
1198
1201
|
opacity: 0.8;
|
|
1199
1202
|
}
|
|
1200
|
-
`;var
|
|
1203
|
+
`;var Jn=({title:e,subtitle:t,icon:o,appearance:i,count:r,total:n,className:s,style:p})=>rt.createElement(rt.Fragment,null,rt.createElement(qn,{appearance:i,className:ye(l("fullWidthProgressBadgeContainer",i),s??""),style:p},o&&rt.createElement(Kn,{className:l("fullWidthProgressBadgeIcon",i)},o),rt.createElement(Yn,null,rt.createElement(be,{size:"small",appearance:i,title:e,subtitle:t})),rt.createElement(Xn,{className:l("fullWidthProgressBadgeProgressContainer",i)},rt.createElement(_e,{count:r,total:n,display:"percent",textLocation:"top",fillColor:i.theme.colorPrimary}))));var Ip=({flowId:e,title:t,subtitle:o,icon:i,style:r,onClick:n,className:s,customVariables:p,hideOnFlowCompletion:d,appearance:a,type:f="default"})=>{let{getFlow:c,getFlowSteps:u,getFlowStatus:w,getNumberOfStepsCompleted:T,isLoading:S,targetingLogicShouldHideFlow:h,updateCustomVariables:E}=J(),{mergeAppearanceWithDefault:y}=Q();a=y(a);let{setOpenFlowState:A,getOpenFlowState:F}=ve();if(Ap(()=>{E(p)},[p,S]),S)return null;let x=c(e);if(!x||h(x)||d===!0&&w(e)===X)return null;let m=u(e),C=T(e);return f==="full-width"?it.createElement(it.Fragment,null,it.createElement(ie,{appearance:a}),it.createElement(Jn,{title:t,subtitle:o,count:C,total:m.length,style:r,className:s,appearance:a,icon:i,onClick:()=>{}})):it.createElement(it.Fragment,null,it.createElement(ie,{appearance:a}),it.createElement(Vn,{count:C,total:m.length,title:t,style:r,onClick:()=>{A(e,!0),n&&n()},type:f,className:s,appearance:a}))};import Bp from"react";var Np=({flowId:e,style:t,appearance:o,...i})=>{let{getFlow:r,targetingLogicShouldHideFlow:n,getFlowSteps:s}=J(),{mergeAppearanceWithDefault:p}=Q();o=p(o);let d=r(e);if(!d||n(d))return null;let a=s(e);return Bp.createElement(Zt,{steps:a,style:t,appearance:o,...i})};import Ut,{useContext as Gp,useEffect as Vp}from"react";import O,{useEffect as Ao,useLayoutEffect as ls,useRef as Mp,useState as to}from"react";import oo from"styled-components";import{useCallback as Lp,useEffect as Op,useState as Dp}from"react";var rr=(e,t,o,i={x:20,y:20},r)=>{let n=r=="fixed"?0:window.scrollY,s=r=="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+n}:t==="right"?{x:e.left+e.width+i.x+s,y:e.top-i.y+n}:{x:0,y:0}},Qn={bottom:0,height:0,left:0,right:0,top:0,width:0,x:0,y:0};function $p(e){let t=Qn;return e&&(t=e.getBoundingClientRect()),t}function Zn(e,t){let[o,i]=Dp(Qn),r=Lp(()=>{e&&i($p(e))},[e]);return Op(()=>(r(),window.addEventListener("resize",r),()=>window.removeEventListener("resize",r)),[e,t]),o}import nt from"styled-components";var Rn=nt.div`
|
|
1201
1204
|
${e=>k(e)} {
|
|
1202
1205
|
background: ${e=>e.appearance.theme.colorBackground};
|
|
1203
1206
|
}
|
|
@@ -1208,13 +1211,13 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1208
1211
|
min-width: 300px;
|
|
1209
1212
|
padding: 22px 22px 12px;
|
|
1210
1213
|
z-index: ${e=>e.zIndex};
|
|
1211
|
-
`,
|
|
1214
|
+
`,es=nt.div`
|
|
1212
1215
|
display: block;
|
|
1213
1216
|
cursor: pointer;
|
|
1214
1217
|
position: absolute;
|
|
1215
1218
|
top: 25px;
|
|
1216
1219
|
right: 22px;
|
|
1217
|
-
`,
|
|
1220
|
+
`,ts=nt.img`
|
|
1218
1221
|
${e=>k(e)} {
|
|
1219
1222
|
display: block;
|
|
1220
1223
|
width: 100%;
|
|
@@ -1223,7 +1226,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1223
1226
|
margin-top: ${e=>e.dismissible?"24px":"0px"};
|
|
1224
1227
|
margin-bottom: 16px;
|
|
1225
1228
|
}
|
|
1226
|
-
`,
|
|
1229
|
+
`,os=nt.div`
|
|
1227
1230
|
${e=>k(e)} {
|
|
1228
1231
|
display: block;
|
|
1229
1232
|
width: 100%;
|
|
@@ -1232,17 +1235,17 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1232
1235
|
margin-top: ${e=>e.dismissible?"24px":"0px"};
|
|
1233
1236
|
margin-bottom: 16px;
|
|
1234
1237
|
}
|
|
1235
|
-
`,
|
|
1238
|
+
`,rs=nt.div`
|
|
1236
1239
|
display: flex;
|
|
1237
1240
|
flex-direction: row;
|
|
1238
1241
|
justify-content: space-between;
|
|
1239
1242
|
align-content: center;
|
|
1240
|
-
`,
|
|
1243
|
+
`,is=nt.div`
|
|
1241
1244
|
display: flex;
|
|
1242
1245
|
flex: 1;
|
|
1243
1246
|
flex-direction: column;
|
|
1244
1247
|
justify-content: center;
|
|
1245
|
-
`,
|
|
1248
|
+
`,ns=nt.div`
|
|
1246
1249
|
display: flex;
|
|
1247
1250
|
flex: 2;
|
|
1248
1251
|
flex-shrink: 1;
|
|
@@ -1254,7 +1257,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1254
1257
|
align-content: center;
|
|
1255
1258
|
align-items: center;
|
|
1256
1259
|
}
|
|
1257
|
-
`,
|
|
1260
|
+
`,ss=nt.p`
|
|
1258
1261
|
${e=>k(e)} {
|
|
1259
1262
|
font-style: normal;
|
|
1260
1263
|
font-weight: 600;
|
|
@@ -1263,7 +1266,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1263
1266
|
color: #808080;
|
|
1264
1267
|
}
|
|
1265
1268
|
margin: 0;
|
|
1266
|
-
`;var
|
|
1269
|
+
`;var as=300,ps=100,Up=500,Mt=12,_p=oo.div`
|
|
1267
1270
|
width: 100%;
|
|
1268
1271
|
height: 100%;
|
|
1269
1272
|
border-radius: 9999px;
|
|
@@ -1286,25 +1289,25 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1286
1289
|
opacity: 0;
|
|
1287
1290
|
}
|
|
1288
1291
|
}
|
|
1289
|
-
`,
|
|
1290
|
-
width: ${
|
|
1291
|
-
height: ${
|
|
1292
|
+
`,Wp=oo.div`
|
|
1293
|
+
width: ${Mt}px;
|
|
1294
|
+
height: ${Mt}px;
|
|
1292
1295
|
border-radius: 100px;
|
|
1293
1296
|
background-color: ${e=>e.primaryColor};
|
|
1294
1297
|
z-index: 20;
|
|
1295
1298
|
opacity: 1;
|
|
1296
|
-
`,
|
|
1299
|
+
`,zp=oo.div`
|
|
1297
1300
|
pointer-events: all;
|
|
1298
|
-
`,
|
|
1301
|
+
`,ds=oo.div`
|
|
1299
1302
|
display: flex;
|
|
1300
1303
|
align-content: center;
|
|
1301
1304
|
justify-content: center;
|
|
1302
1305
|
align-items: center;
|
|
1303
1306
|
z-index: ${e=>e.zIndex?e.zIndex:90};
|
|
1304
|
-
`,
|
|
1305
|
-
width: ${
|
|
1306
|
-
height: ${
|
|
1307
|
-
`,
|
|
1307
|
+
`,Hp=oo(ds)`
|
|
1308
|
+
width: ${Mt+12}px;
|
|
1309
|
+
height: ${Mt+12}px;
|
|
1310
|
+
`,jp=({steps:e=[],onDismiss:t,onComplete:o=()=>{},tooltipPosition:i="auto",showHighlight:r=!0,primaryColor:n="#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})=>{var oe,K,je,Ge;let[h,E]=to(),[y,A]=to(new Date),F=Mp(null),[x,m]=to(document.querySelector(e[a].selector)),C=Zn(x,y),[P,$]=to(),[U,M]=to(!w),I=(K=(oe=e[a])==null?void 0:oe.props)!=null&&K.position?e[a].props.position:"absolute",j=((Ge=(je=e[a])==null?void 0:je.props)==null?void 0:Ge.zIndex)??90,B=(h==null?void 0:h.width)??as,D=(h==null?void 0:h.height)??ps;ls(()=>{F.current&&E({width:F.current.clientWidth,height:F.current.clientHeight})},[a,y,I]),Ao(()=>{w||M(!0)},[a]);let re=i==="auto"?"right":i,R=rr(C,re,B,s,I),_=C.right+B>(window.innerWidth||document.documentElement.clientWidth),he=C.bottom+ps>(window.innerHeight||document.documentElement.clientHeight);_&&i==="auto"&&(R=rr(C,"left",B,s,I),re="left");let Fe=window.location.pathname.split("/").pop(),W=()=>{let Y=document.querySelector(e[a].selector);P&&P===JSON.stringify(Y==null?void 0:Y.getBoundingClientRect())||(m(Y),A(new Date),Y&&$(JSON.stringify(Y.getBoundingClientRect())))};if(Ao(()=>{let Y=new MutationObserver(W);return Y.observe(document.body,{subtree:!0,childList:!0}),()=>Y.disconnect()},[W]),Ao(()=>{let Y=new MutationObserver(W);return Y.observe(document.body,{subtree:!0,childList:!0,attributes:!0,attributeFilter:["style","class"]}),()=>Y.disconnect()},[W]),Ao(()=>{let Y=setInterval(()=>{W()},10);return()=>clearInterval(Y)},[W]),ls(()=>{setTimeout(()=>{W()},Up),W()},[a,Fe]),x===null)return O.createElement(O.Fragment,null);if(R.x==0&&R.y==0)return O.createElement(O.Fragment,null);if(!p)return O.createElement(O.Fragment,null);let se=()=>{let Y=()=>{if(e[a].handlePrimaryButtonClick&&(e[a].handlePrimaryButtonClick(),M(!1),setTimeout(()=>{W()},30)),S===e.length-1)return o()},Se=()=>{e[a].handleSecondaryButtonClick&&(e[a].handleSecondaryButtonClick(),w&&M(!1))};return O.createElement(O.Fragment,null,T&&O.createElement(is,null,O.createElement(ss,{className:l("tooltipStepCounter",c)},a+1," of ",e.length)),O.createElement(ns,{showStepCount:T,className:l("tooltipCTAContainer",c)},e[a].secondaryButtonTitle&&O.createElement(ee,{title:e[a].secondaryButtonTitle,appearance:c,onClick:Se,size:"small",withMargin:!1,secondary:!0}),e[a].primaryButtonTitle&&O.createElement(ee,{title:e[a].primaryButtonTitle,appearance:c,onClick:Y,withMargin:!1,size:"small"})))},G=()=>O.createElement(O.Fragment,null,u&&O.createElement(es,{"data-testid":"tooltip-dismiss",onClick:()=>{t&&t()},className:l("tooltipClose",c)},O.createElement(Ee,null)),e[a].imageUri&&O.createElement(ts,{dismissible:u,appearance:c,src:e[a].imageUri,className:l("tooltipImageContainer",c)}),e[a].videoUri&&!e[a].imageUri&&O.createElement(os,{dismissible:u,appearance:c,className:l("tooltipVideoContainer",c)},O.createElement(vt,{appearance:c,videoUri:e[a].videoUri})),O.createElement(be,{appearance:c,title:e[a].title,subtitle:e[a].subtitle,size:"small"}),O.createElement(rs,{className:l("tooltipFooter",c)},O.createElement(se,null))),te={...{default:Y=>{var Se;if((Se=e[a])!=null&&Se.StepContent){let st=e[a].StepContent;return O.createElement("div",null,st)}return O.createElement(G,null)}},...f},xe=()=>{var Y;return e?!((Y=e[a])!=null&&Y.type)||!te[e[a].type]?te.default(e[a]):te[e[a].type]({stepData:e[a],primaryColor:n}):O.createElement(O.Fragment,null)};if(w&&e[a].complete===!0)return null;let Ce={top:(R==null?void 0:R.y)-Mt,left:(re=="left"?C.x+s.x:(R==null?void 0:R.x)-Mt)??0,cursor:w?"pointer":"default",position:I},V=()=>{let Se=Ce.left+(re=="left"?-B:24);return Math.min(Math.max(Se,20),window.innerWidth-B-20)},de=()=>{w&&(A(new Date),M(!U))};return O.createElement(zp,null,O.createElement(Hp,{style:Ce,zIndex:j,className:l("tourHighlightContainer",c)},r&&e[a].showHighlight!==!1&&O.createElement(O.Fragment,null,O.createElement(Wp,{style:{position:I},onClick:de,primaryColor:c.theme.colorPrimary}),O.createElement(_p,{style:{position:"absolute"},onClick:de,primaryColor:c.theme.colorPrimary}))),O.createElement(ds,{style:{...Ce,left:V()},zIndex:j+1,className:l("tooltipContainerWrapper",c)},U&&O.createElement(Rn,{ref:F,layoutId:"tooltip-container",style:{position:"relative",width:"max-content",right:0,top:12,...d},appearance:c,className:l("tooltipContainer",c),maxWidth:as,zIndex:j+10},O.createElement(xe,null))))},Io=jp;import{Portal as qp}from"react-portal";var Kp=({flowId:e,customVariables:t,appearance:o,onStepCompletion:i,onButtonClick:r,showTooltipsSimultaneously:n=!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:h,markStepCompleted:E,markStepStarted:y,markFlowCompleted:A,updateCustomVariables:F,getCurrentStepIndex:x,getStepStatus:m,isStepBlocked:C,getFlowStatus:P,getNumberOfStepsCompleted:$}=J(),{isLoadingUserFlowStateData:U}=Be(),{primaryCTAClickSideEffects:M,secondaryCTAClickSideEffects:I}=ne(),{hasOpenModals:j}=ve(),B=x(e),{openFlowStates:D}=Gp(q),{mergeAppearanceWithDefault:re}=Q();if(o=re(o),Vp(()=>{F(t)},[t,S]),U)return null;let R=w(e);if(!R||h(R)||P(e)==X||j())return null;let _=T(e);if(Object.keys(D).length>0){let L=Object.keys(D).find(te=>D[te]===!0);if(L!==void 0&&L!==e)return Ut.createElement(Ut.Fragment,null)}async function he(L){if(await E(e,L.id),_.map(te=>m(e,te.id)).every(te=>te===Oe)){await A(e);return}if(!a&&B+1<_.length){if(C(e,_[B+1].id))return;await y(e,_[B+1].id)}}function Fe(L,te,xe){let Ce=B+1<_.length?_[B+1]:null;r&&r(L,B,te,Ce),i&&i(L,xe,Ce)}function W(){return _.map(L=>({...L,handleSecondaryButtonClick:async()=>{I(L),L.skippable===!0&&await E(e,L.id,{skipped:!0}),Fe(L,"secondary",B)},handlePrimaryButtonClick:async()=>{(!L.completionCriteria&&(L.autoMarkCompleted||L.autoMarkCompleted===void 0)||L.completionCriteria&&L.autoMarkCompleted===!0)&&await he(L),Fe(L,"primary",B),M(L)}}))}async function se(L){s&&s(),f==="complete-flow"?await A(e):await E(e,L.id)}function G(){c&&c()}return Ut.createElement(qp,null,Ut.createElement(ie,{appearance:o}),n?_.map((L,te)=>Ut.createElement(Io,{key:L.id,appearance:o,steps:W(),selectedStep:te,showTooltipsSimultaneously:n,dismissible:p,onDismiss:()=>se(L),tooltipPosition:d,showHighlightOnly:a,completedStepsCount:$(e),onComplete:G,...u})):Ut.createElement(Io,{appearance:o,steps:W(),selectedStep:B,showTooltipsSimultaneously:n,dismissible:p,onDismiss:()=>se(_[B]),tooltipPosition:d,completedStepsCount:$(e),showHighlightOnly:a,onComplete:G,...u}))};import Te,{useEffect as Yp,useRef as Xp,useState as Jp}from"react";import{Portal as Qp}from"react-portal";import bt from"styled-components";var cs=bt.button`
|
|
1308
1311
|
${e=>k(e)} {
|
|
1309
1312
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
1310
1313
|
|
|
@@ -1322,17 +1325,17 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1322
1325
|
opacity: 0.8;
|
|
1323
1326
|
}
|
|
1324
1327
|
}
|
|
1325
|
-
`,
|
|
1328
|
+
`,ms=bt.span`
|
|
1326
1329
|
${e=>k(e)} {
|
|
1327
1330
|
font-size: 12px;
|
|
1328
1331
|
display: inline-block;
|
|
1329
1332
|
}
|
|
1330
|
-
`,
|
|
1333
|
+
`,us=bt.span`
|
|
1331
1334
|
${e=>k(e)} {
|
|
1332
1335
|
font-size: 12px;
|
|
1333
1336
|
display: inline-block;
|
|
1334
1337
|
}
|
|
1335
|
-
`,
|
|
1338
|
+
`,fs=bt.div`
|
|
1336
1339
|
position: fixed;
|
|
1337
1340
|
right: 0;
|
|
1338
1341
|
bottom: 0;
|
|
@@ -1342,7 +1345,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1342
1345
|
flex-direction: column;
|
|
1343
1346
|
align-items: flex-end;
|
|
1344
1347
|
z-index: 50;
|
|
1345
|
-
`,
|
|
1348
|
+
`,gs=bt.button`
|
|
1346
1349
|
${e=>k(e)} {
|
|
1347
1350
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
1348
1351
|
background-color: #ffffff;
|
|
@@ -1358,7 +1361,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1358
1361
|
0px 3px 6px -4px rgba(0, 0, 0, 0.12);
|
|
1359
1362
|
border-radius: 45px;
|
|
1360
1363
|
cursor: pointer;
|
|
1361
|
-
`,
|
|
1364
|
+
`,hs=bt.div`
|
|
1362
1365
|
${e=>k(e)} {
|
|
1363
1366
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
1364
1367
|
background: #ffffff;
|
|
@@ -1375,7 +1378,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1375
1378
|
position: ${e=>e.type=="inline"?"absolute":"relative"};
|
|
1376
1379
|
top: ${e=>e.type=="inline"?"68px":0};
|
|
1377
1380
|
margin-left: ${e=>e.type=="inline"?"-127px":0};
|
|
1378
|
-
`,
|
|
1381
|
+
`,xs=bt.button`
|
|
1379
1382
|
${e=>k(e)} {
|
|
1380
1383
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
1381
1384
|
color: #434343;
|
|
@@ -1392,7 +1395,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1392
1395
|
font-size: 14px;
|
|
1393
1396
|
|
|
1394
1397
|
padding: 8px 12px;
|
|
1395
|
-
`;import{AnimatePresence as
|
|
1398
|
+
`;import{AnimatePresence as ws,motion as Ts}from"framer-motion";import Cs from"react";var Ss=({style:e,className:t})=>Cs.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"18",height:"18",fill:"none",viewBox:"0 0 18 18",style:e,className:t},Cs.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 ys from"react";var bs=({style:e,className:t})=>ys.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"},ys.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 Zp=({flowId:e,style:t,onStepCompletion:o,visible:i=!0,type:r="inline",title:n="Help",appearance:s})=>{let{getFlow:p,getFlowSteps:d,markStepCompleted:a,getStepStatus:f,getNumberOfStepsCompleted:c,isLoading:u,targetingLogicShouldHideFlow:w}=J(),{primaryCTAClickSideEffects:T}=ne(),S=Xp(null),[h,E]=Jp(!1),{mergeAppearanceWithDefault:y}=Q();s=y(s),Yp(()=>(document.addEventListener("click",A,!1),()=>{document.removeEventListener("click",A,!1)}),[]);let A=P=>{S.current&&!S.current.contains(P.target)&&E(!1)};if(u)return null;let F=p(e);if(!F||w(F))return null;let x=d(e);if(!x||!i)return null;function m(P,$){!P.completionCriteria&&(P.autoMarkCompleted||P.autoMarkCompleted===void 0)&&a(e,P.id),T(P),o&&o(P,$),E(!1)}function C(){return h&&Te.createElement(hs,{className:l("floatingWidgetMenu",s),as:Ts.div,initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.1},type:r},x.map((P,$)=>Te.createElement(xs,{className:l("floatingWidgetMenuItem",s),key:$,onClick:()=>m(P,$)},P.title)))}return r=="inline"?Te.createElement("span",{ref:S},Te.createElement(cs,{style:t,onClick:()=>{E(!h)},className:l("supportButton",s)},Te.createElement(us,{className:l("supportIconContainer",s)},Te.createElement(bs,{className:l("supportIcon",s),style:{width:"18px",height:"18px"}})),Te.createElement(ms,{className:l("supportButtonTitle",s)},n)),Te.createElement(ws,null,Te.createElement(C,null))):Te.createElement(Qp,null,Te.createElement(fs,{style:t,ref:S},Te.createElement(ws,null,Te.createElement(C,null)),Te.createElement(gs,{onClick:()=>{E(!h)},as:Ts.button,whileHover:{scale:1.1},className:l("floatingWidgetButton",s)},Te.createElement(Ss,{className:l("floatingWidgetButtonIcon",s),style:{display:"flex",width:"20px",height:"20px"}}))))};import He,{useEffect as Rp}from"react";import Bo from"styled-components";var Fs=Bo.div`
|
|
1396
1399
|
${e=>k(e)} {
|
|
1397
1400
|
display: flex;
|
|
1398
1401
|
flex-direction: column;
|
|
@@ -1407,17 +1410,17 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1407
1410
|
border-radius: 12px;
|
|
1408
1411
|
position: relative;
|
|
1409
1412
|
}
|
|
1410
|
-
`,
|
|
1413
|
+
`,ks=Bo.div`
|
|
1411
1414
|
display: flex;
|
|
1412
1415
|
flex-direction: column;
|
|
1413
1416
|
flex: 1;
|
|
1414
|
-
`,
|
|
1417
|
+
`,Ps=Bo.div`
|
|
1415
1418
|
display: flex;
|
|
1416
1419
|
flex-direction: column;
|
|
1417
1420
|
justify-content: center;
|
|
1418
1421
|
align-items: flex-start;
|
|
1419
1422
|
margin-top: 16px;
|
|
1420
|
-
`,
|
|
1423
|
+
`,vs=Bo.div`
|
|
1421
1424
|
${e=>k(e)} {
|
|
1422
1425
|
position: absolute;
|
|
1423
1426
|
top: 16px;
|
|
@@ -1428,7 +1431,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1428
1431
|
opacity: 0.8;
|
|
1429
1432
|
}
|
|
1430
1433
|
}
|
|
1431
|
-
`;var
|
|
1434
|
+
`;var ed=({flowId:e,onDismiss:t,customVariables:o,onButtonClick:i,appearance:r,className:n,style:s,dismissible:p})=>{let{getFlow:d,markFlowCompleted:a,markStepCompleted:f,isLoading:c,targetingLogicShouldHideFlow:u,updateCustomVariables:w,getFlowSteps:T,getFlowStatus:S,getCurrentStepIndex:h}=J(),{primaryCTAClickSideEffects:E}=ne(),{mergeAppearanceWithDefault:y}=Q();if(r=y(r),Rp(()=>{w(o)},[o,c]),c)return null;let A=d(e);if(!A||u(A)||S(e)===X)return null;let x=T(e)[h(e)];return He.createElement(He.Fragment,null,He.createElement(ie,{appearance:r}),He.createElement(Fs,{appearance:r,className:ye(l("embeddedTipContainer",r),n),style:s},(p===!0||x.dismissible)&&He.createElement(vs,{onClick:async()=>{await a(e),t&&t()},className:l("embeddedTipDismissButton",r)},He.createElement(Ee,null)),He.createElement(ks,null,He.createElement(be,{size:"small",appearance:r,title:x.title,subtitle:x.subtitle})),x.primaryButtonTitle&&He.createElement(Ps,{className:l("embeddedTipCallToActionContainer",r)},He.createElement(ee,{classPrefix:"embeddedTip",title:x.primaryButtonTitle,appearance:r,withMargin:!1,size:"small",type:"inline",onClick:async()=>{x.handlePrimaryButtonClick(),E(x),!(i&&i(x,h(e),"primary")===!1)&&(await f(e,x.id),await a(e))}}))))};import ge,{useEffect as td}from"react";import _t from"styled-components";var Es=_t.div`
|
|
1432
1435
|
// use the :not annotation
|
|
1433
1436
|
${e=>k(e)} {
|
|
1434
1437
|
display: flex;
|
|
@@ -1442,24 +1445,24 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1442
1445
|
border-color: ${e=>e.appearance.theme.colorPrimary};
|
|
1443
1446
|
border-radius: 12px;
|
|
1444
1447
|
}
|
|
1445
|
-
`,
|
|
1448
|
+
`,As=_t.div`
|
|
1446
1449
|
${e=>k(e)} {
|
|
1447
1450
|
display: flex;
|
|
1448
1451
|
width: 36px;
|
|
1449
1452
|
height: 36px;
|
|
1450
1453
|
}
|
|
1451
|
-
`,Is=
|
|
1454
|
+
`,Is=_t.div`
|
|
1452
1455
|
display: flex;
|
|
1453
1456
|
flex-direction: column;
|
|
1454
1457
|
flex: 1;
|
|
1455
1458
|
margin-left: ${e=>e.type==="square"?"0px":"16px"};
|
|
1456
1459
|
margin-top: ${e=>e.type==="square"?"12px":"0"};
|
|
1457
|
-
`,
|
|
1460
|
+
`,Bs=_t.div`
|
|
1458
1461
|
display: flex;
|
|
1459
1462
|
flex-direction: column;
|
|
1460
1463
|
justify-content: center;
|
|
1461
1464
|
margin-left: ${e=>e.type==="square"?"0px":"16px"};
|
|
1462
|
-
`,ir=
|
|
1465
|
+
`,ir=_t.div`
|
|
1463
1466
|
display: flex;
|
|
1464
1467
|
justify-content: ${e=>e.type==="square"?"flex-end":"center"};
|
|
1465
1468
|
align-items: flex-end;
|
|
@@ -1468,12 +1471,12 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1468
1471
|
:hover {
|
|
1469
1472
|
opacity: 0.8;
|
|
1470
1473
|
}
|
|
1471
|
-
`,nr=
|
|
1474
|
+
`,nr=_t.div`
|
|
1472
1475
|
display: flex;
|
|
1473
1476
|
justify-content: ${e=>e.type==="square"?"flex-end":"center"};
|
|
1474
1477
|
align-items: flex-end;
|
|
1475
1478
|
margin-left: ${e=>e.type==="square"?"0px":"16px"};
|
|
1476
|
-
`;import
|
|
1479
|
+
`;import Ns from"react";var Ls=({style:e,className:t})=>Ns.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"},Ns.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 od=({flowId:e,title:t,subtitle:o,onDismiss:i,customVariables:r,onButtonClick:n,appearance:s,type:p="full-width",icon:d})=>{let{getFlow:a,markFlowCompleted:f,isLoading:c,targetingLogicShouldHideFlow:u,updateCustomVariables:w,getFlowMetadata:T,getFlowStatus:S,getFlowSteps:h,getCurrentStepIndex:E}=J(),{primaryCTAClickSideEffects:y}=ne(),{mergeAppearanceWithDefault:A}=Q();if(s=A(s),td(()=>{w(r)},[r,c]),c)return null;let F=a(e);if(!F||u(F)||S(e)===X)return null;let x=h(e),m=x.length>0?x[E(e)]:T(e);return m!=null&&m.title&&(t=m.title),m!=null&&m.subtitle&&(o=m.subtitle),ge.createElement(ge.Fragment,null,ge.createElement(ie,{appearance:s}),ge.createElement(Es,{type:p,appearance:s,className:l("bannerContainer",s)},p!="square"&&ge.createElement(As,{className:l("bannerIconContainer",s)},d||ge.createElement(Ls,null)),p==="square"&&m.dismissible&&ge.createElement(nr,{type:p,className:l("bannerDismissButtonContainer",s)},ge.createElement(ir,{type:p,onClick:async()=>{await f(e),i&&i()},className:l("bannerDismissButton",s)},ge.createElement(Ee,null))),ge.createElement(Is,{type:p},ge.createElement(be,{appearance:s,title:t,subtitle:o})),ge.createElement(Bs,{type:p,className:l("bannerCallToActionContainer",s)},ge.createElement(ee,{title:(m==null?void 0:m.primaryButtonTitle)??"Get started",appearance:s,onClick:()=>{y(m),n&&n(m,0,"primary")}})),p!=="square"&&m.dismissible&&ge.createElement(nr,{type:p,className:l("bannerDismissButtonContainer",s)},ge.createElement(ir,{type:p,onClick:async()=>{await f(e),i&&i()},className:l("bannerDismissButton",s)},ge.createElement(Ee,null)))))};import Z,{useEffect as rd}from"react";import{Portal as id}from"react-portal";import Qe from"styled-components";var Os=Qe.div`
|
|
1477
1480
|
${e=>k(e)} {
|
|
1478
1481
|
display: flex;
|
|
1479
1482
|
flex-direction: column;
|
|
@@ -1494,7 +1497,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1494
1497
|
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
|
|
1495
1498
|
min-width: 550px;
|
|
1496
1499
|
}
|
|
1497
|
-
`,
|
|
1500
|
+
`,Ds=Qe.button`
|
|
1498
1501
|
border: 1px solid ${e=>e.appearance.theme.colorBorder};
|
|
1499
1502
|
border-radius: ${e=>e.appearance.theme.borderRadius}px;
|
|
1500
1503
|
// If selected make border color primary and text color color priamry
|
|
@@ -1515,30 +1518,30 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1515
1518
|
display: flex;
|
|
1516
1519
|
justify-content: center;
|
|
1517
1520
|
align-items: center;
|
|
1518
|
-
`,sr=
|
|
1521
|
+
`,sr=Qe.div`
|
|
1519
1522
|
display: flex;
|
|
1520
1523
|
justify-content: flex-end;
|
|
1521
1524
|
margin-top: 24px;
|
|
1522
1525
|
gap: 8px;
|
|
1523
|
-
|
|
1526
|
+
`,$s=Qe.div`
|
|
1524
1527
|
display: flex;
|
|
1525
1528
|
justify-content: space-between;
|
|
1526
1529
|
margin-top: 24px;
|
|
1527
|
-
`,lr=
|
|
1530
|
+
`,lr=Qe.div`
|
|
1528
1531
|
font-size: 12px;
|
|
1529
1532
|
line-height: 16px;
|
|
1530
1533
|
color: ${e=>e.appearance.theme.colorTextDisabled};
|
|
1531
|
-
`,ar=
|
|
1534
|
+
`,ar=Qe.div`
|
|
1532
1535
|
display: flex;
|
|
1533
1536
|
flex-direction: column;
|
|
1534
1537
|
flex: 1;
|
|
1535
|
-
`,
|
|
1538
|
+
`,Py=Qe.div`
|
|
1536
1539
|
display: flex;
|
|
1537
1540
|
flex-direction: column;
|
|
1538
1541
|
justify-content: center;
|
|
1539
1542
|
align-items: flex-start;
|
|
1540
1543
|
margin-top: 16px;
|
|
1541
|
-
|
|
1544
|
+
`,Ms=Qe.textarea`
|
|
1542
1545
|
${e=>k(e)} {
|
|
1543
1546
|
margin-top: 16px;
|
|
1544
1547
|
border: 1px solid ${e=>e.appearance.theme.colorBorder};
|
|
@@ -1549,7 +1552,7 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1549
1552
|
width: 100%;
|
|
1550
1553
|
height: 100px;
|
|
1551
1554
|
}
|
|
1552
|
-
`,
|
|
1555
|
+
`,Us=Qe.div`
|
|
1553
1556
|
${e=>k(e)} {
|
|
1554
1557
|
position: absolute;
|
|
1555
1558
|
top: 16px;
|
|
@@ -1560,5 +1563,5 @@ ${i=>i.inlineStyles.map(([r,n])=>`.${zt}${r}.${zt}${r} { ${Object.entries(n).map
|
|
|
1560
1563
|
opacity: 0.8;
|
|
1561
1564
|
}
|
|
1562
1565
|
}
|
|
1563
|
-
`;var
|
|
1566
|
+
`;var nd=({flowId:e,onDismiss:t,customVariables:o,onButtonClick:i,appearance:r,className:n,style:s})=>{let{getFlow:p,markFlowCompleted:d,markStepCompleted:a,getNumberOfStepsCompleted:f,isLoading:c,targetingLogicShouldHideFlow:u,updateCustomVariables:w,getFlowSteps:T,getFlowStatus:S,getCurrentStepIndex:h}=J(),{primaryCTAClickSideEffects:E}=ne(),{mergeAppearanceWithDefault:y}=Q(),[A,F]=Z.useState(null),[x,m]=Z.useState(""),{hasOpenModals:C,setKeepCompletedFlowOpenDuringSession:P,shouldKeepCompletedFlowOpenDuringSession:$}=ve();if(r=y(r),rd(()=>{w(o)},[o,c]),c)return null;let U=p(e);if(!U||u(U)||S(e)===X||f(e)===1&&!$(e)||C())return null;let I=T(e)[h(e)];function j(){return Z.createElement(Z.Fragment,null,Z.createElement(ar,null,Z.createElement(be,{size:"large",appearance:r,title:I.title,subtitle:I.subtitle})),Z.createElement(sr,{className:l("npsNumberButtonContainer",r),appearance:r},Array.from(Array(10).keys()).map(D=>Z.createElement(Ds,{className:l("npsNumberButton",r),selected:A===D+1,key:D,onClick:async()=>{P(e),F(D+1),await a(e,I.id,{score:D+1})},appearance:r},D+1))),Z.createElement($s,{appearance:r},Z.createElement(lr,{appearance:r},"Not likely at all"),Z.createElement(lr,{appearance:r},"Extremely likely")))}function B(){return Z.createElement(Z.Fragment,null,Z.createElement(ar,null,Z.createElement(be,{appearance:r,title:"Why did you choose this score?",size:"large"})),Z.createElement(Ms,{appearance:r,value:x,onChange:D=>{m(D.target.value)},placeHolder:"Add your optional fedback here..."}),Z.createElement(sr,{appearance:r,className:l("npsNumberButtonContainer",r)},Z.createElement(ee,{size:"large",withMargin:!1,onClick:async()=>{await d(e),i&&i(I,1,"primary")},appearance:r,title:I.secondaryButtonTitle||"Skip",secondary:!0}),Z.createElement(ee,{size:"large",withMargin:!1,onClick:async()=>{await a(e,I.id,{feedbackText:x}),await d(e),i&&i(I,1,"primary")},appearance:r,title:I.primaryButtonTitle||"Submit"})))}return Z.createElement(id,null,Z.createElement(ie,{appearance:r}),Z.createElement(Os,{appearance:r,className:ye(l("npsSurveyContainer",r),n),style:s},Z.createElement(Us,{onClick:async()=>{await d(e),t&&t()},className:l("npsSurveyDismissButton",r)},Z.createElement(Ee,null)),f(e)==0&&j(),f(e)==1&&B()))};export{ut as CheckBox,et as FormLabel,od as FrigadeBanner,or as FrigadeChecklist,ed as FrigadeEmbeddedTip,ri as FrigadeForm,Np as FrigadeGuide,vp as FrigadeHeroChecklist,nd as FrigadeNPSSurvey,Ip as FrigadeProgressBadge,Aa as FrigadeProvider,Zp as FrigadeSupportWidget,Kp as FrigadeTour,At as ProgressRing,ve as useFlowOpens,zt as useFlowResponses,J as useFlows,qo as useOrganization,Lo as useUser};
|
|
1564
1567
|
//# sourceMappingURL=index.mjs.map
|