userflow.js-self-hosted 0.1.1011453 → 0.1.1011530
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 +4 -0
- package/ElementSelectionApp.js +1 -1
- package/EmbedApp.js +1 -1
- package/FlowApp.js +2 -2
- package/FlowChrome.js +2 -2
- package/Frame.js +2 -0
- package/LauncherApp.js +1 -1
- package/NotificationsApp.js +1 -1
- package/ResourceCenterApp.js +3 -3
- package/ResourceCenterAssistantChat.js +2 -2
- package/StartConditionTestingApp.js +1 -1
- package/TrackerTestingApp.js +1 -1
- package/Trigger.js +1 -1
- package/client-context.js +1 -1
- package/debugger.css +930 -0
- package/flow-condition-types.js +1 -1
- package/flow-host.styl.js +1 -1
- package/hash.txt +1 -1
- package/implicit-tracking.js +2 -2
- package/index.js +1 -1
- package/package.json +1 -1
- package/roots.js +1 -1
- package/stylesheets.js +1 -1
- package/ui.js +2 -2
- package/use-element-rect.js +1 -1
- package/use-selector-element-monitoring.js +3 -3
- package/use-window-resize.js +1 -1
- package/userflow.js +5 -5
- package/vendor.absinthe.socket.js +2 -0
- package/vendor.apollo.client.js +32 -0
- package/vendor.babel-runtime.js +2 -0
- package/vendor.core-js.js +1 -1
- package/vendor.date-fns.js +2 -1
- package/vendor.fast-json-stable-stringify.js +2 -0
- package/vendor.flow-static-land.js +2 -0
- package/vendor.fortawesome.fontawesome-svg-core.js +762 -0
- package/vendor.fortawesome.pro-regular-svg-icons.js +1 -1
- package/vendor.fortawesome.pro-solid-svg-icons.js +1 -1
- package/vendor.fortawesome.react-fontawesome.js +3 -0
- package/vendor.graphql.js +32 -0
- package/vendor.history.js +2 -0
- package/vendor.html-parse-stringify2.js +1 -1
- package/vendor.is-hotkey.js +1 -1
- package/vendor.isomorphic-fetch.js +2 -0
- package/vendor.jumpn.utils-array.js +2 -0
- package/vendor.jumpn.utils-composite.js +2 -0
- package/vendor.jumpn.utils-graphql.js +4 -0
- package/vendor.lodash.js +4 -4
- package/vendor.memoize-one.js +2 -0
- package/vendor.mini-create-react-context.js +2 -0
- package/vendor.numeral.js +8 -0
- package/vendor.object-assign.js +2 -2
- package/vendor.optimism.js +2 -0
- package/vendor.path-to-regexp.js +2 -0
- package/vendor.prop-types.js +2 -0
- package/vendor.react-day-picker.js +2 -0
- package/vendor.react-dom.js +1 -1
- package/vendor.react-i18next.js +1 -1
- package/vendor.react-is.js +2 -0
- package/vendor.react-router.js +2 -0
- package/vendor.react.js +2 -2
- package/vendor.resolve-pathname.js +2 -0
- package/vendor.scheduler.js +2 -2
- package/vendor.tiny-invariant.js +2 -0
- package/vendor.tiny-warning.js +2 -0
- package/vendor.ts-invariant.js +15 -0
- package/vendor.value-equal.js +2 -0
- package/vendor.void-elements.js +1 -1
- package/vendor.whatwg-fetch.js +3 -0
- package/vendor.wry.context.js +2 -0
- package/vendor.wry.equality.js +2 -0
- package/vendor.wry.trie.js +2 -0
- package/vendor.zen-observable.js +2 -0
package/BannerApp.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r,R as
|
|
1
|
+
import{r as o,R as n}from"./vendor.react.js";import{t as s,E as A}from"./userflow.js";import{u as D,i as v}from"./client-context.js";import{o as R}from"./vendor.obj-str.js";import{u as x,a as C,D as O}from"./stylesheets.js";import{n as $}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{u as P,S as W,b as Y,R as z,B as U}from"./use-selector-element-monitoring.js";import{g as H}from"./flow-condition-types.js";import{f as K,w as Z}from"./flow-host.styl.js";import{r as q}from"./vendor.react-dom.js";import{F as G}from"./Frame.js";import{h as i}from"./roots.js";import{u as J}from"./use-element-rect.js";import"./vendor.absinthe.socket.js";import"./vendor.object-assign.js";import"./vendor.core-js.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.jumpn.utils-composite.js";import"./vendor.babel-runtime.js";import"./vendor.jumpn.utils-array.js";import"./vendor.flow-static-land.js";import"./vendor.jumpn.utils-graphql.js";import"./vendor.zen-observable.js";import"./vendor.i18next.js";import"./vendor.react-i18next.js";import"./vendor.babel.runtime.js";import"./vendor.fortawesome.pro-solid-svg-icons.js";import"./vendor.date-fns.js";import"./vendor.scheduler.js";import"./use-window-resize.js";(function(){try{var 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]="26d878b6-e4cc-4274-af7d-3787980494a4",r._sentryDebugIdIdentifier="sentry-dbid-26d878b6-e4cc-4274-af7d-3787980494a4")}catch{}})();const Me=({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;o.useEffect(()=>{v.changeLanguage(g)},[g]);const t=o.useMemo(()=>document.createElement("div"),[]),[k,w]=o.useState(!1),{loaded:T}=C(window,K,y),[I,h]=o.useState(!1),E=T&&I,[M,B]=o.useState(0),u=o.useCallback(()=>{h(!1),B(a=>a+1)},[]),f=![s.BODY_FIRST,s.BODY_LAST].includes(e.embedMode),[l,S]=o.useState(null),F=o.useCallback(({targetEl:a})=>{S(a)},[]),N=o.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]);P({selector:e.embedSelector,targetMoved:F,targetLost:N});const b=o.useCallback(()=>{t.parentElement?.removeChild(t),w(!1),u()},[t,u]);o.useLayoutEffect(()=>{let a=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"&&(a=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&&a!=null&&(m.style.position=a)}},[b,t,f,l,e.overlay,e.sticky,e.embedMode,u]),o.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});o.useLayoutEffect(()=>{t.className=L||""},[t,L]);const p=e.zIndex||Z(0);o.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 o.useLayoutEffect(()=>{t.style.setProperty("--userflowjs-banner-height",i(j+(e.marginTop||0)+(e.marginBottom||0))||"")},[t,j,e.marginTop,e.marginBottom]),k?q.createPortal(n.createElement(W.Provider,{value: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:Y,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(z,{doc:e.content,lookupAttribute:H(r.data)})),e.buttons.length>0&&n.createElement("div",{className:"userflowjs-banner-buttons"},e.buttons.map(a=>n.createElement(U,{key:a.id,button:a})))),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{Me as BannerApp,Me 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{
|
|
1
|
+
import{R as e,r as t}from"./vendor.react.js";import{F as I}from"./Frame.js";import{S as v}from"./logomark.js";import{o as F}from"./vendor.obj-str.js";import{f as L,a as k}from"./vendor.fortawesome.pro-light-svg-icons.js";import{x as b}from"./userflow.js";import{a as B,D}from"./stylesheets.js";import{u as N}from"./use-window-resize.js";import"./vendor.absinthe.socket.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]="cc9b5d8f-e212-40cd-83ca-195abedc7641",r._sentryDebugIdIdentifier="sentry-dbid-cc9b5d8f-e212-40cd-83ca-195abedc7641")}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:m},y)=>{const{loaded:h}=B(window,_),[E,S]=t.useState(!1),o=h&&E,u=t.useRef(!1);t.useEffect(()=>{o&&!u.current&&r&&(u.current=!0,r(!0))},[o,r]);const i=t.useRef(null),[s,g]=t.useState(null),[l,w]=t.useState(()=>b.getItem(p)==="top"?"top":"bottom"),R=t.useCallback(a=>{w(a),b.setItem(p,a)},[]),d=t.useRef(0),f=t.useCallback(()=>{const a=i.current;if(!a||!s||!o)return;const c=s.clientHeight;c!==d.current&&(d.current=c,a.style.setProperty("height",c+"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"},m,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{
|
|
1
|
+
import{r as s,R as c}from"./vendor.react.js";import{D as b,z as R,n as F,k as B}from"./userflow.js";import{F as _,B as D}from"./FlowChrome.js";import{i as N,u as C}from"./client-context.js";import{f as P,w as j,C as U,S as A}from"./flow-host.styl.js";import{a as H,D as z,u as I}from"./stylesheets.js";import{F as O}from"./Frame.js";import{o as Z}from"./vendor.obj-str.js";import{z as W}from"./roots.js";import{x as X}from"./vendor.fortawesome.pro-regular-svg-icons.js";import"./vendor.absinthe.socket.js";import{u as M}from"./vendor.react-i18next.js";import{C as Y}from"./ChecklistUI.js";import"./vendor.object-assign.js";import"./vendor.core-js.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.jumpn.utils-composite.js";import"./vendor.babel-runtime.js";import"./vendor.jumpn.utils-array.js";import"./vendor.flow-static-land.js";import"./vendor.jumpn.utils-graphql.js";import"./vendor.zen-observable.js";import"./use-selector-element-monitoring.js";import"./flow-condition-types.js";import"./vendor.date-fns.js";import"./vendor.fortawesome.pro-solid-svg-icons.js";import"./use-window-resize.js";import"./logomark.js";import"./vendor.i18next.js";import"./vendor.react-dom.js";import"./vendor.scheduler.js";import"./vendor.babel.runtime.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]="bf5dc491-4728-482b-b86a-137ea7ab134a",t._sentryDebugIdIdentifier="sentry-dbid-bf5dc491-4728-482b-b86a-137ea7ab134a")}catch{}})();const G=new URL("checklist-launcher-frame.css",import.meta.url).href,K=({position:t,theme:e,onClick:a,onVisibleChange:r,buttonRef:l,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),p=i&&h;s.useEffect(()=>{r&&r(p)},[r,p]);const w=s.useRef(null),L=s.useRef(0),[x,S]=s.useState(null);s.useLayoutEffect(()=>{const E=w.current;if(!E||!x)return;const y=x.clientWidth;y!==L.current&&(L.current=y,E.style.setProperty("width",W(y)+"px","important"),E.style.setProperty("height",e.checklistLauncherHeight+"px","important"))});const f=e.checklistLauncherPlacement,v=f===b.TOP_LEFT||f===b.TOP_RIGHT,g=f===b.TOP_LEFT||f===b.BOTTOM_LEFT,T={zIndex:d==="fixed"?e.checklistZIndex!=null?e.checklistZIndex:j(U):1,top:v?e.checklistLauncherY+"px":void 0,bottom:v?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:p?void 0:"absolute",visibility:p?void 0:"hidden",animation:p?void 0:"none"};return c.createElement(O,{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:l,className:"userflowjs-checklist-launcher-frame-root",onClick:a},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(z,{icon:X}):o,c.createElement("div",{className:"userflowjs-a11y-only"},"uncompleted tasks")))))},Fe=({session:t,checklistExpanded:e})=>{const{version:a}=t,r=a.checklist,l=t.locale?t.locale.standardLocaleId:t.version.theme.languageId;s.useEffect(()=>{N.changeLanguage(l)},[l]);const[u,o]=s.useState(!1);return e?c.createElement(V,{session:t,initialAutoFocus:u,setInitialAutoFocus:o}):r.launcherEnabled?c.createElement($,{session:t,initialAutoFocus:u,setInitialAutoFocus:o}):null},V=({session:t,initialAutoFocus:e,setInitialAutoFocus:a})=>{const r=C(),[l,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=l?.ownerDocument.defaultView;if(!i)return;const h=k=>{k.key==="Escape"&&(a(!0),r.hideChecklist())};return i.addEventListener("keydown",h),()=>i.removeEventListener("keydown",h)},[l,a,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(D,{draftMode:t.draftMode,minimize:i=>{a(i.detail===0),r.hideChecklist()}}))))},$=({session:t,initialAutoFocus:e,setInitialAutoFocus:a})=>{const r=C(),[l,u]=s.useState(!1),[o,d]=s.useState(null),{version:n}=t,m=n.checklist,i=I(n.theme);return s.useEffect(()=>{!l||!o||!e||o.focus()},[r,o,l,e]),c.createElement(K,{position:"fixed",theme:i,onClick:h=>{a(h.detail===0),r.showChecklist()},onVisibleChange:u,buttonRef:d,text:m.launcherText,uncompletedCount:B(t)})};export{Fe as ChecklistApp,Fe 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,
|
|
1
|
+
import{R as e,r as l}from"./vendor.react.js";import{E as I,x as _}from"./userflow.js";import{u as v}from"./client-context.js";import"./vendor.absinthe.socket.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,a as x,f as B,R as $}from"./use-selector-element-monitoring.js";import{g}from"./flow-condition-types.js";import{O as H,R 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]="46edb9c8-d91b-4dc2-a3ac-d87e36e44c97",t._sentryDebugIdIdentifier="sentry-dbid-46edb9c8-d91b-4dc2-a3ac-d87e36e44c97")}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}=O(),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,R=!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),R=N.some(r=>{const E=o.taskCompletions.some(({taskCvid:U})=>U===r.cvid);return r.blocksNextSection&&!E})}const j=p==null?-1:h.indexOf(p),y=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:()=>y(-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:()=>y(1),disabled:j>=h.length-1||R},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}=O(),{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 O(){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
ADDED
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["flow-condition-types.js","userflow.js","vendor.core-js.js","vendor.absinthe.socket.js","vendor.jumpn.utils-composite.js","vendor.babel-runtime.js","vendor.jumpn.utils-array.js","vendor.flow-static-land.js","vendor.jumpn.utils-graphql.js","vendor.zen-observable.js","vendor.phoenix.js","vendor.uuid.js","vendor.date-fns.js","roots.js"])))=>i.map(i=>d[i]);
|
|
2
|
+
import{R as e,r as i}from"./vendor.react.js";import{r as je}from"./vendor.react-dom.js";import{u as te,U as Kt}from"./client-context.js";import{d as tt,W as q,a as oe,b as M,S as jt,c as Ee,e as Xt,f as ut,g as Zt,_ as Qt,h as Jt}from"./userflow.js";import{F as en}from"./Frame.js";import{S as tn}from"./logomark.js";import{f as nn,a as nt,b as rn,c as yt,d as an,e as sn,g as rt,h as on,i as ln,j as cn,k as un,l as Q,m as fe,n as dn,o as mn,p as Ct,q as K,r as pn,s as Nt,t as at,u as fn,v as gn,w as J,x as Y,y as hn,z as En,A as vn,B as bn,C as wn,D as _n,E as yn,F as Cn,G as xt,H as Nn,I as xn,J as Sn,K as Tn,L as Be,M as Dn}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{f as Fn,a as In}from"./vendor.fortawesome.pro-solid-svg-icons.js";import{D as v}from"./stylesheets.js";import{o as b}from"./vendor.obj-str.js";import{F as L,a as z,B as le,E as ie,b as We,A as he,c as qe,d as dt,e as $e,f as B,g as _,h as we,i as de,j as ve}from"./index.js";import{F as ee}from"./vendor.fortawesome.react-fontawesome.js";import"./vendor.absinthe.socket.js";import{m as St}from"./vendor.memoize-one.js";import{n as mt}from"./vendor.numeral.js";import{B as kn}from"./vendor.bignumber.js.js";import{D as On}from"./vendor.react-day-picker.js";import{f as Ce,p as Tt,a as Ln,i as Mn}from"./vendor.date-fns.js";import{_ as Ae,l as Dt}from"./vendor.lodash.js";import{c as An}from"./roots.js";import"./vendor.isomorphic-fetch.js";import{u as Ft}from"./vendor.apollo.client.js";import"./vendor.object-assign.js";import"./vendor.scheduler.js";import"./vendor.i18next.js";import"./vendor.react-i18next.js";import"./vendor.babel.runtime.js";import"./vendor.core-js.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.jumpn.utils-composite.js";import"./vendor.babel-runtime.js";import"./vendor.jumpn.utils-array.js";import"./vendor.flow-static-land.js";import"./vendor.jumpn.utils-graphql.js";import"./vendor.zen-observable.js";import"./flow-condition-types.js";import"./vendor.fortawesome.fontawesome-svg-core.js";import"./vendor.whatwg-fetch.js";import"./vendor.ts-invariant.js";import"./vendor.wry.equality.js";import"./vendor.graphql.js";import"./vendor.optimism.js";import"./vendor.wry.trie.js";import"./vendor.wry.context.js";import"./vendor.fast-json-stable-stringify.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]="2814d8d1-a0d1-4059-bd85-513168e0c4cc",t._sentryDebugIdIdentifier="sentry-dbid-2814d8d1-a0d1-4059-bd85-513168e0c4cc")}catch{}})();const Rn=new URL("debugger.css",import.meta.url).href;let pt=!1;const _e=[];function ft(t){_e.push(t),pt||(pt=!0,window.addEventListener("keydown",n=>{if(n.key==="Escape"){const r=_e[_e.length-1];r&&(r(),n.stopImmediatePropagation())}}))}function gt(t){const n=_e.indexOf(t);n>=0&&_e.splice(n,1)}const V=[];let st=0;typeof window<"u"&&window.document.documentElement.addEventListener("mousedown",()=>st++,{capture:!0});function Pn(t){const n={cmp:t,zIndex:It(),mountMouseDownCounter:st};V.push(n),V.length===1&&document.documentElement.addEventListener("click",kt,{capture:!0})}function Un(t){const n=V.findIndex(r=>r.cmp===t);V.splice(n,1),V.length===0&&document.documentElement.removeEventListener("click",kt,{capture:!0})}function Vn(t){const n=V.find(r=>r.cmp===t);return n?n.zIndex:It()}function It(){const t=V[V.length-1];return t?t.zIndex+100:1e3}function Hn(t,n){const r=t.rootRef.current;return!!r&&r.contains(n)}function kt(t){const n=t.target;if(n.closest("#userflow-ui, #notifications"))return;const r=V.findIndex(a=>Hn(a.cmp,n));for(let a=V.length-1;a>r;a--){const s=V[a];s&&s.mountMouseDownCounter<st&&s.cmp.closeLayer(t)}}const Xe=8,Bn=Xe*2,Wn=8,ht=50,me=8,Et=24,qn=8;class Pe extends e.PureComponent{constructor(){super(...arguments),this.rootRef=e.createRef(),this.notchRef=e.createRef(),this.bodyRef=e.createRef(),this.state={},this.onAnimationFrame=()=>{this.reposition(),this.requestAnimationFrame()},this.onClick=n=>{n.stopPropagation(),this.props.onClick&&this.props.onClick(n)},this.closeLayer=n=>{if(this.props.ignoreTargetClick){const r=this.props.target,a=n.target;if(r&&a&&r.contains(a))return}this.fireOnDismiss({reason:"outside-click",event:n})},this.onEscape=()=>this.fireOnDismiss({reason:"escape"})}get el(){return this.rootRef.current}componentDidMount(){Pn(this),this.props.onDismiss&&ft(this.onEscape),window.addEventListener("userflow:hideAllPopovers",this.closeLayer),this.requestAnimationFrame(),this.reposition()}componentWillUnmount(){Un(this),gt(this.onEscape),window.removeEventListener("userflow:hideAllPopovers",this.closeLayer),window.cancelAnimationFrame(this.raf)}componentDidUpdate(n){const{props:r}=this;this.reposition(),!n.onDismiss&&r.onDismiss?ft(this.onEscape):n.onDismiss&&!r.onDismiss&>(this.onEscape)}render(){const{props:n}=this,r=this.state,a=["popover"];n.className&&a.push(n.className),a.push(`popover--placement-${r.actualPlacement}`);const s=e.createElement("div",{className:a.join(" "),ref:this.rootRef,onMouseDown:n.onMouseDown,onMouseEnter:n.onMouseEnter,onClick:this.onClick,style:{zIndex:Vn(this)}},e.createElement("div",{className:"popover__body",ref:this.bodyRef},n.children),!n.noNotch&&this.renderNotch());return je.createPortal(s,(n.document||document).body)}renderNotch(){const n=Xe,r=n*2;return e.createElement("div",{ref:this.notchRef,className:"popover__notch"},e.createElement("svg",{viewBox:`0 0 ${r} ${n}`},e.createElement("polygon",{className:"popover__notch-border",points:`${r/2},0 ${r},${n} 0,${n}`}),e.createElement("polygon",{className:"popover__notch-fill",points:`${r/2},1 ${r},${n+1} 0,${n+1}`})))}requestAnimationFrame(){this.raf=window.requestAnimationFrame(this.onAnimationFrame)}reposition(){const{props:n}=this,r=n.target,a=this.rootRef.current,s=this.notchRef.current,o=n.placement||"bottom",l=Te(o),c=!!n.forceDimension,m=n.horizontalAlign,E=n.verticalAlign,h=!!n.noNotch,p=document.documentElement.clientWidth,u=document.documentElement.clientHeight,g=r?.getBoundingClientRect(),C=g?.left,d=g?.top,w=g?.width,y=g?.height;let x=n.width;n.matchWidth&&(x=w);let T=n.minWidth;n.matchMinWidth&&w!=null&&(T=Math.max(w,T||0)),(this.lastPopoverCssWidth!==x||this.lastPopoverMinWidth!==T)&&(a.style.width=x==null?"":Math.round(x)+"px",a.style.minWidth=T==null?"":Math.round(T)+"px");const A=a.getBoundingClientRect(),D=A?.width,I=A?.height,ge=parseInt((window.getComputedStyle(a).borderTopLeftRadius||"").replace(/px/,""),10),j=window.scrollX,ne=window.scrollY;if(this.lastPlacement===o&&this.lastForceDimension===c&&this.lastHorizontalAlign===m&&this.lastVerticalAlign===E&&this.lastNoNotch===h&&this.lastViewportWidth===p&&this.lastViewportHeight===u&&this.lastTargetX===C&&this.lastTargetY===d&&this.lastTargetWidth===w&&this.lastTargetHeight===y&&this.lastPopoverCssWidth===x&&this.lastPopoverMinWidth===T&&this.lastPopoverWidth===D&&this.lastPopoverHeight===I&&this.lastPopoverBorderRadius===ge&&this.lastScrollX===j&&this.lastScrollY===ne)return;let $,R=null;if(C!=null&&d!=null&&w!=null&&y!=null){$=!0;const H=h?0:Wn,xe=vt(C,w,D,p,m||"left"),Se=vt(d,y,I,u,E||"top");let re=[{placement:"top",x:xe,y:d-I-H,fits:I<d-H-me},{placement:"bottom",x:xe,y:d+y+H,fits:I<u-(d+y)-H-me},{placement:"left",x:C-D-H,y:Se,fits:D<=C-H-me},{placement:"right",x:C+w+H,y:Se,fits:D<=p-(C+w)-H-me}];c&&(re=re.filter(k=>Te(k.placement)===l)),re.sort((k,F)=>{const O=Te(k.placement),f=Te(F.placement);return k.fits!==F.fits?k.fits?-1:1:k.placement===o?-1:F.placement===o?1:O!==f?O===l?-1:1:k.placement==="bottom"||k.placement==="right"?-1:1});const ae=re[0];let X=ae.x,Z=ae.y;if(R=ae.placement,X+=j,Z+=ne,X=Math.round(X),Z=Math.round(Z),a.style.transform=`translate3d(${X}px, ${Z}px, 0px)`,!h&&s){const k=Math.max(qn,ge);let F,O;if(R==="left"||R==="right"){const f=d+y/2-Xe/2;y<=ht||E==="center"?O=f:O=Math.min(d,f),O+=-Z+ne,O=Math.max(k,Math.min(I-k,O))}else{const f=C+w/2-Bn/2;w<=ht||m==="center"?F=f:F=Math.min(C,f),F+=-X+j,F=Math.max(k,Math.min(D-k,F))}F=F&&Math.round(F),O=O&&Math.round(O),s.style.left=F==null?"":F+"px",s.style.top=O==null?"":O+"px"}}else $=!1,a.style.transform="translate3d(-999999px, -999999px, 0px)";$&&!this.lastVisible&&n.onShow&&n.onShow(),R!==this.lastActualPlacement&&(this.setState({actualPlacement:R}),n.onPlacementChange&&n.onPlacementChange(R)),this.lastVisible=$,this.lastPlacement=o,this.lastActualPlacement=R,this.lastForceDimension=c,this.lastHorizontalAlign=m,this.lastVerticalAlign=E,this.lastNoNotch=h,this.lastViewportWidth=p,this.lastViewportHeight=u,this.lastTargetX=C,this.lastTargetY=d,this.lastTargetWidth=w,this.lastTargetHeight=y,this.lastPopoverCssWidth=x,this.lastPopoverMinWidth=T,this.lastPopoverWidth=D,this.lastPopoverHeight=I,this.lastPopoverBorderRadius=ge,this.lastScrollX=j,this.lastScrollY=ne}fireOnDismiss(n){const{onDismiss:r}=this.props;r&&r(n),!this.props.noTargetRefocus&&n.reason==="escape"&&this.props.target&&this.props.target.focus()}}function Te(t){return t==="left"||t==="right"?"x":"y"}function vt(t,n,r,a,s){let o;return s==="center"?o=t+n/2-r/2:o=t,o=Math.max(o,me),o=Math.min(o,a-r-me),o=Math.max(o,t+Et-r),o=Math.min(o,t+n-Et),o}const $n=250,Gn=250;let zn=0;class Yn{constructor(){this.currentId=null,this.subscribers=new Set}showDelayed(n){window.clearTimeout(this.changeTimeout),this.currentId?this.updateCurrentId(n):this.changeTimeout=window.setTimeout(()=>{this.updateCurrentId(n)},$n)}hideDelayed(n){window.clearTimeout(this.changeTimeout),n===this.currentId&&(this.changeTimeout=window.setTimeout(()=>{this.updateCurrentId(null)},Gn))}hide(n){window.clearTimeout(this.changeTimeout),n===this.currentId&&this.updateCurrentId(null)}updateCurrentId(n){this.currentId=n,this.subscribers.forEach(r=>r(n))}subscribe(n){return this.subscribers.add(n),()=>{this.subscribers.delete(n)}}}const Kn=i.createContext(new Yn),jn=t=>{const n=i.useRef(null),[r]=i.useState(()=>++zn),a=i.useContext(Kn),[s,o]=i.useState(a.currentId);i.useEffect(()=>a.subscribe(o),[a]);const{tip:l,maxWidth:c,children:m,Tag:E,...h}=t,p=E||"div";let u=null;return s===r&&n.current&&(u=e.createElement(Pe,{className:"tooltipped__popover",target:n.current,placement:"top",horizontalAlign:"center",verticalAlign:"center",onMouseEnter:()=>a.hide(r),document:n.current.ownerDocument||void 0},e.createElement("div",{style:{maxWidth:c||300}},typeof l=="function"?l():l))),e.createElement(e.Fragment,null,e.createElement(p,{ref:n,...h,onMouseEnter:l?()=>a.showDelayed(r):void 0,onMouseLeave:l?()=>a.hideDelayed(r):void 0,onMouseDown:l?()=>a.hide(r):void 0},m),u)},Xn=({tip:t,icon:n})=>e.createElement(jn,{className:"help-tip",tip:t},e.createElement(ee,{icon:n||nn}));class Za extends e.PureComponent{constructor(){super(...arguments),this.memoizedStyle=St((n,r)=>(n=n||{},r&&(n.width=`${r}px`),n))}render(){const{props:n}=this,r=["form-group"],a=!!n.error&&n.error!==!0;a&&r.push("form-group--invalid"),n.className&&r.push(n.className);let s=null;return n.label&&(s=e.createElement("label",{className:b({label:!0,"mr-8":!!n.tip,[`text-${n.align}`]:!!n.align}),htmlFor:n.labelFor},n.label,n.required&&e.createElement(e.Fragment,null," ",e.createElement("span",{className:"text-red"},"*")))),n.tip&&(s=e.createElement("div",{className:"d-flex"},s,e.createElement(Xn,{tip:n.tip}))),e.createElement("div",{className:r.join(" "),style:this.memoizedStyle(n.style,n.width)},s,n.children,a&&e.createElement("div",{className:"error-tooltip"+(n.align?` text-${n.align}`:"")},n.error))}}function Zn(t,n){return t&&(t.includes.some(r=>r!="")||t.excludes.some(r=>r!=""))?!0:"Enter at least one URL pattern"}class Qn extends e.PureComponent{constructor(n){super(n),this.root=e.createRef(),this.valueMirror=e.createRef(),this.placeholderMirror=e.createRef(),this.state={width:n.minWidth||200}}componentDidMount(){this.resize()}componentDidUpdate(n){const{props:r}=this;(r.value!==n.value||r.placeholder!==n.placeholder||r.className!==n.className||r.minWidth!==n.minWidth)&&this.resize()}render(){const{children:n}=this.props,r="input-grow__mirror "+(this.props.className||"");return e.createElement("div",{ref:this.root,className:"input-grow"},e.createElement("div",{ref:this.valueMirror,className:r},this.props.value),this.props.placeholder&&e.createElement("div",{ref:this.placeholderMirror,className:r},this.props.placeholder),n)}resize(){const n=this.root.current,r=this.valueMirror.current;if(!n||!r)return;let a=r.offsetWidth;this.props.minWidth&&(a=Math.max(this.props.minWidth,a)),this.props.maxWidth&&(a=Math.min(this.props.maxWidth,a)),this.placeholderMirror.current&&(a=Math.max(this.placeholderMirror.current.offsetWidth,a)),a=Math.ceil(a)+1,this.props.useFlexBasis?(n.style.flexGrow="0",n.style.flexShrink="1",n.style.flexBasis=a+"px"):n.style.width=a+"px"}}class Ot extends e.PureComponent{constructor(n){super(n),this.onChange=r=>{const a=r.target.value,{onChange:s}=this.props,o=this.parseInputValue(a);this.setState({inputValue:a}),s&&s(o)},this.onBlur=r=>{this.setState({inputValue:this.formatInputValue(this.props.value)}),this.props.onBlur&&this.props.onBlur(r)},this.onKeyDown=r=>{const{arrowsIncrement:a,value:s,onChange:o,onKeyDown:l}=this.props;a&&o&&(r.key==="ArrowUp"?(r.preventDefault(),o(s==null?1:s+1)):r.key==="ArrowDown"&&(r.preventDefault(),o(s==null?-1:s-1))),l&&l(r)},this.state={inputValue:this.formatInputValue(n.value)}}formatInputValue(n){if(n==null)return"";const r=this.props.format||"0,0";return mt(n).format(r)}parseInputValue(n){const r=this.props.format||"0,0";if(n==="")return null;let a=mt(n).value();if(a==null)return null;let s=null;if(r==="0"||r==="0,0")s=0;else{const o=r.match(/\.(0+)$/);if(o)s=o[1].length;else{const l=r.match(/\.\[(0+)\]$/);l&&(s=l[1].length)}}return s!=null&&(a=new kn(a).decimalPlaces(s).toNumber()),a}componentDidUpdate(){const{value:n}=this.props,r=this.parseInputValue(this.state.inputValue);n!=r&&this.setState({inputValue:this.formatInputValue(n)})}render(){const{props:n}=this,r=this.state,a=`number-input ${n.className||""}`;let s=e.createElement("input",{ref:n.inputRef,"data-testid":n.testid,type:"text",className:a,value:r.inputValue,onChange:this.onChange,onBlur:this.onBlur,onKeyDown:this.onKeyDown,disabled:n.disabled,placeholder:n.placeholder,...n.htmlAttributes});return n.grow&&(s=e.createElement(Qn,{className:a,value:r.inputValue,placeholder:n.placeholder?n.placeholder:"0"},s)),s}}const Jn=[],er=({disabled:t,disableAfter:n,disableBefore:r,inputClassName:a,inputRef:s,name:o,onBlur:l,onChange:c,onEnter:m,onFocus:E,placeholder:h,time:p,value:u})=>{const g=i.useRef(null),C=i.useRef(null),[d,w]=i.useState(null),[y,x]=i.useState(0),[T,A]=i.useState(p?pe(u):De(u)),[D,I]=i.useState(!1),[ge,j]=i.useState(!1),ne=f=>{w(f),s&&(s.current=f)};i.useEffect(()=>{d!==document.activeElement&&A(p?pe(u):De(u))},[d,u,p]);const $=f=>{c&&c(f)},R=f=>{A(p?pe(f):De(f)),$(f)},H=f=>{p&&(u?(f.setHours(u.getHours()),f.setMinutes(u.getMinutes())):(f.setHours(12),f.setMinutes(0)),f.setSeconds(0),f.setMilliseconds(0)),R(f),p||I(!1)},xe=f=>{const N=u?new Date(u.valueOf()):new Date;N.setHours(f),N.setSeconds(0),N.setMilliseconds(0),u||N.setMinutes(0),R(N)},Se=f=>{const N=u?new Date(u.valueOf()):new Date;N.setMinutes(f),N.setSeconds(0),N.setMilliseconds(0),T||N.setHours(12),R(N)},re=f=>{const{value:N}=f.target;A(N);const se=rr(N);se?(x(y+1),$(se)):$(null)},ae=f=>{f.preventDefault(),j(!0);const N=()=>{j(!1),document.body.removeEventListener("mouseup",N)};document.body.addEventListener("mouseup",N)},X=()=>{t||(D?I(!1):(d?.focus({preventScroll:!0}),I(!0)))},Z=f=>{switch(f.key){case"Enter":D?I(!1):m&&m();break;case"Escape":D&&(f.preventDefault(),f.stopPropagation(),I(!1));break}},k=f=>{A(p?pe(u):De(u)),ge||I(!1),l&&l(f)};i.useEffect(()=>{!p||!u||!D||(C.current?.querySelector(`[data-date-input-hour="${u.getHours()}"]`)?.scrollIntoView({block:"nearest"}),C.current?.querySelector(`[data-date-input-minute="${u.getMinutes()}"]`)?.scrollIntoView({block:"nearest"}))},[p,u,D]);const F=f=>{const N=[],se=f?.getHours();for(let P=0;P<24;P++){let U;if(At){let He=P%12;He===0&&(He=12),U=`${He} ${P<12?" am":" pm"}`}else U=P.toString().padStart(2,"0");N.push(e.createElement("div",{key:P,className:b({"date-input__time-btn":!0,"date-input__time-btn--selected":P===se}),onClick:()=>xe(P),"data-date-input-hour":P},U))}return N},O=f=>{const N=[],se=f?.getMinutes(),P=5;for(let U=0;U<60;U+=P)N.push(e.createElement("div",{key:U,className:b({"date-input__time-btn":!0,"date-input__time-btn--selected":U===se}),onClick:()=>Se(U),"data-date-input-minute":U},U.toString().padStart(2,"0")));return N};return e.createElement(e.Fragment,null,e.createElement("div",{ref:g,className:b({"input-group":!0,"input-group--disabled":!!t})},e.createElement("input",{type:"text",className:a,name:o,value:T,onChange:re,onFocus:E,onBlur:k,onKeyDown:Z,onMouseDown:()=>I(!0),placeholder:h,disabled:t,ref:ne}),e.createElement("div",{className:"input-group__append input-group__trigger",onClick:X,onMouseDown:ae},e.createElement(ee,{icon:p?nt:rn}))),D&&g.current?e.createElement(Pe,{target:g.current,onMouseDown:ae},e.createElement("div",{ref:C,className:"d-flex"},e.createElement(On,{selectedDays:u||Jn,initialMonth:u||void 0,onDayClick:H,key:y,disabledDays:[...r?[{before:r}]:[],...n?[{after:n}]:[]]}),p&&e.createElement("div",{className:"date-input__time"},e.createElement("div",{className:"date-input__time-caption"},"Time"),e.createElement("div",{className:"date-input__time-main-container"},e.createElement("div",{className:"date-input__time-scroll-container"},F(u)),e.createElement("div",{className:"date-input__time-scroll-container"},O(u))))),p&&e.createElement("div",{className:"date-input__time-footer"},e.createElement("small",null,`Time is set in your local timezone (${Intl.DateTimeFormat().resolvedOptions().timeZone.replace(/_/g," ")})`))):null)},tr=["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"],nr=["hh:mmaaa","hh.mmaaa","hh:mm aaa","hh.mm aaa","HH:mm","HH.mm","hhaaa","hh aaa","HH"],Ze=[];for(const t of tr){for(const n of nr)Ze.push(t+" "+n);Ze.push(t)}function rr(t){if(!t)return null;const n=t.replace(/[,]/g," ").replace(/\s{2,}/g," ").replace(/^[.:\s]+/g,"").replace(/[.:\s]+$/g,"");for(const r of Ze){const a=Tt(n,r,new Date);if(Mn(a))return a}return null}const Lt="d MMM yyyy";function De(t){return t==null?"":Ce(t,Lt)}function pe(t){if(t==null)return"";const n=At?t.getMinutes()===0?"h aaa":"h:mm aaa":"HH:mm";return Ce(t,Lt+", "+n)}function ar(t){return t==null?null:Ce(t,"yyyy-MM-dd")}function Mt(t){if(!t)return null;const n=Tt(t,"yyyy-MM-dd",new Date);return isNaN(n.valueOf())?null:n}function bt(t){if(!t)return null;const n=Ln(t);return isNaN(n.valueOf())?null:n}const At=Intl.DateTimeFormat(Intl.DateTimeFormat().resolvedOptions().locale,{hour:"numeric"}).resolvedOptions().hourCycle==="h12";function Ue(){const[t,n]=i.useState(!1),r=i.useRef(null),a=i.useCallback(()=>n(!0),[]),s=i.useCallback(()=>n(!1),[]),o=i.useCallback(()=>n(!0),[]),l=i.useCallback(()=>n(!1),[]);return{ref:r,hovered:t,eventHandlers:{onPointerEnter:a,onPointerLeave:s,onFocus:o,onBlur:l}}}const sr={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"]},or={[L.ANNOUNCEMENT]:"announcement",[L.ASSISTANT]:"AI assistant",[L.BANNER]:"banner",[L.CHECKLIST]:"checklist",[L.FLOW]:"flow",[L.EMBED]:"embed",[L.LAUNCHER]:"launcher",[L.RESOURCE_CENTER]:"resource center",[L.TRACKER]:"event tracker"};function Rt(t,{title:n,plural:r}={}){let a=or[t];return n&&(a=Ae.upperFirst(a)),r&&(a+="s"),a}function wt(t){switch(t){case B.USER:return rt;case B.GROUP:return sn;case B.GROUP_MEMBERSHIP:return an;case B.EVENT:return yt}}function lr(t){const n=t.split("/");if(n.length===1)return[B.USER,t];switch(n[0]){case"group":return[B.GROUP,n[1]];case"group_membership":return[B.GROUP_MEMBERSHIP,n[1]];case"event":return[B.EVENT,n[1]]}return console.warn("parseAttributeDefinitionFqn: Invalid attribute definition FQN",t),[B.USER,t]}z.SECOND,z.MINUTE,z.HOUR,z.DAY;function Qe(t,n){switch(t){case z.DAY:return n===1?"day":"days";case z.HOUR:return n===1?"hour":"hours";case z.MINUTE:return n===1?"minute":"minutes";case z.SECOND:return n===1?"second":"seconds"}}le.BODY_FIRST,le.BODY_LAST,le.ELEMENT_FIRST,le.ELEMENT_LAST,le.ELEMENT_BEFORE,le.ELEMENT_AFTER;ie.BODY_FIRST,ie.BODY_LAST,ie.ELEMENT_FIRST,ie.ELEMENT_LAST,ie.ELEMENT_BEFORE,ie.ELEMENT_AFTER;We.START,We.CENTER,We.SPACE_BETWEEN;he.SILENT,he.BADGE,he.POPOUT,he.MODAL,he.TOAST;qe.NONE,qe.LIKE,qe.SCALE;dt.DAILY,dt.WEEKLY;$e.START,$e.CENTER,$e.SPACE_BETWEEN;e.createContext(null);const ir=e.createContext(null);function cr(){const t=i.useContext(ir);if(!t)throw new Error("useCompanyData: Data was not set");return t}function ur(){return cr().company}const dr={kind:"Document",definitions:[{kind:"FragmentDefinition",name:{kind:"Name",value:"FlowForSelect"},typeCondition:{kind:"NamedType",name:{kind:"Name",value:"Flow"}},selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"id"}},{kind:"Field",name:{kind:"Name",value:"name"}},{kind:"Field",name:{kind:"Name",value:"type"}}]}}]},mr={kind:"Document",definitions:[{kind:"OperationDefinition",operation:"query",name:{kind:"Name",value:"ListFlowsForSelect"},variableDefinitions:[{kind:"VariableDefinition",variable:{kind:"Variable",name:{kind:"Name",value:"companyId"}},type:{kind:"NonNullType",type:{kind:"NamedType",name:{kind:"Name",value:"ID"}}}},{kind:"VariableDefinition",variable:{kind:"Variable",name:{kind:"Name",value:"types"}},type:{kind:"ListType",type:{kind:"NonNullType",type:{kind:"NamedType",name:{kind:"Name",value:"FlowType"}}}}}],selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"company"},arguments:[{kind:"Argument",name:{kind:"Name",value:"id"},value:{kind:"Variable",name:{kind:"Name",value:"companyId"}}}],selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"id"}},{kind:"Field",name:{kind:"Name",value:"flows"},arguments:[{kind:"Argument",name:{kind:"Name",value:"types"},value:{kind:"Variable",name:{kind:"Name",value:"types"}}}],selectionSet:{kind:"SelectionSet",selections:[{kind:"FragmentSpread",name:{kind:"Name",value:"FlowForSelect"}}]}}]}}]}},...dr.definitions]};class Je extends e.PureComponent{constructor(n){super(n),this.rootRef=e.createRef(),this.optionsElRef=e.createRef(),this.input=null,this.popoverRef=e.createRef(),this.isMouseDown=!1,this.isCreateOpen=!1,this.setInput=r=>{this.input=r;const{inputRef:a}=this.props;a&&(typeof a=="function"?a(r):a.current=r)},this.onInputChange=r=>{r.stopPropagation();const{value:a}=r.target;a!==""&&this.openPopover();const s=this.memoizedFilterOptions(this.props.options,a);this.setState({inputValue:a,q:a,highlightedIndex:s.length>0?0:-1,createHighlighted:s.length===0}),a===""&&!this.props.noEmpty&&this.triggerOnChange(null),this.props.onSearchChange&&this.props.onSearchChange(a)},this.onPopoverPlacementChange=r=>this.setState({popoverPlacement:r}),this.onMouseDown=r=>{r.preventDefault(),this.isMouseDown=!0;const a=()=>{this.isMouseDown=!1,this.props.document?.removeEventListener("mouseup",a),document.body.removeEventListener("mouseup",a)};this.props.document?.addEventListener("mouseup",a),document.body.addEventListener("mouseup",a)},this.onFocus=r=>{this.input&&!this.props.noSearch&&this.input.select(),this.props.onFocus&&this.props.onFocus(r)},this.onBlur=r=>{this.isMouseDown||this.closePopover(),this.props.onBlur&&!this.isCreateOpen&&this.props.onBlur(r)},this.onTriggerClick=()=>{this.props.readOnly||this.props.disabled||(this.state.popoverOpen?this.closePopover():(this.input&&this.input.focus(),this.openPopover()))},this.onKeyDown=r=>{const{popoverOpen:a,highlightedIndex:s,createHighlighted:o}=this.state,l=this.getFilteredOptions(),c=l.length-1;switch(r.key){case"ArrowUp":r.preventDefault(),a&&(o?this.setState({highlightedIndex:c,createHighlighted:!1}):s>0&&this.setState({highlightedIndex:s-1}));break;case"ArrowDown":r.preventDefault(),a?this.props.onCreate&&(s===c||o)?this.setState({highlightedIndex:-1,createHighlighted:!0}):s<c&&this.setState({highlightedIndex:s+1}):this.props.noOpenOnDown||this.openPopover();break;case"Enter":if(a)if(r.preventDefault(),o)this.fireOnCreate();else{const m=l[s];(m||!this.props.noEmpty)&&this.selectOption(m)}else this.props.onEnter?this.props.onEnter():this.openPopover();break;case"Tab":a&&this.selectOption(l[s]);break;case"Escape":a&&(r.preventDefault(),r.stopPropagation(),this.setState({popoverOpen:!1}));break}},this.selectOption=r=>{r===this.props.value?this.setState({popoverOpen:!1,inputValue:this.renderOptionText(r),q:""}):(this.setState({popoverOpen:!1,inputValue:"",q:""}),this.triggerOnChange(r))},this.highlightOption=r=>{this.setState({highlightedIndex:r,createHighlighted:!1})},this.highlightCreate=()=>{this.setState({highlightedIndex:-1,createHighlighted:!0})},this.fireOnCreate=()=>{const{onCreate:r}=this.props;if(r){this.isCreateOpen=!0;const a={q:Ae.upperFirst(this.state.q),callback:s=>{this.isCreateOpen=!1,s!=null&&this.selectOption(s),this.input&&this.input.focus()}};r(a),this.closePopover()}},this.openPopover=()=>{if(!this.state.popoverOpen){const r=this.getFilteredOptions();let a=0,s=!1;if(r.length===0)a=-1,s=!0;else{const{value:o}=this.props,l=r.findIndex(c=>c===o);l!==-1&&(a=l)}this.setState({popoverOpen:!0,highlightedIndex:a,createHighlighted:s})}},this.memoizedFilterOptions=St((r,a)=>(r=r||[],a?r.filter(s=>this.filter(s,a)):r)),this.state={inputValue:this.renderOptionText(n.value==null?null:n.value),q:"",popoverOpen:!1,popoverPlacement:null,highlightedIndex:-1,createHighlighted:!1}}componentDidUpdate(n,r){const{value:a}=this.props;if(a!==n.value){const s=this.renderOptionText(a??null);s!==this.state.inputValue&&this.setState({inputValue:s})}r.highlightedIndex!==this.state.highlightedIndex&&this.scrollHighlightedOptionIntoView()}render(){let n;const{props:r}=this,a=this.state,s=a.popoverPlacement==="top"?"above":"below";if(a.popoverOpen&&this.rootRef.current){const l=this.getFilteredOptions();let c;if(l.length>0){let m=null;c=l.reduce((E,h,p)=>{const u=this.getOptionGroup(h);u&&u!==m&&E.push(e.createElement("div",{key:"group:"+u,className:"combo-box__group-header"},u)),m=u;const g=["combo-box__option"];return p===a.highlightedIndex&&g.push("combo-box__option--highlighted"),E.push(e.createElement(pr,{key:this.getOptionKey(h,p),className:g.join(" "),option:h,idx:p,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-"+p,className:"combo-box__option-sep"})),E},[])}else r.loading?c=e.createElement("div",{className:"combo-box__no-results"},"Loading..."):c=e.createElement("div",{className:"combo-box__no-results"},"No matching ",r.nounPlural||"items");n=e.createElement(Pe,{ref:this.popoverRef,className:"combo-box-popover"+(r.popoverNotch?"":` combo-box-popover--${s}`),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:b({"combo-box__options":!0,"combo-box__options--with-create":!!r.onCreate})},c),r.onCreate&&e.createElement("div",{key:"create",className:b({"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(ee,{icon:on})),e.createElement("div",{className:"combo-box__create-text"},"Create"," ",a.q===""?"new"+(r.noun?` ${r.noun}`:""):e.createElement("b",null,Ae.upperFirst(a.inputValue)))))}const o=["input-group","combo-box"];return a.popoverOpen&&(o.push("combo-box--open"),r.popoverNotch||o.push(`combo-box--with-popover-${s}`)),r.disabled&&o.push("input-group--disabled"),r.noSearch&&o.push("combo-box--no-search"),r.className&&o.push(r.className),e.createElement(e.Fragment,null,e.createElement("div",{className:o.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"},Ut(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(ee,{icon:ln})),r.childrenAfter),n)}scrollHighlightedOptionIntoView(){const n=this.optionsElRef.current;if(this.state.popoverOpen&&n){const r=n.querySelector(".combo-box__option--highlighted");if(r){const a=n.getBoundingClientRect(),s=r.getBoundingClientRect();s.top<a.top?n.scrollTop+=s.top-a.top:s.bottom>a.bottom&&(n.scrollTop+=s.bottom-a.bottom)}}}triggerOnChange(n){const{onChange:r}=this.props;r&&r(n)}closePopover(){this.setState({popoverOpen:!1,inputValue:this.renderOptionText(this.props.value==null?null:this.props.value),q:""})}renderOptionText(n){return n==null?"":Pt(n,this.props.renderOptionText)}getFilteredOptions(){return this.memoizedFilterOptions(this.props.options,this.state.q)}filter(n,r){return this.props.filter?this.props.filter(n,r):this.renderOptionText(n).toLowerCase().includes(r.toLowerCase())}getOptionKey(n,r){return n&&n.id||r}getOptionGroup(n){return this.props.getOptionGroup?this.props.getOptionGroup(n):n&&n.group||null}}class pr extends e.PureComponent{constructor(){super(...arguments),this.state={isOptionDisabled:!1},this.onClick=()=>{this.state.isOptionDisabled||this.props.onClick(this.props.option)},this.onHover=()=>{this.state.isOptionDisabled||this.props.onHover(this.props.idx)}}componentDidMount(){const n=this.props.option!==void 0&&typeof this.props.option=="object"&&this.props.option!==null&&"disabled"in this.props.option&&this.props.option.disabled===!0;this.setState({isOptionDisabled:n})}componentDidUpdate(){const n=this.props.option!==void 0&&typeof this.props.option=="object"&&this.props.option!==null&&"disabled"in this.props.option&&this.props.option.disabled===!0;this.setState({isOptionDisabled:n})}render(){const{isOptionDisabled:n}=this.state,{props:r}=this;return e.createElement("div",{className:b({[r.className]:!0,"combo-box__option--disabled":n}),onClick:this.onClick,onMouseMove:this.onHover},fr(r.option,r.renderOptionText,r.renderOptionItem,r.getOptionIcon))}}function Pt(t,n){return n?n(t):typeof t=="string"||typeof t=="number"?t:t?t.name:"?"}function fr(t,n,r,a){if(r)return r(t);{let s=Pt(t,n);return a?e.createElement("div",{className:"d-flex align-flex-start"},e.createElement("div",{className:"combobox__option-icon"},Ut(t,a)),e.createElement("div",{className:"flex-1"},s)):s}}function Ut(t,n){const r=n(t);return gr(r)?e.createElement(ee,{icon:r}):r}function gr(t){return An(t)&&"iconName"in t}function hr(t){if(typeof t!="string"&&t.graphQLErrors){const n=[];if(t.graphQLErrors.forEach(r=>{r.message&&n.push(r.message)}),n.length>0)return n.join(`
|
|
3
|
+
`)}return console.error("Unknown Apollo error:",t),"Sorry, an error occurred. Please try again or contact us."}const Er=({icon:t,noIcon:n,type:r,label:a,plain:s,banner:o,className:l,children:c})=>(r=r||"info",e.createElement("div",{className:b({alert:!0,[`alert--${r}`]:!0,"alert--plain":!!s,"alert--banner":!!o,[l||""]:!!l})},!n&&e.createElement("div",{className:"alert__icon"},e.createElement(ee,{icon:t||vr(r)})),e.createElement("div",{className:"alert__content"},a&&e.createElement("span",{className:"alert__label"},a),c)));function vr(t){switch(t){case"info":return fe;case"success":return Q;case"warning":return un;case"danger":return cn}}const Vt=({error:t})=>e.createElement(Er,{type:"danger"},hr(t)),br=t=>{const{value:n}=t,{valueId:r,types:a,...s}=t,o=ur(),{loading:l,data:c,error:m}=Ft(mr,{variables:{companyId:o.id,types:a}}),E=c&&c.company&&c.company.flows||void 0,h=i.useMemo(()=>n||!E?n:E.find(p=>p.id===r),[E,n,r]);return m?e.createElement(Vt,{error:m}):r&&!E?e.createElement(Je,{placeholder:"Loading...",disabled:!0}):e.createElement(Je,{...s,value:h,loading:l,options:E,placeholder:a&&a.length===1?`Select ${Rt(a[0])}...`:"Select content...",triggerTestId:"flow-select-trigger"})},wr={kind:"Document",definitions:[{kind:"FragmentDefinition",name:{kind:"Name",value:"FlowSlim"},typeCondition:{kind:"NamedType",name:{kind:"Name",value:"Flow"}},selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"id"}},{kind:"Field",name:{kind:"Name",value:"name"}},{kind:"Field",name:{kind:"Name",value:"type"}}]}}]},_r={kind:"Document",definitions:[{kind:"OperationDefinition",operation:"query",name:{kind:"Name",value:"GetFlowSlim"},variableDefinitions:[{kind:"VariableDefinition",variable:{kind:"Variable",name:{kind:"Name",value:"flowId"}},type:{kind:"NonNullType",type:{kind:"NamedType",name:{kind:"Name",value:"ID"}}}}],selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"flow"},arguments:[{kind:"Argument",name:{kind:"Name",value:"id"},value:{kind:"Variable",name:{kind:"Name",value:"flowId"}}}],selectionSet:{kind:"SelectionSet",selections:[{kind:"FragmentSpread",name:{kind:"Name",value:"FlowSlim"}}]}}]}},...wr.definitions]};i.createContext(null);const be=({condition:t,updateCondition:n,readOnly:r})=>e.createElement("input",{"data-testid":"condition-value",type:"text",value:t.value||"",placeholder:"Enter value",onChange:a=>n({value:a.target.value},{snapshotGroup:"condition:value:"+t.stateKey}),onKeyDown:a=>a.key==="Enter"&&n({open:!1},{clean:!0}),disabled:r}),et=({condition:t,updateCondition:n,readOnly:r,field:a})=>{const s=a||"value",o=t[s];return e.createElement(Ot,{value:o?parseFloat(o):null,format:"0,0.[000000]",placeholder:"Enter number",onChange:l=>n({[s]:l==null?null:String(l),[`${s}Validated`]:void 0},{snapshotGroup:`condition:${s}:${t.stateKey}`}),onKeyDown:l=>l.key==="Enter"&&n({open:!1},{clean:!0}),disabled:r})};function ye(t){return parseInt(t,10)}const yr=({condition:t,updateCondition:n,readOnly:r})=>{const a=t.attributeName==="event/flow_id"?L.FLOW:t.attributeName==="event/checklist_id"?L.CHECKLIST:t.attributeName==="event/launcher_id"?L.LAUNCHER:t.attributeName==="event/banner_id"?L.BANNER:void 0;return e.createElement(br,{valueId:t.value,onChange:s=>n({value:s==null?null:s.id}),onEnter:()=>n({open:!1},{clean:!0}),disabled:r,types:a?[a]:void 0})},G=t=>{const{condition:n}=t;return n.dataType===we.NUMBER?e.createElement(et,{...t}):n.dataType===we.FLOW?e.createElement(yr,{...t}):e.createElement(be,{...t})},Fe=t=>{const{condition:n,updateCondition:r}=t,[a,s]=i.useState(n.values||[]),o=l=>{s(l),r({values:l.filter(c=>c!=="")},{snapshotGroup:"condition:values:"+n.stateKey})};return e.createElement("div",{className:"mdv-8"},Ae.range(0,Math.max(2,a.length+1)).map(l=>e.createElement("div",{key:l,className:"input-group"},e.createElement("input",{type:"text",value:a[l]||"",placeholder:l===0?"Enter value":"Add another value",onChange:c=>{const m=[...a.slice(0,l),c.target.value,...a.slice(l+1)];for(;m.length>0&&m[m.length-1]==="";)m.pop();o(m)}}),l<a.length&&e.createElement("div",{className:"input-group__trigger input-group__append",onClick:()=>o([...a.slice(0,l),...a.slice(l+1)])},e.createElement(ee,{icon:dn})))))},Ge=({condition:t,updateCondition:n,readOnly:r})=>e.createElement(er,{value:Mt(t.value||null),placeholder:"Enter date",onChange:a=>n({value:ar(a)},{snapshotGroup:"condition:value:"+t.stateKey}),onEnter:()=>n({open:!1},{clean:!0}),disabled:r}),ze=({condition:t,updateCondition:n,readOnly:r})=>e.createElement("div",{className:"input-group"},e.createElement(Ot,{value:t.value?ye(t.value):null,placeholder:"Enter number",onChange:a=>n({value:a==null?null:String(a)},{snapshotGroup:"condition:value:"+t.stateKey}),onKeyDown:a=>a.key==="Enter"&&n({open:!1},{clean:!0}),disabled:r}),e.createElement("div",{className:"input-group__append"},"days ago")),S=t=>t.value?t.value.length>255?"Must not be longer than 255 characters":!0:"Please enter a value",Cr=t=>t.value2?t.value&&ye(t.value2)<ye(t.value)?"Second value must be greater than or equal to first value":!0:"Please enter a second value",Ie=t=>(t.values?.length||0)>0?!0:"Please enter at least 1 value",Ye=t=>{const n=S(t);if(n!==!0)return n;if(!t.value)return"Please enter a value";const r=ye(t.value);return isNaN(r)?"Invalid number":r<-1e4||r>1e4?"Cannot be greater than 10,000":!0},Ke={[_.ABSOLUTE_EQ]:{name:"on",nameSuffix:"a specific date",validate:S,diffText:t=>`on ${ue(t.value)}`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"on")," ",e.createElement("span",{className:"nowrap text-bold"},ue(t.value))),Form:Ge},[_.ABSOLUTE_GT]:{name:"after",nameSuffix:"a specific date",validate:S,diffText:t=>`after ${ue(t.value)}`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"after")," ",e.createElement("span",{className:"nowrap text-bold"},ue(t.value))),Form:Ge},[_.ABSOLUTE_LT]:{name:"before",nameSuffix:"a specific date",validate:S,diffText:t=>`before ${ue(t.value)}`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"before")," ",e.createElement("span",{className:"nowrap text-bold"},ue(t.value))),Form:Ge},[_.AND]:{name:"and",diffText:()=>"and",Preview:ke("Preview"),Form:ke("Form")},[_.BETWEEN]:{name:"is between",nameSuffix:"... and ...",validate:t=>({value:S(t),value2:Cr(t)}),diffText:t=>`is between ${t.value} and ${t.value2}`,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)),Form:t=>e.createElement(e.Fragment,null,e.createElement("div",{className:"d-flex mdh-8 align-center"},e.createElement(et,{...t}),e.createElement("div",null,"and"),e.createElement(et,{...t,field:"value2"})),e.createElement("div",{className:"text-secondary mt-8 text-sm"},"Both are included"))},[_.CONTAINS]:{name:"contains",nameSuffix:"...",validate:S,diffText:t=>`contains ${t.value||""}`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"contains")," ",e.createElement("b",null,t.value)),Form:be},[_.EMPTY]:{name:"is empty",diffText:()=>"is empty",Preview:()=>e.createElement("span",{className:"text-secondary"},"is empty"),Form:null},[_.ENDS_WITH]:{name:"ends with",nameSuffix:"...",validate:S,diffText:t=>`ends with ${t.value||""}`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"ends with")," ",e.createElement("b",null,t.value)),Form:be},[_.EQ]:{name:"is",nameSuffix:"...",validate:t=>t.dataType===we.RANDOM_AB?t.value&&["A","B"].includes(t.value)?!0:"Select A or B":S(t),diffText:t=>`is ${t.value||""}`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is")," ",e.createElement("b",null,t.dataType===we.FLOW&&t.value?e.createElement(_t,{id:t.value}):t.value)),Form:G},[_.EXCLUDES_ALL]:{name:"does not include all of",nameSuffix:"...",validate:Ie,diffText:t=>Oe(t,"does not include","all of"),Preview:({condition:t})=>Le(t,"does not include","all of"),Form:Fe},[_.EXCLUDES_ANY]:{name:"does not include at least one of",nameSuffix:"...",validate:Ie,diffText:t=>Oe(t,"does not include","at least one of"),Preview:({condition:t})=>Le(t,"does not include","at least one of"),Form:Fe},[_.FALSE]:{name:"is false",diffText:()=>"is false",Preview:()=>e.createElement("span",{className:"text-secondary"},"is false"),Form:null},[_.GT]:{name:"is greater than",nameSuffix:"...",validate:S,diffText:t=>`is greater than ${t.value}`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is greater than")," ",e.createElement("b",null,t.value)),Form:G},[_.GTE]:{name:"is greater than or equal to",nameSuffix:"...",validate:S,diffText:t=>`is greater than or equal to ${t.value}`,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)),Form:G},[_.INCLUDES_ALL]:{name:"includes all of",nameSuffix:"...",validate:Ie,diffText:t=>Oe(t,"includes","all of"),Preview:({condition:t})=>Le(t,"includes","all of"),Form:Fe},[_.INCLUDES_ANY]:{name:"includes at least one of",nameSuffix:"...",validate:Ie,diffText:t=>Oe(t,"includes","at least one of"),Preview:({condition:t})=>Le(t,"includes","at least one of"),Form:Fe},[_.LT]:{name:"is less than",nameSuffix:"...",validate:S,diffText:t=>`is less than ${t.value}`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is less than")," ",e.createElement("b",null,t.value)),Form:G},[_.LTE]:{name:"is less than or equal to",nameSuffix:"...",validate:S,diffText:t=>`is less than or equal to ${t.value}`,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)),Form:G},[_.NE]:{name:"is not",nameSuffix:"...",validate:S,diffText:t=>`is not ${t.value||""}`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"is not")," ",e.createElement("b",null,t.dataType===we.FLOW&&t.value?e.createElement(_t,{id:t.value}):t.value)),Form:G},[_.NOT_CONTAINS]:{name:"does not contain",nameSuffix:"...",validate:S,diffText:t=>`does not contain ${t.value||""}`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"does not contain")," ",e.createElement("b",null,t.value)),Form:be},[_.NOT_EMPTY]:{name:"has any value",diffText:()=>"has any value",Preview:()=>e.createElement("span",{className:"text-secondary"},"has any value"),Form:null},[_.NOT_REGEX]:{name:"does not match regular expression",nameSuffix:"...",validate:S,diffText:t=>`does not match ${t.value||""}`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"does not match")," ",e.createElement("b",null,t.value)),Form:G},[_.OR]:{name:"or",diffText:()=>"or",Preview:ke("Preview"),Form:ke("Form")},[_.REGEX]:{name:"matches regular expression",nameSuffix:"...",validate:S,diffText:t=>`matches ${t.value||""}`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"matches")," ",e.createElement("b",null,t.value)),Form:G},[_.RELATIVE_EQ]:{name:"exactly",nameSuffix:"... days ago",validate:Ye,diffText:t=>`exactly ${ce(t.value)} ago`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"exactly")," ",e.createElement("span",{className:"nowrap text-bold"},ce(t.value))," ",e.createElement("span",{className:"text-secondary"},"ago")),Form:ze},[_.RELATIVE_GT]:{name:"less than",nameSuffix:"... days ago",validate:Ye,diffText:t=>`less than ${ce(t.value)} ago`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"less than")," ",e.createElement("span",{className:"nowrap text-bold"},ce(t.value))," ",e.createElement("span",{className:"text-secondary"},"ago")),Form:ze},[_.RELATIVE_LT]:{name:"more than",nameSuffix:"... days ago",validate:Ye,diffText:t=>`more than ${ce(t.value)} ago`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"more than")," ",e.createElement("span",{className:"nowrap text-bold"},ce(t.value))," ",e.createElement("span",{className:"text-secondary"},"ago")),Form:ze},[_.STARTS_WITH]:{name:"starts with",nameSuffix:"...",validate:S,diffText:t=>`starts with ${t.value||""}`,Preview:({condition:t})=>e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"starts with")," ",e.createElement("b",null,t.value)),Form:be},[_.TRUE]:{name:"is true",diffText:()=>"is true",Preview:()=>e.createElement("span",{className:"text-secondary"},"is true"),Form:null},[_.URL]:{name:"matches URL pattern",nameSuffix:"...",validate:t=>Zn(t.urlPattern),diffText:t=>{const{urlPattern:n}=t;if(!n)return"matches MISSING PATTERN";const{includes:r,excludes:a}=n,s=[];return r.length>0&&s.push("matches "+r.join(", ")),a.length>0&&s.push("does not match "+a.join(", ")),s.join(" and ")},Preview:({condition:t})=>{const{urlPattern:n}=t;if(!n)return e.createElement("span",{className:"text-secondary"},"matches ...");const{includes:r,excludes:a}=n;return e.createElement(e.Fragment,null,r.length>0&&e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"matches")," ",r.map((s,o)=>e.createElement(e.Fragment,{key:o},o>0&&e.createElement("span",{className:"text-secondary"},", "),e.createElement("b",null,s)))),r.length>0&&a.length>0&&e.createElement("span",{className:"text-secondary"}," and "),a.length>0&&e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},"does not match")," ",a.map((s,o)=>e.createElement(e.Fragment,{key:o},o>0&&e.createElement("span",{className:"text-secondary"},", "),e.createElement("b",null,s)))))},Form:null}};function ce(t){if(!t)return"days";const n=ye(t);return isNaN(n)?"days":n+" "+(n===1?"day":"days")}function ue(t){if(!t)return"";const n=Mt(t);return n?Ce(n,"PP"):""}const _t=({id:t})=>{const{data:n,error:r}=Ft(_r,{variables:{flowId:t}});if(r)return e.createElement(Vt,{error:r});const a=n?.flow;return e.createElement(e.Fragment,null,a?e.createElement(e.Fragment,null,e.createElement("span",null,t)," (",a.name,")"):"Loading...")};function ke(t){return({condition:n})=>{throw new Error(`conditionOperators.${n.operator}.${t} is not supported`)}}function Oe(t,n,r){const a=t.values||[];return n+(a.length>1?" "+r:"")+" "+a.join(", ")}function Le(t,n,r){const a=t.values||[];return e.createElement(e.Fragment,null,e.createElement("span",{className:"text-secondary"},n+(a.length>1?" "+r:""))," ",a.map((s,o)=>e.createElement(e.Fragment,{key:o},o>0&&e.createElement("span",{className:"text-secondary"},", "),e.createElement("b",{key:o},s))))}const Ht=i.createContext(void 0),W=()=>i.useContext(Ht),Bt=i.createContext(null),ot=()=>i.useContext(Bt),Wt=i.createContext({debuggerClientConditions:new Map,meta:void 0,buildId:void 0}),Ne=()=>i.useContext(Wt),Me={verifySetup:{name:"Verify setup",icon:Q},checkAutoStart:{name:"Check auto-start",icon:mn},currentUser:{name:"Current user",icon:rt}},qt=i.createContext(void 0),Nr=({children:t})=>{const n=te(),[r,a]=i.useState(n.getSessionStorageState().debuggerApp?.selectedTab??"verifySetup");return i.useEffect(()=>{n.setSessionStorageState(s=>!s.debuggerApp||!s.debuggerApp.x?s:{...s,debuggerApp:{...s.debuggerApp,selectedTab:r}}),tt("Debugger Route changed to",r)},[r]),e.createElement(qt.Provider,{value:{debuggerRoute:r,setDebuggerRoute:a}},t)},lt=()=>{const t=i.useContext(qt);if(t===void 0)throw new Error("useDebuggerRouteHandler must be used within a DebuggerRouteProvider");return{debuggerRoute:t.debuggerRoute,setDebuggerRoute:t.setDebuggerRoute}},xr=t=>{const n=i.useRef(null),r=ot();return i.useEffect(()=>{const a=r?.current,s=o=>{n.current&&!n.current.contains(o.target)&&t(o)};return document.addEventListener("mousedown",s),a?.contentDocument?.addEventListener("mousedown",s),()=>{document.removeEventListener("mousedown",s),a?.contentDocument?.removeEventListener("mousedown",s)}},[t,r,n]),n},Sr=()=>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"})),Tr={CLICK:Ct,DISABLED:K,MOUSEDOWN:pn,NOT_CLICK:sr,NOT_DISABLED:Q,NOT_PRESENT:Nt,PRESENT:at},Dr={COMPLETED:Q,NOT_COMPLETED:K,NOT_SEEN:Nt,ACTIVE:fn,NOT_ACTIVE:gn,SEEN:at},Fr={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 Ir(t){return Fr[t]}const kr={COMPLETED:"completed",NOT_COMPLETED:"not completed",NOT_SEEN:"not seen",ACTIVE:"is currently active",NOT_ACTIVE:"is not currently active",SEEN:"seen"};function Or(t){return kr[t]}function Lr(t,n){let r=(n||"").toLowerCase();return(t.eventTimeOperator===de.RELATIVE_BETWEEN?t.eventRelativeValue2:t.eventRelativeValue)!==1&&(r+="s"),t.eventTimeOperator!==de.RELATIVE_GT&&(r+=" ago"),r}function Mr(t){return(t.eventFrequencyOperator===ve.BETWEEN?t.eventFrequencyValue2:t.eventFrequencyValue)===1?"time":"times"}const Ar={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 Rr(t){return Ar[t]}function Pr(t){if(!t)return"";switch(t){case ve.BETWEEN:return"between";case ve.EQ:return"exactly";case ve.GTE:return"at least";case ve.LTE:return"at most"}}function Ur(t){if(!t)return"";switch(t){case de.ANY:return"at any point in time";case de.RELATIVE_BETWEEN:return"between";case de.RELATIVE_GT:return"in the last";case de.RELATIVE_LT:return"more than"}}const Vr={1:"Lowest",2:"Low",3:"Medium",4:"High",5:"Highest"};function Hr(t){return`${Vr[t]||String(t)} priority`}const it=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}),ct=t=>t===!0?Y:t===!1?K:J,$t=(t,n)=>{const r=W();return i.useMemo(()=>{const o=(n?r?.hiddenCondition?.breakdown:r?.startCondition?.breakdown)?.find(l=>l.conditionId===t.id);return{classes:it(o?.match),icon:ct(o?.match)}},[t,r,n])},Re=t=>{const{condition:n,isHideCond:r}=t,{classes:a,icon:s}=$t(n,r),o=n.type;if(o===M.CLAUSE)return e.createElement(Wr,{...t});const l=zt[o];return e.createElement("div",{className:b(a)},e.createElement("span",{className:"d-flex gap-8 align-center userflow-debugger-condition__item__icon"},l.icon?e.createElement(v,{icon:l.icon({condition:n})}):null,e.createElement(l.Preview,{...t})),e.createElement(v,{dataAttrs:{"data-condition-status":"true"},icon:s}))},Br=()=>{const t=W(),[n,r]=i.useState(!1),a=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:b({"d-flex gap-8 flex-column margin-8":!0,"userflow-debugger-condition__clause":!0,"userflow-debugger-hide-condition__clause__success":a?.match===!0,"userflow-debugger-hide-condition__clause__danger":a?.match===!1,"userflow-debugger-hide-condition__clause__expanded":n}),onClick:s=>{r(!n),s.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(v,{icon:fe})),n&&e.createElement(Re,{isRoot:!0,isHideCond:!0,condition:t?.hiddenCondition?.condition})):null},Wr=({condition:t,isRoot:n=!1,isHideCond:r=!1})=>{const[a,s]=i.useState(!1),{classes:o,icon:l}=$t(t,r);return n?e.createElement(e.Fragment,null,t.conditions.map((c,m)=>e.createElement(Re,{isHideCond:r,key:m,condition:c}))):e.createElement("div",{role:"button",className:b({"d-flex flex-column gap-8":!0,"userflow-debugger-condition__clause":a,...a?{"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=>{s(!a),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(v,{icon:Cn})," ",e.createElement("strong",null,"Logic Group")," ",e.createElement("span",{className:"userflow-debugger-info-text"},"Click to ",a?"collapse":"expand")),!a&&e.createElement(v,{dataAttrs:{"data-condition-status":"true"},icon:l})),a&&e.createElement(e.Fragment,null,t.conditions.map((c,m)=>e.createElement("div",{key:m,className:b({"userflow-debugger-condition__clause__operator__wrapper":!0})},m>0&&e.createElement("div",{className:b({"userflow-debugger-condition__clause__operator":!0})},e.createElement(Gt,{condition:t})),e.createElement(Re,{isHideCond:r,condition:c})))))},Gt=({condition:t})=>{const n=t.operator;return n?e.createElement("span",{className:b({"userflow-debugger-condition__item__operator":!0,"userflow-debugger-condition__item__operator__and":n===Ee.AND,"userflow-debugger-condition__item__operator__or":n===Ee.OR})},n===Ee.AND&&"AND",n===Ee.OR&&"OR"):null},qr={[q.NONE]:K,[q.PENDING_SCHEDULE]:K,[q.SCHEDULED]:J,[q.FIRED]:Y},$r=e.memo(()=>{const t=W(),{waitTimer:n}=t||{},r=t?.startCondition?.condition.waitTime,{ref:a,hovered:s,eventHandlers:o}=Ue();return!r||!n||n===q.NONE?null:e.createElement("div",{ref:a,...o,className:b({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__danger":n===q.PENDING_SCHEDULE,"userflow-debugger-condition__item__intermediate":n===q.SCHEDULED,"userflow-debugger-condition__item__success":n===q.FIRED})},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(v,{icon:hn}),e.createElement("span",null,"Wait ",e.createElement("strong",null,r)," seconds")),e.createElement(v,{dataAttrs:{"data-condition-status":"true"},icon:qr[n]}),e.createElement(Ve,{target:a,hovered:s&&n===q.PENDING_SCHEDULE},"Timer activates once all conditions are satisfied"))}),Gr=e.memo(()=>{const t=W(),[n,r]=i.useState(!1),{startFrequency:a,listFlowLatestVersion:s}=t||{startFrequency:{}};if(!a||!s?.startFrequency||s?.startFrequency===oe.NEVER)return null;const{currentFlowIntervalThrottle:o,frequency:l,frequencyUsage:c}=a,m=ct(l),E=it(l);if(s.startFrequency===oe.ONCE||s.startFrequency===oe.ONCE_PER_GROUP)return e.createElement("div",{className:b(E)},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(v,{icon:nt}),e.createElement("strong",null,"Once per user"," ",s.startFrequency===oe.ONCE_PER_GROUP&&"per company")),e.createElement(v,{dataAttrs:{"data-condition-status":"true"},icon:m}));if(s.startFrequency===oe.ALWAYS&&s.startIntervalValue&&s.startIntervalUnit)return e.createElement("div",{className:b({"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,s.startIntervalValue)," ",e.createElement("span",{className:"userflow-debugger-info-text"},Qe(s.startIntervalUnit,s.startIntervalValue)," ","apart")),e.createElement(v,{dataAttrs:{"data-condition-status":"true"},icon:o===!1?J:Y}));if(s.startFrequency===oe.MULTIPLE){const h=l===!0&&o===!0,p=l===!0&&o===!1,u=l===!1;return e.createElement("div",{className:b({"d-flex flex-column gap-8":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__clause":n,...n?{"userflow-debugger-condition-frequency__success__expanded":h,"userflow-debugger-condition-frequency__intermediate__expanded":p,"userflow-debugger-condition-frequency__danger__expanded":u}:{"userflow-debugger-condition-frequency__success":h,"userflow-debugger-condition-frequency__intermediate":p,"userflow-debugger-condition-frequency__danger":u}}),onClick:g=>{r(!n),g.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(v,{dataAttrs:{"data-condition-status":"true"},icon:h?Y:p?J:K})),n&&e.createElement(e.Fragment,null,e.createElement("div",{className:b(E)},e.createElement("span",null,e.createElement("strong",null,s.startLimit)," ",e.createElement("span",{className:"userflow-debugger-info-text"},"(started ",c," times)")),e.createElement(v,{dataAttrs:{"data-condition-status":"true"},icon:m})),s.startIntervalUnit&&s.startIntervalValue&&e.createElement("div",{className:b({"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,s.startIntervalValue)," ",e.createElement("span",{className:"userflow-debugger-info-text"},Qe(s.startIntervalUnit,s.startIntervalValue)," ","apart")),e.createElement(v,{dataAttrs:{"data-condition-status":"true"},icon:o===!1?J:Y}))))}return null}),zr=()=>{const t=W(),{priority:n}=t||{};return n?.priority?e.createElement("div",{className:b({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__priority":!0})},e.createElement("span",null,e.createElement("strong",null,Hr(n?.priority))," ",e.createElement("span",{className:"userflow-debugger-info-text"},"Click to learn more")),e.createElement("a",{href:"https://docs.userflow.com/docs/trouble/debugger#start-flow-conditions-priority-settings",target:"_blank",rel:"noreferrer noopener"},e.createElement(v,{icon:xt}))):null},Yr=()=>{const t=W(),{startFrequency:n}=t||{},{onlyIfNotCompleted:r}=n||{};return r==null?null:e.createElement("div",{className:b({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__success":r===!0,"userflow-debugger-condition__item__danger":r===!1})},"Only if not completed",e.createElement(v,{icon:r===!0?Y:K}))},Kr=()=>{const t=W(),{startFrequency:n}=t||{},{hovered:r,eventHandlers:a,ref:s}=Ue();return!n||n?.scopeByGroup===null||n.scopeByGroup===void 0||n.scopeByGroup===!0?null:e.createElement("div",{ref:s,...a,className:b({"d-flex align-center margin-8":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__danger":!0})},"Constrain to current company",e.createElement(v,{icon:ct(n.scopeByGroup)}),e.createElement(Ve,{target:s,hovered:r},"User is not associated with a company"))},jr=()=>{const t=W(),{startFrequency:n,listFlowLatestVersion:r}=t||{},{anyFlowIntervalThrottle:a}=n||{},{throttleUnit:s,throttleValue:o}=r||{};return a===null||s===null||o===null||s===void 0||o===void 0?null:e.createElement("div",{className:b({"d-flex align-center":!0,"userflow-debugger-condition__item":!0,"userflow-debugger-condition__item__success":a===!0,"userflow-debugger-condition__item__intermediate":a===!1})},e.createElement("span",null,"Atleast ",e.createElement("strong",null,r?.throttleValue)," ",Qe(s,o)," after any flow"),e.createElement(v,{dataAttrs:{"data-condition-status":"true"},icon:a===!0?Y:J}))},Xr=e.memo(()=>{const{hovered:t,eventHandlers:n,ref:r}=Ue(),a=W(),{snoozed:s}=a||{},o=i.useMemo(()=>{if(s?.until)return Ce(new Date(s.until),"MMM do, h:mm a")},[s?.until]);return s?e.createElement("div",{ref:r,...n,className:b({"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(v,{icon:En}),e.createElement("span",null,"This flow is currently ",e.createElement("strong",null,"snoozed"))),e.createElement(v,{dataAttrs:{"data-condition-status":"true"},icon:J}),e.createElement(Ve,{target:r,hovered:t},"Snoozed until ",o)):null}),zt={[M.PAGE]:{icon:()=>vn,Preview:({condition:t})=>{const n=t.operator&&Ke[t.operator];return e.createElement("span",null,"URL"," ",e.createElement("strong",null,n&&e.createElement(n.Preview,{condition:t})))}},[M.ATTRIBUTE]:{icon:({condition:t})=>{if(!t||!t.attributeName)return wt(B.EVENT);const[n]=lr(t.attributeName);return wt(n)},Preview:({condition:t})=>{const n=t.operator&&Ke[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})))}},[M.SEGMENT]:{icon:()=>bn,Preview:({condition:t})=>{const{segment:n}=t;return e.createElement("span",null,e.createElement("strong",null,n?.subjectType===jt.GROUP?"Company":"User")," ",e.createElement("span",{className:"text-secondary"},t.operator===Ee.FALSE?"is not in":"is in")," ",e.createElement("strong",null,n?.name||"Segment"))}},[M.ELEMENT]:{icon:({condition:t})=>t.elementState?Tr[t.elementState]:wn,Preview:({condition:t})=>e.createElement("span",null,"Element"," ",t.elementState&&e.createElement("strong",null,Ir(t.elementState)))},[M.INPUT_VALUE]:{icon:()=>_n,Preview:({condition:t})=>{const n=t.operator&&Ke[t.operator];return e.createElement("span",null,"The value of input"," ",e.createElement("strong",null,n&&e.createElement(n.Preview,{condition:t})))}},[M.FILLED_IN_INPUT]:{icon:()=>yn,Preview:()=>e.createElement("span",null,"User fills an input")},[M.FLOW]:{icon:({condition:t})=>t.flowState?Dr[t.flowState]:at,Preview:({condition:t})=>e.createElement("span",null,t.flow?e.createElement(e.Fragment,null,Rt(t.flow.type,{title:!0})," ",e.createElement("strong",null,t.flow.name)):"Flow/checklist"," ",t.flowState&&Or(t.flowState))},[M.TIME]:{icon:()=>nt,Preview:({condition:t})=>{const n=t.value?bt(t.value):null,r=n&&e.createElement("strong",{style:{whiteSpace:"nowrap"}},pe(n)),a=t.value2?bt(t.value2):null,s=a&&e.createElement("strong",{style:{whiteSpace:"nowrap"}},pe(a));return r&&s?e.createElement("span",null,"Current time is between ",r," and ",s):r?e.createElement(e.Fragment,null,"Current time is after ",r):s?e.createElement(e.Fragment,null,"Current time is before ",s):e.createElement(e.Fragment,null,"Current time is ...")}},[M.EVENT]:{icon:()=>yt,Preview:({condition:t})=>{const{ref:n,hovered:r,eventHandlers:a}=Ue();return e.createElement("div",{ref:n,...a},e.createElement("strong",null,t.eventDisplayName?t.eventDisplayName:"Event")," ",e.createElement("span",{className:"userflow-debugger-info-text"},Pr(t.eventFrequencyOperator))," ",e.createElement("strong",null,t.eventFrequencyValue),t.eventFrequencyOperator===Xt.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"},Mr(t),","," ",Ur(t.eventTimeOperator)),t.eventTimeOperator!==ut.ANY&&e.createElement(e.Fragment,null," ",e.createElement("strong",null,t.eventRelativeValue),t.eventTimeOperator===ut.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"},Lr(t,t.eventRelativeUnit))),t.eventActor&&t.eventActor!==Zt.CURRENT_USER?e.createElement(e.Fragment,null," ",e.createElement("strong",null,Rr(t.eventActor))):"",t.whereCondition&&r&&e.createElement(Ve,{hovered:!0,target:n},"Where ",e.createElement("br",null),e.createElement(Yt,{condition:t.whereCondition})))}},[M.ALWAYS_TRUE]:{icon:()=>Y,Preview:()=>e.createElement("span",null,"Water is wet")},[M.CHECKLIST_TASK_CLICKED]:{icon:()=>Ct,Preview:()=>e.createElement("span",null,"Task is clicked")}},Yt=t=>e.createElement("div",null,t.condition.conditions.map((n,r)=>e.createElement("div",{key:n.id}," ",r===0?null:e.createElement("span",{className:"userflow-debugger-info-text"},t.condition.operator?.toLowerCase())," ",n.type==="ATTRIBUTE"&&zt.ATTRIBUTE.Preview({condition:n,isRoot:!0,isHideCond:!1}),n.type==="CLAUSE"&&e.createElement(e.Fragment,null,"(",e.createElement(Yt,{condition:n}),")")))),Ve=({hovered:t,children:n,target:r})=>{const a=ot();return t?e.createElement(Pe,{className:"userflow-debugger-popover",target:r.current,placement:"top",horizontalAlign:"center",verticalAlign:"center",document:a?.current?.contentDocument||void 0},n):null},Zr=({selectedFlow:t,setSelectedFlow:n,flows:r,debugAutoStartCondition:a})=>{const s=te(),o=ot();i.useEffect(()=>{if(!t)return;a(t.latestVersion);const c=()=>{a(t.latestVersion)};return s.on("private:checkSessionsAck",c),document.addEventListener("visibilitychange",c),()=>{s.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(Je,{className:"userflow-debugger__flow__selector",value:t,options:r,placeholder:"Select flow",document:o?.current?.contentDocument||void 0,onChange:l,renderOptionItem:c=>c.name})),e.createElement(Qr,{selectedFlow:t,selectedFlowVersionsId:t?.latestVersion?.id}))},Qr=({selectedFlowVersionsId:t,selectedFlow:n})=>{const r=te(),[a,s]=i.useState(!1),o=W(),l=o?.activeFlow?.id===n?.id;return i.useEffect(()=>(s(!1),r.on("private:setFlowSession",c=>{s(c===t)}),()=>{r.off("private:setFlowSession",()=>s(!1))}),[t]),i.useEffect(()=>{l||s(!1)},[l]),o?.activeFlow===null?null:e.createElement(e.Fragment,null,o?.locale?.match===!1&&e.createElement("div",{className:b(it(!1))},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(v,{icon:K}),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.")))),a?e.createElement("div",{className:b({"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(v,{icon:fe}),e.createElement("span",null,"This flow ",e.createElement("strong",null,"just")," started"))):null,l&&!a&&e.createElement("div",{className:b({"userflow-debugger-condition__item":!0,"userflow-debugger-condition__flow__status":!0})},e.createElement("span",{className:"d-flex align-center gap-8"},e.createElement(v,{icon:fe}),e.createElement("span",null,"This flow is currently active"))),!l&&e.createElement("div",{className:b({"userflow-debugger-condition__item":!0,"userflow-debugger-condition__flow__status":!0})},e.createElement("span",{className:"d-flex gap-8 align-center"},e.createElement(v,{icon:fe,size:16}),e.createElement("span",null,"Another flow is currently active"))))},Jr=({close:t})=>{const n=te(),r=i.useRef(null),[a,s]=i.useState(()=>{const d=n.getSessionStorageState(),w=d?.debuggerApp?.x,y=d?.debuggerApp?.y||100;return{x:w??(document.body.clientWidth?Number(document.body.clientWidth)-500:100),y}}),[o,l]=i.useState(!1),c=i.useRef(null),{meta:m}=Ne(),{debuggerRoute:E}=lt(),[h,p]=i.useState(!1),u=i.useRef(null),g=i.useRef({mouseX:0,mouseY:0,elementX:0,elementY:0});i.useEffect(()=>{a&&n.setSessionStorageState(d=>({...d,debuggerApp:{...d.debuggerApp,x:a.x,y:a.y}}))},[a]),i.useEffect(()=>{if(!o)return;const d=y=>{const x=y.clientX-g.current.mouseX,T=y.clientY-g.current.mouseY,A=g.current.elementX+x,D=g.current.elementY+T;u.current||(u.current=requestAnimationFrame(()=>{s({x:A,y:D}),u.current=null}))},w=()=>{l(!1)};return document.addEventListener("mousemove",d),document.addEventListener("mouseup",w),()=>{document.removeEventListener("mousemove",d),document.removeEventListener("mouseup",w),u.current&&(cancelAnimationFrame(u.current),u.current=null)}},[o,a]),i.useEffect(()=>{const d=()=>{s(w=>{const y=document.body.clientWidth-500,x=document.body.clientHeight-100,T=Math.min(w.x,y),A=Math.min(w.y,x);return{x:T,y:A}})};return window.addEventListener("resize",d),()=>{window.removeEventListener("resize",d)}},[]);const C=d=>{r.current&&(l(!0),d.preventDefault())};return e.createElement("div",{ref:r,style:{left:"0",top:"0",position:"absolute",transform:`translate3d(${a.x}px, ${a.y}px, 0)`,zIndex:1234620}},e.createElement("div",{onMouseDown:C,style:{height:"50px",cursor:"move",userSelect:"none",position:"absolute",width:"50px"}}),e.createElement(en,{title:"Debugger",stylesheet:Rn,style:{borderRadius:"8px",width:"400px",height:E==="checkAutoStart"?"600px":"500px"},elRef:c,onStylesheetsLoad:p},e.createElement(Bt.Provider,{value:c},e.createElement("div",{className:"d-flex flex-column userflow-debugger-app",style:{visibility:h?"visible":"hidden"}},e.createElement("div",{className:"d-flex justify-space-between userflow-debugger-app__header"},e.createElement(Sr,null),e.createElement("div",{className:"d-flex align-center userflow-debugger-app__title"},e.createElement(tn,null),e.createElement("span",null,"Userflow debugger")),e.createElement("button",{role:"button",className:"userflow-debugger-app__close",onClick:()=>{n.getSessionStorageState().debuggerApp&&n.setSessionStorageState(d=>({...d,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(ea,null),E==="verifySetup"&&e.createElement(ta,null),m?.endUser?.debuggerEnabled&&E==="checkAutoStart"&&e.createElement(na,null),E==="currentUser"&&e.createElement(ra,null)))))},ea=()=>{const t=te(),{meta:n}=Ne(),[r,a]=i.useState(!1),{debuggerRoute:s,setDebuggerRoute:o}=lt(),l=t.isIdentified(),c=xr(()=>a(!1));return i.useEffect(()=>{n&&n?.endUser.debuggerEnabled===!1&&s==="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:()=>a(!r)},e.createElement("div",{className:b({"d-flex align-center":!0,"userflow-debugger-menu__title":!0,"userflow-debugger-menu__title--open":r})},e.createElement(v,{icon:Me[s].icon}),e.createElement("span",null,Me[s].name)),e.createElement("button",{className:"userflow-debugger-menu__toggle"},e.createElement(v,{icon:Nn}))),r&&e.createElement("ul",{className:"userflow-debugger-menu__list"},Object.keys(Me).map(m=>{if(!n?.endUser?.debuggerEnabled&&m==="checkAutoStart")return null;const E=Me[m];return e.createElement("li",{key:m,className:"d-flex align-center userflow-debugger-app__item",onClick:()=>{o&&o(m),a(!1)}},e.createElement(v,{icon:E.icon}),E.name)}))):null},ta=()=>{const{meta:t,buildId:n}=Ne(),r=te(),[a,s]=i.useState(!!r.clientToken),o=i.useMemo(()=>t?r.isIdentified():!1,[r,t]),{setDebuggerRoute:l}=lt();i.useEffect(()=>{const h=()=>{s(!!r.clientToken)};return r.on("private:initialised",h),()=>{r.off("private:initialised",h)}},[]);const c=i.useMemo(()=>{let h=Be;const p={"d-flex flex-column gap-8":!0,"userflow-debugger-installation__step":!0};return a?(h=Q,p["userflow-debugger-installation__step__success"]=!0):(h=Dn,p["userflow-debugger-installation__step__danger"]=!0),{icon:h,classes:p}},[a]),m=i.useMemo(()=>{let h=Be;const p={"d-flex flex-column gap-8":!0,"userflow-debugger-installation__step":!0};return!a&&!o&&(h=Be,p["userflow-debugger-installation__step__failed"]=!0),a&&!o&&(h=fe,p["userflow-debugger-installation__step__warning"]=!0),a&&o&&(h=Q,p["userflow-debugger-installation__step__success"]=!0),{icon:h,classes:p}},[a,o]),E=()=>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:b({"d-flex gap-8 flex-column":!0,"userflow-debugger-installation__step":!0,"userflow-debugger-installation__step__success":!0})},e.createElement(v,{icon:Q,size:32}),"Userflow ",e.createElement("br",null),"installed"),e.createElement("div",{className:b(c.classes)},e.createElement(v,{icon:c.icon,size:32}),"Userflow ",e.createElement("br",null)," ",a?"":"not"," initialized"),e.createElement("div",{className:b(m.classes)},e.createElement(v,{icon:m.icon,size:32}),"User ",e.createElement("br",null)," ",o&&a?"":"not"," ","identified")),!a&&!o&&e.createElement("div",{className:b({"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')")),a&&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 space-evenly"},e.createElement(v,{size:20,icon:xn}),e.createElement(v,{size:20,icon:Sn})),e.createElement("div",{className:"d-flex flex-column align-flex-start gap-8"},E())),e.createElement("div",{className:"d-flex gap-8 align-center"},e.createElement(v,{size:20,icon:Tn}),e.createElement("span",{className:"userflow-debugger-details"},r.getInitToken())),e.createElement("div",{className:"d-flex gap-8 align-center"},e.createElement(v,{size:20,icon:rt}),e.createElement("span",{className:"userflow-debugger-details"},o?r.getIdentifiedUser()?.externalId:"User not identified"))),e.createElement("div",{className:"userflow-debugger-installation__version"},e.createElement("a",{href:"https://docs.userflow.com/docs/dev/userflow-js-installation",target:"_blank",rel:"noreferrer"},"Visit the Userflow Developer Docs for help")," ",e.createElement("br",null),"Userflow.js version 0.1.",n))},na=()=>{const t=te(),{debuggerClientConditions:n}=Ne(),[r,a]=i.useState(void 0),[s,o]=i.useState([]),[l,c]=i.useState(),m=i.useMemo(()=>{if(l?.startCondition?.match===!1||l?.hiddenCondition?.match===!1||l?.locale?.match===!1)return!1;const g=l?.startFrequency;return!(g&&(g.onlyIfNotCompleted===!1||g.scopeByGroup===!1||g.frequency===!1))},[l]);i.useEffect(()=>(u().then(g=>{if(g?.length&&(o(g),!r)){const C=t.getSessionStorageState()?.debuggerApp?.selectedFlowVersionId,d=g.find(w=>w.latestVersion.id===C);h(d??g[0])}}),document.addEventListener("visibilitychange",u),()=>{document.removeEventListener("visibilitychange",u)}),[]),i.useEffect(()=>{r&&p(r.latestVersion)},[r]);const E=Dt.debounce(async g=>{const C=[];for(const[y,x]of n.entries())C.push({conditionId:y,isTrue:x.isTrue});const d={kind:"DebugFlowAutostartCondition",flowVersionId:g.id,clientConditions:C},w=await t.send(d);c({...w,listFlowLatestVersion:g}),w.latestVersion?.id&&g.id!==w.latestVersion?.id&&(u().then(y=>{if(!y)return;o(y);const x=y?.find(T=>T.latestVersion.id===w.latestVersion?.id);x&&h(x)}),E(w.latestVersion))},300),h=g=>{a(g);const C=t.getSessionStorageState().debuggerApp;C&&C?.x&&t.setSessionStorageState(d=>({...d,debuggerApp:{...C,selectedFlowVersionId:g.latestVersion.id}}))},p=async g=>{n.forEach(d=>{d.untrack?.()}),n.clear();const{conditionTypes:C}=await Qt(async()=>{const{conditionTypes:d}=await import("./flow-condition-types.js").then(w=>w.f);return{conditionTypes:d}},__vite__mapDeps([0,1,2,3,4,5,6,7,8,9,10,11,12,13]));for(const d of g.clientConditions){n.set(d.id,{condition:d,isTrue:null});const w=C[d.type];if(!w){console.error(`Unknown condition type ${d.type}`);continue}const y=n.get(d.id);y&&(y.untrack=w.track({sessionData:new Jt([]),condition:d,callback:x=>{y.isTrue!==x&&(y.isTrue=x,E(g))}}))}},u=async()=>{try{return(await t.send({kind:"ListFlows",hasAutostartCondition:!0},{handlesRejection:!0})).flows?.filter(d=>d.type==="FLOW")}catch(g){g.code==="debugger_access_denied"&&tt("Access defined for List Flows");return}};return e.createElement("div",{className:"userflow-debugger-app__content"},e.createElement(Ht.Provider,{value:l},e.createElement(Zr,{flows:s,selectedFlow:r,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:b({"d-flex gap-8 align-center":!0,"userflow-debugger-app__wrapper__passing":m,"userflow-debugger-app__wrapper__failed":!m})},e.createElement(v,{icon:m?Fn:In}),e.createElement("strong",null,"Auto-start conditions")),e.createElement("span",null,"These are"," ",e.createElement(Gt,{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(Re,{isRoot:!0,isHideCond:!1,condition:l.startCondition.condition}),e.createElement($r,null),e.createElement(Gr,null),e.createElement(Yr,null),e.createElement(jr,null),e.createElement(zr,null),e.createElement(Br,null),e.createElement(Kr,null),e.createElement(Xr,null))))},ra=e.memo(()=>{const{meta:t,buildId:n}=Ne();if(!t)return null;const r="https://app.userflow.com/app/"+t.env.company.slug+"/settings/debugger?external_id="+t.endUser.externalId;return e.createElement("div",{className:"d-flex flex-column space-evenly flex-1"},e.createElement("div",{className:"d-flex flex-column gap-8"},e.createElement("div",{className:"d-flex flex-column"},t.endUser.avatarUrl?e.createElement("img",{src:t.endUser.avatarUrl,className:"userflow-debugger-user__image"}):e.createElement("div",{className:"userflow-debugger-user__image"}),e.createElement("span",{className:"userflow-debugger-user__name"},t.endUser?.name||"Unknown name"),e.createElement("span",{className:"userflow-debugger-user__email"},t?.endUser?.email||"Unknown email address"),(!t.endUser.email||!t.endUser.name)&&e.createElement("span",{className:"userflow-debugger__external__id"},t.endUser.externalId)),!t.endUser.debuggerEnabled&&e.createElement(e.Fragment,null,e.createElement("div",{className:"userflow-debugger-user__info"},"This user doesn't have access to the Userflow debugger. You can grant access through the debugger settings in Userflow."),e.createElement("a",{className:"userflow-debugger-user__button",href:r,target:"_blank",rel:"noreferrer"},"Grant access in Userflow ",e.createElement(v,{icon:xt})))),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 Qa{constructor(n,r){this.client=n,this.buildId=r,this.debuggerClientConditions=new Map}mount(){if(this.container)throw new Error("UI has already been mounted");this.container=document.createElement("div"),this.container.id="userflow-debugger-ui",document.body.appendChild(this.container),je.render(e.createElement(aa,{client:this.client,debuggerClientConditions:this.debuggerClientConditions,buildId:this.buildId,unmount:()=>this.unmount()}),this.container)}unmount(){this.container&&(je.unmountComponentAtNode(this.container),document.body.contains(this.container)&&document.body.removeChild(this.container),this.client.unMountDebugger(),delete this.container)}}const aa=({client:t,debuggerClientConditions:n,buildId:r,unmount:a})=>{const[s,o]=i.useState(void 0),l=Dt.debounce(async()=>{try{const c=await t.send({kind:"GetCurrentEndUser"},{handlesRejection:!0});o(c)}catch(c){c.code==="debugger_access_denied"&&tt("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(Kt.Provider,{value:t},e.createElement(Wt.Provider,{value:{meta:s,debuggerClientConditions:n,buildId:r}},e.createElement(Nr,null,e.createElement(Jr,{close:a}))))};export{Qa as DebuggerUI};
|
|
4
|
+
//# 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,
|
|
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,d as ne,e 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{v 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.absinthe.socket.js";import"./vendor.object-assign.js";import"./vendor.core-js.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.jumpn.utils-composite.js";import"./vendor.babel-runtime.js";import"./vendor.jumpn.utils-array.js";import"./vendor.flow-static-land.js";import"./vendor.jumpn.utils-graphql.js";import"./vendor.zen-observable.js";import"./vendor.i18next.js";import"./vendor.react-i18next.js";import"./vendor.babel.runtime.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"./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]="3d7be5db-dad4-49dc-b713-a2fd920ec231",p._sentryDebugIdIdentifier="sentry-dbid-3d7be5db-dad4-49dc-b713-a2fd920ec231")}catch{}})();const ye=_("alt+s"),Ee=_("escape"),Re=_("u"),tt=({state:p})=>{const{mode:n,elementType:u}=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,m=h;for(;m;){{const x=m.getBoundingClientRect();if(x.width===0&&x.height===0){m=O(m);continue}}if(f=we(m,{elementType:u}),f)break;m=O(m)}f?(t=f.el,e=f.selector):u===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,m=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),m=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),m=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=`${m}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 me=()=>{window.cancelAnimationFrame(N),N=window.requestAnimationFrame(q)},z=()=>{me()},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 ue=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"),ue()};return K},[I,g,n,A,u,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"," ",u===U.INPUT?"a text input":"an element"," ","to focus. Tap again to select."):o.createElement(o.Fragment,null,"Click"," ",u===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 u=ge(n);return u||null}return n}function se(){return window.navigator.userAgent.includes("Mobile")}export{tt as ElementSelectionApp,tt 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{
|
|
1
|
+
import{r as o,R as l}from"./vendor.react.js";import{G as m,E as K}from"./userflow.js";import{u as P,i as k}from"./client-context.js";import{o as M}from"./vendor.obj-str.js";import{u as U,a as Y,g as q,D as G}from"./stylesheets.js";import{n as Z}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{u as J,S as Q,b as V}from"./use-selector-element-monitoring.js";import{w as X,f as ee}from"./flow-host.styl.js";import{r as te}from"./vendor.react-dom.js";import{F as re}from"./Frame.js";import{h as d}from"./roots.js";import{u as ne}from"./use-element-rect.js";import{C as oe}from"./ChecklistUI.js";import"./vendor.absinthe.socket.js";import"./vendor.object-assign.js";import"./vendor.core-js.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.jumpn.utils-composite.js";import"./vendor.babel-runtime.js";import"./vendor.jumpn.utils-array.js";import"./vendor.flow-static-land.js";import"./vendor.jumpn.utils-graphql.js";import"./vendor.zen-observable.js";import"./vendor.i18next.js";import"./vendor.react-i18next.js";import"./vendor.babel.runtime.js";import"./vendor.fortawesome.pro-solid-svg-icons.js";import"./flow-condition-types.js";import"./vendor.date-fns.js";import"./vendor.scheduler.js";import"./use-window-resize.js";(function(){try{var r=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},a=new Error().stack;a&&(r._sentryDebugIds=r._sentryDebugIds||{},r._sentryDebugIds[a]="12d91ca1-7a81-49ec-a0a1-4b0c1919c3cb",r._sentryDebugIdIdentifier="sentry-dbid-12d91ca1-7a81-49ec-a0a1-4b0c1919c3cb")}catch{}})();const Be=({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,ee,y),[F,I]=o.useState(!1),h=D&&F,[A,_]=o.useState(0),j=o.useCallback(()=>{I(!1),_(n=>n+1)},[]),E=![m.BODY_FIRST,m.BODY_LAST].includes(t.embedMode),[f,x]=o.useState(null),B=o.useCallback(({targetEl:n})=>{x(n)},[]),O=o.useCallback(()=>{E&&console.warn(`Userflow.js: Could not find embed element for banner "${r.flow.name||r.flow.id}"`),x(null)},[E,r.flow.name,r.flow.id]);J({selector:t.embedSelector,targetMoved:B,targetLost:O});const[T,$]=o.useState(!1),c=o.useCallback(()=>{const n=e.current;n&&n.parentElement&&(n.parentElement.removeChild(n),v(!1))},[e]),W=o.useCallback(()=>{r.kind==="embed"&&($(!0),p.endFlow(r,{endReason: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 g=n=>M({"userflowjs-embed":!0,[`userflowjs-embed--embed-mode-${t.embedMode}`]:!0,[`userflowjs-embed--animate-${String(t.animate)}`]:n&&t.animate});o.useLayoutEffect(()=>{e.current&&(e.current.className=g(!1))},[e,t.embedMode,t.animate]);const w=t.zIndex||X(0);o.useLayoutEffect(()=>{e.current&&(e.current.style.zIndex=w==null?"":String(w),e.current.style.position=h?"":"absolute",e.current.style.visibility=h?"":"hidden")},[e,w,h]);const{height: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(G,{icon:Z}))),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=g(t.animate)):(e.current.style.height="0px",e.current.className=g(!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(Q.Provider,{value:r},l.createElement(re,{key:A,className:"userflowjs-embed-frame",style:{maxWidth:t.maxWidth?d(t.maxWidth):"100%",width:"100%",height:r.version.embed?.blocks?.length?"100%":"auto",minHeight:0,marginTop:d(t.marginTop),marginRight:d(t.marginRight),marginBottom:d(t.marginBottom),marginLeft:d(t.marginLeft),borderRadius:d(t.borderRadius)},stylesheet:V,theme:y,onStylesheetsLoad:I,title:"Embedded Content"},l.createElement("div",{ref:H,className:M({"userflowjs-embed-root":!0,[`userflowjs-embed-root--content-layout-${t.contentLayout}`]:!0,"userflowjs-theme-root":!0,"userflowjs-embed-root-blocks":b.length>0}),dir:k.dir(),style:{width:"100%",maxWidth:t.maxContentWidth?d(t.maxContentWidth):"100%",margin:"0 auto"}},z()))),e.current)};export{Be as EmbedApp,Be as default};
|
|
2
2
|
//# sourceMappingURL=EmbedApp.js.map
|