userflow.js-self-hosted 0.1.1016725 → 0.1.1016778
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/ElementSelectionApp.js +1 -1
- package/EmbedApp.js +1 -1
- package/FlowApp.js +2 -2
- package/FlowChrome.js +2 -2
- package/LauncherApp.js +1 -1
- package/ResourceCenterApp.js +3 -3
- package/ResourceCenterAssistantChat.js +2 -2
- package/ResourceCenterLauncherHandler.js +2 -0
- package/SmartFlowRecordingApp.js +1 -1
- package/Trigger.js +1 -1
- package/builder-ui-frame.css +15 -3
- package/flow-condition-types.js +1 -1
- package/flow-host.styl.js +1 -1
- package/hash.txt +1 -1
- package/package.json +1 -1
- package/roots.js +1 -1
- package/stylesheets.js +1 -1
- package/ui.js +2 -2
- package/use-selector-element-monitoring.js +2 -2
- package/userflow.js +4 -4
- package/vendor.core-js.js +1 -1
- package/vendor.fortawesome.pro-regular-svg-icons.js +1 -1
package/BannerApp.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r,R as
|
|
1
|
+
import{r as n,R as a}from"./vendor.react.js";import{l as s,E as A}from"./userflow.js";import{u as C,i as v}from"./client-context.js";import{o as R}from"./vendor.obj-str.js";import{u as D,a as x,D as O}from"./stylesheets.js";import{C as $}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{u as P,S as W,b as Y,R as z,B as U}from"./use-selector-element-monitoring.js";import{g as H}from"./flow-condition-types.js";import{f as K,w as Z}from"./flow-host.styl.js";import{r as q}from"./vendor.react-dom.js";import{F as G}from"./Frame.js";import{d as i}from"./roots.js";import{u as J}from"./use-element-rect.js";import"./vendor.core-js.js";import"./vendor.object-assign.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.i18next.js";import"./vendor.babel.runtime.js";import"./vendor.react-i18next.js";import"./vendor.fortawesome.pro-solid-svg-icons.js";import"./vendor.date-fns.js";import"./vendor.scheduler.js";import"./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]="8ed1fb35-88b8-4151-9275-e3056cc5e358",r._sentryDebugIdIdentifier="sentry-dbid-8ed1fb35-88b8-4151-9275-e3056cc5e358")}catch{}})();const Le=({session:r})=>{const d=C(),{version:c}=r,e=c.banner,p=D(c.theme),g=r.locale?r.locale.standardLocaleId:r.version.theme.languageId;n.useEffect(()=>{v.changeLanguage(g)},[g]);const t=n.useMemo(()=>document.createElement("div"),[]),[k,w]=n.useState(!1),{loaded:T}=x(window,K,p),[I,h]=n.useState(!1),E=T&&I,[M,B]=n.useState(0),u=n.useCallback(()=>{h(!1),B(o=>o+1)},[]),f=![s.BODY_FIRST,s.BODY_LAST].includes(e.embedMode),[l,S]=n.useState(null),F=n.useCallback(({targetEl:o})=>{S(o)},[]),N=n.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=n.useCallback(()=>{t.parentElement?.removeChild(t),w(!1),u()},[t,u]);n.useLayoutEffect(()=>{let o=null,m=null;if(f){if(!l){b();return}(e.overlay||e.sticky)&&(e.embedMode===s.ELEMENT_BEFORE||e.embedMode===s.ELEMENT_AFTER?m=l.parentElement:m=l,window.getComputedStyle(m).position==="static"&&(o=m.style.position,m.style.position="relative"))}switch(e.embedMode){case s.BODY_FIRST:document.body.insertAdjacentElement("afterbegin",t);break;case s.BODY_LAST:document.body.insertAdjacentElement("beforeend",t);break;case s.ELEMENT_FIRST:l.insertAdjacentElement("afterbegin",t);break;case s.ELEMENT_LAST:l.insertAdjacentElement("beforeend",t);break;case s.ELEMENT_BEFORE:l.insertAdjacentElement("beforebegin",t);break;case s.ELEMENT_AFTER:l.insertAdjacentElement("afterend",t);break}return w(!0),u(),()=>{m&&o!=null&&(m.style.position=o)}},[b,t,f,l,e.overlay,e.sticky,e.embedMode,u]),n.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});n.useLayoutEffect(()=>{t.className=L||""},[t,L]);const y=e.zIndex||Z(0);n.useLayoutEffect(()=>{t.style.zIndex=y==null?"":String(y),t.style.position=E?"":"absolute",t.style.visibility=E?"":"hidden"},[t,y,E]);const{height:j,setEl:_}=J();return n.useLayoutEffect(()=>{t.style.setProperty("--userflowjs-banner-height",i(j+(e.marginTop||0)+(e.marginBottom||0))||"")},[t,j,e.marginTop,e.marginBottom]),k?q.createPortal(a.createElement(W.Provider,{value:r},a.createElement(G,{key:M,className:"userflowjs-banner-frame",style:{maxWidth:i(e.maxWidth),marginTop:i(e.marginTop),marginRight:i(e.marginRight),marginBottom:i(e.marginBottom),marginLeft:i(e.marginLeft),borderRadius:i(e.borderRadius)},stylesheet:Y,theme:p,onStylesheetsLoad:h,title:"Banner"},a.createElement("div",{ref:_,className:R({"userflowjs-banner-root":!0,[`userflowjs-banner-root--content-layout-${e.contentLayout}`]:!0,"userflowjs-theme-root":!0}),dir:v.dir()},a.createElement("div",{className:"userflowjs-banner-start-spacer"}),a.createElement("div",{className:"userflowjs-banner-inner",style:{maxWidth:i(e.maxContentWidth)}},a.createElement("div",{className:"userflowjs-banner-content"},a.createElement(z,{doc:e.content,lookupAttribute:H(r.data)})),e.buttons.length>0&&a.createElement("div",{className:"userflowjs-banner-buttons"},e.buttons.map(o=>a.createElement(U,{key:o.id,button:o})))),c.closeDisabled?a.createElement("div",{className:"userflowjs-banner-start-spacer"}):a.createElement("button",{"data-testid":"userflow-banner-dismiss",className:"userflowjs-banner-close",onClick:()=>d.endFlow(r,{endReason:A.USER_CLOSED})},a.createElement(O,{icon:$}))))),t):null};export{Le as BannerApp,Le as default};
|
|
2
2
|
//# sourceMappingURL=BannerApp.js.map
|
package/BuilderBar.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{R as e,r as t}from"./vendor.react.js";import{F as I}from"./Frame.js";import{S as v}from"./logomark.js";import{o as F}from"./vendor.obj-str.js";import{a as L,b as k}from"./vendor.fortawesome.pro-light-svg-icons.js";import{
|
|
1
|
+
import{R as e,r as t}from"./vendor.react.js";import{F as I}from"./Frame.js";import{S as v}from"./logomark.js";import{o as F}from"./vendor.obj-str.js";import{a as L,b as k}from"./vendor.fortawesome.pro-light-svg-icons.js";import{p as b}from"./userflow.js";import{a as B,D}from"./stylesheets.js";import{u as N}from"./use-window-resize.js";import"./vendor.core-js.js";(function(){try{var r=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},n=new Error().stack;n&&(r._sentryDebugIds=r._sentryDebugIds||{},r._sentryDebugIds[n]="02dfb6e4-43d8-4934-bcf1-f6457c32c47e",r._sentryDebugIdIdentifier="sentry-dbid-02dfb6e4-43d8-4934-bcf1-f6457c32c47e")}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)},[]),f=t.useRef(0),d=t.useCallback(()=>{const a=i.current;if(!a||!s||!o)return;const c=s.clientHeight;c!==f.current&&(f.current=c,a.style.setProperty("height",c+"px","important"))},[o,s]);return t.useLayoutEffect(()=>{d()}),N(d),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{w as b,v as R,r as F,x as B}from"./userflow.js";import{F as _,B as N}from"./FlowChrome.js";import{i as D,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 O,u as I}from"./stylesheets.js";import{F as Z}from"./Frame.js";import{o as z}from"./vendor.obj-str.js";import{z as W}from"./roots.js";import{o as X}from"./vendor.fortawesome.pro-regular-svg-icons.js";import"./vendor.core-js.js";import{u as M}from"./vendor.react-i18next.js";import{C as Y}from"./ChecklistUI.js";import"./vendor.object-assign.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./use-selector-element-monitoring.js";import"./flow-condition-types.js";import"./vendor.date-fns.js";import"./vendor.babel.runtime.js";import"./vendor.fortawesome.pro-solid-svg-icons.js";import"./use-window-resize.js";import"./logomark.js";import"./vendor.canvas-confetti.js";import"./vendor.i18next.js";import"./vendor.react-dom.js";import"./vendor.scheduler.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]="a346b7e5-d42e-49db-a014-3f5e64717fe1",t._sentryDebugIdIdentifier="sentry-dbid-a346b7e5-d42e-49db-a014-3f5e64717fe1")}catch{}})();const G=new URL("checklist-launcher-frame.css",import.meta.url).href,K=({position:t,theme:e,onClick:l,onVisibleChange:r,buttonRef:a,text:u,uncompletedCount:o})=>{const d=t||"absolute",{i18n:n}=M(),m=n.dir(),{loaded:i}=H(window,P,e),[h,k]=s.useState(!1),f=i&&h;s.useEffect(()=>{r&&r(f)},[r,f]);const w=s.useRef(null),L=s.useRef(0),[v,S]=s.useState(null);s.useLayoutEffect(()=>{const E=w.current;if(!E||!v)return;const y=v.clientWidth;y!==L.current&&(L.current=y,E.style.setProperty("width",W(y)+"px","important"),E.style.setProperty("height",e.checklistLauncherHeight+"px","important"))});const p=e.checklistLauncherPlacement,x=p===b.TOP_LEFT||p===b.TOP_RIGHT,g=p===b.TOP_LEFT||p===b.BOTTOM_LEFT,T={zIndex:d==="fixed"?e.checklistZIndex!=null?e.checklistZIndex:j(U):1,top:x?e.checklistLauncherY+"px":void 0,bottom:x?void 0:e.checklistLauncherY+"px",[m==="ltr"?"left":"right"]:g?e.checklistLauncherX+"px":void 0,[m==="ltr"?"right":"left"]:g?void 0:e.checklistLauncherX+"px",height:e.checklistLauncherHeight+"px",borderRadius:e.checklistLauncherBorderRadius+"px",position:f?void 0:"absolute",visibility:f?void 0:"hidden",animation:f?void 0:"none"};return c.createElement(Z,{elRef:w,testId:"checklist-launcher-app",className:z({"userflowjs-checklist-launcher":!0,[`userflowjs-checklist-launcher--position-${d}`]:!0}),style:T,stylesheet:G,theme:e,onStylesheetsLoad:k,title:"Checklist launcher"},c.createElement("button",{ref:a,className:"userflowjs-checklist-launcher-frame-root",onClick:l},c.createElement("div",{ref:S,className:"userflowjs-checklist-launcher-content"},c.createElement("div",{className:"userflowjs-checklist-launcher-text"},u||"Get Started"),c.createElement("div",{"data-testid":"checklist-launcher-uncompleted-count",className:"userflowjs-checklist-launcher-uncompleted-count"},o===0?c.createElement(O,{icon:X}):o,c.createElement("div",{className:"userflowjs-a11y-only"},"uncompleted tasks")))))},ge=({session:t,checklistExpanded:e})=>{const{version:l}=t,r=l.checklist,a=t.locale?t.locale.standardLocaleId:t.version.theme.languageId;s.useEffect(()=>{D.changeLanguage(a)},[a]);const[u,o]=s.useState(!1);return e?c.createElement(V,{session:t,initialAutoFocus:u,setInitialAutoFocus:o}):r.launcherEnabled?c.createElement($,{session:t,initialAutoFocus:u,setInitialAutoFocus:o}):null},V=({session:t,initialAutoFocus:e,setInitialAutoFocus:l})=>{const r=C(),[a,u]=s.useState(null),{version:o}=t,d=o.checklist,n=I(o.theme),m=s.useMemo(()=>({...n,avatarType:R.NONE,bubblePlacement:n.checklistPlacement,bubbleX:n.checklistX,bubbleY:n.checklistY,bubbleWidth:n.checklistWidth}),[n]);return s.useEffect(()=>{const i=a?.ownerDocument.defaultView;if(!i)return;const h=k=>{k.key==="Escape"&&(l(!0),r.hideChecklist())};return i.addEventListener("keydown",h),()=>i.removeEventListener("keydown",h)},[a,l,r]),c.createElement(A,null,c.createElement(_,{company:t.flow.company,theme:m,position:"fixed",stepAppearance:F.BUBBLE,zIndex:n.checklistZIndex,autoHide3pEnabled:!0,backgroundImageUrl:d.backgroundAsset&&d.backgroundAsset.assetUrl,bubbleFrameRootRef:u},c.createElement("div",{role:"dialog","aria-label":"Checklist"},c.createElement(Y,{session:t,initialAutoFocus:e}),c.createElement(N,{draftMode:t.draftMode,minimize:i=>{l(i.detail===0),r.hideChecklist()}}))))},$=({session:t,initialAutoFocus:e,setInitialAutoFocus:l})=>{const r=C(),[a,u]=s.useState(!1),[o,d]=s.useState(null),{version:n}=t,m=n.checklist,i=I(n.theme);return s.useEffect(()=>{!a||!o||!e||o.focus()},[r,o,a,e]),c.createElement(K,{position:"fixed",theme:i,onClick:h=>{l(h.detail===0),r.showChecklist()},onVisibleChange:u,buttonRef:d,text:m.launcherText,uncompletedCount:B(t)})};export{ge as ChecklistApp,ge 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,p as _}from"./userflow.js";import{u as v}from"./client-context.js";import"./vendor.core-js.js";import{u as T}from"./vendor.react-i18next.js";import{o as F}from"./vendor.obj-str.js";import{D as C}from"./stylesheets.js";import{c as P,d as L}from"./vendor.fortawesome.pro-solid-svg-icons.js";import{h as M,e as x,j as B,R as $}from"./use-selector-element-monitoring.js";import{g}from"./flow-condition-types.js";import{L as H,J}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]="78f9fbc3-9951-486b-9849-0bdb5e025eb0",t._sentryDebugIdIdentifier="sentry-dbid-78f9fbc3-9951-486b-9849-0bdb5e025eb0")}catch{}})();const W=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)}),z=({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(W,{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})},G=({completedCount:t,taskCount:s})=>{const n=s===0?0:Math.min(100,Math.round(t/s*100));return e.createElement("div",{className:"userflowjs-bubble-checklist-progress"},e.createElement("div",{className:"userflowjs-bubble-checklist-progress-bg"},e.createElement("div",{className:"userflowjs-bubble-checklist-progress-text"},n,"%")),e.createElement("div",{className:"userflowjs-bubble-checklist-progress-fill",style:{width:`${n}%`}},e.createElement("div",{className:"userflowjs-bubble-checklist-progress-text"},n,"%")))},D=5e3,K=({active:t,onComplete:s})=>{const n=l.useRef(null);return l.useEffect(()=>{if(!t||!n.current)return;n.current.style.width="0%",n.current.offsetWidth,n.current.style.transition=`width ${D}ms linear`,n.current.style.width="100%";const o=setTimeout(s,D);return()=>clearTimeout(o)},[t,s]),e.createElement("div",{className:"userflowjs-bubble-progress--default userflowjs-bubble-progress-container--checklist"},t&&e.createElement("div",{className:"userflowjs-bubble-progress-background--checklist"}),e.createElement("div",{className:"userflowjs-bubble-progress__fill userflowjs-bubble-progress-fill--checklist",ref:n}))},Q=()=>{const{t}=T(),s=v(),n=S(),{session:o}=n,{version:u}=o,c=u.checklist,{dispatch:b}=U(),m=o.taskCompletions.length,a=c.tasks.length,i=m===a,w=l.useCallback(()=>{s.endFlow(o,{endReason:I.USER_CLOSED})},[s,o]);let d=!0,j=c.tasks,h=[],p=n.currentSectionName,y=!1;if(c.sectionsEnabled){let f=null;const k=Array.from(c.tasks).sort((r,E)=>r.sectionName.localeCompare(E.sectionName));for(const r of k)r.sectionName!==f&&(h.push(r.sectionName),f=r.sectionName);(!p||!h.includes(p))&&(p=h[0]),j=k.filter(r=>r.sectionName===p),y=j.some(r=>{const E=o.taskCompletions.some(({taskCvid:O})=>O===r.cvid);return r.blocksNextSection&&!E})}const N=p==null?-1:h.indexOf(p),R=f=>{const k=N+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(G,{completedCount:m,taskCount:a}),c.sectionsEnabled&&e.createElement("div",{className:"userflowjs-bubble-section-name"},p||"First section"),e.createElement("div",{className:"userflowjs-bubble-tasks"},j.map(f=>{const k=d;return o.taskCompletions.some(({taskCvid:E})=>E===f.cvid)||(d=!1),e.createElement(z,{key:f.id,task:f,previousTasksCompleted:k})})),c.sectionsEnabled&&e.createElement("div",{className:"userflowjs-bubble-section-buttons"},e.createElement("button",{className:"userflowjs-bubble-section-button",onClick:()=>R(-1),disabled:N<=0},e.createElement(C,{icon:H}),e.createElement("span",null,t("checklist.previousSection"))),e.createElement("button",{className:"userflowjs-bubble-section-button",onClick:()=>R(1),disabled:N>=h.length-1||y},e.createElement("span",null,t("checklist.nextSection")),e.createElement(C,{icon:J}))),e.createElement("div",{className:"userflowjs-bubble-dismiss-row userflowjs-bubble-dismiss-row--checklist"},u.closeDisabled?e.createElement("div",{className:"userflowjs-bubble-checklist-dismiss-button-placeholder"}):e.createElement("button",{className:F({"userflowjs-bubble-dismiss-button":!0,"userflowjs-bubble-dismiss-button--completed":i}),onClick:()=>i?w():b({kind:"showClose"})},t("checklistDismiss.button")),c.autoDismissEnabled&&e.createElement(K,{active:i,onComplete:w})))},V=()=>{const{t}=T(),s=v(),{dispatch:n}=U(),{session:o}=S();return e.createElement("div",{role:"alert"},e.createElement("div",{className:"userflowjs-bubble-content"},e.createElement("p",null,e.createElement("b",null,t("checklistDismiss.title")))),e.createElement("div",{className:"userflowjs-bubble-buttons"},e.createElement("button",{className:"userflowjs-bubble-button userflowjs-bubble-button--primary",onClick:()=>s.endFlow(o,{endReason:I.USER_CLOSED})},e.createElement("div",{className:"userflowjs-bubble-button-text",role:"presentation"},t("checklistDismiss.yes"))),e.createElement("button",{className:"userflowjs-bubble-button userflowjs-bubble-button--default",onClick:()=>n({kind:"showFlow"})},e.createElement("div",{className:"userflowjs-bubble-button-text",role:"presentation"},t("checklistDismiss.cancel")))))};function X(t){const s=t?.querySelector(".userflowjs-bubble-task--clickable:not(.userflowjs-bubble-task--completed)")||t?.querySelector(".userflowjs-bubble-task--clickable")||t?.querySelector('button:not([tabIndex="-1"])');s&&typeof s.focus=="function"&&s.focus()}const be=({session:t,initialAutoFocus:s})=>{const n=v(),o=l.useRef(null),[u,c]=l.useReducer(Z,void 0,()=>({...Y,session:t,currentSectionName:_.getItem("currentChecklistSectionName:"+t.id),autoFocusRequested:!!s})),{session:b,contentType:m}=u;l.useEffect(()=>{b!==t&&c({kind:"updateSession",session:t})},[b,t]);const a=l.useMemo(()=>({dispatch:c}),[c]);return l.useEffect(()=>{if(!u.autoFocusRequested)return;const i=o.current;i&&X(i),c({kind:"autoFocused"})},[n,u.autoFocusRequested]),e.createElement(A.Provider,{value:a},e.createElement(q.Provider,{value:u},e.createElement("div",{ref:o},m==="close"?e.createElement(V,null):e.createElement(Q,null))))},Y={contentType:"flow"};function Z(t,s){switch(s.kind){case"updateSession":return{...t,session:s.session};case"showFlow":return{...t,contentType:"flow",autoFocusRequested:!0};case"showClose":return{...t,contentType:"close",autoFocusRequested:!0};case"setCurrentSection":return{...t,currentSectionName:s.sectionName};case"autoFocused":return{...t,autoFocusRequested:!1}}}const A=l.createContext(null),q=l.createContext(null);function U(){return l.useContext(A)}function S(){return l.useContext(q)}export{be as C,X as f};
|
|
2
2
|
//# sourceMappingURL=ChecklistUI.js.map
|
package/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,e as ne,h as oe,o as fe,j as $,k as ae,l as pe,m as ge,p as re,a as we,q as C}from"./roots.js";import{m as U}from"./userflow.js";import{u as he}from"./client-context.js";import{u as ve}from"./use-window-resize.js";import{B as be}from"./BuilderBar.js";import"./vendor.core-js.js";import"./vendor.object-assign.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.i18next.js";import"./vendor.babel.runtime.js";import"./vendor.react-i18next.js";import"./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]="d7900f40-1360-4682-ade9-d8894e8c7f1e",p._sentryDebugIdIdentifier="sentry-dbid-d7900f40-1360-4682-ade9-d8894e8c7f1e")}catch{}})();const ye=_("alt+s"),Ee=_("escape"),Re=_("u"),Xe=({state:p})=>{const{mode:n,elementType:m}=p,g=he(),S=y.useRef(null),[A,ie]=y.useState(!1),B=y.useRef(null),[V,le]=y.useState(null),[I,ce]=y.useState(()=>se()),M=y.useCallback(async(s,c)=>{if(s&&c){const l=S.current?.getFrame();l&&B.current&&(B.current.classList.add("userflowjs-element-selection-box--no-transition"),l.style.display="none",l.offsetWidth),re(),g.setSessionStorageState(d=>({...d,elementSelection:{...d.elementSelection,mode:"done"}}));const w=W(s),h=0,r=0,R=Math.round(ne()),T=Math.round(oe()),a=await g.getTargetEnv().captureScreenshot(h,r,R,T),E=d=>Math.round(d/$(1));c={...c,screenshotDataUrl:a,targetX1:E(w.left),targetY1:E(w.top-r),targetX2:E(w.right),targetY2:E(w.bottom-r),screenshotWidth:R,screenshotHeight:T}}g.setSessionStorageState(l=>({...l,activeApp:null,elementSelection:null})),g.getTargetEnv().postBuilderMessage({kind:"userflow:selectElementResult",selectorData:c})},[g]),L=y.useCallback(s=>g.setSessionStorageState(c=>({...c,elementSelection:{...c.elementSelection,mode:s}})),[g]);return y.useEffect(()=>{if(!A||!S.current)return;const s=S.current.getFrame(),c=S.current.getRootEl();let l=c&&c.ownerDocument&&c.ownerDocument.defaultView;l===window&&(l=null);let w=null,h=null,r=null,R=null;const T=document.getElementById("userflow-ui"),a={capture:!0},E=()=>{window.cancelAnimationFrame(d);let e=null,t=null,v=null;if(h&&!T.contains(h)){let f=null,u=h;for(;u;){{const x=u.getBoundingClientRect();if(x.width===0&&x.height===0){u=O(u);continue}}if(f=we(u,{elementType:m}),f)break;u=O(u)}f?(t=f.el,e=f.selector):m===U.INPUT?v="No text input found here":v="Sorry, we can't select that element (yet!)"}r=t,w=e,le(v),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()),v=$(oe());let f=v/2,u=t/2,x=v/2,H=t/2;const b=2;let J=b,Q=b,ee=b,te=b;if(r){const i=W(r),F=window.getComputedStyle(r);f=Math.max(0,i.top),u=Math.max(0,t-i.right),x=Math.max(0,v-i.bottom),H=Math.max(0,i.left),J=Math.max(b,C(F.borderTopLeftRadius)),Q=Math.max(b,C(F.borderTopRightRadius)),ee=Math.max(b,C(F.borderBottomLeftRadius)),te=Math.max(b,C(F.borderBottomRightRadius)),R=r}else if(R){const i=W(R);f=Math.max(0,i.top+i.height/2),u=Math.max(0,t-i.right+i.width/2),x=Math.max(0,v-i.bottom+i.height/2),H=Math.max(0,i.left+i.width/2)}e.style.top=`${f}px`,e.style.right=`${u}px`,e.style.bottom=`${x}px`,e.style.left=`${H}px`,e.style.borderTopLeftRadius=`${J}px`,e.style.borderTopRightRadius=`${Q}px`,e.style.borderBottomLeftRadius=`${ee}px`,e.style.borderBottomRightRadius=`${te}px`,r?document.body.classList.remove("userflowjs-body-with-element-selection--none"):document.body.classList.add("userflowjs-body-with-element-selection--none")};let N;const ue=()=>{window.cancelAnimationFrame(N),N=window.requestAnimationFrame(q)},z=()=>{ue()},k=e=>{if(ye(e)){e.preventDefault(),n==="select"?L("navigate"):n==="navigate"&&L("select");return}if(Ee(e)&&n==="select"){e.preventDefault(),M(null,null);return}if(Re(e)&&r){const t=O(r);if(t){e.preventDefault(),h=t,E();return}}},j=e=>{const t=e.composedPath()[0];!t||t===r||t.tagName==="BODY"||t.tagName==="HTML"||(h=t,Y())},D=()=>{h=null,Y()};s&&s.addEventListener("mouseenter",D);const P=e=>{e.preventDefault(),e.stopPropagation()},X=e=>{P(e)},Z=e=>{P(e)},G=e=>{if(P(e),I){const t=e.target;if(!r||!r.contains(t)){j(e);return}}w&&(M(r,w),K())};l&&l.addEventListener("keydown",k),n==="select"&&(document.body.addEventListener("mouseleave",D),document.body.classList.add("userflowjs-body-with-element-selection"));const me=fe(e=>{const t=e.ownerDocument.defaultView;t&&(t.addEventListener("keydown",k,a),n==="select"&&(t.addEventListener("scroll",z,a),e.addEventListener("mousemove",j,a),e.addEventListener("mousedown",X,a),e.addEventListener("focus",Z,a),e.addEventListener("click",G,a)))},e=>{const t=e.ownerDocument.defaultView;t&&(t.removeEventListener("keydown",k,a),n==="select"&&(t.removeEventListener("scroll",z,a),ae(e)||e.removeEventListener("mousemove",j,a),e.removeEventListener("mousedown",X,a),e.removeEventListener("focus",Z,a),e.removeEventListener("click",G,a)))}),K=()=>{window.cancelAnimationFrame(d),window.cancelAnimationFrame(N),document.body.removeEventListener("mouseleave",D),l&&l.removeEventListener("keydown",k),s&&s.removeEventListener("mouseenter",D),document.body.classList.remove("userflowjs-body-with-element-selection"),document.body.classList.remove("userflowjs-body-with-element-selection--none"),me()};return K},[I,g,n,A,m,M,L]),ve(()=>ce(se())),o.createElement(o.Fragment,null,o.createElement(be,{ref:S,onReadyChange:ie,buttons:o.createElement(o.Fragment,null,n==="navigate"?o.createElement("button",{key:"select",className:"btn btn--default",onMouseDown:s=>{s.preventDefault(),s.stopPropagation(),L("select")}},o.createElement("span",{className:"hidden-lg-up"},"Select here"),o.createElement("span",{className:"hidden-md-down"},"Select element here (Alt + S)")):n==="select"?o.createElement("button",{key:"navigate",className:"btn btn--default",onMouseDown:s=>{s.preventDefault(),s.stopPropagation(),L("navigate")}},o.createElement("span",{className:"hidden-lg-up"},"Navigate"),o.createElement("span",{className:"hidden-md-down"},"Navigate to another page (Alt + S)")):null,(n==="select"||n==="navigate")&&o.createElement("button",{className:"btn btn--secondary-on-dark",onClick:()=>M(null,null)},"Cancel"))},n==="navigate"?o.createElement("div",{className:"status"},"Navigate to the page the element appears on"):V?o.createElement("div",{className:"error"},V):o.createElement("div",{className:"status"},I?o.createElement(o.Fragment,null,"Tap"," ",m===U.INPUT?"a text input":"an element"," ","to focus. Tap again to select."):o.createElement(o.Fragment,null,"Click"," ",m===U.INPUT?"a text input":"an element"," ","to select it"))),A&&(n==="select"||n==="done")&&o.createElement("div",{className:de({"userflowjs-element-selection-box":!0}),ref:B}))};function O(p){const n=p.parentNode;if(!n)return null;if(ae(n))return n.host;if(!pe(n))return null;if(n.tagName==="BODY"){const m=ge(n);return m||null}return n}function se(){return window.navigator.userAgent.includes("Mobile")}export{Xe as ElementSelectionApp,Xe 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{y 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 Z}from"./stylesheets.js";import{C as G}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{u as J,S as Q,b as V}from"./use-selector-element-monitoring.js";import{w as X,f as ee}from"./flow-host.styl.js";import{r as te}from"./vendor.react-dom.js";import{F as re}from"./Frame.js";import{d}from"./roots.js";import{u as ne}from"./use-element-rect.js";import{C as oe}from"./ChecklistUI.js";import"./vendor.core-js.js";import"./vendor.object-assign.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.i18next.js";import"./vendor.babel.runtime.js";import"./vendor.react-i18next.js";import"./vendor.fortawesome.pro-solid-svg-icons.js";import"./flow-condition-types.js";import"./vendor.date-fns.js";import"./vendor.scheduler.js";import"./use-window-resize.js";(function(){try{var r=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},a=new Error().stack;a&&(r._sentryDebugIds=r._sentryDebugIds||{},r._sentryDebugIds[a]="f9e38211-e698-46cf-9520-074a6bedf213",r._sentryDebugIdIdentifier="sentry-dbid-f9e38211-e698-46cf-9520-074a6bedf213")}catch{}})();const ke=({session:r,checklistSession:a})=>{const p=P(),{version:i}=r,t=i.embed,y=U(i.theme),L=r.locale?r.locale.standardLocaleId:r.version.theme.languageId,b=r.version.embed?.blocks||[],S=b.length===1&&b[0]?.type==="CHECKLIST";o.useEffect(()=>{k.changeLanguage(L)},[L]);const e=o.useRef(null);o.useLayoutEffect(()=>{e.current=document.createElement("div")},[]);const[N,v]=o.useState(!1),{loaded:D}=Y(window,ee,y),[F,I]=o.useState(!1),g=D&&F,[A,_]=o.useState(0),j=o.useCallback(()=>{I(!1),_(n=>n+1)},[]),E=![m.BODY_FIRST,m.BODY_LAST].includes(t.embedMode),[f,x]=o.useState(null),B=o.useCallback(({targetEl:n})=>{x(n)},[]),O=o.useCallback(()=>{E&&console.warn(`Userflow.js: Could not find embed element for banner "${r.flow.name||r.flow.id}"`),x(null)},[E,r.flow.name,r.flow.id]);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,i.embed?.overlay,i.embed?.sticky,t.embedMode,j,a]);const h=n=>M({"userflowjs-embed":!0,[`userflowjs-embed--embed-mode-${t.embedMode}`]:!0,[`userflowjs-embed--animate-${String(t.animate)}`]:n&&t.animate});o.useLayoutEffect(()=>{e.current&&(e.current.className=h(!1))},[e,t.embedMode,t.animate]);const w=t.zIndex||X(0);o.useLayoutEffect(()=>{e.current&&(e.current.style.zIndex=w==null?"":String(w),e.current.style.position=g?"":"absolute",e.current.style.visibility=g?"":"hidden")},[e,w,g]);const{height:u,setEl:H}=ne();o.useLayoutEffect(()=>{e.current&&e.current.style.setProperty("--userflowjs-embed-height",u&&d(u+(t.marginTop||0)+(t.marginBottom||0))||"0px")},[e,u,t.marginTop,t.marginBottom]);const 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"),!i.closeDisabled&&l.createElement("button",{"data-testid":"userflow-embed-dismiss",className:"userflowjs-bubble-toolbar-button",onClick:W,"aria-label":"Close embed"},l.createElement(Z,{icon:G}))),s);return b.map(s=>{switch(s.type){case"CHECKLIST":return a?n(l.createElement("div",{style:{...q(y),paddingTop:i.closeDisabled?"0px":"32px"},className:"userflowjs-embedded-checklist"},l.createElement(oe,{session:a})),s.id):null;default:return console.warn(`Unknown embed block type: ${s.type}`),null}})};return o.useLayoutEffect(()=>{const n=`userflow-${r.id}`;return e.current.id=n,()=>{T||document.getElementById(n)===e.current&&c()}},[e,r.id,c,T]),o.useLayoutEffect(()=>{const n=r.version.embed?.blocks?.length&&r.version.embed.blocks.some(s=>s.type==="CHECKLIST"?a:!1);u&&u>0&&n?(e.current.style.height=`${u}px`,e.current.className=h(t.animate)):(e.current.style.height="0px",e.current.className=h(!1))},[e,u,a,t.animate]),o.useEffect(()=>{if(!e.current)return;const n=new ResizeObserver(C=>{for(const R of C)R.contentRect&&!t.embedMode&&(e.current.style.height=`${R.contentRect.height}px`)}),s=e.current.querySelector("iframe");return s&&n.observe(s),()=>{n.disconnect()}},[e,t.embedMode]),!N||!b.length||S&&!a?null:te.createPortal(l.createElement(Q.Provider,{value:r},l.createElement(re,{key:A,className:"userflowjs-embed-frame",style:{maxWidth:t.maxWidth?d(t.maxWidth):"100%",width:"100%",height:r.version.embed?.blocks?.length?"100%":"auto",minHeight:0,marginTop:d(t.marginTop),marginRight:d(t.marginRight),marginBottom:d(t.marginBottom),marginLeft:d(t.marginLeft),borderRadius:d(t.borderRadius)},stylesheet:V,theme:y,onStylesheetsLoad:I,title:"Embedded Content"},l.createElement("div",{ref:H,className:M({"userflowjs-embed-root":!0,[`userflowjs-embed-root--content-layout-${t.contentLayout}`]:!0,"userflowjs-theme-root":!0,"userflowjs-embed-root-blocks":b.length>0}),dir:k.dir(),style:{width:"100%",maxWidth:t.maxContentWidth?d(t.maxContentWidth):"100%",margin:"0 auto"}},z()))),e.current)};export{ke as EmbedApp,ke as default};
|
|
2
2
|
//# sourceMappingURL=EmbedApp.js.map
|
package/FlowApp.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import{R as n,r as d}from"./vendor.react.js";import{E as B,P as ce,
|
|
1
|
+
import{R as n,r as d}from"./vendor.react.js";import{E as B,P as ce,q as I,r as k,V as P,s as ue,F as de,T as x,p as C,t as pe,v as fe,M as me,U as G}from"./userflow.js";import{l as be}from"./vendor.lodash.js";import"./vendor.core-js.js";import{u as _}from"./vendor.react-i18next.js";import{B as X,F as Ee}from"./FlowChrome.js";import{m as ge,d as K,R as we,i as he,g as ve,a as Te,u as Se,r as ye,c as W,h as ke,S as Me}from"./use-selector-element-monitoring.js";import{g as Q,i as Z}from"./flow-condition-types.js";import{u as D,i as Be}from"./client-context.js";import{z as Fe,h as Ie,r as De}from"./roots.js";import{u as J,S as Re}from"./flow-host.styl.js";import{b as Le}from"./vendor.fortawesome.pro-solid-svg-icons.js";import{D as Ne,u as Ce}from"./stylesheets.js";import{T as Ae}from"./Trigger.js";import"./vendor.object-assign.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.babel.runtime.js";import"./vendor.fortawesome.pro-regular-svg-icons.js";import"./Frame.js";import"./vendor.react-dom.js";import"./vendor.scheduler.js";import"./use-window-resize.js";import"./logomark.js";import"./vendor.obj-str.js";import"./vendor.canvas-confetti.js";import"./vendor.date-fns.js";import"./vendor.i18next.js";(function(){try{var e=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},s=new Error().stack;s&&(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[s]="80e5c289-9508-45b8-8f12-2b5d2ec456bb",e._sentryDebugIdIdentifier="sentry-dbid-80e5c289-9508-45b8-8f12-2b5d2ec456bb")}catch{}})();const Pe=()=>{const{t:e}=_(),s=D(),{dispatch:t,restart:o}=L(),{session:l,step:p}=M(),a="userflowjs-bubble-button userflowjs-bubble-button--default userflowjs-bubble-menu__item";return n.createElement("div",{role:"dialog","aria-modal":R(p)?"true":void 0,"aria-label":"Guide menu"},n.createElement("div",{className:"userflowjs-bubble-menu__title"},e("menu.title")),n.createElement("button",{className:a,onClick:()=>s.endFlow(l,{endReason:B.USER_CLOSED})},e("menu.close")),l.version.restartEnabled&&n.createElement("button",{className:a,onClick:o},e("menu.restart")),n.createElement("button",{className:a,onClick:()=>t({kind:"showFlow"})},e("menu.back")))},z=({progress:e,type:s,position:t,totalSteps:o})=>{const{t:l}=_(),p=d.useMemo(()=>parseFloat(e||"0"),[e]),a=d.useMemo(()=>({width:`${p*100}%`}),[p]),c=d.useMemo(()=>s===ce.DEFAULT?I.TOP:t,[s,t]),u=c===I.BOTTOM?"userflowjs-bubble-progress--bottom":"",m=d.useMemo(()=>`userflowjs-bubble-progress--${be.kebabCase(s||"DEFAULT").toLowerCase()} ${u}`,[s,u]),i=o||0,r=d.useMemo(()=>Math.min(Math.floor(p*i),i),[p,i]);return n.createElement(n.Fragment,null,(s==="CHAINED_ROUNDED"||s==="CHAINED_SQUARED"||s==="DOTTED")&&n.createElement("div",{className:m},Array.from({length:3}).map((E,b)=>n.createElement("div",{key:b,className:`userflowjs-bubble-progress-step ${b<Math.floor(p*3)?"userflowjs-bubble-progress-step_completed":""}`}))),s==="NARROW"&&n.createElement("div",{className:m},n.createElement("div",{className:"linear-progress-bar"},n.createElement("div",{className:"userflowjs-bubble-progress--narrow-fill",style:a}))),s==="NUMBERED"&&n.createElement("div",{className:m},n.createElement("span",{className:"numbered-progress"},l("of",{replace:{range:i,selected:r}}))),!["CHAINED_ROUNDED","CHAINED_SQUARED","DOTTED","NARROW","NUMBERED"].includes(s)&&n.createElement("div",{className:`${m} ${c===I.BOTTOM?"userflowjs-bubble-progress--bottom":""}`},n.createElement("div",{className:"userflowjs-bubble-progress__fill",style:a})))},xe=({theme:e})=>{const s=D(),{session:t,step:o,muted:l,shouldLabelDialog:p}=M(),{version:a}=t,{dispatch:c}=L(),u=a.steps[0],m=u&&u.id===o.id,i=m&&o.progress==="1",r=d.useMemo(()=>o.content&&ge(K(o.content),{buttons:o.buttons,questions:o.questions}),[o.content,o.buttons,o.questions]),E=a.steps.filter(T=>T.appearance!==k.HIDDEN),b=E.findIndex(T=>T.id===o.id),w=E.length,h=w>0?((b+1)/w).toString():"0";return n.createElement("div",{key:o.id,role:"alertdialog","aria-modal":R(o)?"true":void 0,"aria-label":p?"Guide":void 0},!i&&e.progressBarPosition==="TOP"&&e.progressBarEnabled&&n.createElement(z,{progress:h,type:e.progressBarType,position:o.appearance===k.MODAL?void 0:I.TOP,totalSteps:w}),n.createElement("div",{id:"userflowjs-bubble-content",className:"userflowjs-bubble-content","data-progress-position":e.progressBarPosition,"data-progress-type":e.progressBarType},n.createElement(we,{doc:r,lookupAttribute:Q(t.data),buttons:o.buttons,questions:o.questions})),n.createElement(X,{draftMode:t.draftMode,muted:l,toggleMuted:e.voiceType!==P.NONE?()=>c({kind:"toggleMuted"}):void 0,close:a.closeDisabled?void 0:()=>e.flowXButtonBehavior===ue.DISMISS||m?s.endFlow(t,{endReason:B.USER_CLOSED}):c({kind:"showMenu"})}),!i&&e.progressBarPosition==="BOTTOM"&&e.progressBarEnabled&&n.createElement(z,{progress:h,type:e.progressBarType,position:I.BOTTOM,totalSteps:w}))};function Oe(e,s){if(!e)return"";typeof e=="string"&&(e=K(e));const t=[],o=/[.!?;,]$/;function l(){const c=(t[t.length-1]||"").trim();c&&!c.match(o)&&t.push(".")}function p(c){if(he(c)){if(c.text&&!c.silent){const u=c.text.split(`
|
|
2
2
|
`);u.forEach((m,i)=>{t.push(m),i<u.length-1&&(l(),t.push(`
|
|
3
3
|
`))})}return}switch(c.type){case"attribute":{const u=ve(c,s);u&&t.push(u);break}default:a(c.children),["link"].includes(c.type)||(l(),t.push(`
|
|
4
4
|
|
|
5
|
-
`));break}}function a(c){c.forEach(u=>p(u))}return a(e.children),t.join("").trim().replace(new RegExp(" ","g")," ").replace(new RegExp("\b","g"),"")}const _e=({bubbleFrame:e,theme:s})=>{const t=D(),{dispatch:o}=R(),{muted:l,session:p,step:a}=M(),c=t.getAudio();d.useEffect(()=>{const r=()=>{o({kind:"speechPlaying"})},E=()=>{o({kind:"speechStopped"})};return c.addEventListener("playing",r),c.addEventListener("ended",E),c.addEventListener("pause",E),()=>{c.removeEventListener("playing",r),c.removeEventListener("ended",E),c.removeEventListener("pause",E),c.pause(),c.src="",o({kind:"speechStopped"})}},[o,c]),d.useEffect(()=>{if(t.audioReady)return;const r=e&&Ue(e)?e.contentWindow:null,E=()=>{window.removeEventListener("mousedown",b),r&&r.removeEventListener("mousedown",b)},b=()=>{E(),t.playAudio(null)};return window.addEventListener("mousedown",b),r&&r.addEventListener("mousedown",b),E},[e,t]);const u=d.useRef(p),m=d.useRef(s),i=d.useRef(a);return d.useEffect(()=>{u.current=p,m.current=s,i.current=a},[p,s,a]),d.useEffect(()=>{if(!t.audioReady||l){t.pauseAudio();return}let r=!1;return(async()=>{if(await new Promise(w=>setTimeout(w,1)),r)return;const b=await je(t,u.current,m.current,i.current);r||b&&t.playAudio(b)})(),()=>{r=!0}},[l,t,a.id,s.voiceType,s.syntheticVoice]),null};async function je(e,s,t,o){if(t.voiceType===P.SYNTHETIC&&typeof t.syntheticVoice=="string"&&o.content){e.ensureIdentified();const l=Q(s.data),p=Oe(o.content,l);return e.getStepSpeech(t.syntheticVoice,p)}else if(t.voiceType===P.MANUAL&&o.speechAsset)return o.speechAsset.assetUrl;return null}function Ue(e){return e.tagName==="IFRAME"}const qe="userflowjs-out-of-viewport-pointer--visible",Ve="userflowjs-out-of-viewport-pointer--visible-up",He="userflowjs-out-of-viewport-pointer--visible-down",We=n.forwardRef((e,s)=>{const t=J();return n.createElement("div",{ref:s,className:"userflowjs-out-of-viewport-pointer",style:{zIndex:t+2}},n.createElement(Ne,{icon:Re}))});function ze({subjectPosition:e,pointerRef:s,viewportClipRect:t}){const o=s.current;if(!o)return null;const l=o.getBoundingClientRect(),p=Ie(Fe());let a=e.direction,c,u;return a==null?null:(a==="down"&&t.bottom<l.height/2?a="up":a==="up"&&t.top>p&&(a="down"),c=e.left+e.width/2-l.width/2,u=a==="down"?t.bottom-l.height:t.top,{direction:a,left:c,top:u})}function Y(e,s){const t=e.current;t&&(t.classList.toggle(qe,s!=null),s&&(t.style.left=s.left+"px",t.style.top=s.top+"px",t.classList.toggle(Ve,s.direction==="up"),t.classList.toggle(He,s.direction==="down")))}const Ye="userflowjs-fixed-widget--visible",$e=({theme:e})=>{const{step:s}=M();return n.createElement(n.Fragment,null,s.beacons.map(t=>n.createElement(Ge,{key:t.id,beacon:t,theme:e})))},Ge=({beacon:e,theme:s})=>{const{session:t}=M(),o=J(),l=d.useRef(null),p=d.useRef(null),a=Te(e.hiddenCondition),c=d.useMemo(()=>Z(e.selector,t.data),[e.selector,t.data]),u=d.useCallback(({targetRect:i,clipEl:r,viewportClipRect:E})=>{const b=Ke({beacon:e,beaconRef:l,clipEl:r,viewportClipRect:E,targetRect:i,theme:s}),w=b&&ze({subjectPosition:b.pointerSubjectPosition,pointerRef:p,viewportClipRect:E});ye(()=>{$(l,b),Y(p,w)})},[e]),m=d.useCallback(()=>{$(l,null),Y(p,null)},[]);return Se({selector:a?null:c,targetMoved:u,targetLost:m}),n.createElement(n.Fragment,null,n.createElement("div",{ref:l,className:"userflowjs-beacon userflowjs-beacon--pulse userflowjs-beacon--for-flow userflowjs-fixed-widget",style:{zIndex:o+2}},n.createElement("div",{className:"userflowjs-beacon__ring"}),n.createElement("div",{className:"userflowjs-beacon__ring"})),n.createElement(We,{ref:p}))};function Ke({beacon:e,beaconRef:s,clipEl:t,viewportClipRect:o,targetRect:l,theme:p}){if(!s.current||l.width===0||l.height===0)return null;const c=p.beaconSize,u=p.beaconSize,m=De(t);let i=0,r=0;switch(e.placement){case"top-left":case"left":case"bottom-left":i=l.left;break;case"top":case"center":case"bottom":i=l.left+l.width/2;break;default:i=l.left+l.width;break}switch(e.placement){case"left":case"center":case"right":r=l.top+l.height/2;break;case"bottom-left":case"bottom":case"bottom-right":r=l.top+l.height;break;default:r=l.top;break}i-=c/2,r-=u/2,i+=e.offsetX,r+=e.offsetY,i=Math.max(i,m.left-(t===document.documentElement?0:t.scrollLeft)),r=Math.max(r,m.top-(t===document.documentElement?0:t.scrollTop));const E=i+c,b=r+u,w=Math.min(32,.5*u);let h;b<o.top+w?h="up":r>o.bottom-w?h="down":h=null;const T=h==null;return{top:r,right:E,bottom:b,left:i,width:c,height:u,pointerSubjectPosition:{direction:h,left:i,width:c},visible:T}}function $(e,s){const t=e.current;t&&(t.classList.toggle(Ye,s!=null),s&&(t.style.transform=`translate3d(${s.left}px, ${s.top}px, 0)`,t.style.visibility=s.visible?"visible":"hidden"))}const Xe=()=>{const{t:e}=_(),s=D(),{restart:t}=R(),{session:o,step:l}=M(),p=l.theme||o.version.theme,a=l.selector,c=!a||a.type===de.AUTO&&!a.autoData,u=()=>s.endFlow(o,{endReason:B.USER_CLOSED});return n.createElement(n.Fragment,null,n.createElement(K,{draftMode:o.draftMode,close:u}),o.draftMode&&c?n.createElement("div",{className:"userflowjs-bubble-content"},n.createElement("div",{className:"userflowjs-bubble-alert p-like"},n.createElement("span",{className:"userflowjs-bubble-alert__label"},"Preview-only tip"),"No tooltip target selected yet. Please go back to the Builder and select a tooltip target in ",n.createElement("b",null,"Step ",l.idx+1)," of"," ",n.createElement("b",null,o.flow.name),".")):o.draftMode&&p.tooltipMissingBehavior===x.END?n.createElement("div",{className:"userflowjs-bubble-content"},n.createElement("div",{className:"userflowjs-bubble-alert p-like"},n.createElement("p",null,n.createElement("span",{className:"userflowjs-bubble-alert__label"},"Preview-only tip"),"The tooltip target element in ",n.createElement("b",null,"Step ",l.idx+1)," of"," ",n.createElement("b",null,o.flow.name)," was not found within"," ",p.tooltipMissingToleranceSeconds," ",parseFloat(p.tooltipMissingToleranceSeconds)===1?"second":"seconds","."),n.createElement("p",null,"For regular users, the flow will auto-dismiss when this happens."),n.createElement("p",null,"If you are on the right page, then try reselecting the element in the Builder."),n.createElement("p",null,"Read more in our"," ",n.createElement("a",{href:"https://userflow.com/docs/trouble/element-not-found",target:"_blank",rel:"noopener noreferrer"},"Element not found guide"),"."))):n.createElement(n.Fragment,null,n.createElement("div",{className:"userflowjs-bubble-content"},o.draftMode&&n.createElement("div",{className:"userflowjs-bubble-alert p-like"},n.createElement("span",{className:"userflowjs-bubble-alert__label"},"Preview-only tip"),"The tooltip target element in ",n.createElement("b",null,"Step ",l.idx+1)," of"," ",n.createElement("b",null,o.flow.name)," was not found on the page. If you are on the right page, then try reselecting the element in the Builder."),n.createElement("p",null,n.createElement("b",null,e("tooltipTargetMissing.line1"))),n.createElement("p",null,e("tooltipTargetMissing.line2"))),n.createElement("div",{className:"userflowjs-bubble-buttons"},n.createElement(W,{appearance:"primary",onClick:t,text:e("menu.restart")}),n.createElement(W,{appearance:"default",onClick:u,text:e("menu.close")}))))},A="flowsMuted",Dt=({session:e,checklistSession:s,resourceCenterEmbedsChecklist:t})=>{const o=D(),[l,p]=d.useState(!1),[a,c]=d.useState(null),[u,m]=d.useReducer(Je,void 0,()=>{const f=e,g=O(f);return{...Ze,session:f,step:g,muted:!!C.getItem(A),autoFocusRequested:te(g)}}),{session:i,step:r,speechPlaying:E,contentType:b}=u,{version:w}=i,h=L(r);let T=0;r.questions.some(f=>f.type===pe.NPS)&&(T=420);const v=Ce(r.theme||w.theme),S=d.useMemo(()=>{let f=v.bubbleY;const g=s?.version.theme;return!t&&s&&g&&s.version.checklist?.launcherEnabled&&r.appearance===k.BUBBLE&&g.checklistLauncherPlacement===v.bubblePlacement&&(v.avatarType===fe.NONE||g.checklistLauncherX<v.bubbleX+v.avatarSize)&&(f=Math.max(v.bubbleY,g.checklistLauncherY+g.checklistLauncherHeight+v.bubbleY)),{...v,bubbleWidth:Math.max(v.bubbleWidth,T),bubbleY:f}},[t,s,r.appearance,v,T]);d.useEffect(()=>{i!==e&&m({kind:"updateSession",session:e});const f=g=>{g.session.id===i.id&&m({kind:"goToStep",stepId:g.step.id})};return o.on("gotostep",f),()=>{o.off("gotostep",f)}},[o,i,e]);const se=d.useMemo(()=>({dispatch:m,restart:()=>{o.goToStep(i,ee(i)),m({kind:"showFlow"})}}),[o,m,i]),re=d.useMemo(()=>r.selector&&Z(r.selector,i.data),[r.selector,i.data]),le=d.useCallback(()=>{ke(o,i,r.actions)},[o,i,r.actions]);d.useEffect(()=>{u.muted?C.setItem(A,"true"):C.removeItem(A)},[u.muted]);const j=i.locale?i.locale.standardLocaleId:S.languageId;d.useEffect(()=>{Be.changeLanguage(j)},[j]);const[U,ae]=d.useState(!1),ie=d.useCallback(f=>{ae(f),f&&o.send({kind:"ReportTooltipTargetMissing",sessionId:i.id,stepId:r.id}),f&&S.tooltipMissingBehavior===x.END&&!i.draftMode&&o.endFlow(i,{endReason:B.TOOLTIP_TARGET_MISSING})},[o,i,r.id,S.tooltipMissingBehavior]);return d.useEffect(()=>{if(!l||!u.autoFocusRequested)return;!o.originalActiveElement&&o.originalActiveElement!==a?.ownerDocument.defaultView?.frameElement&&(o.originalActiveElement=document.activeElement);let f=a?.querySelector('button:not([tabindex="-1"]):not(.userflowjs-bubble-toolbar-button), [tabindex]:not([tabindex="-1"]):not(.userflowjs-bubble-toolbar-button), input, textarea');if(f&&f.matches(".userflowjs-bubble-buttons button:not(.userflowjs-bubble-button--primary)")){const g=a?.querySelector(".userflowjs-bubble-buttons .userflowjs-bubble-button--primary");g&&(f=g)}f&&typeof f.focus=="function"&&f.focus({preventScroll:!0}),m({kind:"autoFocused"})},[o,a,l,u.autoFocusRequested]),d.useEffect(()=>{const f=a?.ownerDocument.defaultView;if(!f)return;const g=()=>{m({kind:"focusOut"}),delete o.originalActiveElement},y=()=>{m({kind:"focusIn"})};return window.addEventListener("focusin",g),f.addEventListener("focusin",y),()=>{window.removeEventListener("focusin",g),f.removeEventListener("focusin",y)}},[a,o]),d.useEffect(()=>{if(!h||!a)return;const f=a.ownerDocument.defaultView,g=f?f.document:document,y=I=>{if(I.key==="Escape"&&!w.closeDisabled)o.endFlow(i,{endReason:B.USER_CLOSED});else if(I.key==="Tab"){const N=a.querySelectorAll('button:not([tabindex="-1"]), [tabindex]:not([tabindex="-1"]), input, textarea'),q=N[0],V=N[N.length-1],H=g.activeElement;I.shiftKey?H===q&&(I.preventDefault(),V.focus()):H===V&&(I.preventDefault(),q.focus())}};return window.addEventListener("keydown",y),f?.addEventListener("keydown",y),()=>{window.removeEventListener("keydown",y),f?.removeEventListener("keydown",y)}},[h,o,i,a,w.closeDisabled]),d.useEffect(()=>{if(u.scrollToTopRequested){if(a?.ownerDocument.defaultView?.frameElement){const f=a?.ownerDocument.body;f&&(f.scrollTop=0)}m({kind:"scrolledToTop"})}},[u.scrollToTopRequested,a]),n.createElement(oe.Provider,{value:se},n.createElement(ne.Provider,{value:u},n.createElement(Me.Provider,{value:i},n.createElement(Le,null,n.createElement(Ee,{company:i.flow.company,theme:S,position:"fixed",stepKey:r.crossVersionId,stepAppearance:r.appearance,width:r.width,backgroundImageUrl:b==="flow"&&!U&&r.backgroundAsset?r.backgroundAsset.assetUrl:null,tooltipSelector:re,tooltipPlacement:r.tooltipPlacement,backdrop:r.backdrop,tooltipTargetBlocked:r.tooltipTargetBlocked,backdropPadding:r.backdropPadding,onTooltipTargetClick:le,onTooltipTargetMissingChange:ie,onModalBackdropClick:r.appearance===k.MODAL&&S.modalBackdropOnclick===me.DISMISS&&!w.closeDisabled?()=>o.endFlow(i,{endReason:B.USER_CLOSED}):void 0,speaking:E,minimizeOnAvatarClick:!0,autoHide3pEnabled:!0,onVisibleChange:p,bubbleFrameRootRef:c,confettiEnabled:r.confettiEnabled,rootChildren:f=>n.createElement(Qe,{...f,theme:S})},b==="menu"?n.createElement(Pe,null):U&&S.tooltipMissingBehavior!==x.BUBBLE?n.createElement(Xe,null):n.createElement(xe,{theme:S}))))))},Qe=({visible:e,bubbleFrame:s,theme:t})=>{const o=M(),{step:l}=o,p=o.session.currentStep&&o.session.currentStep.id,[a,c]=d.useState(!1),u=d.useRef(p);return d.useEffect(()=>{e?c(!0):u.current!==p&&c(!1),u.current=p},[p,e]),n.createElement(n.Fragment,null,(e||a)&&o.contentType==="flow"&&n.createElement(n.Fragment,null,n.createElement(_e,{bubbleFrame:s,theme:t}),n.createElement($e,{theme:t})),l.triggers.map(m=>n.createElement(Ae,{key:m.id,trigger:m})))},Ze={muted:!1,speechPlaying:!1,contentType:"flow",autoFocusRequested:!1,hasFocus:!1,scrollToTopRequested:!1,shouldLabelDialog:!0};function Je(e,s){switch(s.kind){case"updateSession":{let t;return s.session.id===e.session.id?t=s.session.version.steps.find(({crossVersionId:o})=>o===e.step.crossVersionId)||O(s.session):t=O(s.session),{...e,session:s.session,step:t}}case"goToStep":{const t=e.session.version.steps.find(o=>o.id===s.stepId);return t?{...e,step:t,contentType:"flow",autoFocusRequested:e.hasFocus||te(t),scrollToTopRequested:!0,shouldLabelDialog:!e.hasFocus}:e}case"toggleMuted":return{...e,muted:!e.muted};case"speechPlaying":return{...e,speechPlaying:!0};case"speechStopped":return{...e,speechPlaying:!1};case"showFlow":return{...e,contentType:"flow",autoFocusRequested:!0,scrollToTopRequested:!0};case"showMenu":return{...e,contentType:"menu",autoFocusRequested:!0,scrollToTopRequested:!0};case"autoFocused":return{...e,autoFocusRequested:!1};case"focusIn":return{...e,hasFocus:!0};case"focusOut":return{...e,hasFocus:!1};case"scrolledToTop":return{...e,scrollToTopRequested:!1}}}function O(e){const{currentStep:s}=e,{steps:t}=e.version;if(s){const o=t.find(({crossVersionId:l})=>l===s.crossVersionId);if(!o)throw new G("Session points to an unknown step: "+s.crossVersionId);return o}else return ee(e)}function ee(e){const s=e.version.steps[0];if(!s)throw new G("Session has no current step and its version has no start step");return s}function te(e){return L(e)}function L(e){return e.appearance===k.MODAL||e.appearance===k.BUBBLE&&e.backdrop||e.appearance===k.TOOLTIP&&e.tooltipTargetBlocked}const oe=d.createContext(null),ne=d.createContext(null);function R(){return d.useContext(oe)}function M(){return d.useContext(ne)}export{Dt as FlowApp,ne as FlowStateContext,Dt as default,Ze as initialFlowState,L as isStepModal,R as useFlowDispatch,M as useFlowState};
|
|
5
|
+
`));break}}function a(c){c.forEach(u=>p(u))}return a(e.children),t.join("").trim().replace(new RegExp(" ","g")," ").replace(new RegExp("\b","g"),"")}const _e=({bubbleFrame:e,theme:s})=>{const t=D(),{dispatch:o}=L(),{muted:l,session:p,step:a}=M(),c=t.getAudio();d.useEffect(()=>{const r=()=>{o({kind:"speechPlaying"})},E=()=>{o({kind:"speechStopped"})};return c.addEventListener("playing",r),c.addEventListener("ended",E),c.addEventListener("pause",E),()=>{c.removeEventListener("playing",r),c.removeEventListener("ended",E),c.removeEventListener("pause",E),c.pause(),c.src="",o({kind:"speechStopped"})}},[o,c]),d.useEffect(()=>{if(t.audioReady)return;const r=e&&Ue(e)?e.contentWindow:null,E=()=>{window.removeEventListener("mousedown",b),r&&r.removeEventListener("mousedown",b)},b=()=>{E(),t.playAudio(null)};return window.addEventListener("mousedown",b),r&&r.addEventListener("mousedown",b),E},[e,t]);const u=d.useRef(p),m=d.useRef(s),i=d.useRef(a);return d.useEffect(()=>{u.current=p,m.current=s,i.current=a},[p,s,a]),d.useEffect(()=>{if(!t.audioReady||l){t.pauseAudio();return}let r=!1;return(async()=>{if(await new Promise(w=>setTimeout(w,1)),r)return;const b=await je(t,u.current,m.current,i.current);r||b&&t.playAudio(b)})(),()=>{r=!0}},[l,t,a.id,s.voiceType,s.syntheticVoice]),null};async function je(e,s,t,o){if(t.voiceType===P.SYNTHETIC&&typeof t.syntheticVoice=="string"&&o.content){e.ensureIdentified();const l=Q(s.data),p=Oe(o.content,l);return e.getStepSpeech(t.syntheticVoice,p)}else if(t.voiceType===P.MANUAL&&o.speechAsset)return o.speechAsset.assetUrl;return null}function Ue(e){return e.tagName==="IFRAME"}const qe="userflowjs-out-of-viewport-pointer--visible",Ve="userflowjs-out-of-viewport-pointer--visible-up",He="userflowjs-out-of-viewport-pointer--visible-down",We=n.forwardRef((e,s)=>{const t=J();return n.createElement("div",{ref:s,className:"userflowjs-out-of-viewport-pointer",style:{zIndex:t+2}},n.createElement(Ne,{icon:Le}))});function ze({subjectPosition:e,pointerRef:s,viewportClipRect:t}){const o=s.current;if(!o)return null;const l=o.getBoundingClientRect(),p=Fe(Ie());let a=e.direction,c,u;return a==null?null:(a==="down"&&t.bottom<l.height/2?a="up":a==="up"&&t.top>p&&(a="down"),c=e.left+e.width/2-l.width/2,u=a==="down"?t.bottom-l.height:t.top,{direction:a,left:c,top:u})}function Y(e,s){const t=e.current;t&&(t.classList.toggle(qe,s!=null),s&&(t.style.left=s.left+"px",t.style.top=s.top+"px",t.classList.toggle(Ve,s.direction==="up"),t.classList.toggle(He,s.direction==="down")))}const Ye="userflowjs-fixed-widget--visible",$e=({theme:e})=>{const{step:s}=M();return n.createElement(n.Fragment,null,s.beacons.map(t=>n.createElement(Ge,{key:t.id,beacon:t,theme:e})))},Ge=({beacon:e,theme:s})=>{const{session:t}=M(),o=J(),l=d.useRef(null),p=d.useRef(null),a=Te(e.hiddenCondition),c=d.useMemo(()=>Z(e.selector,t.data),[e.selector,t.data]),u=d.useCallback(({targetRect:i,clipEl:r,viewportClipRect:E})=>{const b=Xe({beacon:e,beaconRef:l,clipEl:r,viewportClipRect:E,targetRect:i,theme:s}),w=b&&ze({subjectPosition:b.pointerSubjectPosition,pointerRef:p,viewportClipRect:E});ye(()=>{$(l,b),Y(p,w)})},[e]),m=d.useCallback(()=>{$(l,null),Y(p,null)},[]);return Se({selector:a?null:c,targetMoved:u,targetLost:m}),n.createElement(n.Fragment,null,n.createElement("div",{ref:l,className:"userflowjs-beacon userflowjs-beacon--pulse userflowjs-beacon--for-flow userflowjs-fixed-widget",style:{zIndex:o+2}},n.createElement("div",{className:"userflowjs-beacon__ring"}),n.createElement("div",{className:"userflowjs-beacon__ring"})),n.createElement(We,{ref:p}))};function Xe({beacon:e,beaconRef:s,clipEl:t,viewportClipRect:o,targetRect:l,theme:p}){if(!s.current||l.width===0||l.height===0)return null;const c=p.beaconSize,u=p.beaconSize,m=De(t);let i=0,r=0;switch(e.placement){case"top-left":case"left":case"bottom-left":i=l.left;break;case"top":case"center":case"bottom":i=l.left+l.width/2;break;default:i=l.left+l.width;break}switch(e.placement){case"left":case"center":case"right":r=l.top+l.height/2;break;case"bottom-left":case"bottom":case"bottom-right":r=l.top+l.height;break;default:r=l.top;break}i-=c/2,r-=u/2,i+=e.offsetX,r+=e.offsetY,i=Math.max(i,m.left-(t===document.documentElement?0:t.scrollLeft)),r=Math.max(r,m.top-(t===document.documentElement?0:t.scrollTop));const E=i+c,b=r+u,w=Math.min(32,.5*u);let h;b<o.top+w?h="up":r>o.bottom-w?h="down":h=null;const T=h==null;return{top:r,right:E,bottom:b,left:i,width:c,height:u,pointerSubjectPosition:{direction:h,left:i,width:c},visible:T}}function $(e,s){const t=e.current;t&&(t.classList.toggle(Ye,s!=null),s&&(t.style.transform=`translate3d(${s.left}px, ${s.top}px, 0)`,t.style.visibility=s.visible?"visible":"hidden"))}const Ke=()=>{const{t:e}=_(),s=D(),{restart:t}=L(),{session:o,step:l}=M(),p=l.theme||o.version.theme,a=l.selector,c=!a||a.type===de.AUTO&&!a.autoData,u=()=>s.endFlow(o,{endReason:B.USER_CLOSED});return n.createElement(n.Fragment,null,n.createElement(X,{draftMode:o.draftMode,close:u}),o.draftMode&&c?n.createElement("div",{className:"userflowjs-bubble-content"},n.createElement("div",{className:"userflowjs-bubble-alert p-like"},n.createElement("span",{className:"userflowjs-bubble-alert__label"},"Preview-only tip"),"No tooltip target selected yet. Please go back to the Builder and select a tooltip target in ",n.createElement("b",null,"Step ",l.idx+1)," of"," ",n.createElement("b",null,o.flow.name),".")):o.draftMode&&p.tooltipMissingBehavior===x.END?n.createElement("div",{className:"userflowjs-bubble-content"},n.createElement("div",{className:"userflowjs-bubble-alert p-like"},n.createElement("p",null,n.createElement("span",{className:"userflowjs-bubble-alert__label"},"Preview-only tip"),"The tooltip target element in ",n.createElement("b",null,"Step ",l.idx+1)," of"," ",n.createElement("b",null,o.flow.name)," was not found within"," ",p.tooltipMissingToleranceSeconds," ",parseFloat(p.tooltipMissingToleranceSeconds)===1?"second":"seconds","."),n.createElement("p",null,"For regular users, the flow will auto-dismiss when this happens."),n.createElement("p",null,"If you are on the right page, then try reselecting the element in the Builder."),n.createElement("p",null,"Read more in our"," ",n.createElement("a",{href:"https://userflow.com/docs/trouble/element-not-found",target:"_blank",rel:"noopener noreferrer"},"Element not found guide"),"."))):n.createElement(n.Fragment,null,n.createElement("div",{className:"userflowjs-bubble-content"},o.draftMode&&n.createElement("div",{className:"userflowjs-bubble-alert p-like"},n.createElement("span",{className:"userflowjs-bubble-alert__label"},"Preview-only tip"),"The tooltip target element in ",n.createElement("b",null,"Step ",l.idx+1)," of"," ",n.createElement("b",null,o.flow.name)," was not found on the page. If you are on the right page, then try reselecting the element in the Builder."),n.createElement("p",null,n.createElement("b",null,e("tooltipTargetMissing.line1"))),n.createElement("p",null,e("tooltipTargetMissing.line2"))),n.createElement("div",{className:"userflowjs-bubble-buttons"},n.createElement(W,{appearance:"primary",onClick:t,text:e("menu.restart")}),n.createElement(W,{appearance:"default",onClick:u,text:e("menu.close")}))))},A="flowsMuted",Dt=({session:e,checklistSession:s,resourceCenterEmbedsChecklist:t})=>{const o=D(),[l,p]=d.useState(!1),[a,c]=d.useState(null),[u,m]=d.useReducer(Je,void 0,()=>{const f=e,g=O(f);return{...Ze,session:f,step:g,muted:!!C.getItem(A),autoFocusRequested:te(g)}}),{session:i,step:r,speechPlaying:E,contentType:b}=u,{version:w}=i,h=R(r);let T=0;r.questions.some(f=>f.type===pe.NPS)&&(T=420);const v=Ce(r.theme||w.theme),S=d.useMemo(()=>{let f=v.bubbleY;const g=s?.version.theme;return!t&&s&&g&&s.version.checklist?.launcherEnabled&&r.appearance===k.BUBBLE&&g.checklistLauncherPlacement===v.bubblePlacement&&(v.avatarType===fe.NONE||g.checklistLauncherX<v.bubbleX+v.avatarSize)&&(f=Math.max(v.bubbleY,g.checklistLauncherY+g.checklistLauncherHeight+v.bubbleY)),{...v,bubbleWidth:Math.max(v.bubbleWidth,T),bubbleY:f}},[t,s,r.appearance,v,T]);d.useEffect(()=>{i!==e&&m({kind:"updateSession",session:e});const f=g=>{g.session.id===i.id&&m({kind:"goToStep",stepId:g.step.id})};return o.on("gotostep",f),()=>{o.off("gotostep",f)}},[o,i,e]);const se=d.useMemo(()=>({dispatch:m,restart:()=>{o.goToStep(i,ee(i)),m({kind:"showFlow"})}}),[o,m,i]),re=d.useMemo(()=>r.selector&&Z(r.selector,i.data),[r.selector,i.data]),le=d.useCallback(()=>{ke(o,i,r.actions)},[o,i,r.actions]);d.useEffect(()=>{u.muted?C.setItem(A,"true"):C.removeItem(A)},[u.muted]);const j=i.locale?i.locale.standardLocaleId:S.languageId;d.useEffect(()=>{Be.changeLanguage(j)},[j]);const[U,ae]=d.useState(!1),ie=d.useCallback(f=>{ae(f),f&&o.send({kind:"ReportTooltipTargetMissing",sessionId:i.id,stepId:r.id}),f&&S.tooltipMissingBehavior===x.END&&!i.draftMode&&o.endFlow(i,{endReason:B.TOOLTIP_TARGET_MISSING})},[o,i,r.id,S.tooltipMissingBehavior]);return d.useEffect(()=>{if(!l||!u.autoFocusRequested)return;!o.originalActiveElement&&o.originalActiveElement!==a?.ownerDocument.defaultView?.frameElement&&(o.originalActiveElement=document.activeElement);let f=a?.querySelector('button:not([tabindex="-1"]):not(.userflowjs-bubble-toolbar-button), [tabindex]:not([tabindex="-1"]):not(.userflowjs-bubble-toolbar-button), input, textarea');if(f&&f.matches(".userflowjs-bubble-buttons button:not(.userflowjs-bubble-button--primary)")){const g=a?.querySelector(".userflowjs-bubble-buttons .userflowjs-bubble-button--primary");g&&(f=g)}f&&typeof f.focus=="function"&&f.focus({preventScroll:!0}),m({kind:"autoFocused"})},[o,a,l,u.autoFocusRequested]),d.useEffect(()=>{const f=a?.ownerDocument.defaultView;if(!f)return;const g=()=>{m({kind:"focusOut"}),delete o.originalActiveElement},y=()=>{m({kind:"focusIn"})};return window.addEventListener("focusin",g),f.addEventListener("focusin",y),()=>{window.removeEventListener("focusin",g),f.removeEventListener("focusin",y)}},[a,o]),d.useEffect(()=>{if(!h||!a)return;const f=a.ownerDocument.defaultView,g=f?f.document:document,y=F=>{if(F.key==="Escape"&&!w.closeDisabled)o.endFlow(i,{endReason:B.USER_CLOSED});else if(F.key==="Tab"){const N=a.querySelectorAll('button:not([tabindex="-1"]), [tabindex]:not([tabindex="-1"]), input, textarea'),q=N[0],V=N[N.length-1],H=g.activeElement;F.shiftKey?H===q&&(F.preventDefault(),V.focus()):H===V&&(F.preventDefault(),q.focus())}};return window.addEventListener("keydown",y),f?.addEventListener("keydown",y),()=>{window.removeEventListener("keydown",y),f?.removeEventListener("keydown",y)}},[h,o,i,a,w.closeDisabled]),d.useEffect(()=>{if(u.scrollToTopRequested){if(a?.ownerDocument.defaultView?.frameElement){const f=a?.ownerDocument.body;f&&(f.scrollTop=0)}m({kind:"scrolledToTop"})}},[u.scrollToTopRequested,a]),n.createElement(oe.Provider,{value:se},n.createElement(ne.Provider,{value:u},n.createElement(Me.Provider,{value:i},n.createElement(Re,null,n.createElement(Ee,{company:i.flow.company,theme:S,position:"fixed",stepKey:r.crossVersionId,stepAppearance:r.appearance,width:r.width,backgroundImageUrl:b==="flow"&&!U&&r.backgroundAsset?r.backgroundAsset.assetUrl:null,tooltipSelector:re,tooltipPlacement:r.tooltipPlacement,backdrop:r.backdrop,tooltipTargetBlocked:r.tooltipTargetBlocked,backdropPadding:r.backdropPadding,onTooltipTargetClick:le,onTooltipTargetMissingChange:ie,onModalBackdropClick:r.appearance===k.MODAL&&S.modalBackdropOnclick===me.DISMISS&&!w.closeDisabled?()=>o.endFlow(i,{endReason:B.USER_CLOSED}):void 0,speaking:E,minimizeOnAvatarClick:!0,autoHide3pEnabled:!0,onVisibleChange:p,bubbleFrameRootRef:c,confettiEnabled:r.confettiEnabled,rootChildren:f=>n.createElement(Qe,{...f,theme:S})},b==="menu"?n.createElement(Pe,null):U&&S.tooltipMissingBehavior!==x.BUBBLE?n.createElement(Ke,null):n.createElement(xe,{theme:S}))))))},Qe=({visible:e,bubbleFrame:s,theme:t})=>{const o=M(),{step:l}=o,p=o.session.currentStep&&o.session.currentStep.id,[a,c]=d.useState(!1),u=d.useRef(p);return d.useEffect(()=>{e?c(!0):u.current!==p&&c(!1),u.current=p},[p,e]),n.createElement(n.Fragment,null,(e||a)&&o.contentType==="flow"&&n.createElement(n.Fragment,null,n.createElement(_e,{bubbleFrame:s,theme:t}),n.createElement($e,{theme:t})),l.triggers.map(m=>n.createElement(Ae,{key:m.id,trigger:m})))},Ze={muted:!1,speechPlaying:!1,contentType:"flow",autoFocusRequested:!1,hasFocus:!1,scrollToTopRequested:!1,shouldLabelDialog:!0};function Je(e,s){switch(s.kind){case"updateSession":{let t;return s.session.id===e.session.id?t=s.session.version.steps.find(({crossVersionId:o})=>o===e.step.crossVersionId)||O(s.session):t=O(s.session),{...e,session:s.session,step:t}}case"goToStep":{const t=e.session.version.steps.find(o=>o.id===s.stepId);return t?{...e,step:t,contentType:"flow",autoFocusRequested:e.hasFocus||te(t),scrollToTopRequested:!0,shouldLabelDialog:!e.hasFocus}:e}case"toggleMuted":return{...e,muted:!e.muted};case"speechPlaying":return{...e,speechPlaying:!0};case"speechStopped":return{...e,speechPlaying:!1};case"showFlow":return{...e,contentType:"flow",autoFocusRequested:!0,scrollToTopRequested:!0};case"showMenu":return{...e,contentType:"menu",autoFocusRequested:!0,scrollToTopRequested:!0};case"autoFocused":return{...e,autoFocusRequested:!1};case"focusIn":return{...e,hasFocus:!0};case"focusOut":return{...e,hasFocus:!1};case"scrolledToTop":return{...e,scrollToTopRequested:!1}}}function O(e){const{currentStep:s}=e,{steps:t}=e.version;if(s){const o=t.find(({crossVersionId:l})=>l===s.crossVersionId);if(!o)throw new G("Session points to an unknown step: "+s.crossVersionId);return o}else return ee(e)}function ee(e){const s=e.version.steps[0];if(!s)throw new G("Session has no current step and its version has no start step");return s}function te(e){return R(e)}function R(e){return e.appearance===k.MODAL||e.appearance===k.BUBBLE&&e.backdrop||e.appearance===k.TOOLTIP&&e.tooltipTargetBlocked}const oe=d.createContext(null),ne=d.createContext(null);function L(){return d.useContext(oe)}function M(){return d.useContext(ne)}export{Dt as FlowApp,ne as FlowStateContext,Dt as default,Ze as initialFlowState,R as isStepModal,L as useFlowDispatch,M as useFlowState};
|
|
6
6
|
//# sourceMappingURL=FlowApp.js.map
|
package/FlowChrome.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import{S as we,T as Ee,
|
|
2
|
-
`,{type:c.type,autoData:pt,excludeText:c.excludeText,precision:c.precision,text:c.text,css:c.css})}Ct(),i.tooltipTargetMissing=!0,Ot.current()}},S)}Ot.current()},[a,E,c,t.tooltipMissingToleranceSeconds]),be=l.useCallback(i=>{const S=I.current;Ct(),S.tooltipTargetParams&&S.tooltipTargetParams.targetEl!==i.targetEl&&(S.tooltipPlacement=null),S.tooltipTargetParams=i,z({forceUpdatePosition:!0})},[z]);_e({selector:a===y.TOOLTIP&&c||null,targetMoved:be,targetLost:de,onTargetClick:B});const me=l.useCallback(()=>z({forceAppearanceLayout:!0}),[z]);Pe(me),l.useEffect(()=>{if(!X||R||typeof ce!="function")return;let i;const S=new ce(()=>{i||(i=window.requestAnimationFrame(()=>{i=void 0,Ot.current()}))});return S.observe(X,{childList:!0,attributes:!0,subtree:!0}),()=>{S.disconnect(),i&&window.cancelAnimationFrame(i)}},[X,R]);const{startConfetti:pe}=Ue({stepType:a,theme:t,bubbleFrame:lt.current,isBubbleVisible:Z,confettiDelay:400,zIndex:_t});l.useEffect(()=>{Z&&ot&<.current&&pe(!0)},[ot,s,Z]),l.useLayoutEffect(()=>{Ot.current()}),l.useLayoutEffect(()=>{U==="absolute"&&z({forceAppearanceLayout:!0})},[U,g,L]);const mt=i=>{i.preventDefault(),i.stopPropagation()};return He(t,!!O&&$===y.BUBBLE),p.createElement("div",{ref:dt,"data-testid":"flow-chrome",className:"userflowjs-flow-chrome userflowjs-theme-root",style:Be(t),dir:nt},p.createElement("div",{className:"userflowjs-bubble",ref:ht,style:{zIndex:ft}},p.createElement("div",{className:Yt({"userflowjs-bubble-outline":!0,[`userflowjs-bubble-outline--bubble-placement-${(t.bubblePlacement||"").toLowerCase().replace(/_/,"-")}`]:!0,"userflowjs-bubble-outline--minimizable":!!F,"userflowjs-bubble-outline--minimized":A})},p.createElement("div",{className:"userflowjs-bubble__frame-wrapper",..._},p.createElement(ne,{className:"userflowjs-bubble__frame",elRef:lt,stylesheet:Ne,theme:t,onStylesheetsLoad:At,noIframe:R,title:a.toLowerCase()},p.createElement("div",{className:"userflowjs-bubble-frame-root",ref:i=>{M&&M(i),Pt(i)},style:T?{backgroundImage:`url("${encodeURI(T)}")`}:void 0},r,e.flowBranding&&!f&&p.createElement("div",{className:"userflowjs-bubble-made-with-userflow"},p.createElement("div",{className:"userflowjs-bubble-made-with-userflow__absolute"},p.createElement(at,{company:e},p.createElement(ke,null),p.createElement("div",null,"Made with Userflow"))))))),p.createElement("div",{ref:gt,className:"userflowjs-bubble__avatar-notch"})),p.createElement(ne,{className:Yt({"userflowjs-bubble__avatar":!0,"userflowjs-bubble__avatar--minimizable":!!F,"userflowjs-bubble__avatar--speaking":!!D}),elRef:Tt,stylesheet:Fe,theme:t,onStylesheetsLoad:w,noIframe:R,ariaHidden:!0,title:a.toLowerCase()},p.createElement("div",{className:Yt({"userflowjs-avatar-frame-root":!0,"userflowjs-avatar-frame-root--minimizable":!!F}),onClick:F?()=>st(i=>!i):void 0},p.createElement(Ve,{theme:t}))),p.createElement("div",{ref:wt,className:"userflowjs-bubble__tooltip-notch"})),p.createElement("div",{ref:Et,className:"userflowjs-tooltip-backdrop",onMouseDown:mt,style:{zIndex:J,pointerEvents:W?void 0:"none"}}),p.createElement("div",{ref:Lt,className:"userflowjs-tooltip-block",onMouseDown:mt,style:{zIndex:J}}),p.createElement("div",{ref:yt,className:"userflowjs-tooltip-block",onMouseDown:mt,style:{zIndex:J}}),p.createElement("div",{ref:vt,className:"userflowjs-tooltip-block",onMouseDown:mt,style:{zIndex:J}}),p.createElement("div",{ref:Bt,className:"userflowjs-tooltip-block",onMouseDown:mt,style:{zIndex:J}}),p.createElement("div",{ref:Mt,className:"userflowjs-modal-backdrop",onMouseDown:mt,onClick:K,style:{zIndex:J}}),k&&k({visible:Z,bubbleFrame:lt.current}))},Ve=({theme:e})=>{const t="https://js.userflow.com/cartoon-avatars-no-bg/";let o;return e.avatarType===ut.ASSET&&e.avatarAsset?o=e.avatarAsset.assetUrl:e.avatarType===ut.CARTOON&&e.avatarName?o=t+e.avatarName+".svg?3":e.avatarType===ut.URL&&e.avatarUrl?o=e.avatarUrl:o=t+"none.svg",p.createElement("img",{src:o,alt:""})},We=({company:e,children:t})=>p.createElement("a",{href:"https://userflow.com/?utm_source=made-with-userflow&utm_medium=link&utm_campaign=made-with-userflow-"+e.slug,target:"_blank",rel:"noopener noreferrer"},t);function ze({layoutState:{appearance:e,theme:t,backdrop:o,tooltipTargetMissing:g},width:L,position:s,absoluteWidth:a,root:d,bubble:T,bubbleFrameRoot:c,avatar:E,avatarNotch:v,modalBackdrop:C,dir:W}){const tt=s==="absolute"?a||1024:ct(Ht()),{avatarSize:P,bubblePlacement:B}=t;let x=t.bubbleWidth,K=null,et=null,D=`userflowjs-bubble-frame-root userflowjs-bubble-frame-root--appearance-${e?.toLowerCase()}`,R="hidden",u=null,F=null,O=null,M=null,_="userflowjs-bubble__avatar-notch",k="hidden",r=null,f=null,ot=null,U=null,H="userflowjs-modal-backdrop";switch((e===y.MODAL||!g&&e===y.BUBBLE&&o)&&(H+=" userflowjs-modal-backdrop--visible"),e){case y.BUBBLE:if(t.avatarType!==ut.NONE){R="",k="",B===N.TOP_LEFT||B===N.TOP_CENTER||B===N.TOP_RIGHT?(K=P+Rt,u=0,r=-2*Rt,_+=" userflowjs-bubble__avatar-notch--top"):(et=P+Rt,O=0,ot=-2*Rt,_+=" userflowjs-bubble__avatar-notch--bottom");const at=B===N.TOP_LEFT||B===N.TOP_CENTER||B===N.BOTTOM_LEFT||B===N.BOTTOM_CENTER||B===N.CENTER;W==="ltr"&&at||W==="rtl"&&!at?(M=0,U=P,_+=" userflowjs-bubble__avatar-notch--left"):(F=0,f=P,_+=" userflowjs-bubble__avatar-notch--right")}break;case y.MODAL:x=t.modalWidth,t.avatarType!==ut.NONE&&(R="",M=`calc(50% - ${P/2}px)`,u=-P/2);break;case y.TOOLTIP:x=t.tooltipWidth;break}L!=null&&(x=L),x=Math.min(x,tt-2*Xt),d.classList.toggle("userflowjs-flow-chrome--position-absolute",s==="absolute"),d.classList.toggle("userflowjs-flow-chrome--position-relative",s==="relative"),d.classList.toggle("userflowjs-flow-chrome--position-fixed",s==="fixed"),d.classList.toggle("userflowjs-flow-chrome--appearance-modal",e===y.MODAL);const G=e!=null&&e!==y.HIDDEN;d.style.position="",d.style.top="",d.style.left="",d.style.visibility=G?"":"hidden",d.style.animation=G?"":"none",m(T,"width",ct(x)),m(T,"padding-top",K),m(T,"padding-bottom",et),c.className=D,m(E,"width",ct(t.avatarSize)),m(E,"height",ct(t.avatarSize)),E.style.visibility=R,m(E,"top",u),m(E,"right",F),m(E,"bottom",O),m(E,"left",M),v.className=_,v.style.visibility=k,m(v,"top",r),m(v,"right",f),m(v,"bottom",ot),m(v,"left",U),C.className=H}function Ye({layoutState:e,animateIn:t,position:o,absoluteWidth:g,absoluteHeight:L,desiredTooltipPlacement:s,root:a,bubble:d,tooltipNotch:T,tooltipBackdrop:c,tooltipBlockTop:E,tooltipBlockRight:v,tooltipBlockBottom:C,tooltipBlockLeft:W,dir:tt}){const{appearance:P,theme:B,tooltipTargetParams:x,backdrop:K,backdropPadding:et}=e,{bubblePlacement:D}=B,R=Xt,u=B.tooltipNotchSize,F=10,{width:O,height:M}=d.getBoundingClientRect(),_=o==="absolute"?g||1024:ct(Ht()),k=o==="absolute"?L||768:ct(Gt());let r=0,f=0,ot="userflowjs-bubble__tooltip-notch",U="hidden",H=null,G=null,at=null,rt=null,ft="userflowjs-tooltip-backdrop",J=null,_t=null,Nt=null,nt=null,dt=null,ht=null,lt=null,X=null,Pt="userflowjs-tooltip-block userflowjs-tooltip-block--top",gt=null,Tt=null,wt="userflowjs-tooltip-block userflowjs-tooltip-block--right",Et=null,Lt=null,yt="userflowjs-tooltip-block userflowjs-tooltip-block--bottom",vt=null,Bt=null,Mt="userflowjs-tooltip-block userflowjs-tooltip-block--left",kt=null,jt=null;switch(P){case y.BUBBLE:{D===N.TOP_LEFT||D===N.BOTTOM_LEFT?r=B.bubbleX:D===N.TOP_CENTER||D===N.CENTER||D===N.BOTTOM_CENTER?r=(_-O)/2:r=_-O-B.bubbleX,D===N.TOP_LEFT||D===N.TOP_CENTER||D===N.TOP_RIGHT?f=B.bubbleY:D===N.CENTER?f=(k-M)/2:f=k-M-B.bubbleY,tt==="rtl"&&(r=_-r-O),r=Math.max(0,Math.min(_-O,r)),f=Math.max(0,Math.min(k-M,f));break}case y.MODAL:{let w=R;B.avatarType!==ut.NONE&&(w+=B.avatarSize/2),r=R+(_-R*2-O)/2,f=w+(k-w-R-M)/2;break}case y.TOOLTIP:{let w;if(x){let{targetRect:n,viewportClipRect:A}=x;if(o==="absolute"){const j=a.offsetParent.getBoundingClientRect();A={top:0,right:_,bottom:k,left:0},n={top:n.top-j.top,right:n.right-j.left,bottom:n.bottom-j.top,left:n.left-j.left,width:n.width,height:n.height}}let st=0;if(K){const{paddingTop:j,paddingRight:Z,paddingBottom:bt,paddingLeft:z}=$e(et);n={top:n.top-j,right:n.right+Z,bottom:n.bottom+bt,left:n.left-z,width:n.width+z+Z,height:n.height+j+bt},st=Math.min(j,Z,bt,z)}const I=n,$=B.backdropHighlightType==Oe.OUTSIDE?B.backdropHighlightSpread:0;if(K&&$&&(n={top:n.top-$,right:n.right+$,bottom:n.bottom+$,left:n.left-$,width:n.width+2*$,height:n.height+2*$}),w=Ge({targetRect:n,bubbleWidth:O,bubbleHeight:M,containerWidth:_,containerHeight:k,viewportClipRect:A,tooltipNotchSize:u,currentTooltipPlacement:e.tooltipPlacement,desiredTooltipPlacement:s}),w===b.BELOW||w===b.ABOVE?(r=n.left+n.width/2-O/2,r=Math.max(R,Math.min(_-O-R,r)),rt=Math.max(F,Math.min(O-F-u*2,n.left+n.width/2-u-r)),w===b.BELOW?H=-u*2:at=-u*2):w===b.RIGHT?(r=n.right+u,r=Math.max(r,A.left+u),r=Math.min(r,A.right+u),r=Math.max(r,u),r=Math.min(r,_-O)):(r=n.left-u-O,r=Math.max(r,A.left-O-u),r=Math.min(r,A.right-O-u),r=Math.max(r,0),r=Math.min(r,_-O-u)),w===b.LEFT||w===b.RIGHT?(f=n.top+n.height/2-M/2,f=Math.max(R,Math.min(k-M-R,f)),H=Math.max(F,Math.min(M-F-u*2,n.top+n.height/2-u-f)),w===b.LEFT?G=-u*2:rt=-u*2):w===b.BELOW?(f=n.bottom+u,f=Math.max(f,A.top+u),f=Math.min(f,A.bottom+u),f=Math.max(f,u),f=Math.min(f,k-M)):(f=n.top-u-M,f=Math.max(f,A.top-M-u),f=Math.min(f,A.bottom-M-u),f=Math.max(f,0),f=Math.min(f,k-M-u)),K){const j=window.getComputedStyle(x.targetEl);J=Math.max(0,I.top),_t=Math.max(0,_-I.right),Nt=Math.max(0,k-I.bottom),nt=Math.max(0,I.left),dt=Math.max(0,Ft(j.borderTopLeftRadius)+st),ht=Math.max(0,Ft(j.borderTopRightRadius)+st),lt=Math.max(0,Ft(j.borderBottomRightRadius)+st),X=Math.max(0,Ft(j.borderBottomLeftRadius)+st),gt=Math.max(0,I.right),Tt=Math.max(0,I.top),Et=Math.max(0,I.right),Lt=Math.max(0,I.bottom),vt=Math.max(0,I.left),Bt=Math.max(0,I.bottom),kt=Math.max(0,I.left),jt=Math.max(0,I.top)}}else w=s||b.BELOW,(w===b.BELOW||w===b.ABOVE)&&(rt=O/2-u,w===b.BELOW?H=-u*2:at=-u*2),(w===b.LEFT||w===b.RIGHT)&&(H=M/2-u,w===b.LEFT?G=-u*2:rt=-u*2);e.tooltipPlacement=w,ot+=` userflowjs-bubble__tooltip-notch--${w.toLowerCase()}`,U="",K&&(ft+=" userflowjs-tooltip-backdrop--visible",Pt+=" userflowjs-tooltip-block--visible",wt+=" userflowjs-tooltip-block--visible",yt+=" userflowjs-tooltip-block--visible",Mt+=" userflowjs-tooltip-block--visible");break}}d.style.transition="";let At=r,St=f;if(t&&(d.style.opacity="0",P===y.TOOLTIP))switch(e.tooltipPlacement){case b.BELOW:f+=24;break;case b.ABOVE:f-=24;break;case b.RIGHT:r+=24;break;case b.LEFT:r-=24;break}if(o!=="relative"&&ue(d,r,f),T.className=ot,T.style.visibility=U,m(T,"top",H),m(T,"right",G),m(T,"bottom",at),m(T,"left",rt),c.className=ft,m(c,"top",J),m(c,"right",_t),m(c,"bottom",Nt),m(c,"left",nt),m(c,"border-top-left-radius",dt),m(c,"border-top-right-radius",ht),m(c,"border-bottom-right-radius",lt),m(c,"border-bottom-left-radius",X),E.className=Pt,m(E,"width",gt),m(E,"height",Tt),v.className=wt,m(v,"left",Et),m(v,"height",Lt),C.className=yt,m(C,"left",vt),m(C,"top",Bt),W.className=Mt,m(W,"width",kt),m(W,"top",jt),t){d.offsetWidth;const w="opacity 250ms linear";P===y.TOOLTIP?d.style.transition=`${w}, transform 500ms cubic-bezier(0.25, 0.8, 0.5, 1)`:d.style.transition=w,d.style.opacity="1",o!=="relative"&&ue(d,At,St)}}function Ge({targetRect:e,bubbleWidth:t,bubbleHeight:o,containerWidth:g,containerHeight:L,viewportClipRect:s,tooltipNotchSize:a,currentTooltipPlacement:d,desiredTooltipPlacement:T}){if(e.bottom<=s.top)return o+a<=L-s.top?b.BELOW:b.ABOVE;if(e.top>=s.bottom)return o+a<=s.bottom?b.ABOVE:b.BELOW;if(e.right<=s.left)return t+a<=g-s.left?b.RIGHT:b.LEFT;if(e.left>=s.right)return t+a<=s.right?b.LEFT:b.RIGHT;const c=v=>{const C=e.left+e.width/2,W=C>=s.left&&C<=s.right,tt=e.top+e.height/2,P=tt>=s.top&&tt<=s.bottom;switch(v){case b.BELOW:return L-e.bottom>o+a&&W;case b.ABOVE:return e.top>o+a&&W;case b.RIGHT:return g-e.right>t+a&&P;case b.LEFT:return e.left>t+a&&P}};if(T&&c(T))return T;if(d&&c(d))return d;const E=[{placement:b.BELOW,dist:e.top},{placement:b.ABOVE,dist:L-e.bottom},{placement:b.RIGHT,dist:e.left},{placement:b.LEFT,dist:g-e.right}];E.sort((v,C)=>v.dist-C.dist);for(const{placement:v}of E)if(c(v))return v;return b.BELOW}function m(e,t,o){o==null?e.style.removeProperty(t):e.style.setProperty(t,typeof o=="number"?o+"px":o,"important")}function ue(e,t,o){t=Math.round(t),o=Math.round(o),e.style.transform=`translate3d(${t}px, ${o}px, 0px)`}function Xe(e){if(Y.customScrollIntoView){Y.customScrollIntoView(e);return}const{scrollPadding:t}=Y;if(t&&Ce(e)===document.scrollingElement){const o=t.top||0,g=t.right||0,L=t.bottom||0,s=t.left||0;let a=0,d=0;const T=e.getBoundingClientRect(),c=Ht(),E=Gt();if(T.top<o?a=T.top-o:T.bottom>E-L&&(a=T.bottom-E+L),T.left<s?d=T.left-s:T.right>c-g&&(d=T.right-c+g),a!=0||d!=0){window.scrollBy({top:a,left:d,behavior:"smooth"});return}}try{e.scrollIntoView({behavior:"smooth",block:"nearest"})}catch(o){console.warn("Userflow.js: scrollIntoView error (falling back to no options).",o),e.scrollIntoView()}}function $e(e){if(!e||e==="0")return{paddingTop:0,paddingRight:0,paddingBottom:0,paddingLeft:0};const t=e.trim().split(" ");if(t.length===1){const o=it(t[0]);return{paddingTop:o,paddingRight:o,paddingBottom:o,paddingLeft:o}}else if(t.length===2){const o=it(t[0]),g=it(t[1]);return{paddingTop:o,paddingRight:g,paddingBottom:o,paddingLeft:g}}else return{paddingTop:it(t[0]),paddingRight:it(t[1]),paddingBottom:it(t[2]),paddingLeft:it(t[3])}}function it(e){const t=parseInt(e,10);return isNaN(t)?0:t}export{co as B,uo as F};
|
|
1
|
+
import{S as we,T as Ee,N as Le,C as ye}from"./vendor.fortawesome.pro-regular-svg-icons.js";import{R as p,r as l}from"./vendor.react.js";import{D as Dt,a as ve,g as Be}from"./stylesheets.js";import"./vendor.core-js.js";import{u as fe}from"./vendor.react-i18next.js";import{F as ne}from"./Frame.js";import{G,r as y,v as ct,F as Me,w as N,a3 as Oe,a2 as b}from"./userflow.js";import{u as Ie,f as Re}from"./flow-host.styl.js";import{u as _e,b as Ne}from"./use-selector-element-monitoring.js";import{u as Pe}from"./use-window-resize.js";import{S as ke}from"./logomark.js";import{o as Gt}from"./vendor.obj-str.js";import{h as Yt,e as Ht,j as ut,t as je,l as ie,M as ue,q as Ft,u as Ce,p as xe}from"./roots.js";import{c as De}from"./vendor.canvas-confetti.js";(function(){try{var e=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},t=new Error().stack;t&&(e._sentryDebugIds=e._sentryDebugIds||{},e._sentryDebugIds[t]="de9fa3d4-ced7-4a24-8a59-3bbebcd73ff9",e._sentryDebugIdIdentifier="sentry-dbid-de9fa3d4-ced7-4a24-8a59-3bbebcd73ff9")}catch{}})();const uo=({draftMode:e,muted:t,toggleMuted:o,close:g,minimize:L})=>{const{t:s}=fe();return p.createElement("div",{className:"userflowjs-bubble-toolbar"},e&&p.createElement("div",{className:"userflowjs-bubble-draft"},typeof e=="string"?e:"Preview"),o&&p.createElement("button",{className:"userflowjs-bubble-toolbar-button",onClick:o,"aria-label":t?"Unmute":"Mute"},t?p.createElement(Dt,{icon:we}):p.createElement(Dt,{icon:Ee})),L&&p.createElement("button",{"data-testid":"minimize-button",className:"userflowjs-bubble-toolbar-button",onClick:L,"aria-label":"Minimize checklist"},p.createElement(Dt,{icon:Le})),g&&p.createElement("button",{"data-testid":"close-button",className:"userflowjs-bubble-toolbar-button",onClick:g,"aria-label":s("menu.close")},p.createElement(Dt,{icon:ye})))},Fe=new URL("avatar-frame.css",import.meta.url).href;function He(e,t){const o=window.Intercom;l.useEffect(()=>{if(!(!t||!e.autoHideIntercom||typeof o!="function"||G.autoHide3pDisabled)){try{o("update",{hide_default_launcher:!0})}catch(a){console.warn("Userflow.js: Error when hiding Intercom launcher",a)}return()=>{if(!G.autoHide3pDisabled)try{o("update",{hide_default_launcher:!1})}catch(a){console.warn("Userflow.js: Error when unhiding Intercom launcher",a)}}}},[o,e.autoHideIntercom,t]);const g=window.$crisp;l.useEffect(()=>{if(!(!t||!e.autoHideCrisp||!g||G.autoHide3pDisabled)){try{g.push(["do","chat:hide"])}catch(a){console.warn("Userflow.js: Error when hiding Crisp Chat",a)}return()=>{if(!G.autoHide3pDisabled)try{g.push(["do","chat:show"])}catch(a){console.warn("Userflow.js: Error when unhiding Crisp Chat",a)}}}},[g,e.autoHideCrisp,t]);const L=window.HubSpotConversations;l.useEffect(()=>{if(!(!t||!e.autoHideHubspot||!L||G.autoHide3pDisabled)){try{L.widget.remove()}catch(a){console.warn("Userflow.js: Error when hiding HubSpot Chat",a)}return()=>{if(!G.autoHide3pDisabled)try{L.widget.load()}catch(a){console.warn("Userflow.js: Error when unhiding HubSpot Chat",a)}}}},[L,e.autoHideHubspot,t]);const s=window.drift;l.useEffect(()=>{if(!(!t||!e.autoHideDrift||!s||G.autoHide3pDisabled)){try{s.api.widget.hide()}catch(a){console.warn("Userflow.js: Error when hiding Drift Chat",a)}return()=>{if(!G.autoHide3pDisabled)try{s.api.widget.show()}catch(a){console.warn("Userflow.js: Error when unhiding Drift Chat",a)}}}},[s,e.autoHideDrift,t])}const Q={PARTICLE_COUNT:400,ANIMATION_DELAY:400,DEFAULT_SPREAD:360,DEFAULT_GRAVITY:1,DEFAULT_TICKS:100,DEFAULT_Z_INDEX:5,TOOLTIP_DECAY:.85,TOOLTIP_START_VELOCITY:30},Ae={particleCount:Q.PARTICLE_COUNT,spread:Q.DEFAULT_SPREAD,gravity:Q.DEFAULT_GRAVITY,ticks:Q.DEFAULT_TICKS,angle:90,zIndex:Q.DEFAULT_Z_INDEX,disableForReducedMotion:!0},Se=e=>{if(!e)return{x:.5,y:.5};const t=e.getBoundingClientRect();return{x:t.left>=0?(t.left+t.width/2)/window.innerWidth:.5,y:t.top>=0?(t.top+t.height/2)/window.innerHeight:.5}},Ue=({bubbleFrame:e,isBubbleVisible:t,theme:o,stepType:g,onAnimationComplete:L,confettiDelay:s,zIndex:a})=>{const[d,T]=l.useState(!1);return l.useEffect(()=>{if(!t||!d||!o.confettiColors||o.confettiColors.length===0)return;const u=setTimeout(()=>{try{const E=Se(e),v={...Ae,colors:o.confettiColors||void 0,origin:E,zIndex:a??Q.DEFAULT_Z_INDEX,...g===y.TOOLTIP&&{decay:Q.TOOLTIP_DECAY,startVelocity:Q.TOOLTIP_START_VELOCITY}};De(v)}catch(E){console.warn("Error launching confetti:",E)}finally{L?.(),T(!1)}},s||Q.ANIMATION_DELAY);return()=>clearTimeout(u)},[t,d,o.confettiColors,e,g,L,s,a]),{startConfetti:T}},Xt=16,Rt=20,co=({company:e,theme:t,position:o,absoluteWidth:g,absoluteHeight:L,stepKey:s,stepAppearance:a,width:d,backgroundImageUrl:T,tooltipSelector:u,allowMissingTooltipTarget:E,tooltipPlacement:v,backdrop:C,tooltipTargetBlocked:W,backdropPadding:tt,zIndex:P,onTooltipTargetClick:B,onTooltipTargetMissingChange:x,onModalBackdropClick:K,onVisibleChange:et,speaking:D,noIframe:R,MadeWithUserflow:c,minimizeOnAvatarClick:F,autoHide3pEnabled:O,bubbleFrameRootRef:M,frameWrapperHtmlAttributes:_,rootChildren:k,children:r,isModalAnnouncement:f,confettiEnabled:ot})=>{const U=o||"absolute",H=v||null,Y=tt||"0",at=c||We,rt=Ie(),ft=U==="fixed"?P??rt+1:1,J=ft-1,_t=ft-2,{i18n:Nt}=fe(),nt=Nt.dir(),dt=l.useRef(null),ht=l.useRef(null),lt=l.useRef(null),[X,Pt]=l.useState(null),gt=l.useRef(null),Tt=l.useRef(null),wt=l.useRef(null),Et=l.useRef(null),Lt=l.useRef(null),yt=l.useRef(null),vt=l.useRef(null),Bt=l.useRef(null),Mt=l.useRef(null);l.useLayoutEffect(()=>{const i=dt.current.style;i.animation="none",i.visibility="hidden",i.position="absolute",i.top="-99999px",i.left="-99999px"},[]);const{loaded:kt}=ve(window,Re,t),[jt,At]=l.useState(!1),[St,w]=l.useState(!1),n=kt&&jt&&St;let[A,st]=l.useState(!1);a!==y.BUBBLE&&(F=!1,A=!1),l.useEffect(()=>{st(!1)},[s]);const I=l.useRef({appearance:null,width:null,theme:t,bubbleFrameHeight:0,backdrop:!1,backdropPadding:"0",prevTooltipTargetParams:null,tooltipTargetParams:null,desiredTooltipPlacement:null,tooltipPlacement:null,lastReportedTooltipTargetMissing:!1,tooltipTargetMissing:!1,tooltipTargetMissingTimeout:void 0,stepKeyScrolledIntoView:void 0,targetScrolledIntoView:null}),[$,j]=l.useState(null),Z=$!=null&&n;l.useEffect(()=>{et&&et(Z)},[et,Z]);const bt=l.useCallback(i=>{I.current.lastReportedTooltipTargetMissing!==i&&(I.current.lastReportedTooltipTargetMissing=i,x&&x(i))},[x]),z=l.useCallback(({forceAppearanceLayout:i,forceUpdatePosition:S}={})=>{const pt=dt.current,xt=ht.current,It=lt.current,Zt=Tt.current,qt=gt.current,Kt=wt.current,Jt=Et.current,Qt=Lt.current,te=yt.current,ee=vt.current,oe=Bt.current,ae=Mt.current;if(!pt||!xt||!It||!X||!Zt||!qt||!Kt||!Jt||!Qt||!te||!ee||!oe||!ae||!n)return;const h=I.current,{tooltipTargetParams:Ut}=h;xe();let V=a,le=!1;V===y.TOOLTIP&&!E&&!Ut&&(h.tooltipTargetMissing?(V=y.BUBBLE,le=!0):V=null);const se=V!==h.appearance,he=d!==h.width;if((i||se||he||t!==h.theme||C!=h.backdrop||Y!=h.backdropPadding||H!==h.desiredTooltipPlacement)&&(h.appearance=V,h.width=d,h.theme=t,h.backdrop=C,h.backdropPadding=Y,h.desiredTooltipPlacement=H,S=!0,ze({layoutState:h,width:d,position:U,absoluteWidth:g,root:pt,bubble:xt,bubbleFrameRoot:X,avatar:Zt,avatarNotch:qt,modalBackdrop:ae,dir:nt})),!R){const q=X.offsetHeight,Vt=Yt(),Wt=Ht()<800?0:Xt,ge=t.avatarType===ct.NONE?0:V===y.BUBBLE?Rt+t.avatarSize:V===y.MODAL?t.avatarSize/2:0,re=Vt-2*Wt-ge,zt=Math.min(q,re);if(V&&zt!==h.bubbleFrameHeight){if(h.bubbleFrameHeight=zt,m(It,"height",ut(zt)),je(It)&&It.contentDocument){const Te=It.contentDocument.documentElement;Te.style.overflowY=q<=re?"hidden":"scroll"}S=!0}}if(S&&V){let q=se;if(V===y.TOOLTIP){const Vt=h.tooltipTargetParams&&h.tooltipTargetParams.targetEl,Wt=h.prevTooltipTargetParams&&h.prevTooltipTargetParams.targetEl;Vt!==Wt&&(q=!0)}h.prevTooltipTargetParams=h.tooltipTargetParams,Ge({layoutState:h,animateIn:q,position:U,absoluteWidth:g,absoluteHeight:L,desiredTooltipPlacement:H,root:pt,bubble:xt,tooltipNotch:Kt,tooltipBackdrop:Jt,tooltipBlockTop:Qt,tooltipBlockRight:te,tooltipBlockBottom:ee,tooltipBlockLeft:oe,dir:nt})}if(V===y.TOOLTIP){const q=Ut&&Ut.targetEl;q&&h.stepKeyScrolledIntoView!==s&&h.targetScrolledIntoView!==q&&(h.stepKeyScrolledIntoView=s,h.targetScrolledIntoView=q,Xe(q))}else h.stepKeyScrolledIntoView=void 0,h.targetScrolledIntoView=null;bt(le),j(V)},[n,X,s,a,d,t,U,g,L,E,H,C,Y,R,bt,nt]),Ot=l.useRef(z);Ot.current=z;const $t=l.useRef(!1);l.useEffect(()=>{const i=()=>{$t.current=!0};return window.addEventListener("pagehide",i),()=>window.removeEventListener("pagehide",i)},[]);const Ct=()=>{window.clearTimeout(I.current.tooltipTargetMissingTimeout),I.current.tooltipTargetMissingTimeout=void 0};l.useEffect(()=>Ct,[]);const de=l.useCallback(()=>{const i=I.current;if(i.tooltipTargetParams=null,E||(i.tooltipPlacement=null),a!==y.TOOLTIP){Ct(),i.tooltipTargetMissing=!1;return}if(!E&&!i.tooltipTargetMissingTimeout){i.tooltipTargetMissing=!1;const S=u&&!ie(u)&&u.type===Me.AUTO&&!u.autoData?1:parseFloat(t.tooltipMissingToleranceSeconds)*1e3;i.tooltipTargetMissingTimeout=window.setTimeout(()=>{if(!$t.current){if(u&&!ie(u)){let pt=u.autoData;if(u.autoData)try{pt=JSON.parse(u.autoData)}catch{}console.warn(`Userflow.js: Tooltip target not found on page.
|
|
2
|
+
`,{type:u.type,autoData:pt,excludeText:u.excludeText,precision:u.precision,text:u.text,css:u.css})}Ct(),i.tooltipTargetMissing=!0,Ot.current()}},S)}Ot.current()},[a,E,u,t.tooltipMissingToleranceSeconds]),be=l.useCallback(i=>{const S=I.current;Ct(),S.tooltipTargetParams&&S.tooltipTargetParams.targetEl!==i.targetEl&&(S.tooltipPlacement=null),S.tooltipTargetParams=i,z({forceUpdatePosition:!0})},[z]);_e({selector:a===y.TOOLTIP&&u||null,targetMoved:be,targetLost:de,onTargetClick:B});const me=l.useCallback(()=>z({forceAppearanceLayout:!0}),[z]);Pe(me),l.useEffect(()=>{if(!X||R||typeof ue!="function")return;let i;const S=new ue(()=>{i||(i=window.requestAnimationFrame(()=>{i=void 0,Ot.current()}))});return S.observe(X,{childList:!0,attributes:!0,subtree:!0}),()=>{S.disconnect(),i&&window.cancelAnimationFrame(i)}},[X,R]);const{startConfetti:pe}=Ue({stepType:a,theme:t,bubbleFrame:lt.current,isBubbleVisible:Z,confettiDelay:400,zIndex:_t});l.useEffect(()=>{Z&&ot&<.current&&pe(!0)},[ot,s,Z]),l.useLayoutEffect(()=>{Ot.current()}),l.useLayoutEffect(()=>{U==="absolute"&&z({forceAppearanceLayout:!0})},[U,g,L]);const mt=i=>{i.preventDefault(),i.stopPropagation()};return He(t,!!O&&$===y.BUBBLE),p.createElement("div",{ref:dt,"data-testid":"flow-chrome",className:"userflowjs-flow-chrome userflowjs-theme-root",style:Be(t),dir:nt},p.createElement("div",{className:"userflowjs-bubble",ref:ht,style:{zIndex:ft}},p.createElement("div",{className:Gt({"userflowjs-bubble-outline":!0,[`userflowjs-bubble-outline--bubble-placement-${(t.bubblePlacement||"").toLowerCase().replace(/_/,"-")}`]:!0,"userflowjs-bubble-outline--minimizable":!!F,"userflowjs-bubble-outline--minimized":A})},p.createElement("div",{className:"userflowjs-bubble__frame-wrapper",..._},p.createElement(ne,{className:"userflowjs-bubble__frame",elRef:lt,stylesheet:Ne,theme:t,onStylesheetsLoad:At,noIframe:R,title:a.toLowerCase()},p.createElement("div",{className:"userflowjs-bubble-frame-root",ref:i=>{M&&M(i),Pt(i)},style:T?{backgroundImage:`url("${encodeURI(T)}")`}:void 0},r,e.flowBranding&&!f&&p.createElement("div",{className:"userflowjs-bubble-made-with-userflow"},p.createElement("div",{className:"userflowjs-bubble-made-with-userflow__absolute"},p.createElement(at,{company:e},p.createElement(ke,null),p.createElement("div",null,"Made with Userflow"))))))),p.createElement("div",{ref:gt,className:"userflowjs-bubble__avatar-notch"})),p.createElement(ne,{className:Gt({"userflowjs-bubble__avatar":!0,"userflowjs-bubble__avatar--minimizable":!!F,"userflowjs-bubble__avatar--speaking":!!D}),elRef:Tt,stylesheet:Fe,theme:t,onStylesheetsLoad:w,noIframe:R,ariaHidden:!0,title:a.toLowerCase()},p.createElement("div",{className:Gt({"userflowjs-avatar-frame-root":!0,"userflowjs-avatar-frame-root--minimizable":!!F}),onClick:F?()=>st(i=>!i):void 0},p.createElement(Ve,{theme:t}))),p.createElement("div",{ref:wt,className:"userflowjs-bubble__tooltip-notch"})),p.createElement("div",{ref:Et,className:"userflowjs-tooltip-backdrop",onMouseDown:mt,style:{zIndex:J,pointerEvents:W?void 0:"none"}}),p.createElement("div",{ref:Lt,className:"userflowjs-tooltip-block",onMouseDown:mt,style:{zIndex:J}}),p.createElement("div",{ref:yt,className:"userflowjs-tooltip-block",onMouseDown:mt,style:{zIndex:J}}),p.createElement("div",{ref:vt,className:"userflowjs-tooltip-block",onMouseDown:mt,style:{zIndex:J}}),p.createElement("div",{ref:Bt,className:"userflowjs-tooltip-block",onMouseDown:mt,style:{zIndex:J}}),p.createElement("div",{ref:Mt,className:"userflowjs-modal-backdrop",onMouseDown:mt,onClick:K,style:{zIndex:J}}),k&&k({visible:Z,bubbleFrame:lt.current}))},Ve=({theme:e})=>{const t="https://js.userflow.com/cartoon-avatars-no-bg/";let o;return e.avatarType===ct.ASSET&&e.avatarAsset?o=e.avatarAsset.assetUrl:e.avatarType===ct.CARTOON&&e.avatarName?o=t+e.avatarName+".svg?3":e.avatarType===ct.URL&&e.avatarUrl?o=e.avatarUrl:o=t+"none.svg",p.createElement("img",{src:o,alt:""})},We=({company:e,children:t})=>p.createElement("a",{href:"https://userflow.com/?utm_source=made-with-userflow&utm_medium=link&utm_campaign=made-with-userflow-"+e.slug,target:"_blank",rel:"noopener noreferrer"},t);function ze({layoutState:{appearance:e,theme:t,backdrop:o,tooltipTargetMissing:g},width:L,position:s,absoluteWidth:a,root:d,bubble:T,bubbleFrameRoot:u,avatar:E,avatarNotch:v,modalBackdrop:C,dir:W}){const tt=s==="absolute"?a||1024:ut(Ht()),{avatarSize:P,bubblePlacement:B}=t;let x=t.bubbleWidth,K=null,et=null,D=`userflowjs-bubble-frame-root userflowjs-bubble-frame-root--appearance-${e?.toLowerCase()}`,R="hidden",c=null,F=null,O=null,M=null,_="userflowjs-bubble__avatar-notch",k="hidden",r=null,f=null,ot=null,U=null,H="userflowjs-modal-backdrop";switch((e===y.MODAL||!g&&e===y.BUBBLE&&o)&&(H+=" userflowjs-modal-backdrop--visible"),e){case y.BUBBLE:if(t.avatarType!==ct.NONE){R="",k="",B===N.TOP_LEFT||B===N.TOP_CENTER||B===N.TOP_RIGHT?(K=P+Rt,c=0,r=-2*Rt,_+=" userflowjs-bubble__avatar-notch--top"):(et=P+Rt,O=0,ot=-2*Rt,_+=" userflowjs-bubble__avatar-notch--bottom");const at=B===N.TOP_LEFT||B===N.TOP_CENTER||B===N.BOTTOM_LEFT||B===N.BOTTOM_CENTER||B===N.CENTER;W==="ltr"&&at||W==="rtl"&&!at?(M=0,U=P,_+=" userflowjs-bubble__avatar-notch--left"):(F=0,f=P,_+=" userflowjs-bubble__avatar-notch--right")}break;case y.MODAL:x=t.modalWidth,t.avatarType!==ct.NONE&&(R="",M=`calc(50% - ${P/2}px)`,c=-P/2);break;case y.TOOLTIP:x=t.tooltipWidth;break}L!=null&&(x=L),x=Math.min(x,tt-2*Xt),d.classList.toggle("userflowjs-flow-chrome--position-absolute",s==="absolute"),d.classList.toggle("userflowjs-flow-chrome--position-relative",s==="relative"),d.classList.toggle("userflowjs-flow-chrome--position-fixed",s==="fixed"),d.classList.toggle("userflowjs-flow-chrome--appearance-modal",e===y.MODAL);const Y=e!=null&&e!==y.HIDDEN;d.style.position="",d.style.top="",d.style.left="",d.style.visibility=Y?"":"hidden",d.style.animation=Y?"":"none",m(T,"width",ut(x)),m(T,"padding-top",K),m(T,"padding-bottom",et),u.className=D,m(E,"width",ut(t.avatarSize)),m(E,"height",ut(t.avatarSize)),E.style.visibility=R,m(E,"top",c),m(E,"right",F),m(E,"bottom",O),m(E,"left",M),v.className=_,v.style.visibility=k,m(v,"top",r),m(v,"right",f),m(v,"bottom",ot),m(v,"left",U),C.className=H}function Ge({layoutState:e,animateIn:t,position:o,absoluteWidth:g,absoluteHeight:L,desiredTooltipPlacement:s,root:a,bubble:d,tooltipNotch:T,tooltipBackdrop:u,tooltipBlockTop:E,tooltipBlockRight:v,tooltipBlockBottom:C,tooltipBlockLeft:W,dir:tt}){const{appearance:P,theme:B,tooltipTargetParams:x,backdrop:K,backdropPadding:et}=e,{bubblePlacement:D}=B,R=Xt,c=B.tooltipNotchSize,F=10,{width:O,height:M}=d.getBoundingClientRect(),_=o==="absolute"?g||1024:ut(Ht()),k=o==="absolute"?L||768:ut(Yt());let r=0,f=0,ot="userflowjs-bubble__tooltip-notch",U="hidden",H=null,Y=null,at=null,rt=null,ft="userflowjs-tooltip-backdrop",J=null,_t=null,Nt=null,nt=null,dt=null,ht=null,lt=null,X=null,Pt="userflowjs-tooltip-block userflowjs-tooltip-block--top",gt=null,Tt=null,wt="userflowjs-tooltip-block userflowjs-tooltip-block--right",Et=null,Lt=null,yt="userflowjs-tooltip-block userflowjs-tooltip-block--bottom",vt=null,Bt=null,Mt="userflowjs-tooltip-block userflowjs-tooltip-block--left",kt=null,jt=null;switch(P){case y.BUBBLE:{D===N.TOP_LEFT||D===N.BOTTOM_LEFT?r=B.bubbleX:D===N.TOP_CENTER||D===N.CENTER||D===N.BOTTOM_CENTER?r=(_-O)/2:r=_-O-B.bubbleX,D===N.TOP_LEFT||D===N.TOP_CENTER||D===N.TOP_RIGHT?f=B.bubbleY:D===N.CENTER?f=(k-M)/2:f=k-M-B.bubbleY,tt==="rtl"&&(r=_-r-O),r=Math.max(0,Math.min(_-O,r)),f=Math.max(0,Math.min(k-M,f));break}case y.MODAL:{let w=R;B.avatarType!==ct.NONE&&(w+=B.avatarSize/2),r=R+(_-R*2-O)/2,f=w+(k-w-R-M)/2;break}case y.TOOLTIP:{let w;if(x){let{targetRect:n,viewportClipRect:A}=x;if(o==="absolute"){const j=a.offsetParent.getBoundingClientRect();A={top:0,right:_,bottom:k,left:0},n={top:n.top-j.top,right:n.right-j.left,bottom:n.bottom-j.top,left:n.left-j.left,width:n.width,height:n.height}}let st=0;if(K){const{paddingTop:j,paddingRight:Z,paddingBottom:bt,paddingLeft:z}=$e(et);n={top:n.top-j,right:n.right+Z,bottom:n.bottom+bt,left:n.left-z,width:n.width+z+Z,height:n.height+j+bt},st=Math.min(j,Z,bt,z)}const I=n,$=B.backdropHighlightType==Oe.OUTSIDE?B.backdropHighlightSpread:0;if(K&&$&&(n={top:n.top-$,right:n.right+$,bottom:n.bottom+$,left:n.left-$,width:n.width+2*$,height:n.height+2*$}),w=Ye({targetRect:n,bubbleWidth:O,bubbleHeight:M,containerWidth:_,containerHeight:k,viewportClipRect:A,tooltipNotchSize:c,currentTooltipPlacement:e.tooltipPlacement,desiredTooltipPlacement:s}),w===b.BELOW||w===b.ABOVE?(r=n.left+n.width/2-O/2,r=Math.max(R,Math.min(_-O-R,r)),rt=Math.max(F,Math.min(O-F-c*2,n.left+n.width/2-c-r)),w===b.BELOW?H=-c*2:at=-c*2):w===b.RIGHT?(r=n.right+c,r=Math.max(r,A.left+c),r=Math.min(r,A.right+c),r=Math.max(r,c),r=Math.min(r,_-O)):(r=n.left-c-O,r=Math.max(r,A.left-O-c),r=Math.min(r,A.right-O-c),r=Math.max(r,0),r=Math.min(r,_-O-c)),w===b.LEFT||w===b.RIGHT?(f=n.top+n.height/2-M/2,f=Math.max(R,Math.min(k-M-R,f)),H=Math.max(F,Math.min(M-F-c*2,n.top+n.height/2-c-f)),w===b.LEFT?Y=-c*2:rt=-c*2):w===b.BELOW?(f=n.bottom+c,f=Math.max(f,A.top+c),f=Math.min(f,A.bottom+c),f=Math.max(f,c),f=Math.min(f,k-M)):(f=n.top-c-M,f=Math.max(f,A.top-M-c),f=Math.min(f,A.bottom-M-c),f=Math.max(f,0),f=Math.min(f,k-M-c)),K){const j=window.getComputedStyle(x.targetEl);J=Math.max(0,I.top),_t=Math.max(0,_-I.right),Nt=Math.max(0,k-I.bottom),nt=Math.max(0,I.left),dt=Math.max(0,Ft(j.borderTopLeftRadius)+st),ht=Math.max(0,Ft(j.borderTopRightRadius)+st),lt=Math.max(0,Ft(j.borderBottomRightRadius)+st),X=Math.max(0,Ft(j.borderBottomLeftRadius)+st),gt=Math.max(0,I.right),Tt=Math.max(0,I.top),Et=Math.max(0,I.right),Lt=Math.max(0,I.bottom),vt=Math.max(0,I.left),Bt=Math.max(0,I.bottom),kt=Math.max(0,I.left),jt=Math.max(0,I.top)}}else w=s||b.BELOW,(w===b.BELOW||w===b.ABOVE)&&(rt=O/2-c,w===b.BELOW?H=-c*2:at=-c*2),(w===b.LEFT||w===b.RIGHT)&&(H=M/2-c,w===b.LEFT?Y=-c*2:rt=-c*2);e.tooltipPlacement=w,ot+=` userflowjs-bubble__tooltip-notch--${w.toLowerCase()}`,U="",K&&(ft+=" userflowjs-tooltip-backdrop--visible",Pt+=" userflowjs-tooltip-block--visible",wt+=" userflowjs-tooltip-block--visible",yt+=" userflowjs-tooltip-block--visible",Mt+=" userflowjs-tooltip-block--visible");break}}d.style.transition="";let At=r,St=f;if(t&&(d.style.opacity="0",P===y.TOOLTIP))switch(e.tooltipPlacement){case b.BELOW:f+=24;break;case b.ABOVE:f-=24;break;case b.RIGHT:r+=24;break;case b.LEFT:r-=24;break}if(o!=="relative"&&ce(d,r,f),T.className=ot,T.style.visibility=U,m(T,"top",H),m(T,"right",Y),m(T,"bottom",at),m(T,"left",rt),u.className=ft,m(u,"top",J),m(u,"right",_t),m(u,"bottom",Nt),m(u,"left",nt),m(u,"border-top-left-radius",dt),m(u,"border-top-right-radius",ht),m(u,"border-bottom-right-radius",lt),m(u,"border-bottom-left-radius",X),E.className=Pt,m(E,"width",gt),m(E,"height",Tt),v.className=wt,m(v,"left",Et),m(v,"height",Lt),C.className=yt,m(C,"left",vt),m(C,"top",Bt),W.className=Mt,m(W,"width",kt),m(W,"top",jt),t){d.offsetWidth;const w="opacity 250ms linear";P===y.TOOLTIP?d.style.transition=`${w}, transform 500ms cubic-bezier(0.25, 0.8, 0.5, 1)`:d.style.transition=w,d.style.opacity="1",o!=="relative"&&ce(d,At,St)}}function Ye({targetRect:e,bubbleWidth:t,bubbleHeight:o,containerWidth:g,containerHeight:L,viewportClipRect:s,tooltipNotchSize:a,currentTooltipPlacement:d,desiredTooltipPlacement:T}){if(e.bottom<=s.top)return o+a<=L-s.top?b.BELOW:b.ABOVE;if(e.top>=s.bottom)return o+a<=s.bottom?b.ABOVE:b.BELOW;if(e.right<=s.left)return t+a<=g-s.left?b.RIGHT:b.LEFT;if(e.left>=s.right)return t+a<=s.right?b.LEFT:b.RIGHT;const u=v=>{const C=e.left+e.width/2,W=C>=s.left&&C<=s.right,tt=e.top+e.height/2,P=tt>=s.top&&tt<=s.bottom;switch(v){case b.BELOW:return L-e.bottom>o+a&&W;case b.ABOVE:return e.top>o+a&&W;case b.RIGHT:return g-e.right>t+a&&P;case b.LEFT:return e.left>t+a&&P}};if(T&&u(T))return T;if(d&&u(d))return d;const E=[{placement:b.BELOW,dist:e.top},{placement:b.ABOVE,dist:L-e.bottom},{placement:b.RIGHT,dist:e.left},{placement:b.LEFT,dist:g-e.right}];E.sort((v,C)=>v.dist-C.dist);for(const{placement:v}of E)if(u(v))return v;return b.BELOW}function m(e,t,o){o==null?e.style.removeProperty(t):e.style.setProperty(t,typeof o=="number"?o+"px":o,"important")}function ce(e,t,o){t=Math.round(t),o=Math.round(o),e.style.transform=`translate3d(${t}px, ${o}px, 0px)`}function Xe(e){if(G.customScrollIntoView){G.customScrollIntoView(e);return}const{scrollPadding:t}=G;if(t&&Ce(e)===document.scrollingElement){const o=t.top||0,g=t.right||0,L=t.bottom||0,s=t.left||0;let a=0,d=0;const T=e.getBoundingClientRect(),u=Ht(),E=Yt();if(T.top<o?a=T.top-o:T.bottom>E-L&&(a=T.bottom-E+L),T.left<s?d=T.left-s:T.right>u-g&&(d=T.right-u+g),a!=0||d!=0){window.scrollBy({top:a,left:d,behavior:"smooth"});return}}try{e.scrollIntoView({behavior:"smooth",block:"nearest"})}catch(o){console.warn("Userflow.js: scrollIntoView error (falling back to no options).",o),e.scrollIntoView()}}function $e(e){if(!e||e==="0")return{paddingTop:0,paddingRight:0,paddingBottom:0,paddingLeft:0};const t=e.trim().split(" ");if(t.length===1){const o=it(t[0]);return{paddingTop:o,paddingRight:o,paddingBottom:o,paddingLeft:o}}else if(t.length===2){const o=it(t[0]),g=it(t[1]);return{paddingTop:o,paddingRight:g,paddingBottom:o,paddingLeft:g}}else return{paddingTop:it(t[0]),paddingRight:it(t[1]),paddingBottom:it(t[2]),paddingLeft:it(t[3])}}function it(e){const t=parseInt(e,10);return isNaN(t)?0:t}export{uo as B,co as F};
|
|
3
3
|
//# sourceMappingURL=FlowChrome.js.map
|
package/LauncherApp.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{R as i,r as u}from"./vendor.react.js";import{
|
|
1
|
+
import{R as i,r as u}from"./vendor.react.js";import{X as L,Y as l,Z as a,r as te,$ as re,a0 as p,a1 as K,a2 as N}from"./userflow.js";import{u as ne,m as oe,d as ae,S as ce,R as se,h as le,r as ie}from"./use-selector-element-monitoring.js";import{u as ue,i as de}from"./client-context.js";import{o as U}from"./vendor.obj-str.js";import{a as fe,b as he,g as Ee,D as Te,u as me}from"./stylesheets.js";import{w as pe,f as ge,L as be,S as Ce}from"./flow-host.styl.js";import"./vendor.core-js.js";import{F as Re,B as Le}from"./FlowChrome.js";import{g as we}from"./flow-condition-types.js";import{T as Ae}from"./Trigger.js";import{r as V}from"./roots.js";import"./vendor.object-assign.js";import"./vendor.phoenix.js";import"./vendor.uuid.js";import"./vendor.fortawesome.pro-solid-svg-icons.js";import"./vendor.react-i18next.js";import"./vendor.babel.runtime.js";import"./vendor.i18next.js";import"./vendor.fortawesome.pro-regular-svg-icons.js";import"./Frame.js";import"./vendor.react-dom.js";import"./vendor.scheduler.js";import"./use-window-resize.js";import"./logomark.js";import"./vendor.canvas-confetti.js";import"./vendor.date-fns.js";(function(){try{var t=typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},c=new Error().stack;c&&(t._sentryDebugIds=t._sentryDebugIds||{},t._sentryDebugIds[c]="6e9cf197-35a9-4345-900a-47c6179d1b17",t._sentryDebugIdIdentifier="sentry-dbid-6e9cf197-35a9-4345-900a-47c6179d1b17")}catch{}})();const ve=i.forwardRef(({appearance:t,icon:c,buttonText:d,theme:T,noAnimation:E,noFixed:w,onClick:e,onMouseEnter:s,onMouseLeave:o,noPointerEvents:n,zIndex:m},r)=>{const{loaded:C}=fe(window,ge,T),k=T&&t===L.BUTTON?T:null,{loaded:H}=he(window,k),I={"userflowjs-launcher":!0,"userflowjs-launcher--activate-on-click":!!e,"userflowjs-fixed-widget":!w},f={ref:r,style:{...Ee(T),zIndex:m||pe(be),pointerEvents:n?"none":void 0},onClick:e,onMouseEnter:s,onMouseLeave:o};if(!C||!H)return null;switch(t){case L.BEACON:return i.createElement("div",{className:U({...I,"userflowjs-beacon":!0,"userflowjs-beacon--pulse":!E,"userflowjs-beacon--pulse-still":!!E}),...f},i.createElement("div",{className:"userflowjs-beacon__ring"}),i.createElement("div",{className:"userflowjs-beacon__ring"}));case L.BUTTON:return i.createElement("div",{className:U({...I,"userflowjs-launcher--button":!0}),...f},d);case L.HIDDEN:return null;case L.ICON:return i.createElement("div",{className:U({...I,"userflowjs-launcher--icon":!0}),...f},i.createElement(Te,{icon:c||"solid/info-circle",size:T.launcherIconSize}))}}),Ie="userflowjs-fixed-widget--visible",nt=({session:t,active:c})=>{const d=ue(),{version:T}=t,E=t.id,w=t.flow.id,e=t.version.launcher,[s,o]=u.useState(null),n=me(T.theme),m=t.locale?t.locale.standardLocaleId:n.languageId;u.useEffect(()=>{de.changeLanguage(m)},[m]);const{activateOn:r}=e,C=e.activeWhileTooltipHover||e.buttons.length>0,k=e.hiddenWhileActive&&r!==l.LAUNCHER_HOVER,H=!c||!k,I=r===l.LAUNCHER_CLICK||r===l.TARGET_CLICK||r===l.LAUNCHER_TARGET_CLICK||C,f=u.useRef({}),A=u.useCallback(()=>{let h=null;const{targetEl:g,clipEl:b,viewportClipRect:F}=f.current,S=s;S&&(g&&b&&F&&(h=ke({targetEl:g,subjectEl:S,clipEl:b,viewportClipRect:F,position:e.targetPosition,subjectAnchor:e.appearance===L.BEACON?"center":"side"})),ie(()=>{Oe(S,h)}));let M;e.appearance===L.HIDDEN?M=!!g:M=!!h,M&&!f.current.seenTriggered&&!E&&(f.current.seenTriggered=!0,d.launcherSeen(w))},[s,e,d,E,w]);u.useLayoutEffect(()=>{A()},[A]);const _=u.useRef(!1),y=u.useRef(!1),P=u.useRef(!1),x=u.useRef(),W=()=>{_.current=!0,v()},z=()=>{_.current=!1,v()},Z=()=>{y.current=!0,v()},$=()=>{y.current=!1,v()},X=()=>{P.current=!0,v()},Y=()=>{P.current=!1,v()},v=()=>{O();const h=250;x.current=window.setTimeout(()=>B.current(),h)},O=u.useCallback(()=>{window.clearTimeout(x.current)},[]),G=()=>{if(r===l.LAUNCHER_CLICK||r===l.TARGET_CLICK||r===l.LAUNCHER_TARGET_CLICK)return;const h=r===l.LAUNCHER_HOVER||r===l.LAUNCHER_TARGET_HOVER,g=r===l.TARGET_HOVER||r===l.LAUNCHER_TARGET_HOVER;_.current&&(!k||!c)&&h||y.current&&g||P.current&&C?D():R()},B=u.useRef(G);B.current=G;const D=()=>{c||(O(),e.tooltipEnabled?d.activateLauncher(t):(d.activateLauncher(t),d.deactivateLauncher(t)),le(d,t,e.actions))},R=u.useCallback(()=>{c&&(O(),d.deactivateLauncher(t))},[c,d,t,O]),j=()=>{c?R():D()},q=u.useCallback(({targetEl:h,clipEl:g,viewportClipRect:b})=>{f.current.targetEl=h,f.current.clipEl=g,f.current.viewportClipRect=b,A()},[A]),J=u.useCallback(()=>{f.current.targetEl=void 0,f.current.clipEl=void 0,A(),R()},[A,R]);ne({selector:e.targetSelector,targetMoved:q,targetLost:J,onTargetMouseEnter:Z,onTargetMouseLeave:$,onTargetClick:r===l.TARGET_CLICK||r===l.LAUNCHER_TARGET_CLICK?j:void 0}),u.useEffect(()=>{if(!c)return;const h=g=>{const b=g.target;s&&s.contains(b)||(r===l.TARGET_CLICK||r===l.LAUNCHER_TARGET_CLICK)&&f.current.targetEl&&f.current.targetEl.contains(b)||R()};return window.addEventListener("click",h,{capture:!0}),()=>window.removeEventListener("click",h,{capture:!0})},[c,r,s,R]);const Q=Ne(e.tooltipPosition.side===a.AUTO?e.targetPosition:e.tooltipPosition),ee=u.useMemo(()=>e.content&&oe(ae(e.content),{buttons:e.buttons}),[e.content,e.buttons]);return i.createElement(ce.Provider,{value:t},H&&i.createElement(ve,{ref:o,appearance:e.appearance,icon:e.icon,buttonText:e.buttonText,theme:n,onClick:r===l.LAUNCHER_CLICK||r===l.LAUNCHER_TARGET_CLICK?j:void 0,onMouseEnter:W,onMouseLeave:z,noPointerEvents:r===l.TARGET_HOVER,zIndex:e.zIndex}),c&&i.createElement(Ce,null,i.createElement(Re,{company:t.flow.company,theme:n,position:"fixed",stepAppearance:te.TOOLTIP,width:e.tooltipWidth,tooltipSelector:e.tooltipAnchor===re.TARGET?f.current.targetEl:s,tooltipPlacement:Q,frameWrapperHtmlAttributes:{onMouseEnter:X,onMouseLeave:Y},rootChildren:()=>i.createElement(i.Fragment,null,e.triggers.map(h=>i.createElement(Ae,{key:h.id,trigger:h})))},i.createElement(Le,{draftMode:t.draftMode,close:I?R:void 0}),i.createElement("div",{className:"userflowjs-bubble-content"},i.createElement(se,{doc:ee,lookupAttribute:we(t.data),buttons:e.buttons})))))};function ke({targetEl:t,subjectEl:c,clipEl:d,viewportClipRect:T,position:E,subjectAnchor:w}){const e=V(t);if(e.width===0||e.height===0)return null;const s=c.getBoundingClientRect();let o=0,n=0,{side:m,align:r}=E;switch(m===a.AUTO&&(m=a.TOP,r=p.END),m){case a.TOP:n=e.top;break;case a.BOTTOM:n=e.bottom;break;case a.LEFT:o=e.left;break;case a.RIGHT:o=e.right;break}switch(m){case a.TOP:case a.BOTTOM:switch(r){case p.START:o=e.left;break;case p.CENTER:o=e.left+e.width/2;break;case p.END:o=e.right;break}break;case a.LEFT:case a.RIGHT:switch(r){case p.START:n=e.top;break;case p.CENTER:n=e.top+e.height/2;break;case p.END:n=e.bottom;break}break}switch(E.xUnit===K.PERCENT?o+=E.xOffset/100*e.width:o+=E.xOffset,E.yUnit===K.PERCENT?n+=E.yOffset/100*e.height:n+=E.yOffset,w){case"center":o-=s.width/2,n-=s.height/2;break;case"side":switch(m){case a.TOP:n-=s.height;break;case a.LEFT:o-=s.width;break}switch(m){case a.TOP:case a.BOTTOM:switch(r){case p.CENTER:o-=s.width/2;break;case p.END:o-=s.width;break}break;case a.LEFT:case a.RIGHT:switch(r){case p.CENTER:n-=s.height/2;break;case p.END:n-=s.height;break}break}}if(o+s.width<T.left||o>T.right||n+s.height<T.top||n>T.bottom)return null;const C=V(d);return o=Math.max(o,C.left-d.scrollLeft),n=Math.max(n,C.top-d.scrollTop),o=Math.round(o),n=Math.round(n),{left:o,top:n}}function Oe(t,c){t.classList.toggle(Ie,c!=null),c&&(t.style.transform=`translate3d(${c.left}px, ${c.top}px, 0)`)}function Ne(t){switch(t.side){case a.AUTO:return null;case a.TOP:return N.ABOVE;case a.BOTTOM:return N.BELOW;case a.LEFT:return N.LEFT;case a.RIGHT:return N.RIGHT}}export{nt as LauncherApp,nt as default};
|
|
2
2
|
//# sourceMappingURL=LauncherApp.js.map
|