userflow.js-self-hosted 0.1.1023600 → 0.1.1023656

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/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 ue}from"./vendor.react-dom.js";import{u as P,U as Re}from"./client-context.js";import{d as ne,a as O,b as D,c as A,e as H,f as d,A as de,W as T,g as U,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{c as M,d as Be,e as re,g as Ee,h as F,i as qe,j as he,k as se,l as Ge,m as We,n as be,o as je,p as ze,q as L,a as I,r as Ye,s as ve,t as Xe,u as Ke,v as $e,w as Ze,x as Qe,y as Je,z as k,A as et,B as _e,C as tt,f as nt,D as rt,E as st,F as at,G as ot,H as lt,I as $,J as it}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{a as ct,b as ut}from"./vendor.fortawesome.pro-solid-svg-icons.js";import{D as m}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 ye}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{a as j}from"./react-hooks.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"./iframe-reset.styl.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]="31806f06-ab28-4f40-be4f-7b2e61b55fae",t._sentryDebugIdIdentifier="sentry-dbid-31806f06-ab28-4f40-be4f-7b2e61b55fae")}catch{}})();const ft=new URL("debugger.css",import.meta.url).href,Ce=i.createContext(void 0),S=()=>i.useContext(Ce),Ne=i.createContext(null),oe=()=>i.useContext(Ne),xe=i.createContext({debuggerClientConditions:new Map,meta:void 0,buildId:void 0}),V=()=>i.useContext(xe),B={verifySetup:{name:"Verify setup",icon:M},checkAutoStart:{name:"Check auto-start",icon:Be},currentUser:{name:"Current user",icon:re}},Se=i.createContext(void 0),Et=({children:t})=>{const n=P(),[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:F,MOUSEDOWN:qe,NOT_CLICK:vt,NOT_DISABLED:M,NOT_PRESENT:he,PRESENT:se},wt={COMPLETED:M,NOT_COMPLETED:F,NOT_SEEN:he,ACTIVE:Ge,NOT_ACTIVE:We,SEEN:se},yt={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 Ct(t){return yt[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===D.RELATIVE_BETWEEN?t.eventRelativeValue2:t.eventRelativeValue)!==1&&(s+="s"),t.eventTimeOperator!==D.RELATIVE_GT&&(s+=" ago"),s}function Tt(t){return(t.eventFrequencyOperator===A.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 A.BETWEEN:return"between";case A.EQ:return"exactly";case A.GTE:return"at least";case A.LTE:return"at most"}}function Ft(t){if(!t)return"";switch(t){case D.ANY:return"at any point in time";case D.RELATIVE_BETWEEN:return"between";case D.RELATIVE_GT:return"in the last";case D.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={[O.BANNER]:"banner",[O.CHECKLIST]:"checklist",[O.FLOW]:"flow",[O.EMBED]:"embed",[O.LAUNCHER]:"launcher",[O.RESOURCE_CENTER]:"resource center",[O.WORKFLOW]:"action paths"};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 fe(t){return({condition:n})=>{throw new Error(`conditionOperators.${n.operator}.${t} is not supported`)}}const Z={[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"},J(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"},J(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"},J(t.value)))},[d.AND]:{Preview:fe("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===de.FLOW&&t.value?e.createElement("span",null,t?.eventDisplayName??t.eventName):t.value))},[d.EXCLUDES_ALL]:{Preview:({condition:t})=>q(t,"does not include","all of")},[d.EXCLUDES_ANY]:{Preview:({condition:t})=>q(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})=>q(t,"includes","all of")},[d.INCLUDES_ANY]:{Preview:({condition:t})=>q(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===de.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:fe("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"},Q(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"},Q(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"},Q(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: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?I:t===!1?F:L,Oe=(t,n)=>{const s=S();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(m,{icon:l.icon({condition:n})}):null,e.createElement(l.Preview,{...t})),e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:a}))},Gt=()=>{const t=S(),[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(m,{icon:k})),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(m,{icon:et})," ",e.createElement("strong",null,"Logic Group")," ",e.createElement("span",{className:"userflow-debugger-info-text"},"Click to ",r?"collapse":"expand")),!r&&e.createElement(m,{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===d.AND,"userflow-debugger-condition__item__operator__or":n===d.OR})},n===d.AND&&"AND",n===d.OR&&"OR"):null},jt={[T.NONE]:F,[T.PENDING_SCHEDULE]:F,[T.SCHEDULED]:L,[T.FIRED]:I},zt=e.memo(()=>{const t=S(),{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(m,{icon:Ye}),e.createElement("span",null,"Wait ",e.createElement("strong",null,s)," seconds")),e.createElement(m,{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=S(),[n,s]=i.useState(!1),{startFrequency:r,listFlowLatestVersion:a}=t||{startFrequency:{}};if(!r||!a?.startFrequency||a?.startFrequency===U.NEVER)return null;const{currentFlowIntervalThrottle:o,frequency:l,frequencyUsage:c}=r,p=ce(l),_=ie(l);if(a.startFrequency===U.ONCE||a.startFrequency===U.ONCE_PER_GROUP)return e.createElement("div",{className:g(_)},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(m,{icon:ve}),e.createElement("strong",null,"Once per user"," ",a.startFrequency===U.ONCE_PER_GROUP&&"per company")),e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:p}));if(a.startFrequency===U.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(m,{dataAttrs:{"data-condition-status":"true"},icon:o===!1?L:I}));if(a.startFrequency===U.MULTIPLE){const E=l===!0&&o===!0,h=l===!0&&o===!1,x=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":E,"userflow-debugger-condition-frequency__intermediate__expanded":h,"userflow-debugger-condition-frequency__danger__expanded":x}:{"userflow-debugger-condition-frequency__success":E,"userflow-debugger-condition-frequency__intermediate":h,"userflow-debugger-condition-frequency__danger":x}}),onClick:C=>{s(!n),C.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:E?I:h?L:F})),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(m,{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(m,{dataAttrs:{"data-condition-status":"true"},icon:o===!1?L:I}))))}return null}),Xt=()=>{const t=S(),{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(m,{icon:_e}))):null},Kt=()=>{const t=S(),{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(m,{icon:s===!0?I:F}))},$t=()=>{const t=S(),{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(m,{icon:ce(n.scopeByGroup)}),e.createElement(z,{target:a,hovered:s},"User is not associated with a company"))},Zt=()=>{const t=S(),{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(m,{dataAttrs:{"data-condition-status":"true"},icon:r===!0?I:L}))},Qt=e.memo(()=>{const{hovered:t,eventHandlers:n,ref:s}=j(),r=S(),{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(m,{icon:Xe}),e.createElement("span",null,"This flow is currently ",e.createElement("strong",null,"snoozed"))),e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:L}),e.createElement(z,{target:s,hovered:t},"Snoozed until ",o)):null}),Ie={[N.PAGE]:{icon:()=>Ke,Preview:({condition:t})=>{const n=t.operator&&Z[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&&Z[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:()=>$e,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===d.FALSE?"is not in":"is in")," ",e.createElement("strong",null,n?.name||"Segment"))}},[N.ELEMENT]:{icon:({condition:t})=>t.elementState?_t[t.elementState]:Ze,Preview:({condition:t})=>e.createElement("span",null,"Element"," ",t.elementState&&e.createElement("strong",null,Ct(t.elementState)))},[N.INPUT_VALUE]:{icon:()=>Qe,Preview:({condition:t})=>{const n=t.operator&&Z[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})=>t.flow?.type===O.SITE?null: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===A.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!==D.ANY&&e.createElement(e.Fragment,null," ",e.createElement("strong",null,t.eventRelativeValue),t.eventTimeOperator===D.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:()=>I,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(ye,{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((E,h,x)=>{const C=this.getOptionGroup(h);C&&C!==_&&E.push(e.createElement("div",{key:"group:"+C,className:"combo-box__group-header"},C)),_=C;const u=["combo-box__option"];return x===a.highlightedIndex&&u.push("combo-box__option--highlighted"),this.props.optionClassName&&u.push(this.props.optionClassName),E.push(e.createElement(en,{key:this.getOptionKey(h,x),className:u.join(" "),option:h,idx:x,renderOptionText:r.renderOptionText,renderOptionItem:r.renderOptionItem,getOptionIcon:r.getOptionIcon,onClick:this.selectOption,onHover:this.highlightOption})),r.hasSeparatorAfter&&r.hasSeparatorAfter(h)&&E.push(e.createElement("div",{key:"sep-"+x,className:"combo-box__option-sep"})),E},[])}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(ye,{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=P(),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=P(),[r,a]=i.useState(!1),o=S(),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(m,{icon:F}),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(m,{icon:k}),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(m,{icon:k}),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(m,{icon:k,size:16}),e.createElement("span",null,"Another flow is currently active"))))},an=t=>{const[n,s]=i.useState(document.visibilityState==="visible"),r=i.useRef(t);return i.useEffect(()=>{r.current=t},[t]),i.useEffect(()=>{const a=()=>{const o=document.visibilityState==="visible";s(o),r.current?.(o)};return document.addEventListener("visibilitychange",a),()=>{document.removeEventListener("visibilitychange",a)}},[]),n},on=({close:t})=>{const n=P(),s=i.useRef(null),[r,a]=i.useState(!!n.clientToken),[o,l]=i.useState(()=>{const f=n.getSessionStorageState(),v=f?.debuggerApp?.x,y=f?.debuggerApp?.y||50;return{x:v??(document.body.clientWidth?Number(document.body.clientWidth)-450:50),y}}),[c,p]=i.useState(!1),_=i.useRef(null),{meta:E}=V(),{debuggerRoute:h}=le(),[x,C]=i.useState(!1),u=i.useRef(null),w=i.useRef({mouseX:0,mouseY:0,elementX:0,elementY:0});i.useEffect(()=>{o&&n.setSessionStorageState(f=>({...f,debuggerApp:{...f.debuggerApp,x:o.x,y:o.y}}))},[o]),i.useEffect(()=>{if(!c)return;const f=y=>{const R=y.clientX-w.current.mouseX,Y=y.clientY-w.current.mouseY,X=Math.min(w.current.elementX+R,window.document.body.clientWidth-200),K=Math.max(w.current.elementY+Y,0);u.current||(u.current=requestAnimationFrame(()=>{l({x:X,y:K}),u.current=null}))},v=()=>{p(!1)};return document.addEventListener("mousemove",f),document.addEventListener("mouseup",v),()=>{document.removeEventListener("mousemove",f),document.removeEventListener("mouseup",v),u.current&&(cancelAnimationFrame(u.current),u.current=null)}},[c,o]),i.useEffect(()=>{const f=()=>{l(y=>{const R=document.body.clientWidth-500,Y=document.body.clientHeight-100,X=Math.max(Math.min(y.x,R),0),K=Math.max(Math.min(y.y,Y),0);return{x:X,y:K}})},v=()=>{a(!!n.clientToken)};return window.addEventListener("resize",f),n.on("private:initialised",v),()=>{window.removeEventListener("resize",f),n.off("private:initialised",v)}},[]);const b=f=>{s.current&&(p(!0),f.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:b,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:C},e.createElement(Ne.Provider,{value:_},e.createElement("div",{className:"d-flex flex-column userflow-debugger-app",style:{visibility:x?"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(f=>({...f,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(ln,null),h==="verifySetup"&&e.createElement(cn,null),E?.endUser?.debuggerEnabled&&h==="checkAutoStart"&&e.createElement(un,null),h==="currentUser"&&e.createElement(dn,null)))))},ln=()=>{const t=P(),{meta:n}=V(),[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(m,{icon:B[a].icon}),e.createElement("span",null,B[a].name)),e.createElement("button",{className:"userflow-debugger-menu__toggle"},e.createElement(m,{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(m,{icon:_.icon}),_.name)}))):null},cn=()=>{const{meta:t,buildId:n}=V(),s=P(),[r,a]=i.useState(!!s.clientToken),o=i.useMemo(()=>s.isIdentified(),[s,t]),{setDebuggerRoute:l}=le();i.useEffect(()=>{const E=()=>{a(!!s.clientToken)};return s.on("private:initialised",E),()=>{s.off("private:initialised",E)}},[]);const c=i.useMemo(()=>{let E=$;const h={"d-flex flex-column gap-8":!0,"userflow-debugger-installation__step":!0};return r?(E=M,h["userflow-debugger-installation__step__success"]=!0):(E=it,h["userflow-debugger-installation__step__danger"]=!0),{icon:E,classes:h}},[r]),p=i.useMemo(()=>{let E=$;const h={"d-flex flex-column gap-8":!0,"userflow-debugger-installation__step":!0};return!r&&!o&&(E=$,h["userflow-debugger-installation__step__failed"]=!0),r&&!o&&(E=k,h["userflow-debugger-installation__step__warning"]=!0),r&&o&&(E=M,h["userflow-debugger-installation__step__success"]=!0),{icon:E,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(m,{icon:M,size:32}),"Userflow ",e.createElement("br",null),"installed"),e.createElement("div",{className:g(c.classes)},e.createElement(m,{icon:c.icon,size:32}),"Userflow ",e.createElement("br",null)," ",r?"":"not"," initialized"),e.createElement("div",{className:g(p.classes)},e.createElement(m,{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(m,{size:20,icon:at}),e.createElement(m,{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(m,{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(m,{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))},un=()=>{const t=P(),{debuggerClientConditions:n}=V(),[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===!0||l?.locale?.match===!1)return!1;const u=l?.startFrequency;return!(u&&(u.onlyIfNotCompleted===!1||u.scopeByGroup===!1||u.frequency===!1))},[l]);i.useEffect(()=>{_()},[]),an(u=>{u&&_()}),i.useEffect(()=>{s&&x(s.latestVersion)},[s]);const _=async()=>{C().then(u=>{if(u?.length&&(o(u),!s)){const w=t.getSessionStorageState()?.debuggerApp?.selectedFlowVersionId,b=u.find(f=>f.latestVersion.id===w);h(b??u[0])}})},E=we.debounce(async u=>{const w=[];for(const[v,y]of n.entries())w.push({conditionId:v,isTrue:y.isTrue});const b={kind:"DebugFlowAutostartCondition",flowVersionId:u.id,clientConditions:w},f=await t.send(b);c({...f,listFlowLatestVersion:u}),f.latestVersion?.id&&u.id!==f.latestVersion?.id&&(C().then(v=>{if(!v)return;o(v);const y=v?.find(R=>R.latestVersion.id===f.latestVersion?.id);y&&h(y)}),E(f.latestVersion))},300),h=u=>{r(u);const w=t.getSessionStorageState().debuggerApp;w&&w?.x&&t.setSessionStorageState(b=>({...b,debuggerApp:{...w,selectedFlowVersionId:u.latestVersion.id}}))},x=async u=>{n.forEach(b=>{b.untrack?.()}),n.clear();const{conditionTypes:w}=await Me(async()=>{const{conditionTypes:b}=await import("./flow-condition-types.js").then(f=>f.f);return{conditionTypes:b}},__vite__mapDeps([0,1,2,3,4,5,6,7]));for(const b of u.clientConditions){n.set(b.id,{condition:b,isTrue:null});const f=w[b.type];if(!f){console.error(`Unknown condition type ${b.type}`);continue}const v=n.get(b.id);v&&(v.untrack=f.track({sessionData:new ke([]),condition:b,callback:y=>{v.isTrue!==y&&(v.isTrue=y,E(u))}}))}},C=async()=>{try{return(await t.send({kind:"ListFlows",hasAutostartCondition:!0},{handlesRejection:!0})).flows?.filter(b=>b.type==="FLOW")}catch(u){u.code==="debugger_access_denied"&&ne("Access defined for List Flows");return}};return e.createElement("div",{className:"userflow-debugger-app__content"},e.createElement(Ce.Provider,{value:l},e.createElement(rn,{flows:a,selectedFlow:s,setSelectedFlow:h,debugAutoStartCondition:E}),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(m,{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(Zt,null),e.createElement(Xt,null),e.createElement(Gt,null),e.createElement($t,null),e.createElement(Qt,null))))},dn=e.memo(()=>{const{meta:t,buildId:n}=V();if(!t)return null;const r="https://app.userflow.com/app/"+(t.env.primary?t.env.company.slug:`${t.env.company.slug}@${t.env.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:_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 qn{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(mn,{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 mn=({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(on,{close:r}))))};export{qn 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 P,U as Re}from"./client-context.js";import{d as ne,a as O,b as D,c as A,e as H,f as d,A as de,W as T,g as U,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{c as M,d as Be,e as re,g as Ee,h as F,i as qe,j as he,k as se,l as Ge,m as We,n as be,o as je,p as ze,q as L,a as I,r as Ye,s as ve,t as Xe,u as Ke,v as $e,w as Ze,x as Qe,y as Je,z as k,A as et,B as _e,C as tt,f as nt,D as rt,E as st,F as at,G as ot,H as lt,I as $,J as it}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{a as ct,b as ut}from"./vendor.fortawesome.pro-solid-svg-icons.js";import{D as m}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 ye}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{a as j}from"./react-hooks.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"./iframe-reset.styl.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]="2a1779ad-168c-49a5-8a46-3e5c1dd8d650",t._sentryDebugIdIdentifier="sentry-dbid-2a1779ad-168c-49a5-8a46-3e5c1dd8d650")}catch{}})();const ft=new URL("debugger.css",import.meta.url).href,Ce=i.createContext(void 0),S=()=>i.useContext(Ce),Ne=i.createContext(null),oe=()=>i.useContext(Ne),xe=i.createContext({debuggerClientConditions:new Map,meta:void 0,buildId:void 0}),V=()=>i.useContext(xe),B={verifySetup:{name:"Verify setup",icon:M},checkAutoStart:{name:"Check auto-start",icon:Be},currentUser:{name:"Current user",icon:re}},Se=i.createContext(void 0),Et=({children:t})=>{const n=P(),[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:F,MOUSEDOWN:qe,NOT_CLICK:vt,NOT_DISABLED:M,NOT_PRESENT:he,PRESENT:se},wt={COMPLETED:M,NOT_COMPLETED:F,NOT_SEEN:he,ACTIVE:Ge,NOT_ACTIVE:We,SEEN:se},yt={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 Ct(t){return yt[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===D.RELATIVE_BETWEEN?t.eventRelativeValue2:t.eventRelativeValue)!==1&&(s+="s"),t.eventTimeOperator!==D.RELATIVE_GT&&(s+=" ago"),s}function Tt(t){return(t.eventFrequencyOperator===A.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 A.BETWEEN:return"between";case A.EQ:return"exactly";case A.GTE:return"at least";case A.LTE:return"at most"}}function Ft(t){if(!t)return"";switch(t){case D.ANY:return"at any point in time";case D.RELATIVE_BETWEEN:return"between";case D.RELATIVE_GT:return"in the last";case D.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={[O.BANNER]:"banner",[O.CHECKLIST]:"checklist",[O.FLOW]:"flow",[O.EMBED]:"embed",[O.LAUNCHER]:"launcher",[O.RESOURCE_CENTER]:"resource center",[O.WORKFLOW]:"action flows"};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 fe(t){return({condition:n})=>{throw new Error(`conditionOperators.${n.operator}.${t} is not supported`)}}const Z={[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"},J(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"},J(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"},J(t.value)))},[d.AND]:{Preview:fe("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===de.FLOW&&t.value?e.createElement("span",null,t?.eventDisplayName??t.eventName):t.value))},[d.EXCLUDES_ALL]:{Preview:({condition:t})=>q(t,"does not include","all of")},[d.EXCLUDES_ANY]:{Preview:({condition:t})=>q(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})=>q(t,"includes","all of")},[d.INCLUDES_ANY]:{Preview:({condition:t})=>q(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===de.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:fe("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"},Q(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"},Q(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"},Q(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: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?I:t===!1?F:L,Oe=(t,n)=>{const s=S();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(m,{icon:l.icon({condition:n})}):null,e.createElement(l.Preview,{...t})),e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:a}))},Gt=()=>{const t=S(),[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(m,{icon:k})),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(m,{icon:et})," ",e.createElement("strong",null,"Logic Group")," ",e.createElement("span",{className:"userflow-debugger-info-text"},"Click to ",r?"collapse":"expand")),!r&&e.createElement(m,{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===d.AND,"userflow-debugger-condition__item__operator__or":n===d.OR})},n===d.AND&&"AND",n===d.OR&&"OR"):null},jt={[T.NONE]:F,[T.PENDING_SCHEDULE]:F,[T.SCHEDULED]:L,[T.FIRED]:I},zt=e.memo(()=>{const t=S(),{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(m,{icon:Ye}),e.createElement("span",null,"Wait ",e.createElement("strong",null,s)," seconds")),e.createElement(m,{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=S(),[n,s]=i.useState(!1),{startFrequency:r,listFlowLatestVersion:a}=t||{startFrequency:{}};if(!r||!a?.startFrequency||a?.startFrequency===U.NEVER)return null;const{currentFlowIntervalThrottle:o,frequency:l,frequencyUsage:c}=r,p=ce(l),_=ie(l);if(a.startFrequency===U.ONCE||a.startFrequency===U.ONCE_PER_GROUP)return e.createElement("div",{className:g(_)},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(m,{icon:ve}),e.createElement("strong",null,"Once per user"," ",a.startFrequency===U.ONCE_PER_GROUP&&"per company")),e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:p}));if(a.startFrequency===U.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(m,{dataAttrs:{"data-condition-status":"true"},icon:o===!1?L:I}));if(a.startFrequency===U.MULTIPLE){const E=l===!0&&o===!0,h=l===!0&&o===!1,x=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":E,"userflow-debugger-condition-frequency__intermediate__expanded":h,"userflow-debugger-condition-frequency__danger__expanded":x}:{"userflow-debugger-condition-frequency__success":E,"userflow-debugger-condition-frequency__intermediate":h,"userflow-debugger-condition-frequency__danger":x}}),onClick:C=>{s(!n),C.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:E?I:h?L:F})),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(m,{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(m,{dataAttrs:{"data-condition-status":"true"},icon:o===!1?L:I}))))}return null}),Xt=()=>{const t=S(),{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(m,{icon:_e}))):null},Kt=()=>{const t=S(),{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(m,{icon:s===!0?I:F}))},$t=()=>{const t=S(),{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(m,{icon:ce(n.scopeByGroup)}),e.createElement(z,{target:a,hovered:s},"User is not associated with a company"))},Zt=()=>{const t=S(),{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(m,{dataAttrs:{"data-condition-status":"true"},icon:r===!0?I:L}))},Qt=e.memo(()=>{const{hovered:t,eventHandlers:n,ref:s}=j(),r=S(),{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(m,{icon:Xe}),e.createElement("span",null,"This flow is currently ",e.createElement("strong",null,"snoozed"))),e.createElement(m,{dataAttrs:{"data-condition-status":"true"},icon:L}),e.createElement(z,{target:s,hovered:t},"Snoozed until ",o)):null}),Ie={[N.PAGE]:{icon:()=>Ke,Preview:({condition:t})=>{const n=t.operator&&Z[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&&Z[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:()=>$e,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===d.FALSE?"is not in":"is in")," ",e.createElement("strong",null,n?.name||"Segment"))}},[N.ELEMENT]:{icon:({condition:t})=>t.elementState?_t[t.elementState]:Ze,Preview:({condition:t})=>e.createElement("span",null,"Element"," ",t.elementState&&e.createElement("strong",null,Ct(t.elementState)))},[N.INPUT_VALUE]:{icon:()=>Qe,Preview:({condition:t})=>{const n=t.operator&&Z[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})=>t.flow?.type===O.SITE?null: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===A.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!==D.ANY&&e.createElement(e.Fragment,null," ",e.createElement("strong",null,t.eventRelativeValue),t.eventTimeOperator===D.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:()=>I,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(ye,{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((E,h,x)=>{const C=this.getOptionGroup(h);C&&C!==_&&E.push(e.createElement("div",{key:"group:"+C,className:"combo-box__group-header"},C)),_=C;const u=["combo-box__option"];return x===a.highlightedIndex&&u.push("combo-box__option--highlighted"),this.props.optionClassName&&u.push(this.props.optionClassName),E.push(e.createElement(en,{key:this.getOptionKey(h,x),className:u.join(" "),option:h,idx:x,renderOptionText:r.renderOptionText,renderOptionItem:r.renderOptionItem,getOptionIcon:r.getOptionIcon,onClick:this.selectOption,onHover:this.highlightOption})),r.hasSeparatorAfter&&r.hasSeparatorAfter(h)&&E.push(e.createElement("div",{key:"sep-"+x,className:"combo-box__option-sep"})),E},[])}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(ye,{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=P(),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=P(),[r,a]=i.useState(!1),o=S(),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(m,{icon:F}),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(m,{icon:k}),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(m,{icon:k}),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(m,{icon:k,size:16}),e.createElement("span",null,"Another flow is currently active"))))},an=t=>{const[n,s]=i.useState(document.visibilityState==="visible"),r=i.useRef(t);return i.useEffect(()=>{r.current=t},[t]),i.useEffect(()=>{const a=()=>{const o=document.visibilityState==="visible";s(o),r.current?.(o)};return document.addEventListener("visibilitychange",a),()=>{document.removeEventListener("visibilitychange",a)}},[]),n},on=({close:t})=>{const n=P(),s=i.useRef(null),[r,a]=i.useState(!!n.clientToken),[o,l]=i.useState(()=>{const f=n.getSessionStorageState(),v=f?.debuggerApp?.x,y=f?.debuggerApp?.y||50;return{x:v??(document.body.clientWidth?Number(document.body.clientWidth)-450:50),y}}),[c,p]=i.useState(!1),_=i.useRef(null),{meta:E}=V(),{debuggerRoute:h}=le(),[x,C]=i.useState(!1),u=i.useRef(null),w=i.useRef({mouseX:0,mouseY:0,elementX:0,elementY:0});i.useEffect(()=>{o&&n.setSessionStorageState(f=>({...f,debuggerApp:{...f.debuggerApp,x:o.x,y:o.y}}))},[o]),i.useEffect(()=>{if(!c)return;const f=y=>{const R=y.clientX-w.current.mouseX,Y=y.clientY-w.current.mouseY,X=Math.min(w.current.elementX+R,window.document.body.clientWidth-200),K=Math.max(w.current.elementY+Y,0);u.current||(u.current=requestAnimationFrame(()=>{l({x:X,y:K}),u.current=null}))},v=()=>{p(!1)};return document.addEventListener("mousemove",f),document.addEventListener("mouseup",v),()=>{document.removeEventListener("mousemove",f),document.removeEventListener("mouseup",v),u.current&&(cancelAnimationFrame(u.current),u.current=null)}},[c,o]),i.useEffect(()=>{const f=()=>{l(y=>{const R=document.body.clientWidth-500,Y=document.body.clientHeight-100,X=Math.max(Math.min(y.x,R),0),K=Math.max(Math.min(y.y,Y),0);return{x:X,y:K}})},v=()=>{a(!!n.clientToken)};return window.addEventListener("resize",f),n.on("private:initialised",v),()=>{window.removeEventListener("resize",f),n.off("private:initialised",v)}},[]);const b=f=>{s.current&&(p(!0),f.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:b,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:C},e.createElement(Ne.Provider,{value:_},e.createElement("div",{className:"d-flex flex-column userflow-debugger-app",style:{visibility:x?"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(f=>({...f,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(ln,null),h==="verifySetup"&&e.createElement(cn,null),E?.endUser?.debuggerEnabled&&h==="checkAutoStart"&&e.createElement(un,null),h==="currentUser"&&e.createElement(dn,null)))))},ln=()=>{const t=P(),{meta:n}=V(),[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(m,{icon:B[a].icon}),e.createElement("span",null,B[a].name)),e.createElement("button",{className:"userflow-debugger-menu__toggle"},e.createElement(m,{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(m,{icon:_.icon}),_.name)}))):null},cn=()=>{const{meta:t,buildId:n}=V(),s=P(),[r,a]=i.useState(!!s.clientToken),o=i.useMemo(()=>s.isIdentified(),[s,t]),{setDebuggerRoute:l}=le();i.useEffect(()=>{const E=()=>{a(!!s.clientToken)};return s.on("private:initialised",E),()=>{s.off("private:initialised",E)}},[]);const c=i.useMemo(()=>{let E=$;const h={"d-flex flex-column gap-8":!0,"userflow-debugger-installation__step":!0};return r?(E=M,h["userflow-debugger-installation__step__success"]=!0):(E=it,h["userflow-debugger-installation__step__danger"]=!0),{icon:E,classes:h}},[r]),p=i.useMemo(()=>{let E=$;const h={"d-flex flex-column gap-8":!0,"userflow-debugger-installation__step":!0};return!r&&!o&&(E=$,h["userflow-debugger-installation__step__failed"]=!0),r&&!o&&(E=k,h["userflow-debugger-installation__step__warning"]=!0),r&&o&&(E=M,h["userflow-debugger-installation__step__success"]=!0),{icon:E,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(m,{icon:M,size:32}),"Userflow ",e.createElement("br",null),"installed"),e.createElement("div",{className:g(c.classes)},e.createElement(m,{icon:c.icon,size:32}),"Userflow ",e.createElement("br",null)," ",r?"":"not"," initialized"),e.createElement("div",{className:g(p.classes)},e.createElement(m,{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(m,{size:20,icon:at}),e.createElement(m,{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(m,{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(m,{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))},un=()=>{const t=P(),{debuggerClientConditions:n}=V(),[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===!0||l?.locale?.match===!1)return!1;const u=l?.startFrequency;return!(u&&(u.onlyIfNotCompleted===!1||u.scopeByGroup===!1||u.frequency===!1))},[l]);i.useEffect(()=>{_()},[]),an(u=>{u&&_()}),i.useEffect(()=>{s&&x(s.latestVersion)},[s]);const _=async()=>{C().then(u=>{if(u?.length&&(o(u),!s)){const w=t.getSessionStorageState()?.debuggerApp?.selectedFlowVersionId,b=u.find(f=>f.latestVersion.id===w);h(b??u[0])}})},E=we.debounce(async u=>{const w=[];for(const[v,y]of n.entries())w.push({conditionId:v,isTrue:y.isTrue});const b={kind:"DebugFlowAutostartCondition",flowVersionId:u.id,clientConditions:w},f=await t.send(b);c({...f,listFlowLatestVersion:u}),f.latestVersion?.id&&u.id!==f.latestVersion?.id&&(C().then(v=>{if(!v)return;o(v);const y=v?.find(R=>R.latestVersion.id===f.latestVersion?.id);y&&h(y)}),E(f.latestVersion))},300),h=u=>{r(u);const w=t.getSessionStorageState().debuggerApp;w&&w?.x&&t.setSessionStorageState(b=>({...b,debuggerApp:{...w,selectedFlowVersionId:u.latestVersion.id}}))},x=async u=>{n.forEach(b=>{b.untrack?.()}),n.clear();const{conditionTypes:w}=await Me(async()=>{const{conditionTypes:b}=await import("./flow-condition-types.js").then(f=>f.f);return{conditionTypes:b}},__vite__mapDeps([0,1,2,3,4,5,6,7]));for(const b of u.clientConditions){n.set(b.id,{condition:b,isTrue:null});const f=w[b.type];if(!f){console.error(`Unknown condition type ${b.type}`);continue}const v=n.get(b.id);v&&(v.untrack=f.track({sessionData:new ke([]),condition:b,callback:y=>{v.isTrue!==y&&(v.isTrue=y,E(u))}}))}},C=async()=>{try{return(await t.send({kind:"ListFlows",hasAutostartCondition:!0},{handlesRejection:!0})).flows?.filter(b=>b.type==="FLOW")}catch(u){u.code==="debugger_access_denied"&&ne("Access defined for List Flows");return}};return e.createElement("div",{className:"userflow-debugger-app__content"},e.createElement(Ce.Provider,{value:l},e.createElement(rn,{flows:a,selectedFlow:s,setSelectedFlow:h,debugAutoStartCondition:E}),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(m,{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(Zt,null),e.createElement(Xt,null),e.createElement(Gt,null),e.createElement($t,null),e.createElement(Qt,null))))},dn=e.memo(()=>{const{meta:t,buildId:n}=V();if(!t)return null;const r="https://app.userflow.com/app/"+(t.env.primary?t.env.company.slug:`${t.env.company.slug}@${t.env.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:_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 qn{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(mn,{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 mn=({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(on,{close:r}))))};export{qn as DebuggerUI};
3
3
  //# sourceMappingURL=DebuggerUI.js.map