@journeeze/sdk 0.1.0 → 0.3.0-rc.1

package/dist/widget-B6mR1J3P.js

@@ -1,118 +0,0 @@
-var $=Object.defineProperty;var N=(d,t,e)=>t in d?$(d,t,{enumerable:true,configurable:true,writable:true,value:e}):d[t]=e;var n=(d,t,e)=>N(d,typeof t!="symbol"?t+"":t,e);import{e as B,s as W,d as K,h as _,f as O,C as M,D as H,g as q,i as Y,j as G}from"./consent-DckCUvYR.js";import{i as R}from"./index-CwG2LrhO.js";import{c as J,s as V,p as X}from"./upload-Fu2qvSJV.js";import{m as jt,u as zt}from"./upload-Fu2qvSJV.js";import{s as Z,R as Q}from"./hook-DGWypoEO.js";import{d as tt,i as I,e as et,a as ot}from"./anchor-cPvFFTOS.js";import{feedbackChannel as it,widgetConfig as st}from"./feedback-CtH1a_kQ.js";const S="jz:preview",w="mask-audit";function nt(){try{const d=new URL(location.href),t=d.searchParams.get("jz_preview");return t===null?sessionStorage.getItem(S)===w:(d.searchParams.delete("jz_preview"),history.replaceState(history.state,"",d.href),t===w?sessionStorage.setItem(S,w):sessionStorage.removeItem(S),t===w)}catch{return false}}const U='<path d="M9 9h.01"/><path d="M15 9h.01"/>',rt={like:`<circle cx="12" cy="12" r="10"/><path d="M8 14s1.5 2 4 2 4-2 4-2"/>${U}`,dislike:`<circle cx="12" cy="12" r="10"/><path d="M16 16s-1.5-2-4-2-4 2-4 2"/>${U}`,understood:'<circle cx="12" cy="12" r="10"/><path d="m9 12 2 2 4-4"/>',confused:'<circle cx="12" cy="12" r="10"/><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"/><path d="M12 17h.01"/>',close:'<path d="M18 6 6 18"/><path d="m6 6 12 12"/>',persona:'<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/>',step:'<path d="M5 12h14"/><path d="m12 5 7 7-7 7"/>',info:'<circle cx="12" cy="12" r="10"/><path d="M12 16v-4"/><path d="M12 8h.01"/>'};function m(d,t=20){const e=document.createElement("template");return e.innerHTML=`<svg xmlns="http://www.w3.org/2000/svg" width="${t}" height="${t}" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">${rt[d]}</svg>`,e.content.firstElementChild}const at=`
-:host { all: initial; }
-.jz {
-  --jz-canvas:#F7F7F5; --jz-surface:#FFFFFF; --jz-raised:#F0F0EC; --jz-ink:#1D2024; --jz-muted:#5D636B;
-  --jz-faint:#8A9099; --jz-rule:rgb(29 32 36 / 12%); --jz-accent:#3D63C9; --jz-accent-ink:#FFFFFF;
-  --jz-accent-soft:rgb(61 99 201 / 10%); --jz-polished:#2F7D4F; --jz-broken:#B42318; --jz-confused:#6E4FC2;
-  --jz-shadow:0 1px 3px rgb(0 0 0 / 12%);
-  font: 400 13px/1.45 Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
-  color: var(--jz-ink); -webkit-font-smoothing: antialiased;
-}
-@media (prefers-color-scheme: dark) {
-  .jz { --jz-canvas:#111316; --jz-surface:#181B1F; --jz-raised:#20242A; --jz-ink:#E8EAED; --jz-muted:#A3A9B2;
-    --jz-faint:#6F7680; --jz-rule:rgb(232 234 237 / 12%); --jz-accent:#7F9CF0; --jz-accent-ink:#111316;
-    --jz-accent-soft:rgb(127 156 240 / 14%); --jz-confused:#A48BEA; --jz-polished:#5DBB84; }
-}
-.jz *, .jz *::before, .jz *::after { box-sizing: border-box; }
-/* Zero specificity: a component's own colour (.toggle, .primary, ...) must always win. */
-:where(.jz button) { font: inherit; color: inherit; cursor: pointer; }
-.jz :focus-visible { outline: 2px solid var(--jz-accent); outline-offset: 2px; }
-.mono { font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace; }
-.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
-
-.toggle { position:fixed; right:32px; bottom:32px; z-index:2147483646; height:44px; padding:0 16px; display:flex; align-items:center;
-  gap:8px; border:0; border-radius:999px; background:#1D2024; color:#FFFFFF; box-shadow:var(--jz-shadow); font-weight:500; }
-.toggle .dot { width:8px; height:8px; border-radius:50%; background:var(--jz-polished); }
-.toggle .exit { color:#8A9099; }
-.toggle:hover .exit { color:#FFFFFF; }
-
-.layer { position:fixed; inset:0; z-index:2147483640; pointer-events:none; }
-.hl { position:fixed; display:none; outline:1px solid var(--jz-accent); outline-offset:-1px; border-radius:2px; }
-.hl.masked { outline:1px dashed var(--jz-faint);
-  background:repeating-linear-gradient(45deg, rgb(138 144 153 / 10%) 0 4px, rgb(138 144 153 / 20%) 4px 8px); }
-.tag { position:absolute; left:0; top:-18px; padding:1px 6px; border-radius:2px; background:var(--jz-accent); color:#FFFFFF;
-  font-size:10px; line-height:16px; white-space:nowrap; max-width:280px; overflow:hidden; text-overflow:ellipsis; }
-.hl.masked .tag { background:var(--jz-muted); text-transform:uppercase; letter-spacing:.06em; }
-.pin { position:fixed; width:24px; height:24px; margin:-12px 0 0 -12px; border-radius:50%; display:flex; align-items:center;
-  justify-content:center; background:var(--jz-accent); color:#FFFFFF; font-size:12px; font-weight:500; box-shadow:var(--jz-shadow); }
-
-.pop, .sheet, .checkin, .toast { position:fixed; z-index:2147483645; background:var(--jz-surface); color:var(--jz-ink);
-  border:1px solid var(--jz-rule); box-shadow:var(--jz-shadow); }
-.pop { width:400px; max-width:calc(100vw - 32px); max-height:calc(100vh - 32px); overflow:auto; padding:24px; border-radius:10px;
-  animation: jz-in 180ms ease-out; }
-@keyframes jz-in { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:none; } }
-.pop-head { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:20px; }
-.pop h2 { margin:0; font-size:14px; font-weight:500; }
-.close { width:32px; height:32px; display:flex; align-items:center; justify-content:center; border:0; border-radius:6px;
-  background:transparent; color:var(--jz-faint); }
-.close:hover { color:var(--jz-ink); }
-.chips { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
-.chip { display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border-radius:999px; background:var(--jz-raised);
-  color:var(--jz-muted); font-size:11px; }
-.reactions { display:flex; border:1px solid var(--jz-rule); border-radius:8px; overflow:hidden; margin-bottom:20px; }
-.reaction { flex:1; min-height:56px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
-  padding:12px 4px; border:0; border-right:1px solid var(--jz-rule); background:transparent; color:var(--jz-muted); }
-.reaction:last-child { border-right:0; }
-.reaction:hover { background:var(--jz-canvas); }
-.reaction span { font-size:10px; font-weight:500; }
-.reaction[data-r="confused"] { color:var(--jz-confused); }
-.reaction[aria-checked="true"] { background:var(--jz-accent-soft); color:var(--jz-accent); }
-.reaction[data-r="confused"][aria-checked="true"] { background:rgb(110 79 194 / 10%); color:var(--jz-confused); }
-.comment { display:block; width:100%; height:112px; padding:16px; margin-bottom:20px; resize:none; border:1px solid var(--jz-rule);
-  border-radius:8px; background:var(--jz-surface); color:var(--jz-ink); font:inherit; }
-.comment::placeholder { color:var(--jz-faint); }
-.comment:focus { outline:none; box-shadow:0 0 0 1px var(--jz-accent); }
-.foot { display:flex; align-items:center; justify-content:space-between; gap:12px; }
-.shot { display:flex; align-items:center; gap:12px; min-width:0; }
-.thumb { flex:none; width:80px; height:48px; border-radius:8px; border:1px solid var(--jz-rule); background:var(--jz-canvas);
-  overflow:hidden; display:flex; align-items:center; justify-content:center; color:var(--jz-faint); font-size:8px; }
-.thumb img { width:100%; height:100%; object-fit:cover; }
-.thumb.hatch { background:repeating-linear-gradient(45deg, rgb(138 144 153 / 10%) 0 4px, rgb(138 144 153 / 20%) 4px 8px); }
-.shot-open { display:block; width:100%; height:100%; padding:0; border:0; background:transparent; }
-.optout-row { display:flex; align-items:center; gap:8px; margin-bottom:16px; color:var(--jz-muted); font-size:12px; }
-.optout-row[hidden] { display:none; }
-.note { font-size:11px; color:var(--jz-faint); line-height:1.3; }
-.shot-full { position:fixed; inset:0; z-index:2147483647; display:flex; align-items:center; justify-content:center; padding:24px; background:rgb(0 0 0 / 72%); }
-.shot-full img { max-width:100%; max-height:100%; object-fit:contain; border-radius:6px; background:var(--jz-surface); }
-.shot-full .close { position:absolute; top:16px; right:16px; background:var(--jz-surface); color:var(--jz-ink); }
-.primary { min-height:44px; padding:0 24px; border:0; border-radius:8px; background:var(--jz-accent); color:var(--jz-accent-ink); font-weight:500; }
-.primary:disabled { opacity:.45; cursor:not-allowed; }
-.secondary { min-height:44px; padding:0 16px; border:1px solid var(--jz-rule); border-radius:6px; background:transparent;
-  color:var(--jz-muted); font-weight:500; }
-
-.sheet { left:32px; bottom:32px; width:340px; max-width:calc(100vw - 32px); padding:24px; border-radius:10px; }
-.sheet h2 { display:flex; align-items:center; gap:8px; margin:0 0 12px; font-size:14px; font-weight:500; }
-.sheet h2 svg { color:var(--jz-accent); }
-.sheet p { margin:0 0 12px; color:var(--jz-muted); line-height:1.6; }
-.sheet ul { margin:0 0 20px; padding-left:18px; color:var(--jz-muted); }
-.row { display:flex; gap:8px; }
-.row > * { flex:1; }
-
-.checkin { right:32px; bottom:140px; display:flex; align-items:center; gap:8px; padding:8px 8px 8px 16px; border-radius:10px; }
-.checkin .secondary { min-height:36px; }
-.toast { right:32px; bottom:88px; padding:10px 16px; border-radius:10px; }
-.toast.err { border-color:var(--jz-broken); }
-
-@media (max-width: 479px) {
-  .toggle { right:24px; bottom:24px; height:48px; padding:0 20px; background:var(--jz-accent); color:var(--jz-accent-ink); }
-  .toggle .dot { background:var(--jz-accent-ink); }
-  .toggle .exit { color:inherit; opacity:.8; }
-  .pop { left:0 !important; right:0; top:auto !important; bottom:0; width:auto; max-width:none; max-height:85vh;
-    border-radius:16px 16px 0 0; border-width:1px 0 0; padding:12px 24px 34px; }
-  .pop::before { content:""; display:block; width:48px; height:4px; margin:0 auto 16px; border-radius:999px; background:var(--jz-raised); }
-  .chip { border-radius:4px; border:1px solid var(--jz-rule); }
-  .reactions { display:grid; grid-template-columns:repeat(4, 1fr); gap:12px; border:0; overflow:visible; }
-  .reaction { border:1px solid var(--jz-rule); border-radius:8px; padding:16px 4px; }
-  .reaction:last-child { border-right:1px solid var(--jz-rule); }
-  .reaction[aria-checked="true"] { border:2px solid var(--jz-accent); }
-  .reaction span { font-size:11px; }
-  .foot { flex-direction:column; align-items:stretch; }
-  .foot .primary { width:100%; min-height:52px; font-size:15px; }
-  .sheet { left:16px; right:16px; bottom:16px; width:auto; }
-  .toast { left:16px; right:16px; bottom:84px; }
-  .checkin { left:16px; right:16px; bottom:136px; }
-}
-@media (prefers-reduced-motion: reduce) {
-  .jz *, .jz *::before, .jz *::after { animation-duration:1ms !important; transition-duration:1ms !important; }
-}
-`,ct=[["like","Like"],["dislike","Dislike"],["understood","Understood"],["confused","Confused"]],dt=5e3;function s(d,t={},...e){const o=document.createElement(d);for(const[i,r]of Object.entries(t))r===void 0||r===false||o.setAttribute(i,r===true?"":r);return o.append(...e),o}function ht(d,t,e,o){const i={pagePath:W(t),device:d.device||tt(e)},r=a=>{const c=d[a];typeof c=="string"&&c.trim()!==""&&(i[a]=c.trim())};return r("persona"),r("journeyId"),r("journeyStep"),r("businessType"),r("state"),o!==void 0&&(i.tflowId=o),i}class lt{constructor(t,e,o){n(this,"options");n(this,"getContext");n(this,"exit");n(this,"host",s("div",{"data-journeeze":""}));n(this,"root");n(this,"shell",s("div",{class:"jz"}));n(this,"layer",s("div",{class:"layer"}));n(this,"highlight",s("div",{class:"hl"}));n(this,"tag",s("div",{class:"tag mono"}));n(this,"live",s("div",{class:"sr","aria-live":"polite"}));n(this,"toggle");n(this,"channel");n(this,"outbox");n(this,"endpoint");n(this,"cleanups",[]);n(this,"phase","consent");n(this,"config",{});n(this,"pinCount",0);n(this,"popover");n(this,"fullShot");n(this,"fullShotOpener");n(this,"consentSheet");n(this,"checkin");n(this,"toastEl");n(this,"toastTimer");n(this,"lastCtx");n(this,"lastWhere");n(this,"askedSteps",new Set);n(this,"objectUrls",[]);n(this,"disposed",false);n(this,"exitTimer");n(this,"screenshotsUnavailable",false);n(this,"uploadNotFound",0);n(this,"pending",new Set);n(this,"signals");n(this,"configReady",Promise.resolve());n(this,"configLoaded",false);n(this,"maskAuditOn");this.options=t,this.getContext=e,this.exit=o,this.endpoint=K(t),this.signals=Z(t,this.endpoint,e),this.root=this.host.attachShadow({mode:"closed"}),this.root.append(s("style",t.nonce?{nonce:t.nonce}:{},at),this.shell),this.toggle=s("button",{type:"button",class:"toggle","aria-pressed":"true","aria-label":"Feedback mode on. Exit feedback mode"},s("span",{class:"dot","aria-hidden":"true"}),s("span",{},"Feedback mode on"),s("span",{class:"exit","aria-hidden":"true"},"· Exit")),this.toggle.addEventListener("click",()=>this.exit());for(const i of["keydown","keyup","keypress"])this.shell.addEventListener(i,r=>this.onWidgetKey(r));this.highlight.append(this.tag),this.layer.append(this.highlight),this.shell.append(this.layer,this.toggle,this.live),this.channel=it(t,this.endpoint,{beforePersist:()=>this.stashPending(),onDropped:i=>this.toast(pt(i),true)}),this.outbox=this.channel.outbox,document.body.append(this.host),this.listen(window,"keydown",i=>this.onKey(i)),this.lastCtx={...e()},this.lastWhere=j(),this.configReady=this.loadConfig(),this.maskAuditOn=!!t.reviewerToken&&nt(),this.maskAuditOn&&this.configReady.then(()=>this.maskAudit()),_(O(t))?this.startPointing():this.showConsent()}api(){return{unmount:t=>this.dispose(t),contextChanged:()=>this.onContextChanged()}}listen(t,e,o,i=false,r=false){t.addEventListener(e,o,{capture:i,passive:r}),this.cleanups.push(()=>t.removeEventListener(e,o,{capture:i}))}dispose(t){if(!this.disposed){this.disposed=true,this.signals.stop(t);for(const e of this.cleanups.splice(0))e();this.exitTimer!==void 0&&clearTimeout(this.exitTimer),this.stashPending(),this.channel.dispose(),this.toastTimer!==void 0&&clearTimeout(this.toastTimer);for(const e of this.objectUrls.splice(0))URL.revokeObjectURL(e);this.host.remove()}}async loadConfig(){try{if(this.config=await st(this.endpoint,this.options.siteKey),this.configLoaded=true,this.config.consentText&&this.consentSheet){const t=this.consentSheet.querySelector("p");t&&(t.textContent=this.config.consentText)}this.config.enabled!==true&&(this.toast("Feedback isn't switched on for this site yet.",true),this.exitTimer=setTimeout(()=>{this.disposed||this.exit()},2500))}catch(t){t instanceof M&&t.status===404&&(this.toast("Feedback isn't set up on this site yet.",true),this.exitTimer=setTimeout(()=>{this.disposed||this.exit()},2500))}}showConsent(){this.phase="consent";const t=s("h2",{id:"jz-consent-title"},m("info",18),"Suggest an improvement"),e=s("button",{type:"button",class:"primary"},"Allow and continue"),o=s("button",{type:"button",class:"secondary"},"Not now"),i=s("div",{class:"sheet",role:"dialog","aria-modal":"false","aria-labelledby":"jz-consent-title"},t,s("p",{},this.config.consentText||(this.screenshotsAllowed()?H:q)),s("div",{class:"row"},e,o));e.addEventListener("click",()=>{Y(O(this.options)),i.remove(),this.consentSheet=void 0,this.startPointing(),this.toggle.focus()}),o.addEventListener("click",()=>this.exit()),this.trapTab(i),this.consentSheet=i,this.shell.append(i),e.focus()}startPointing(){this.phase="pointing",this.signals.start(this.configReady.then(()=>this.config)),this.announce("Feedback mode on. Click any part of the page to comment on it. Press Escape to exit."),this.listen(document,"pointermove",t=>this.onMove(t),true,true);for(const t of["pointerdown","mousedown","mouseup","pointerup"])this.listen(window,t,e=>this.swallow(e),true);for(const t of["touchstart","touchend"])this.listen(window,t,e=>{this.phase==="pointing"&&this.targetOf(e)&&e.stopPropagation()},true,true);this.listen(window,"click",t=>this.onClick(t),true),this.listen(window,"scroll",()=>this.reposition(),true,true),this.listen(window,"resize",()=>this.reposition(),false,true),this.outbox.flush()}targetOf(t){const e=t.composedPath();if(e.includes(this.host))return;const o=e[0];return o instanceof Element?o:void 0}swallow(t){this.phase!=="pointing"||!t.isTrusted||!this.targetOf(t)||(t.preventDefault(),t.stopPropagation())}onMove(t){const e=this.phase==="pointing"?this.targetOf(t):void 0;if(!e){this.highlight.style.display="none";return}const o=e.getBoundingClientRect(),i=R(e)||I(e);Object.assign(this.highlight.style,{display:"block",left:`${o.left}px`,top:`${o.top}px`,width:`${o.width}px`,height:`${o.height}px`}),this.highlight.classList.toggle("masked",i),this.tag.textContent=i?"Masked":et(e),this.tag.style.top=o.top<20?"0":"-18px"}onClick(t){if(this.phase!=="pointing"||!t.isTrusted)return;const e=this.targetOf(t);e&&(t.preventDefault(),t.stopPropagation(),t.stopImmediatePropagation(),this.highlight.style.display="none",!I(e)&&this.openPopover(e,t.clientX,t.clientY))}openPopover(t,e,o){this.phase="composing";const i=this.screenshotsUnavailable||!this.screenshotsAllowed()?Promise.resolve(void 0):this.configReady.then(()=>this.configLoaded?J(document.body,this.maskOptions()):void 0).catch(()=>{}),r=ot(t,e,o),a=s("div",{class:"pin","aria-hidden":"true"},String(++this.pinCount));let c;const h=s("h2",{id:"jz-pop-title"},"How does this feel?"),f=s("button",{type:"button",class:"close","aria-label":"Close without sending"},m("close")),x=s("div",{class:"chips"}),g=this.getContext(),D=j(),F=(l,u,p)=>x.append(s("span",{class:"chip","aria-label":`${u}: ${p}`},m(l,12),p));g.persona&&F("persona","Persona",g.persona),g.journeyStep&&F("step","Journey step",g.journeyStep);const C=s("div",{class:"reactions",role:"radiogroup","aria-label":"Reaction"}),E=ct.map(([l,u])=>{const p=s("button",{type:"button",class:"reaction",role:"radio","aria-checked":"false","data-r":l},m(l),s("span",{},u));return p.addEventListener("click",()=>{c=c===l?void 0:l;for(const L of E)L.setAttribute("aria-checked",String(L.dataset.r===c));z()}),C.append(p),p}),y=s("textarea",{class:"comment","aria-label":"Comment (optional)",placeholder:"What could be improved?",maxlength:"4000"}),v=s("div",{class:"thumb hatch mono"},"CAPTURING"),T=s("span",{class:"note"},"Masked fields are hidden"),A=s("input",{type:"checkbox",class:"optout"}),P=s("label",{class:"optout-row",hidden:true},A,"Don't include screenshot"),b=s("button",{type:"button",class:"primary"},"Send"),k=s("div",{class:"pop",role:"dialog","aria-modal":"false","aria-labelledby":"jz-pop-title"},s("div",{class:"pop-head"},h,f),x,C,y,P,s("div",{class:"foot"},s("div",{class:"shot"},v,T),b)),z=()=>{b.disabled=c===void 0&&y.value.trim()===""};y.addEventListener("input",z),z(),i.then(l=>{if(this.popover?.el===k)if(v.textContent="",l){const u=URL.createObjectURL(l);this.objectUrls.push(u),v.classList.remove("hatch");const p=s("button",{type:"button",class:"shot-open","aria-label":"View screenshot full size"},s("img",{referrerpolicy:"no-referrer",src:u,alt:"Screenshot of this page with masked fields hidden"}));p.addEventListener("click",()=>this.openFullShot(u,p)),v.append(p),P.hidden=false}else v.textContent="No screenshot attached",T.textContent="Screenshot unavailable; your feedback still sends"}),f.addEventListener("click",()=>this.closePopover()),b.addEventListener("click",()=>{if(b.disabled)return;b.disabled=true;const l=y.value.trim(),u=!A.checked;this.closePopover(),this.deliver(r,c,l,u?i:Promise.resolve(void 0),g,D)}),this.trapTab(k),this.popover={el:k,pin:a,target:t,anchor:r},this.layer.append(a),this.shell.append(k),this.reposition(),E[0]?.focus()}closePopover(){if(this.popover){this.closeFullShot(),this.popover.el.remove(),this.popover.pin.remove(),this.popover=void 0;for(const t of this.objectUrls.splice(0))URL.revokeObjectURL(t);this.phase="pointing",this.toggle.focus()}}openFullShot(t,e){if(this.fullShot)return;const o=s("button",{type:"button",class:"close","aria-label":"Close full-size screenshot"},m("close")),i=s("div",{class:"shot-full",role:"dialog","aria-modal":"true","aria-label":"Screenshot"},s("img",{referrerpolicy:"no-referrer",src:t,alt:"Screenshot of this page with masked fields hidden"}),o);o.addEventListener("click",()=>this.closeFullShot()),this.trapTab(i),this.fullShot=i,this.fullShotOpener=e,this.shell.append(i),o.focus()}closeFullShot(){const t=this.fullShot;if(!t)return;this.fullShot=void 0,t.remove();const e=this.fullShotOpener;this.fullShotOpener=void 0,e?.focus()}maskOptions(){const{maskSelectors:t,maskAllText:e}=this.options,o=Array.isArray(this.config.maskSelectors)?this.config.maskSelectors:[];return{...t?{maskSelectors:t}:{},...o.length?{configMaskSelectors:o}:{},...e?{maskAllText:e}:{}}}reposition(){const t=this.popover;if(!t||!t.target.isConnected)return;const e=t.target.getBoundingClientRect(),o=e.left+t.anchor.xRatio*e.width,i=e.top+t.anchor.yRatio*e.height;if(Object.assign(t.pin.style,{left:`${o}px`,top:`${i}px`}),window.innerWidth<480)return;const r=t.el.getBoundingClientRect(),a=16;let c=e.right+a;c+r.width>window.innerWidth-a&&(c=e.left-a-r.width),c<a&&(c=Math.min(Math.max(a,o+a),window.innerWidth-r.width-a));const h=Math.min(Math.max(a,i-24),window.innerHeight-r.height-a);Object.assign(t.el.style,{left:`${Math.max(a,c)}px`,top:`${Math.max(a,h)}px`})}maskAudit(){if(this.disposed||!this.configLoaded||this.config.enabled!==true||!this.options.reviewerToken)return;const t=[...this.options.maskSelectors??[],...Array.isArray(this.config.maskSelectors)?this.config.maskSelectors:[]],{endpoint:e}=this,{siteKey:o,reviewerToken:i}=this.options;import("./mask-audit-Du3NPoG_.js").then(r=>this.disposed?0:r.runMaskAudit({scan:V,endpoint:e,siteKey:o,reviewerToken:i,maskSelectors:t})).catch(()=>{})}onContextChanged(){this.signals.contextChanged(),this.maskAuditOn&&this.maskAudit();const t=this.getContext();if(t.journeyStep===this.lastCtx.journeyStep&&t.journeyId===this.lastCtx.journeyId)return;const e=this.lastCtx,o=this.lastWhere;this.lastCtx={...t},this.lastWhere=j(),this.checkin?.remove(),this.checkin=void 0,this.maybeCheckin(e,o)}maybeCheckin(t,e){const o=t,i=o.journeyStep;if(this.phase==="consent"||!i)return;const r=`${o.journeyId??""}/${i}`;if(this.askedSteps.has(r))return;this.askedSteps.add(r),this.checkin?.remove();const a=(f,x)=>{const g=s("button",{type:"button",class:"secondary"},m(f,16),x);return g.addEventListener("click",()=>{h.remove(),this.deliver(void 0,f,"",Promise.resolve(void 0),t,e)}),g},c=s("button",{type:"button",class:"close","aria-label":"Dismiss"},m("close",16)),h=s("div",{class:"checkin",role:"group","aria-label":"Step check-in"},s("span",{},"Did this step make sense?"),a("understood","Understood"),a("confused","Confused"),c);c.addEventListener("click",()=>h.remove()),this.checkin=h,this.shell.append(h)}async deliver(t,e,o,i,r=this.getContext(),a=j()){const c={siteKey:this.options.siteKey,consentGiven:true,context:ht(r,a.href,a.width,t?.tflowId)};this.options.userId!==void 0&&Object.assign(c,{userId:this.options.userId},G(this.options)),t&&(c.anchor=t),e&&(c.reaction=Q[e]),o&&(c.comment=o);const h={request:c,stashed:false};this.pending.add(h);const f=await this.uploadScreenshot(i);if(this.pending.delete(h),h.stashed||this.disposed)return;f&&(c.screenshotId=f);const x=await this.outbox.enqueue(c);this.disposed||(x==="sent"?this.toast("Sent. Thank you."):x==="queued"&&this.toast("Saved. It will send when you're back online."))}stashPending(){for(const t of this.pending)t.stashed=true,this.outbox.stash(t.request);this.pending.clear()}screenshotsAllowed(){return!!(this.options.reviewerToken||this.options.userId)}async uploadScreenshot(t){if(!this.screenshotsUnavailable)try{let e;const o=await Promise.race([t,new Promise(r=>e=setTimeout(()=>r(void 0),dt))]).finally(()=>clearTimeout(e));if(!o)return;const i=await X(this.endpoint,this.options,o);return this.uploadNotFound=0,i}catch(e){e instanceof M&&(this.uploadNotFound=e.status===404?this.uploadNotFound+1:0,(e.code==="unimplemented"||this.uploadNotFound>=3)&&(this.screenshotsUnavailable=true));return}}onKey(t){if(t.key!=="Escape")return;const e=t.composedPath()[0];if(t.defaultPrevented||e instanceof Element&&R(e))return;const o=document.activeElement;o&&o!==document.body&&o!==document.documentElement&&o!==this.host||(this.popover?this.closePopover():this.exit())}onWidgetKey(t){if(t.stopPropagation(),t.type!=="keydown"||t.key!=="Escape")return;if(this.fullShot){this.closeFullShot();return}const e=t.target;if(e instanceof HTMLTextAreaElement&&e.value.trim()!==""&&this.popover){this.popover.el.querySelector(".close")?.focus();return}this.popover?this.closePopover():this.exit()}trapTab(t){t.addEventListener("keydown",e=>{if(e.key!=="Tab")return;const o=Array.from(t.querySelectorAll("button:not([disabled]), textarea")),i=o[0],r=o[o.length-1],a=this.root.activeElement;!i||!r||(e.shiftKey&&a===i?(e.preventDefault(),r.focus()):!e.shiftKey&&a===r&&(e.preventDefault(),i.focus()))})}announce(t){this.live.textContent=t}toast(t,e=false){this.toastEl?.remove(),this.toastTimer!==void 0&&clearTimeout(this.toastTimer);const o=s("div",{class:e?"toast err":"toast",role:"status"},t);this.toastEl=o,this.shell.append(o),this.toastTimer=setTimeout(()=>o.remove(),e?6e3:3e3)}}function j(){return{href:location.href,width:window.innerWidth}}function pt(d){return d.code==="unauthenticated"?"Open the review link from your invitation to send feedback.":d.code==="failed_precondition"?"Consent is needed before feedback can be sent.":"This feedback couldn't be sent."}const yt=(d,t,e)=>new lt(d,()=>B(t()),e).api();export{jt as maskedSnapshotSvg,yt as mount,G as signedIdentity,zt as uploadTarget,ht as wireContext};