@frigade/react 1.32.32 → 1.32.33
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/index.js +12 -12
- package/lib/index.js.map +1 -1
- package/lib/index.mjs +6 -6
- 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 mt,{createContext as ya,useEffect as Go,useState as Ae}from"react";import{ThemeProvider as ba}from"styled-components";import ct,{useContext as Ca,useEffect as yo,useState as jo}from"react";import{useCallback as lt,useContext as Vs,useEffect as Ks}from"react";import Io,{useMemo as Ds}from"react";var sr="1.32.32 ";var Se="https://api.frigade.com/v1/public/",Ee="NOT_STARTED_STEP",Z="COMPLETED_FLOW",oo="ABORTED_FLOW",st="STARTED_FLOW",Le="NOT_STARTED_FLOW",Ie="COMPLETED_STEP",ro="STARTED_STEP";function Oe(){let{publicApiKey:e,userId:t}=Io.useContext(K);return{config:Ds(()=>({headers:{Authorization:`Bearer ${e}`,"Content-Type":"application/json","X-Frigade-SDK-Version":sr,"X-Frigade-SDK-Platform":"React"}}),[e,t])}}function yt(){let{shouldGracefullyDegrade:e}=Io.useContext(K);return async(t,o)=>{if(e)return console.log(`Skipping ${t} call to Frigade due to error`),to();let n;try{n=await fetch(t,o)}catch(r){return to(r)}return n?n.ok?n:to(n.statusText):to()}}function to(e){return e&&console.log("Call to Frigade failed",e),{json:()=>({})}}function bt(){let{publicApiKey:e,shouldGracefullyDegrade:t}=Io.useContext(K);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 Hs,useState as lr}from"react";import{useContext as Ms,useEffect as Us,useState as _s}from"react";import Ws from"swr";import{useContext as $s}from"react";function Fe(){let{openFlowStates:e,setOpenFlowStates:t,hasActiveFullPageFlow:o,setCompletedFlowsToKeepOpenDuringSession:n,completedFlowsToKeepOpenDuringSession:r}=$s(K);function i(c,m=!1){return e[c]??m}function s(c,m){t(b=>({...b,[c]:m}))}function p(c){t(m=>{let{[c]:b,...w}=m;return{...w}})}function d(c){r.includes(c)||n(m=>[...m,c])}function l(c){return r.includes(c)}function u(){return Object.values(e).some(c=>c)||o}return{getOpenFlowState:i,setOpenFlowState:s,resetOpenFlowState:p,hasOpenModals:u,setKeepCompletedFlowOpenDuringSession:d,shouldKeepCompletedFlowOpenDuringSession:l}}var zs="unknown";function Be(){let{config:e}=Oe(),{publicApiKey:t,userId:o,flows:n,setShouldGracefullyDegrade:r}=Ms(K),{resetOpenFlowState:i}=Fe(),[s,p]=_s(!1),d={data:n.map(k=>({flowId:k.id,flowState:Z,lastStepId:null,userId:o,foreignUserId:o,stepStates:{},shouldTrigger:!1}))},l=k=>fetch(k,e).then(g=>{if(g.ok)return g.json();throw new Error("Failed to fetch user flow states")}).catch(g=>(console.log(`Error fetching ${k}: ${g}. Will gracefully degrade and hide Frigade`),r(!0),d)),{data:u,isLoading:c,mutate:m,error:b}=Ws(t&&n&&o?`${Se}userFlowStates?foreignUserId=${encodeURIComponent(o)}`:null,l,{keepPreviousData:!0,errorRetryInterval:1e4,errorRetryCount:3,onError:()=>d,onLoadingSlow:()=>d}),w=u==null?void 0:u.data;Us(()=>{!s&&!c&&w&&p(!0)},[w,s,c]);async function S(k){if(w){let g=w.find(x=>x.flowId===k);g&&g.flowState!==Z&&(g.flowState=Z),await m(Promise.resolve({...u,data:w}),{optimisticData:{...u,data:w},revalidate:!1,rollbackOnError:!1})}}async function f(k,g,x){if(w){let C=w.find(v=>v.flowId===k);C&&(C.stepStates[g]=x,C.flowState=st),await m(Promise.resolve({...u,data:w}),{optimisticData:{...u,data:w},revalidate:!1,rollbackOnError:!1})}}async function P(k,g,x){if(w){let C=w.find(v=>v.flowId===k);C&&(C.lastStepId=g,C.stepStates[g]=x,C.flowState=st),await m({...u,data:w},{optimisticData:{...u,data:w},revalidate:!1,rollbackOnError:!1})}}async function T(k){if(w){let g=w.find(x=>x.flowId===k);g&&g.flowState!==Le&&(g.flowState=Le,g.lastStepId=zs,Object.keys(g.stepStates).forEach(x=>{g.stepStates[x].actionType=Ee,g.stepStates[x].createdAt=new Date().toISOString()}),await m({...u,data:w},{optimisticData:{...u,data:w},revalidate:!1,rollbackOnError:!1}),i(k))}}async function B(k,g){if(w){let x=w.find(C=>C.flowId===k);x&&x.stepStates[g]!==Ee&&(x.stepStates[g]=Ee),await m({...u,data:w},{optimisticData:{...u,data:w},revalidate:!1,rollbackOnError:!1})}}return{userFlowStatesData:w,isLoadingUserFlowStateData:!s,mutateUserFlowState:m,optimisticallyMarkFlowCompleted:S,optimisticallyMarkFlowNotStarted:T,optimisticallyMarkStepCompleted:f,optimisticallyMarkStepNotStarted:B,optimisticallyMarkStepStarted:P,error:b}}function _t(){let{config:e}=Oe(),{userFlowStatesData:t,mutateUserFlowState:o}=Be(),{failedFlowResponses:n,setFailedFlowResponses:r,flowResponses:i,setFlowResponses:s}=Hs(K),[p,d]=lr(new Set),[l,u]=lr(new Set),c=yt();function m(S){let f=JSON.stringify(S);if(p.has(f))return null;p.add(f),d(p),l.add(S),u(l);let P=i==null?void 0:i.find(T=>T.flowSlug===S.flowSlug&&T.stepId===S.stepId&&T.actionType===S.actionType&&T.createdAt===S.createdAt);return c(`${Se}flowResponses`,{...e,method:"POST",body:f}).then(T=>{T.status!==200&&T.status!==201?(console.log("Failed to send flow response for step "+S.stepId+". Will retry again later."),r([...n,S])):P||s(B=>[...B??[],S])})}async function b(S){S.foreignUserId&&(S.actionType===st||S.actionType===Le?await m(S):S.actionType===Z?await m(S):S.actionType===ro?await m(S):S.actionType===Ie?await m(S):S.actionType===oo?await m(S):S.actionType===Ee&&await m(S))}function w(){let S=[];return t==null||t.forEach(f=>{if(f&&f.stepStates&&Object.keys(f.stepStates).length!==0)for(let P in f.stepStates){let T=f.stepStates[P];S.push({foreignUserId:f.foreignUserId,flowSlug:f.flowId,stepId:T.stepId,actionType:T.actionType,data:{},createdAt:new Date(T.createdAt),blocked:T.blocked,hidden:T.hidden})}}),[...S,...i]}return{addResponse:b,setFlowResponses:s,getFlowResponses:w}}import qs from"swr";var js=/user.flow\(([^\)]+)\) == '?COMPLETED_FLOW'?/gm,ar=e=>{let t=js.exec(e);if(t===null)return null;let o=null;return t.forEach((n,r)=>{let i=Gs(n,"'","");i.startsWith("flow_")&&(o=i)}),o},Gs=function(e,t,o){return e.replace(new RegExp(t,"g"),o)};function X(){let{config:e}=Oe(),{flows:t,setFlows:o,userId:n,publicApiKey:r,customVariables:i,setCustomVariables:s,hasActiveFullPageFlow:p,setHasActiveFullPageFlow:d,setFlowResponses:l,setShouldGracefullyDegrade:u}=Vs(K),c={data:[]},{verifySDKInitiated:m}=bt(),{addResponse:b,getFlowResponses:w}=_t(),S=h=>fetch(h,e).then(y=>y.ok?y.json():(console.log(`Error fetching ${h} (${y.status}): ${y.statusText}. .Will gracefully degrade and hide Frigade`),u(!0),c)).catch(y=>(console.log(`Error fetching ${h}: ${y}. Will gracefully degrade and hide Frigade`),u(!0),c)),{userFlowStatesData:f,isLoadingUserFlowStateData:P,optimisticallyMarkFlowCompleted:T,optimisticallyMarkFlowNotStarted:B,optimisticallyMarkStepCompleted:k,optimisticallyMarkStepNotStarted:g,optimisticallyMarkStepStarted:x}=Be(),{data:C,error:v,isLoading:M}=qs(r?`${Se}flows`:null,S,{keepPreviousData:!0});Ks(()=>{if(v){console.error(v);return}C&&C.data&&(C.data=o(C.data))},[C,v]);function $(h){if(M)return null;let y=t.find(E=>E.slug===h);return!y&&t.length>0&&!P&&!M?(console.log(`Flow with slug ${h} not found`),null):(y==null?void 0:y.active)===!1?null:y}function U(h){var j;if(!$(h))return[];let y=$(h).data;return y?(y=A(y),(((j=JSON.parse(y))==null?void 0:j.data)??[]).map(le=>{let z=Te(le);return{handleSecondaryButtonClick:()=>{le.skippable===!0&&W(h,le.id,{skipped:!0})},...le,complete:N(h,le.id)===Ie||z>=1,blocked:V(h,le.id),hidden:we(h,le.id),handlePrimaryButtonClick:()=>{(!le.completionCriteria&&(le.autoMarkCompleted||le.autoMarkCompleted===void 0)||le.completionCriteria&&le.autoMarkCompleted===!0)&&W(h,le.id)},progress:z}}).filter(le=>le.hidden!==!0)):[]}function A(h){return h.replace(/\${(.*?)}/g,(y,E)=>i[E]!==void 0?String(i[E]):"")}function H(h){if(!$(h))return[];let y=$(h).data;return y?(y=A(y),JSON.parse(y)??{}):[]}function I(h,y){s(E=>({...E,[h]:y}))}function _(h){!P&&!M&&h&&JSON.stringify(i)!=JSON.stringify({...i,...h})&&Object.keys(h).forEach(y=>{I(y,h[y])})}let te=lt(async(h,y,E)=>{m();let j={foreignUserId:n,flowSlug:h,stepId:y,actionType:ro,data:E??{},createdAt:new Date,blocked:!1,hidden:!1};oe(j)&&(await x(h,y,j),b(j))},[n,f]),q=lt(async(h,y,E)=>{m();let j={foreignUserId:n,flowSlug:h,stepId:y,actionType:Ee,data:E??{},createdAt:new Date,blocked:!1,hidden:!1};oe(j)&&(await g(h,y),b(j))},[n,f]),W=lt(async(h,y,E)=>{console.log("markStepCompleted",h,y,E),m();let j={foreignUserId:n,flowSlug:h,stepId:y,actionType:Ie,data:E??{},createdAt:new Date,blocked:!1,hidden:!1};oe(j)&&(await k(h,y,j),b(j))},[n,f]),be=lt(async(h,y)=>{m();let E={foreignUserId:n,flowSlug:h,stepId:"unknown",actionType:Le,data:y??{},createdAt:new Date,blocked:!1,hidden:!1};await B(h),oe(E)&&b(E)},[n,f]),ce=lt(async(h,y)=>{m();let E={foreignUserId:n,flowSlug:h,stepId:"unknown",actionType:st,data:y??{},createdAt:new Date,blocked:!1,hidden:!1};oe(E)&&b(E)},[n,f]),G=lt(async(h,y)=>{m();let E={foreignUserId:n,flowSlug:h,stepId:"unknown",actionType:Z,data:y??{},createdAt:new Date,blocked:!1,hidden:!1};oe(E)&&(await T(h),b(E))},[n,f]),L=lt(async(h,y)=>{m();let E={foreignUserId:n,flowSlug:h,stepId:"unknown",actionType:oo,data:y??{},createdAt:new Date,blocked:!1,hidden:!1};oe(E)&&(await T(h),b(E))},[n,f]);function oe(h){var y;if(!f&&h.actionType===Ee)return!1;if(f){let E=f.find(j=>j.flowId===h.flowSlug);if(h.actionType===Ee&&(!(E!=null&&E.stepStates[h.stepId])||E.stepStates[h.stepId].actionType===Ee)||E&&((y=E.stepStates[h.stepId])==null?void 0:y.actionType)===h.actionType)return!1}return!0}function N(h,y){let E=ve(h,y);return P?null:E?E.actionType:Ee}function V(h,y){let E=ve(h,y);return E?E.blocked:!1}function we(h,y){let E=ve(h,y);return E?E.hidden:!1}function ve(h,y){if(P)return null;let E=f==null?void 0:f.find(j=>j.flowId===h);return!E||!E.stepStates[y]?null:E.stepStates[y]??null}function St(h){var E;if(P||!f)return null;if(me(h)===Le)return U(h)[0]??null;let y=(E=f.find(j=>j.flowId===h))==null?void 0:E.lastStepId;return y?U(h).find(j=>j.id===y):null}function rt(h){let y=St(h);if(!y)return 0;let E=U(h).findIndex(j=>j.id===y.id)??0;return N(h,y.id)===Ie&&E<U(h).length-1?E+1:E}function Te(h){if(!h.completionCriteria)return;let y=ar(h.completionCriteria);if(y===null)return;let E=ze(y),j=He(y);return j===0?void 0:E/j}function me(h){let y=f==null?void 0:f.find(E=>E.flowId===h);return y?y.flowState:null}function ze(h){let y=U(h);return y.length===0?0:y.filter(j=>N(h,j.id)===Ie).length}function He(h){return U(h).length}function Y(h){return JSON.parse(t.find(y=>y.slug===h).data)}function fe(h){if(P)return!0;if(h!=null&&h.targetingLogic&&f){let y=f.find(E=>E.flowId===h.slug);if(y)return y.shouldTrigger===!1}return!!(h!=null&&h.targetingLogic&&n&&n.startsWith("guest_"))}function it(h){return!fe($(h))}return{getFlow:$,getFlowData:Y,isLoading:P||M,getStepStatus:N,getFlowSteps:U,getCurrentStepIndex:rt,markStepStarted:te,markStepCompleted:W,markFlowNotStarted:be,markFlowStarted:ce,markFlowCompleted:G,markFlowAborted:L,markStepNotStarted:q,getFlowStatus:me,getNumberOfStepsCompleted:ze,getNumberOfSteps:He,targetingLogicShouldHideFlow:fe,setCustomVariable:I,updateCustomVariables:_,customVariables:i,getStepOptionalProgress:Te,getFlowMetadata:H,isStepBlocked:V,isStepHidden:we,hasActiveFullPageFlow:p,setHasActiveFullPageFlow:d,isFlowAvailableToUser:it}}import{useCallback as pr,useContext as Ys,useEffect as Xs}from"react";var wt="guest_";function No(){let{userId:e,organizationId:t,setUserId:o,setUserProperties:n,shouldGracefullyDegrade:r}=Ys(K),{config:i}=Oe(),{mutateUserFlowState:s}=Be(),p=yt(),{verifySDKInitiated:d}=bt();Xs(()=>{if(e&&!t){if(e.startsWith(wt))return;let c=`frigade-user-registered-${e}`;localStorage.getItem(c)||(p(`${Se}users`,{...i,method:"POST",body:JSON.stringify({foreignId:e})}),localStorage.setItem(c,"true"))}},[e,r,t]);let l=pr(async c=>{d();let m={foreignId:e,properties:c};await p(`${Se}users`,{...i,method:"POST",body:JSON.stringify(m)}),n(b=>({...b,...c})),s()},[e,i,r,s]),u=pr(async(c,m)=>{d();let w={foreignId:e,events:[{event:c,properties:m}]};await p(`${Se}users`,{...i,method:"POST",body:JSON.stringify(w)}),s()},[e,i,s]);return{userId:e,setUserId:o,addPropertiesToUser:l,trackEventForUser:u}}import{v4 as Sa}from"uuid";import $e,{useEffect as fa,useState as ga}from"react";import je,{useEffect as tl}from"react";import no from"styled-components";import Js from"react";import Qs from"styled-components";var dr="fr-",Wt="cfr-";function a(e,t){let o=`${dr}${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+" "+Wt+e}return o}function F(e){if(!e.className||e.className.indexOf(Wt)!==-1)return"";let o=e.className.replace(/\s+/g," ").split(" ");return o.length==1&&o[0].startsWith(dr)?"":`:not(${o.map(n=>`.${n}`).join(", ")})`}function Lo(e){return e.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g,"$1-$2").toLowerCase()}function at(e){return e!=null&&e.styleOverrides?Object.keys(e.styleOverrides).map(t=>`${Lo(t)}: ${e.styleOverrides[t]};`).join(" "):""}function ge(...e){return e.filter(Boolean).join(" ")}function cr(e){return e.charAt(0).toUpperCase()+e.slice(1)}var Zs=Qs.div`
|
|
2
|
+
import mt,{createContext as ya,useEffect as Go,useState as Ae}from"react";import{ThemeProvider as ba}from"styled-components";import ct,{useContext as Ca,useEffect as yo,useState as jo}from"react";import{useCallback as lt,useContext as Vs,useEffect as Ks}from"react";import Io,{useMemo as Ds}from"react";var sr="1.32.33 ";var Se="https://api.frigade.com/v1/public/",Ee="NOT_STARTED_STEP",Z="COMPLETED_FLOW",oo="ABORTED_FLOW",st="STARTED_FLOW",Ie="NOT_STARTED_FLOW",Ne="COMPLETED_STEP",ro="STARTED_STEP";function Oe(){let{publicApiKey:e,userId:t}=Io.useContext(K);return{config:Ds(()=>({headers:{Authorization:`Bearer ${e}`,"Content-Type":"application/json","X-Frigade-SDK-Version":sr,"X-Frigade-SDK-Platform":"React"}}),[e,t])}}function yt(){let{shouldGracefullyDegrade:e}=Io.useContext(K);return async(t,o)=>{if(e)return console.log(`Skipping ${t} call to Frigade due to error`),to();let n;try{n=await fetch(t,o)}catch(r){return to(r)}return n?n.ok?n:to(n.statusText):to()}}function to(e){return e&&console.log("Call to Frigade failed",e),{json:()=>({})}}function bt(){let{publicApiKey:e,shouldGracefullyDegrade:t}=Io.useContext(K);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 Hs,useState as lr}from"react";import{useContext as Ms,useEffect as Us,useState as _s}from"react";import Ws from"swr";import{useContext as $s}from"react";function Fe(){let{openFlowStates:e,setOpenFlowStates:t,hasActiveFullPageFlow:o,setCompletedFlowsToKeepOpenDuringSession:n,completedFlowsToKeepOpenDuringSession:r}=$s(K);function i(c,m=!1){return e[c]??m}function s(c,m){t(b=>({...b,[c]:m}))}function p(c){t(m=>{let{[c]:b,...w}=m;return{...w}})}function d(c){r.includes(c)||n(m=>[...m,c])}function l(c){return r.includes(c)}function u(){return Object.values(e).some(c=>c)||o}return{getOpenFlowState:i,setOpenFlowState:s,resetOpenFlowState:p,hasOpenModals:u,setKeepCompletedFlowOpenDuringSession:d,shouldKeepCompletedFlowOpenDuringSession:l}}var zs="unknown";function Be(){let{config:e}=Oe(),{publicApiKey:t,userId:o,flows:n,setShouldGracefullyDegrade:r}=Ms(K),{resetOpenFlowState:i}=Fe(),[s,p]=_s(!1),d={data:n.map(k=>({flowId:k.id,flowState:Z,lastStepId:null,userId:o,foreignUserId:o,stepStates:{},shouldTrigger:!1}))},l=k=>fetch(k,e).then(g=>{if(g.ok)return g.json();throw new Error("Failed to fetch user flow states")}).catch(g=>(console.log(`Error fetching ${k}: ${g}. Will gracefully degrade and hide Frigade`),r(!0),d)),{data:u,isLoading:c,mutate:m,error:b}=Ws(t&&n&&o?`${Se}userFlowStates?foreignUserId=${encodeURIComponent(o)}`:null,l,{keepPreviousData:!0,errorRetryInterval:1e4,errorRetryCount:3,onError:()=>d,onLoadingSlow:()=>d}),w=u==null?void 0:u.data;Us(()=>{!s&&!c&&w&&p(!0)},[w,s,c]);async function S(k){if(w){let g=w.find(x=>x.flowId===k);g&&g.flowState!==Z&&(g.flowState=Z),await m(Promise.resolve({...u,data:w}),{optimisticData:{...u,data:w},revalidate:!1,rollbackOnError:!1})}}async function f(k,g,x){if(w){let C=w.find(v=>v.flowId===k);C&&(C.stepStates[g]=x,C.flowState=st),await m(Promise.resolve({...u,data:w}),{optimisticData:{...u,data:w},revalidate:!1,rollbackOnError:!1})}}async function P(k,g,x){if(w){let C=w.find(v=>v.flowId===k);C&&(C.lastStepId=g,C.stepStates[g]=x,C.flowState=st),await m({...u,data:w},{optimisticData:{...u,data:w},revalidate:!1,rollbackOnError:!1})}}async function T(k){if(w){let g=w.find(x=>x.flowId===k);g&&g.flowState!==Ie&&(g.flowState=Ie,g.lastStepId=zs,Object.keys(g.stepStates).forEach(x=>{g.stepStates[x].actionType=Ee,g.stepStates[x].createdAt=new Date().toISOString()}),await m({...u,data:w},{optimisticData:{...u,data:w},revalidate:!1,rollbackOnError:!1}),i(k))}}async function B(k,g){if(w){let x=w.find(C=>C.flowId===k);x&&x.stepStates[g]!==Ee&&(x.stepStates[g]=Ee),await m({...u,data:w},{optimisticData:{...u,data:w},revalidate:!1,rollbackOnError:!1})}}return{userFlowStatesData:w,isLoadingUserFlowStateData:!s,mutateUserFlowState:m,optimisticallyMarkFlowCompleted:S,optimisticallyMarkFlowNotStarted:T,optimisticallyMarkStepCompleted:f,optimisticallyMarkStepNotStarted:B,optimisticallyMarkStepStarted:P,error:b}}function _t(){let{config:e}=Oe(),{userFlowStatesData:t,mutateUserFlowState:o}=Be(),{failedFlowResponses:n,setFailedFlowResponses:r,flowResponses:i,setFlowResponses:s}=Hs(K),[p,d]=lr(new Set),[l,u]=lr(new Set),c=yt();function m(S){let f=JSON.stringify(S);if(p.has(f))return null;p.add(f),d(p),l.add(S),u(l);let P=i==null?void 0:i.find(T=>T.flowSlug===S.flowSlug&&T.stepId===S.stepId&&T.actionType===S.actionType&&T.createdAt===S.createdAt);return c(`${Se}flowResponses`,{...e,method:"POST",body:f}).then(T=>{T.status!==200&&T.status!==201?(console.log("Failed to send flow response for step "+S.stepId+". Will retry again later."),r([...n,S])):P||s(B=>[...B??[],S])})}async function b(S){S.foreignUserId&&(S.actionType===st||S.actionType===Ie?await m(S):S.actionType===Z?await m(S):S.actionType===ro?await m(S):S.actionType===Ne?await m(S):S.actionType===oo?await m(S):S.actionType===Ee&&await m(S))}function w(){let S=[];return t==null||t.forEach(f=>{if(f&&f.stepStates&&Object.keys(f.stepStates).length!==0)for(let P in f.stepStates){let T=f.stepStates[P];S.push({foreignUserId:f.foreignUserId,flowSlug:f.flowId,stepId:T.stepId,actionType:T.actionType,data:{},createdAt:new Date(T.createdAt),blocked:T.blocked,hidden:T.hidden})}}),[...S,...i]}return{addResponse:b,setFlowResponses:s,getFlowResponses:w}}import qs from"swr";var js=/user.flow\(([^\)]+)\) == '?COMPLETED_FLOW'?/gm,ar=e=>{let t=js.exec(e);if(t===null)return null;let o=null;return t.forEach((n,r)=>{let i=Gs(n,"'","");i.startsWith("flow_")&&(o=i)}),o},Gs=function(e,t,o){return e.replace(new RegExp(t,"g"),o)};function X(){let{config:e}=Oe(),{flows:t,setFlows:o,userId:n,publicApiKey:r,customVariables:i,setCustomVariables:s,hasActiveFullPageFlow:p,setHasActiveFullPageFlow:d,setFlowResponses:l,setShouldGracefullyDegrade:u}=Vs(K),c={data:[]},{verifySDKInitiated:m}=bt(),{addResponse:b,getFlowResponses:w}=_t(),S=h=>fetch(h,e).then(y=>y.ok?y.json():(console.log(`Error fetching ${h} (${y.status}): ${y.statusText}. .Will gracefully degrade and hide Frigade`),u(!0),c)).catch(y=>(console.log(`Error fetching ${h}: ${y}. Will gracefully degrade and hide Frigade`),u(!0),c)),{userFlowStatesData:f,isLoadingUserFlowStateData:P,optimisticallyMarkFlowCompleted:T,optimisticallyMarkFlowNotStarted:B,optimisticallyMarkStepCompleted:k,optimisticallyMarkStepNotStarted:g,optimisticallyMarkStepStarted:x}=Be(),{data:C,error:v,isLoading:M}=qs(r?`${Se}flows`:null,S,{keepPreviousData:!0});Ks(()=>{if(v){console.error(v);return}C&&C.data&&(C.data=o(C.data))},[C,v]);function $(h){if(M)return null;let y=t.find(E=>E.slug===h);return!y&&t.length>0&&!P&&!M?(console.log(`Flow with slug ${h} not found`),null):(y==null?void 0:y.active)===!1?null:y}function U(h){var j;if(!$(h))return[];let y=$(h).data;return y?(y=A(y),(((j=JSON.parse(y))==null?void 0:j.data)??[]).map(le=>{let z=Te(le);return{handleSecondaryButtonClick:()=>{le.skippable===!0&&W(h,le.id,{skipped:!0})},...le,complete:N(h,le.id)===Ne||z>=1,blocked:V(h,le.id),hidden:we(h,le.id),handlePrimaryButtonClick:()=>{(!le.completionCriteria&&(le.autoMarkCompleted||le.autoMarkCompleted===void 0)||le.completionCriteria&&le.autoMarkCompleted===!0)&&W(h,le.id)},progress:z}}).filter(le=>le.hidden!==!0)):[]}function A(h){return h.replace(/\${(.*?)}/g,(y,E)=>i[E]!==void 0?String(i[E]):"")}function H(h){if(!$(h))return[];let y=$(h).data;return y?(y=A(y),JSON.parse(y)??{}):[]}function I(h,y){s(E=>({...E,[h]:y}))}function _(h){!P&&!M&&h&&JSON.stringify(i)!=JSON.stringify({...i,...h})&&Object.keys(h).forEach(y=>{I(y,h[y])})}let te=lt(async(h,y,E)=>{m();let j={foreignUserId:n,flowSlug:h,stepId:y,actionType:ro,data:E??{},createdAt:new Date,blocked:!1,hidden:!1};oe(j)&&(await x(h,y,j),b(j))},[n,f]),q=lt(async(h,y,E)=>{m();let j={foreignUserId:n,flowSlug:h,stepId:y,actionType:Ee,data:E??{},createdAt:new Date,blocked:!1,hidden:!1};oe(j)&&(await g(h,y),b(j))},[n,f]),W=lt(async(h,y,E)=>{console.log("markStepCompleted",h,y,E),m();let j={foreignUserId:n,flowSlug:h,stepId:y,actionType:Ne,data:E??{},createdAt:new Date,blocked:!1,hidden:!1};oe(j)&&(await k(h,y,j),b(j))},[n,f]),be=lt(async(h,y)=>{if(m(),ce(h)===Ie)return;let E={foreignUserId:n,flowSlug:h,stepId:"unknown",actionType:Ie,data:y??{},createdAt:new Date,blocked:!1,hidden:!1};await B(h),oe(E)&&b(E)},[n,f]),me=lt(async(h,y)=>{m();let E={foreignUserId:n,flowSlug:h,stepId:"unknown",actionType:st,data:y??{},createdAt:new Date,blocked:!1,hidden:!1};oe(E)&&b(E)},[n,f]),G=lt(async(h,y)=>{m();let E={foreignUserId:n,flowSlug:h,stepId:"unknown",actionType:Z,data:y??{},createdAt:new Date,blocked:!1,hidden:!1};oe(E)&&(await T(h),b(E))},[n,f]),L=lt(async(h,y)=>{m();let E={foreignUserId:n,flowSlug:h,stepId:"unknown",actionType:oo,data:y??{},createdAt:new Date,blocked:!1,hidden:!1};oe(E)&&(await T(h),b(E))},[n,f]);function oe(h){var y;if(!f&&h.actionType===Ee)return!1;if(f){let E=f.find(j=>j.flowId===h.flowSlug);if(h.actionType===Ee&&(!(E!=null&&E.stepStates[h.stepId])||E.stepStates[h.stepId].actionType===Ee)||E&&((y=E.stepStates[h.stepId])==null?void 0:y.actionType)===h.actionType)return!1}return!0}function N(h,y){let E=ve(h,y);return P?null:E?E.actionType:Ee}function V(h,y){let E=ve(h,y);return E?E.blocked:!1}function we(h,y){let E=ve(h,y);return E?E.hidden:!1}function ve(h,y){if(P)return null;let E=f==null?void 0:f.find(j=>j.flowId===h);return!E||!E.stepStates[y]?null:E.stepStates[y]??null}function St(h){var E;if(P||!f)return null;if(ce(h)===Ie)return U(h)[0]??null;let y=(E=f.find(j=>j.flowId===h))==null?void 0:E.lastStepId;return y?U(h).find(j=>j.id===y):null}function rt(h){let y=St(h);if(!y)return 0;let E=U(h).findIndex(j=>j.id===y.id)??0;return N(h,y.id)===Ne&&E<U(h).length-1?E+1:E}function Te(h){if(!h.completionCriteria)return;let y=ar(h.completionCriteria);if(y===null)return;let E=ze(y),j=He(y);return j===0?void 0:E/j}function ce(h){let y=f==null?void 0:f.find(E=>E.flowId===h);return y?y.flowState:null}function ze(h){let y=U(h);return y.length===0?0:y.filter(j=>N(h,j.id)===Ne).length}function He(h){return U(h).length}function Y(h){return JSON.parse(t.find(y=>y.slug===h).data)}function fe(h){if(P)return!0;if(h!=null&&h.targetingLogic&&f){let y=f.find(E=>E.flowId===h.slug);if(y)return y.shouldTrigger===!1}return!!(h!=null&&h.targetingLogic&&n&&n.startsWith("guest_"))}function it(h){return!fe($(h))}return{getFlow:$,getFlowData:Y,isLoading:P||M,getStepStatus:N,getFlowSteps:U,getCurrentStepIndex:rt,markStepStarted:te,markStepCompleted:W,markFlowNotStarted:be,markFlowStarted:me,markFlowCompleted:G,markFlowAborted:L,markStepNotStarted:q,getFlowStatus:ce,getNumberOfStepsCompleted:ze,getNumberOfSteps:He,targetingLogicShouldHideFlow:fe,setCustomVariable:I,updateCustomVariables:_,customVariables:i,getStepOptionalProgress:Te,getFlowMetadata:H,isStepBlocked:V,isStepHidden:we,hasActiveFullPageFlow:p,setHasActiveFullPageFlow:d,isFlowAvailableToUser:it}}import{useCallback as pr,useContext as Ys,useEffect as Xs}from"react";var wt="guest_";function No(){let{userId:e,organizationId:t,setUserId:o,setUserProperties:n,shouldGracefullyDegrade:r}=Ys(K),{config:i}=Oe(),{mutateUserFlowState:s}=Be(),p=yt(),{verifySDKInitiated:d}=bt();Xs(()=>{if(e&&!t){if(e.startsWith(wt))return;let c=`frigade-user-registered-${e}`;localStorage.getItem(c)||(p(`${Se}users`,{...i,method:"POST",body:JSON.stringify({foreignId:e})}),localStorage.setItem(c,"true"))}},[e,r,t]);let l=pr(async c=>{d();let m={foreignId:e,properties:c};await p(`${Se}users`,{...i,method:"POST",body:JSON.stringify(m)}),n(b=>({...b,...c})),s()},[e,i,r,s]),u=pr(async(c,m)=>{d();let w={foreignId:e,events:[{event:c,properties:m}]};await p(`${Se}users`,{...i,method:"POST",body:JSON.stringify(w)}),s()},[e,i,s]);return{userId:e,setUserId:o,addPropertiesToUser:l,trackEventForUser:u}}import{v4 as Sa}from"uuid";import $e,{useEffect as fa,useState as ga}from"react";import je,{useEffect as tl}from"react";import no from"styled-components";import Js from"react";import Qs from"styled-components";var dr="fr-",Wt="cfr-";function a(e,t){let o=`${dr}${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+" "+Wt+e}return o}function F(e){if(!e.className||e.className.indexOf(Wt)!==-1)return"";let o=e.className.replace(/\s+/g," ").split(" ");return o.length==1&&o[0].startsWith(dr)?"":`:not(${o.map(n=>`.${n}`).join(", ")})`}function Lo(e){return e.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g,"$1-$2").toLowerCase()}function at(e){return e!=null&&e.styleOverrides?Object.keys(e.styleOverrides).map(t=>`${Lo(t)}: ${e.styleOverrides[t]};`).join(" "):""}function ge(...e){return e.filter(Boolean).join(" ")}function cr(e){return e.charAt(0).toUpperCase()+e.slice(1)}var Zs=Qs.div`
|
|
3
3
|
display: flex;
|
|
4
4
|
justify-content: center;
|
|
5
5
|
position: fixed;
|
|
@@ -520,8 +520,8 @@ import mt,{createContext as ya,useEffect as Go,useState as Ae}from"react";import
|
|
|
520
520
|
color: ${e=>{var t,o;return(o=(t=e.appearance)==null?void 0:t.theme)==null?void 0:o.colorText}};
|
|
521
521
|
display: flex;
|
|
522
522
|
align-self: center;
|
|
523
|
-
`;var Zr=({stepData:e,setCanContinue:t,onSaveData:o,appearance:n})=>{let r=e.props,[i,s]=Wo([]),[p,d]=Wo(!1),[l,u]=Wo(e.id);return _o(()=>{i.length==0&&!p&&(d(!0),o({choice:[]}))},[p]),_o(()=>{l!==e.id&&(u(e.id),s([]))},[e]),_o(()=>{o({choice:i}),i.length>=r.minChoices?t(!0):t(!1)},[i]),Ge.createElement(Gr,{className:a("selectListContainer",n)},Ge.createElement(Vr,null,Ge.createElement(Kr,{className:a("selectListTitle",n)},e.title),Ge.createElement(qr,{appearance:n,className:a("selectListSubtitle",n)},e.subtitle)),r.options.map((c,m)=>{let b=i.includes(c.id);return Ge.createElement(Yr,{key:`select-item-${m}`,onClick:()=>{if(i.includes(c.id)){s(i.filter(w=>w!==c.id));return}i.length<r.maxChoices?s([...i,c.id]):i.length==1&&r.maxChoices==1&&s([c.id])},hideBottomBorder:m===r.options.length-1,className:a("selectListSelectItem",n)},Ge.createElement(Xr,{className:a("selectListItemImage",n)},c.imageUri&&Ge.createElement(Jr,{src:c.imageUri,alt:`select-icon-${m}`}),Ge.createElement(Qr,{appearance:n,className:a("selectListSelectItemText",n)},c.title)),Ge.createElement(dt,{appearance:n,value:b,primaryColor:n.theme.colorPrimary}))}))};import xe,{useEffect as pa,useState as zo}from"react";import{AnimatePresence as da,motion as ca}from"framer-motion";var ma=({children:e,id:t,shouldWrap:o=!1})=>xe.createElement(xe.Fragment,null,o?xe.createElement(da,{initial:!1},xe.createElement(ca.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),So=({appearance:e,steps:t,selectedStep:o,customStepTypes:n,customVariables:r,onButtonClick:i,onStepCompletion:s,flowId:p,type:d,hideOnFlowCompletion:l,onComplete:u,setVisible:c,setShowModal:m,onDismiss:b,showPagination:w=!1,customFormElements:S,allowBackNavigation:f})=>{let T={...{linkCollection:zr,multiInput:Ir,callToAction:Hr,selectList:Zr},...n},{primaryCTAClickSideEffects:B,secondaryCTAClickSideEffects:k}=re(),[g,x]=zo(!1),[C,v]=zo({}),[M,$]=zo(!1),U=t[o]??null,{markStepCompleted:A,markStepStarted:H,isLoading:I,updateCustomVariables:_,markFlowCompleted:te}=X();pa(()=>{_(r)},[r,I]);function q(){return{data:C[t[o].id]??{},stepId:t[o].id,customVariables:r}}function W(L,oe,N){let V=o+1<t.length?t[o+1]:null;i&&i(L,o,oe,V),s&&s(L,N,V,C,q())}function be(L,oe){v(N=>{let V={};return V[L.id]=oe,{...N,...V}})}function
|
|
524
|
-
${n=>n.inlineStyles.map(([r,i])=>`.${Wt}${r}.${Wt}${r} { ${Object.entries(i).map(([s,p])=>`${Lo(s)}: ${p};`).join(" ")} }`).join(" ")}`;return Vt.createElement(o,{inlineStyles:t})}var Rr=({flowId:e,customStepTypes:t={},type:o="inline",visible:n,setVisible:r,customVariables:i,customFormElements:s,onComplete:p,appearance:d,hideOnFlowCompletion:l=!0,onStepCompletion:u,onButtonClick:c,dismissible:m=!0,endFlowOnDismiss:b=!1,modalPosition:w="center",repeatable:S=!1,onDismiss:f,showPagination:P=!1,allowBackNavigation:T=!1})=>{let{getFlow:B,getFlowSteps:k,isLoading:g,targetingLogicShouldHideFlow:x,getFlowStatus:C,getCurrentStepIndex:v,markFlowCompleted:M,markFlowNotStarted:$}=X(),U=v(e),{mergeAppearanceWithDefault:A}=J(),[H,I]=ga(!1),{setOpenFlowState:_,getOpenFlowState:te}=Fe();d=A(d);let[q,W]=n!==void 0&&r!==void 0?[n,r]:[te(e,!0),L=>_(e,L)];if(fa(()=>{!H&&!g&&(I(!0),C(e)===Z&&S&&$(e),I(!0))},[H,I,g]),g)return null;let be=B(e);if(!be||x(be))return null;let
|
|
523
|
+
`;var Zr=({stepData:e,setCanContinue:t,onSaveData:o,appearance:n})=>{let r=e.props,[i,s]=Wo([]),[p,d]=Wo(!1),[l,u]=Wo(e.id);return _o(()=>{i.length==0&&!p&&(d(!0),o({choice:[]}))},[p]),_o(()=>{l!==e.id&&(u(e.id),s([]))},[e]),_o(()=>{o({choice:i}),i.length>=r.minChoices?t(!0):t(!1)},[i]),Ge.createElement(Gr,{className:a("selectListContainer",n)},Ge.createElement(Vr,null,Ge.createElement(Kr,{className:a("selectListTitle",n)},e.title),Ge.createElement(qr,{appearance:n,className:a("selectListSubtitle",n)},e.subtitle)),r.options.map((c,m)=>{let b=i.includes(c.id);return Ge.createElement(Yr,{key:`select-item-${m}`,onClick:()=>{if(i.includes(c.id)){s(i.filter(w=>w!==c.id));return}i.length<r.maxChoices?s([...i,c.id]):i.length==1&&r.maxChoices==1&&s([c.id])},hideBottomBorder:m===r.options.length-1,className:a("selectListSelectItem",n)},Ge.createElement(Xr,{className:a("selectListItemImage",n)},c.imageUri&&Ge.createElement(Jr,{src:c.imageUri,alt:`select-icon-${m}`}),Ge.createElement(Qr,{appearance:n,className:a("selectListSelectItemText",n)},c.title)),Ge.createElement(dt,{appearance:n,value:b,primaryColor:n.theme.colorPrimary}))}))};import xe,{useEffect as pa,useState as zo}from"react";import{AnimatePresence as da,motion as ca}from"framer-motion";var ma=({children:e,id:t,shouldWrap:o=!1})=>xe.createElement(xe.Fragment,null,o?xe.createElement(da,{initial:!1},xe.createElement(ca.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),So=({appearance:e,steps:t,selectedStep:o,customStepTypes:n,customVariables:r,onButtonClick:i,onStepCompletion:s,flowId:p,type:d,hideOnFlowCompletion:l,onComplete:u,setVisible:c,setShowModal:m,onDismiss:b,showPagination:w=!1,customFormElements:S,allowBackNavigation:f})=>{let T={...{linkCollection:zr,multiInput:Ir,callToAction:Hr,selectList:Zr},...n},{primaryCTAClickSideEffects:B,secondaryCTAClickSideEffects:k}=re(),[g,x]=zo(!1),[C,v]=zo({}),[M,$]=zo(!1),U=t[o]??null,{markStepCompleted:A,markStepStarted:H,isLoading:I,updateCustomVariables:_,markFlowCompleted:te}=X();pa(()=>{_(r)},[r,I]);function q(){return{data:C[t[o].id]??{},stepId:t[o].id,customVariables:r}}function W(L,oe,N){let V=o+1<t.length?t[o+1]:null;i&&i(L,o,oe,V),s&&s(L,N,V,C,q())}function be(L,oe){v(N=>{let V={};return V[L.id]=oe,{...N,...V}})}function me(L){return L.selectedStep.imageUri?xe.createElement(Mr,{image:L.selectedStep.imageUri,appearance:e,className:a("formContainerSidebarImage",e)}):null}let G=xe.createElement(_r,{step:t[o],canContinue:g||!M,formType:d,selectedStep:o,appearance:e,onPrimaryClick:async()=>{$(!0);let L={...q()};await A(p,t[o].id,L),o+1<t.length&&await H(p,t[o+1].id),W(t[o],"primary",o),o+1>=t.length&&(u&&u(),b&&b(),l&&(c&&c(!1),m(!1)),await te(p)),B(t[o]),$(!1)},onSecondaryClick:()=>{W(t[o],"secondary",o),k(t[o])},onBack:async()=>{o-1>=0&&($(!0),await H(p,t[o-1].id),$(!1))},steps:t,allowBackNavigation:f});return xe.createElement(xe.Fragment,null,xe.createElement(Or,{className:a("formContainer",e)},xe.createElement(Dr,null,xe.createElement(ma,{id:o,shouldWrap:d==="large-modal"},xe.createElement($r,{key:U.id,type:d,className:a("formContent",e)},t.map(L=>{let oe=T[L.type];return U.id!==L.id?null:xe.createElement(oe,{key:L.id,stepData:L,canContinue:g,setCanContinue:x,onSaveData:N=>{be(L,N)},appearance:e,customFormElements:S})}),w&&xe.createElement(Wr,{className:a("formPagination",e),appearance:e,stepCount:t.length,currentStep:o}),G))),d=="large-modal"&&xe.createElement(me,{selectedStep:t[o]})))};import Vt from"react";import{createGlobalStyle as ua}from"styled-components";function ee({appearance:e}){if(!e||!e.styleOverrides)return Vt.createElement(Vt.Fragment,null);let t=Object.entries(e.styleOverrides).filter(([n,r])=>typeof r=="object");if(t.length===0)return Vt.createElement(Vt.Fragment,null);let o=ua`
|
|
524
|
+
${n=>n.inlineStyles.map(([r,i])=>`.${Wt}${r}.${Wt}${r} { ${Object.entries(i).map(([s,p])=>`${Lo(s)}: ${p};`).join(" ")} }`).join(" ")}`;return Vt.createElement(o,{inlineStyles:t})}var Rr=({flowId:e,customStepTypes:t={},type:o="inline",visible:n,setVisible:r,customVariables:i,customFormElements:s,onComplete:p,appearance:d,hideOnFlowCompletion:l=!0,onStepCompletion:u,onButtonClick:c,dismissible:m=!0,endFlowOnDismiss:b=!1,modalPosition:w="center",repeatable:S=!1,onDismiss:f,showPagination:P=!1,allowBackNavigation:T=!1})=>{let{getFlow:B,getFlowSteps:k,isLoading:g,targetingLogicShouldHideFlow:x,getFlowStatus:C,getCurrentStepIndex:v,markFlowCompleted:M,markFlowNotStarted:$}=X(),U=v(e),{mergeAppearanceWithDefault:A}=J(),[H,I]=ga(!1),{setOpenFlowState:_,getOpenFlowState:te}=Fe();d=A(d);let[q,W]=n!==void 0&&r!==void 0?[n,r]:[te(e,!0),L=>_(e,L)];if(fa(()=>{!H&&!g&&(I(!0),C(e)===Z&&S&&$(e),I(!0))},[H,I,g]),g)return null;let be=B(e);if(!be||x(be))return null;let me=k(e);if(!me||n!==void 0&&n===!1||C(e)===Z&&l)return null;let G=()=>{W(!1),f&&f(),b===!0&&M(e)};if(w=="center"&&o==="modal"||o==="large-modal"){let L={padding:"24px"};return o==="large-modal"?(L.width="85%",L.height="90%",L.maxHeight="800px",L.minHeight="500px",L.padding="0"):L.width="400px",$e.createElement(Je,{appearance:d,onClose:G,visible:q,style:L,dismissible:m},$e.createElement(ee,{appearance:d}),$e.createElement(So,{appearance:d,steps:me,selectedStep:U,customStepTypes:t,customVariables:i,onButtonClick:c,onStepCompletion:u,flowId:e,type:o,hideOnFlowCompletion:l,onComplete:p,setVisible:r,setShowModal:W,onDismiss:f,showPagination:P,customFormElements:s,allowBackNavigation:T}))}return o==="modal"&&w!=="center"?$e.createElement(ur,{appearance:d,onClose:G,visible:q},$e.createElement(ee,{appearance:d}),$e.createElement(So,{appearance:d,steps:me,selectedStep:U,customStepTypes:t,customVariables:i,onButtonClick:c,onStepCompletion:u,flowId:e,type:o,hideOnFlowCompletion:l,onComplete:p,setVisible:r,setShowModal:W,onDismiss:f,showPagination:P,customFormElements:s,allowBackNavigation:T})):$e.createElement($e.Fragment,null,$e.createElement(ee,{appearance:d}),$e.createElement(So,{appearance:d,steps:me,selectedStep:U,customStepTypes:t,customVariables:i,onButtonClick:c,onStepCompletion:u,flowId:e,type:o,hideOnFlowCompletion:l,onComplete:p,setVisible:r,setShowModal:W,onDismiss:f,showPagination:P,customFormElements:s,allowBackNavigation:T}))},ei=Rr;import{useCallback as ti,useContext as ha,useEffect as xa}from"react";function Ho(){let{organizationId:e,userId:t,setOrganizationId:o}=ha(K),{mutateUserFlowState:n}=Be(),{config:r}=Oe(),i=yt(),{verifySDKInitiated:s}=bt();xa(()=>{if(t&&e){if(t.startsWith(wt))return;let l=`frigade-user-group-registered-${t}-${e}`;localStorage.getItem(l)||(i(`${Se}userGroups`,{...r,method:"POST",body:JSON.stringify({foreignUserId:t,foreignUserGroupId:e})}),localStorage.setItem(l,"true"))}},[t,e]);let p=ti(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 u={foreignUserId:t,foreignUserGroupId:e,properties:l};await i(`${Se}userGroups`,{...r,method:"POST",body:JSON.stringify(u)}),n()},[e,t,r,n]),d=ti(async(l,u)=>{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 m={foreignUserId:t,foreignUserGroupId:e,events:[{event:l,properties:u}]};await i(`${Se}userGroups`,{...r,method:"POST",body:JSON.stringify(m)}),n()},[e,t,r,n]);return{organizationId:e,setOrganizationId:o,addPropertiesToOrganization:p,trackEventForOrganization:d}}var oi="xFrigade_guestUserId",ri="xFrigade_userId",ii=({})=>{let{setFlowResponses:e}=_t(),{userFlowStatesData:t,isLoadingUserFlowStateData:o,mutateUserFlowState:n}=Be(),{userId:r,setUserId:i}=No(),[s,p]=jo(null),{getFlowStatus:d}=X(),{flows:l,userProperties:u,setIsNewGuestUser:c,flowResponses:m}=Ca(K),[b,w]=jo([]),[S,f]=jo([]),{organizationId:P}=Ho();yo(()=>{if(!o&&t)for(let g=0;g<t.length;g++){let x=t[g],C=l.find(v=>v.slug===(x==null?void 0:x.flowId));if(C&&x&&x.shouldTrigger===!0&&C.type=="FORM"&&C.triggerType==="AUTOMATIC"&&!S.includes(C.slug)){setTimeout(()=>{T(x.flowId)},500);break}}},[o,t]),yo(()=>{m.length>0&&n()},[m]);function T(g){let x=l.find(C=>C.slug===g);x&&x.triggerType==="AUTOMATIC"&&!S.includes(x.slug)&&(f([...S,x.slug]),w([x]))}function B(){if(!r){let g=localStorage.getItem(ri);if(g){i(g);return}let x=localStorage.getItem(oi);if(x){i(x);return}c(!0);let C=wt+Sa();try{localStorage.setItem(oi,C)}catch(v){console.log("Failed to save guest user id locally: Local storage unavailable",v)}i(v=>v||C)}}yo(()=>{try{if(l){let g=[];l.forEach(x=>{if(x.data){let C=x.data.match(/"imageUri":"(.*?)"/g);C&&C.forEach(v=>{let M=v.replace('"imageUri":"',"").replace('"',"");if(g.includes(M))return;let $=new Image;$.src=M,g.push(M)})}})}}catch{}},[l]),yo(()=>{if(r!==s&&e([]),p(r),r&&!r.startsWith(wt))try{localStorage.setItem(ri,r)}catch(g){console.log("Failed to save user id locally: Local storage available",g)}r===null&&setTimeout(()=>{r===null&&B()},50)},[r,l,u]);function k(){return ct.createElement(ct.Fragment,null,b.map(g=>d(g.slug)!==Ie?null:ct.createElement("span",{key:g.slug},ct.createElement(ei,{flowId:g.slug,type:"modal",modalPosition:"center",endFlowOnDismiss:!0}))))}return ct.createElement(ct.Fragment,null,ct.createElement(k,null))};import{ErrorBoundary as wa}from"react-error-boundary";var K=ya({publicApiKey:"",setUserId:()=>{},flows:[],setFlows:()=>{},failedFlowResponses:[],setFailedFlowResponses:()=>{},flowResponses:[],setFlowResponses:()=>{},userProperties:{},setUserProperties:()=>{},openFlowStates:{},setOpenFlowStates:()=>{},completedFlowsToKeepOpenDuringSession:[],setCompletedFlowsToKeepOpenDuringSession:()=>{},customVariables:{},setCustomVariables:()=>{},isNewGuestUser:!1,setIsNewGuestUser:()=>{},hasActiveFullPageFlow:!1,setHasActiveFullPageFlow:()=>{},organizationId:"",setOrganizationId:()=>{},navigate:()=>{},defaultAppearance:Bt,shouldGracefullyDegrade:!1,setShouldGracefullyDegrade:()=>{}}),Ta=({publicApiKey:e,userId:t,organizationId:o,config:n,children:r})=>{var te,q;let[i,s]=Ae(t||null),[p,d]=Ae(o||null),[l,u]=Ae([]),[c,m]=Ae([]),[b,w]=Ae([]),[S,f]=Ae({}),[P,T]=Ae({}),[B,k]=Ae([]),[g,x]=Ae({}),[C,v]=Ae(!1),[M,$]=Ae(!1),[U,A]=Ae(!_(e)),H=(W,be)=>{if(be==="_blank"){window.open(W,"_blank");return}setTimeout(()=>{window.location.href=W},50)},I={theme:{...Bt.theme,...((te=n==null?void 0:n.defaultAppearance)==null?void 0:te.theme)??{}},styleOverrides:{...Bt.styleOverrides,...((q=n==null?void 0:n.defaultAppearance)==null?void 0:q.styleOverrides)??{}}};function _(W){return!!(W&&W.length>10&&W.substring(0,10)==="api_public")}return Go(()=>{t&&s(t)},[t]),Go(()=>{o&&d(o)},[o]),Go(()=>{if(_(e))A(!1);else{console.error("Frigade SDK failed to initialize. API key provided is either missing or valid."),A(!0);return}},[e,A]),U?mt.createElement(K.Provider,{value:{publicApiKey:e,userId:i,setUserId:s,setFlows:u,flows:l,failedFlowResponses:c,setFailedFlowResponses:m,flowResponses:b,setFlowResponses:w,userProperties:S,setUserProperties:f,openFlowStates:P,setOpenFlowStates:T,completedFlowsToKeepOpenDuringSession:B,setCompletedFlowsToKeepOpenDuringSession:k,customVariables:g,setCustomVariables:x,isNewGuestUser:C,setIsNewGuestUser:v,hasActiveFullPageFlow:M,setHasActiveFullPageFlow:$,organizationId:p,setOrganizationId:d,navigate:n&&n.navigate?n.navigate:H,defaultAppearance:I,shouldGracefullyDegrade:U,setShouldGracefullyDegrade:A}},r):mt.createElement(wa,{fallback:mt.createElement(mt.Fragment,null,r)},mt.createElement(K.Provider,{value:{publicApiKey:e,userId:i,setUserId:s,setFlows:u,flows:l,failedFlowResponses:c,setFailedFlowResponses:m,flowResponses:b,setFlowResponses:w,userProperties:S,setUserProperties:f,openFlowStates:P,setOpenFlowStates:T,completedFlowsToKeepOpenDuringSession:B,setCompletedFlowsToKeepOpenDuringSession:k,customVariables:g,setCustomVariables:x,isNewGuestUser:C,setIsNewGuestUser:v,hasActiveFullPageFlow:M,setHasActiveFullPageFlow:$,organizationId:p,setOrganizationId:d,navigate:n&&n.navigate?n.navigate:H,defaultAppearance:I,shouldGracefullyDegrade:U,setShouldGracefullyDegrade:A}},mt.createElement(ba,{theme:I.theme},r,mt.createElement(ii,null))))};import yp from"react";import se,{useEffect as Dn,useState as $n}from"react";import Le,{useState as Va}from"react";import gt from"styled-components";import To from"react";import ut from"react";import si from"styled-components";var ni=si.span`
|
|
525
525
|
font-weight: 400;
|
|
526
526
|
font-size: 15px;
|
|
527
527
|
line-height: 20px;
|
|
@@ -690,7 +690,7 @@ ${n=>n.inlineStyles.map(([r,i])=>`.${Wt}${r}.${Wt}${r} { ${Object.entries(i).map
|
|
|
690
690
|
`,Qa=gt.div`
|
|
691
691
|
flex: 2;
|
|
692
692
|
padding: 2rem;
|
|
693
|
-
`,Za=({title:e,subtitle:t,steps:o=[],style:n={},selectedStep:r,setSelectedStep:i,className:s="",customStepTypes:p=new Map,appearance:d,type:l})=>{let{mergeAppearanceWithDefault:u}=J();d=u(d);let m={...{[Ko]:fi,[hi]:xi,[Si]:yi},...p},[b,w]=Va(0),S=r??b,f=i??w,P=o.filter(B=>B.complete===!0).length,T=()=>{var B;return!((B=o[S])!=null&&B.type)||!m[o[S].type]?m[Ko]({stepData:o[S],appearance:d}):m[o[S].type]({stepData:o[S],appearance:d})};return
|
|
693
|
+
`,Za=({title:e,subtitle:t,steps:o=[],style:n={},selectedStep:r,setSelectedStep:i,className:s="",customStepTypes:p=new Map,appearance:d,type:l})=>{let{mergeAppearanceWithDefault:u}=J();d=u(d);let m={...{[Ko]:fi,[hi]:xi,[Si]:yi},...p},[b,w]=Va(0),S=r??b,f=i??w,P=o.filter(B=>B.complete===!0).length,T=()=>{var B;return!((B=o[S])!=null&&B.type)||!m[o[S].type]?m[Ko]({stepData:o[S],appearance:d}):m[o[S].type]({stepData:o[S],appearance:d})};return Le.createElement(Ka,{type:l,style:n,className:s,appearance:d},Le.createElement(bi,{style:{flex:1}},Le.createElement(bi,{style:{padding:"30px 0px 30px 30px",borderBottom:"none"}},Le.createElement(qa,{className:a("checklistTitle",d),appearance:d},e),Le.createElement(Ya,{className:a("checklistSubtitle",d),appearance:d},t),Le.createElement(Me,{total:o.length,count:P,fillColor:d.theme.colorPrimary,style:{marginTop:"24px"},appearance:d})),Le.createElement(Xa,{className:a("checklistStepsContainer",d)},o.map((B,k)=>Le.createElement(ci,{data:B,index:k,key:k,listLength:o.length,isSelected:k===S,primaryColor:d.theme.colorPrimary,style:{justifyContent:"space-between"},onClick:()=>{f(k)}})))),Le.createElement(Ja,{appearance:d,className:a("checklistDivider",d)}),Le.createElement(Qa,null,Le.createElement(T,null)))},qo=Za;import O,{useState as ip}from"react";import wi from"react";import Ra from"styled-components";var ep=Ra.svg`
|
|
694
694
|
transition: 'transform 0.35s ease-in-out';
|
|
695
695
|
`,Ot=({color:e="#323232",style:t,className:o})=>wi.createElement(ep,{width:"7",height:"10",viewBox:"0 0 9 15",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:t,className:o},wi.createElement("path",{d:"M1 13L7.5 7L0.999999 1",stroke:e,strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"}));import{motion as np}from"framer-motion";import pe from"styled-components";var Yo={boxShadow:"0px 6px 25px rgba(0, 0, 0, 0.06)",padding:"32px",maxHeight:"700px",msOverflowStyle:"none",scrollbarWidth:"none",paddingBottom:"12px",minHeight:"610px"},Ti=pe.div`
|
|
696
696
|
max-height: 350px;
|
|
@@ -1127,7 +1127,7 @@ ${n=>n.inlineStyles.map(([r,i])=>`.${Wt}${r}.${Wt}${r} { ${Object.entries(i).map
|
|
|
1127
1127
|
color: ${({theme:e})=>e.colorTextSecondary};
|
|
1128
1128
|
${e=>e.blocked||e.complete?"opacity: 0.4;":`
|
|
1129
1129
|
`}
|
|
1130
|
-
`;var In=({stepData:e,style:t={},appearance:o})=>{let{mergeAppearanceWithDefault:n}=J(),{primaryCTAClickSideEffects:r}=re(),{theme:i,styleOverrides:s}=n(o),{imageUri:p=null,subtitle:d=null,title:l=null,complete:u=!1,blocked:c=!1}=e,m=()=>{r(e)};return ht.createElement(wn,{className:a("carouselCard",o),onClick:c?null:m,style:t,blocked:c,complete:u},ht.createElement("div",{style:{alignItems:"flex-start",display:"flex",justifyContent:"space-between"}},p&&ht.createElement(Tn,{className:a("carouselCardImage",o),src:p,alt:l,style:{opacity:u||c?.4:1}}),u&&ht.createElement(vn,{className:a("carouselCompletedPill",o)},ht.createElement(An,{style:{color:"#108E0B"}},"Complete"))),l&&ht.createElement(Bn,{blocked:c,complete:u,className:a("carouselCardTitle",o)},l),d&&ht.createElement(Ue.Quiet,{blocked:c,complete:u,className:a("carouselCardSubtitle",o)},d))};import Jt from"react";var Nn=({numberOfStepsCompleted:e,numberOfSteps:t,appearance:o})=>{let n=t>0?e/t:0,r=200,i=Math.min(r,Math.max(10,Math.round(r*n)));return Jt.createElement(kn,{className:a("carouselProgressBar",o)},Jt.createElement(Pn,{as:Ue.Loud,style:{marginRight:8}},e," of ",t),Jt.createElement("svg",{height:10,width:r},Jt.createElement("rect",{x:0,y:0,rx:5,width:r,height:10,fill:"#E6E6E6"}),Jt.createElement("rect",{x:0,y:0,rx:5,width:i,height:10,fill:"currentColor"})))};var Sp=()=>ne.createElement("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},ne.createElement("path",{d:"M14 6L20 12",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round"}),ne.createElement("path",{d:"M14 18L20 12",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round"}),ne.createElement("path",{d:"M4 12H20",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round"})),Ln=({side:e="left",show:t=!1,onClick:o=()=>{}})=>{let[n,r]=xt(!1),[i,s]=xt(!1);Qo(()=>{t===!0&&n===!1?r(!0):t===!1&&n===!0&&s(!0)},[t]);let p=()=>{r(!1),s(!1)},d=e=="left"?{top:0,bottom:0,left:-20,transform:"rotate(180deg)"}:{top:0,bottom:0,right:-20};return n?ne.createElement(Sn,{style:d,reversed:i,onAnimationEnd:i?p:null},ne.createElement(yn,{onClick:()=>o(),style:{right:16,top:"calc(50% - 24px)"}},ne.createElement(Sp,null))):null},On=({flowId:e,appearance:t,customVariables:o,className:n})=>{let r=Cp(null),[i,s]=xt(!1),[p,d]=xt(!1),[l,u]=xt(null),[c,m]=xt([]),[b,w]=xt(0),{getFlowMetadata:S,getFlowSteps:f,getNumberOfStepsCompleted:P,updateCustomVariables:T,getFlowStatus:B,isLoading:k,targetingLogicShouldHideFlow:g,getFlow:x}=X();Qo(()=>{T(o)},[o,k]),Qo(()=>{if(k)return;let A=S(e),H=P(e),I=f(e);u(A),A.data!==null&&(m(I.sort((_,te)=>Number(_.complete)-Number(te.complete))),d(I.length>3),w(H))},[k]);let C=[];for(let A=0;A<c.length;A+=3)C.push(c.slice(A,A+3));let v=A=>{let H=A.target,I=H.scrollWidth-H.clientWidth,_=Math.ceil(H.scrollLeft);_>0&&i===!1&&s(!0),_===0&&i===!0&&s(!1),_<I&&p===!1&&d(!0),_===I&&p===!0&&d(!1)},M=(A=!0)=>{let H=A?1:-1;r.current!==null&&r.current.scrollBy({left:r.current.clientWidth*H,behavior:"smooth"})},$=null,U=A=>{$!==null?clearTimeout($):v(A),$=setTimeout(()=>{v(A)},16)};return k?null:ne.createElement(Fn,{className:ge(a("carouselContainer",t),n)},ne.createElement("div",{style:{display:"flex",justifyContent:"space-between",marginBottom:20}},ne.createElement("div",null,ne.createElement(En,{className:a("carouselTitle",t)},l==null?void 0:l.title),ne.createElement(Ue.Quiet,{className:a("carouselSubtitle",t)},l==null?void 0:l.subtitle)),ne.createElement(Nn,{numberOfStepsCompleted:b,numberOfSteps:c.length})),ne.createElement("div",{style:{position:"relative"}},ne.createElement(Ln,{show:i,onClick:()=>M(!1)}),ne.createElement(Ln,{side:"right",show:p,onClick:M}),ne.createElement(xn,{ref:r,onScroll:U},C.map((A,H)=>ne.createElement(Cn,{key:H,style:{flex:`0 0 calc(100% - ${c.length>3?36:0}px)`}},A.map((I,_)=>ne.createElement(In,{key:_,stepData:I,style:{flex:c.length>3?"0 1 calc(33% - 16px * 2 / 3)":1},appearance:t})))))))};var Zo=({flowId:e,title:t,subtitle:o,style:n,initialSelectedStep:r,className:i,type:s="inline",onDismiss:p,visible:d,customVariables:l,onStepCompletion:u,onButtonClick:c,appearance:m,hideOnFlowCompletion:b,setVisible:w,customStepTypes:S,checklistStyle:f="default",autoExpandFirstIncompleteStep:P,autoExpandNextStep:T,...B})=>{let{getFlow:k,getFlowSteps:g,markStepCompleted:x,getStepStatus:C,getNumberOfStepsCompleted:v,isLoading:M,targetingLogicShouldHideFlow:$,updateCustomVariables:U,getFlowMetadata:A,isStepBlocked:H,getFlowStatus:I,hasActiveFullPageFlow:_,setHasActiveFullPageFlow:te}=X(),{primaryCTAClickSideEffects:q,secondaryCTAClickSideEffects:W}=re(),{getOpenFlowState:be,setOpenFlowState:
|
|
1130
|
+
`;var In=({stepData:e,style:t={},appearance:o})=>{let{mergeAppearanceWithDefault:n}=J(),{primaryCTAClickSideEffects:r}=re(),{theme:i,styleOverrides:s}=n(o),{imageUri:p=null,subtitle:d=null,title:l=null,complete:u=!1,blocked:c=!1}=e,m=()=>{r(e)};return ht.createElement(wn,{className:a("carouselCard",o),onClick:c?null:m,style:t,blocked:c,complete:u},ht.createElement("div",{style:{alignItems:"flex-start",display:"flex",justifyContent:"space-between"}},p&&ht.createElement(Tn,{className:a("carouselCardImage",o),src:p,alt:l,style:{opacity:u||c?.4:1}}),u&&ht.createElement(vn,{className:a("carouselCompletedPill",o)},ht.createElement(An,{style:{color:"#108E0B"}},"Complete"))),l&&ht.createElement(Bn,{blocked:c,complete:u,className:a("carouselCardTitle",o)},l),d&&ht.createElement(Ue.Quiet,{blocked:c,complete:u,className:a("carouselCardSubtitle",o)},d))};import Jt from"react";var Nn=({numberOfStepsCompleted:e,numberOfSteps:t,appearance:o})=>{let n=t>0?e/t:0,r=200,i=Math.min(r,Math.max(10,Math.round(r*n)));return Jt.createElement(kn,{className:a("carouselProgressBar",o)},Jt.createElement(Pn,{as:Ue.Loud,style:{marginRight:8}},e," of ",t),Jt.createElement("svg",{height:10,width:r},Jt.createElement("rect",{x:0,y:0,rx:5,width:r,height:10,fill:"#E6E6E6"}),Jt.createElement("rect",{x:0,y:0,rx:5,width:i,height:10,fill:"currentColor"})))};var Sp=()=>ne.createElement("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},ne.createElement("path",{d:"M14 6L20 12",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round"}),ne.createElement("path",{d:"M14 18L20 12",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round"}),ne.createElement("path",{d:"M4 12H20",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round"})),Ln=({side:e="left",show:t=!1,onClick:o=()=>{}})=>{let[n,r]=xt(!1),[i,s]=xt(!1);Qo(()=>{t===!0&&n===!1?r(!0):t===!1&&n===!0&&s(!0)},[t]);let p=()=>{r(!1),s(!1)},d=e=="left"?{top:0,bottom:0,left:-20,transform:"rotate(180deg)"}:{top:0,bottom:0,right:-20};return n?ne.createElement(Sn,{style:d,reversed:i,onAnimationEnd:i?p:null},ne.createElement(yn,{onClick:()=>o(),style:{right:16,top:"calc(50% - 24px)"}},ne.createElement(Sp,null))):null},On=({flowId:e,appearance:t,customVariables:o,className:n})=>{let r=Cp(null),[i,s]=xt(!1),[p,d]=xt(!1),[l,u]=xt(null),[c,m]=xt([]),[b,w]=xt(0),{getFlowMetadata:S,getFlowSteps:f,getNumberOfStepsCompleted:P,updateCustomVariables:T,getFlowStatus:B,isLoading:k,targetingLogicShouldHideFlow:g,getFlow:x}=X();Qo(()=>{T(o)},[o,k]),Qo(()=>{if(k)return;let A=S(e),H=P(e),I=f(e);u(A),A.data!==null&&(m(I.sort((_,te)=>Number(_.complete)-Number(te.complete))),d(I.length>3),w(H))},[k]);let C=[];for(let A=0;A<c.length;A+=3)C.push(c.slice(A,A+3));let v=A=>{let H=A.target,I=H.scrollWidth-H.clientWidth,_=Math.ceil(H.scrollLeft);_>0&&i===!1&&s(!0),_===0&&i===!0&&s(!1),_<I&&p===!1&&d(!0),_===I&&p===!0&&d(!1)},M=(A=!0)=>{let H=A?1:-1;r.current!==null&&r.current.scrollBy({left:r.current.clientWidth*H,behavior:"smooth"})},$=null,U=A=>{$!==null?clearTimeout($):v(A),$=setTimeout(()=>{v(A)},16)};return k?null:ne.createElement(Fn,{className:ge(a("carouselContainer",t),n)},ne.createElement("div",{style:{display:"flex",justifyContent:"space-between",marginBottom:20}},ne.createElement("div",null,ne.createElement(En,{className:a("carouselTitle",t)},l==null?void 0:l.title),ne.createElement(Ue.Quiet,{className:a("carouselSubtitle",t)},l==null?void 0:l.subtitle)),ne.createElement(Nn,{numberOfStepsCompleted:b,numberOfSteps:c.length})),ne.createElement("div",{style:{position:"relative"}},ne.createElement(Ln,{show:i,onClick:()=>M(!1)}),ne.createElement(Ln,{side:"right",show:p,onClick:M}),ne.createElement(xn,{ref:r,onScroll:U},C.map((A,H)=>ne.createElement(Cn,{key:H,style:{flex:`0 0 calc(100% - ${c.length>3?36:0}px)`}},A.map((I,_)=>ne.createElement(In,{key:_,stepData:I,style:{flex:c.length>3?"0 1 calc(33% - 16px * 2 / 3)":1},appearance:t})))))))};var Zo=({flowId:e,title:t,subtitle:o,style:n,initialSelectedStep:r,className:i,type:s="inline",onDismiss:p,visible:d,customVariables:l,onStepCompletion:u,onButtonClick:c,appearance:m,hideOnFlowCompletion:b,setVisible:w,customStepTypes:S,checklistStyle:f="default",autoExpandFirstIncompleteStep:P,autoExpandNextStep:T,...B})=>{let{getFlow:k,getFlowSteps:g,markStepCompleted:x,getStepStatus:C,getNumberOfStepsCompleted:v,isLoading:M,targetingLogicShouldHideFlow:$,updateCustomVariables:U,getFlowMetadata:A,isStepBlocked:H,getFlowStatus:I,hasActiveFullPageFlow:_,setHasActiveFullPageFlow:te}=X(),{primaryCTAClickSideEffects:q,secondaryCTAClickSideEffects:W}=re(),{getOpenFlowState:be,setOpenFlowState:me}=Fe(),[G,L]=$n(r||0),[oe,N]=$n(!1),V=d===void 0?be(e):d,we=s==="modal",{mergeAppearanceWithDefault:ve}=J(),{isLarge:St}=Qi();if(m=ve(m),Dn(()=>{U(l)},[l,M]),Dn(()=>{d!==void 0&&(we&&d===!0?te(!0):we&&d===!1&&te(!1))},[d,w,_]),M)return null;let rt=k(e);if(!rt||$(rt))return null;let Te=g(e);if(!Te||b===!0&&I(e)===Z)return null;let ce=A(e);if(ce!=null&&ce.title&&(t=ce.title),ce!=null&&ce.subtitle&&(o=ce.subtitle),!oe&&r===void 0&&v(e)>0){let z=Math.min(v(e),Te.length-1);L(z),N(!0)}function ze(){if(G+1>=Te.length){we&&me(e,!1);return}H(e,Te[G+1].id)||L(G+1)}function He(z,nt,eo){let nr=G+1<Te.length?Te[G+1]:null;c&&c(z,G,nt,nr)===!0&&we&&h(),u&&u(z,eo,nr),!u&&!c&&(z.primaryButtonUri||z.secondaryButtonUri)&&we&&h()}function Y(){return Te.map((z,nt)=>({...z,handleSecondaryButtonClick:()=>{ze(),W(z),z.skippable===!0&&x(e,z.id,{skipped:!0}),He(z,"secondary",nt)},handlePrimaryButtonClick:()=>{(!z.completionCriteria&&(z.autoMarkCompleted||z.autoMarkCompleted===void 0)||z.completionCriteria&&z.autoMarkCompleted===!0)&&(x(e,z.id),ze()),He(z,"primary",nt),q(z),C(e,z.id)===Ne&&ze()}}))}function fe(){return se.createElement(ee,{appearance:m})}let it={steps:Y(),title:t,subtitle:o,primaryColor:m.theme.colorPrimary,appearance:m,customStepTypes:S,type:s,className:i,autoExpandFirstIncompleteStep:P,autoExpandNextStep:T};function h(){me(e,!1),p&&p(),w&&w(!1)}function y(){return se.createElement(se.Fragment,null,se.createElement(fe,null),se.createElement(On,{flowId:e,appearance:m,customVariables:l,className:i}))}function E(){return se.createElement(se.Fragment,null,se.createElement(fe,null),se.createElement(Jo,{visible:V,onClose:()=>{h()},selectedStep:G,setSelectedStep:L,autoExpandNextStep:!0,appearance:m,...it}))}function j(){if(!St)return E();let z=B.guideFlowId,nt;return z&&k(z)&&(nt=g(z)),se.createElement(se.Fragment,null,se.createElement(fe,null),se.createElement(Xo,{visible:V,stepsTitle:ce.stepsTitle?ce.stepsTitle:"Your quick start guide",onClose:()=>{h()},selectedStep:G,setSelectedStep:L,guideData:nt,guideTitle:B.guideTitle??"Guide",appearance:m,title:t,subtitle:o,onGuideButtonClick:eo=>{He(eo,"link",0)},customStepTypes:S,...it}))}function le(){if(!St)return E();let z=se.createElement(qo,{flowId:e,style:n,selectedStep:G,setSelectedStep:L,appearance:m,type:s,...it});return we?se.createElement(Je,{onClose:()=>{h()},visible:V,appearance:m,style:{paddingTop:"0px",padding:"12px",paddingLeft:0}},se.createElement(fe,null),z):se.createElement(se.Fragment,null,se.createElement(fe,null),z)}switch(f){case"condensed":return E();case"with-guide":return j();case"default":return le();case"carousel":return y();default:return le()}};var bp=e=>yp.createElement(Zo,{type:"inline",...e});import tt,{useEffect as Tp}from"react";import _e from"react";import vo from"styled-components";var Mn=vo.div`
|
|
1131
1131
|
border: 1px solid ${e=>e.appearance.theme.colorBorder};
|
|
1132
1132
|
border-radius: 8px;
|
|
1133
1133
|
padding: 6px 10px 6px 10px;
|
|
@@ -1299,7 +1299,7 @@ ${n=>n.inlineStyles.map(([r,i])=>`.${Wt}${r}.${Wt}${r} { ${Object.entries(i).map
|
|
|
1299
1299
|
`,$p=Rt(ss)`
|
|
1300
1300
|
width: ${$t+12}px;
|
|
1301
1301
|
height: ${$t+12}px;
|
|
1302
|
-
`,Mp=({steps:e=[],onDismiss:t,onComplete:o=()=>{},tooltipPosition:n="auto",showHighlight:r=!0,primaryColor:i="#000000",offset:s={x:0,y:0},visible:p=!0,containerStyle:d={},selectedStep:l=0,customStepTypes:u,appearance:c,dismissible:m=!1,showHighlightOnly:b,showStepCount:w=!0,completedStepsCount:S=0})=>{var Te,
|
|
1302
|
+
`,Mp=({steps:e=[],onDismiss:t,onComplete:o=()=>{},tooltipPosition:n="auto",showHighlight:r=!0,primaryColor:i="#000000",offset:s={x:0,y:0},visible:p=!0,containerStyle:d={},selectedStep:l=0,customStepTypes:u,appearance:c,dismissible:m=!1,showHighlightOnly:b,showStepCount:w=!0,completedStepsCount:S=0})=>{var Te,ce,ze,He;let[f,P]=Zt(),[T,B]=Zt(new Date),k=Ip(null),[g,x]=Zt(document.querySelector(e[l].selector)),C=Yn(g,T),[v,M]=Zt(),[$,U]=Zt(!b),A=(ce=(Te=e[l])==null?void 0:Te.props)!=null&&ce.position?e[l].props.position:"absolute",H=((He=(ze=e[l])==null?void 0:ze.props)==null?void 0:He.zIndex)??90,I=(f==null?void 0:f.width)??is,_=(f==null?void 0:f.height)??ns;rs(()=>{k.current&&P({width:k.current.clientWidth,height:k.current.clientHeight})},[l,T,A]),Eo(()=>{b||U(!0)},[l]);let te=n==="auto"?"right":n,q=Ro(C,te,I,s,A),W=C.right+I>(window.innerWidth||document.documentElement.clientWidth),be=C.bottom+ns>(window.innerHeight||document.documentElement.clientHeight);W&&n==="auto"&&(q=Ro(C,"left",I,s,A),te="left");let me=window.location.pathname.split("/").pop(),G=()=>{let Y=document.querySelector(e[l].selector);v&&v===JSON.stringify(Y==null?void 0:Y.getBoundingClientRect())||(x(Y),B(new Date),Y&&M(JSON.stringify(Y.getBoundingClientRect())))};if(Eo(()=>{let Y=new MutationObserver(G);return Y.observe(document.body,{subtree:!0,childList:!0}),()=>Y.disconnect()},[G]),Eo(()=>{let Y=new MutationObserver(G);return Y.observe(document.body,{subtree:!0,childList:!0,attributes:!0,attributeFilter:["style","class"]}),()=>Y.disconnect()},[G]),Eo(()=>{let Y=setInterval(()=>{G()},10);return()=>clearInterval(Y)},[G]),rs(()=>{setTimeout(()=>{G()},Np),G()},[l,me]),g===null)return D.createElement(D.Fragment,null);if(q.x==0&&q.y==0)return D.createElement(D.Fragment,null);if(!p)return D.createElement(D.Fragment,null);let L=()=>{let Y=()=>{if(e[l].handlePrimaryButtonClick&&(e[l].handlePrimaryButtonClick(),U(!1),setTimeout(()=>{G()},30)),S===e.length-1)return o()},fe=()=>{e[l].handleSecondaryButtonClick&&(e[l].handleSecondaryButtonClick(),b&&U(!1))};return D.createElement(D.Fragment,null,w&&D.createElement(es,null,D.createElement(os,{className:a("tooltipStepCounter",c)},l+1," of ",e.length)),D.createElement(ts,{showStepCount:w,className:a("tooltipCTAContainer",c)},e[l].secondaryButtonTitle&&D.createElement(R,{title:e[l].secondaryButtonTitle,appearance:c,onClick:fe,size:"small",withMargin:!1,secondary:!0}),e[l].primaryButtonTitle&&D.createElement(R,{title:e[l].primaryButtonTitle,appearance:c,onClick:Y,withMargin:!1,size:"small"})))},oe=()=>D.createElement(D.Fragment,null,m&&D.createElement(Jn,{"data-testid":"tooltip-dismiss",onClick:()=>{t&&t()},className:a("tooltipClose",c)},D.createElement(ke,null)),e[l].imageUri&&D.createElement(Qn,{dismissible:m,appearance:c,src:e[l].imageUri,className:a("tooltipImageContainer",c)}),e[l].videoUri&&!e[l].imageUri&&D.createElement(Zn,{dismissible:m,appearance:c,className:a("tooltipVideoContainer",c)},D.createElement(Pt,{appearance:c,videoUri:e[l].videoUri})),D.createElement(he,{appearance:c,title:e[l].title,subtitle:e[l].subtitle,size:"small"}),D.createElement(Rn,{className:a("tooltipFooter",c)},D.createElement(L,null))),V={...{default:Y=>{var fe;if((fe=e[l])!=null&&fe.StepContent){let it=e[l].StepContent;return D.createElement("div",null,it)}return D.createElement(oe,null)}},...u},we=()=>{var Y;return e?!((Y=e[l])!=null&&Y.type)||!V[e[l].type]?V.default(e[l]):V[e[l].type]({stepData:e[l],primaryColor:i}):D.createElement(D.Fragment,null)};if(b&&e[l].complete===!0)return null;let ve={top:(q==null?void 0:q.y)-$t,left:(te=="left"?C.x+s.x:(q==null?void 0:q.x)-$t)??0,cursor:b?"pointer":"default",position:A},St=()=>{let fe=ve.left+(te=="left"?-I:24);return Math.min(Math.max(fe,20),window.innerWidth-I-20)},rt=()=>{b&&(B(new Date),U(!$))};return D.createElement(Dp,null,D.createElement($p,{style:ve,zIndex:H,className:a("tourHighlightContainer",c)},r&&e[l].showHighlight!==!1&&D.createElement(D.Fragment,null,D.createElement(Op,{style:{position:A},onClick:rt,primaryColor:c.theme.colorPrimary}),D.createElement(Lp,{style:{position:"absolute"},onClick:rt,primaryColor:c.theme.colorPrimary}))),D.createElement(ss,{style:{...ve,left:St()},zIndex:H+1,className:a("tooltipContainerWrapper",c)},$&&D.createElement(Xn,{ref:k,layoutId:"tooltip-container",style:{position:"relative",width:"max-content",right:0,top:12,...d},appearance:c,className:a("tooltipContainer",c),maxWidth:is,zIndex:H+10},D.createElement(we,null))))},Bo=Mp;import{Portal as Wp}from"react-portal";var zp=({flowId:e,customVariables:t,appearance:o,onStepCompletion:n,onButtonClick:r,showTooltipsSimultaneously:i=!1,onDismiss:s,dismissible:p,tooltipPosition:d="auto",showHighlightOnly:l=!1,dismissBehavior:u="complete-flow",onComplete:c,...m})=>{let{getFlow:b,getFlowSteps:w,isLoading:S,targetingLogicShouldHideFlow:f,markStepCompleted:P,markStepStarted:T,markFlowCompleted:B,updateCustomVariables:k,getCurrentStepIndex:g,getStepStatus:x,isStepBlocked:C,getFlowStatus:v,getNumberOfStepsCompleted:M}=X(),{isLoadingUserFlowStateData:$}=Be(),{primaryCTAClickSideEffects:U,secondaryCTAClickSideEffects:A}=re(),{hasOpenModals:H}=Fe(),I=g(e),{openFlowStates:_}=Up(K),{mergeAppearanceWithDefault:te}=J();if(o=te(o),_p(()=>{k(t)},[t,S]),$)return null;let q=b(e);if(!q||f(q)||v(e)==Z||H())return null;let W=w(e);if(Object.keys(_).length>0){let N=Object.keys(_).find(V=>_[V]===!0);if(N!==void 0&&N!==e)return Mt.createElement(Mt.Fragment,null)}async function be(N){if(await P(e,N.id),W.map(V=>x(e,V.id)).every(V=>V===Ne)){await B(e);return}if(!l&&I+1<W.length){if(C(e,W[I+1].id))return;await T(e,W[I+1].id)}}function me(N,V,we){let ve=I+1<W.length?W[I+1]:null;r&&r(N,I,V,ve),n&&n(N,we,ve)}function G(){return W.map(N=>({...N,handleSecondaryButtonClick:async()=>{A(N),N.skippable===!0&&await P(e,N.id,{skipped:!0}),me(N,"secondary",I)},handlePrimaryButtonClick:async()=>{(!N.completionCriteria&&(N.autoMarkCompleted||N.autoMarkCompleted===void 0)||N.completionCriteria&&N.autoMarkCompleted===!0)&&await be(N),me(N,"primary",I),U(N)}}))}async function L(N){s&&s(),u==="complete-flow"?await B(e):await P(e,N.id)}function oe(){c&&c()}return Mt.createElement(Wp,null,Mt.createElement(ee,{appearance:o}),i?W.map((N,V)=>Mt.createElement(Bo,{key:N.id,appearance:o,steps:G(),selectedStep:V,showTooltipsSimultaneously:i,dismissible:p,onDismiss:()=>L(N),tooltipPosition:d,showHighlightOnly:l,completedStepsCount:M(e),onComplete:oe,...m})):Mt.createElement(Bo,{appearance:o,steps:G(),selectedStep:I,showTooltipsSimultaneously:i,dismissible:p,onDismiss:()=>L(W[I]),tooltipPosition:d,completedStepsCount:M(e),showHighlightOnly:l,onComplete:oe,...m}))};import Ce,{useEffect as Hp,useRef as jp,useState as Gp}from"react";import{Portal as Vp}from"react-portal";import Ct from"styled-components";var ls=Ct.button`
|
|
1303
1303
|
${e=>F(e)} {
|
|
1304
1304
|
// Anything inside this block will be ignored if the user provides a custom class
|
|
1305
1305
|
|