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