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