userflow.js-self-hosted 0.1.1018395 → 0.1.1018396
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/BannerApp.js +1 -1
- package/BuilderBar.js +1 -1
- package/ChecklistApp.js +1 -1
- package/ChecklistUI.js +1 -1
- package/DebuggerUI.js +1 -1
- package/ElementSelectionApp.js +1 -1
- package/EmbedApp.js +1 -1
- package/FlowApp.js +2 -2
- package/FlowChrome.js +2 -2
- package/Frame.js +1 -1
- package/LauncherApp.js +1 -1
- package/NotificationsApp.js +1 -1
- package/ResourceCenterApp.js +4 -4
- package/ResourceCenterAssistantChat.js +2 -2
- package/ResourceCenterLauncherHandler.js +1 -1
- package/SitePage.js +2 -0
- package/SmartFlowRecordingApp.js +1 -1
- package/StartConditionTestingApp.js +1 -1
- package/TrackerTestingApp.js +1 -1
- package/TreeDoc.js +11 -0
- package/Trigger.js +1 -1
- package/client-context.js +1 -1
- package/hash.txt +1 -1
- package/i18n.js +2 -0
- package/iframe-reset.styl.js +2 -0
- package/package.json +1 -1
- package/site.css +3358 -0
- package/stylesheets.js +1 -1
- package/ui.js +2 -2
- package/use-client-query.js +2 -0
- package/use-selector-element-monitoring.js +1 -10
- package/userflow.js +7 -7
- package/vendor.babel.runtime.js +3 -3
- package/vendor.core-js.js +1 -1
- package/vendor.fortawesome.pro-regular-svg-icons.js +1 -1
- package/vendor.history.js +1 -1
- package/vendor.i18next.js +1 -1
- package/vendor.mini-create-react-context.js +1 -1
- package/vendor.path-to-regexp.js +1 -1
- package/vendor.prop-types.js +1 -1
- package/vendor.react-i18next.js +1 -1
- package/vendor.react-is.js +8 -1
- package/vendor.react-router-dom.js +2 -0
- package/vendor.react-router.js +1 -1
- package/vendor.resolve-pathname.js +1 -1
- package/vendor.tiny-invariant.js +1 -1
- package/vendor.value-equal.js +1 -1
package/BannerApp.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as
|
|
1
|
+
import{r as a,R as n}from"./vendor.react.js";import{l as s,E as A}from"./userflow.js";import{i as v}from"./i18n.js";import{u as D}from"./client-context.js";import{o as R}from"./vendor.obj-str.js";import{a as x,u as C,D as O}from"./stylesheets.js";import{E as $}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{S as P,R as W,B as Y}from"./TreeDoc.js";import{g as z}from"./flow-condition-types.js";import{f as U,w as H}from"./flow-host.styl.js";import{u as K,b as Z}from"./use-selector-element-monitoring.js";import{r as q}from"./vendor.react-dom.js";import{F as G}from"./Frame.js";import{d as i}from"./roots.js";import{u as J}from"./use-element-rect.js";import"./vendor.core-js.js";import"./vendor.object-assign.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.i18next.js";import"./vendor.babel.runtime.js";import"./vendor.react-i18next.js";import"./vendor.fortawesome.pro-solid-svg-icons.js";import"./vendor.date-fns.js";import"./vendor.scheduler.js";import"./iframe-reset.styl.js";import"./use-window-resize.js";(function(){try{var r=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},d=new Error().stack;d&&(r._sentryDebugIds=r._sentryDebugIds||{},r._sentryDebugIds[d]="b1399561-e466-44ae-a4ed-67261b841044",r._sentryDebugIdIdentifier="sentry-dbid-b1399561-e466-44ae-a4ed-67261b841044")}catch{}})();const Re=({session:r})=>{const d=D(),{version:c}=r,e=c.banner,y=x(c.theme),g=r.locale?r.locale.standardLocaleId:r.version.theme.languageId;a.useEffect(()=>{v.changeLanguage(g)},[g]);const t=a.useMemo(()=>document.createElement("div"),[]),[k,w]=a.useState(!1),{loaded:T}=C(window,U,y),[I,h]=a.useState(!1),E=T&&I,[M,B]=a.useState(0),u=a.useCallback(()=>{h(!1),B(o=>o+1)},[]),f=![s.BODY_FIRST,s.BODY_LAST].includes(e.embedMode),[l,S]=a.useState(null),F=a.useCallback(({targetEl:o})=>{S(o)},[]),N=a.useCallback(()=>{f&&console.warn(`Userflow.js: Could not find embed element for banner "${r.flow.name||r.flow.id}"`),S(null)},[f,r.flow.name,r.flow.id]);K({selector:e.embedSelector,targetMoved:F,targetLost:N});const b=a.useCallback(()=>{t.parentElement?.removeChild(t),w(!1),u()},[t,u]);a.useLayoutEffect(()=>{let o=null,m=null;if(f){if(!l){b();return}(e.overlay||e.sticky)&&(e.embedMode===s.ELEMENT_BEFORE||e.embedMode===s.ELEMENT_AFTER?m=l.parentElement:m=l,window.getComputedStyle(m).position==="static"&&(o=m.style.position,m.style.position="relative"))}switch(e.embedMode){case s.BODY_FIRST:document.body.insertAdjacentElement("afterbegin",t);break;case s.BODY_LAST:document.body.insertAdjacentElement("beforeend",t);break;case s.ELEMENT_FIRST:l.insertAdjacentElement("afterbegin",t);break;case s.ELEMENT_LAST:l.insertAdjacentElement("beforeend",t);break;case s.ELEMENT_BEFORE:l.insertAdjacentElement("beforebegin",t);break;case s.ELEMENT_AFTER:l.insertAdjacentElement("afterend",t);break}return w(!0),u(),()=>{m&&o!=null&&(m.style.position=o)}},[b,t,f,l,e.overlay,e.sticky,e.embedMode,u]),a.useLayoutEffect(()=>b,[b]);const L=R({"userflowjs-banner":!0,[`userflowjs-banner--animate-${String(e.animate)}`]:!0,[`userflowjs-banner--embed-mode-${e.embedMode}`]:!0,[`userflowjs-banner--sticky-${String(e.sticky)}`]:!0,[`userflowjs-banner--overlay-${e.overlay}`]:!0});a.useLayoutEffect(()=>{t.className=L||""},[t,L]);const p=e.zIndex||H(0);a.useLayoutEffect(()=>{t.style.zIndex=p==null?"":String(p),t.style.position=E?"":"absolute",t.style.visibility=E?"":"hidden"},[t,p,E]);const{height:j,setEl:_}=J();return a.useLayoutEffect(()=>{t.style.setProperty("--userflowjs-banner-height",i(j+(e.marginTop||0)+(e.marginBottom||0))||"")},[t,j,e.marginTop,e.marginBottom]),k?q.createPortal(n.createElement(P.Provider,{value:r},n.createElement(G,{key:M,className:"userflowjs-banner-frame",style:{maxWidth:i(e.maxWidth),marginTop:i(e.marginTop),marginRight:i(e.marginRight),marginBottom:i(e.marginBottom),marginLeft:i(e.marginLeft),borderRadius:i(e.borderRadius)},stylesheet:Z,theme:y,onStylesheetsLoad:h,title:"Banner"},n.createElement("div",{ref:_,className:R({"userflowjs-banner-root":!0,[`userflowjs-banner-root--content-layout-${e.contentLayout}`]:!0,"userflowjs-theme-root":!0}),dir:v.dir()},n.createElement("div",{className:"userflowjs-banner-start-spacer"}),n.createElement("div",{className:"userflowjs-banner-inner",style:{maxWidth:i(e.maxContentWidth)}},n.createElement("div",{className:"userflowjs-banner-content"},n.createElement(W,{doc:e.content,lookupAttribute:z(r.data)})),e.buttons.length>0&&n.createElement("div",{className:"userflowjs-banner-buttons"},e.buttons.map(o=>n.createElement(Y,{key:o.id,button:o})))),c.closeDisabled?n.createElement("div",{className:"userflowjs-banner-start-spacer"}):n.createElement("button",{"data-testid":"userflow-banner-dismiss",className:"userflowjs-banner-close",onClick:()=>d.endFlow(r,{endReason:A.USER_CLOSED})},n.createElement(O,{icon:$}))))),t):null};export{Re as BannerApp,Re as default};
|
|
2
2
|
//# sourceMappingURL=BannerApp.js.map
|
package/BuilderBar.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{R as e,r as t}from"./vendor.react.js";import{F as I}from"./Frame.js";import{S as v}from"./logomark.js";import{o as F}from"./vendor.obj-str.js";import{a as L,b as k}from"./vendor.fortawesome.pro-light-svg-icons.js";import{p as b}from"./userflow.js";import{
|
|
1
|
+
import{R as e,r as t}from"./vendor.react.js";import{F as I}from"./Frame.js";import{S as v}from"./logomark.js";import{o as F}from"./vendor.obj-str.js";import{a as L,b as k}from"./vendor.fortawesome.pro-light-svg-icons.js";import{p as b}from"./userflow.js";import{u as B,D}from"./stylesheets.js";import{u as N}from"./use-window-resize.js";import"./vendor.core-js.js";(function(){try{var r=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},n=new Error().stack;n&&(r._sentryDebugIds=r._sentryDebugIds||{},r._sentryDebugIds[n]="a039e51a-9365-4316-9fe5-7204bbd97d29",r._sentryDebugIdIdentifier="sentry-dbid-a039e51a-9365-4316-9fe5-7204bbd97d29")}catch{}})();const _=new URL("builder-ui-host.css",import.meta.url).href,P=new URL("builder-ui-frame.css",import.meta.url).href,p="builderBarPos",q=e.forwardRef(({onReadyChange:r,children:n,buttons:u},y)=>{const{loaded:h}=B(window,_),[E,S]=t.useState(!1),o=h&&E,c=t.useRef(!1);t.useEffect(()=>{o&&!c.current&&r&&(c.current=!0,r(!0))},[o,r]);const i=t.useRef(null),[s,g]=t.useState(null),[l,w]=t.useState(()=>b.getItem(p)==="top"?"top":"bottom"),R=t.useCallback(a=>{w(a),b.setItem(p,a)},[]),d=t.useRef(0),f=t.useCallback(()=>{const a=i.current;if(!a||!s||!o)return;const m=s.clientHeight;m!==d.current&&(d.current=m,a.style.setProperty("height",m+"px","important"))},[o,s]);return t.useLayoutEffect(()=>{f()}),N(f),t.useImperativeHandle(y,()=>({getFrame:()=>i.current,getRootEl:()=>s}),[s]),e.createElement(e.Fragment,null,e.createElement(I,{className:F({"userflowjs-builder-bar":!0,"userflowjs-builder-bar--top":l==="top"}),style:{visibility:o?void 0:"hidden",animation:o?void 0:"none"},elRef:i,stylesheet:P,onStylesheetsLoad:S,title:"Builder bar"},o&&e.createElement("div",{className:"root",ref:g},e.createElement("div",{className:"logomark"},e.createElement(v,null)),e.createElement("div",{className:"main"},n),e.createElement("div",{className:"buttons"},u,e.createElement("button",{key:l,className:"btn btn--square btn--plain-on-dark",onClick:()=>R(l==="top"?"bottom":"top")},e.createElement(D,{icon:l==="top"?L:k,size:20}))))))});export{q as B};
|
|
2
2
|
//# sourceMappingURL=BuilderBar.js.map
|
package/ChecklistApp.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as s,R as c}from"./vendor.react.js";import{w as b,v as R,r as F,x as B}from"./userflow.js";import{F as _,B as N}from"./FlowChrome.js";import{i as D
|
|
1
|
+
import{r as s,R as c}from"./vendor.react.js";import{w as b,v as R,r as F,x as B}from"./userflow.js";import{F as _,B as N}from"./FlowChrome.js";import{i as D}from"./i18n.js";import{f as P,w as j,C as U,S as A}from"./flow-host.styl.js";import{u as C}from"./client-context.js";import{u as H,D as O,a as I}from"./stylesheets.js";import{F as Z}from"./Frame.js";import{o as z}from"./vendor.obj-str.js";import{z as W}from"./roots.js";import{q as X}from"./vendor.fortawesome.pro-regular-svg-icons.js";import"./vendor.core-js.js";import{u as M}from"./vendor.react-i18next.js";import{C as Y}from"./ChecklistUI.js";import"./vendor.object-assign.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./use-selector-element-monitoring.js";import"./flow-condition-types.js";import"./vendor.date-fns.js";import"./vendor.babel.runtime.js";import"./use-window-resize.js";import"./logomark.js";import"./vendor.canvas-confetti.js";import"./vendor.i18next.js";import"./vendor.fortawesome.pro-solid-svg-icons.js";import"./vendor.react-dom.js";import"./vendor.scheduler.js";import"./iframe-reset.styl.js";import"./TreeDoc.js";(function(){try{var t=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},e=new Error().stack;e&&(t._sentryDebugIds=t._sentryDebugIds||{},t._sentryDebugIds[e]="d9b52e4b-2313-48e9-9994-50417156e763",t._sentryDebugIdIdentifier="sentry-dbid-d9b52e4b-2313-48e9-9994-50417156e763")}catch{}})();const G=new URL("checklist-launcher-frame.css",import.meta.url).href,K=({position:t,theme:e,onClick:l,onVisibleChange:r,buttonRef:a,text:u,uncompletedCount:o})=>{const d=t||"absolute",{i18n:n}=M(),m=n.dir(),{loaded:i}=H(window,P,e),[h,k]=s.useState(!1),f=i&&h;s.useEffect(()=>{r&&r(f)},[r,f]);const w=s.useRef(null),L=s.useRef(0),[v,S]=s.useState(null);s.useLayoutEffect(()=>{const E=w.current;if(!E||!v)return;const y=v.clientWidth;y!==L.current&&(L.current=y,E.style.setProperty("width",W(y)+"px","important"),E.style.setProperty("height",e.checklistLauncherHeight+"px","important"))});const p=e.checklistLauncherPlacement,x=p===b.TOP_LEFT||p===b.TOP_RIGHT,g=p===b.TOP_LEFT||p===b.BOTTOM_LEFT,T={zIndex:d==="fixed"?e.checklistZIndex!=null?e.checklistZIndex:j(U):1,top:x?e.checklistLauncherY+"px":void 0,bottom:x?void 0:e.checklistLauncherY+"px",[m==="ltr"?"left":"right"]:g?e.checklistLauncherX+"px":void 0,[m==="ltr"?"right":"left"]:g?void 0:e.checklistLauncherX+"px",height:e.checklistLauncherHeight+"px",borderRadius:e.checklistLauncherBorderRadius+"px",position:f?void 0:"absolute",visibility:f?void 0:"hidden",animation:f?void 0:"none"};return c.createElement(Z,{elRef:w,testId:"checklist-launcher-app",className:z({"userflowjs-checklist-launcher":!0,[`userflowjs-checklist-launcher--position-${d}`]:!0}),style:T,stylesheet:G,theme:e,onStylesheetsLoad:k,title:"Checklist launcher"},c.createElement("button",{ref:a,className:"userflowjs-checklist-launcher-frame-root",onClick:l},c.createElement("div",{ref:S,className:"userflowjs-checklist-launcher-content"},c.createElement("div",{className:"userflowjs-checklist-launcher-text"},u||"Get Started"),c.createElement("div",{"data-testid":"checklist-launcher-uncompleted-count",className:"userflowjs-checklist-launcher-uncompleted-count"},o===0?c.createElement(O,{icon:X}):o,c.createElement("div",{className:"userflowjs-a11y-only"},"uncompleted tasks")))))},Se=({session:t,checklistExpanded:e})=>{const{version:l}=t,r=l.checklist,a=t.locale?t.locale.standardLocaleId:t.version.theme.languageId;s.useEffect(()=>{D.changeLanguage(a)},[a]);const[u,o]=s.useState(!1);return e?c.createElement(q,{session:t,initialAutoFocus:u,setInitialAutoFocus:o}):r.launcherEnabled?c.createElement(V,{session:t,initialAutoFocus:u,setInitialAutoFocus:o}):null},q=({session:t,initialAutoFocus:e,setInitialAutoFocus:l})=>{const r=C(),[a,u]=s.useState(null),{version:o}=t,d=o.checklist,n=I(o.theme),m=s.useMemo(()=>({...n,avatarType:R.NONE,bubblePlacement:n.checklistPlacement,bubbleX:n.checklistX,bubbleY:n.checklistY,bubbleWidth:n.checklistWidth}),[n]);return s.useEffect(()=>{const i=a?.ownerDocument.defaultView;if(!i)return;const h=k=>{k.key==="Escape"&&(l(!0),r.hideChecklist())};return i.addEventListener("keydown",h),()=>i.removeEventListener("keydown",h)},[a,l,r]),c.createElement(A,null,c.createElement(_,{company:t.flow.company,theme:m,position:"fixed",stepAppearance:F.BUBBLE,zIndex:n.checklistZIndex,autoHide3pEnabled:!0,backgroundImageUrl:d.backgroundAsset&&d.backgroundAsset.assetUrl,bubbleFrameRootRef:u},c.createElement("div",{role:"dialog","aria-label":"Checklist"},c.createElement(Y,{session:t,initialAutoFocus:e}),c.createElement(N,{draftMode:t.draftMode,minimize:i=>{l(i.detail===0),r.hideChecklist()}}))))},V=({session:t,initialAutoFocus:e,setInitialAutoFocus:l})=>{const r=C(),[a,u]=s.useState(!1),[o,d]=s.useState(null),{version:n}=t,m=n.checklist,i=I(n.theme);return s.useEffect(()=>{!a||!o||!e||o.focus()},[r,o,a,e]),c.createElement(K,{position:"fixed",theme:i,onClick:h=>{l(h.detail===0),r.showChecklist()},onVisibleChange:u,buttonRef:d,text:m.launcherText,uncompletedCount:B(t)})};export{Se as ChecklistApp,Se as default};
|
|
2
2
|
//# sourceMappingURL=ChecklistApp.js.map
|
package/ChecklistUI.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{R as e,r as l}from"./vendor.react.js";import{E as I,p as _}from"./userflow.js";import{u as v}from"./client-context.js";import"./vendor.core-js.js";import{u as T}from"./vendor.react-i18next.js";import{o as F}from"./vendor.obj-str.js";import{D as C}from"./stylesheets.js";import{c as P,d as L}from"./vendor.fortawesome.pro-solid-svg-icons.js";import{h as M,
|
|
1
|
+
import{R as e,r as l}from"./vendor.react.js";import{E as I,p as _}from"./userflow.js";import{u as v}from"./client-context.js";import"./vendor.core-js.js";import{u as T}from"./vendor.react-i18next.js";import{o as F}from"./vendor.obj-str.js";import{D as C}from"./stylesheets.js";import{c as P,d as L}from"./vendor.fortawesome.pro-solid-svg-icons.js";import{h as M,c as x,r as B,R as $}from"./TreeDoc.js";import{g}from"./flow-condition-types.js";import{a as H,f as W}from"./vendor.fortawesome.pro-regular-svg-icons.js";(function(){try{var t=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},s=new Error().stack;s&&(t._sentryDebugIds=t._sentryDebugIds||{},t._sentryDebugIds[s]="29a84b86-bbc2-4101-908b-186e4d77093b",t._sentryDebugIdIdentifier="sentry-dbid-29a84b86-bbc2-4101-908b-186e4d77093b")}catch{}})();const z=e.forwardRef(({elProps:t,onClick:s,onCheckmarkClick:n,completed:o,disabled:u,name:c,text:b,active:m,htmlAttributes:a,children:i},w)=>{const d=l.useRef(o);return e.createElement("button",{...t,ref:w,"data-testid":"bubble-task",tabIndex:s?0:-1,className:F({"userflowjs-bubble-task":!0,"userflowjs-bubble-task--completed":!!o,"userflowjs-bubble-task--just-completed":!d.current&&!!o,"userflowjs-bubble-task--disabled":!o&&!!u,"userflowjs-bubble-task--clickable":!!s,"userflowjs-bubble-task--active":!!m}),onClick:s,...a},e.createElement("div",{className:"userflowjs-bubble-task__checkmark",onClick:n},o&&e.createElement(C,{icon:P})),e.createElement("div",{className:"userflowjs-bubble-task__content"},e.createElement("div",{className:"userflowjs-bubble-task__name"},c),e.createElement("div",{className:"userflowjs-bubble-task__text"},b)),e.createElement("div",{className:"userflowjs-bubble-task__arrow"},!o&&e.createElement("div",{className:"userflowjs-rtl-mirrored"},e.createElement(C,{icon:L}))),i)}),G=({task:t,previousTasksCompleted:s})=>{const n=v(),{session:o}=S(),u=o.version.checklist,[c,b]=l.useState(()=>n.taskIsUnacked(t.cvid));l.useEffect(()=>{if(!c)return;const d=window.setTimeout(()=>b(!1),500);return()=>window.clearTimeout(d)},[c]);const m=o.taskCompletions.some(({taskCvid:d})=>d===t.cvid),a=!c&&m;l.useEffect(()=>{a&&n.ackCompletedTask(t.cvid)},[n,a,t.cvid]);const i=u.completeInOrder&&!s,w=i||t.actions.length===0&&a?void 0:()=>{n.send({kind:"ClickChecklistTask",sessionId:o.id,taskCvid:t.cvid},{batch:!0}),t.actions.length>0&&(a||!t.completesOnClick)&&n.hideChecklist(),M(n,o,t.actions)};return e.createElement(z,{onClick:w,name:e.createElement(x,{doc:t.name,lookupAttribute:g(o.data)}),text:e.createElement(x,{doc:t.text,lookupAttribute:g(o.data)}),completed:a,disabled:i})},J=({completedCount:t,taskCount:s})=>{const n=s===0?0:Math.min(100,Math.round(t/s*100));return e.createElement("div",{className:"userflowjs-bubble-checklist-progress"},e.createElement("div",{className:"userflowjs-bubble-checklist-progress-bg"},e.createElement("div",{className:"userflowjs-bubble-checklist-progress-text"},n,"%")),e.createElement("div",{className:"userflowjs-bubble-checklist-progress-fill",style:{width:`${n}%`}},e.createElement("div",{className:"userflowjs-bubble-checklist-progress-text"},n,"%")))},D=5e3,K=({active:t,onComplete:s})=>{const n=l.useRef(null);return l.useEffect(()=>{if(!t||!n.current)return;n.current.style.width="0%",n.current.offsetWidth,n.current.style.transition=`width ${D}ms linear`,n.current.style.width="100%";const o=setTimeout(s,D);return()=>clearTimeout(o)},[t,s]),e.createElement("div",{className:"userflowjs-bubble-progress--default userflowjs-bubble-progress-container--checklist"},t&&e.createElement("div",{className:"userflowjs-bubble-progress-background--checklist"}),e.createElement("div",{className:"userflowjs-bubble-progress__fill userflowjs-bubble-progress-fill--checklist",ref:n}))},Q=()=>{const{t}=T(),s=v(),n=S(),{session:o}=n,{version:u}=o,c=u.checklist,{dispatch:b}=U(),m=o.taskCompletions.length,a=c.tasks.length,i=m===a,w=l.useCallback(()=>{s.endFlow(o,{endReason:I.USER_CLOSED})},[s,o]);let d=!0,N=c.tasks,h=[],p=n.currentSectionName,y=!1;if(c.sectionsEnabled){let f=null;const k=Array.from(c.tasks).sort((r,E)=>r.sectionName.localeCompare(E.sectionName));for(const r of k)r.sectionName!==f&&(h.push(r.sectionName),f=r.sectionName);(!p||!h.includes(p))&&(p=h[0]),N=k.filter(r=>r.sectionName===p),y=N.some(r=>{const E=o.taskCompletions.some(({taskCvid:O})=>O===r.cvid);return r.blocksNextSection&&!E})}const j=p==null?-1:h.indexOf(p),R=f=>{const k=j+f;if(k>=0&&k<=h.length-1){const r=h[k];_.setItem("currentChecklistSectionName:"+o.id,r),b({kind:"setCurrentSection",sectionName:r})}};return e.createElement(e.Fragment,null,!B(c.content)&&e.createElement("div",{className:"userflowjs-bubble-content"},e.createElement($,{doc:c.content,lookupAttribute:g(o.data)})),e.createElement(J,{completedCount:m,taskCount:a}),c.sectionsEnabled&&e.createElement("div",{className:"userflowjs-bubble-section-name"},p||"First section"),e.createElement("div",{className:"userflowjs-bubble-tasks"},N.map(f=>{const k=d;return o.taskCompletions.some(({taskCvid:E})=>E===f.cvid)||(d=!1),e.createElement(G,{key:f.id,task:f,previousTasksCompleted:k})})),c.sectionsEnabled&&e.createElement("div",{className:"userflowjs-bubble-section-buttons"},e.createElement("button",{className:"userflowjs-bubble-section-button",onClick:()=>R(-1),disabled:j<=0},e.createElement(C,{icon:H}),e.createElement("span",null,t("checklist.previousSection"))),e.createElement("button",{className:"userflowjs-bubble-section-button",onClick:()=>R(1),disabled:j>=h.length-1||y},e.createElement("span",null,t("checklist.nextSection")),e.createElement(C,{icon:W}))),e.createElement("div",{className:"userflowjs-bubble-dismiss-row userflowjs-bubble-dismiss-row--checklist"},u.closeDisabled?e.createElement("div",{className:"userflowjs-bubble-checklist-dismiss-button-placeholder"}):e.createElement("button",{className:F({"userflowjs-bubble-dismiss-button":!0,"userflowjs-bubble-dismiss-button--completed":i}),onClick:()=>i?w():b({kind:"showClose"})},t("checklistDismiss.button")),c.autoDismissEnabled&&e.createElement(K,{active:i,onComplete:w})))},V=()=>{const{t}=T(),s=v(),{dispatch:n}=U(),{session:o}=S();return e.createElement("div",{role:"alert"},e.createElement("div",{className:"userflowjs-bubble-content"},e.createElement("p",null,e.createElement("b",null,t("checklistDismiss.title")))),e.createElement("div",{className:"userflowjs-bubble-buttons"},e.createElement("button",{className:"userflowjs-bubble-button userflowjs-bubble-button--primary",onClick:()=>s.endFlow(o,{endReason:I.USER_CLOSED})},e.createElement("div",{className:"userflowjs-bubble-button-text",role:"presentation"},t("checklistDismiss.yes"))),e.createElement("button",{className:"userflowjs-bubble-button userflowjs-bubble-button--default",onClick:()=>n({kind:"showFlow"})},e.createElement("div",{className:"userflowjs-bubble-button-text",role:"presentation"},t("checklistDismiss.cancel")))))};function X(t){const s=t?.querySelector(".userflowjs-bubble-task--clickable:not(.userflowjs-bubble-task--completed)")||t?.querySelector(".userflowjs-bubble-task--clickable")||t?.querySelector('button:not([tabIndex="-1"])');s&&typeof s.focus=="function"&&s.focus()}const be=({session:t,initialAutoFocus:s})=>{const n=v(),o=l.useRef(null),[u,c]=l.useReducer(Z,void 0,()=>({...Y,session:t,currentSectionName:_.getItem("currentChecklistSectionName:"+t.id),autoFocusRequested:!!s})),{session:b,contentType:m}=u;l.useEffect(()=>{b!==t&&c({kind:"updateSession",session:t})},[b,t]);const a=l.useMemo(()=>({dispatch:c}),[c]);return l.useEffect(()=>{if(!u.autoFocusRequested)return;const i=o.current;i&&X(i),c({kind:"autoFocused"})},[n,u.autoFocusRequested]),e.createElement(A.Provider,{value:a},e.createElement(q.Provider,{value:u},e.createElement("div",{ref:o},m==="close"?e.createElement(V,null):e.createElement(Q,null))))},Y={contentType:"flow"};function Z(t,s){switch(s.kind){case"updateSession":return{...t,session:s.session};case"showFlow":return{...t,contentType:"flow",autoFocusRequested:!0};case"showClose":return{...t,contentType:"close",autoFocusRequested:!0};case"setCurrentSection":return{...t,currentSectionName:s.sectionName};case"autoFocused":return{...t,autoFocusRequested:!1}}}const A=l.createContext(null),q=l.createContext(null);function U(){return l.useContext(A)}function S(){return l.useContext(q)}export{be as C,X as f};
|
|
2
2
|
//# sourceMappingURL=ChecklistUI.js.map
|
package/DebuggerUI.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["flow-condition-types.js","userflow.js","vendor.core-js.js","vendor.phoenix.js","vendor.uuid.js","vendor.date-fns.js","vendor.babel.runtime.js","roots.js"])))=>i.map(i=>d[i]);
|
|
2
|
-
import{r as i,R as e}from"./vendor.react.js";import{r as ue}from"./vendor.react-dom.js";import{u as L,U as Re}from"./client-context.js";import{d as ne,a as R,b as O,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{f as M,a as Be,b as re,c as Ee,d as I,e as qe,g as he,h as se,i as Ge,j as We,k as be,l as je,m as ze,n as F,o as D,p as Ye,q as ve,r as Xe,s as Ke,t as $e,u as Ze,v as Qe,w as Je,x as k,y as et,z as _e,A as tt,B as nt,C as rt,D as st,E as at,F as ot,G as lt,H as $,I as it}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{f as ct,a as ut}from"./vendor.fortawesome.pro-solid-svg-icons.js";import{D as 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 Ce}from"./Popover.js";import"./vendor.react-day-picker.js";import{f as ae,p as dt,a as mt}from"./vendor.date-fns.js";import{m as pt}from"./vendor.memoize-one.js";import{c as gt}from"./roots.js";import"./vendor.object-assign.js";import"./vendor.scheduler.js";import"./vendor.i18next.js";import"./vendor.babel.runtime.js";import"./vendor.react-i18next.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./flow-condition-types.js";import"./vendor.fortawesome.fontawesome-svg-core.js";(function(){try{var t=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},n=new Error().stack;n&&(t._sentryDebugIds=t._sentryDebugIds||{},t._sentryDebugIds[n]="24089078-4319-4dea-9f8d-db161676eb78",t._sentryDebugIdIdentifier="sentry-dbid-24089078-4319-4dea-9f8d-db161676eb78")}catch{}})();const ft=new URL("debugger.css",import.meta.url).href,ye=i.createContext(void 0),S=()=>i.useContext(ye),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=L(),[s,r]=i.useState(n.getSessionStorageState().debuggerApp?.selectedTab??"verifySetup");return i.useEffect(()=>{n.setSessionStorageState(a=>!a.debuggerApp||!a.debuggerApp.x?a:{...a,debuggerApp:{...a.debuggerApp,selectedTab:s}}),ne("Debugger Route changed to",s)},[s]),e.createElement(Se.Provider,{value:{debuggerRoute:s,setDebuggerRoute:r}},t)},le=()=>{const t=i.useContext(Se);if(t===void 0)throw new Error("useDebuggerRouteHandler must be used within a DebuggerRouteProvider");return{debuggerRoute:t.debuggerRoute,setDebuggerRoute:t.setDebuggerRoute}},ht=t=>{const n=i.useRef(null),s=oe();return i.useEffect(()=>{const r=s?.current,a=o=>{n.current&&!n.current.contains(o.target)&&t(o)};return document.addEventListener("mousedown",a),r?.contentDocument?.addEventListener("mousedown",a),()=>{document.removeEventListener("mousedown",a),r?.contentDocument?.removeEventListener("mousedown",a)}},[t,s,n]),n},bt=()=>e.createElement("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.createElement("path",{d:"M18.4393 5.56066C18.158 5.27936 18 4.89782 18 4.5C18 4.10218 18.158 3.72064 18.4393 3.43934C18.7206 3.15804 19.1022 3 19.5 3C19.8978 3 20.2794 3.15804 20.5607 3.43934C20.842 3.72064 21 4.10218 21 4.5C21 4.89782 20.842 5.27936 20.5607 5.56066C20.2794 5.84196 19.8978 6 19.5 6C19.1022 6 18.7206 5.84196 18.4393 5.56066Z",fill:"#537388"}),e.createElement("path",{d:"M3.43934 5.56066C3.15804 5.27936 3 4.89782 3 4.5C3 4.10218 3.15804 3.72064 3.43934 3.43934C3.72064 3.15804 4.10218 3 4.5 3C4.89782 3 5.27936 3.15804 5.56066 3.43934C5.84196 3.72064 6 4.10218 6 4.5C6 4.89782 5.84196 5.27936 5.56066 5.56066C5.27936 5.84196 4.89782 6 4.5 6C4.10218 6 3.72064 5.84196 3.43934 5.56066Z",fill:"#537388"}),e.createElement("path",{d:"M10.9393 13.0607C10.658 12.7794 10.5 12.3978 10.5 12C10.5 11.6022 10.658 11.2206 10.9393 10.9393C11.2206 10.658 11.6022 10.5 12 10.5C12.3978 10.5 12.7794 10.658 13.0607 10.9393C13.342 11.2206 13.5 11.6022 13.5 12C13.5 12.3978 13.342 12.7794 13.0607 13.0607C12.7794 13.342 12.3978 13.5 12 13.5C11.6022 13.5 11.2206 13.342 10.9393 13.0607Z",fill:"#537388"}),e.createElement("path",{d:"M3.43934 20.5607C3.15804 20.2794 3 19.8978 3 19.5C3 19.1022 3.15804 18.7206 3.43934 18.4393C3.72064 18.158 4.10218 18 4.5 18C4.89782 18 5.27936 18.158 5.56066 18.4393C5.84196 18.7206 6 19.1022 6 19.5C6 19.8978 5.84196 20.2794 5.56066 20.5607C5.27936 20.842 4.89782 21 4.5 21C4.10218 21 3.72064 20.842 3.43934 20.5607Z",fill:"#537388"}),e.createElement("path",{d:"M3.43934 13.0607C3.15804 12.7794 3 12.3978 3 12C3 11.6022 3.15804 11.2206 3.43934 10.9393C3.72064 10.658 4.10218 10.5 4.5 10.5C4.89782 10.5 5.27936 10.658 5.56066 10.9393C5.84196 11.2206 6 11.6022 6 12C6 12.3978 5.84196 12.7794 5.56066 13.0607C5.27936 13.342 4.89782 13.5 4.5 13.5C4.10218 13.5 3.72064 13.342 3.43934 13.0607Z",fill:"#537388"}),e.createElement("path",{d:"M10.9393 5.56066C10.658 5.27936 10.5 4.89782 10.5 4.5C10.5 4.10218 10.658 3.72064 10.9393 3.43934C11.2206 3.15804 11.6022 3 12 3C12.3978 3 12.7794 3.15804 13.0607 3.43934C13.342 3.72064 13.5 4.10218 13.5 4.5C13.5 4.89782 13.342 5.27936 13.0607 5.56066C12.7794 5.84196 12.3978 6 12 6C11.6022 6 11.2206 5.84196 10.9393 5.56066Z",fill:"#537388"})),vt={prefix:"far",iconName:"custom-hand-pointer-slash",icon:[641,512,[],"???","M185.554191,59.5126699 C189.248662,26.0794907 217.382589,0 251.429,0 C287.979,0 317.715,30.056 317.715,67 L317.715,140.634 C338.128,137.776 359.183,144.576 374.31,160.263 C401.503,147.416 434.689,154.593 454.182,179.361 C497.375,162.727 544,195.156 544,242 L544,326 C544,330.296189 543.590626,334.580726 542.780274,338.796073 L495.999,302.221942 L495.999,242 C495.999,216.84 459.428,216.879 459.428,242 C459.428,250.836 452.265,258 443.428,258 L439.435556,258 L420.622383,243.291649 C420.588346,242.865584 420.571,242.434817 420.571,242 L420.571,221 C420.571,197.943344 389.858993,196.049429 384.724023,215.225903 L269.713,125.308981 L269.713,67 C269.713,41.84 233.142,41.88 233.142,67 L233.142,96.717359 L185.554191,59.5126699 Z M162.172457,223.995642 L233.142,279.479508 L233.142,308.493 C233.142,324.063 213.106,330.402 204.111,317.776 L176.985,279.697 C162.585,259.485 133.185,282.08 147.591,302.303 L257.303,456.303 C260.737,461.122 266.231,464 272,464 L450.285,464 C455.041109,464 459.427079,462.119816 462.713129,458.957818 L500.616335,488.590478 C488.331086,503.061811 470.146238,512 450.286,512 L272,512 C250.741,512 230.632,501.59 218.209,484.154 L108.51,330.153 C87.267,300.334 93.705,258.796 123.06,237.001 C134.952446,228.171597 148.664261,223.998532 162.172457,223.995642 Z M272.143,309.970422 L306.143,336.551563 L306.143,400 C306.143,408.837 299.875,416 292.143,416 L286.143,416 C278.41,416 272.143,408.837 272.143,400 L272.143,309.970422 Z M347.571,368.939901 L381.571,395.521042 L381.571,400 C381.571,408.837 375.303,416 367.571,416 L361.571,416 C353.839,416 347.571,408.837 347.571,400 L347.571,368.939901 Z M633.994211,471.020009 C640.904211,476.540009 642.014211,486.610009 636.494211,493.510009 L626.494211,506 C620.964211,512.890009 610.904211,514.010009 604.004211,508.490009 L6.00421069,40.9800088 C-0.895789309,35.4600088 -2.01578931,25.3900088 3.51421069,18.4900088 L13.5142107,6 C19.0342107,-0.899991212 29.1042107,-2.00999121 36.0042107,3.51000879 L633.994211,471.020009 Z"]},_t={CLICK:Ee,DISABLED:I,MOUSEDOWN:qe,NOT_CLICK:vt,NOT_DISABLED:M,NOT_PRESENT:he,PRESENT:se},wt={COMPLETED:M,NOT_COMPLETED:I,NOT_SEEN:he,ACTIVE:Ge,NOT_ACTIVE:We,SEEN:se},Ct={CLICK:"is clicked",DISABLED:"is disabled",MOUSEDOWN:"has mouse down on it",NOT_CLICK:"is not clicked",NOT_DISABLED:"is not disabled",NOT_PRESENT:"is not present",PRESENT:"is present"};function yt(t){return Ct[t]}const Nt={COMPLETED:"completed",NOT_COMPLETED:"not completed",NOT_SEEN:"not seen",ACTIVE:"is currently active",NOT_ACTIVE:"is not currently active",SEEN:"seen"};function xt(t){return Nt[t]}function St(t,n){let s=(n||"").toLowerCase();return(t.eventTimeOperator===O.RELATIVE_BETWEEN?t.eventRelativeValue2:t.eventRelativeValue)!==1&&(s+="s"),t.eventTimeOperator!==O.RELATIVE_GT&&(s+=" ago"),s}function Tt(t){return(t.eventFrequencyOperator===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 O.ANY:return"at any point in time";case O.RELATIVE_BETWEEN:return"between";case O.RELATIVE_GT:return"in the last";case O.RELATIVE_LT:return"more than"}}const Lt={1:"Lowest",2:"Low",3:"Medium",4:"High",5:"Highest"};function Pt(t){return`${Lt[t]||String(t)} priority`}function te(t,n){switch(t){case H.DAY:return n===1?"day":"days";case H.HOUR:return n===1?"hour":"hours";case H.MINUTE:return n===1?"minute":"minutes";case H.SECOND:return n===1?"second":"seconds"}}function me(t){switch(t){case"USER":return re;case"GROUP":return ze;case"GROUP_MEMBERSHIP":return je;case"EVENT":return be}}function Rt(t){const n=t.split("/");if(n.length===1)return["USER",t];switch(n[0]){case"group":return["GROUP",n[1]];case"group_membership":return["GROUP_MEMBERSHIP",n[1]];case"event":return["EVENT",n[1]]}return console.warn("parseAttributeDefinitionFqn: Invalid attribute definition FQN",t),["USER",t]}const Ut={[R.BANNER]:"banner",[R.CHECKLIST]:"checklist",[R.FLOW]:"flow",[R.EMBED]:"embed",[R.LAUNCHER]:"launcher",[R.RESOURCE_CENTER]:"resource center"};function At(t,{title:n,plural:s}={}){let r=Ut[t];return n&&(r=ee.upperFirst(r)),s&&(r+="s"),r}const Mt=["yyyy-MM-dd","yyyy/MM/dd","MM-dd yyyy","MM/dd yyyy","MM-dd-yyyy","MM/dd/yyyy","MM-dd","MM/dd","dd MMM yyyy","dd MMMM yyyy","MMM dd yyyy","MMMM dd yyyy","dd MMM","dd MMMM","MMM dd","MMMM dd"],kt=["hh:mmaaa","hh.mmaaa","hh:mm aaa","hh.mm aaa","HH:mm","HH.mm","hhaaa","hh aaa","HH"];for(const t of Mt)for(const n of kt);const Vt="d MMM yyyy";function pe(t){if(t==null)return"";const n=Bt?t.getMinutes()===0?"h aaa":"h:mm aaa":"HH:mm";return ae(t,Vt+", "+n)}function Ht(t){if(!t)return null;const n=dt(t,"yyyy-MM-dd",new Date);return isNaN(n.valueOf())?null:n}function ge(t){if(!t)return null;const n=mt(t);return isNaN(n.valueOf())?null:n}const Bt=Intl.DateTimeFormat(Intl.DateTimeFormat().resolvedOptions().locale,{hour:"numeric"}).resolvedOptions().hourCycle==="h12";var Te=(t=>(t.EVENT="EVENT",t.GROUP="GROUP",t.GROUP_MEMBERSHIP="GROUP_MEMBERSHIP",t.USER="USER",t))(Te||{});function j(){const[t,n]=i.useState(!1),s=i.useRef(null),r=i.useCallback(()=>n(!0),[]),a=i.useCallback(()=>n(!1),[]),o=i.useCallback(()=>n(!0),[]),l=i.useCallback(()=>n(!1),[]);return{ref:s,hovered:t,eventHandlers:{onPointerEnter:r,onPointerLeave:a,onFocus:o,onBlur:l}}}function fe(t){return({condition:n})=>{throw new Error(`conditionOperators.${n.operator}.${t} is not supported`)}}const 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?D:t===!1?I:F,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]:I,[T.PENDING_SCHEDULE]:I,[T.SCHEDULED]:F,[T.FIRED]:D},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?F:D}));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:y=>{s(!n),y.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?D:h?F:I})),n&&e.createElement(e.Fragment,null,e.createElement("div",{className:g(_)},e.createElement("span",null,e.createElement("strong",null,a.startLimit)," ",e.createElement("span",{className:"userflow-debugger-info-text"},"(started ",c," times)")),e.createElement(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?F:D}))))}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?D:I}))},$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?D:F}))},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:F}),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,yt(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})=>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!==O.ANY&&e.createElement(e.Fragment,null," ",e.createElement("strong",null,t.eventRelativeValue),t.eventTimeOperator===O.RELATIVE_BETWEEN&&e.createElement(e.Fragment,null," ",e.createElement("span",{className:"userflow-debugger-info-text"},"and")," ",e.createElement("strong",null,t.eventRelativeValue2))," ",e.createElement("span",{className:"userflow-debugger-info-text"},St(t,t.eventRelativeUnit))),t.eventActor&&t.eventActor!==Ae.CURRENT_USER?e.createElement(e.Fragment,null," ",e.createElement("strong",null,Dt(t.eventActor))):"",t.whereCondition&&s&&e.createElement(z,{hovered:!0,target:n},"Where ",e.createElement("br",null),e.createElement(Fe,{condition:t.whereCondition})))}},[N.ALWAYS_TRUE]:{icon:()=>D,Preview:()=>e.createElement("span",null,"Water is wet")},[N.CHECKLIST_TASK_CLICKED]:{icon:()=>Ee,Preview:()=>e.createElement("span",null,"Task is clicked")}},Fe=t=>e.createElement("div",null,t.condition.conditions.map((n,s)=>e.createElement("div",{key:n.id}," ",s===0?null:e.createElement("span",{className:"userflow-debugger-info-text"},t.condition.operator?.toLowerCase())," ",n.type==="ATTRIBUTE"&&Ie.ATTRIBUTE.Preview({condition:n,isRoot:!0,isHideCond:!1}),n.type==="CLAUSE"&&e.createElement(e.Fragment,null,"(",e.createElement(Fe,{condition:n}),")")))),z=({hovered:t,children:n,target:s})=>{const r=oe();return t?e.createElement(Ce,{className:"userflow-debugger-popover",target:s.current,placement:"top",horizontalAlign:"center",verticalAlign:"center",document:r?.current?.contentDocument||void 0},n):null};class Jt extends e.PureComponent{constructor(n){super(n),this.rootRef=e.createRef(),this.optionsElRef=e.createRef(),this.input=null,this.popoverRef=e.createRef(),this.isMouseDown=!1,this.isCreateOpen=!1,this.setInput=s=>{this.input=s;const{inputRef:r}=this.props;r&&(typeof r=="function"?r(s):r.current=s)},this.onInputChange=s=>{s.stopPropagation();const{value:r}=s.target;r!==""&&this.openPopover();const a=this.memoizedFilterOptions(this.props.options,r);this.setState({inputValue:r,q:r,highlightedIndex:a.length>0?0:-1,createHighlighted:a.length===0}),r===""&&!this.props.noEmpty&&this.triggerOnChange(null),this.props.onSearchChange&&this.props.onSearchChange(r)},this.onPopoverPlacementChange=s=>this.setState({popoverPlacement:s}),this.onMouseDown=s=>{s.preventDefault(),this.isMouseDown=!0;const r=()=>{this.isMouseDown=!1,this.props.document?.removeEventListener("mouseup",r),document.body.removeEventListener("mouseup",r)};this.props.document?.addEventListener("mouseup",r),document.body.addEventListener("mouseup",r)},this.onFocus=s=>{this.input&&!this.props.noSearch&&this.input.select(),this.props.onFocus&&this.props.onFocus(s)},this.onBlur=s=>{this.isMouseDown||this.closePopover(),this.props.onBlur&&!this.isCreateOpen&&this.props.onBlur(s)},this.onClose=()=>{this.state.popoverOpen&&this.closePopover(),this.props.onClose&&this.props.onClose()},this.onTriggerClick=()=>{this.props.readOnly||this.props.disabled||(this.state.popoverOpen?this.closePopover():(this.input&&this.input.focus(),this.openPopover()))},this.onKeyDown=s=>{const{popoverOpen:r,highlightedIndex:a,createHighlighted:o}=this.state,l=this.getFilteredOptions(),c=l.length-1;switch(s.key){case"ArrowUp":s.preventDefault(),r&&(o?this.setState({highlightedIndex:c,createHighlighted:!1}):a>0&&this.setState({highlightedIndex:a-1}));break;case"ArrowDown":s.preventDefault(),r?this.props.onCreate&&(a===c||o)?this.setState({highlightedIndex:-1,createHighlighted:!0}):a<c&&this.setState({highlightedIndex:a+1}):this.props.noOpenOnDown||this.openPopover();break;case"Enter":if(r)if(s.preventDefault(),o&&!this.props.disableCreate)this.fireOnCreate();else{const p=l[a];p||!this.props.noEmpty?this.selectOption(p):!p&&this.props.hideOnEmpty&&this.props.onEnter&&this.props.onEnter()}else this.props.onEnter?this.props.onEnter():this.openPopover();break;case"Tab":r&&!this.props.ignoreTab&&this.selectOption(l[a]);break;case"Escape":r&&(s.preventDefault(),s.stopPropagation(),this.setState({popoverOpen:!1}));break}},this.selectOption=s=>{s===this.props.value?this.setState({popoverOpen:!1,inputValue:this.renderOptionText(s),q:""}):(this.setState({popoverOpen:!1,inputValue:"",q:""}),this.triggerOnChange(s))},this.highlightOption=s=>{this.setState({highlightedIndex:s,createHighlighted:!1})},this.highlightCreate=()=>{this.setState({highlightedIndex:-1,createHighlighted:!0})},this.fireOnCreate=()=>{const{onCreate:s}=this.props;if(s){this.isCreateOpen=!0;const r={q:ee.upperFirst(this.state.q),callback:a=>{this.isCreateOpen=!1,a!=null&&this.selectOption(a),this.input&&this.input.focus()}};s(r),this.closePopover()}},this.openPopover=()=>{if(!this.state.popoverOpen){const s=this.getFilteredOptions();let r=0,a=!1;if(s.length===0)r=-1,a=!0;else{const{value:o}=this.props,l=s.findIndex(c=>c===o);l!==-1&&(r=l)}this.setState({popoverOpen:!0,highlightedIndex:r,createHighlighted:a})}},this.memoizedFilterOptions=pt((s,r)=>(s=s||[],r?s.filter(a=>this.filter(a,r)):s)),this.state={inputValue:this.renderOptionText(n.value==null?null:n.value),q:"",popoverOpen:!1,popoverPlacement:null,highlightedIndex:-1,createHighlighted:!1}}componentDidUpdate(n,s){const{value:r}=this.props;if(r!==n.value){const a=this.renderOptionText(r??null);a!==this.state.inputValue&&this.setState({inputValue:a})}s.highlightedIndex!==this.state.highlightedIndex&&this.scrollHighlightedOptionIntoView()}render(){let n,s=!1;const{props:r}=this,a=this.state,o=a.popoverPlacement==="top"?"above":"below";if(a.popoverOpen&&this.rootRef.current){const c=this.getFilteredOptions();if(this.props.hideOnEmpty&&c.length===0)s=!0;else{let p;if(c.length>0){let _=null;p=c.reduce((E,h,x)=>{const y=this.getOptionGroup(h);y&&y!==_&&E.push(e.createElement("div",{key:"group:"+y,className:"combo-box__group-header"},y)),_=y;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(Ce,{ref:this.popoverRef,className:"combo-box-popover"+(r.popoverNotch?"":` combo-box-popover--${o}`),noNotch:!r.popoverNotch,target:this.rootRef.current,forceDimension:!0,matchWidth:!0,minWidth:r.popoverMinWidth,onMouseDown:this.onMouseDown,onPlacementChange:this.onPopoverPlacementChange,document:r.document},e.createElement("div",{ref:this.optionsElRef,className:g({"combo-box__options":!0,"combo-box__options--with-create":!!r.onCreate})},p),r.onCreate&&e.createElement("div",{key:"create",className:g({"combo-box__option":!0,"combo-box__option--create":!0,"combo-box__option--highlighted":a.createHighlighted}),onClick:this.fireOnCreate,onMouseMove:this.highlightCreate},e.createElement("div",{className:"combo-box__create-icon"},e.createElement(G,{icon:tt})),e.createElement("div",{className:"combo-box__create-text"},"Create"," ",a.q===""?"new"+(r.noun?` ${r.noun}`:""):e.createElement("b",null,ee.upperFirst(a.inputValue)))))}}const l=["input-group","combo-box"];return a.popoverOpen&&!s&&(l.push("combo-box--open"),r.popoverNotch||l.push(`combo-box--with-popover-${o}`)),r.disabled&&l.push("input-group--disabled"),r.noSearch&&l.push("combo-box--no-search"),r.className&&l.push(r.className),e.createElement(e.Fragment,null,e.createElement("div",{className:l.join(" "),style:{width:r.width?r.width+"px":void 0},ref:this.rootRef,onClick:r.readOnly||r.disabled?void 0:()=>{this.input?.focus(),this.openPopover()}},r.childrenBefore,r.value&&r.getOptionIcon&&e.createElement("div",{className:"combobox__input-icon"},Pe(r.value,r.getOptionIcon)),e.createElement("input",{type:"text",className:r.inputClassName,name:r.name,value:a.inputValue,onChange:this.onInputChange,onFocus:this.onFocus,onBlur:this.onBlur,onKeyDown:this.onKeyDown,onMouseDown:this.openPopover,placeholder:r.placeholder,readOnly:r.readOnly||r.noSearch,disabled:r.disabled,autoComplete:"off",ref:this.setInput,...r.inputHtmlAttributes}),!r.noTrigger&&e.createElement("div",{"data-testid":r.triggerTestId||"combo-box-trigger",className:"input-group__append input-group__trigger",onClick:this.onTriggerClick,onMouseDown:this.onMouseDown},e.createElement(G,{icon:nt})),r.onClose&&e.createElement("div",{className:"input-group__append input-group__trigger",onClick:this.onClose},e.createElement(G,{icon:rt})),r.childrenAfter),n)}scrollHighlightedOptionIntoView(){const n=this.optionsElRef.current;if(this.state.popoverOpen&&n){const s=n.querySelector(".combo-box__option--highlighted");if(s){const r=n.getBoundingClientRect(),a=s.getBoundingClientRect();a.top<r.top?n.scrollTop+=a.top-r.top:a.bottom>r.bottom&&(n.scrollTop+=a.bottom-r.bottom)}}}triggerOnChange(n){const{onChange:s}=this.props;s&&s(n)}closePopover(){this.setState({popoverOpen:!1,inputValue:this.renderOptionText(this.props.value==null?null:this.props.value),q:""})}renderOptionText(n){return n==null?"":Le(n,this.props.renderOptionText)}getFilteredOptions(){return this.memoizedFilterOptions(this.props.options,this.state.q)}filter(n,s){return this.props.filter?this.props.filter(n,s):this.renderOptionText(n).toLowerCase().includes(s.toLowerCase())}getOptionKey(n,s){return n&&n.id||s}getOptionGroup(n){return this.props.getOptionGroup?this.props.getOptionGroup(n):n&&n.group||null}}class en extends e.PureComponent{constructor(){super(...arguments),this.state={isOptionDisabled:!1},this.onClick=()=>{this.state.isOptionDisabled||this.props.onClick(this.props.option)},this.onHover=()=>{this.state.isOptionDisabled||this.props.onHover(this.props.idx)}}componentDidMount(){const n=this.props.option!==void 0&&typeof this.props.option=="object"&&this.props.option!==null&&"disabled"in this.props.option&&this.props.option.disabled===!0;this.setState({isOptionDisabled:n})}componentDidUpdate(){const n=this.props.option!==void 0&&typeof this.props.option=="object"&&this.props.option!==null&&"disabled"in this.props.option&&this.props.option.disabled===!0;this.setState({isOptionDisabled:n})}render(){const{isOptionDisabled:n}=this.state,{props:s}=this;return e.createElement("div",{className:g({[s.className]:!0,"combo-box__option--disabled":n}),onClick:this.onClick,onMouseMove:this.onHover},tn(s.option,s.renderOptionText,s.renderOptionItem,s.getOptionIcon))}}function Le(t,n){return n?n(t):typeof t=="string"||typeof t=="number"?t:t?t.name:"?"}function tn(t,n,s,r){if(s)return s(t);{let a=Le(t,n);return r?e.createElement("div",{className:"d-flex align-flex-start"},e.createElement("div",{className:"combobox__option-icon"},Pe(t,r)),e.createElement("div",{className:"flex-1"},a)):a}}function Pe(t,n){const s=n(t);return nn(s)?e.createElement(G,{icon:s}):s}function nn(t){return gt(t)&&"iconName"in t}const rn=({selectedFlow:t,setSelectedFlow:n,flows:s,debugAutoStartCondition:r})=>{const a=L(),o=oe();i.useEffect(()=>{if(!t)return;r(t.latestVersion);const c=()=>{r(t.latestVersion)};return a.on("private:checkSessionsAck",c),document.addEventListener("visibilitychange",c),()=>{a.off("private:checkSessionsAck",c),document.removeEventListener("visibilitychange",c)}},[t]);const l=i.useCallback(c=>{!c||t?.latestVersion?.id===c.latestVersion.id||n(c)},[t]);return e.createElement(e.Fragment,null,e.createElement("div",{className:"d-flex align-center justify-space-between"},e.createElement("div",{className:"d-flex justify-space-between align-center"},"Select Flow"),e.createElement(Jt,{className:"userflow-debugger__flow__selector",value:t,options:s,placeholder:"Select flow",document:o?.current?.contentDocument||void 0,onChange:l,renderOptionItem:c=>c.name})),e.createElement(sn,{selectedFlow:t,selectedFlowVersionsId:t?.latestVersion?.id}))},sn=({selectedFlowVersionsId:t,selectedFlow:n})=>{const s=L(),[r,a]=i.useState(!1),o=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:I}),e.createElement("span",null,"The flow will not auto start ",e.createElement("br",null)," ",e.createElement("b",null,"User locale (",o?.locale?.code,") is not enabled.")))),r?e.createElement("div",{className:g({"d-flex align-center fade-in":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__flow__status":!0})},e.createElement("span",{className:"d-flex align-center gap-8"},e.createElement(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=L(),s=i.useRef(null),[r,a]=i.useState(!!n.clientToken),[o,l]=i.useState(()=>{const f=n.getSessionStorageState(),v=f?.debuggerApp?.x,C=f?.debuggerApp?.y||50;return{x:v??(document.body.clientWidth?Number(document.body.clientWidth)-450:50),y:C}}),[c,p]=i.useState(!1),_=i.useRef(null),{meta:E}=V(),{debuggerRoute:h}=le(),[x,y]=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=C=>{const P=C.clientX-w.current.mouseX,Y=C.clientY-w.current.mouseY,X=Math.min(w.current.elementX+P,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(C=>{const P=document.body.clientWidth-500,Y=document.body.clientHeight-100,X=Math.max(Math.min(C.x,P),0),K=Math.max(Math.min(C.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:y},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=L(),{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=L(),[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=L(),{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()=>{y().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,C]of n.entries())w.push({conditionId:v,isTrue:C.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&&(y().then(v=>{if(!v)return;o(v);const C=v?.find(P=>P.latestVersion.id===f.latestVersion?.id);C&&h(C)}),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:C=>{v.isTrue!==C&&(v.isTrue=C,E(u))}}))}},y=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(ye.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 Hn{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{Hn 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 F,b as O,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{b as M,c as Be,d as re,e as Ee,g as I,h as qe,i as he,j as se,k as Ge,l as We,m as be,n as je,o as ze,p as L,q as D,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,D as nt,E as rt,F as st,G as at,H as ot,I as lt,J as $,K as it}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{f as ct,a as ut}from"./vendor.fortawesome.pro-solid-svg-icons.js";import{D as 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 Ce}from"./Popover.js";import"./vendor.react-day-picker.js";import{f as ae,p as dt,a as mt}from"./vendor.date-fns.js";import{m as pt}from"./vendor.memoize-one.js";import{c as gt}from"./roots.js";import"./vendor.object-assign.js";import"./vendor.scheduler.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./iframe-reset.styl.js";import"./i18n.js";import"./vendor.i18next.js";import"./vendor.babel.runtime.js";import"./vendor.react-i18next.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]="1303208f-7176-4b08-ad88-3154d861954a",t._sentryDebugIdIdentifier="sentry-dbid-1303208f-7176-4b08-ad88-3154d861954a")}catch{}})();const ft=new URL("debugger.css",import.meta.url).href,ye=i.createContext(void 0),S=()=>i.useContext(ye),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:I,MOUSEDOWN:qe,NOT_CLICK:vt,NOT_DISABLED:M,NOT_PRESENT:he,PRESENT:se},wt={COMPLETED:M,NOT_COMPLETED:I,NOT_SEEN:he,ACTIVE:Ge,NOT_ACTIVE:We,SEEN:se},Ct={CLICK:"is clicked",DISABLED:"is disabled",MOUSEDOWN:"has mouse down on it",NOT_CLICK:"is not clicked",NOT_DISABLED:"is not disabled",NOT_PRESENT:"is not present",PRESENT:"is present"};function yt(t){return Ct[t]}const Nt={COMPLETED:"completed",NOT_COMPLETED:"not completed",NOT_SEEN:"not seen",ACTIVE:"is currently active",NOT_ACTIVE:"is not currently active",SEEN:"seen"};function xt(t){return Nt[t]}function St(t,n){let s=(n||"").toLowerCase();return(t.eventTimeOperator===O.RELATIVE_BETWEEN?t.eventRelativeValue2:t.eventRelativeValue)!==1&&(s+="s"),t.eventTimeOperator!==O.RELATIVE_GT&&(s+=" ago"),s}function Tt(t){return(t.eventFrequencyOperator===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 O.ANY:return"at any point in time";case O.RELATIVE_BETWEEN:return"between";case O.RELATIVE_GT:return"in the last";case O.RELATIVE_LT:return"more than"}}const Lt={1:"Lowest",2:"Low",3:"Medium",4:"High",5:"Highest"};function Pt(t){return`${Lt[t]||String(t)} priority`}function te(t,n){switch(t){case H.DAY:return n===1?"day":"days";case H.HOUR:return n===1?"hour":"hours";case H.MINUTE:return n===1?"minute":"minutes";case H.SECOND:return n===1?"second":"seconds"}}function me(t){switch(t){case"USER":return re;case"GROUP":return ze;case"GROUP_MEMBERSHIP":return je;case"EVENT":return be}}function Rt(t){const n=t.split("/");if(n.length===1)return["USER",t];switch(n[0]){case"group":return["GROUP",n[1]];case"group_membership":return["GROUP_MEMBERSHIP",n[1]];case"event":return["EVENT",n[1]]}return console.warn("parseAttributeDefinitionFqn: Invalid attribute definition FQN",t),["USER",t]}const Ut={[F.BANNER]:"banner",[F.CHECKLIST]:"checklist",[F.FLOW]:"flow",[F.EMBED]:"embed",[F.LAUNCHER]:"launcher",[F.RESOURCE_CENTER]:"resource center"};function At(t,{title:n,plural:s}={}){let r=Ut[t];return n&&(r=ee.upperFirst(r)),s&&(r+="s"),r}const Mt=["yyyy-MM-dd","yyyy/MM/dd","MM-dd yyyy","MM/dd yyyy","MM-dd-yyyy","MM/dd/yyyy","MM-dd","MM/dd","dd MMM yyyy","dd MMMM yyyy","MMM dd yyyy","MMMM dd yyyy","dd MMM","dd MMMM","MMM dd","MMMM dd"],kt=["hh:mmaaa","hh.mmaaa","hh:mm aaa","hh.mm aaa","HH:mm","HH.mm","hhaaa","hh aaa","HH"];for(const t of Mt)for(const n of kt);const Vt="d MMM yyyy";function pe(t){if(t==null)return"";const n=Bt?t.getMinutes()===0?"h aaa":"h:mm aaa":"HH:mm";return ae(t,Vt+", "+n)}function Ht(t){if(!t)return null;const n=dt(t,"yyyy-MM-dd",new Date);return isNaN(n.valueOf())?null:n}function ge(t){if(!t)return null;const n=mt(t);return isNaN(n.valueOf())?null:n}const Bt=Intl.DateTimeFormat(Intl.DateTimeFormat().resolvedOptions().locale,{hour:"numeric"}).resolvedOptions().hourCycle==="h12";var Te=(t=>(t.EVENT="EVENT",t.GROUP="GROUP",t.GROUP_MEMBERSHIP="GROUP_MEMBERSHIP",t.USER="USER",t))(Te||{});function j(){const[t,n]=i.useState(!1),s=i.useRef(null),r=i.useCallback(()=>n(!0),[]),a=i.useCallback(()=>n(!1),[]),o=i.useCallback(()=>n(!0),[]),l=i.useCallback(()=>n(!1),[]);return{ref:s,hovered:t,eventHandlers:{onPointerEnter:r,onPointerLeave:a,onFocus:o,onBlur:l}}}function fe(t){return({condition:n})=>{throw new Error(`conditionOperators.${n.operator}.${t} is not supported`)}}const 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?D:t===!1?I: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]:I,[T.PENDING_SCHEDULE]:I,[T.SCHEDULED]:L,[T.FIRED]:D},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:D}));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:y=>{s(!n),y.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?D:h?L:I})),n&&e.createElement(e.Fragment,null,e.createElement("div",{className:g(_)},e.createElement("span",null,e.createElement("strong",null,a.startLimit)," ",e.createElement("span",{className:"userflow-debugger-info-text"},"(started ",c," times)")),e.createElement(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:D}))))}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?D:I}))},$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?D: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,yt(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===F.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!==O.ANY&&e.createElement(e.Fragment,null," ",e.createElement("strong",null,t.eventRelativeValue),t.eventTimeOperator===O.RELATIVE_BETWEEN&&e.createElement(e.Fragment,null," ",e.createElement("span",{className:"userflow-debugger-info-text"},"and")," ",e.createElement("strong",null,t.eventRelativeValue2))," ",e.createElement("span",{className:"userflow-debugger-info-text"},St(t,t.eventRelativeUnit))),t.eventActor&&t.eventActor!==Ae.CURRENT_USER?e.createElement(e.Fragment,null," ",e.createElement("strong",null,Dt(t.eventActor))):"",t.whereCondition&&s&&e.createElement(z,{hovered:!0,target:n},"Where ",e.createElement("br",null),e.createElement(Fe,{condition:t.whereCondition})))}},[N.ALWAYS_TRUE]:{icon:()=>D,Preview:()=>e.createElement("span",null,"Water is wet")},[N.CHECKLIST_TASK_CLICKED]:{icon:()=>Ee,Preview:()=>e.createElement("span",null,"Task is clicked")}},Fe=t=>e.createElement("div",null,t.condition.conditions.map((n,s)=>e.createElement("div",{key:n.id}," ",s===0?null:e.createElement("span",{className:"userflow-debugger-info-text"},t.condition.operator?.toLowerCase())," ",n.type==="ATTRIBUTE"&&Ie.ATTRIBUTE.Preview({condition:n,isRoot:!0,isHideCond:!1}),n.type==="CLAUSE"&&e.createElement(e.Fragment,null,"(",e.createElement(Fe,{condition:n}),")")))),z=({hovered:t,children:n,target:s})=>{const r=oe();return t?e.createElement(Ce,{className:"userflow-debugger-popover",target:s.current,placement:"top",horizontalAlign:"center",verticalAlign:"center",document:r?.current?.contentDocument||void 0},n):null};class Jt extends e.PureComponent{constructor(n){super(n),this.rootRef=e.createRef(),this.optionsElRef=e.createRef(),this.input=null,this.popoverRef=e.createRef(),this.isMouseDown=!1,this.isCreateOpen=!1,this.setInput=s=>{this.input=s;const{inputRef:r}=this.props;r&&(typeof r=="function"?r(s):r.current=s)},this.onInputChange=s=>{s.stopPropagation();const{value:r}=s.target;r!==""&&this.openPopover();const a=this.memoizedFilterOptions(this.props.options,r);this.setState({inputValue:r,q:r,highlightedIndex:a.length>0?0:-1,createHighlighted:a.length===0}),r===""&&!this.props.noEmpty&&this.triggerOnChange(null),this.props.onSearchChange&&this.props.onSearchChange(r)},this.onPopoverPlacementChange=s=>this.setState({popoverPlacement:s}),this.onMouseDown=s=>{s.preventDefault(),this.isMouseDown=!0;const r=()=>{this.isMouseDown=!1,this.props.document?.removeEventListener("mouseup",r),document.body.removeEventListener("mouseup",r)};this.props.document?.addEventListener("mouseup",r),document.body.addEventListener("mouseup",r)},this.onFocus=s=>{this.input&&!this.props.noSearch&&this.input.select(),this.props.onFocus&&this.props.onFocus(s)},this.onBlur=s=>{this.isMouseDown||this.closePopover(),this.props.onBlur&&!this.isCreateOpen&&this.props.onBlur(s)},this.onClose=()=>{this.state.popoverOpen&&this.closePopover(),this.props.onClose&&this.props.onClose()},this.onTriggerClick=()=>{this.props.readOnly||this.props.disabled||(this.state.popoverOpen?this.closePopover():(this.input&&this.input.focus(),this.openPopover()))},this.onKeyDown=s=>{const{popoverOpen:r,highlightedIndex:a,createHighlighted:o}=this.state,l=this.getFilteredOptions(),c=l.length-1;switch(s.key){case"ArrowUp":s.preventDefault(),r&&(o?this.setState({highlightedIndex:c,createHighlighted:!1}):a>0&&this.setState({highlightedIndex:a-1}));break;case"ArrowDown":s.preventDefault(),r?this.props.onCreate&&(a===c||o)?this.setState({highlightedIndex:-1,createHighlighted:!0}):a<c&&this.setState({highlightedIndex:a+1}):this.props.noOpenOnDown||this.openPopover();break;case"Enter":if(r)if(s.preventDefault(),o&&!this.props.disableCreate)this.fireOnCreate();else{const p=l[a];p||!this.props.noEmpty?this.selectOption(p):!p&&this.props.hideOnEmpty&&this.props.onEnter&&this.props.onEnter()}else this.props.onEnter?this.props.onEnter():this.openPopover();break;case"Tab":r&&!this.props.ignoreTab&&this.selectOption(l[a]);break;case"Escape":r&&(s.preventDefault(),s.stopPropagation(),this.setState({popoverOpen:!1}));break}},this.selectOption=s=>{s===this.props.value?this.setState({popoverOpen:!1,inputValue:this.renderOptionText(s),q:""}):(this.setState({popoverOpen:!1,inputValue:"",q:""}),this.triggerOnChange(s))},this.highlightOption=s=>{this.setState({highlightedIndex:s,createHighlighted:!1})},this.highlightCreate=()=>{this.setState({highlightedIndex:-1,createHighlighted:!0})},this.fireOnCreate=()=>{const{onCreate:s}=this.props;if(s){this.isCreateOpen=!0;const r={q:ee.upperFirst(this.state.q),callback:a=>{this.isCreateOpen=!1,a!=null&&this.selectOption(a),this.input&&this.input.focus()}};s(r),this.closePopover()}},this.openPopover=()=>{if(!this.state.popoverOpen){const s=this.getFilteredOptions();let r=0,a=!1;if(s.length===0)r=-1,a=!0;else{const{value:o}=this.props,l=s.findIndex(c=>c===o);l!==-1&&(r=l)}this.setState({popoverOpen:!0,highlightedIndex:r,createHighlighted:a})}},this.memoizedFilterOptions=pt((s,r)=>(s=s||[],r?s.filter(a=>this.filter(a,r)):s)),this.state={inputValue:this.renderOptionText(n.value==null?null:n.value),q:"",popoverOpen:!1,popoverPlacement:null,highlightedIndex:-1,createHighlighted:!1}}componentDidUpdate(n,s){const{value:r}=this.props;if(r!==n.value){const a=this.renderOptionText(r??null);a!==this.state.inputValue&&this.setState({inputValue:a})}s.highlightedIndex!==this.state.highlightedIndex&&this.scrollHighlightedOptionIntoView()}render(){let n,s=!1;const{props:r}=this,a=this.state,o=a.popoverPlacement==="top"?"above":"below";if(a.popoverOpen&&this.rootRef.current){const c=this.getFilteredOptions();if(this.props.hideOnEmpty&&c.length===0)s=!0;else{let p;if(c.length>0){let _=null;p=c.reduce((E,h,x)=>{const y=this.getOptionGroup(h);y&&y!==_&&E.push(e.createElement("div",{key:"group:"+y,className:"combo-box__group-header"},y)),_=y;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(Ce,{ref:this.popoverRef,className:"combo-box-popover"+(r.popoverNotch?"":` combo-box-popover--${o}`),noNotch:!r.popoverNotch,target:this.rootRef.current,forceDimension:!0,matchWidth:!0,minWidth:r.popoverMinWidth,onMouseDown:this.onMouseDown,onPlacementChange:this.onPopoverPlacementChange,document:r.document},e.createElement("div",{ref:this.optionsElRef,className:g({"combo-box__options":!0,"combo-box__options--with-create":!!r.onCreate})},p),r.onCreate&&e.createElement("div",{key:"create",className:g({"combo-box__option":!0,"combo-box__option--create":!0,"combo-box__option--highlighted":a.createHighlighted}),onClick:this.fireOnCreate,onMouseMove:this.highlightCreate},e.createElement("div",{className:"combo-box__create-icon"},e.createElement(G,{icon:tt})),e.createElement("div",{className:"combo-box__create-text"},"Create"," ",a.q===""?"new"+(r.noun?` ${r.noun}`:""):e.createElement("b",null,ee.upperFirst(a.inputValue)))))}}const l=["input-group","combo-box"];return a.popoverOpen&&!s&&(l.push("combo-box--open"),r.popoverNotch||l.push(`combo-box--with-popover-${o}`)),r.disabled&&l.push("input-group--disabled"),r.noSearch&&l.push("combo-box--no-search"),r.className&&l.push(r.className),e.createElement(e.Fragment,null,e.createElement("div",{className:l.join(" "),style:{width:r.width?r.width+"px":void 0},ref:this.rootRef,onClick:r.readOnly||r.disabled?void 0:()=>{this.input?.focus(),this.openPopover()}},r.childrenBefore,r.value&&r.getOptionIcon&&e.createElement("div",{className:"combobox__input-icon"},Pe(r.value,r.getOptionIcon)),e.createElement("input",{type:"text",className:r.inputClassName,name:r.name,value:a.inputValue,onChange:this.onInputChange,onFocus:this.onFocus,onBlur:this.onBlur,onKeyDown:this.onKeyDown,onMouseDown:this.openPopover,placeholder:r.placeholder,readOnly:r.readOnly||r.noSearch,disabled:r.disabled,autoComplete:"off",ref:this.setInput,...r.inputHtmlAttributes}),!r.noTrigger&&e.createElement("div",{"data-testid":r.triggerTestId||"combo-box-trigger",className:"input-group__append input-group__trigger",onClick:this.onTriggerClick,onMouseDown:this.onMouseDown},e.createElement(G,{icon:nt})),r.onClose&&e.createElement("div",{className:"input-group__append input-group__trigger",onClick:this.onClose},e.createElement(G,{icon:rt})),r.childrenAfter),n)}scrollHighlightedOptionIntoView(){const n=this.optionsElRef.current;if(this.state.popoverOpen&&n){const s=n.querySelector(".combo-box__option--highlighted");if(s){const r=n.getBoundingClientRect(),a=s.getBoundingClientRect();a.top<r.top?n.scrollTop+=a.top-r.top:a.bottom>r.bottom&&(n.scrollTop+=a.bottom-r.bottom)}}}triggerOnChange(n){const{onChange:s}=this.props;s&&s(n)}closePopover(){this.setState({popoverOpen:!1,inputValue:this.renderOptionText(this.props.value==null?null:this.props.value),q:""})}renderOptionText(n){return n==null?"":Le(n,this.props.renderOptionText)}getFilteredOptions(){return this.memoizedFilterOptions(this.props.options,this.state.q)}filter(n,s){return this.props.filter?this.props.filter(n,s):this.renderOptionText(n).toLowerCase().includes(s.toLowerCase())}getOptionKey(n,s){return n&&n.id||s}getOptionGroup(n){return this.props.getOptionGroup?this.props.getOptionGroup(n):n&&n.group||null}}class en extends e.PureComponent{constructor(){super(...arguments),this.state={isOptionDisabled:!1},this.onClick=()=>{this.state.isOptionDisabled||this.props.onClick(this.props.option)},this.onHover=()=>{this.state.isOptionDisabled||this.props.onHover(this.props.idx)}}componentDidMount(){const n=this.props.option!==void 0&&typeof this.props.option=="object"&&this.props.option!==null&&"disabled"in this.props.option&&this.props.option.disabled===!0;this.setState({isOptionDisabled:n})}componentDidUpdate(){const n=this.props.option!==void 0&&typeof this.props.option=="object"&&this.props.option!==null&&"disabled"in this.props.option&&this.props.option.disabled===!0;this.setState({isOptionDisabled:n})}render(){const{isOptionDisabled:n}=this.state,{props:s}=this;return e.createElement("div",{className:g({[s.className]:!0,"combo-box__option--disabled":n}),onClick:this.onClick,onMouseMove:this.onHover},tn(s.option,s.renderOptionText,s.renderOptionItem,s.getOptionIcon))}}function Le(t,n){return n?n(t):typeof t=="string"||typeof t=="number"?t:t?t.name:"?"}function tn(t,n,s,r){if(s)return s(t);{let a=Le(t,n);return r?e.createElement("div",{className:"d-flex align-flex-start"},e.createElement("div",{className:"combobox__option-icon"},Pe(t,r)),e.createElement("div",{className:"flex-1"},a)):a}}function Pe(t,n){const s=n(t);return nn(s)?e.createElement(G,{icon:s}):s}function nn(t){return gt(t)&&"iconName"in t}const rn=({selectedFlow:t,setSelectedFlow:n,flows:s,debugAutoStartCondition:r})=>{const a=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:I}),e.createElement("span",null,"The flow will not auto start ",e.createElement("br",null)," ",e.createElement("b",null,"User locale (",o?.locale?.code,") is not enabled.")))),r?e.createElement("div",{className:g({"d-flex align-center fade-in":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__flow__status":!0})},e.createElement("span",{className:"d-flex align-center gap-8"},e.createElement(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,C=f?.debuggerApp?.y||50;return{x:v??(document.body.clientWidth?Number(document.body.clientWidth)-450:50),y:C}}),[c,p]=i.useState(!1),_=i.useRef(null),{meta:E}=V(),{debuggerRoute:h}=le(),[x,y]=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=C=>{const R=C.clientX-w.current.mouseX,Y=C.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(C=>{const R=document.body.clientWidth-500,Y=document.body.clientHeight-100,X=Math.max(Math.min(C.x,R),0),K=Math.max(Math.min(C.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:y},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()=>{y().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,C]of n.entries())w.push({conditionId:v,isTrue:C.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&&(y().then(v=>{if(!v)return;o(v);const C=v?.find(R=>R.latestVersion.id===f.latestVersion?.id);C&&h(C)}),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:C=>{v.isTrue!==C&&(v.isTrue=C,E(u))}}))}},y=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(ye.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
|
package/ElementSelectionApp.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as y,R as o}from"./vendor.react.js";import{i as _}from"./vendor.is-hotkey.js";import{o as de}from"./vendor.obj-str.js";import{r as W,e as ne,h as oe,o as fe,j as $,k as ae,l as pe,m as ge,p as re,a as we,q as C}from"./roots.js";import{m as U}from"./userflow.js";import{u as he}from"./client-context.js";import{u as
|
|
1
|
+
import{r as y,R as o}from"./vendor.react.js";import{i as _}from"./vendor.is-hotkey.js";import{o as de}from"./vendor.obj-str.js";import{r as W,e as ne,h as oe,o as fe,j as $,k as ae,l as pe,m as ge,p as re,a as we,q as C}from"./roots.js";import{m as U}from"./userflow.js";import{u as he}from"./client-context.js";import{u as be}from"./use-window-resize.js";import{B as ve}from"./BuilderBar.js";import"./vendor.core-js.js";import"./vendor.object-assign.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./Frame.js";import"./vendor.react-dom.js";import"./vendor.scheduler.js";import"./stylesheets.js";import"./vendor.fortawesome.pro-regular-svg-icons.js";import"./vendor.fortawesome.pro-solid-svg-icons.js";import"./flow-condition-types.js";import"./vendor.date-fns.js";import"./vendor.babel.runtime.js";import"./iframe-reset.styl.js";import"./i18n.js";import"./vendor.i18next.js";import"./vendor.react-i18next.js";import"./logomark.js";import"./vendor.fortawesome.pro-light-svg-icons.js";(function(){try{var p=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},n=new Error().stack;n&&(p._sentryDebugIds=p._sentryDebugIds||{},p._sentryDebugIds[n]="b17eb105-9d85-41fc-bdfe-f3ab24133fd4",p._sentryDebugIdIdentifier="sentry-dbid-b17eb105-9d85-41fc-bdfe-f3ab24133fd4")}catch{}})();const ye=_("alt+s"),Ee=_("escape"),Re=_("u"),Ge=({state:p})=>{const{mode:n,elementType:m}=p,g=he(),S=y.useRef(null),[A,ie]=y.useState(!1),B=y.useRef(null),[V,le]=y.useState(null),[I,ce]=y.useState(()=>se()),M=y.useCallback(async(s,c)=>{if(s&&c){const l=S.current?.getFrame();l&&B.current&&(B.current.classList.add("userflowjs-element-selection-box--no-transition"),l.style.display="none",l.offsetWidth),re(),g.setSessionStorageState(d=>({...d,elementSelection:{...d.elementSelection,mode:"done"}}));const w=W(s),h=0,r=0,R=Math.round(ne()),T=Math.round(oe()),a=await g.getTargetEnv().captureScreenshot(h,r,R,T),E=d=>Math.round(d/$(1));c={...c,screenshotDataUrl:a,targetX1:E(w.left),targetY1:E(w.top-r),targetX2:E(w.right),targetY2:E(w.bottom-r),screenshotWidth:R,screenshotHeight:T}}g.setSessionStorageState(l=>({...l,activeApp:null,elementSelection:null})),g.getTargetEnv().postBuilderMessage({kind:"userflow:selectElementResult",selectorData:c})},[g]),L=y.useCallback(s=>g.setSessionStorageState(c=>({...c,elementSelection:{...c.elementSelection,mode:s}})),[g]);return y.useEffect(()=>{if(!A||!S.current)return;const s=S.current.getFrame(),c=S.current.getRootEl();let l=c&&c.ownerDocument&&c.ownerDocument.defaultView;l===window&&(l=null);let w=null,h=null,r=null,R=null;const T=document.getElementById("userflow-ui"),a={capture:!0},E=()=>{window.cancelAnimationFrame(d);let e=null,t=null,b=null;if(h&&!T.contains(h)){let f=null,u=h;for(;u;){{const x=u.getBoundingClientRect();if(x.width===0&&x.height===0){u=O(u);continue}}if(f=we(u,{elementType:m}),f)break;u=O(u)}f?(t=f.el,e=f.selector):m===U.INPUT?b="No text input found here":b="Sorry, we can't select that element (yet!)"}r=t,w=e,le(b),q()};let d;const Y=()=>{window.cancelAnimationFrame(d),d=window.requestAnimationFrame(E)},q=()=>{window.cancelAnimationFrame(N);const e=B.current;if(!e)return;re();const t=$(ne()),b=$(oe());let f=b/2,u=t/2,x=b/2,H=t/2;const v=2;let J=v,Q=v,ee=v,te=v;if(r){const i=W(r),F=window.getComputedStyle(r);f=Math.max(0,i.top),u=Math.max(0,t-i.right),x=Math.max(0,b-i.bottom),H=Math.max(0,i.left),J=Math.max(v,C(F.borderTopLeftRadius)),Q=Math.max(v,C(F.borderTopRightRadius)),ee=Math.max(v,C(F.borderBottomLeftRadius)),te=Math.max(v,C(F.borderBottomRightRadius)),R=r}else if(R){const i=W(R);f=Math.max(0,i.top+i.height/2),u=Math.max(0,t-i.right+i.width/2),x=Math.max(0,b-i.bottom+i.height/2),H=Math.max(0,i.left+i.width/2)}e.style.top=`${f}px`,e.style.right=`${u}px`,e.style.bottom=`${x}px`,e.style.left=`${H}px`,e.style.borderTopLeftRadius=`${J}px`,e.style.borderTopRightRadius=`${Q}px`,e.style.borderBottomLeftRadius=`${ee}px`,e.style.borderBottomRightRadius=`${te}px`,r?document.body.classList.remove("userflowjs-body-with-element-selection--none"):document.body.classList.add("userflowjs-body-with-element-selection--none")};let N;const ue=()=>{window.cancelAnimationFrame(N),N=window.requestAnimationFrame(q)},z=()=>{ue()},k=e=>{if(ye(e)){e.preventDefault(),n==="select"?L("navigate"):n==="navigate"&&L("select");return}if(Ee(e)&&n==="select"){e.preventDefault(),M(null,null);return}if(Re(e)&&r){const t=O(r);if(t){e.preventDefault(),h=t,E();return}}},j=e=>{const t=e.composedPath()[0];!t||t===r||t.tagName==="BODY"||t.tagName==="HTML"||(h=t,Y())},D=()=>{h=null,Y()};s&&s.addEventListener("mouseenter",D);const P=e=>{e.preventDefault(),e.stopPropagation()},X=e=>{P(e)},Z=e=>{P(e)},G=e=>{if(P(e),I){const t=e.target;if(!r||!r.contains(t)){j(e);return}}w&&(M(r,w),K())};l&&l.addEventListener("keydown",k),n==="select"&&(document.body.addEventListener("mouseleave",D),document.body.classList.add("userflowjs-body-with-element-selection"));const me=fe(e=>{const t=e.ownerDocument.defaultView;t&&(t.addEventListener("keydown",k,a),n==="select"&&(t.addEventListener("scroll",z,a),e.addEventListener("mousemove",j,a),e.addEventListener("mousedown",X,a),e.addEventListener("focus",Z,a),e.addEventListener("click",G,a)))},e=>{const t=e.ownerDocument.defaultView;t&&(t.removeEventListener("keydown",k,a),n==="select"&&(t.removeEventListener("scroll",z,a),ae(e)||e.removeEventListener("mousemove",j,a),e.removeEventListener("mousedown",X,a),e.removeEventListener("focus",Z,a),e.removeEventListener("click",G,a)))}),K=()=>{window.cancelAnimationFrame(d),window.cancelAnimationFrame(N),document.body.removeEventListener("mouseleave",D),l&&l.removeEventListener("keydown",k),s&&s.removeEventListener("mouseenter",D),document.body.classList.remove("userflowjs-body-with-element-selection"),document.body.classList.remove("userflowjs-body-with-element-selection--none"),me()};return K},[I,g,n,A,m,M,L]),be(()=>ce(se())),o.createElement(o.Fragment,null,o.createElement(ve,{ref:S,onReadyChange:ie,buttons:o.createElement(o.Fragment,null,n==="navigate"?o.createElement("button",{key:"select",className:"btn btn--default",onMouseDown:s=>{s.preventDefault(),s.stopPropagation(),L("select")}},o.createElement("span",{className:"hidden-lg-up"},"Select here"),o.createElement("span",{className:"hidden-md-down"},"Select element here (Alt + S)")):n==="select"?o.createElement("button",{key:"navigate",className:"btn btn--default",onMouseDown:s=>{s.preventDefault(),s.stopPropagation(),L("navigate")}},o.createElement("span",{className:"hidden-lg-up"},"Navigate"),o.createElement("span",{className:"hidden-md-down"},"Navigate to another page (Alt + S)")):null,(n==="select"||n==="navigate")&&o.createElement("button",{className:"btn btn--secondary-on-dark",onClick:()=>M(null,null)},"Cancel"))},n==="navigate"?o.createElement("div",{className:"status"},"Navigate to the page the element appears on"):V?o.createElement("div",{className:"error"},V):o.createElement("div",{className:"status"},I?o.createElement(o.Fragment,null,"Tap"," ",m===U.INPUT?"a text input":"an element"," ","to focus. Tap again to select."):o.createElement(o.Fragment,null,"Click"," ",m===U.INPUT?"a text input":"an element"," ","to select it"))),A&&(n==="select"||n==="done")&&o.createElement("div",{className:de({"userflowjs-element-selection-box":!0}),ref:B}))};function O(p){const n=p.parentNode;if(!n)return null;if(ae(n))return n.host;if(!pe(n))return null;if(n.tagName==="BODY"){const m=ge(n);return m||null}return n}function se(){return window.navigator.userAgent.includes("Mobile")}export{Ge as ElementSelectionApp,Ge as default};
|
|
2
2
|
//# sourceMappingURL=ElementSelectionApp.js.map
|
package/EmbedApp.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as o,R as l}from"./vendor.react.js";import{y as m,E as K}from"./userflow.js";import{
|
|
1
|
+
import{r as o,R as l}from"./vendor.react.js";import{y as m,E as K}from"./userflow.js";import{i as k}from"./i18n.js";import{u as P}from"./client-context.js";import{o as M}from"./vendor.obj-str.js";import{a as U,u as Y,g as q,D as Z}from"./stylesheets.js";import{E as G}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{S as J}from"./TreeDoc.js";import{w as Q,f as V}from"./flow-host.styl.js";import{u as X,b as ee}from"./use-selector-element-monitoring.js";import{r as te}from"./vendor.react-dom.js";import{F as re}from"./Frame.js";import{d}from"./roots.js";import{u as ne}from"./use-element-rect.js";import{C as oe}from"./ChecklistUI.js";import"./vendor.core-js.js";import"./vendor.object-assign.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.i18next.js";import"./vendor.babel.runtime.js";import"./vendor.react-i18next.js";import"./vendor.fortawesome.pro-solid-svg-icons.js";import"./flow-condition-types.js";import"./vendor.date-fns.js";import"./vendor.scheduler.js";import"./iframe-reset.styl.js";import"./use-window-resize.js";(function(){try{var r=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},a=new Error().stack;a&&(r._sentryDebugIds=r._sentryDebugIds||{},r._sentryDebugIds[a]="9700969b-674a-4024-81c7-317db1ae608e",r._sentryDebugIdIdentifier="sentry-dbid-9700969b-674a-4024-81c7-317db1ae608e")}catch{}})();const De=({session:r,checklistSession:a})=>{const p=P(),{version:u}=r,t=u.embed,y=U(u.theme),L=r.locale?r.locale.standardLocaleId:r.version.theme.languageId,b=r.version.embed?.blocks||[],S=b.length===1&&b[0]?.type==="CHECKLIST";o.useEffect(()=>{k.changeLanguage(L)},[L]);const e=o.useRef(null);o.useLayoutEffect(()=>{e.current=document.createElement("div")},[]);const[N,v]=o.useState(!1),{loaded:D}=Y(window,V,y),[F,I]=o.useState(!1),g=D&&F,[A,_]=o.useState(0),j=o.useCallback(()=>{I(!1),_(n=>n+1)},[]),E=![m.BODY_FIRST,m.BODY_LAST].includes(t.embedMode),[f,x]=o.useState(null),B=o.useCallback(({targetEl:n})=>{x(n)},[]),O=o.useCallback(()=>{E&&console.warn(`Userflow.js: Could not find embed element for banner "${r.flow.name||r.flow.id}"`),x(null)},[E,r.flow.name,r.flow.id]);X({selector:t.embedSelector,targetMoved:B,targetLost:O});const[T,$]=o.useState(!1),c=o.useCallback(()=>{const n=e.current;n&&n.parentElement&&(n.parentElement.removeChild(n),v(!1))},[e]),W=o.useCallback(()=>{r.kind==="embed"&&($(!0),p.endFlow(r,{endReason:K.USER_CLOSED}),c())},[c,r,p]);o.useLayoutEffect(()=>{try{if(S&&!a){c();return}if(!e.current?.parentElement){if(E&&!f){c();return}switch(t.embedMode){case m.BODY_FIRST:document.body.insertAdjacentElement("afterbegin",e.current);break;case m.BODY_LAST:document.body.insertAdjacentElement("beforeend",e.current);break;case m.ELEMENT_FIRST:f.insertAdjacentElement("afterbegin",e.current);break;case m.ELEMENT_LAST:f.insertAdjacentElement("beforeend",e.current);break;case m.ELEMENT_BEFORE:f.insertAdjacentElement("beforebegin",e.current);break;case m.ELEMENT_AFTER:f.insertAdjacentElement("afterend",e.current);break;default:document.body.insertAdjacentElement("afterbegin",e.current)}v(!0),j()}}catch(n){console.error("Error during element insertion:",n)}},[c,e,E,f,u.embed?.overlay,u.embed?.sticky,t.embedMode,j,a]);const h=n=>M({"userflowjs-embed":!0,[`userflowjs-embed--embed-mode-${t.embedMode}`]:!0,[`userflowjs-embed--animate-${String(t.animate)}`]:n&&t.animate});o.useLayoutEffect(()=>{e.current&&(e.current.className=h(!1))},[e,t.embedMode,t.animate]);const w=t.zIndex||Q(0);o.useLayoutEffect(()=>{e.current&&(e.current.style.zIndex=w==null?"":String(w),e.current.style.position=g?"":"absolute",e.current.style.visibility=g?"":"hidden")},[e,w,g]);const{height:i,setEl:H}=ne();o.useLayoutEffect(()=>{e.current&&e.current.style.setProperty("--userflowjs-embed-height",i&&d(i+(t.marginTop||0)+(t.marginBottom||0))||"0px")},[e,i,t.marginTop,t.marginBottom]);const z=()=>{if(!r.version.embed?.blocks?.length)return null;const n=(s,C)=>l.createElement("div",{className:"userflowjs-embed-wrapper",key:C},l.createElement("div",{className:"userflowjs-bubble-toolbar"},r.draftMode&&l.createElement("div",{className:"userflowjs-bubble-draft"},"Preview"),!u.closeDisabled&&l.createElement("button",{"data-testid":"userflow-embed-dismiss",className:"userflowjs-bubble-toolbar-button",onClick:W,"aria-label":"Close embed"},l.createElement(Z,{icon:G}))),s);return b.map(s=>{switch(s.type){case"CHECKLIST":return a?n(l.createElement("div",{style:{...q(y),paddingTop:u.closeDisabled?"0px":"32px"},className:"userflowjs-embedded-checklist"},l.createElement(oe,{session:a})),s.id):null;default:return console.warn(`Unknown embed block type: ${s.type}`),null}})};return o.useLayoutEffect(()=>{const n=`userflow-${r.id}`;return e.current.id=n,()=>{T||document.getElementById(n)===e.current&&c()}},[e,r.id,c,T]),o.useLayoutEffect(()=>{const n=r.version.embed?.blocks?.length&&r.version.embed.blocks.some(s=>s.type==="CHECKLIST"?a:!1);i&&i>0&&n?(e.current.style.height=`${i}px`,e.current.className=h(t.animate)):(e.current.style.height="0px",e.current.className=h(!1))},[e,i,a,t.animate]),o.useEffect(()=>{if(!e.current)return;const n=new ResizeObserver(C=>{for(const R of C)R.contentRect&&!t.embedMode&&(e.current.style.height=`${R.contentRect.height}px`)}),s=e.current.querySelector("iframe");return s&&n.observe(s),()=>{n.disconnect()}},[e,t.embedMode]),!N||!b.length||S&&!a?null:te.createPortal(l.createElement(J.Provider,{value:r},l.createElement(re,{key:A,className:"userflowjs-embed-frame",style:{maxWidth:t.maxWidth?d(t.maxWidth):"100%",width:"100%",height:r.version.embed?.blocks?.length?"100%":"auto",minHeight:0,marginTop:d(t.marginTop),marginRight:d(t.marginRight),marginBottom:d(t.marginBottom),marginLeft:d(t.marginLeft),borderRadius:d(t.borderRadius)},stylesheet:ee,theme:y,onStylesheetsLoad:I,title:"Embedded Content"},l.createElement("div",{ref:H,className:M({"userflowjs-embed-root":!0,[`userflowjs-embed-root--content-layout-${t.contentLayout}`]:!0,"userflowjs-theme-root":!0,"userflowjs-embed-root-blocks":b.length>0}),dir:k.dir(),style:{width:"100%",maxWidth:t.maxContentWidth?d(t.maxContentWidth):"100%",margin:"0 auto"}},z()))),e.current)};export{De as EmbedApp,De as default};
|
|
2
2
|
//# sourceMappingURL=EmbedApp.js.map
|