userflow.js-self-hosted 0.1.1013098 → 0.1.1013124
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/BannerApp.js +1 -1
- package/BuilderBar.js +1 -1
- package/DebuggerUI.js +1 -1
- package/EmbedApp.js +1 -1
- package/FlowChrome.js +2 -2
- package/NotificationsApp.js +1 -1
- package/Popover.js +2 -0
- package/ResourceCenterApp.js +2 -2
- package/ResourceCenterAssistantChat.js +2 -2
- package/StartConditionTestingApp.js +1 -1
- package/builder-ui-frame.css +9 -0
- package/client-context.js +1 -1
- package/hash.txt +1 -1
- package/package.json +1 -1
- package/stylesheets.js +1 -1
- package/ui.js +2 -2
- package/userflow.js +3 -3
- package/vendor.core-js.js +1 -1
- package/vendor.fortawesome.pro-regular-svg-icons.js +1 -1
package/BannerApp.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r
|
|
1
|
+
import{r,R as n}from"./vendor.react.js";import{x as s,E as x}from"./userflow.js";import{u as A,i as v}from"./client-context.js";import{o as R}from"./vendor.obj-str.js";import{u as C,a as D,D as O}from"./stylesheets.js";import{C as $}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{u as P,S as W,b as Y,R as z,B as U}from"./use-selector-element-monitoring.js";import{g as H}from"./flow-condition-types.js";import{f as K,w as Z}from"./flow-host.styl.js";import{r as q}from"./vendor.react-dom.js";import{F as G}from"./Frame.js";import{h as i}from"./roots.js";import{u as J}from"./use-element-rect.js";import"./vendor.core-js.js";import"./vendor.object-assign.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.i18next.js";import"./vendor.babel.runtime.js";import"./vendor.react-i18next.js";import"./vendor.fortawesome.pro-solid-svg-icons.js";import"./vendor.date-fns.js";import"./vendor.scheduler.js";import"./use-window-resize.js";(function(){try{var a=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},d=new Error().stack;d&&(a._sentryDebugIds=a._sentryDebugIds||{},a._sentryDebugIds[d]="1285af94-f9e6-47e6-a796-5f0aa73057f2",a._sentryDebugIdIdentifier="sentry-dbid-1285af94-f9e6-47e6-a796-5f0aa73057f2")}catch{}})();const Le=({session:a})=>{const d=A(),{version:c}=a,e=c.banner,p=C(c.theme),g=a.locale?a.locale.standardLocaleId:a.version.theme.languageId;r.useEffect(()=>{v.changeLanguage(g)},[g]);const t=r.useMemo(()=>document.createElement("div"),[]),[k,w]=r.useState(!1),{loaded:T}=D(window,K,p),[I,h]=r.useState(!1),E=T&&I,[M,B]=r.useState(0),u=r.useCallback(()=>{h(!1),B(o=>o+1)},[]),f=![s.BODY_FIRST,s.BODY_LAST].includes(e.embedMode),[l,S]=r.useState(null),F=r.useCallback(({targetEl:o})=>{S(o)},[]),N=r.useCallback(()=>{f&&console.warn(`Userflow.js: Could not find embed element for banner "${a.flow.name||a.flow.id}"`),S(null)},[f,a.flow.name,a.flow.id]);P({selector:e.embedSelector,targetMoved:F,targetLost:N});const b=r.useCallback(()=>{t.parentElement?.removeChild(t),w(!1),u()},[t,u]);r.useLayoutEffect(()=>{let o=null,m=null;if(f){if(!l){b();return}(e.overlay||e.sticky)&&(e.embedMode===s.ELEMENT_BEFORE||e.embedMode===s.ELEMENT_AFTER?m=l.parentElement:m=l,window.getComputedStyle(m).position==="static"&&(o=m.style.position,m.style.position="relative"))}switch(e.embedMode){case s.BODY_FIRST:document.body.insertAdjacentElement("afterbegin",t);break;case s.BODY_LAST:document.body.insertAdjacentElement("beforeend",t);break;case s.ELEMENT_FIRST:l.insertAdjacentElement("afterbegin",t);break;case s.ELEMENT_LAST:l.insertAdjacentElement("beforeend",t);break;case s.ELEMENT_BEFORE:l.insertAdjacentElement("beforebegin",t);break;case s.ELEMENT_AFTER:l.insertAdjacentElement("afterend",t);break}return w(!0),u(),()=>{m&&o!=null&&(m.style.position=o)}},[b,t,f,l,e.overlay,e.sticky,e.embedMode,u]),r.useLayoutEffect(()=>b,[b]);const L=R({"userflowjs-banner":!0,[`userflowjs-banner--animate-${String(e.animate)}`]:!0,[`userflowjs-banner--embed-mode-${e.embedMode}`]:!0,[`userflowjs-banner--sticky-${String(e.sticky)}`]:!0,[`userflowjs-banner--overlay-${e.overlay}`]:!0});r.useLayoutEffect(()=>{t.className=L||""},[t,L]);const y=e.zIndex||Z(0);r.useLayoutEffect(()=>{t.style.zIndex=y==null?"":String(y),t.style.position=E?"":"absolute",t.style.visibility=E?"":"hidden"},[t,y,E]);const{height:j,setEl:_}=J();return r.useLayoutEffect(()=>{t.style.setProperty("--userflowjs-banner-height",i(j+(e.marginTop||0)+(e.marginBottom||0))||"")},[t,j,e.marginTop,e.marginBottom]),k?q.createPortal(n.createElement(W.Provider,{value:a},n.createElement(G,{key:M,className:"userflowjs-banner-frame",style:{maxWidth:i(e.maxWidth),marginTop:i(e.marginTop),marginRight:i(e.marginRight),marginBottom:i(e.marginBottom),marginLeft:i(e.marginLeft),borderRadius:i(e.borderRadius)},stylesheet:Y,theme:p,onStylesheetsLoad:h,title:"Banner"},n.createElement("div",{ref:_,className:R({"userflowjs-banner-root":!0,[`userflowjs-banner-root--content-layout-${e.contentLayout}`]:!0,"userflowjs-theme-root":!0}),dir:v.dir()},n.createElement("div",{className:"userflowjs-banner-start-spacer"}),n.createElement("div",{className:"userflowjs-banner-inner",style:{maxWidth:i(e.maxContentWidth)}},n.createElement("div",{className:"userflowjs-banner-content"},n.createElement(z,{doc:e.content,lookupAttribute:H(a.data)})),e.buttons.length>0&&n.createElement("div",{className:"userflowjs-banner-buttons"},e.buttons.map(o=>n.createElement(U,{key:o.id,button:o})))),c.closeDisabled?n.createElement("div",{className:"userflowjs-banner-start-spacer"}):n.createElement("button",{"data-testid":"userflow-banner-dismiss",className:"userflowjs-banner-close",onClick:()=>d.endFlow(a,{endReason:x.USER_CLOSED})},n.createElement(O,{icon:$}))))),t):null};export{Le as BannerApp,Le as default};
|
|
2
2
|
//# sourceMappingURL=BannerApp.js.map
|
package/BuilderBar.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{R as e,r as t}from"./vendor.react.js";import{F as I}from"./Frame.js";import{S as v}from"./logomark.js";import{o as F}from"./vendor.obj-str.js";import{f as L,a as k}from"./vendor.fortawesome.pro-light-svg-icons.js";import{G as b}from"./userflow.js";import{a as B,D}from"./stylesheets.js";import{u as N}from"./use-window-resize.js";import"./vendor.core-js.js";(function(){try{var r=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},n=new Error().stack;n&&(r._sentryDebugIds=r._sentryDebugIds||{},r._sentryDebugIds[n]="
|
|
1
|
+
import{R as e,r as t}from"./vendor.react.js";import{F as I}from"./Frame.js";import{S as v}from"./logomark.js";import{o as F}from"./vendor.obj-str.js";import{f as L,a as k}from"./vendor.fortawesome.pro-light-svg-icons.js";import{G as b}from"./userflow.js";import{a as B,D}from"./stylesheets.js";import{u as N}from"./use-window-resize.js";import"./vendor.core-js.js";(function(){try{var r=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},n=new Error().stack;n&&(r._sentryDebugIds=r._sentryDebugIds||{},r._sentryDebugIds[n]="87e93633-8374-401b-ad4a-8dcede9f8576",r._sentryDebugIdIdentifier="sentry-dbid-87e93633-8374-401b-ad4a-8dcede9f8576")}catch{}})();const _=new URL("builder-ui-host.css",import.meta.url).href,P=new URL("builder-ui-frame.css",import.meta.url).href,p="builderBarPos",O=e.forwardRef(({onReadyChange:r,children:n,buttons:c},y)=>{const{loaded:h}=B(window,_),[E,S]=t.useState(!1),o=h&&E,u=t.useRef(!1);t.useEffect(()=>{o&&!u.current&&r&&(u.current=!0,r(!0))},[o,r]);const i=t.useRef(null),[s,g]=t.useState(null),[l,w]=t.useState(()=>b.getItem(p)==="top"?"top":"bottom"),R=t.useCallback(a=>{w(a),b.setItem(p,a)},[]),d=t.useRef(0),f=t.useCallback(()=>{const a=i.current;if(!a||!s||!o)return;const m=s.clientHeight;m!==d.current&&(d.current=m,a.style.setProperty("height",m+"px","important"))},[o,s]);return t.useLayoutEffect(()=>{f()}),N(f),t.useImperativeHandle(y,()=>({getFrame:()=>i.current,getRootEl:()=>s}),[s]),e.createElement(e.Fragment,null,e.createElement(I,{className:F({"userflowjs-builder-bar":!0,"userflowjs-builder-bar--top":l==="top"}),style:{visibility:o?void 0:"hidden",animation:o?void 0:"none"},elRef:i,stylesheet:P,onStylesheetsLoad:S,title:"Builder bar"},o&&e.createElement("div",{className:"root",ref:g},e.createElement("div",{className:"logomark"},e.createElement(v,null)),e.createElement("div",{className:"main"},n),e.createElement("div",{className:"buttons"},c,e.createElement("button",{key:l,className:"btn btn--square btn--plain-on-dark",onClick:()=>R(l==="top"?"bottom":"top")},e.createElement(D,{icon:l==="top"?L:k,size:20}))))))});export{O as B};
|
|
2
2
|
//# sourceMappingURL=BuilderBar.js.map
|
package/DebuggerUI.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["flow-condition-types.js","userflow.js","vendor.core-js.js","vendor.phoenix.js","vendor.uuid.js","vendor.date-fns.js","vendor.babel.runtime.js","roots.js"])))=>i.map(i=>d[i]);
|
|
2
|
-
import{r as i,R as e}from"./vendor.react.js";import{r as he}from"./vendor.react-dom.js";import{u as q,U as ct}from"./client-context.js";import{d as _e,a as G,b as M,c as Y,e as se,f as d,A as Fe,W as R,g as z,h as O,S as ut,i as dt,_ as mt,j as pt}from"./userflow.js";import{F as ft}from"./Frame.js";import{S as gt}from"./logomark.js";import{f as X,a as ht,b as Ce,c as qe,d as U,e as Et,g as Ge,h as ye,i as vt,j as bt,k as ze,l as wt,m as _t,n as W,o as A,p as Ct,q as Ye,r as yt,s as xt,t as Nt,u as Tt,v as St,w as Ot,x as Z,y as Dt,z as je,A as Pt,B as It,C as Ft,D as Rt,E as Lt,F as Mt,G as me,H as At}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{f as Ut,a as kt}from"./vendor.fortawesome.pro-solid-svg-icons.js";import{D as m}from"./stylesheets.js";import{o as E}from"./vendor.obj-str.js";import"./vendor.core-js.js";import{_ as Ee,l as Xe}from"./vendor.lodash.js";import{F as ve}from"./vendor.fortawesome.react-fontawesome.js";import"./vendor.react-day-picker.js";import{f as xe,p as Vt,a as Ht}from"./vendor.date-fns.js";import{m as Bt}from"./vendor.memoize-one.js";import{c as Wt}from"./roots.js";import"./vendor.object-assign.js";import"./vendor.scheduler.js";import"./vendor.i18next.js";import"./vendor.babel.runtime.js";import"./vendor.react-i18next.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./flow-condition-types.js";import"./vendor.fortawesome.fontawesome-svg-core.js";(function(){try{var t=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},n=new Error().stack;n&&(t._sentryDebugIds=t._sentryDebugIds||{},t._sentryDebugIds[n]="7a3460b8-eec6-424d-8349-aa7175beed06",t._sentryDebugIdIdentifier="sentry-dbid-7a3460b8-eec6-424d-8349-aa7175beed06")}catch{}})();const qt=new URL("debugger.css",import.meta.url).href,$e=i.createContext(void 0),F=()=>i.useContext($e),Ke=i.createContext(null),Ne=()=>i.useContext(Ke),Ze=i.createContext({debuggerClientConditions:new Map,meta:void 0,buildId:void 0}),J=()=>i.useContext(Ze),oe={verifySetup:{name:"Verify setup",icon:X},checkAutoStart:{name:"Check auto-start",icon:ht},currentUser:{name:"Current user",icon:Ce}},Qe=i.createContext(void 0),Gt=({children:t})=>{const n=q(),[r,s]=i.useState(n.getSessionStorageState().debuggerApp?.selectedTab??"verifySetup");return i.useEffect(()=>{n.setSessionStorageState(o=>!o.debuggerApp||!o.debuggerApp.x?o:{...o,debuggerApp:{...o.debuggerApp,selectedTab:r}}),_e("Debugger Route changed to",r)},[r]),e.createElement(Qe.Provider,{value:{debuggerRoute:r,setDebuggerRoute:s}},t)},Te=()=>{const t=i.useContext(Qe);if(t===void 0)throw new Error("useDebuggerRouteHandler must be used within a DebuggerRouteProvider");return{debuggerRoute:t.debuggerRoute,setDebuggerRoute:t.setDebuggerRoute}},zt=t=>{const n=i.useRef(null),r=Ne();return i.useEffect(()=>{const s=r?.current,o=a=>{n.current&&!n.current.contains(a.target)&&t(a)};return document.addEventListener("mousedown",o),s?.contentDocument?.addEventListener("mousedown",o),()=>{document.removeEventListener("mousedown",o),s?.contentDocument?.removeEventListener("mousedown",o)}},[t,r,n]),n},Yt=()=>e.createElement("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.createElement("path",{d:"M18.4393 5.56066C18.158 5.27936 18 4.89782 18 4.5C18 4.10218 18.158 3.72064 18.4393 3.43934C18.7206 3.15804 19.1022 3 19.5 3C19.8978 3 20.2794 3.15804 20.5607 3.43934C20.842 3.72064 21 4.10218 21 4.5C21 4.89782 20.842 5.27936 20.5607 5.56066C20.2794 5.84196 19.8978 6 19.5 6C19.1022 6 18.7206 5.84196 18.4393 5.56066Z",fill:"#537388"}),e.createElement("path",{d:"M3.43934 5.56066C3.15804 5.27936 3 4.89782 3 4.5C3 4.10218 3.15804 3.72064 3.43934 3.43934C3.72064 3.15804 4.10218 3 4.5 3C4.89782 3 5.27936 3.15804 5.56066 3.43934C5.84196 3.72064 6 4.10218 6 4.5C6 4.89782 5.84196 5.27936 5.56066 5.56066C5.27936 5.84196 4.89782 6 4.5 6C4.10218 6 3.72064 5.84196 3.43934 5.56066Z",fill:"#537388"}),e.createElement("path",{d:"M10.9393 13.0607C10.658 12.7794 10.5 12.3978 10.5 12C10.5 11.6022 10.658 11.2206 10.9393 10.9393C11.2206 10.658 11.6022 10.5 12 10.5C12.3978 10.5 12.7794 10.658 13.0607 10.9393C13.342 11.2206 13.5 11.6022 13.5 12C13.5 12.3978 13.342 12.7794 13.0607 13.0607C12.7794 13.342 12.3978 13.5 12 13.5C11.6022 13.5 11.2206 13.342 10.9393 13.0607Z",fill:"#537388"}),e.createElement("path",{d:"M3.43934 20.5607C3.15804 20.2794 3 19.8978 3 19.5C3 19.1022 3.15804 18.7206 3.43934 18.4393C3.72064 18.158 4.10218 18 4.5 18C4.89782 18 5.27936 18.158 5.56066 18.4393C5.84196 18.7206 6 19.1022 6 19.5C6 19.8978 5.84196 20.2794 5.56066 20.5607C5.27936 20.842 4.89782 21 4.5 21C4.10218 21 3.72064 20.842 3.43934 20.5607Z",fill:"#537388"}),e.createElement("path",{d:"M3.43934 13.0607C3.15804 12.7794 3 12.3978 3 12C3 11.6022 3.15804 11.2206 3.43934 10.9393C3.72064 10.658 4.10218 10.5 4.5 10.5C4.89782 10.5 5.27936 10.658 5.56066 10.9393C5.84196 11.2206 6 11.6022 6 12C6 12.3978 5.84196 12.7794 5.56066 13.0607C5.27936 13.342 4.89782 13.5 4.5 13.5C4.10218 13.5 3.72064 13.342 3.43934 13.0607Z",fill:"#537388"}),e.createElement("path",{d:"M10.9393 5.56066C10.658 5.27936 10.5 4.89782 10.5 4.5C10.5 4.10218 10.658 3.72064 10.9393 3.43934C11.2206 3.15804 11.6022 3 12 3C12.3978 3 12.7794 3.15804 13.0607 3.43934C13.342 3.72064 13.5 4.10218 13.5 4.5C13.5 4.89782 13.342 5.27936 13.0607 5.56066C12.7794 5.84196 12.3978 6 12 6C11.6022 6 11.2206 5.84196 10.9393 5.56066Z",fill:"#537388"})),jt={prefix:"far",iconName:"custom-hand-pointer-slash",icon:[641,512,[],"???","M185.554191,59.5126699 C189.248662,26.0794907 217.382589,0 251.429,0 C287.979,0 317.715,30.056 317.715,67 L317.715,140.634 C338.128,137.776 359.183,144.576 374.31,160.263 C401.503,147.416 434.689,154.593 454.182,179.361 C497.375,162.727 544,195.156 544,242 L544,326 C544,330.296189 543.590626,334.580726 542.780274,338.796073 L495.999,302.221942 L495.999,242 C495.999,216.84 459.428,216.879 459.428,242 C459.428,250.836 452.265,258 443.428,258 L439.435556,258 L420.622383,243.291649 C420.588346,242.865584 420.571,242.434817 420.571,242 L420.571,221 C420.571,197.943344 389.858993,196.049429 384.724023,215.225903 L269.713,125.308981 L269.713,67 C269.713,41.84 233.142,41.88 233.142,67 L233.142,96.717359 L185.554191,59.5126699 Z M162.172457,223.995642 L233.142,279.479508 L233.142,308.493 C233.142,324.063 213.106,330.402 204.111,317.776 L176.985,279.697 C162.585,259.485 133.185,282.08 147.591,302.303 L257.303,456.303 C260.737,461.122 266.231,464 272,464 L450.285,464 C455.041109,464 459.427079,462.119816 462.713129,458.957818 L500.616335,488.590478 C488.331086,503.061811 470.146238,512 450.286,512 L272,512 C250.741,512 230.632,501.59 218.209,484.154 L108.51,330.153 C87.267,300.334 93.705,258.796 123.06,237.001 C134.952446,228.171597 148.664261,223.998532 162.172457,223.995642 Z M272.143,309.970422 L306.143,336.551563 L306.143,400 C306.143,408.837 299.875,416 292.143,416 L286.143,416 C278.41,416 272.143,408.837 272.143,400 L272.143,309.970422 Z M347.571,368.939901 L381.571,395.521042 L381.571,400 C381.571,408.837 375.303,416 367.571,416 L361.571,416 C353.839,416 347.571,408.837 347.571,400 L347.571,368.939901 Z M633.994211,471.020009 C640.904211,476.540009 642.014211,486.610009 636.494211,493.510009 L626.494211,506 C620.964211,512.890009 610.904211,514.010009 604.004211,508.490009 L6.00421069,40.9800088 C-0.895789309,35.4600088 -2.01578931,25.3900088 3.51421069,18.4900088 L13.5142107,6 C19.0342107,-0.899991212 29.1042107,-2.00999121 36.0042107,3.51000879 L633.994211,471.020009 Z"]},Xt={CLICK:qe,DISABLED:U,MOUSEDOWN:Et,NOT_CLICK:jt,NOT_DISABLED:X,NOT_PRESENT:Ge,PRESENT:ye},$t={COMPLETED:X,NOT_COMPLETED:U,NOT_SEEN:Ge,ACTIVE:vt,NOT_ACTIVE:bt,SEEN:ye},Kt={CLICK:"is clicked",DISABLED:"is disabled",MOUSEDOWN:"has mouse down on it",NOT_CLICK:"is not clicked",NOT_DISABLED:"is not disabled",NOT_PRESENT:"is not present",PRESENT:"is present"};function Zt(t){return Kt[t]}const Qt={COMPLETED:"completed",NOT_COMPLETED:"not completed",NOT_SEEN:"not seen",ACTIVE:"is currently active",NOT_ACTIVE:"is not currently active",SEEN:"seen"};function Jt(t){return Qt[t]}function en(t,n){let r=(n||"").toLowerCase();return(t.eventTimeOperator===M.RELATIVE_BETWEEN?t.eventRelativeValue2:t.eventRelativeValue)!==1&&(r+="s"),t.eventTimeOperator!==M.RELATIVE_GT&&(r+=" ago"),r}function tn(t){return(t.eventFrequencyOperator===Y.BETWEEN?t.eventFrequencyValue2:t.eventFrequencyValue)===1?"time":"times"}const nn={CURRENT_USER:"by current user in any company",CURRENT_USER_CURRENT_GROUP:"by current user in current company",CURRENT_GROUP:"by any user in current company"};function rn(t){return nn[t]}function sn(t){if(!t)return"";switch(t){case Y.BETWEEN:return"between";case Y.EQ:return"exactly";case Y.GTE:return"at least";case Y.LTE:return"at most"}}function on(t){if(!t)return"";switch(t){case M.ANY:return"at any point in time";case M.RELATIVE_BETWEEN:return"between";case M.RELATIVE_GT:return"in the last";case M.RELATIVE_LT:return"more than"}}const an={1:"Lowest",2:"Low",3:"Medium",4:"High",5:"Highest"};function ln(t){return`${an[t]||String(t)} priority`}function be(t,n){switch(t){case se.DAY:return n===1?"day":"days";case se.HOUR:return n===1?"hour":"hours";case se.MINUTE:return n===1?"minute":"minutes";case se.SECOND:return n===1?"second":"seconds"}}function Re(t){switch(t){case"USER":return Ce;case"GROUP":return _t;case"GROUP_MEMBERSHIP":return wt;case"EVENT":return ze}}function cn(t){const n=t.split("/");if(n.length===1)return["USER",t];switch(n[0]){case"group":return["GROUP",n[1]];case"group_membership":return["GROUP_MEMBERSHIP",n[1]];case"event":return["EVENT",n[1]]}return console.warn("parseAttributeDefinitionFqn: Invalid attribute definition FQN",t),["USER",t]}const un={[G.BANNER]:"banner",[G.CHECKLIST]:"checklist",[G.FLOW]:"flow",[G.EMBED]:"embed",[G.LAUNCHER]:"launcher",[G.RESOURCE_CENTER]:"resource center"};function dn(t,{title:n,plural:r}={}){let s=un[t];return n&&(s=Ee.upperFirst(s)),r&&(s+="s"),s}let Le=!1;const Q=[];function Me(t){Q.push(t),Le||(Le=!0,window.addEventListener("keydown",n=>{if(n.key==="Escape"){const r=Q[Q.length-1];r&&(r(),n.stopImmediatePropagation())}}))}function Ae(t){const n=Q.indexOf(t);n>=0&&Q.splice(n,1)}const I=[];let Se=0;typeof window<"u"&&window.document.documentElement.addEventListener("mousedown",()=>Se++,{capture:!0});function mn(t){const n={cmp:t,zIndex:Je(),mountMouseDownCounter:Se};I.push(n),I.length===1&&document.documentElement.addEventListener("click",et,{capture:!0})}function pn(t){const n=I.findIndex(r=>r.cmp===t);I.splice(n,1),I.length===0&&document.documentElement.removeEventListener("click",et,{capture:!0})}function fn(t){const n=I.find(r=>r.cmp===t);return n?n.zIndex:Je()}function Je(){const t=I[I.length-1];return t?t.zIndex+100:1e3}function gn(t,n){const r=t.rootRef.current;return!!r&&r.contains(n)}function et(t){const n=t.target;if(n.closest("#userflow-ui, #notifications"))return;const r=I.findIndex(s=>gn(s.cmp,n));for(let s=I.length-1;s>r;s--){const o=I[s];o&&o.mountMouseDownCounter<Se&&o.cmp.closeLayer(t)}}const we=8,hn=we*2,En=8,Ue=50,j=8,ke=24,vn=8;class tt extends e.PureComponent{constructor(){super(...arguments),this.rootRef=e.createRef(),this.notchRef=e.createRef(),this.bodyRef=e.createRef(),this.state={},this.onAnimationFrame=()=>{this.reposition(),this.requestAnimationFrame()},this.onClick=n=>{n.stopPropagation(),this.props.onClick&&this.props.onClick(n)},this.closeLayer=n=>{if(this.props.ignoreTargetClick){const r=this.props.target,s=n.target;if(r&&s&&r.contains(s))return}this.fireOnDismiss({reason:"outside-click",event:n})},this.onEscape=()=>this.fireOnDismiss({reason:"escape"})}get el(){return this.rootRef.current}componentDidMount(){mn(this),this.props.onDismiss&&Me(this.onEscape),window.addEventListener("userflow:hideAllPopovers",this.closeLayer),this.requestAnimationFrame(),this.reposition()}componentWillUnmount(){pn(this),Ae(this.onEscape),window.removeEventListener("userflow:hideAllPopovers",this.closeLayer),window.cancelAnimationFrame(this.raf)}componentDidUpdate(n){const{props:r}=this;this.reposition(),!n.onDismiss&&r.onDismiss?Me(this.onEscape):n.onDismiss&&!r.onDismiss&&Ae(this.onEscape)}render(){const{props:n}=this,r=this.state,s=["popover"];n.className&&s.push(n.className),s.push(`popover--placement-${r.actualPlacement}`);const o=e.createElement("div",{className:s.join(" "),ref:this.rootRef,onMouseDown:n.onMouseDown,onMouseEnter:n.onMouseEnter,onClick:this.onClick,style:{zIndex:fn(this)}},e.createElement("div",{className:"popover__body",ref:this.bodyRef},n.children),!n.noNotch&&this.renderNotch());return he.createPortal(o,(n.document||document).body)}renderNotch(){const n=we,r=n*2;return e.createElement("div",{ref:this.notchRef,className:"popover__notch"},e.createElement("svg",{viewBox:`0 0 ${r} ${n}`},e.createElement("polygon",{className:"popover__notch-border",points:`${r/2},0 ${r},${n} 0,${n}`}),e.createElement("polygon",{className:"popover__notch-fill",points:`${r/2},1 ${r},${n+1} 0,${n+1}`})))}requestAnimationFrame(){this.raf=window.requestAnimationFrame(this.onAnimationFrame)}reposition(){const{props:n}=this,r=n.target,s=this.rootRef.current,o=this.notchRef.current,a=n.placement||"bottom",l=ae(a),c=!!n.forceDimension,g=n.horizontalAlign,_=n.verticalAlign,h=!!n.noNotch,v=document.documentElement.clientWidth,y=document.documentElement.clientHeight,p=r?.getBoundingClientRect(),b=p?.left,f=p?.top,w=p?.width,u=p?.height;let C=n.width;n.matchWidth&&(C=w);let x=n.minWidth;n.matchMinWidth&&w!=null&&(x=Math.max(w,x||0)),(this.lastPopoverCssWidth!==C||this.lastPopoverMinWidth!==x)&&(s.style.width=C==null?"":Math.round(C)+"px",s.style.minWidth=x==null?"":Math.round(x)+"px");const k=s.getBoundingClientRect(),D=k?.width,P=k?.height,V=parseInt((window.getComputedStyle(s).borderTopLeftRadius||"").replace(/px/,""),10),ee=window.scrollX,te=window.scrollY;if(this.lastPlacement===a&&this.lastForceDimension===c&&this.lastHorizontalAlign===g&&this.lastVerticalAlign===_&&this.lastNoNotch===h&&this.lastViewportWidth===v&&this.lastViewportHeight===y&&this.lastTargetX===b&&this.lastTargetY===f&&this.lastTargetWidth===w&&this.lastTargetHeight===u&&this.lastPopoverCssWidth===C&&this.lastPopoverMinWidth===x&&this.lastPopoverWidth===D&&this.lastPopoverHeight===P&&this.lastPopoverBorderRadius===V&&this.lastScrollX===ee&&this.lastScrollY===te)return;let ne,H=null;if(b!=null&&f!=null&&w!=null&&u!=null){ne=!0;const L=h?0:En,Pe=Ve(b,w,D,v,g||"left"),Ie=Ve(f,u,P,y,_||"top");let re=[{placement:"top",x:Pe,y:f-P-L,fits:P<f-L-j},{placement:"bottom",x:Pe,y:f+u+L,fits:P<y-(f+u)-L-j},{placement:"left",x:b-D-L,y:Ie,fits:D<=b-L-j},{placement:"right",x:b+w+L,y:Ie,fits:D<=v-(b+w)-L-j}];c&&(re=re.filter(T=>ae(T.placement)===l)),re.sort((T,N)=>{const S=ae(T.placement),B=ae(N.placement);return T.fits!==N.fits?T.fits?-1:1:T.placement===a?-1:N.placement===a?1:S!==B?S===l?-1:1:T.placement==="bottom"||T.placement==="right"?-1:1});const de=re[0];let $=de.x,K=de.y;if(H=de.placement,$+=ee,K+=te,$=Math.round($),K=Math.round(K),s.style.transform=`translate3d(${$}px, ${K}px, 0px)`,!h&&o){const T=Math.max(vn,V);let N,S;if(H==="left"||H==="right"){const B=f+u/2-we/2;u<=Ue||_==="center"?S=B:S=Math.min(f,B),S+=-K+te,S=Math.max(T,Math.min(P-T,S))}else{const B=b+w/2-hn/2;w<=Ue||g==="center"?N=B:N=Math.min(b,B),N+=-$+ee,N=Math.max(T,Math.min(D-T,N))}N=N&&Math.round(N),S=S&&Math.round(S),o.style.left=N==null?"":N+"px",o.style.top=S==null?"":S+"px"}}else ne=!1,s.style.transform="translate3d(-999999px, -999999px, 0px)";ne&&!this.lastVisible&&n.onShow&&n.onShow(),H!==this.lastActualPlacement&&(this.setState({actualPlacement:H}),n.onPlacementChange&&n.onPlacementChange(H)),this.lastVisible=ne,this.lastPlacement=a,this.lastActualPlacement=H,this.lastForceDimension=c,this.lastHorizontalAlign=g,this.lastVerticalAlign=_,this.lastNoNotch=h,this.lastViewportWidth=v,this.lastViewportHeight=y,this.lastTargetX=b,this.lastTargetY=f,this.lastTargetWidth=w,this.lastTargetHeight=u,this.lastPopoverCssWidth=C,this.lastPopoverMinWidth=x,this.lastPopoverWidth=D,this.lastPopoverHeight=P,this.lastPopoverBorderRadius=V,this.lastScrollX=ee,this.lastScrollY=te}fireOnDismiss(n){const{onDismiss:r}=this.props;r&&r(n),!this.props.noTargetRefocus&&n.reason==="escape"&&this.props.target&&this.props.target.focus()}}function ae(t){return t==="left"||t==="right"?"x":"y"}function Ve(t,n,r,s,o){let a;return o==="center"?a=t+n/2-r/2:a=t,a=Math.max(a,j),a=Math.min(a,s-r-j),a=Math.max(a,t+ke-r),a=Math.min(a,t+n-ke),a}const bn=["yyyy-MM-dd","yyyy/MM/dd","MM-dd yyyy","MM/dd yyyy","MM-dd-yyyy","MM/dd/yyyy","MM-dd","MM/dd","dd MMM yyyy","dd MMMM yyyy","MMM dd yyyy","MMMM dd yyyy","dd MMM","dd MMMM","MMM dd","MMMM dd"],wn=["hh:mmaaa","hh.mmaaa","hh:mm aaa","hh.mm aaa","HH:mm","HH.mm","hhaaa","hh aaa","HH"];for(const t of bn)for(const n of wn);const _n="d MMM yyyy";function He(t){if(t==null)return"";const n=yn?t.getMinutes()===0?"h aaa":"h:mm aaa":"HH:mm";return xe(t,_n+", "+n)}function Cn(t){if(!t)return null;const n=Vt(t,"yyyy-MM-dd",new Date);return isNaN(n.valueOf())?null:n}function Be(t){if(!t)return null;const n=Ht(t);return isNaN(n.valueOf())?null:n}const yn=Intl.DateTimeFormat(Intl.DateTimeFormat().resolvedOptions().locale,{hour:"numeric"}).resolvedOptions().hourCycle==="h12";var nt=(t=>(t.EVENT="EVENT",t.GROUP="GROUP",t.GROUP_MEMBERSHIP="GROUP_MEMBERSHIP",t.USER="USER",t))(nt||{});function ce(){const[t,n]=i.useState(!1),r=i.useRef(null),s=i.useCallback(()=>n(!0),[]),o=i.useCallback(()=>n(!1),[]),a=i.useCallback(()=>n(!0),[]),l=i.useCallback(()=>n(!1),[]);return{ref:r,hovered:t,eventHandlers:{onPointerEnter:s,onPointerLeave:o,onFocus:a,onBlur:l}}}function We(t){return({condition:n})=>{throw new Error(`conditionOperators.${n.operator}.${t} is not supported`)}}const pe={[d.ABSOLUTE_EQ]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"on")," ",e.createElement("span",{className:"nowrap text-bold"},ge(t.value)))},[d.ABSOLUTE_GT]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"after")," ",e.createElement("span",{className:"nowrap text-bold"},ge(t.value)))},[d.ABSOLUTE_LT]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"before")," ",e.createElement("span",{className:"nowrap text-bold"},ge(t.value)))},[d.AND]:{Preview:We("Preview")},[d.BETWEEN]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is between")," ",e.createElement("b",null,t.value)," ",e.createElement("span",{className:"text-secondary"},"and")," ",e.createElement("b",null,t.value2))},[d.CONTAINS]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"contains")," ",e.createElement("b",null,t.value))},[d.EMPTY]:{Preview:()=>e.createElement("span",{className:"text-secondary"},"is empty")},[d.ENDS_WITH]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"ends with")," ",e.createElement("b",null,t.value))},[d.EQ]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is")," ",e.createElement("b",null,t.dataType===Fe.FLOW&&t.value?e.createElement("span",null,t?.eventDisplayName??t.eventName):t.value))},[d.EXCLUDES_ALL]:{Preview:({condition:t})=>le(t,"does not include","all of")},[d.EXCLUDES_ANY]:{Preview:({condition:t})=>le(t,"does not include","at least one of")},[d.FALSE]:{Preview:()=>e.createElement("span",{className:"text-secondary"},"is false")},[d.GT]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is greater than")," ",e.createElement("b",null,t.value))},[d.GTE]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is greater than or equal to")," ",e.createElement("b",null,t.value))},[d.INCLUDES_ALL]:{Preview:({condition:t})=>le(t,"includes","all of")},[d.INCLUDES_ANY]:{Preview:({condition:t})=>le(t,"includes","at least one of")},[d.LT]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is less than")," ",e.createElement("b",null,t.value))},[d.LTE]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is less than or equal to")," ",e.createElement("b",null,t.value))},[d.NE]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is not")," ",e.createElement("b",null,t.dataType===Fe.FLOW&&t.value?e.createElement("span",null," ",t?.eventDisplayName??t.eventName):t.value))},[d.NOT_CONTAINS]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"does not contain")," ",e.createElement("b",null,t.value))},[d.NOT_EMPTY]:{Preview:()=>e.createElement("span",{className:"text-secondary"},"has any value")},[d.NOT_REGEX]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"does not match")," ",e.createElement("b",null,t.value))},[d.OR]:{Preview:We("Preview")},[d.REGEX]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"matches")," ",e.createElement("b",null,t.value))},[d.RELATIVE_EQ]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"exactly")," ",e.createElement("span",{className:"nowrap text-bold"},fe(t.value))," ",e.createElement("span",{className:"text-secondary"},"ago"))},[d.RELATIVE_GT]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"less than")," ",e.createElement("span",{className:"nowrap text-bold"},fe(t.value))," ",e.createElement("span",{className:"text-secondary"},"ago"))},[d.RELATIVE_LT]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"more than")," ",e.createElement("span",{className:"nowrap text-bold"},fe(t.value))," ",e.createElement("span",{className:"text-secondary"},"ago"))},[d.STARTS_WITH]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"starts with")," ",e.createElement("b",null,t.value))},[d.TRUE]:{Preview:()=>e.createElement("span",{className:"text-secondary"},"is true")},[d.URL]:{Preview:({condition:t})=>{const{urlPattern:n}=t;if(!n)return e.createElement("span",{className:"text-secondary"},"matches ...");const{includes:r,excludes:s}=n;return e.createElement(e.Fragment,null,r.length>0&&e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"matches")," ",r.map((o,a)=>e.createElement(e.Fragment,{key:a},a>0&&e.createElement("span",{className:"text-secondary"},", "),e.createElement("b",null,o)))),r.length>0&&s.length>0&&e.createElement("span",{className:"text-secondary"}," and "),s.length>0&&e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"does not match")," ",s.map((o,a)=>e.createElement(e.Fragment,{key:a},a>0&&e.createElement("span",{className:"text-secondary"},", "),e.createElement("b",null,o)))))}}};function xn(t){return parseInt(t,10)}function fe(t){if(!t)return"days";const n=xn(t);return isNaN(n)?"days":n+" "+(n===1?"day":"days")}function ge(t){if(!t)return"";const n=Cn(t);return n?xe(n,"PP"):""}function le(t,n,r){const s=t.values||[];return e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},n+(s.length>1?" "+r:""))," ",s.map((o,a)=>e.createElement(e.Fragment,{key:a},a>0&&e.createElement("span",{className:"text-secondary"},", "),e.createElement("b",{key:a},o))))}const Oe=t=>({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__success":t===!0,"userflow-debugger-condition__item__danger":t===!1,"userflow-debugger-condition__item__intermediate":t===null}),De=t=>t===!0?A:t===!1?U:W,rt=(t,n)=>{const r=F();return i.useMemo(()=>{const a=(n?r?.hiddenCondition?.breakdown:r?.startCondition?.breakdown)?.find(l=>l.conditionId===t.id);return{classes:Oe(a?.match),icon:De(a?.match)}},[t,r,n])},ie=t=>{const{condition:n,isHideCond:r}=t,{classes:s,icon:o}=rt(n,r),a=n.type;if(a===O.CLAUSE)return e.createElement(Tn,{...t});const l=ot[a];return e.createElement("div",{className:E(s)},e.createElement("span",{className:"d-flex gap-8 align-center userflow-debugger-condition__item__icon"},l.icon?e.createElement(m,{icon:l.icon({condition:n})}):null,e.createElement(l.Preview,{...t})),e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:o}))},Nn=()=>{const t=F(),[n,r]=i.useState(!1),s=i.useMemo(()=>t?.hiddenCondition?.breakdown.find(a=>a.conditionId===t?.hiddenCondition?.condition.id),[t?.hiddenCondition]);return t?.hiddenCondition?.condition?e.createElement("div",{role:"button",className:E({"d-flex gap-8 flex-column margin-8":!0,"userflow-debugger-condition__clause":!0,"userflow-debugger-hide-condition__clause__success":s?.match===!0,"userflow-debugger-hide-condition__clause__danger":s?.match===!1,"userflow-debugger-hide-condition__clause__expanded":n}),onClick:o=>{r(!n),o.stopPropagation()}},e.createElement("div",{className:"d-flex gap-8 justify-space-between align-center"},e.createElement("span",null,"Termporarily hide flow"," ",e.createElement("span",{className:"userflow-debugger-info-text"},"Click to ",n?"collapse":"expand")),e.createElement(m,{icon:Z})),n&&e.createElement(ie,{isRoot:!0,isHideCond:!0,condition:t?.hiddenCondition?.condition})):null},Tn=({condition:t,isRoot:n=!1,isHideCond:r=!1})=>{const[s,o]=i.useState(!1),{classes:a,icon:l}=rt(t,r);return n?e.createElement(e.Fragment,null,t.conditions.map((c,g)=>e.createElement(ie,{isHideCond:r,key:g,condition:c}))):e.createElement("div",{role:"button",className:E({"d-flex flex-column gap-8":!0,"userflow-debugger-condition__clause":s,...s?{"userflow-debugger-condition__item__success__expanded":a["userflow-debugger-condition__item__success"],"userflow-debugger-condition__item__danger__expanded":a["userflow-debugger-condition__item__danger"],"userflow-debugger-condition__item__intermediate__expanded":a["userflow-debugger-condition__item__intermediate"]}:a}),onClick:c=>{o(!s),c.stopPropagation()}},e.createElement("div",{className:"d-flex justify-space-between align-center w-full"},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(m,{icon:Dt})," ",e.createElement("strong",null,"Logic Group")," ",e.createElement("span",{className:"userflow-debugger-info-text"},"Click to ",s?"collapse":"expand")),!s&&e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:l})),s&&e.createElement(e.Fragment,null,t.conditions.map((c,g)=>e.createElement("div",{key:g,className:E({"userflow-debugger-condition__clause__operator__wrapper":!0})},g>0&&e.createElement("div",{className:E({"userflow-debugger-condition__clause__operator":!0})},e.createElement(st,{condition:t})),e.createElement(ie,{isHideCond:r,condition:c})))))},st=({condition:t})=>{const n=t.operator;return n?e.createElement("span",{className:E({"userflow-debugger-condition__item__operator":!0,"userflow-debugger-condition__item__operator__and":n===d.AND,"userflow-debugger-condition__item__operator__or":n===d.OR})},n===d.AND&&"AND",n===d.OR&&"OR"):null},Sn={[R.NONE]:U,[R.PENDING_SCHEDULE]:U,[R.SCHEDULED]:W,[R.FIRED]:A},On=e.memo(()=>{const t=F(),{waitTimer:n}=t||{},r=t?.startCondition?.condition.waitTime,{ref:s,hovered:o,eventHandlers:a}=ce();return!r||!n||n===R.NONE?null:e.createElement("div",{ref:s,...a,className:E({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__danger":n===R.PENDING_SCHEDULE,"userflow-debugger-condition__item__intermediate":n===R.SCHEDULED,"userflow-debugger-condition__item__success":n===R.FIRED})},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(m,{icon:Ct}),e.createElement("span",null,"Wait ",e.createElement("strong",null,r)," seconds")),e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:Sn[n]}),e.createElement(ue,{target:s,hovered:o&&n===R.PENDING_SCHEDULE},"Timer activates once all conditions are satisfied"))}),Dn=e.memo(()=>{const t=F(),[n,r]=i.useState(!1),{startFrequency:s,listFlowLatestVersion:o}=t||{startFrequency:{}};if(!s||!o?.startFrequency||o?.startFrequency===z.NEVER)return null;const{currentFlowIntervalThrottle:a,frequency:l,frequencyUsage:c}=s,g=De(l),_=Oe(l);if(o.startFrequency===z.ONCE||o.startFrequency===z.ONCE_PER_GROUP)return e.createElement("div",{className:E(_)},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(m,{icon:Ye}),e.createElement("strong",null,"Once per user"," ",o.startFrequency===z.ONCE_PER_GROUP&&"per company")),e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:g}));if(o.startFrequency===z.ALWAYS&&o.startIntervalValue&&o.startIntervalUnit)return e.createElement("div",{className:E({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__success":a===!0,"userflow-debugger-condition__item__intermediate":a===!1})},e.createElement("span",null,"Every ",e.createElement("strong",null,o.startIntervalValue)," ",e.createElement("span",{className:"userflow-debugger-info-text"},be(o.startIntervalUnit,o.startIntervalValue)," ","apart")),e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:a===!1?W:A}));if(o.startFrequency===z.MULTIPLE){const h=l===!0&&a===!0,v=l===!0&&a===!1,y=l===!1;return e.createElement("div",{className:E({"d-flex flex-column gap-8":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__clause":n,...n?{"userflow-debugger-condition-frequency__success__expanded":h,"userflow-debugger-condition-frequency__intermediate__expanded":v,"userflow-debugger-condition-frequency__danger__expanded":y}:{"userflow-debugger-condition-frequency__success":h,"userflow-debugger-condition-frequency__intermediate":v,"userflow-debugger-condition-frequency__danger":y}}),onClick:p=>{r(!n),p.stopPropagation()}},e.createElement("div",{className:"d-flex gap-8 justify-space-between"},e.createElement("div",{className:"d-flex gap-8 align-center"},e.createElement("strong",null,"Start multiple times")," ",e.createElement("span",{className:"userflow-debugger-info-text"},"Click to expand")),!n&&e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:h?A:v?W:U})),n&&e.createElement(e.Fragment,null,e.createElement("div",{className:E(_)},e.createElement("span",null,e.createElement("strong",null,o.startLimit)," ",e.createElement("span",{className:"userflow-debugger-info-text"},"(started ",c," times)")),e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:g})),o.startIntervalUnit&&o.startIntervalValue&&e.createElement("div",{className:E({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__success":a===!0,"userflow-debugger-condition__item__intermediate":a===!1})},e.createElement("span",null,e.createElement("strong",null,o.startIntervalValue)," ",e.createElement("span",{className:"userflow-debugger-info-text"},be(o.startIntervalUnit,o.startIntervalValue)," ","apart")),e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:a===!1?W:A}))))}return null}),Pn=()=>{const t=F(),{priority:n}=t||{};return n?.priority?e.createElement("div",{className:E({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__priority":!0})},e.createElement("span",null,e.createElement("strong",null,ln(n?.priority))," ",e.createElement("span",{className:"userflow-debugger-info-text"},"Click to learn more")),e.createElement("a",{href:"https://docs.userflow.com/docs/trouble/using-the-debugger#flow-trigger-precedence",target:"_blank",rel:"noreferrer noopener"},e.createElement(m,{icon:je}))):null},In=()=>{const t=F(),{startFrequency:n}=t||{},{onlyIfNotCompleted:r}=n||{};return r==null?null:e.createElement("div",{className:E({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__success":r===!0,"userflow-debugger-condition__item__danger":r===!1})},"Only if not completed",e.createElement(m,{icon:r===!0?A:U}))},Fn=()=>{const t=F(),{startFrequency:n}=t||{},{hovered:r,eventHandlers:s,ref:o}=ce();return!n||n?.scopeByGroup===null||n.scopeByGroup===void 0||n.scopeByGroup===!0?null:e.createElement("div",{ref:o,...s,className:E({"d-flex align-center margin-8":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__danger":!0})},"Constrain to current company",e.createElement(m,{icon:De(n.scopeByGroup)}),e.createElement(ue,{target:o,hovered:r},"User is not associated with a company"))},Rn=()=>{const t=F(),{startFrequency:n,listFlowLatestVersion:r}=t||{},{anyFlowIntervalThrottle:s}=n||{},{throttleUnit:o,throttleValue:a}=r||{};return s===null||o===null||a===null||o===void 0||a===void 0?null:e.createElement("div",{className:E({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__success":s===!0,"userflow-debugger-condition__item__intermediate":s===!1})},e.createElement("span",null,"Atleast ",e.createElement("strong",null,r?.throttleValue)," ",be(o,a)," after any flow"),e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:s===!0?A:W}))},Ln=e.memo(()=>{const{hovered:t,eventHandlers:n,ref:r}=ce(),s=F(),{snoozed:o}=s||{},a=i.useMemo(()=>{if(o?.until)return xe(new Date(o.until),"MMM do, h:mm a")},[o?.until]);return o?e.createElement("div",{ref:r,...n,className:E({"d-flex align-center margin-8":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__intermediate":!0})},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(m,{icon:yt}),e.createElement("span",null,"This flow is currently ",e.createElement("strong",null,"snoozed"))),e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:W}),e.createElement(ue,{target:r,hovered:t},"Snoozed until ",a)):null}),ot={[O.PAGE]:{icon:()=>xt,Preview:({condition:t})=>{const n=t.operator&&pe[t.operator];return e.createElement("span",null,"URL"," ",e.createElement("strong",null,n&&e.createElement(n.Preview,{condition:t})))}},[O.ATTRIBUTE]:{icon:({condition:t})=>{if(!t||!t.attributeName)return Re(nt.EVENT);const[n]=cn(t.attributeName);return Re(n)},Preview:({condition:t})=>{const n=t.operator&&pe[t.operator];return e.createElement("span",null,e.createElement("strong",null,t.attributeDisplayName?t.attributeDisplayName:"Attribute")," ",e.createElement("span",{className:"userflow-debugger-info-text"},n&&e.createElement(n.Preview,{condition:t})))}},[O.SEGMENT]:{icon:()=>Nt,Preview:({condition:t})=>{const{segment:n}=t;return e.createElement("span",null,e.createElement("strong",null,n?.subjectType===ut.GROUP?"Company":"User")," ",e.createElement("span",{className:"text-secondary"},t.operator===d.FALSE?"is not in":"is in")," ",e.createElement("strong",null,n?.name||"Segment"))}},[O.ELEMENT]:{icon:({condition:t})=>t.elementState?Xt[t.elementState]:Tt,Preview:({condition:t})=>e.createElement("span",null,"Element"," ",t.elementState&&e.createElement("strong",null,Zt(t.elementState)))},[O.INPUT_VALUE]:{icon:()=>St,Preview:({condition:t})=>{const n=t.operator&&pe[t.operator];return e.createElement("span",null,"The value of input"," ",e.createElement("strong",null,n&&e.createElement(n.Preview,{condition:t})))}},[O.FILLED_IN_INPUT]:{icon:()=>Ot,Preview:()=>e.createElement("span",null,"User fills an input")},[O.FLOW]:{icon:({condition:t})=>t.flowState?$t[t.flowState]:ye,Preview:({condition:t})=>e.createElement("span",null,t.flow?e.createElement(e.Fragment,null,dn(t.flow.type,{title:!0})," ",e.createElement("strong",null,t.flow.name)):"Flow/checklist"," ",t.flowState&&Jt(t.flowState))},[O.TIME]:{icon:()=>Ye,Preview:({condition:t})=>{const n=t.value?Be(t.value):null,r=n&&e.createElement("strong",{style:{whiteSpace:"nowrap"}},He(n)),s=t.value2?Be(t.value2):null,o=s&&e.createElement("strong",{style:{whiteSpace:"nowrap"}},He(s));return r&&o?e.createElement("span",null,"Current time is between ",r," and ",o):r?e.createElement(e.Fragment,null,"Current time is after ",r):o?e.createElement(e.Fragment,null,"Current time is before ",o):e.createElement(e.Fragment,null,"Current time is ...")}},[O.EVENT]:{icon:()=>ze,Preview:({condition:t})=>{const{ref:n,hovered:r,eventHandlers:s}=ce();return e.createElement("div",{ref:n,...s},e.createElement("strong",null,t.eventDisplayName?t.eventDisplayName:"Event")," ",e.createElement("span",{className:"userflow-debugger-info-text"},sn(t.eventFrequencyOperator))," ",e.createElement("strong",null,t.eventFrequencyValue),t.eventFrequencyOperator===Y.BETWEEN&&e.createElement(e.Fragment,null," ",e.createElement("span",{className:"userflow-debugger-info-text"},"and")," ",e.createElement("strong",null,t.eventFrequencyValue2))," ",e.createElement("span",{className:"userflow-debugger-info-text"},tn(t),","," ",on(t.eventTimeOperator)),t.eventTimeOperator!==M.ANY&&e.createElement(e.Fragment,null," ",e.createElement("strong",null,t.eventRelativeValue),t.eventTimeOperator===M.RELATIVE_BETWEEN&&e.createElement(e.Fragment,null," ",e.createElement("span",{className:"userflow-debugger-info-text"},"and")," ",e.createElement("strong",null,t.eventRelativeValue2))," ",e.createElement("span",{className:"userflow-debugger-info-text"},en(t,t.eventRelativeUnit))),t.eventActor&&t.eventActor!==dt.CURRENT_USER?e.createElement(e.Fragment,null," ",e.createElement("strong",null,rn(t.eventActor))):"",t.whereCondition&&r&&e.createElement(ue,{hovered:!0,target:n},"Where ",e.createElement("br",null),e.createElement(at,{condition:t.whereCondition})))}},[O.ALWAYS_TRUE]:{icon:()=>A,Preview:()=>e.createElement("span",null,"Water is wet")},[O.CHECKLIST_TASK_CLICKED]:{icon:()=>qe,Preview:()=>e.createElement("span",null,"Task is clicked")}},at=t=>e.createElement("div",null,t.condition.conditions.map((n,r)=>e.createElement("div",{key:n.id}," ",r===0?null:e.createElement("span",{className:"userflow-debugger-info-text"},t.condition.operator?.toLowerCase())," ",n.type==="ATTRIBUTE"&&ot.ATTRIBUTE.Preview({condition:n,isRoot:!0,isHideCond:!1}),n.type==="CLAUSE"&&e.createElement(e.Fragment,null,"(",e.createElement(at,{condition:n}),")")))),ue=({hovered:t,children:n,target:r})=>{const s=Ne();return t?e.createElement(tt,{className:"userflow-debugger-popover",target:r.current,placement:"top",horizontalAlign:"center",verticalAlign:"center",document:s?.current?.contentDocument||void 0},n):null};class Mn extends e.PureComponent{constructor(n){super(n),this.rootRef=e.createRef(),this.optionsElRef=e.createRef(),this.input=null,this.popoverRef=e.createRef(),this.isMouseDown=!1,this.isCreateOpen=!1,this.setInput=r=>{this.input=r;const{inputRef:s}=this.props;s&&(typeof s=="function"?s(r):s.current=r)},this.onInputChange=r=>{r.stopPropagation();const{value:s}=r.target;s!==""&&this.openPopover();const o=this.memoizedFilterOptions(this.props.options,s);this.setState({inputValue:s,q:s,highlightedIndex:o.length>0?0:-1,createHighlighted:o.length===0}),s===""&&!this.props.noEmpty&&this.triggerOnChange(null),this.props.onSearchChange&&this.props.onSearchChange(s)},this.onPopoverPlacementChange=r=>this.setState({popoverPlacement:r}),this.onMouseDown=r=>{r.preventDefault(),this.isMouseDown=!0;const s=()=>{this.isMouseDown=!1,this.props.document?.removeEventListener("mouseup",s),document.body.removeEventListener("mouseup",s)};this.props.document?.addEventListener("mouseup",s),document.body.addEventListener("mouseup",s)},this.onFocus=r=>{this.input&&!this.props.noSearch&&this.input.select(),this.props.onFocus&&this.props.onFocus(r)},this.onBlur=r=>{this.isMouseDown||this.closePopover(),this.props.onBlur&&!this.isCreateOpen&&this.props.onBlur(r)},this.onTriggerClick=()=>{this.props.readOnly||this.props.disabled||(this.state.popoverOpen?this.closePopover():(this.input&&this.input.focus(),this.openPopover()))},this.onKeyDown=r=>{const{popoverOpen:s,highlightedIndex:o,createHighlighted:a}=this.state,l=this.getFilteredOptions(),c=l.length-1;switch(r.key){case"ArrowUp":r.preventDefault(),s&&(a?this.setState({highlightedIndex:c,createHighlighted:!1}):o>0&&this.setState({highlightedIndex:o-1}));break;case"ArrowDown":r.preventDefault(),s?this.props.onCreate&&(o===c||a)?this.setState({highlightedIndex:-1,createHighlighted:!0}):o<c&&this.setState({highlightedIndex:o+1}):this.props.noOpenOnDown||this.openPopover();break;case"Enter":if(s)if(r.preventDefault(),a)this.fireOnCreate();else{const g=l[o];(g||!this.props.noEmpty)&&this.selectOption(g)}else this.props.onEnter?this.props.onEnter():this.openPopover();break;case"Tab":s&&this.selectOption(l[o]);break;case"Escape":s&&(r.preventDefault(),r.stopPropagation(),this.setState({popoverOpen:!1}));break}},this.selectOption=r=>{r===this.props.value?this.setState({popoverOpen:!1,inputValue:this.renderOptionText(r),q:""}):(this.setState({popoverOpen:!1,inputValue:"",q:""}),this.triggerOnChange(r))},this.highlightOption=r=>{this.setState({highlightedIndex:r,createHighlighted:!1})},this.highlightCreate=()=>{this.setState({highlightedIndex:-1,createHighlighted:!0})},this.fireOnCreate=()=>{const{onCreate:r}=this.props;if(r){this.isCreateOpen=!0;const s={q:Ee.upperFirst(this.state.q),callback:o=>{this.isCreateOpen=!1,o!=null&&this.selectOption(o),this.input&&this.input.focus()}};r(s),this.closePopover()}},this.openPopover=()=>{if(!this.state.popoverOpen){const r=this.getFilteredOptions();let s=0,o=!1;if(r.length===0)s=-1,o=!0;else{const{value:a}=this.props,l=r.findIndex(c=>c===a);l!==-1&&(s=l)}this.setState({popoverOpen:!0,highlightedIndex:s,createHighlighted:o})}},this.memoizedFilterOptions=Bt((r,s)=>(r=r||[],s?r.filter(o=>this.filter(o,s)):r)),this.state={inputValue:this.renderOptionText(n.value==null?null:n.value),q:"",popoverOpen:!1,popoverPlacement:null,highlightedIndex:-1,createHighlighted:!1}}componentDidUpdate(n,r){const{value:s}=this.props;if(s!==n.value){const o=this.renderOptionText(s??null);o!==this.state.inputValue&&this.setState({inputValue:o})}r.highlightedIndex!==this.state.highlightedIndex&&this.scrollHighlightedOptionIntoView()}render(){let n;const{props:r}=this,s=this.state,o=s.popoverPlacement==="top"?"above":"below";if(s.popoverOpen&&this.rootRef.current){const l=this.getFilteredOptions();let c;if(l.length>0){let g=null;c=l.reduce((_,h,v)=>{const y=this.getOptionGroup(h);y&&y!==g&&_.push(e.createElement("div",{key:"group:"+y,className:"combo-box__group-header"},y)),g=y;const p=["combo-box__option"];return v===s.highlightedIndex&&p.push("combo-box__option--highlighted"),_.push(e.createElement(An,{key:this.getOptionKey(h,v),className:p.join(" "),option:h,idx:v,renderOptionText:r.renderOptionText,renderOptionItem:r.renderOptionItem,getOptionIcon:r.getOptionIcon,onClick:this.selectOption,onHover:this.highlightOption})),r.hasSeparatorAfter&&r.hasSeparatorAfter(h)&&_.push(e.createElement("div",{key:"sep-"+v,className:"combo-box__option-sep"})),_},[])}else r.loading?c=e.createElement("div",{className:"combo-box__no-results"},"Loading..."):c=e.createElement("div",{className:"combo-box__no-results"},"No matching ",r.nounPlural||"items");n=e.createElement(tt,{ref:this.popoverRef,className:"combo-box-popover"+(r.popoverNotch?"":` combo-box-popover--${o}`),noNotch:!r.popoverNotch,target:this.rootRef.current,forceDimension:!0,matchWidth:!0,minWidth:r.popoverMinWidth,onMouseDown:this.onMouseDown,onPlacementChange:this.onPopoverPlacementChange,document:r.document},e.createElement("div",{ref:this.optionsElRef,className:E({"combo-box__options":!0,"combo-box__options--with-create":!!r.onCreate})},c),r.onCreate&&e.createElement("div",{key:"create",className:E({"combo-box__option":!0,"combo-box__option--create":!0,"combo-box__option--highlighted":s.createHighlighted}),onClick:this.fireOnCreate,onMouseMove:this.highlightCreate},e.createElement("div",{className:"combo-box__create-icon"},e.createElement(ve,{icon:Pt})),e.createElement("div",{className:"combo-box__create-text"},"Create"," ",s.q===""?"new"+(r.noun?` ${r.noun}`:""):e.createElement("b",null,Ee.upperFirst(s.inputValue)))))}const a=["input-group","combo-box"];return s.popoverOpen&&(a.push("combo-box--open"),r.popoverNotch||a.push(`combo-box--with-popover-${o}`)),r.disabled&&a.push("input-group--disabled"),r.noSearch&&a.push("combo-box--no-search"),r.className&&a.push(r.className),e.createElement(e.Fragment,null,e.createElement("div",{className:a.join(" "),style:{width:r.width?r.width+"px":void 0},ref:this.rootRef,onClick:r.readOnly||r.disabled?void 0:()=>{this.input?.focus(),this.openPopover()}},r.childrenBefore,r.value&&r.getOptionIcon&&e.createElement("div",{className:"combobox__input-icon"},it(r.value,r.getOptionIcon)),e.createElement("input",{type:"text",className:r.inputClassName,name:r.name,value:s.inputValue,onChange:this.onInputChange,onFocus:this.onFocus,onBlur:this.onBlur,onKeyDown:this.onKeyDown,onMouseDown:this.openPopover,placeholder:r.placeholder,readOnly:r.readOnly||r.noSearch,disabled:r.disabled,autoComplete:"off",ref:this.setInput,...r.inputHtmlAttributes}),!r.noTrigger&&e.createElement("div",{"data-testid":r.triggerTestId||"combo-box-trigger",className:"input-group__append input-group__trigger",onClick:this.onTriggerClick,onMouseDown:this.onMouseDown},e.createElement(ve,{icon:It})),r.childrenAfter),n)}scrollHighlightedOptionIntoView(){const n=this.optionsElRef.current;if(this.state.popoverOpen&&n){const r=n.querySelector(".combo-box__option--highlighted");if(r){const s=n.getBoundingClientRect(),o=r.getBoundingClientRect();o.top<s.top?n.scrollTop+=o.top-s.top:o.bottom>s.bottom&&(n.scrollTop+=o.bottom-s.bottom)}}}triggerOnChange(n){const{onChange:r}=this.props;r&&r(n)}closePopover(){this.setState({popoverOpen:!1,inputValue:this.renderOptionText(this.props.value==null?null:this.props.value),q:""})}renderOptionText(n){return n==null?"":lt(n,this.props.renderOptionText)}getFilteredOptions(){return this.memoizedFilterOptions(this.props.options,this.state.q)}filter(n,r){return this.props.filter?this.props.filter(n,r):this.renderOptionText(n).toLowerCase().includes(r.toLowerCase())}getOptionKey(n,r){return n&&n.id||r}getOptionGroup(n){return this.props.getOptionGroup?this.props.getOptionGroup(n):n&&n.group||null}}class An extends e.PureComponent{constructor(){super(...arguments),this.state={isOptionDisabled:!1},this.onClick=()=>{this.state.isOptionDisabled||this.props.onClick(this.props.option)},this.onHover=()=>{this.state.isOptionDisabled||this.props.onHover(this.props.idx)}}componentDidMount(){const n=this.props.option!==void 0&&typeof this.props.option=="object"&&this.props.option!==null&&"disabled"in this.props.option&&this.props.option.disabled===!0;this.setState({isOptionDisabled:n})}componentDidUpdate(){const n=this.props.option!==void 0&&typeof this.props.option=="object"&&this.props.option!==null&&"disabled"in this.props.option&&this.props.option.disabled===!0;this.setState({isOptionDisabled:n})}render(){const{isOptionDisabled:n}=this.state,{props:r}=this;return e.createElement("div",{className:E({[r.className]:!0,"combo-box__option--disabled":n}),onClick:this.onClick,onMouseMove:this.onHover},Un(r.option,r.renderOptionText,r.renderOptionItem,r.getOptionIcon))}}function lt(t,n){return n?n(t):typeof t=="string"||typeof t=="number"?t:t?t.name:"?"}function Un(t,n,r,s){if(r)return r(t);{let o=lt(t,n);return s?e.createElement("div",{className:"d-flex align-flex-start"},e.createElement("div",{className:"combobox__option-icon"},it(t,s)),e.createElement("div",{className:"flex-1"},o)):o}}function it(t,n){const r=n(t);return kn(r)?e.createElement(ve,{icon:r}):r}function kn(t){return Wt(t)&&"iconName"in t}const Vn=({selectedFlow:t,setSelectedFlow:n,flows:r,debugAutoStartCondition:s})=>{const o=q(),a=Ne();i.useEffect(()=>{if(!t)return;s(t.latestVersion);const c=()=>{s(t.latestVersion)};return o.on("private:checkSessionsAck",c),document.addEventListener("visibilitychange",c),()=>{o.off("private:checkSessionsAck",c),document.removeEventListener("visibilitychange",c)}},[t]);const l=i.useCallback(c=>{!c||t?.latestVersion?.id===c.latestVersion.id||n(c)},[t]);return e.createElement(e.Fragment,null,e.createElement("div",{className:"d-flex align-center justify-space-between"},e.createElement("div",{className:"d-flex justify-space-between align-center"},"Select Flow"),e.createElement(Mn,{className:"userflow-debugger__flow__selector",value:t,options:r,placeholder:"Select flow",document:a?.current?.contentDocument||void 0,onChange:l,renderOptionItem:c=>c.name})),e.createElement(Hn,{selectedFlow:t,selectedFlowVersionsId:t?.latestVersion?.id}))},Hn=({selectedFlowVersionsId:t,selectedFlow:n})=>{const r=q(),[s,o]=i.useState(!1),a=F(),l=a&&a?.activeFlow?.id===n?.id;return i.useEffect(()=>(o(!1),r.on("private:setFlowSession",c=>{o(c===t)}),()=>{r.off("private:setFlowSession",()=>o(!1))}),[t]),i.useEffect(()=>{l||o(!1)},[l]),a?.activeFlow===null?null:e.createElement(e.Fragment,null,a?.locale?.match===!1&&e.createElement("div",{className:E(Oe(!1))},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(m,{icon:U}),e.createElement("span",null,"The flow will not auto start ",e.createElement("br",null)," ",e.createElement("b",null,"User locale (",a?.locale?.code,") is not enabled.")))),s?e.createElement("div",{className:E({"d-flex align-center fade-in":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__flow__status":!0})},e.createElement("span",{className:"d-flex align-center gap-8"},e.createElement(m,{icon:Z}),e.createElement("span",null,"This flow ",e.createElement("strong",null,"just")," started"))):null,l&&!s&&e.createElement("div",{className:E({"userflow-debugger-condition__item":!0,"userflow-debugger-condition__flow__status":!0})},e.createElement("span",{className:"d-flex align-center gap-8"},e.createElement(m,{icon:Z}),e.createElement("span",null,"This flow is currently active"))),!l&&a&&e.createElement("div",{className:E({"userflow-debugger-condition__item":!0,"userflow-debugger-condition__flow__status":!0})},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(m,{icon:Z,size:16}),e.createElement("span",null,"Another flow is currently active"))))},Bn=({close:t})=>{const n=q(),r=i.useRef(null),[s,o]=i.useState(!!n.clientToken),[a,l]=i.useState(()=>{const u=n.getSessionStorageState(),C=u?.debuggerApp?.x,x=u?.debuggerApp?.y||50;return{x:C??(document.body.clientWidth?Number(document.body.clientWidth)-450:50),y:x}}),[c,g]=i.useState(!1),_=i.useRef(null),{meta:h}=J(),{debuggerRoute:v}=Te(),[y,p]=i.useState(!1),b=i.useRef(null),f=i.useRef({mouseX:0,mouseY:0,elementX:0,elementY:0});i.useEffect(()=>{a&&n.setSessionStorageState(u=>({...u,debuggerApp:{...u.debuggerApp,x:a.x,y:a.y}}))},[a]),i.useEffect(()=>{if(!c)return;const u=x=>{const k=x.clientX-f.current.mouseX,D=x.clientY-f.current.mouseY,P=Math.min(f.current.elementX+k,window.document.body.clientWidth-200),V=Math.max(f.current.elementY+D,0);b.current||(b.current=requestAnimationFrame(()=>{l({x:P,y:V}),b.current=null}))},C=()=>{g(!1)};return document.addEventListener("mousemove",u),document.addEventListener("mouseup",C),()=>{document.removeEventListener("mousemove",u),document.removeEventListener("mouseup",C),b.current&&(cancelAnimationFrame(b.current),b.current=null)}},[c,a]),i.useEffect(()=>{const u=()=>{l(x=>{const k=document.body.clientWidth-500,D=document.body.clientHeight-100,P=Math.max(Math.min(x.x,k),0),V=Math.max(Math.min(x.y,D),0);return{x:P,y:V}})},C=()=>{o(!!n.clientToken)};return window.addEventListener("resize",u),n.on("private:initialised",C),()=>{window.removeEventListener("resize",u),n.off("private:initialised",C)}},[]);const w=u=>{r.current&&(g(!0),u.preventDefault())};return e.createElement("div",{ref:r,style:{left:"0",top:"0",position:"absolute",willChange:"transform",transform:`translate3d(${a.x}px, ${a.y}px, 0)`,zIndex:1234620}},e.createElement("div",{onMouseDown:w,style:{height:"50px",cursor:"move",userSelect:"none",position:"absolute",width:"50px"}}),e.createElement(ft,{title:"Debugger",stylesheet:qt,style:{borderRadius:"8px",width:"400px",height:v==="checkAutoStart"?"600px":s?"500px":"400px"},elRef:_,onStylesheetsLoad:p},e.createElement(Ke.Provider,{value:_},e.createElement("div",{className:"d-flex flex-column userflow-debugger-app",style:{visibility:y?"visible":"hidden"}},e.createElement("div",{className:"d-flex justify-space-between userflow-debugger-app__header"},e.createElement(Yt,null),e.createElement("div",{className:"d-flex align-center userflow-debugger-app__title"},e.createElement(gt,null),e.createElement("span",null,"Userflow debugger")),e.createElement("button",{role:"button",className:"userflow-debugger-app__close",onClick:()=>{n.getSessionStorageState().debuggerApp&&n.setSessionStorageState(u=>({...u,debuggerApp:null})),t()}},e.createElement("svg",{width:16,height:16,viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.createElement("path",{d:"M12.1836 4.49609L8.90234 7.77734L12.1562 11.0312C12.4297 11.2773 12.4297 11.6875 12.1562 11.9336C11.9102 12.207 11.5 12.207 11.2539 11.9336L7.97266 8.67969L4.71875 11.9336C4.47266 12.207 4.0625 12.207 3.81641 11.9336C3.54297 11.6875 3.54297 11.2773 3.81641 11.0039L7.07031 7.75L3.81641 4.49609C3.54297 4.25 3.54297 3.83984 3.81641 3.56641C4.0625 3.32031 4.47266 3.32031 4.74609 3.56641L8 6.84766L11.2539 3.59375C11.5 3.32031 11.9102 3.32031 12.1836 3.59375C12.4297 3.83984 12.4297 4.25 12.1836 4.49609Z",fill:"white"})))),e.createElement(Wn,null),v==="verifySetup"&&e.createElement(qn,null),h?.endUser?.debuggerEnabled&&v==="checkAutoStart"&&e.createElement(Gn,null),v==="currentUser"&&e.createElement(zn,null)))))},Wn=()=>{const t=q(),{meta:n}=J(),[r,s]=i.useState(!1),{debuggerRoute:o,setDebuggerRoute:a}=Te(),l=t.isIdentified(),c=zt(()=>s(!1));return i.useEffect(()=>{n&&n?.endUser.debuggerEnabled===!1&&o==="checkAutoStart"&&a("verifySetup")},[n]),l?e.createElement("div",{ref:c},e.createElement("div",{className:"d-flex align-center justify-space-between userflow-debugger-menu",onClick:()=>s(!r)},e.createElement("div",{className:E({"d-flex align-center":!0,"userflow-debugger-menu__title":!0,"userflow-debugger-menu__title--open":r})},e.createElement(m,{icon:oe[o].icon}),e.createElement("span",null,oe[o].name)),e.createElement("button",{className:"userflow-debugger-menu__toggle"},e.createElement(m,{icon:Ft}))),r&&e.createElement("ul",{className:"userflow-debugger-menu__list"},Object.keys(oe).map(g=>{if(!n?.endUser?.debuggerEnabled&&g==="checkAutoStart")return null;const _=oe[g];return e.createElement("li",{key:g,className:"d-flex align-center userflow-debugger-app__item",onClick:()=>{a&&a(g),s(!1)}},e.createElement(m,{icon:_.icon}),_.name)}))):null},qn=()=>{const{meta:t,buildId:n}=J(),r=q(),[s,o]=i.useState(!!r.clientToken),a=i.useMemo(()=>r.isIdentified(),[r,t]),{setDebuggerRoute:l}=Te();i.useEffect(()=>{const h=()=>{o(!!r.clientToken)};return r.on("private:initialised",h),()=>{r.off("private:initialised",h)}},[]);const c=i.useMemo(()=>{let h=me;const v={"d-flex flex-column gap-8":!0,"userflow-debugger-installation__step":!0};return s?(h=X,v["userflow-debugger-installation__step__success"]=!0):(h=At,v["userflow-debugger-installation__step__danger"]=!0),{icon:h,classes:v}},[s]),g=i.useMemo(()=>{let h=me;const v={"d-flex flex-column gap-8":!0,"userflow-debugger-installation__step":!0};return!s&&!a&&(h=me,v["userflow-debugger-installation__step__failed"]=!0),s&&!a&&(h=Z,v["userflow-debugger-installation__step__warning"]=!0),s&&a&&(h=X,v["userflow-debugger-installation__step__success"]=!0),{icon:h,classes:v}},[s,a]),_=()=>a?t?.endUser.debuggerEnabled?e.createElement(e.Fragment,null,e.createElement("span",{className:"userflow-debugger-details"},t?.env.company.name),e.createElement("span",{className:"userflow-debugger-details"},t?.env.name)):e.createElement("div",{className:"userflow-debugger-details__access__denied"},"The"," ",e.createElement("button",{onClick:()=>l("currentUser")},"currently signed-in user")," ","does not have debugger access"):e.createElement(e.Fragment,null,e.createElement("span",{className:"userflow-debugger-details"},"Unknown company"),e.createElement("span",{className:"userflow-debugger-details"},"Unknown environment"));return e.createElement("div",{className:"space-evenly userflow-debugger-app__content"},e.createElement("div",{className:"userflow-debugger-installation__steps"},e.createElement("div",{className:E({"d-flex gap-8 flex-column":!0,"userflow-debugger-installation__step":!0,"userflow-debugger-installation__step__success":!0})},e.createElement(m,{icon:X,size:32}),"Userflow ",e.createElement("br",null),"installed"),e.createElement("div",{className:E(c.classes)},e.createElement(m,{icon:c.icon,size:32}),"Userflow ",e.createElement("br",null)," ",s?"":"not"," initialized"),e.createElement("div",{className:E(g.classes)},e.createElement(m,{icon:g.icon,size:32}),"User ",e.createElement("br",null)," ",a&&s?"":"not"," ","identified")),!s&&!a&&e.createElement("div",{className:E({"d-flex gap-8 flex-column":!0,"userflow-debugger-installation__not__initialized":!0})},"Remember to initialize Userflow by calling",e.createElement("div",null,"userflow.init('YOUR_USERFLOW_TOKEN')")),s&&e.createElement("div",{className:"d-flex gap-8 flex-column userflow-debugger-details__wrapper"},e.createElement("div",{className:"userflow-debugger-details__env__details"},e.createElement("div",{className:"d-flex gap-8 flex-column justify-space-around"},e.createElement(m,{size:20,icon:Rt}),e.createElement(m,{size:20,icon:Lt})),e.createElement("div",{className:"d-flex flex-column align-flex-start gap-8"},_())),e.createElement("div",{className:"d-flex gap-8 align-center"},e.createElement(m,{size:20,icon:Mt}),e.createElement("span",{className:"userflow-debugger-details"},r.getInitToken())),e.createElement("div",{className:"d-flex gap-8 align-center"},e.createElement(m,{size:20,icon:Ce}),e.createElement("span",{className:"userflow-debugger-details"},a?r.getIdentifiedUser()?.externalId:"User not identified"))),e.createElement("div",{className:"userflow-debugger-installation__version"},e.createElement("a",{href:"https://docs.userflow.com/docs/dev/userflow-js-installation",target:"_blank",rel:"noreferrer"},"Visit the Userflow Developer Docs for help")," ",e.createElement("br",null),"Userflow.js version 0.1.",n))},Gn=()=>{const t=q(),{debuggerClientConditions:n}=J(),[r,s]=i.useState(void 0),[o,a]=i.useState([]),[l,c]=i.useState(),g=i.useMemo(()=>{if(l?.startCondition?.match===!1||l?.hiddenCondition?.match===!1||l?.locale?.match===!1)return!1;const p=l?.startFrequency;return!(p&&(p.onlyIfNotCompleted===!1||p.scopeByGroup===!1||p.frequency===!1))},[l]);i.useEffect(()=>(y().then(p=>{if(p?.length&&(a(p),!r)){const b=t.getSessionStorageState()?.debuggerApp?.selectedFlowVersionId,f=p.find(w=>w.latestVersion.id===b);h(f??p[0])}}),document.addEventListener("visibilitychange",y),()=>{document.removeEventListener("visibilitychange",y)}),[]),i.useEffect(()=>{r&&v(r.latestVersion)},[r]);const _=Xe.debounce(async p=>{const b=[];for(const[u,C]of n.entries())b.push({conditionId:u,isTrue:C.isTrue});const f={kind:"DebugFlowAutostartCondition",flowVersionId:p.id,clientConditions:b},w=await t.send(f);c({...w,listFlowLatestVersion:p}),w.latestVersion?.id&&p.id!==w.latestVersion?.id&&(y().then(u=>{if(!u)return;a(u);const C=u?.find(x=>x.latestVersion.id===w.latestVersion?.id);C&&h(C)}),_(w.latestVersion))},300),h=p=>{s(p);const b=t.getSessionStorageState().debuggerApp;b&&b?.x&&t.setSessionStorageState(f=>({...f,debuggerApp:{...b,selectedFlowVersionId:p.latestVersion.id}}))},v=async p=>{n.forEach(f=>{f.untrack?.()}),n.clear();const{conditionTypes:b}=await mt(async()=>{const{conditionTypes:f}=await import("./flow-condition-types.js").then(w=>w.f);return{conditionTypes:f}},__vite__mapDeps([0,1,2,3,4,5,6,7]));for(const f of p.clientConditions){n.set(f.id,{condition:f,isTrue:null});const w=b[f.type];if(!w){console.error(`Unknown condition type ${f.type}`);continue}const u=n.get(f.id);u&&(u.untrack=w.track({sessionData:new pt([]),condition:f,callback:C=>{u.isTrue!==C&&(u.isTrue=C,_(p))}}))}},y=async()=>{try{return(await t.send({kind:"ListFlows",hasAutostartCondition:!0},{handlesRejection:!0})).flows?.filter(f=>f.type==="FLOW")}catch(p){p.code==="debugger_access_denied"&&_e("Access defined for List Flows");return}};return e.createElement("div",{className:"userflow-debugger-app__content"},e.createElement($e.Provider,{value:l},e.createElement(Vn,{flows:o,selectedFlow:r,setSelectedFlow:h,debugAutoStartCondition:_}),e.createElement("div",{className:"d-flex flex-column gap-8 userflow-debugger-app__wrapper"},l?.startCondition?.condition&&e.createElement("div",null,e.createElement("div",{className:E({"d-flex gap-8 align-center":!0,"userflow-debugger-app__wrapper__passing":g,"userflow-debugger-app__wrapper__failed":!g})},e.createElement(m,{icon:g?Ut:kt}),e.createElement("strong",null,"Auto-start conditions")),e.createElement("span",null,"These are"," ",e.createElement(st,{condition:l.startCondition.condition}),e.createElement("b",null,"-conditions"),", meaning"," ",l.startCondition.condition.type==="CLAUSE"&&l.startCondition.condition.operator==="AND"&&e.createElement(e.Fragment,null,"all conditions must pass for the flow to start."),l.startCondition?.condition.type==="CLAUSE"&&l.startCondition.condition.operator==="OR"&&e.createElement(e.Fragment,null,"only one condition must pass for the flow to start."))),l?.startCondition?.condition&&e.createElement(ie,{isRoot:!0,isHideCond:!1,condition:l.startCondition.condition}),e.createElement(On,null),e.createElement(Dn,null),e.createElement(In,null),e.createElement(Rn,null),e.createElement(Pn,null),e.createElement(Nn,null),e.createElement(Fn,null),e.createElement(Ln,null))))},zn=e.memo(()=>{const{meta:t,buildId:n}=J();if(!t)return null;const r="https://app.userflow.com/app/"+t.env.company.slug+"/settings/debugger?external_id="+t.endUser.externalId;return e.createElement("div",{className:"d-flex flex-column space-evenly flex-1"},e.createElement("div",{className:"d-flex flex-column gap-8"},e.createElement("div",{className:"d-flex flex-column"},t.endUser.avatarUrl?e.createElement("img",{src:t.endUser.avatarUrl,className:"userflow-debugger-user__image"}):e.createElement("div",{className:"userflow-debugger-user__image"}),e.createElement("span",{className:"userflow-debugger-user__name"},t.endUser?.name||"Unknown name"),e.createElement("span",{className:"userflow-debugger-user__email"},t?.endUser?.email||"Unknown email address"),(!t.endUser.email||!t.endUser.name)&&e.createElement("span",{className:"userflow-debugger__external__id"},t.endUser.externalId)),!t.endUser.debuggerEnabled&&e.createElement(e.Fragment,null,e.createElement("div",{className:"userflow-debugger-user__info"},"This user doesn't have access to the Userflow debugger. You can grant access through the debugger settings in Userflow."),e.createElement("a",{className:"userflow-debugger-user__button",href:r,target:"_blank",rel:"noreferrer"},"Grant access in Userflow ",e.createElement(m,{icon:je})))),e.createElement("div",{className:"userflow-debugger-installation__version"},e.createElement("a",{href:"https://docs.userflow.com/docs/dev/userflow-js-installation",target:"_blank",rel:"noreferrer"},"Visit the Userflow Developer Docs for help")," ",e.createElement("br",null),"Userflow.js version 0.1.",n))});class br{constructor(n,r){this.client=n,this.buildId=r,this.debuggerClientConditions=new Map}mount(){if(this.container)throw new Error("UI has already been mounted");this.container=document.createElement("div"),this.container.id="userflow-debugger-ui",document.body.appendChild(this.container),he.render(e.createElement(Yn,{client:this.client,debuggerClientConditions:this.debuggerClientConditions,buildId:this.buildId,unmount:()=>this.unmount()}),this.container)}unmount(){this.container&&(he.unmountComponentAtNode(this.container),document.body.contains(this.container)&&document.body.removeChild(this.container),this.client.unMountDebugger(),delete this.container)}}const Yn=({client:t,debuggerClientConditions:n,buildId:r,unmount:s})=>{const[o,a]=i.useState(void 0),l=Xe.debounce(async()=>{try{const c=await t.send({kind:"GetCurrentEndUser"},{handlesRejection:!0});a(c)}catch(c){c.code==="debugger_access_denied"&&_e("debugger access denied"),a(void 0)}},300);return i.useEffect(()=>(l(),document.addEventListener("visibilitychange",l),t.on("private:identified",l),()=>{document.removeEventListener("visibilitychange",l),t.off("private:identified",l)}),[]),e.createElement(ct.Provider,{value:t},e.createElement(Ze.Provider,{value:{meta:o,debuggerClientConditions:n,buildId:r}},e.createElement(Gt,null,e.createElement(Bn,{close:s}))))};export{br as DebuggerUI};
|
|
2
|
+
import{r as i,R as e}from"./vendor.react.js";import{r as ue}from"./vendor.react-dom.js";import{u as L,U as Re}from"./client-context.js";import{d as ne,a as P,b as O,c as U,e as H,f as u,A as de,W as T,g as R,h as N,S as Ue,i as Ae,_ as Me,j as ke}from"./userflow.js";import{F as Ve}from"./Frame.js";import{S as He}from"./logomark.js";import{f as A,a as Be,b as re,c as Ee,d as I,e as qe,g as he,h as se,i as Ge,j as We,k as be,l as je,m as ze,n as F,o as D,p as Ye,q as ve,r as Xe,s as Ke,t as Ze,u as $e,v as Qe,w as Je,x as M,y as et,z as _e,A as tt,B as nt,C as rt,D as st,E as at,F as ot,G as lt,H as Z,I as it}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{f as ct,a as ut}from"./vendor.fortawesome.pro-solid-svg-icons.js";import{D as d}from"./stylesheets.js";import{o as g}from"./vendor.obj-str.js";import"./vendor.core-js.js";import{_ as ee,l as we}from"./vendor.lodash.js";import{F as G}from"./vendor.fortawesome.react-fontawesome.js";import{P as Ce}from"./Popover.js";import"./vendor.react-day-picker.js";import{f as ae,p as dt,a as mt}from"./vendor.date-fns.js";import{m as pt}from"./vendor.memoize-one.js";import{c as gt}from"./roots.js";import"./vendor.object-assign.js";import"./vendor.scheduler.js";import"./vendor.i18next.js";import"./vendor.babel.runtime.js";import"./vendor.react-i18next.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./flow-condition-types.js";import"./vendor.fortawesome.fontawesome-svg-core.js";(function(){try{var t=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},n=new Error().stack;n&&(t._sentryDebugIds=t._sentryDebugIds||{},t._sentryDebugIds[n]="3f6d38a5-a15d-4858-ae93-7cdb6e4d82af",t._sentryDebugIdIdentifier="sentry-dbid-3f6d38a5-a15d-4858-ae93-7cdb6e4d82af")}catch{}})();const ft=new URL("debugger.css",import.meta.url).href,ye=i.createContext(void 0),x=()=>i.useContext(ye),Ne=i.createContext(null),oe=()=>i.useContext(Ne),xe=i.createContext({debuggerClientConditions:new Map,meta:void 0,buildId:void 0}),k=()=>i.useContext(xe),B={verifySetup:{name:"Verify setup",icon:A},checkAutoStart:{name:"Check auto-start",icon:Be},currentUser:{name:"Current user",icon:re}},Se=i.createContext(void 0),Et=({children:t})=>{const n=L(),[s,r]=i.useState(n.getSessionStorageState().debuggerApp?.selectedTab??"verifySetup");return i.useEffect(()=>{n.setSessionStorageState(a=>!a.debuggerApp||!a.debuggerApp.x?a:{...a,debuggerApp:{...a.debuggerApp,selectedTab:s}}),ne("Debugger Route changed to",s)},[s]),e.createElement(Se.Provider,{value:{debuggerRoute:s,setDebuggerRoute:r}},t)},le=()=>{const t=i.useContext(Se);if(t===void 0)throw new Error("useDebuggerRouteHandler must be used within a DebuggerRouteProvider");return{debuggerRoute:t.debuggerRoute,setDebuggerRoute:t.setDebuggerRoute}},ht=t=>{const n=i.useRef(null),s=oe();return i.useEffect(()=>{const r=s?.current,a=o=>{n.current&&!n.current.contains(o.target)&&t(o)};return document.addEventListener("mousedown",a),r?.contentDocument?.addEventListener("mousedown",a),()=>{document.removeEventListener("mousedown",a),r?.contentDocument?.removeEventListener("mousedown",a)}},[t,s,n]),n},bt=()=>e.createElement("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.createElement("path",{d:"M18.4393 5.56066C18.158 5.27936 18 4.89782 18 4.5C18 4.10218 18.158 3.72064 18.4393 3.43934C18.7206 3.15804 19.1022 3 19.5 3C19.8978 3 20.2794 3.15804 20.5607 3.43934C20.842 3.72064 21 4.10218 21 4.5C21 4.89782 20.842 5.27936 20.5607 5.56066C20.2794 5.84196 19.8978 6 19.5 6C19.1022 6 18.7206 5.84196 18.4393 5.56066Z",fill:"#537388"}),e.createElement("path",{d:"M3.43934 5.56066C3.15804 5.27936 3 4.89782 3 4.5C3 4.10218 3.15804 3.72064 3.43934 3.43934C3.72064 3.15804 4.10218 3 4.5 3C4.89782 3 5.27936 3.15804 5.56066 3.43934C5.84196 3.72064 6 4.10218 6 4.5C6 4.89782 5.84196 5.27936 5.56066 5.56066C5.27936 5.84196 4.89782 6 4.5 6C4.10218 6 3.72064 5.84196 3.43934 5.56066Z",fill:"#537388"}),e.createElement("path",{d:"M10.9393 13.0607C10.658 12.7794 10.5 12.3978 10.5 12C10.5 11.6022 10.658 11.2206 10.9393 10.9393C11.2206 10.658 11.6022 10.5 12 10.5C12.3978 10.5 12.7794 10.658 13.0607 10.9393C13.342 11.2206 13.5 11.6022 13.5 12C13.5 12.3978 13.342 12.7794 13.0607 13.0607C12.7794 13.342 12.3978 13.5 12 13.5C11.6022 13.5 11.2206 13.342 10.9393 13.0607Z",fill:"#537388"}),e.createElement("path",{d:"M3.43934 20.5607C3.15804 20.2794 3 19.8978 3 19.5C3 19.1022 3.15804 18.7206 3.43934 18.4393C3.72064 18.158 4.10218 18 4.5 18C4.89782 18 5.27936 18.158 5.56066 18.4393C5.84196 18.7206 6 19.1022 6 19.5C6 19.8978 5.84196 20.2794 5.56066 20.5607C5.27936 20.842 4.89782 21 4.5 21C4.10218 21 3.72064 20.842 3.43934 20.5607Z",fill:"#537388"}),e.createElement("path",{d:"M3.43934 13.0607C3.15804 12.7794 3 12.3978 3 12C3 11.6022 3.15804 11.2206 3.43934 10.9393C3.72064 10.658 4.10218 10.5 4.5 10.5C4.89782 10.5 5.27936 10.658 5.56066 10.9393C5.84196 11.2206 6 11.6022 6 12C6 12.3978 5.84196 12.7794 5.56066 13.0607C5.27936 13.342 4.89782 13.5 4.5 13.5C4.10218 13.5 3.72064 13.342 3.43934 13.0607Z",fill:"#537388"}),e.createElement("path",{d:"M10.9393 5.56066C10.658 5.27936 10.5 4.89782 10.5 4.5C10.5 4.10218 10.658 3.72064 10.9393 3.43934C11.2206 3.15804 11.6022 3 12 3C12.3978 3 12.7794 3.15804 13.0607 3.43934C13.342 3.72064 13.5 4.10218 13.5 4.5C13.5 4.89782 13.342 5.27936 13.0607 5.56066C12.7794 5.84196 12.3978 6 12 6C11.6022 6 11.2206 5.84196 10.9393 5.56066Z",fill:"#537388"})),vt={prefix:"far",iconName:"custom-hand-pointer-slash",icon:[641,512,[],"???","M185.554191,59.5126699 C189.248662,26.0794907 217.382589,0 251.429,0 C287.979,0 317.715,30.056 317.715,67 L317.715,140.634 C338.128,137.776 359.183,144.576 374.31,160.263 C401.503,147.416 434.689,154.593 454.182,179.361 C497.375,162.727 544,195.156 544,242 L544,326 C544,330.296189 543.590626,334.580726 542.780274,338.796073 L495.999,302.221942 L495.999,242 C495.999,216.84 459.428,216.879 459.428,242 C459.428,250.836 452.265,258 443.428,258 L439.435556,258 L420.622383,243.291649 C420.588346,242.865584 420.571,242.434817 420.571,242 L420.571,221 C420.571,197.943344 389.858993,196.049429 384.724023,215.225903 L269.713,125.308981 L269.713,67 C269.713,41.84 233.142,41.88 233.142,67 L233.142,96.717359 L185.554191,59.5126699 Z M162.172457,223.995642 L233.142,279.479508 L233.142,308.493 C233.142,324.063 213.106,330.402 204.111,317.776 L176.985,279.697 C162.585,259.485 133.185,282.08 147.591,302.303 L257.303,456.303 C260.737,461.122 266.231,464 272,464 L450.285,464 C455.041109,464 459.427079,462.119816 462.713129,458.957818 L500.616335,488.590478 C488.331086,503.061811 470.146238,512 450.286,512 L272,512 C250.741,512 230.632,501.59 218.209,484.154 L108.51,330.153 C87.267,300.334 93.705,258.796 123.06,237.001 C134.952446,228.171597 148.664261,223.998532 162.172457,223.995642 Z M272.143,309.970422 L306.143,336.551563 L306.143,400 C306.143,408.837 299.875,416 292.143,416 L286.143,416 C278.41,416 272.143,408.837 272.143,400 L272.143,309.970422 Z M347.571,368.939901 L381.571,395.521042 L381.571,400 C381.571,408.837 375.303,416 367.571,416 L361.571,416 C353.839,416 347.571,408.837 347.571,400 L347.571,368.939901 Z M633.994211,471.020009 C640.904211,476.540009 642.014211,486.610009 636.494211,493.510009 L626.494211,506 C620.964211,512.890009 610.904211,514.010009 604.004211,508.490009 L6.00421069,40.9800088 C-0.895789309,35.4600088 -2.01578931,25.3900088 3.51421069,18.4900088 L13.5142107,6 C19.0342107,-0.899991212 29.1042107,-2.00999121 36.0042107,3.51000879 L633.994211,471.020009 Z"]},_t={CLICK:Ee,DISABLED:I,MOUSEDOWN:qe,NOT_CLICK:vt,NOT_DISABLED:A,NOT_PRESENT:he,PRESENT:se},wt={COMPLETED:A,NOT_COMPLETED:I,NOT_SEEN:he,ACTIVE:Ge,NOT_ACTIVE:We,SEEN:se},Ct={CLICK:"is clicked",DISABLED:"is disabled",MOUSEDOWN:"has mouse down on it",NOT_CLICK:"is not clicked",NOT_DISABLED:"is not disabled",NOT_PRESENT:"is not present",PRESENT:"is present"};function yt(t){return Ct[t]}const Nt={COMPLETED:"completed",NOT_COMPLETED:"not completed",NOT_SEEN:"not seen",ACTIVE:"is currently active",NOT_ACTIVE:"is not currently active",SEEN:"seen"};function xt(t){return Nt[t]}function St(t,n){let s=(n||"").toLowerCase();return(t.eventTimeOperator===O.RELATIVE_BETWEEN?t.eventRelativeValue2:t.eventRelativeValue)!==1&&(s+="s"),t.eventTimeOperator!==O.RELATIVE_GT&&(s+=" ago"),s}function Tt(t){return(t.eventFrequencyOperator===U.BETWEEN?t.eventFrequencyValue2:t.eventFrequencyValue)===1?"time":"times"}const Ot={CURRENT_USER:"by current user in any company",CURRENT_USER_CURRENT_GROUP:"by current user in current company",CURRENT_GROUP:"by any user in current company"};function Dt(t){return Ot[t]}function It(t){if(!t)return"";switch(t){case U.BETWEEN:return"between";case U.EQ:return"exactly";case U.GTE:return"at least";case U.LTE:return"at most"}}function Ft(t){if(!t)return"";switch(t){case O.ANY:return"at any point in time";case O.RELATIVE_BETWEEN:return"between";case O.RELATIVE_GT:return"in the last";case O.RELATIVE_LT:return"more than"}}const Lt={1:"Lowest",2:"Low",3:"Medium",4:"High",5:"Highest"};function Pt(t){return`${Lt[t]||String(t)} priority`}function te(t,n){switch(t){case H.DAY:return n===1?"day":"days";case H.HOUR:return n===1?"hour":"hours";case H.MINUTE:return n===1?"minute":"minutes";case H.SECOND:return n===1?"second":"seconds"}}function me(t){switch(t){case"USER":return re;case"GROUP":return ze;case"GROUP_MEMBERSHIP":return je;case"EVENT":return be}}function Rt(t){const n=t.split("/");if(n.length===1)return["USER",t];switch(n[0]){case"group":return["GROUP",n[1]];case"group_membership":return["GROUP_MEMBERSHIP",n[1]];case"event":return["EVENT",n[1]]}return console.warn("parseAttributeDefinitionFqn: Invalid attribute definition FQN",t),["USER",t]}const Ut={[P.BANNER]:"banner",[P.CHECKLIST]:"checklist",[P.FLOW]:"flow",[P.EMBED]:"embed",[P.LAUNCHER]:"launcher",[P.RESOURCE_CENTER]:"resource center"};function At(t,{title:n,plural:s}={}){let r=Ut[t];return n&&(r=ee.upperFirst(r)),s&&(r+="s"),r}const Mt=["yyyy-MM-dd","yyyy/MM/dd","MM-dd yyyy","MM/dd yyyy","MM-dd-yyyy","MM/dd/yyyy","MM-dd","MM/dd","dd MMM yyyy","dd MMMM yyyy","MMM dd yyyy","MMMM dd yyyy","dd MMM","dd MMMM","MMM dd","MMMM dd"],kt=["hh:mmaaa","hh.mmaaa","hh:mm aaa","hh.mm aaa","HH:mm","HH.mm","hhaaa","hh aaa","HH"];for(const t of Mt)for(const n of kt);const Vt="d MMM yyyy";function pe(t){if(t==null)return"";const n=Bt?t.getMinutes()===0?"h aaa":"h:mm aaa":"HH:mm";return ae(t,Vt+", "+n)}function Ht(t){if(!t)return null;const n=dt(t,"yyyy-MM-dd",new Date);return isNaN(n.valueOf())?null:n}function ge(t){if(!t)return null;const n=mt(t);return isNaN(n.valueOf())?null:n}const Bt=Intl.DateTimeFormat(Intl.DateTimeFormat().resolvedOptions().locale,{hour:"numeric"}).resolvedOptions().hourCycle==="h12";var Te=(t=>(t.EVENT="EVENT",t.GROUP="GROUP",t.GROUP_MEMBERSHIP="GROUP_MEMBERSHIP",t.USER="USER",t))(Te||{});function j(){const[t,n]=i.useState(!1),s=i.useRef(null),r=i.useCallback(()=>n(!0),[]),a=i.useCallback(()=>n(!1),[]),o=i.useCallback(()=>n(!0),[]),l=i.useCallback(()=>n(!1),[]);return{ref:s,hovered:t,eventHandlers:{onPointerEnter:r,onPointerLeave:a,onFocus:o,onBlur:l}}}function fe(t){return({condition:n})=>{throw new Error(`conditionOperators.${n.operator}.${t} is not supported`)}}const $={[u.ABSOLUTE_EQ]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"on")," ",e.createElement("span",{className:"nowrap text-bold"},J(t.value)))},[u.ABSOLUTE_GT]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"after")," ",e.createElement("span",{className:"nowrap text-bold"},J(t.value)))},[u.ABSOLUTE_LT]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"before")," ",e.createElement("span",{className:"nowrap text-bold"},J(t.value)))},[u.AND]:{Preview:fe("Preview")},[u.BETWEEN]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is between")," ",e.createElement("b",null,t.value)," ",e.createElement("span",{className:"text-secondary"},"and")," ",e.createElement("b",null,t.value2))},[u.CONTAINS]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"contains")," ",e.createElement("b",null,t.value))},[u.EMPTY]:{Preview:()=>e.createElement("span",{className:"text-secondary"},"is empty")},[u.ENDS_WITH]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"ends with")," ",e.createElement("b",null,t.value))},[u.EQ]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is")," ",e.createElement("b",null,t.dataType===de.FLOW&&t.value?e.createElement("span",null,t?.eventDisplayName??t.eventName):t.value))},[u.EXCLUDES_ALL]:{Preview:({condition:t})=>q(t,"does not include","all of")},[u.EXCLUDES_ANY]:{Preview:({condition:t})=>q(t,"does not include","at least one of")},[u.FALSE]:{Preview:()=>e.createElement("span",{className:"text-secondary"},"is false")},[u.GT]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is greater than")," ",e.createElement("b",null,t.value))},[u.GTE]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is greater than or equal to")," ",e.createElement("b",null,t.value))},[u.INCLUDES_ALL]:{Preview:({condition:t})=>q(t,"includes","all of")},[u.INCLUDES_ANY]:{Preview:({condition:t})=>q(t,"includes","at least one of")},[u.LT]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is less than")," ",e.createElement("b",null,t.value))},[u.LTE]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is less than or equal to")," ",e.createElement("b",null,t.value))},[u.NE]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is not")," ",e.createElement("b",null,t.dataType===de.FLOW&&t.value?e.createElement("span",null," ",t?.eventDisplayName??t.eventName):t.value))},[u.NOT_CONTAINS]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"does not contain")," ",e.createElement("b",null,t.value))},[u.NOT_EMPTY]:{Preview:()=>e.createElement("span",{className:"text-secondary"},"has any value")},[u.NOT_REGEX]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"does not match")," ",e.createElement("b",null,t.value))},[u.OR]:{Preview:fe("Preview")},[u.REGEX]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"matches")," ",e.createElement("b",null,t.value))},[u.RELATIVE_EQ]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"exactly")," ",e.createElement("span",{className:"nowrap text-bold"},Q(t.value))," ",e.createElement("span",{className:"text-secondary"},"ago"))},[u.RELATIVE_GT]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"less than")," ",e.createElement("span",{className:"nowrap text-bold"},Q(t.value))," ",e.createElement("span",{className:"text-secondary"},"ago"))},[u.RELATIVE_LT]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"more than")," ",e.createElement("span",{className:"nowrap text-bold"},Q(t.value))," ",e.createElement("span",{className:"text-secondary"},"ago"))},[u.STARTS_WITH]:{Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"starts with")," ",e.createElement("b",null,t.value))},[u.TRUE]:{Preview:()=>e.createElement("span",{className:"text-secondary"},"is true")},[u.URL]:{Preview:({condition:t})=>{const{urlPattern:n}=t;if(!n)return e.createElement("span",{className:"text-secondary"},"matches ...");const{includes:s,excludes:r}=n;return e.createElement(e.Fragment,null,s.length>0&&e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"matches")," ",s.map((a,o)=>e.createElement(e.Fragment,{key:o},o>0&&e.createElement("span",{className:"text-secondary"},", "),e.createElement("b",null,a)))),s.length>0&&r.length>0&&e.createElement("span",{className:"text-secondary"}," and "),r.length>0&&e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"does not match")," ",r.map((a,o)=>e.createElement(e.Fragment,{key:o},o>0&&e.createElement("span",{className:"text-secondary"},", "),e.createElement("b",null,a)))))}}};function qt(t){return parseInt(t,10)}function Q(t){if(!t)return"days";const n=qt(t);return isNaN(n)?"days":n+" "+(n===1?"day":"days")}function J(t){if(!t)return"";const n=Ht(t);return n?ae(n,"PP"):""}function q(t,n,s){const r=t.values||[];return e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},n+(r.length>1?" "+s:""))," ",r.map((a,o)=>e.createElement(e.Fragment,{key:o},o>0&&e.createElement("span",{className:"text-secondary"},", "),e.createElement("b",{key:o},a))))}const ie=t=>({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__success":t===!0,"userflow-debugger-condition__item__danger":t===!1,"userflow-debugger-condition__item__intermediate":t===null}),ce=t=>t===!0?D:t===!1?I:F,Oe=(t,n)=>{const s=x();return i.useMemo(()=>{const o=(n?s?.hiddenCondition?.breakdown:s?.startCondition?.breakdown)?.find(l=>l.conditionId===t.id);return{classes:ie(o?.match),icon:ce(o?.match)}},[t,s,n])},W=t=>{const{condition:n,isHideCond:s}=t,{classes:r,icon:a}=Oe(n,s),o=n.type;if(o===N.CLAUSE)return e.createElement(Wt,{...t});const l=Ie[o];return e.createElement("div",{className:g(r)},e.createElement("span",{className:"d-flex gap-8 align-center userflow-debugger-condition__item__icon"},l.icon?e.createElement(d,{icon:l.icon({condition:n})}):null,e.createElement(l.Preview,{...t})),e.createElement(d,{dataAttrs:{"data-condition-status":"true"},icon:a}))},Gt=()=>{const t=x(),[n,s]=i.useState(!1),r=i.useMemo(()=>t?.hiddenCondition?.breakdown.find(o=>o.conditionId===t?.hiddenCondition?.condition.id),[t?.hiddenCondition]);return t?.hiddenCondition?.condition?e.createElement("div",{role:"button",className:g({"d-flex gap-8 flex-column margin-8":!0,"userflow-debugger-condition__clause":!0,"userflow-debugger-hide-condition__clause__success":r?.match===!0,"userflow-debugger-hide-condition__clause__danger":r?.match===!1,"userflow-debugger-hide-condition__clause__expanded":n}),onClick:a=>{s(!n),a.stopPropagation()}},e.createElement("div",{className:"d-flex gap-8 justify-space-between align-center"},e.createElement("span",null,"Termporarily hide flow"," ",e.createElement("span",{className:"userflow-debugger-info-text"},"Click to ",n?"collapse":"expand")),e.createElement(d,{icon:M})),n&&e.createElement(W,{isRoot:!0,isHideCond:!0,condition:t?.hiddenCondition?.condition})):null},Wt=({condition:t,isRoot:n=!1,isHideCond:s=!1})=>{const[r,a]=i.useState(!1),{classes:o,icon:l}=Oe(t,s);return n?e.createElement(e.Fragment,null,t.conditions.map((c,p)=>e.createElement(W,{isHideCond:s,key:p,condition:c}))):e.createElement("div",{role:"button",className:g({"d-flex flex-column gap-8":!0,"userflow-debugger-condition__clause":r,...r?{"userflow-debugger-condition__item__success__expanded":o["userflow-debugger-condition__item__success"],"userflow-debugger-condition__item__danger__expanded":o["userflow-debugger-condition__item__danger"],"userflow-debugger-condition__item__intermediate__expanded":o["userflow-debugger-condition__item__intermediate"]}:o}),onClick:c=>{a(!r),c.stopPropagation()}},e.createElement("div",{className:"d-flex justify-space-between align-center w-full"},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(d,{icon:et})," ",e.createElement("strong",null,"Logic Group")," ",e.createElement("span",{className:"userflow-debugger-info-text"},"Click to ",r?"collapse":"expand")),!r&&e.createElement(d,{dataAttrs:{"data-condition-status":"true"},icon:l})),r&&e.createElement(e.Fragment,null,t.conditions.map((c,p)=>e.createElement("div",{key:p,className:g({"userflow-debugger-condition__clause__operator__wrapper":!0})},p>0&&e.createElement("div",{className:g({"userflow-debugger-condition__clause__operator":!0})},e.createElement(De,{condition:t})),e.createElement(W,{isHideCond:s,condition:c})))))},De=({condition:t})=>{const n=t.operator;return n?e.createElement("span",{className:g({"userflow-debugger-condition__item__operator":!0,"userflow-debugger-condition__item__operator__and":n===u.AND,"userflow-debugger-condition__item__operator__or":n===u.OR})},n===u.AND&&"AND",n===u.OR&&"OR"):null},jt={[T.NONE]:I,[T.PENDING_SCHEDULE]:I,[T.SCHEDULED]:F,[T.FIRED]:D},zt=e.memo(()=>{const t=x(),{waitTimer:n}=t||{},s=t?.startCondition?.condition.waitTime,{ref:r,hovered:a,eventHandlers:o}=j();return!s||!n||n===T.NONE?null:e.createElement("div",{ref:r,...o,className:g({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__danger":n===T.PENDING_SCHEDULE,"userflow-debugger-condition__item__intermediate":n===T.SCHEDULED,"userflow-debugger-condition__item__success":n===T.FIRED})},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(d,{icon:Ye}),e.createElement("span",null,"Wait ",e.createElement("strong",null,s)," seconds")),e.createElement(d,{dataAttrs:{"data-condition-status":"true"},icon:jt[n]}),e.createElement(z,{target:r,hovered:a&&n===T.PENDING_SCHEDULE},"Timer activates once all conditions are satisfied"))}),Yt=e.memo(()=>{const t=x(),[n,s]=i.useState(!1),{startFrequency:r,listFlowLatestVersion:a}=t||{startFrequency:{}};if(!r||!a?.startFrequency||a?.startFrequency===R.NEVER)return null;const{currentFlowIntervalThrottle:o,frequency:l,frequencyUsage:c}=r,p=ce(l),_=ie(l);if(a.startFrequency===R.ONCE||a.startFrequency===R.ONCE_PER_GROUP)return e.createElement("div",{className:g(_)},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(d,{icon:ve}),e.createElement("strong",null,"Once per user"," ",a.startFrequency===R.ONCE_PER_GROUP&&"per company")),e.createElement(d,{dataAttrs:{"data-condition-status":"true"},icon:p}));if(a.startFrequency===R.ALWAYS&&a.startIntervalValue&&a.startIntervalUnit)return e.createElement("div",{className:g({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__success":o===!0,"userflow-debugger-condition__item__intermediate":o===!1})},e.createElement("span",null,"Every ",e.createElement("strong",null,a.startIntervalValue)," ",e.createElement("span",{className:"userflow-debugger-info-text"},te(a.startIntervalUnit,a.startIntervalValue)," ","apart")),e.createElement(d,{dataAttrs:{"data-condition-status":"true"},icon:o===!1?F:D}));if(a.startFrequency===R.MULTIPLE){const f=l===!0&&o===!0,h=l===!0&&o===!1,C=l===!1;return e.createElement("div",{className:g({"d-flex flex-column gap-8":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__clause":n,...n?{"userflow-debugger-condition-frequency__success__expanded":f,"userflow-debugger-condition-frequency__intermediate__expanded":h,"userflow-debugger-condition-frequency__danger__expanded":C}:{"userflow-debugger-condition-frequency__success":f,"userflow-debugger-condition-frequency__intermediate":h,"userflow-debugger-condition-frequency__danger":C}}),onClick:m=>{s(!n),m.stopPropagation()}},e.createElement("div",{className:"d-flex gap-8 justify-space-between"},e.createElement("div",{className:"d-flex gap-8 align-center"},e.createElement("strong",null,"Start multiple times")," ",e.createElement("span",{className:"userflow-debugger-info-text"},"Click to expand")),!n&&e.createElement(d,{dataAttrs:{"data-condition-status":"true"},icon:f?D:h?F:I})),n&&e.createElement(e.Fragment,null,e.createElement("div",{className:g(_)},e.createElement("span",null,e.createElement("strong",null,a.startLimit)," ",e.createElement("span",{className:"userflow-debugger-info-text"},"(started ",c," times)")),e.createElement(d,{dataAttrs:{"data-condition-status":"true"},icon:p})),a.startIntervalUnit&&a.startIntervalValue&&e.createElement("div",{className:g({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__success":o===!0,"userflow-debugger-condition__item__intermediate":o===!1})},e.createElement("span",null,e.createElement("strong",null,a.startIntervalValue)," ",e.createElement("span",{className:"userflow-debugger-info-text"},te(a.startIntervalUnit,a.startIntervalValue)," ","apart")),e.createElement(d,{dataAttrs:{"data-condition-status":"true"},icon:o===!1?F:D}))))}return null}),Xt=()=>{const t=x(),{priority:n}=t||{};return n?.priority?e.createElement("div",{className:g({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__priority":!0})},e.createElement("span",null,e.createElement("strong",null,Pt(n?.priority))," ",e.createElement("span",{className:"userflow-debugger-info-text"},"Click to learn more")),e.createElement("a",{href:"https://docs.userflow.com/docs/trouble/using-the-debugger#flow-trigger-precedence",target:"_blank",rel:"noreferrer noopener"},e.createElement(d,{icon:_e}))):null},Kt=()=>{const t=x(),{startFrequency:n}=t||{},{onlyIfNotCompleted:s}=n||{};return s==null?null:e.createElement("div",{className:g({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__success":s===!0,"userflow-debugger-condition__item__danger":s===!1})},"Only if not completed",e.createElement(d,{icon:s===!0?D:I}))},Zt=()=>{const t=x(),{startFrequency:n}=t||{},{hovered:s,eventHandlers:r,ref:a}=j();return!n||n?.scopeByGroup===null||n.scopeByGroup===void 0||n.scopeByGroup===!0?null:e.createElement("div",{ref:a,...r,className:g({"d-flex align-center margin-8":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__danger":!0})},"Constrain to current company",e.createElement(d,{icon:ce(n.scopeByGroup)}),e.createElement(z,{target:a,hovered:s},"User is not associated with a company"))},$t=()=>{const t=x(),{startFrequency:n,listFlowLatestVersion:s}=t||{},{anyFlowIntervalThrottle:r}=n||{},{throttleUnit:a,throttleValue:o}=s||{};return r===null||a===null||o===null||a===void 0||o===void 0?null:e.createElement("div",{className:g({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__success":r===!0,"userflow-debugger-condition__item__intermediate":r===!1})},e.createElement("span",null,"Atleast ",e.createElement("strong",null,s?.throttleValue)," ",te(a,o)," after any flow"),e.createElement(d,{dataAttrs:{"data-condition-status":"true"},icon:r===!0?D:F}))},Qt=e.memo(()=>{const{hovered:t,eventHandlers:n,ref:s}=j(),r=x(),{snoozed:a}=r||{},o=i.useMemo(()=>{if(a?.until)return ae(new Date(a.until),"MMM do, h:mm a")},[a?.until]);return a?e.createElement("div",{ref:s,...n,className:g({"d-flex align-center margin-8":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__intermediate":!0})},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(d,{icon:Xe}),e.createElement("span",null,"This flow is currently ",e.createElement("strong",null,"snoozed"))),e.createElement(d,{dataAttrs:{"data-condition-status":"true"},icon:F}),e.createElement(z,{target:s,hovered:t},"Snoozed until ",o)):null}),Ie={[N.PAGE]:{icon:()=>Ke,Preview:({condition:t})=>{const n=t.operator&&$[t.operator];return e.createElement("span",null,"URL"," ",e.createElement("strong",null,n&&e.createElement(n.Preview,{condition:t})))}},[N.ATTRIBUTE]:{icon:({condition:t})=>{if(!t||!t.attributeName)return me(Te.EVENT);const[n]=Rt(t.attributeName);return me(n)},Preview:({condition:t})=>{const n=t.operator&&$[t.operator];return e.createElement("span",null,e.createElement("strong",null,t.attributeDisplayName?t.attributeDisplayName:"Attribute")," ",e.createElement("span",{className:"userflow-debugger-info-text"},n&&e.createElement(n.Preview,{condition:t})))}},[N.SEGMENT]:{icon:()=>Ze,Preview:({condition:t})=>{const{segment:n}=t;return e.createElement("span",null,e.createElement("strong",null,n?.subjectType===Ue.GROUP?"Company":"User")," ",e.createElement("span",{className:"text-secondary"},t.operator===u.FALSE?"is not in":"is in")," ",e.createElement("strong",null,n?.name||"Segment"))}},[N.ELEMENT]:{icon:({condition:t})=>t.elementState?_t[t.elementState]:$e,Preview:({condition:t})=>e.createElement("span",null,"Element"," ",t.elementState&&e.createElement("strong",null,yt(t.elementState)))},[N.INPUT_VALUE]:{icon:()=>Qe,Preview:({condition:t})=>{const n=t.operator&&$[t.operator];return e.createElement("span",null,"The value of input"," ",e.createElement("strong",null,n&&e.createElement(n.Preview,{condition:t})))}},[N.FILLED_IN_INPUT]:{icon:()=>Je,Preview:()=>e.createElement("span",null,"User fills an input")},[N.FLOW]:{icon:({condition:t})=>t.flowState?wt[t.flowState]:se,Preview:({condition:t})=>e.createElement("span",null,t.flow?e.createElement(e.Fragment,null,At(t.flow.type,{title:!0})," ",e.createElement("strong",null,t.flow.name)):"Flow/checklist"," ",t.flowState&&xt(t.flowState))},[N.TIME]:{icon:()=>ve,Preview:({condition:t})=>{const n=t.value?ge(t.value):null,s=n&&e.createElement("strong",{style:{whiteSpace:"nowrap"}},pe(n)),r=t.value2?ge(t.value2):null,a=r&&e.createElement("strong",{style:{whiteSpace:"nowrap"}},pe(r));return s&&a?e.createElement("span",null,"Current time is between ",s," and ",a):s?e.createElement(e.Fragment,null,"Current time is after ",s):a?e.createElement(e.Fragment,null,"Current time is before ",a):e.createElement(e.Fragment,null,"Current time is ...")}},[N.EVENT]:{icon:()=>be,Preview:({condition:t})=>{const{ref:n,hovered:s,eventHandlers:r}=j();return e.createElement("div",{ref:n,...r},e.createElement("strong",null,t.eventDisplayName?t.eventDisplayName:"Event")," ",e.createElement("span",{className:"userflow-debugger-info-text"},It(t.eventFrequencyOperator))," ",e.createElement("strong",null,t.eventFrequencyValue),t.eventFrequencyOperator===U.BETWEEN&&e.createElement(e.Fragment,null," ",e.createElement("span",{className:"userflow-debugger-info-text"},"and")," ",e.createElement("strong",null,t.eventFrequencyValue2))," ",e.createElement("span",{className:"userflow-debugger-info-text"},Tt(t),","," ",Ft(t.eventTimeOperator)),t.eventTimeOperator!==O.ANY&&e.createElement(e.Fragment,null," ",e.createElement("strong",null,t.eventRelativeValue),t.eventTimeOperator===O.RELATIVE_BETWEEN&&e.createElement(e.Fragment,null," ",e.createElement("span",{className:"userflow-debugger-info-text"},"and")," ",e.createElement("strong",null,t.eventRelativeValue2))," ",e.createElement("span",{className:"userflow-debugger-info-text"},St(t,t.eventRelativeUnit))),t.eventActor&&t.eventActor!==Ae.CURRENT_USER?e.createElement(e.Fragment,null," ",e.createElement("strong",null,Dt(t.eventActor))):"",t.whereCondition&&s&&e.createElement(z,{hovered:!0,target:n},"Where ",e.createElement("br",null),e.createElement(Fe,{condition:t.whereCondition})))}},[N.ALWAYS_TRUE]:{icon:()=>D,Preview:()=>e.createElement("span",null,"Water is wet")},[N.CHECKLIST_TASK_CLICKED]:{icon:()=>Ee,Preview:()=>e.createElement("span",null,"Task is clicked")}},Fe=t=>e.createElement("div",null,t.condition.conditions.map((n,s)=>e.createElement("div",{key:n.id}," ",s===0?null:e.createElement("span",{className:"userflow-debugger-info-text"},t.condition.operator?.toLowerCase())," ",n.type==="ATTRIBUTE"&&Ie.ATTRIBUTE.Preview({condition:n,isRoot:!0,isHideCond:!1}),n.type==="CLAUSE"&&e.createElement(e.Fragment,null,"(",e.createElement(Fe,{condition:n}),")")))),z=({hovered:t,children:n,target:s})=>{const r=oe();return t?e.createElement(Ce,{className:"userflow-debugger-popover",target:s.current,placement:"top",horizontalAlign:"center",verticalAlign:"center",document:r?.current?.contentDocument||void 0},n):null};class Jt extends e.PureComponent{constructor(n){super(n),this.rootRef=e.createRef(),this.optionsElRef=e.createRef(),this.input=null,this.popoverRef=e.createRef(),this.isMouseDown=!1,this.isCreateOpen=!1,this.setInput=s=>{this.input=s;const{inputRef:r}=this.props;r&&(typeof r=="function"?r(s):r.current=s)},this.onInputChange=s=>{s.stopPropagation();const{value:r}=s.target;r!==""&&this.openPopover();const a=this.memoizedFilterOptions(this.props.options,r);this.setState({inputValue:r,q:r,highlightedIndex:a.length>0?0:-1,createHighlighted:a.length===0}),r===""&&!this.props.noEmpty&&this.triggerOnChange(null),this.props.onSearchChange&&this.props.onSearchChange(r)},this.onPopoverPlacementChange=s=>this.setState({popoverPlacement:s}),this.onMouseDown=s=>{s.preventDefault(),this.isMouseDown=!0;const r=()=>{this.isMouseDown=!1,this.props.document?.removeEventListener("mouseup",r),document.body.removeEventListener("mouseup",r)};this.props.document?.addEventListener("mouseup",r),document.body.addEventListener("mouseup",r)},this.onFocus=s=>{this.input&&!this.props.noSearch&&this.input.select(),this.props.onFocus&&this.props.onFocus(s)},this.onBlur=s=>{this.isMouseDown||this.closePopover(),this.props.onBlur&&!this.isCreateOpen&&this.props.onBlur(s)},this.onClose=()=>{this.state.popoverOpen&&this.closePopover(),this.props.onClose&&this.props.onClose()},this.onTriggerClick=()=>{this.props.readOnly||this.props.disabled||(this.state.popoverOpen?this.closePopover():(this.input&&this.input.focus(),this.openPopover()))},this.onKeyDown=s=>{const{popoverOpen:r,highlightedIndex:a,createHighlighted:o}=this.state,l=this.getFilteredOptions(),c=l.length-1;switch(s.key){case"ArrowUp":s.preventDefault(),r&&(o?this.setState({highlightedIndex:c,createHighlighted:!1}):a>0&&this.setState({highlightedIndex:a-1}));break;case"ArrowDown":s.preventDefault(),r?this.props.onCreate&&(a===c||o)?this.setState({highlightedIndex:-1,createHighlighted:!0}):a<c&&this.setState({highlightedIndex:a+1}):this.props.noOpenOnDown||this.openPopover();break;case"Enter":if(r)if(s.preventDefault(),o&&!this.props.disableCreate)this.fireOnCreate();else{const p=l[a];p||!this.props.noEmpty?this.selectOption(p):!p&&this.props.hideOnEmpty&&this.props.onEnter&&this.props.onEnter()}else this.props.onEnter?this.props.onEnter():this.openPopover();break;case"Tab":r&&!this.props.ignoreTab&&this.selectOption(l[a]);break;case"Escape":r&&(s.preventDefault(),s.stopPropagation(),this.setState({popoverOpen:!1}));break}},this.selectOption=s=>{s===this.props.value?this.setState({popoverOpen:!1,inputValue:this.renderOptionText(s),q:""}):(this.setState({popoverOpen:!1,inputValue:"",q:""}),this.triggerOnChange(s))},this.highlightOption=s=>{this.setState({highlightedIndex:s,createHighlighted:!1})},this.highlightCreate=()=>{this.setState({highlightedIndex:-1,createHighlighted:!0})},this.fireOnCreate=()=>{const{onCreate:s}=this.props;if(s){this.isCreateOpen=!0;const r={q:ee.upperFirst(this.state.q),callback:a=>{this.isCreateOpen=!1,a!=null&&this.selectOption(a),this.input&&this.input.focus()}};s(r),this.closePopover()}},this.openPopover=()=>{if(!this.state.popoverOpen){const s=this.getFilteredOptions();let r=0,a=!1;if(s.length===0)r=-1,a=!0;else{const{value:o}=this.props,l=s.findIndex(c=>c===o);l!==-1&&(r=l)}this.setState({popoverOpen:!0,highlightedIndex:r,createHighlighted:a})}},this.memoizedFilterOptions=pt((s,r)=>(s=s||[],r?s.filter(a=>this.filter(a,r)):s)),this.state={inputValue:this.renderOptionText(n.value==null?null:n.value),q:"",popoverOpen:!1,popoverPlacement:null,highlightedIndex:-1,createHighlighted:!1}}componentDidUpdate(n,s){const{value:r}=this.props;if(r!==n.value){const a=this.renderOptionText(r??null);a!==this.state.inputValue&&this.setState({inputValue:a})}s.highlightedIndex!==this.state.highlightedIndex&&this.scrollHighlightedOptionIntoView()}render(){let n,s=!1;const{props:r}=this,a=this.state,o=a.popoverPlacement==="top"?"above":"below";if(a.popoverOpen&&this.rootRef.current){const c=this.getFilteredOptions();if(this.props.hideOnEmpty&&c.length===0)s=!0;else{let p;if(c.length>0){let _=null;p=c.reduce((f,h,C)=>{const m=this.getOptionGroup(h);m&&m!==_&&f.push(e.createElement("div",{key:"group:"+m,className:"combo-box__group-header"},m)),_=m;const v=["combo-box__option"];return C===a.highlightedIndex&&v.push("combo-box__option--highlighted"),this.props.optionClassName&&v.push(this.props.optionClassName),f.push(e.createElement(en,{key:this.getOptionKey(h,C),className:v.join(" "),option:h,idx:C,renderOptionText:r.renderOptionText,renderOptionItem:r.renderOptionItem,getOptionIcon:r.getOptionIcon,onClick:this.selectOption,onHover:this.highlightOption})),r.hasSeparatorAfter&&r.hasSeparatorAfter(h)&&f.push(e.createElement("div",{key:"sep-"+C,className:"combo-box__option-sep"})),f},[])}else r.loading?p=e.createElement("div",{className:"combo-box__no-results"},"Loading..."):p=e.createElement("div",{className:"combo-box__no-results"},"No matching ",r.nounPlural||"items");n=e.createElement(Ce,{ref:this.popoverRef,className:"combo-box-popover"+(r.popoverNotch?"":` combo-box-popover--${o}`),noNotch:!r.popoverNotch,target:this.rootRef.current,forceDimension:!0,matchWidth:!0,minWidth:r.popoverMinWidth,onMouseDown:this.onMouseDown,onPlacementChange:this.onPopoverPlacementChange,document:r.document},e.createElement("div",{ref:this.optionsElRef,className:g({"combo-box__options":!0,"combo-box__options--with-create":!!r.onCreate})},p),r.onCreate&&e.createElement("div",{key:"create",className:g({"combo-box__option":!0,"combo-box__option--create":!0,"combo-box__option--highlighted":a.createHighlighted}),onClick:this.fireOnCreate,onMouseMove:this.highlightCreate},e.createElement("div",{className:"combo-box__create-icon"},e.createElement(G,{icon:tt})),e.createElement("div",{className:"combo-box__create-text"},"Create"," ",a.q===""?"new"+(r.noun?` ${r.noun}`:""):e.createElement("b",null,ee.upperFirst(a.inputValue)))))}}const l=["input-group","combo-box"];return a.popoverOpen&&!s&&(l.push("combo-box--open"),r.popoverNotch||l.push(`combo-box--with-popover-${o}`)),r.disabled&&l.push("input-group--disabled"),r.noSearch&&l.push("combo-box--no-search"),r.className&&l.push(r.className),e.createElement(e.Fragment,null,e.createElement("div",{className:l.join(" "),style:{width:r.width?r.width+"px":void 0},ref:this.rootRef,onClick:r.readOnly||r.disabled?void 0:()=>{this.input?.focus(),this.openPopover()}},r.childrenBefore,r.value&&r.getOptionIcon&&e.createElement("div",{className:"combobox__input-icon"},Pe(r.value,r.getOptionIcon)),e.createElement("input",{type:"text",className:r.inputClassName,name:r.name,value:a.inputValue,onChange:this.onInputChange,onFocus:this.onFocus,onBlur:this.onBlur,onKeyDown:this.onKeyDown,onMouseDown:this.openPopover,placeholder:r.placeholder,readOnly:r.readOnly||r.noSearch,disabled:r.disabled,autoComplete:"off",ref:this.setInput,...r.inputHtmlAttributes}),!r.noTrigger&&e.createElement("div",{"data-testid":r.triggerTestId||"combo-box-trigger",className:"input-group__append input-group__trigger",onClick:this.onTriggerClick,onMouseDown:this.onMouseDown},e.createElement(G,{icon:nt})),r.onClose&&e.createElement("div",{className:"input-group__append input-group__trigger",onClick:this.onClose},e.createElement(G,{icon:rt})),r.childrenAfter),n)}scrollHighlightedOptionIntoView(){const n=this.optionsElRef.current;if(this.state.popoverOpen&&n){const s=n.querySelector(".combo-box__option--highlighted");if(s){const r=n.getBoundingClientRect(),a=s.getBoundingClientRect();a.top<r.top?n.scrollTop+=a.top-r.top:a.bottom>r.bottom&&(n.scrollTop+=a.bottom-r.bottom)}}}triggerOnChange(n){const{onChange:s}=this.props;s&&s(n)}closePopover(){this.setState({popoverOpen:!1,inputValue:this.renderOptionText(this.props.value==null?null:this.props.value),q:""})}renderOptionText(n){return n==null?"":Le(n,this.props.renderOptionText)}getFilteredOptions(){return this.memoizedFilterOptions(this.props.options,this.state.q)}filter(n,s){return this.props.filter?this.props.filter(n,s):this.renderOptionText(n).toLowerCase().includes(s.toLowerCase())}getOptionKey(n,s){return n&&n.id||s}getOptionGroup(n){return this.props.getOptionGroup?this.props.getOptionGroup(n):n&&n.group||null}}class en extends e.PureComponent{constructor(){super(...arguments),this.state={isOptionDisabled:!1},this.onClick=()=>{this.state.isOptionDisabled||this.props.onClick(this.props.option)},this.onHover=()=>{this.state.isOptionDisabled||this.props.onHover(this.props.idx)}}componentDidMount(){const n=this.props.option!==void 0&&typeof this.props.option=="object"&&this.props.option!==null&&"disabled"in this.props.option&&this.props.option.disabled===!0;this.setState({isOptionDisabled:n})}componentDidUpdate(){const n=this.props.option!==void 0&&typeof this.props.option=="object"&&this.props.option!==null&&"disabled"in this.props.option&&this.props.option.disabled===!0;this.setState({isOptionDisabled:n})}render(){const{isOptionDisabled:n}=this.state,{props:s}=this;return e.createElement("div",{className:g({[s.className]:!0,"combo-box__option--disabled":n}),onClick:this.onClick,onMouseMove:this.onHover},tn(s.option,s.renderOptionText,s.renderOptionItem,s.getOptionIcon))}}function Le(t,n){return n?n(t):typeof t=="string"||typeof t=="number"?t:t?t.name:"?"}function tn(t,n,s,r){if(s)return s(t);{let a=Le(t,n);return r?e.createElement("div",{className:"d-flex align-flex-start"},e.createElement("div",{className:"combobox__option-icon"},Pe(t,r)),e.createElement("div",{className:"flex-1"},a)):a}}function Pe(t,n){const s=n(t);return nn(s)?e.createElement(G,{icon:s}):s}function nn(t){return gt(t)&&"iconName"in t}const rn=({selectedFlow:t,setSelectedFlow:n,flows:s,debugAutoStartCondition:r})=>{const a=L(),o=oe();i.useEffect(()=>{if(!t)return;r(t.latestVersion);const c=()=>{r(t.latestVersion)};return a.on("private:checkSessionsAck",c),document.addEventListener("visibilitychange",c),()=>{a.off("private:checkSessionsAck",c),document.removeEventListener("visibilitychange",c)}},[t]);const l=i.useCallback(c=>{!c||t?.latestVersion?.id===c.latestVersion.id||n(c)},[t]);return e.createElement(e.Fragment,null,e.createElement("div",{className:"d-flex align-center justify-space-between"},e.createElement("div",{className:"d-flex justify-space-between align-center"},"Select Flow"),e.createElement(Jt,{className:"userflow-debugger__flow__selector",value:t,options:s,placeholder:"Select flow",document:o?.current?.contentDocument||void 0,onChange:l,renderOptionItem:c=>c.name})),e.createElement(sn,{selectedFlow:t,selectedFlowVersionsId:t?.latestVersion?.id}))},sn=({selectedFlowVersionsId:t,selectedFlow:n})=>{const s=L(),[r,a]=i.useState(!1),o=x(),l=o&&o?.activeFlow?.id===n?.id;return i.useEffect(()=>(a(!1),s.on("private:setFlowSession",c=>{a(c===t)}),()=>{s.off("private:setFlowSession",()=>a(!1))}),[t]),i.useEffect(()=>{l||a(!1)},[l]),o?.activeFlow===null?null:e.createElement(e.Fragment,null,o?.locale?.match===!1&&e.createElement("div",{className:g(ie(!1))},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(d,{icon:I}),e.createElement("span",null,"The flow will not auto start ",e.createElement("br",null)," ",e.createElement("b",null,"User locale (",o?.locale?.code,") is not enabled.")))),r?e.createElement("div",{className:g({"d-flex align-center fade-in":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__flow__status":!0})},e.createElement("span",{className:"d-flex align-center gap-8"},e.createElement(d,{icon:M}),e.createElement("span",null,"This flow ",e.createElement("strong",null,"just")," started"))):null,l&&!r&&e.createElement("div",{className:g({"userflow-debugger-condition__item":!0,"userflow-debugger-condition__flow__status":!0})},e.createElement("span",{className:"d-flex align-center gap-8"},e.createElement(d,{icon:M}),e.createElement("span",null,"This flow is currently active"))),!l&&o&&e.createElement("div",{className:g({"userflow-debugger-condition__item":!0,"userflow-debugger-condition__flow__status":!0})},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(d,{icon:M,size:16}),e.createElement("span",null,"Another flow is currently active"))))},an=({close:t})=>{const n=L(),s=i.useRef(null),[r,a]=i.useState(!!n.clientToken),[o,l]=i.useState(()=>{const E=n.getSessionStorageState(),w=E?.debuggerApp?.x,S=E?.debuggerApp?.y||50;return{x:w??(document.body.clientWidth?Number(document.body.clientWidth)-450:50),y:S}}),[c,p]=i.useState(!1),_=i.useRef(null),{meta:f}=k(),{debuggerRoute:h}=le(),[C,m]=i.useState(!1),v=i.useRef(null),b=i.useRef({mouseX:0,mouseY:0,elementX:0,elementY:0});i.useEffect(()=>{o&&n.setSessionStorageState(E=>({...E,debuggerApp:{...E.debuggerApp,x:o.x,y:o.y}}))},[o]),i.useEffect(()=>{if(!c)return;const E=S=>{const V=S.clientX-b.current.mouseX,Y=S.clientY-b.current.mouseY,X=Math.min(b.current.elementX+V,window.document.body.clientWidth-200),K=Math.max(b.current.elementY+Y,0);v.current||(v.current=requestAnimationFrame(()=>{l({x:X,y:K}),v.current=null}))},w=()=>{p(!1)};return document.addEventListener("mousemove",E),document.addEventListener("mouseup",w),()=>{document.removeEventListener("mousemove",E),document.removeEventListener("mouseup",w),v.current&&(cancelAnimationFrame(v.current),v.current=null)}},[c,o]),i.useEffect(()=>{const E=()=>{l(S=>{const V=document.body.clientWidth-500,Y=document.body.clientHeight-100,X=Math.max(Math.min(S.x,V),0),K=Math.max(Math.min(S.y,Y),0);return{x:X,y:K}})},w=()=>{a(!!n.clientToken)};return window.addEventListener("resize",E),n.on("private:initialised",w),()=>{window.removeEventListener("resize",E),n.off("private:initialised",w)}},[]);const y=E=>{s.current&&(p(!0),E.preventDefault())};return e.createElement("div",{ref:s,style:{left:"0",top:"0",position:"absolute",willChange:"transform",transform:`translate3d(${o.x}px, ${o.y}px, 0)`,zIndex:1234620}},e.createElement("div",{onMouseDown:y,style:{height:"50px",cursor:"move",userSelect:"none",position:"absolute",width:"50px"}}),e.createElement(Ve,{title:"Debugger",stylesheet:ft,style:{borderRadius:"8px",width:"400px",height:h==="checkAutoStart"?"600px":r?"500px":"400px"},elRef:_,onStylesheetsLoad:m},e.createElement(Ne.Provider,{value:_},e.createElement("div",{className:"d-flex flex-column userflow-debugger-app",style:{visibility:C?"visible":"hidden"}},e.createElement("div",{className:"d-flex justify-space-between userflow-debugger-app__header"},e.createElement(bt,null),e.createElement("div",{className:"d-flex align-center userflow-debugger-app__title"},e.createElement(He,null),e.createElement("span",null,"Userflow debugger")),e.createElement("button",{role:"button",className:"userflow-debugger-app__close",onClick:()=>{n.getSessionStorageState().debuggerApp&&n.setSessionStorageState(E=>({...E,debuggerApp:null})),t()}},e.createElement("svg",{width:16,height:16,viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.createElement("path",{d:"M12.1836 4.49609L8.90234 7.77734L12.1562 11.0312C12.4297 11.2773 12.4297 11.6875 12.1562 11.9336C11.9102 12.207 11.5 12.207 11.2539 11.9336L7.97266 8.67969L4.71875 11.9336C4.47266 12.207 4.0625 12.207 3.81641 11.9336C3.54297 11.6875 3.54297 11.2773 3.81641 11.0039L7.07031 7.75L3.81641 4.49609C3.54297 4.25 3.54297 3.83984 3.81641 3.56641C4.0625 3.32031 4.47266 3.32031 4.74609 3.56641L8 6.84766L11.2539 3.59375C11.5 3.32031 11.9102 3.32031 12.1836 3.59375C12.4297 3.83984 12.4297 4.25 12.1836 4.49609Z",fill:"white"})))),e.createElement(on,null),h==="verifySetup"&&e.createElement(ln,null),f?.endUser?.debuggerEnabled&&h==="checkAutoStart"&&e.createElement(cn,null),h==="currentUser"&&e.createElement(un,null)))))},on=()=>{const t=L(),{meta:n}=k(),[s,r]=i.useState(!1),{debuggerRoute:a,setDebuggerRoute:o}=le(),l=t.isIdentified(),c=ht(()=>r(!1));return i.useEffect(()=>{n&&n?.endUser.debuggerEnabled===!1&&a==="checkAutoStart"&&o("verifySetup")},[n]),l?e.createElement("div",{ref:c},e.createElement("div",{className:"d-flex align-center justify-space-between userflow-debugger-menu",onClick:()=>r(!s)},e.createElement("div",{className:g({"d-flex align-center":!0,"userflow-debugger-menu__title":!0,"userflow-debugger-menu__title--open":s})},e.createElement(d,{icon:B[a].icon}),e.createElement("span",null,B[a].name)),e.createElement("button",{className:"userflow-debugger-menu__toggle"},e.createElement(d,{icon:st}))),s&&e.createElement("ul",{className:"userflow-debugger-menu__list"},Object.keys(B).map(p=>{if(!n?.endUser?.debuggerEnabled&&p==="checkAutoStart")return null;const _=B[p];return e.createElement("li",{key:p,className:"d-flex align-center userflow-debugger-app__item",onClick:()=>{o&&o(p),r(!1)}},e.createElement(d,{icon:_.icon}),_.name)}))):null},ln=()=>{const{meta:t,buildId:n}=k(),s=L(),[r,a]=i.useState(!!s.clientToken),o=i.useMemo(()=>s.isIdentified(),[s,t]),{setDebuggerRoute:l}=le();i.useEffect(()=>{const f=()=>{a(!!s.clientToken)};return s.on("private:initialised",f),()=>{s.off("private:initialised",f)}},[]);const c=i.useMemo(()=>{let f=Z;const h={"d-flex flex-column gap-8":!0,"userflow-debugger-installation__step":!0};return r?(f=A,h["userflow-debugger-installation__step__success"]=!0):(f=it,h["userflow-debugger-installation__step__danger"]=!0),{icon:f,classes:h}},[r]),p=i.useMemo(()=>{let f=Z;const h={"d-flex flex-column gap-8":!0,"userflow-debugger-installation__step":!0};return!r&&!o&&(f=Z,h["userflow-debugger-installation__step__failed"]=!0),r&&!o&&(f=M,h["userflow-debugger-installation__step__warning"]=!0),r&&o&&(f=A,h["userflow-debugger-installation__step__success"]=!0),{icon:f,classes:h}},[r,o]),_=()=>o?t?.endUser.debuggerEnabled?e.createElement(e.Fragment,null,e.createElement("span",{className:"userflow-debugger-details"},t?.env.company.name),e.createElement("span",{className:"userflow-debugger-details"},t?.env.name)):e.createElement("div",{className:"userflow-debugger-details__access__denied"},"The"," ",e.createElement("button",{onClick:()=>l("currentUser")},"currently signed-in user")," ","does not have debugger access"):e.createElement(e.Fragment,null,e.createElement("span",{className:"userflow-debugger-details"},"Unknown company"),e.createElement("span",{className:"userflow-debugger-details"},"Unknown environment"));return e.createElement("div",{className:"space-evenly userflow-debugger-app__content"},e.createElement("div",{className:"userflow-debugger-installation__steps"},e.createElement("div",{className:g({"d-flex gap-8 flex-column":!0,"userflow-debugger-installation__step":!0,"userflow-debugger-installation__step__success":!0})},e.createElement(d,{icon:A,size:32}),"Userflow ",e.createElement("br",null),"installed"),e.createElement("div",{className:g(c.classes)},e.createElement(d,{icon:c.icon,size:32}),"Userflow ",e.createElement("br",null)," ",r?"":"not"," initialized"),e.createElement("div",{className:g(p.classes)},e.createElement(d,{icon:p.icon,size:32}),"User ",e.createElement("br",null)," ",o&&r?"":"not"," ","identified")),!r&&!o&&e.createElement("div",{className:g({"d-flex gap-8 flex-column":!0,"userflow-debugger-installation__not__initialized":!0})},"Remember to initialize Userflow by calling",e.createElement("div",null,"userflow.init('YOUR_USERFLOW_TOKEN')")),r&&e.createElement("div",{className:"d-flex gap-8 flex-column userflow-debugger-details__wrapper"},e.createElement("div",{className:"userflow-debugger-details__env__details"},e.createElement("div",{className:"d-flex gap-8 flex-column justify-space-around"},e.createElement(d,{size:20,icon:at}),e.createElement(d,{size:20,icon:ot})),e.createElement("div",{className:"d-flex flex-column align-flex-start gap-8"},_())),e.createElement("div",{className:"d-flex gap-8 align-center"},e.createElement(d,{size:20,icon:lt}),e.createElement("span",{className:"userflow-debugger-details"},s.getInitToken())),e.createElement("div",{className:"d-flex gap-8 align-center"},e.createElement(d,{size:20,icon:re}),e.createElement("span",{className:"userflow-debugger-details"},o?s.getIdentifiedUser()?.externalId:"User not identified"))),e.createElement("div",{className:"userflow-debugger-installation__version"},e.createElement("a",{href:"https://docs.userflow.com/docs/dev/userflow-js-installation",target:"_blank",rel:"noreferrer"},"Visit the Userflow Developer Docs for help")," ",e.createElement("br",null),"Userflow.js version 0.1.",n))},cn=()=>{const t=L(),{debuggerClientConditions:n}=k(),[s,r]=i.useState(void 0),[a,o]=i.useState([]),[l,c]=i.useState(),p=i.useMemo(()=>{if(l?.startCondition?.match===!1||l?.hiddenCondition?.match===!1||l?.locale?.match===!1)return!1;const m=l?.startFrequency;return!(m&&(m.onlyIfNotCompleted===!1||m.scopeByGroup===!1||m.frequency===!1))},[l]);i.useEffect(()=>(C().then(m=>{if(m?.length&&(o(m),!s)){const v=t.getSessionStorageState()?.debuggerApp?.selectedFlowVersionId,b=m.find(y=>y.latestVersion.id===v);f(b??m[0])}}),document.addEventListener("visibilitychange",C),()=>{document.removeEventListener("visibilitychange",C)}),[]),i.useEffect(()=>{s&&h(s.latestVersion)},[s]);const _=we.debounce(async m=>{const v=[];for(const[E,w]of n.entries())v.push({conditionId:E,isTrue:w.isTrue});const b={kind:"DebugFlowAutostartCondition",flowVersionId:m.id,clientConditions:v},y=await t.send(b);c({...y,listFlowLatestVersion:m}),y.latestVersion?.id&&m.id!==y.latestVersion?.id&&(C().then(E=>{if(!E)return;o(E);const w=E?.find(S=>S.latestVersion.id===y.latestVersion?.id);w&&f(w)}),_(y.latestVersion))},300),f=m=>{r(m);const v=t.getSessionStorageState().debuggerApp;v&&v?.x&&t.setSessionStorageState(b=>({...b,debuggerApp:{...v,selectedFlowVersionId:m.latestVersion.id}}))},h=async m=>{n.forEach(b=>{b.untrack?.()}),n.clear();const{conditionTypes:v}=await Me(async()=>{const{conditionTypes:b}=await import("./flow-condition-types.js").then(y=>y.f);return{conditionTypes:b}},__vite__mapDeps([0,1,2,3,4,5,6,7]));for(const b of m.clientConditions){n.set(b.id,{condition:b,isTrue:null});const y=v[b.type];if(!y){console.error(`Unknown condition type ${b.type}`);continue}const E=n.get(b.id);E&&(E.untrack=y.track({sessionData:new ke([]),condition:b,callback:w=>{E.isTrue!==w&&(E.isTrue=w,_(m))}}))}},C=async()=>{try{return(await t.send({kind:"ListFlows",hasAutostartCondition:!0},{handlesRejection:!0})).flows?.filter(b=>b.type==="FLOW")}catch(m){m.code==="debugger_access_denied"&&ne("Access defined for List Flows");return}};return e.createElement("div",{className:"userflow-debugger-app__content"},e.createElement(ye.Provider,{value:l},e.createElement(rn,{flows:a,selectedFlow:s,setSelectedFlow:f,debugAutoStartCondition:_}),e.createElement("div",{className:"d-flex flex-column gap-8 userflow-debugger-app__wrapper"},l?.startCondition?.condition&&e.createElement("div",null,e.createElement("div",{className:g({"d-flex gap-8 align-center":!0,"userflow-debugger-app__wrapper__passing":p,"userflow-debugger-app__wrapper__failed":!p})},e.createElement(d,{icon:p?ct:ut}),e.createElement("strong",null,"Auto-start conditions")),e.createElement("span",null,"These are"," ",e.createElement(De,{condition:l.startCondition.condition}),e.createElement("b",null,"-conditions"),", meaning"," ",l.startCondition.condition.type==="CLAUSE"&&l.startCondition.condition.operator==="AND"&&e.createElement(e.Fragment,null,"all conditions must pass for the flow to start."),l.startCondition?.condition.type==="CLAUSE"&&l.startCondition.condition.operator==="OR"&&e.createElement(e.Fragment,null,"only one condition must pass for the flow to start."))),l?.startCondition?.condition&&e.createElement(W,{isRoot:!0,isHideCond:!1,condition:l.startCondition.condition}),e.createElement(zt,null),e.createElement(Yt,null),e.createElement(Kt,null),e.createElement($t,null),e.createElement(Xt,null),e.createElement(Gt,null),e.createElement(Zt,null),e.createElement(Qt,null))))},un=e.memo(()=>{const{meta:t,buildId:n}=k();if(!t)return null;const s="https://app.userflow.com/app/"+t.env.company.slug+"/settings/debugger?external_id="+t.endUser.externalId;return e.createElement("div",{className:"d-flex flex-column space-evenly flex-1"},e.createElement("div",{className:"d-flex flex-column gap-8"},e.createElement("div",{className:"d-flex flex-column"},t.endUser.avatarUrl?e.createElement("img",{src:t.endUser.avatarUrl,className:"userflow-debugger-user__image"}):e.createElement("div",{className:"userflow-debugger-user__image"}),e.createElement("span",{className:"userflow-debugger-user__name"},t.endUser?.name||"Unknown name"),e.createElement("span",{className:"userflow-debugger-user__email"},t?.endUser?.email||"Unknown email address"),(!t.endUser.email||!t.endUser.name)&&e.createElement("span",{className:"userflow-debugger__external__id"},t.endUser.externalId)),!t.endUser.debuggerEnabled&&e.createElement(e.Fragment,null,e.createElement("div",{className:"userflow-debugger-user__info"},"This user doesn't have access to the Userflow debugger. You can grant access through the debugger settings in Userflow."),e.createElement("a",{className:"userflow-debugger-user__button",href:s,target:"_blank",rel:"noreferrer"},"Grant access in Userflow ",e.createElement(d,{icon:_e})))),e.createElement("div",{className:"userflow-debugger-installation__version"},e.createElement("a",{href:"https://docs.userflow.com/docs/dev/userflow-js-installation",target:"_blank",rel:"noreferrer"},"Visit the Userflow Developer Docs for help")," ",e.createElement("br",null),"Userflow.js version 0.1.",n))});class Vn{constructor(n,s){this.client=n,this.buildId=s,this.debuggerClientConditions=new Map}mount(){if(this.container)throw new Error("UI has already been mounted");this.container=document.createElement("div"),this.container.id="userflow-debugger-ui",document.body.appendChild(this.container),ue.render(e.createElement(dn,{client:this.client,debuggerClientConditions:this.debuggerClientConditions,buildId:this.buildId,unmount:()=>this.unmount()}),this.container)}unmount(){this.container&&(ue.unmountComponentAtNode(this.container),document.body.contains(this.container)&&document.body.removeChild(this.container),this.client.unMountDebugger(),delete this.container)}}const dn=({client:t,debuggerClientConditions:n,buildId:s,unmount:r})=>{const[a,o]=i.useState(void 0),l=we.debounce(async()=>{try{const c=await t.send({kind:"GetCurrentEndUser"},{handlesRejection:!0});o(c)}catch(c){c.code==="debugger_access_denied"&&ne("debugger access denied"),o(void 0)}},300);return i.useEffect(()=>(l(),document.addEventListener("visibilitychange",l),t.on("private:identified",l),()=>{document.removeEventListener("visibilitychange",l),t.off("private:identified",l)}),[]),e.createElement(Re.Provider,{value:t},e.createElement(xe.Provider,{value:{meta:a,debuggerClientConditions:n,buildId:s}},e.createElement(Et,null,e.createElement(an,{close:r}))))};export{Vn as DebuggerUI};
|
|
3
3
|
//# sourceMappingURL=DebuggerUI.js.map
|
package/EmbedApp.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as o,R as l}from"./vendor.react.js";import{K as m,E as z}from"./userflow.js";import{u as P,i as k}from"./client-context.js";import{o as M}from"./vendor.obj-str.js";import{u as U,a as Y,g as q,D as
|
|
1
|
+
import{r as o,R as l}from"./vendor.react.js";import{K as m,E as z}from"./userflow.js";import{u as P,i as k}from"./client-context.js";import{o as M}from"./vendor.obj-str.js";import{u as U,a as Y,g as q,D as Z}from"./stylesheets.js";import{C as G}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{u as J,S as Q,b as V}from"./use-selector-element-monitoring.js";import{w as X,f as ee}from"./flow-host.styl.js";import{r as te}from"./vendor.react-dom.js";import{F as re}from"./Frame.js";import{h as d}from"./roots.js";import{u as ne}from"./use-element-rect.js";import{C as oe}from"./ChecklistUI.js";import"./vendor.core-js.js";import"./vendor.object-assign.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.i18next.js";import"./vendor.babel.runtime.js";import"./vendor.react-i18next.js";import"./vendor.fortawesome.pro-solid-svg-icons.js";import"./flow-condition-types.js";import"./vendor.date-fns.js";import"./vendor.scheduler.js";import"./use-window-resize.js";(function(){try{var r=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},a=new Error().stack;a&&(r._sentryDebugIds=r._sentryDebugIds||{},r._sentryDebugIds[a]="a6f16513-f26d-47a2-876e-c50256875a5b",r._sentryDebugIdIdentifier="sentry-dbid-a6f16513-f26d-47a2-876e-c50256875a5b")}catch{}})();const ke=({session:r,checklistSession:a})=>{const p=P(),{version:i}=r,t=i.embed,y=U(i.theme),L=r.locale?r.locale.standardLocaleId:r.version.theme.languageId,b=r.version.embed?.blocks||[],S=b.length===1&&b[0]?.type==="CHECKLIST";o.useEffect(()=>{k.changeLanguage(L)},[L]);const e=o.useRef(null);o.useLayoutEffect(()=>{e.current=document.createElement("div")},[]);const[N,v]=o.useState(!1),{loaded:D}=Y(window,ee,y),[F,I]=o.useState(!1),h=D&&F,[A,_]=o.useState(0),j=o.useCallback(()=>{I(!1),_(n=>n+1)},[]),E=![m.BODY_FIRST,m.BODY_LAST].includes(t.embedMode),[f,x]=o.useState(null),B=o.useCallback(({targetEl:n})=>{x(n)},[]),O=o.useCallback(()=>{E&&console.warn(`Userflow.js: Could not find embed element for banner "${r.flow.name||r.flow.id}"`),x(null)},[E,r.flow.name,r.flow.id]);J({selector:t.embedSelector,targetMoved:B,targetLost:O});const[T,$]=o.useState(!1),c=o.useCallback(()=>{const n=e.current;n&&n.parentElement&&(n.parentElement.removeChild(n),v(!1))},[e]),W=o.useCallback(()=>{r.kind==="embed"&&($(!0),p.endFlow(r,{endReason:z.USER_CLOSED}),c())},[c,r,p]);o.useLayoutEffect(()=>{try{if(S&&!a){c();return}if(!e.current?.parentElement){if(E&&!f){c();return}switch(t.embedMode){case m.BODY_FIRST:document.body.insertAdjacentElement("afterbegin",e.current);break;case m.BODY_LAST:document.body.insertAdjacentElement("beforeend",e.current);break;case m.ELEMENT_FIRST:f.insertAdjacentElement("afterbegin",e.current);break;case m.ELEMENT_LAST:f.insertAdjacentElement("beforeend",e.current);break;case m.ELEMENT_BEFORE:f.insertAdjacentElement("beforebegin",e.current);break;case m.ELEMENT_AFTER:f.insertAdjacentElement("afterend",e.current);break;default:document.body.insertAdjacentElement("afterbegin",e.current)}v(!0),j()}}catch(n){console.error("Error during element insertion:",n)}},[c,e,E,f,i.embed?.overlay,i.embed?.sticky,t.embedMode,j,a]);const g=n=>M({"userflowjs-embed":!0,[`userflowjs-embed--embed-mode-${t.embedMode}`]:!0,[`userflowjs-embed--animate-${String(t.animate)}`]:n&&t.animate});o.useLayoutEffect(()=>{e.current&&(e.current.className=g(!1))},[e,t.embedMode,t.animate]);const w=t.zIndex||X(0);o.useLayoutEffect(()=>{e.current&&(e.current.style.zIndex=w==null?"":String(w),e.current.style.position=h?"":"absolute",e.current.style.visibility=h?"":"hidden")},[e,w,h]);const{height:u,setEl:H}=ne();o.useLayoutEffect(()=>{e.current&&e.current.style.setProperty("--userflowjs-embed-height",u&&d(u+(t.marginTop||0)+(t.marginBottom||0))||"0px")},[e,u,t.marginTop,t.marginBottom]);const K=()=>{if(!r.version.embed?.blocks?.length)return null;const n=(s,C)=>l.createElement("div",{className:"userflowjs-embed-wrapper",key:C},l.createElement("div",{className:"userflowjs-bubble-toolbar"},r.draftMode&&l.createElement("div",{className:"userflowjs-bubble-draft"},"Preview"),!i.closeDisabled&&l.createElement("button",{"data-testid":"userflow-embed-dismiss",className:"userflowjs-bubble-toolbar-button",onClick:W,"aria-label":"Close embed"},l.createElement(Z,{icon:G}))),s);return b.map(s=>{switch(s.type){case"CHECKLIST":return a?n(l.createElement("div",{style:{...q(y),paddingTop:i.closeDisabled?"0px":"32px"},className:"userflowjs-embedded-checklist"},l.createElement(oe,{session:a})),s.id):null;default:return console.warn(`Unknown embed block type: ${s.type}`),null}})};return o.useLayoutEffect(()=>{const n=`userflow-${r.id}`;return e.current.id=n,()=>{T||document.getElementById(n)===e.current&&c()}},[e,r.id,c,T]),o.useLayoutEffect(()=>{const n=r.version.embed?.blocks?.length&&r.version.embed.blocks.some(s=>s.type==="CHECKLIST"?a:!1);u&&u>0&&n?(e.current.style.height=`${u}px`,e.current.className=g(t.animate)):(e.current.style.height="0px",e.current.className=g(!1))},[e,u,a,t.animate]),o.useEffect(()=>{if(!e.current)return;const n=new ResizeObserver(C=>{for(const R of C)R.contentRect&&!t.embedMode&&(e.current.style.height=`${R.contentRect.height}px`)}),s=e.current.querySelector("iframe");return s&&n.observe(s),()=>{n.disconnect()}},[e,t.embedMode]),!N||!b.length||S&&!a?null:te.createPortal(l.createElement(Q.Provider,{value:r},l.createElement(re,{key:A,className:"userflowjs-embed-frame",style:{maxWidth:t.maxWidth?d(t.maxWidth):"100%",width:"100%",height:r.version.embed?.blocks?.length?"100%":"auto",minHeight:0,marginTop:d(t.marginTop),marginRight:d(t.marginRight),marginBottom:d(t.marginBottom),marginLeft:d(t.marginLeft),borderRadius:d(t.borderRadius)},stylesheet:V,theme:y,onStylesheetsLoad:I,title:"Embedded Content"},l.createElement("div",{ref:H,className:M({"userflowjs-embed-root":!0,[`userflowjs-embed-root--content-layout-${t.contentLayout}`]:!0,"userflowjs-theme-root":!0,"userflowjs-embed-root-blocks":b.length>0}),dir:k.dir(),style:{width:"100%",maxWidth:t.maxContentWidth?d(t.maxContentWidth):"100%",margin:"0 auto"}},K()))),e.current)};export{ke as EmbedApp,ke as default};
|
|
2
2
|
//# sourceMappingURL=EmbedApp.js.map
|
package/FlowChrome.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import{S as Te,T as we,M as Ee,
|
|
2
|
-
`,{type:r.type,autoData:mt,excludeText:r.excludeText,precision:r.precision,text:r.text,css:r.css})}jt(),i.tooltipTargetMissing=!0,Q.current()}},U)}Q.current()},[a,L,r,t.tooltipMissingToleranceSeconds]),de=l.useCallback(i=>{const U=A.current;jt(),U.tooltipTargetParams&&U.tooltipTargetParams.targetEl!==i.targetEl&&(U.tooltipPlacement=null),U.tooltipTargetParams=i,Y({forceUpdatePosition:!0})},[Y]);Re({selector:a===y.TOOLTIP&&r||null,targetMoved:de,targetLost:fe,onTargetClick:v});const be=l.useCallback(()=>Y({forceAppearanceLayout:!0}),[Y]);Pe(be),l.useEffect(()=>{if(!X||R||typeof ie!="function")return;let i;const U=new ie(()=>{i||(i=window.requestAnimationFrame(()=>{i=void 0,Q.current()}))});return U.observe(X,{childList:!0,attributes:!0,subtree:!0}),()=>{U.disconnect(),i&&window.cancelAnimationFrame(i)}},[X,R]);const{startConfetti:me}=Ae({stepType:a,theme:t,bubbleFrame:lt.current,isBubbleVisible:O,confettiDelay:400});l.useEffect(()=>{O&&ot&<.current&&me(!0)},[ot,s,O]),l.useLayoutEffect(()=>{Q.current()}),l.useLayoutEffect(()=>{V==="absolute"&&Y({forceAppearanceLayout:!0})},[V,T,E]);const bt=i=>{i.preventDefault(),i.stopPropagation()};return Fe(t,!!M&&j===y.BUBBLE),p.createElement("div",{ref:ft,"data-testid":"flow-chrome",className:"userflowjs-flow-chrome userflowjs-theme-root",style:ve(t),dir:nt},p.createElement("div",{className:"userflowjs-bubble",ref:ht,style:{zIndex:pt}},p.createElement("div",{className:zt({"userflowjs-bubble-outline":!0,[`userflowjs-bubble-outline--bubble-placement-${(t.bubblePlacement||"").toLowerCase().replace(/_/,"-")}`]:!0,"userflowjs-bubble-outline--minimizable":!!F,"userflowjs-bubble-outline--minimized":c})},p.createElement("div",{className:"userflowjs-bubble__frame-wrapper",..._},p.createElement(re,{className:"userflowjs-bubble__frame",elRef:lt,stylesheet:_e,theme:t,onStylesheetsLoad:Nt,noIframe:R,title:a.toLowerCase()},p.createElement("div",{className:"userflowjs-bubble-frame-root",ref:i=>{B&&B(i),_t(i)},style:w?{backgroundImage:`url("${encodeURI(w)}")`}:void 0},n,e.flowBranding&&!f&&p.createElement("div",{className:"userflowjs-bubble-made-with-userflow"},p.createElement("div",{className:"userflowjs-bubble-made-with-userflow__absolute"},p.createElement(at,{company:e},p.createElement(ke,null),p.createElement("div",null,"Made with Userflow"))))))),p.createElement("div",{ref:gt,className:"userflowjs-bubble__avatar-notch"})),p.createElement(re,{className:zt({"userflowjs-bubble__avatar":!0,"userflowjs-bubble__avatar--minimizable":!!F,"userflowjs-bubble__avatar--speaking":!!D}),elRef:Tt,stylesheet:De,theme:t,onStylesheetsLoad:St,noIframe:R,ariaHidden:!0,title:a.toLowerCase()},p.createElement("div",{className:zt({"userflowjs-avatar-frame-root":!0,"userflowjs-avatar-frame-root--minimizable":!!F}),onClick:F?()=>S(i=>!i):void 0},p.createElement(Ue,{theme:t}))),p.createElement("div",{ref:wt,className:"userflowjs-bubble__tooltip-notch"})),p.createElement("div",{ref:Et,className:"userflowjs-tooltip-backdrop",onMouseDown:bt,style:{zIndex:J,pointerEvents:z?void 0:"none"}}),p.createElement("div",{ref:Lt,className:"userflowjs-tooltip-block",onMouseDown:bt,style:{zIndex:J}}),p.createElement("div",{ref:yt,className:"userflowjs-tooltip-block",onMouseDown:bt,style:{zIndex:J}}),p.createElement("div",{ref:vt,className:"userflowjs-tooltip-block",onMouseDown:bt,style:{zIndex:J}}),p.createElement("div",{ref:Bt,className:"userflowjs-tooltip-block",onMouseDown:bt,style:{zIndex:J}}),p.createElement("div",{ref:Mt,className:"userflowjs-modal-backdrop",onMouseDown:bt,onClick:q,style:{zIndex:J}}),N&&N({visible:O,bubbleFrame:lt.current}))},Ue=({theme:e})=>{const t="https://js.userflow.com/cartoon-avatars-no-bg/";let o;return e.avatarType===ut.ASSET&&e.avatarAsset?o=e.avatarAsset.assetUrl:e.avatarType===ut.CARTOON&&e.avatarName?o=t+e.avatarName+".svg?3":e.avatarType===ut.URL&&e.avatarUrl?o=e.avatarUrl:o=t+"none.svg",p.createElement("img",{src:o,alt:""})},Ve=({company:e,children:t})=>p.createElement("a",{href:"https://userflow.com/?utm_source=made-with-userflow&utm_medium=link&utm_campaign=made-with-userflow-"+e.slug,target:"_blank",rel:"noopener noreferrer"},t);function We({layoutState:{appearance:e,theme:t,backdrop:o,tooltipTargetMissing:T},width:E,position:s,absoluteWidth:a,root:d,bubble:w,bubbleFrameRoot:r,avatar:L,avatarNotch:I,modalBackdrop:C,dir:z}){const tt=s==="absolute"?a||1024:ct(Ft()),{avatarSize:k,bubblePlacement:v}=t;let x=t.bubbleWidth,q=null,et=null,D=`userflowjs-bubble-frame-root userflowjs-bubble-frame-root--appearance-${e?.toLowerCase()}`,R="hidden",u=null,F=null,M=null,B=null,_="userflowjs-bubble__avatar-notch",N="hidden",n=null,f=null,ot=null,V=null,H="userflowjs-modal-backdrop";switch((e===y.MODAL||!T&&e===y.BUBBLE&&o)&&(H+=" userflowjs-modal-backdrop--visible"),e){case y.BUBBLE:if(t.avatarType!==ut.NONE){R="",N="",v===P.TOP_LEFT||v===P.TOP_CENTER||v===P.TOP_RIGHT?(q=k+It,u=0,n=-2*It,_+=" userflowjs-bubble__avatar-notch--top"):(et=k+It,M=0,ot=-2*It,_+=" userflowjs-bubble__avatar-notch--bottom");const at=v===P.TOP_LEFT||v===P.TOP_CENTER||v===P.BOTTOM_LEFT||v===P.BOTTOM_CENTER||v===P.CENTER;z==="ltr"&&at||z==="rtl"&&!at?(B=0,V=k,_+=" userflowjs-bubble__avatar-notch--left"):(F=0,f=k,_+=" userflowjs-bubble__avatar-notch--right")}break;case y.MODAL:x=t.modalWidth,t.avatarType!==ut.NONE&&(R="",B=`calc(50% - ${k/2}px)`,u=-k/2);break;case y.TOOLTIP:x=t.tooltipWidth;break}E!=null&&(x=E),x=Math.min(x,tt-2*Gt),d.classList.toggle("userflowjs-flow-chrome--position-absolute",s==="absolute"),d.classList.toggle("userflowjs-flow-chrome--position-relative",s==="relative"),d.classList.toggle("userflowjs-flow-chrome--position-fixed",s==="fixed"),d.classList.toggle("userflowjs-flow-chrome--appearance-modal",e===y.MODAL);const $=e!=null&&e!==y.HIDDEN;d.style.position="",d.style.top="",d.style.left="",d.style.visibility=$?"":"hidden",d.style.animation=$?"":"none",m(w,"width",ct(x)),m(w,"padding-top",q),m(w,"padding-bottom",et),r.className=D,m(L,"width",ct(t.avatarSize)),m(L,"height",ct(t.avatarSize)),L.style.visibility=R,m(L,"top",u),m(L,"right",F),m(L,"bottom",M),m(L,"left",B),I.className=_,I.style.visibility=N,m(I,"top",n),m(I,"right",f),m(I,"bottom",ot),m(I,"left",V),C.className=H}function ze({layoutState:e,animateIn:t,position:o,absoluteWidth:T,absoluteHeight:E,desiredTooltipPlacement:s,root:a,bubble:d,tooltipNotch:w,tooltipBackdrop:r,tooltipBlockTop:L,tooltipBlockRight:I,tooltipBlockBottom:C,tooltipBlockLeft:z,dir:tt}){const{appearance:k,theme:v,tooltipTargetParams:x,backdrop:q,backdropPadding:et}=e,{bubblePlacement:D}=v,R=Gt,u=v.tooltipNotchSize,F=10,{width:M,height:B}=d.getBoundingClientRect(),_=o==="absolute"?T||1024:ct(Ft()),N=o==="absolute"?E||768:ct(Yt());let n=0,f=0,ot="userflowjs-bubble__tooltip-notch",V="hidden",H=null,$=null,at=null,rt=null,pt="userflowjs-tooltip-backdrop",J=null,Rt=null,nt=null,ft=null,ht=null,lt=null,X=null,_t=null,gt="userflowjs-tooltip-block userflowjs-tooltip-block--top",Tt=null,wt=null,Et="userflowjs-tooltip-block userflowjs-tooltip-block--right",Lt=null,yt=null,vt="userflowjs-tooltip-block userflowjs-tooltip-block--bottom",Bt=null,Mt=null,Pt="userflowjs-tooltip-block userflowjs-tooltip-block--left",kt=null,Nt=null;switch(k){case y.BUBBLE:{D===P.TOP_LEFT||D===P.BOTTOM_LEFT?n=v.bubbleX:D===P.TOP_CENTER||D===P.CENTER||D===P.BOTTOM_CENTER?n=(_-M)/2:n=_-M-v.bubbleX,D===P.TOP_LEFT||D===P.TOP_CENTER||D===P.TOP_RIGHT?f=v.bubbleY:D===P.CENTER?f=(N-B)/2:f=N-B-v.bubbleY,tt==="rtl"&&(n=_-n-M),n=Math.max(0,Math.min(_-M,n)),f=Math.max(0,Math.min(N-B,f));break}case y.MODAL:{let h=R;v.avatarType!==ut.NONE&&(h+=v.avatarSize/2),n=R+(_-R*2-M)/2,f=h+(N-h-R-B)/2;break}case y.TOOLTIP:{let h;if(x){let{targetRect:c,viewportClipRect:S}=x;if(o==="absolute"){const O=a.offsetParent.getBoundingClientRect();S={top:0,right:_,bottom:N,left:0},c={top:c.top-O.top,right:c.right-O.left,bottom:c.bottom-O.top,left:c.left-O.left,width:c.width,height:c.height}}let A=0;if(q){const{paddingTop:O,paddingRight:dt,paddingBottom:Y,paddingLeft:Q}=$e(et);c={top:c.top-O,right:c.right+dt,bottom:c.bottom+Y,left:c.left-Q,width:c.width+Q+dt,height:c.height+O+Y},A=Math.min(O,dt,Y,Q)}const j=c,K=v.backdropHighlightType==Me.OUTSIDE?v.backdropHighlightSpread:0;if(q&&K&&(c={top:c.top-K,right:c.right+K,bottom:c.bottom+K,left:c.left-K,width:c.width+2*K,height:c.height+2*K}),h=Ye({targetRect:c,bubbleWidth:M,bubbleHeight:B,containerWidth:_,containerHeight:N,viewportClipRect:S,tooltipNotchSize:u,currentTooltipPlacement:e.tooltipPlacement,desiredTooltipPlacement:s}),h===b.BELOW||h===b.ABOVE?(n=c.left+c.width/2-M/2,n=Math.max(R,Math.min(_-M-R,n)),rt=Math.max(F,Math.min(M-F-u*2,c.left+c.width/2-u-n)),h===b.BELOW?H=-u*2:at=-u*2):h===b.RIGHT?(n=c.right+u,n=Math.max(n,S.left+u),n=Math.min(n,S.right+u),n=Math.max(n,u),n=Math.min(n,_-M)):(n=c.left-u-M,n=Math.max(n,S.left-M-u),n=Math.min(n,S.right-M-u),n=Math.max(n,0),n=Math.min(n,_-M-u)),h===b.LEFT||h===b.RIGHT?(f=c.top+c.height/2-B/2,f=Math.max(R,Math.min(N-B-R,f)),H=Math.max(F,Math.min(B-F-u*2,c.top+c.height/2-u-f)),h===b.LEFT?$=-u*2:rt=-u*2):h===b.BELOW?(f=c.bottom+u,f=Math.max(f,S.top+u),f=Math.min(f,S.bottom+u),f=Math.max(f,u),f=Math.min(f,N-B)):(f=c.top-u-B,f=Math.max(f,S.top-B-u),f=Math.min(f,S.bottom-B-u),f=Math.max(f,0),f=Math.min(f,N-B-u)),q){const O=window.getComputedStyle(x.targetEl);J=Math.max(0,j.top),Rt=Math.max(0,_-j.right),nt=Math.max(0,N-j.bottom),ft=Math.max(0,j.left),ht=Math.max(0,Dt(O.borderTopLeftRadius)+A),lt=Math.max(0,Dt(O.borderTopRightRadius)+A),X=Math.max(0,Dt(O.borderBottomRightRadius)+A),_t=Math.max(0,Dt(O.borderBottomLeftRadius)+A),Tt=Math.max(0,j.right),wt=Math.max(0,j.top),Lt=Math.max(0,j.right),yt=Math.max(0,j.bottom),Bt=Math.max(0,j.left),Mt=Math.max(0,j.bottom),kt=Math.max(0,j.left),Nt=Math.max(0,j.top)}}else h=s||b.BELOW,(h===b.BELOW||h===b.ABOVE)&&(rt=M/2-u,h===b.BELOW?H=-u*2:at=-u*2),(h===b.LEFT||h===b.RIGHT)&&(H=B/2-u,h===b.LEFT?$=-u*2:rt=-u*2);e.tooltipPlacement=h,ot+=` userflowjs-bubble__tooltip-notch--${h.toLowerCase()}`,V="",q&&(pt+=" userflowjs-tooltip-backdrop--visible",gt+=" userflowjs-tooltip-block--visible",Et+=" userflowjs-tooltip-block--visible",vt+=" userflowjs-tooltip-block--visible",Pt+=" userflowjs-tooltip-block--visible");break}}d.style.transition="";let Ht=n,St=f;if(t&&(d.style.opacity="0",k===y.TOOLTIP))switch(e.tooltipPlacement){case b.BELOW:f+=24;break;case b.ABOVE:f-=24;break;case b.RIGHT:n+=24;break;case b.LEFT:n-=24;break}if(o!=="relative"&&ce(d,n,f),w.className=ot,w.style.visibility=V,m(w,"top",H),m(w,"right",$),m(w,"bottom",at),m(w,"left",rt),r.className=pt,m(r,"top",J),m(r,"right",Rt),m(r,"bottom",nt),m(r,"left",ft),m(r,"border-top-left-radius",ht),m(r,"border-top-right-radius",lt),m(r,"border-bottom-right-radius",X),m(r,"border-bottom-left-radius",_t),L.className=gt,m(L,"width",Tt),m(L,"height",wt),I.className=Et,m(I,"left",Lt),m(I,"height",yt),C.className=vt,m(C,"left",Bt),m(C,"top",Mt),z.className=Pt,m(z,"width",kt),m(z,"top",Nt),t){d.offsetWidth;const h="opacity 250ms linear";k===y.TOOLTIP?d.style.transition=`${h}, transform 500ms cubic-bezier(0.25, 0.8, 0.5, 1)`:d.style.transition=h,d.style.opacity="1",o!=="relative"&&ce(d,Ht,St)}}function Ye({targetRect:e,bubbleWidth:t,bubbleHeight:o,containerWidth:T,containerHeight:E,viewportClipRect:s,tooltipNotchSize:a,currentTooltipPlacement:d,desiredTooltipPlacement:w}){if(e.bottom<=s.top)return o+a<=E-s.top?b.BELOW:b.ABOVE;if(e.top>=s.bottom)return o+a<=s.bottom?b.ABOVE:b.BELOW;if(e.right<=s.left)return t+a<=T-s.left?b.RIGHT:b.LEFT;if(e.left>=s.right)return t+a<=s.right?b.LEFT:b.RIGHT;const r=I=>{const C=e.left+e.width/2,z=C>=s.left&&C<=s.right,tt=e.top+e.height/2,k=tt>=s.top&&tt<=s.bottom;switch(I){case b.BELOW:return E-e.bottom>o+a&&z;case b.ABOVE:return e.top>o+a&&z;case b.RIGHT:return T-e.right>t+a&&k;case b.LEFT:return e.left>t+a&&k}};if(w&&r(w))return w;if(d&&r(d))return d;const L=[{placement:b.BELOW,dist:e.top},{placement:b.ABOVE,dist:E-e.bottom},{placement:b.RIGHT,dist:e.left},{placement:b.LEFT,dist:T-e.right}];L.sort((I,C)=>I.dist-C.dist);for(const{placement:I}of L)if(r(I))return I;return b.BELOW}function m(e,t,o){o==null?e.style.removeProperty(t):e.style.setProperty(t,typeof o=="number"?o+"px":o,"important")}function ce(e,t,o){t=Math.round(t),o=Math.round(o),e.style.transform=`translate3d(${t}px, ${o}px, 0px)`}function Ge(e){if(G.customScrollIntoView){G.customScrollIntoView(e);return}const{scrollPadding:t}=G;if(t&&je(e)===document.scrollingElement){const o=t.top||0,T=t.right||0,E=t.bottom||0,s=t.left||0;let a=0,d=0;const w=e.getBoundingClientRect(),r=Ft(),L=Yt();if(w.top<o?a=w.top-o:w.bottom>L-E&&(a=w.bottom-L+E),w.left<s?d=w.left-s:w.right>r-T&&(d=w.right-r+T),a!=0||d!=0){window.scrollBy({top:a,left:d,behavior:"smooth"});return}}try{e.scrollIntoView({behavior:"smooth",block:"nearest"})}catch(o){console.warn("Userflow.js: scrollIntoView error (falling back to no options).",o),e.scrollIntoView()}}function $e(e){if(!e||e==="0")return{paddingTop:0,paddingRight:0,paddingBottom:0,paddingLeft:0};const t=e.trim().split(" ");if(t.length===1){const o=it(t[0]);return{paddingTop:o,paddingRight:o,paddingBottom:o,paddingLeft:o}}else if(t.length===2){const o=it(t[0]),T=it(t[1]);return{paddingTop:o,paddingRight:T,paddingBottom:o,paddingLeft:T}}else return{paddingTop:it(t[0]),paddingRight:it(t[1]),paddingBottom:it(t[2]),paddingLeft:it(t[3])}}function it(e){const t=parseInt(e,10);return isNaN(t)?0:t}export{io as B,co as F};
|
|
1
|
+
import{S as Te,T as we,M as Ee,C as Le}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{R as p,r as l}from"./vendor.react.js";import{D as xt,a as ye,g as ve}from"./stylesheets.js";import"./vendor.core-js.js";import{u as ce}from"./vendor.react-i18next.js";import{F as re}from"./Frame.js";import{l as G,q as y,I as ct,F as Be,J as P,$ as Me,Z as b}from"./userflow.js";import{a as Oe,f as Ie}from"./flow-host.styl.js";import{u as Re,b as _e}from"./use-selector-element-monitoring.js";import{u as Pe}from"./use-window-resize.js";import{S as ke}from"./logomark.js";import{o as zt}from"./vendor.obj-str.js";import{e as Yt,d as Ft,j as ut,s as Ne,l as ne,M as ie,q as Dt,t as je,p as Ce}from"./roots.js";import{c as xe}from"./vendor.canvas-confetti.js";(function(){try{var e=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},t=new Error().stack;t&&(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[t]="30a73e5b-9fa4-4c41-9ae4-2f748e801958",e._sentryDebugIdIdentifier="sentry-dbid-30a73e5b-9fa4-4c41-9ae4-2f748e801958")}catch{}})();const io=({draftMode:e,muted:t,toggleMuted:o,close:T,minimize:E})=>{const{t:s}=ce();return p.createElement("div",{className:"userflowjs-bubble-toolbar"},e&&p.createElement("div",{className:"userflowjs-bubble-draft"},typeof e=="string"?e:"Preview"),o&&p.createElement("button",{className:"userflowjs-bubble-toolbar-button",onClick:o,"aria-label":t?"Unmute":"Mute"},t?p.createElement(xt,{icon:Te}):p.createElement(xt,{icon:we})),E&&p.createElement("button",{"data-testid":"minimize-button",className:"userflowjs-bubble-toolbar-button",onClick:E,"aria-label":"Minimize checklist"},p.createElement(xt,{icon:Ee})),T&&p.createElement("button",{"data-testid":"close-button",className:"userflowjs-bubble-toolbar-button",onClick:T,"aria-label":s("menu.close")},p.createElement(xt,{icon:Le})))},De=new URL("avatar-frame.css",import.meta.url).href;function Fe(e,t){const o=window.Intercom;l.useEffect(()=>{if(!(!t||!e.autoHideIntercom||typeof o!="function"||G.autoHide3pDisabled)){try{o("update",{hide_default_launcher:!0})}catch(a){console.warn("Userflow.js: Error when hiding Intercom launcher",a)}return()=>{if(!G.autoHide3pDisabled)try{o("update",{hide_default_launcher:!1})}catch(a){console.warn("Userflow.js: Error when unhiding Intercom launcher",a)}}}},[o,e.autoHideIntercom,t]);const T=window.$crisp;l.useEffect(()=>{if(!(!t||!e.autoHideCrisp||!T||G.autoHide3pDisabled)){try{T.push(["do","chat:hide"])}catch(a){console.warn("Userflow.js: Error when hiding Crisp Chat",a)}return()=>{if(!G.autoHide3pDisabled)try{T.push(["do","chat:show"])}catch(a){console.warn("Userflow.js: Error when unhiding Crisp Chat",a)}}}},[T,e.autoHideCrisp,t]);const E=window.HubSpotConversations;l.useEffect(()=>{if(!(!t||!e.autoHideHubspot||!E||G.autoHide3pDisabled)){try{E.widget.remove()}catch(a){console.warn("Userflow.js: Error when hiding HubSpot Chat",a)}return()=>{if(!G.autoHide3pDisabled)try{E.widget.load()}catch(a){console.warn("Userflow.js: Error when unhiding HubSpot Chat",a)}}}},[E,e.autoHideHubspot,t]);const s=window.drift;l.useEffect(()=>{if(!(!t||!e.autoHideDrift||!s||G.autoHide3pDisabled)){try{s.api.widget.hide()}catch(a){console.warn("Userflow.js: Error when hiding Drift Chat",a)}return()=>{if(!G.autoHide3pDisabled)try{s.api.widget.show()}catch(a){console.warn("Userflow.js: Error when unhiding Drift Chat",a)}}}},[s,e.autoHideDrift,t])}const st={PARTICLE_COUNT:400,ANIMATION_DELAY:400,DEFAULT_SPREAD:360,DEFAULT_GRAVITY:1,DEFAULT_TICKS:100,DEFAULT_Z_INDEX:5,TOOLTIP_DECAY:.85,TOOLTIP_START_VELOCITY:30},He={particleCount:st.PARTICLE_COUNT,spread:st.DEFAULT_SPREAD,gravity:st.DEFAULT_GRAVITY,ticks:st.DEFAULT_TICKS,angle:90,zIndex:st.DEFAULT_Z_INDEX,disableForReducedMotion:!0},Se=e=>{if(!e)return{x:.5,y:.5};const t=e.getBoundingClientRect();return{x:t.left>=0?(t.left+t.width/2)/window.innerWidth:.5,y:t.top>=0?(t.top+t.height/2)/window.innerHeight:.5}},Ae=({bubbleFrame:e,isBubbleVisible:t,theme:o,stepType:T,onAnimationComplete:E,confettiDelay:s})=>{const[a,d]=l.useState(!1);return l.useEffect(()=>{if(!t||!a||!o.confettiColors||o.confettiColors.length===0)return;const w=setTimeout(()=>{try{const r=Se(e),L={...He,colors:o.confettiColors||void 0,origin:r,...T===y.TOOLTIP&&{decay:st.TOOLTIP_DECAY,startVelocity:st.TOOLTIP_START_VELOCITY}};xe(L)}catch(r){console.warn("Error launching confetti:",r)}finally{E?.(),d(!1)}},s||st.ANIMATION_DELAY);return()=>clearTimeout(w)},[t,a,o.confettiColors,e,T,E,s]),{startConfetti:d}},Gt=16,It=20,uo=({company:e,theme:t,position:o,absoluteWidth:T,absoluteHeight:E,stepKey:s,stepAppearance:a,width:d,backgroundImageUrl:w,tooltipSelector:r,allowMissingTooltipTarget:L,tooltipPlacement:I,backdrop:C,tooltipTargetBlocked:z,backdropPadding:tt,zIndex:k,onTooltipTargetClick:v,onTooltipTargetMissingChange:x,onModalBackdropClick:q,onVisibleChange:et,speaking:D,noIframe:R,MadeWithUserflow:c,minimizeOnAvatarClick:F,autoHide3pEnabled:M,bubbleFrameRootRef:B,frameWrapperHtmlAttributes:_,rootChildren:N,children:n,isModalAnnouncement:f,confettiEnabled:ot})=>{const V=o||"absolute",H=I||null,$=tt||"0",at=c||Ve,rt=Oe(),pt=V==="fixed"?k??rt+1:1,J=pt-1,{i18n:Rt}=ce(),nt=Rt.dir(),ft=l.useRef(null),ht=l.useRef(null),lt=l.useRef(null),[X,_t]=l.useState(null),gt=l.useRef(null),Tt=l.useRef(null),wt=l.useRef(null),Et=l.useRef(null),Lt=l.useRef(null),yt=l.useRef(null),vt=l.useRef(null),Bt=l.useRef(null),Mt=l.useRef(null);l.useLayoutEffect(()=>{const i=ft.current.style;i.animation="none",i.visibility="hidden",i.position="absolute",i.top="-99999px",i.left="-99999px"},[]);const{loaded:Pt}=ye(window,Ie,t),[kt,Nt]=l.useState(!1),[Ht,St]=l.useState(!1),h=Pt&&kt&&Ht;let[u,S]=l.useState(!1);a!==y.BUBBLE&&(F=!1,u=!1),l.useEffect(()=>{S(!1)},[s]);const A=l.useRef({appearance:null,width:null,theme:t,bubbleFrameHeight:0,backdrop:!1,backdropPadding:"0",prevTooltipTargetParams:null,tooltipTargetParams:null,desiredTooltipPlacement:null,tooltipPlacement:null,lastReportedTooltipTargetMissing:!1,tooltipTargetMissing:!1,tooltipTargetMissingTimeout:void 0,stepKeyScrolledIntoView:void 0,targetScrolledIntoView:null}),[j,K]=l.useState(null),O=j!=null&&h;l.useEffect(()=>{et&&et(O)},[et,O]);const dt=l.useCallback(i=>{A.current.lastReportedTooltipTargetMissing!==i&&(A.current.lastReportedTooltipTargetMissing=i,x&&x(i))},[x]),Y=l.useCallback(({forceAppearanceLayout:i,forceUpdatePosition:U}={})=>{const mt=ft.current,Ct=ht.current,Ot=lt.current,Xt=Tt.current,Zt=gt.current,qt=wt.current,Jt=Et.current,Kt=Lt.current,Qt=yt.current,te=vt.current,ee=Bt.current,oe=Mt.current;if(!mt||!Ct||!Ot||!X||!Xt||!Zt||!qt||!Jt||!Kt||!Qt||!te||!ee||!oe||!h)return;const g=A.current,{tooltipTargetParams:At}=g;Ce();let W=a,ae=!1;W===y.TOOLTIP&&!L&&!At&&(g.tooltipTargetMissing?(W=y.BUBBLE,ae=!0):W=null);const le=W!==g.appearance,pe=d!==g.width;if((i||le||pe||t!==g.theme||C!=g.backdrop||$!=g.backdropPadding||H!==g.desiredTooltipPlacement)&&(g.appearance=W,g.width=d,g.theme=t,g.backdrop=C,g.backdropPadding=$,g.desiredTooltipPlacement=H,U=!0,We({layoutState:g,width:d,position:V,absoluteWidth:T,root:mt,bubble:Ct,bubbleFrameRoot:X,avatar:Xt,avatarNotch:Zt,modalBackdrop:oe,dir:nt})),!R){const Z=X.offsetHeight,Ut=Yt(),Vt=Ft()<800?0:Gt,he=t.avatarType===ct.NONE?0:W===y.BUBBLE?It+t.avatarSize:W===y.MODAL?t.avatarSize/2:0,se=Ut-2*Vt-he,Wt=Math.min(Z,se);if(W&&Wt!==g.bubbleFrameHeight){if(g.bubbleFrameHeight=Wt,m(Ot,"height",ut(Wt)),Ne(Ot)&&Ot.contentDocument){const ge=Ot.contentDocument.documentElement;ge.style.overflowY=Z<=se?"hidden":"scroll"}U=!0}}if(U&&W){let Z=le;if(W===y.TOOLTIP){const Ut=g.tooltipTargetParams&&g.tooltipTargetParams.targetEl,Vt=g.prevTooltipTargetParams&&g.prevTooltipTargetParams.targetEl;Ut!==Vt&&(Z=!0)}g.prevTooltipTargetParams=g.tooltipTargetParams,ze({layoutState:g,animateIn:Z,position:V,absoluteWidth:T,absoluteHeight:E,desiredTooltipPlacement:H,root:mt,bubble:Ct,tooltipNotch:qt,tooltipBackdrop:Jt,tooltipBlockTop:Kt,tooltipBlockRight:Qt,tooltipBlockBottom:te,tooltipBlockLeft:ee,dir:nt})}if(W===y.TOOLTIP){const Z=At&&At.targetEl;Z&&g.stepKeyScrolledIntoView!==s&&g.targetScrolledIntoView!==Z&&(g.stepKeyScrolledIntoView=s,g.targetScrolledIntoView=Z,Ge(Z))}else g.stepKeyScrolledIntoView=void 0,g.targetScrolledIntoView=null;dt(ae),K(W)},[h,X,s,a,d,t,V,T,E,L,H,C,$,R,dt,nt]),Q=l.useRef(Y);Q.current=Y;const $t=l.useRef(!1);l.useEffect(()=>{const i=()=>{$t.current=!0};return window.addEventListener("pagehide",i),()=>window.removeEventListener("pagehide",i)},[]);const jt=()=>{window.clearTimeout(A.current.tooltipTargetMissingTimeout),A.current.tooltipTargetMissingTimeout=void 0};l.useEffect(()=>jt,[]);const fe=l.useCallback(()=>{const i=A.current;if(i.tooltipTargetParams=null,L||(i.tooltipPlacement=null),a!==y.TOOLTIP){jt(),i.tooltipTargetMissing=!1;return}if(!L&&!i.tooltipTargetMissingTimeout){i.tooltipTargetMissing=!1;const U=r&&!ne(r)&&r.type===Be.AUTO&&!r.autoData?1:parseFloat(t.tooltipMissingToleranceSeconds)*1e3;i.tooltipTargetMissingTimeout=window.setTimeout(()=>{if(!$t.current){if(r&&!ne(r)){let mt=r.autoData;if(r.autoData)try{mt=JSON.parse(r.autoData)}catch{}console.warn(`Userflow.js: Tooltip target not found on page.
|
|
2
|
+
`,{type:r.type,autoData:mt,excludeText:r.excludeText,precision:r.precision,text:r.text,css:r.css})}jt(),i.tooltipTargetMissing=!0,Q.current()}},U)}Q.current()},[a,L,r,t.tooltipMissingToleranceSeconds]),de=l.useCallback(i=>{const U=A.current;jt(),U.tooltipTargetParams&&U.tooltipTargetParams.targetEl!==i.targetEl&&(U.tooltipPlacement=null),U.tooltipTargetParams=i,Y({forceUpdatePosition:!0})},[Y]);Re({selector:a===y.TOOLTIP&&r||null,targetMoved:de,targetLost:fe,onTargetClick:v});const be=l.useCallback(()=>Y({forceAppearanceLayout:!0}),[Y]);Pe(be),l.useEffect(()=>{if(!X||R||typeof ie!="function")return;let i;const U=new ie(()=>{i||(i=window.requestAnimationFrame(()=>{i=void 0,Q.current()}))});return U.observe(X,{childList:!0,attributes:!0,subtree:!0}),()=>{U.disconnect(),i&&window.cancelAnimationFrame(i)}},[X,R]);const{startConfetti:me}=Ae({stepType:a,theme:t,bubbleFrame:lt.current,isBubbleVisible:O,confettiDelay:400});l.useEffect(()=>{O&&ot&<.current&&me(!0)},[ot,s,O]),l.useLayoutEffect(()=>{Q.current()}),l.useLayoutEffect(()=>{V==="absolute"&&Y({forceAppearanceLayout:!0})},[V,T,E]);const bt=i=>{i.preventDefault(),i.stopPropagation()};return Fe(t,!!M&&j===y.BUBBLE),p.createElement("div",{ref:ft,"data-testid":"flow-chrome",className:"userflowjs-flow-chrome userflowjs-theme-root",style:ve(t),dir:nt},p.createElement("div",{className:"userflowjs-bubble",ref:ht,style:{zIndex:pt}},p.createElement("div",{className:zt({"userflowjs-bubble-outline":!0,[`userflowjs-bubble-outline--bubble-placement-${(t.bubblePlacement||"").toLowerCase().replace(/_/,"-")}`]:!0,"userflowjs-bubble-outline--minimizable":!!F,"userflowjs-bubble-outline--minimized":u})},p.createElement("div",{className:"userflowjs-bubble__frame-wrapper",..._},p.createElement(re,{className:"userflowjs-bubble__frame",elRef:lt,stylesheet:_e,theme:t,onStylesheetsLoad:Nt,noIframe:R,title:a.toLowerCase()},p.createElement("div",{className:"userflowjs-bubble-frame-root",ref:i=>{B&&B(i),_t(i)},style:w?{backgroundImage:`url("${encodeURI(w)}")`}:void 0},n,e.flowBranding&&!f&&p.createElement("div",{className:"userflowjs-bubble-made-with-userflow"},p.createElement("div",{className:"userflowjs-bubble-made-with-userflow__absolute"},p.createElement(at,{company:e},p.createElement(ke,null),p.createElement("div",null,"Made with Userflow"))))))),p.createElement("div",{ref:gt,className:"userflowjs-bubble__avatar-notch"})),p.createElement(re,{className:zt({"userflowjs-bubble__avatar":!0,"userflowjs-bubble__avatar--minimizable":!!F,"userflowjs-bubble__avatar--speaking":!!D}),elRef:Tt,stylesheet:De,theme:t,onStylesheetsLoad:St,noIframe:R,ariaHidden:!0,title:a.toLowerCase()},p.createElement("div",{className:zt({"userflowjs-avatar-frame-root":!0,"userflowjs-avatar-frame-root--minimizable":!!F}),onClick:F?()=>S(i=>!i):void 0},p.createElement(Ue,{theme:t}))),p.createElement("div",{ref:wt,className:"userflowjs-bubble__tooltip-notch"})),p.createElement("div",{ref:Et,className:"userflowjs-tooltip-backdrop",onMouseDown:bt,style:{zIndex:J,pointerEvents:z?void 0:"none"}}),p.createElement("div",{ref:Lt,className:"userflowjs-tooltip-block",onMouseDown:bt,style:{zIndex:J}}),p.createElement("div",{ref:yt,className:"userflowjs-tooltip-block",onMouseDown:bt,style:{zIndex:J}}),p.createElement("div",{ref:vt,className:"userflowjs-tooltip-block",onMouseDown:bt,style:{zIndex:J}}),p.createElement("div",{ref:Bt,className:"userflowjs-tooltip-block",onMouseDown:bt,style:{zIndex:J}}),p.createElement("div",{ref:Mt,className:"userflowjs-modal-backdrop",onMouseDown:bt,onClick:q,style:{zIndex:J}}),N&&N({visible:O,bubbleFrame:lt.current}))},Ue=({theme:e})=>{const t="https://js.userflow.com/cartoon-avatars-no-bg/";let o;return e.avatarType===ct.ASSET&&e.avatarAsset?o=e.avatarAsset.assetUrl:e.avatarType===ct.CARTOON&&e.avatarName?o=t+e.avatarName+".svg?3":e.avatarType===ct.URL&&e.avatarUrl?o=e.avatarUrl:o=t+"none.svg",p.createElement("img",{src:o,alt:""})},Ve=({company:e,children:t})=>p.createElement("a",{href:"https://userflow.com/?utm_source=made-with-userflow&utm_medium=link&utm_campaign=made-with-userflow-"+e.slug,target:"_blank",rel:"noopener noreferrer"},t);function We({layoutState:{appearance:e,theme:t,backdrop:o,tooltipTargetMissing:T},width:E,position:s,absoluteWidth:a,root:d,bubble:w,bubbleFrameRoot:r,avatar:L,avatarNotch:I,modalBackdrop:C,dir:z}){const tt=s==="absolute"?a||1024:ut(Ft()),{avatarSize:k,bubblePlacement:v}=t;let x=t.bubbleWidth,q=null,et=null,D=`userflowjs-bubble-frame-root userflowjs-bubble-frame-root--appearance-${e?.toLowerCase()}`,R="hidden",c=null,F=null,M=null,B=null,_="userflowjs-bubble__avatar-notch",N="hidden",n=null,f=null,ot=null,V=null,H="userflowjs-modal-backdrop";switch((e===y.MODAL||!T&&e===y.BUBBLE&&o)&&(H+=" userflowjs-modal-backdrop--visible"),e){case y.BUBBLE:if(t.avatarType!==ct.NONE){R="",N="",v===P.TOP_LEFT||v===P.TOP_CENTER||v===P.TOP_RIGHT?(q=k+It,c=0,n=-2*It,_+=" userflowjs-bubble__avatar-notch--top"):(et=k+It,M=0,ot=-2*It,_+=" userflowjs-bubble__avatar-notch--bottom");const at=v===P.TOP_LEFT||v===P.TOP_CENTER||v===P.BOTTOM_LEFT||v===P.BOTTOM_CENTER||v===P.CENTER;z==="ltr"&&at||z==="rtl"&&!at?(B=0,V=k,_+=" userflowjs-bubble__avatar-notch--left"):(F=0,f=k,_+=" userflowjs-bubble__avatar-notch--right")}break;case y.MODAL:x=t.modalWidth,t.avatarType!==ct.NONE&&(R="",B=`calc(50% - ${k/2}px)`,c=-k/2);break;case y.TOOLTIP:x=t.tooltipWidth;break}E!=null&&(x=E),x=Math.min(x,tt-2*Gt),d.classList.toggle("userflowjs-flow-chrome--position-absolute",s==="absolute"),d.classList.toggle("userflowjs-flow-chrome--position-relative",s==="relative"),d.classList.toggle("userflowjs-flow-chrome--position-fixed",s==="fixed"),d.classList.toggle("userflowjs-flow-chrome--appearance-modal",e===y.MODAL);const $=e!=null&&e!==y.HIDDEN;d.style.position="",d.style.top="",d.style.left="",d.style.visibility=$?"":"hidden",d.style.animation=$?"":"none",m(w,"width",ut(x)),m(w,"padding-top",q),m(w,"padding-bottom",et),r.className=D,m(L,"width",ut(t.avatarSize)),m(L,"height",ut(t.avatarSize)),L.style.visibility=R,m(L,"top",c),m(L,"right",F),m(L,"bottom",M),m(L,"left",B),I.className=_,I.style.visibility=N,m(I,"top",n),m(I,"right",f),m(I,"bottom",ot),m(I,"left",V),C.className=H}function ze({layoutState:e,animateIn:t,position:o,absoluteWidth:T,absoluteHeight:E,desiredTooltipPlacement:s,root:a,bubble:d,tooltipNotch:w,tooltipBackdrop:r,tooltipBlockTop:L,tooltipBlockRight:I,tooltipBlockBottom:C,tooltipBlockLeft:z,dir:tt}){const{appearance:k,theme:v,tooltipTargetParams:x,backdrop:q,backdropPadding:et}=e,{bubblePlacement:D}=v,R=Gt,c=v.tooltipNotchSize,F=10,{width:M,height:B}=d.getBoundingClientRect(),_=o==="absolute"?T||1024:ut(Ft()),N=o==="absolute"?E||768:ut(Yt());let n=0,f=0,ot="userflowjs-bubble__tooltip-notch",V="hidden",H=null,$=null,at=null,rt=null,pt="userflowjs-tooltip-backdrop",J=null,Rt=null,nt=null,ft=null,ht=null,lt=null,X=null,_t=null,gt="userflowjs-tooltip-block userflowjs-tooltip-block--top",Tt=null,wt=null,Et="userflowjs-tooltip-block userflowjs-tooltip-block--right",Lt=null,yt=null,vt="userflowjs-tooltip-block userflowjs-tooltip-block--bottom",Bt=null,Mt=null,Pt="userflowjs-tooltip-block userflowjs-tooltip-block--left",kt=null,Nt=null;switch(k){case y.BUBBLE:{D===P.TOP_LEFT||D===P.BOTTOM_LEFT?n=v.bubbleX:D===P.TOP_CENTER||D===P.CENTER||D===P.BOTTOM_CENTER?n=(_-M)/2:n=_-M-v.bubbleX,D===P.TOP_LEFT||D===P.TOP_CENTER||D===P.TOP_RIGHT?f=v.bubbleY:D===P.CENTER?f=(N-B)/2:f=N-B-v.bubbleY,tt==="rtl"&&(n=_-n-M),n=Math.max(0,Math.min(_-M,n)),f=Math.max(0,Math.min(N-B,f));break}case y.MODAL:{let h=R;v.avatarType!==ct.NONE&&(h+=v.avatarSize/2),n=R+(_-R*2-M)/2,f=h+(N-h-R-B)/2;break}case y.TOOLTIP:{let h;if(x){let{targetRect:u,viewportClipRect:S}=x;if(o==="absolute"){const O=a.offsetParent.getBoundingClientRect();S={top:0,right:_,bottom:N,left:0},u={top:u.top-O.top,right:u.right-O.left,bottom:u.bottom-O.top,left:u.left-O.left,width:u.width,height:u.height}}let A=0;if(q){const{paddingTop:O,paddingRight:dt,paddingBottom:Y,paddingLeft:Q}=$e(et);u={top:u.top-O,right:u.right+dt,bottom:u.bottom+Y,left:u.left-Q,width:u.width+Q+dt,height:u.height+O+Y},A=Math.min(O,dt,Y,Q)}const j=u,K=v.backdropHighlightType==Me.OUTSIDE?v.backdropHighlightSpread:0;if(q&&K&&(u={top:u.top-K,right:u.right+K,bottom:u.bottom+K,left:u.left-K,width:u.width+2*K,height:u.height+2*K}),h=Ye({targetRect:u,bubbleWidth:M,bubbleHeight:B,containerWidth:_,containerHeight:N,viewportClipRect:S,tooltipNotchSize:c,currentTooltipPlacement:e.tooltipPlacement,desiredTooltipPlacement:s}),h===b.BELOW||h===b.ABOVE?(n=u.left+u.width/2-M/2,n=Math.max(R,Math.min(_-M-R,n)),rt=Math.max(F,Math.min(M-F-c*2,u.left+u.width/2-c-n)),h===b.BELOW?H=-c*2:at=-c*2):h===b.RIGHT?(n=u.right+c,n=Math.max(n,S.left+c),n=Math.min(n,S.right+c),n=Math.max(n,c),n=Math.min(n,_-M)):(n=u.left-c-M,n=Math.max(n,S.left-M-c),n=Math.min(n,S.right-M-c),n=Math.max(n,0),n=Math.min(n,_-M-c)),h===b.LEFT||h===b.RIGHT?(f=u.top+u.height/2-B/2,f=Math.max(R,Math.min(N-B-R,f)),H=Math.max(F,Math.min(B-F-c*2,u.top+u.height/2-c-f)),h===b.LEFT?$=-c*2:rt=-c*2):h===b.BELOW?(f=u.bottom+c,f=Math.max(f,S.top+c),f=Math.min(f,S.bottom+c),f=Math.max(f,c),f=Math.min(f,N-B)):(f=u.top-c-B,f=Math.max(f,S.top-B-c),f=Math.min(f,S.bottom-B-c),f=Math.max(f,0),f=Math.min(f,N-B-c)),q){const O=window.getComputedStyle(x.targetEl);J=Math.max(0,j.top),Rt=Math.max(0,_-j.right),nt=Math.max(0,N-j.bottom),ft=Math.max(0,j.left),ht=Math.max(0,Dt(O.borderTopLeftRadius)+A),lt=Math.max(0,Dt(O.borderTopRightRadius)+A),X=Math.max(0,Dt(O.borderBottomRightRadius)+A),_t=Math.max(0,Dt(O.borderBottomLeftRadius)+A),Tt=Math.max(0,j.right),wt=Math.max(0,j.top),Lt=Math.max(0,j.right),yt=Math.max(0,j.bottom),Bt=Math.max(0,j.left),Mt=Math.max(0,j.bottom),kt=Math.max(0,j.left),Nt=Math.max(0,j.top)}}else h=s||b.BELOW,(h===b.BELOW||h===b.ABOVE)&&(rt=M/2-c,h===b.BELOW?H=-c*2:at=-c*2),(h===b.LEFT||h===b.RIGHT)&&(H=B/2-c,h===b.LEFT?$=-c*2:rt=-c*2);e.tooltipPlacement=h,ot+=` userflowjs-bubble__tooltip-notch--${h.toLowerCase()}`,V="",q&&(pt+=" userflowjs-tooltip-backdrop--visible",gt+=" userflowjs-tooltip-block--visible",Et+=" userflowjs-tooltip-block--visible",vt+=" userflowjs-tooltip-block--visible",Pt+=" userflowjs-tooltip-block--visible");break}}d.style.transition="";let Ht=n,St=f;if(t&&(d.style.opacity="0",k===y.TOOLTIP))switch(e.tooltipPlacement){case b.BELOW:f+=24;break;case b.ABOVE:f-=24;break;case b.RIGHT:n+=24;break;case b.LEFT:n-=24;break}if(o!=="relative"&&ue(d,n,f),w.className=ot,w.style.visibility=V,m(w,"top",H),m(w,"right",$),m(w,"bottom",at),m(w,"left",rt),r.className=pt,m(r,"top",J),m(r,"right",Rt),m(r,"bottom",nt),m(r,"left",ft),m(r,"border-top-left-radius",ht),m(r,"border-top-right-radius",lt),m(r,"border-bottom-right-radius",X),m(r,"border-bottom-left-radius",_t),L.className=gt,m(L,"width",Tt),m(L,"height",wt),I.className=Et,m(I,"left",Lt),m(I,"height",yt),C.className=vt,m(C,"left",Bt),m(C,"top",Mt),z.className=Pt,m(z,"width",kt),m(z,"top",Nt),t){d.offsetWidth;const h="opacity 250ms linear";k===y.TOOLTIP?d.style.transition=`${h}, transform 500ms cubic-bezier(0.25, 0.8, 0.5, 1)`:d.style.transition=h,d.style.opacity="1",o!=="relative"&&ue(d,Ht,St)}}function Ye({targetRect:e,bubbleWidth:t,bubbleHeight:o,containerWidth:T,containerHeight:E,viewportClipRect:s,tooltipNotchSize:a,currentTooltipPlacement:d,desiredTooltipPlacement:w}){if(e.bottom<=s.top)return o+a<=E-s.top?b.BELOW:b.ABOVE;if(e.top>=s.bottom)return o+a<=s.bottom?b.ABOVE:b.BELOW;if(e.right<=s.left)return t+a<=T-s.left?b.RIGHT:b.LEFT;if(e.left>=s.right)return t+a<=s.right?b.LEFT:b.RIGHT;const r=I=>{const C=e.left+e.width/2,z=C>=s.left&&C<=s.right,tt=e.top+e.height/2,k=tt>=s.top&&tt<=s.bottom;switch(I){case b.BELOW:return E-e.bottom>o+a&&z;case b.ABOVE:return e.top>o+a&&z;case b.RIGHT:return T-e.right>t+a&&k;case b.LEFT:return e.left>t+a&&k}};if(w&&r(w))return w;if(d&&r(d))return d;const L=[{placement:b.BELOW,dist:e.top},{placement:b.ABOVE,dist:E-e.bottom},{placement:b.RIGHT,dist:e.left},{placement:b.LEFT,dist:T-e.right}];L.sort((I,C)=>I.dist-C.dist);for(const{placement:I}of L)if(r(I))return I;return b.BELOW}function m(e,t,o){o==null?e.style.removeProperty(t):e.style.setProperty(t,typeof o=="number"?o+"px":o,"important")}function ue(e,t,o){t=Math.round(t),o=Math.round(o),e.style.transform=`translate3d(${t}px, ${o}px, 0px)`}function Ge(e){if(G.customScrollIntoView){G.customScrollIntoView(e);return}const{scrollPadding:t}=G;if(t&&je(e)===document.scrollingElement){const o=t.top||0,T=t.right||0,E=t.bottom||0,s=t.left||0;let a=0,d=0;const w=e.getBoundingClientRect(),r=Ft(),L=Yt();if(w.top<o?a=w.top-o:w.bottom>L-E&&(a=w.bottom-L+E),w.left<s?d=w.left-s:w.right>r-T&&(d=w.right-r+T),a!=0||d!=0){window.scrollBy({top:a,left:d,behavior:"smooth"});return}}try{e.scrollIntoView({behavior:"smooth",block:"nearest"})}catch(o){console.warn("Userflow.js: scrollIntoView error (falling back to no options).",o),e.scrollIntoView()}}function $e(e){if(!e||e==="0")return{paddingTop:0,paddingRight:0,paddingBottom:0,paddingLeft:0};const t=e.trim().split(" ");if(t.length===1){const o=it(t[0]);return{paddingTop:o,paddingRight:o,paddingBottom:o,paddingLeft:o}}else if(t.length===2){const o=it(t[0]),T=it(t[1]);return{paddingTop:o,paddingRight:T,paddingBottom:o,paddingLeft:T}}else return{paddingTop:it(t[0]),paddingRight:it(t[1]),paddingBottom:it(t[2]),paddingLeft:it(t[3])}}function it(e){const t=parseInt(e,10);return isNaN(t)?0:t}export{io as B,uo as F};
|
|
3
3
|
//# sourceMappingURL=FlowChrome.js.map
|
package/NotificationsApp.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{R as t}from"./vendor.react.js";import{u as i}from"./client-context.js";import{w as a,f as r,N as n}from"./flow-host.styl.js";import{a as
|
|
1
|
+
import{R as t}from"./vendor.react.js";import{u as i}from"./client-context.js";import{w as a,f as r,N as n}from"./flow-host.styl.js";import{a as c,D as l}from"./stylesheets.js";import{C as m}from"./vendor.fortawesome.pro-regular-svg-icons.js";import"./vendor.core-js.js";import"./vendor.object-assign.js";import"./vendor.i18next.js";import"./vendor.babel.runtime.js";import"./vendor.react-i18next.js";import"./userflow.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.fortawesome.pro-solid-svg-icons.js";import"./flow-condition-types.js";import"./vendor.date-fns.js";import"./roots.js";(function(){try{var e=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},s=new Error().stack;s&&(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[s]="bc128a40-118f-40fa-998f-dcbb9c47fceb",e._sentryDebugIdIdentifier="sentry-dbid-bc128a40-118f-40fa-998f-dcbb9c47fceb")}catch{}})();const T=({notifications:e})=>{const{loaded:s}=c(window,r);return s?t.createElement("div",{className:"userflowjs-notifications",style:{zIndex:a(n)}},e.map(o=>t.createElement(f,{key:o.id,notification:o}))):null},f=({notification:e})=>{const s=i();return t.createElement("div",{className:"userflowjs-notifications__toast"},t.createElement("div",{className:"userflowjs-notifications__toast-content"},t.createElement("span",{className:"userflowjs-notifications__toast-label"},e.label),e.message),t.createElement("div",{className:"userflowjs-notifications__toast-dismiss",onClick:()=>s.dismissNotification(e.id)},t.createElement(l,{icon:m})))};export{T as NotificationsApp,T as default};
|
|
2
2
|
//# sourceMappingURL=NotificationsApp.js.map
|