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