UNPKG

commerce-kit

Version:

3 lines • 25.6 kB
1
2
3
import{useEffect as E,useRef as B,useState as v}from"react";import{createRoot as ae}from"react-dom/client";import{Fragment as se,jsx as n,jsxs as h}from"react/jsx-runtime";var Y="yns-feedback-toolbar-root",le=()=>{if(typeof window>"u")return null;let e=(process.env.NEXT_PUBLIC_YNS_API_BASE??"").trim();if(e)return e.replace(/\/$/,"");let t=window.location.hostname,i=window.location.protocol;return t.endsWith(".yns.store")?`${i}//yns.store`:t.endsWith(".yns.cx")?`${i}//yns.cx`:window.location.origin},ce=e=>{if(e.id)return`#${CSS.escape(e.id)}`;let t=[],i=e;for(;i&&i.nodeType===Node.ELEMENT_NODE&&t.length<6;){let r=i.tagName.toLowerCase(),c=i.getAttribute("class");if(c){let a=c.split(/\s+/).filter(Boolean).slice(0,2).map(d=>`.${CSS.escape(d)}`).join("");r+=a}let u=i.parentElement,l=i.tagName;if(u){let a=Array.from(u.children).filter(d=>d.tagName===l);if(a.length>1){let d=a.indexOf(i)+1;r+=`:nth-of-type(${d})`}}t.unshift(r),i=u}return t.join(" > ")},de=["id","class","data-testid","aria-label","role","name","href","src"],H=e=>{let t=[];for(let i of de){let r=e.getAttribute(i);if(!r)continue;let c=r.length>80?`${r.slice(0,80)}\u2026`:r;t.push(` ${i}="${c.replace(/"/g,"&quot;")}"`)}return t.join("")},J=e=>{let t=(e.textContent??"").replace(/\s+/g," ").trim();return t?t.length>100?`${t.slice(0,100)}\u2026`:t:""},ue=e=>{let t=[],i=e;for(;i&&i!==document.documentElement&&t.length<5;){let d=i.parentElement;if(!d)break;t.unshift(d),i=d}let r=[],c=0;for(let d of t){let b=" ".repeat(c);r.push(`${b}<${d.tagName.toLowerCase()}${H(d)}>`),c++}let u=" ".repeat(c),l=e.tagName.toLowerCase(),a=J(e);if(r.push(`${u}<${l}${H(e)}>${a?`${a}</${l}>`:""} \u2190 TARGET`),!a){let d=" ".repeat(c+1),b=Array.from(e.children).slice(0,6);for(let x of b){let k=J(x);r.push(`${d}<${x.tagName.toLowerCase()}${H(x)}>${k?`${k}</${x.tagName.toLowerCase()}>`:""}`)}e.children.length>6&&r.push(`${d}\u2026 (${e.children.length-6} more children)`),r.push(`${u}</${l}>`)}for(let d=t.length-1;d>=0;d--){let b=" ".repeat(d),x=t[d];x&&r.push(`${b}</${x.tagName.toLowerCase()}>`)}return r.join(` `)},Q=e=>{let t=e;for(;t;){if(t instanceof HTMLElement&&t.dataset.ynsFeedbackUi==="true")return!0;t=t.parentElement}return!1},pe=new Set(["HTML","HEAD","SCRIPT","STYLE","NOSCRIPT"]),me=1e4,fe=3e4,be=e=>typeof e=="object"&&e!==null&&"viewer"in e&&(e.viewer==="anonymous"||e.viewer==="non-member"||e.viewer==="member"),ge=e=>{let t=new Date(e),i=t.getTime()-Date.now(),r=t.toLocaleString(void 0,{weekday:"short",month:"short",day:"numeric",hour:"numeric",minute:"2-digit"});if(i<=0)return`Any moment now (estimated by ${r})`;let c=Math.ceil(i/6e4);if(c<60)return`~${c} minutes (by ${r})`;let u=Math.round(i/36e5);if(u<24)return`~${u} ${u===1?"hour":"hours"} (by ${r})`;let l=Math.round(i/864e5);return`~${l} ${l===1?"day":"days"} (by ${r})`};async function Z(e){try{let t=await fetch("/api/auth/sign-out",{method:"POST",credentials:"include"});t.ok||console.warn("[YNS Feedback Toolbar] sign-out responded non-OK",t.status)}catch(t){console.warn("[YNS Feedback Toolbar] sign-out fetch failed",t)}e()}var he=e=>new URL(e,window.location.origin).toString();function ye(){let[e,t]=v(null),[i,r]=v(!0),[c,u]=v(!1),[l,a]=v(null),[d,b]=v(null),[x,k]=v(!1),[N,P]=v(!1),y=B(null),T=B(()=>{});E(()=>{if(y.current=le(),!y.current){r(!1);return}let o=!1,s=null,f=0,p=null,R=null,S=()=>{p!==null&&(window.clearTimeout(p),p=null)},w=(L,A)=>{o||A<f||(R=L?.viewer??null,t(L),r(!1))},I=()=>{if(o)return;let L=R==="member"?me:fe;p=window.setTimeout(()=>{X()},L)},X=async()=>{if(o)return;s?.abort();let L=new AbortController;s=L;let A=++f;try{let _=await fetch(`${y.current}/api/feedback-comments?host=${encodeURIComponent(window.location.host)}`,{credentials:"include",signal:L.signal});if(o||A<f)return;if(_.status===404||!_.ok){w(null,A),I();return}let K=await _.json();if(o||A<f)return;if(!be(K)){w(null,A),I();return}w(K,A),I()}catch(_){if(_?.name==="AbortError"||o)return;w(null,A),I()}},q=()=>{o||(S(),X())};T.current=q;let G=()=>{document.hidden?(s?.abort(),S()):q()};return document.addEventListener("visibilitychange",G),X(),()=>{o=!0,document.removeEventListener("visibilitychange",G),s?.abort(),S(),T.current=()=>{}}},[]);let m=e?.viewer==="member"?e:null;E(()=>{!m||m.canComment||(u(!1),a(null),k(!1),b(null))},[m]),E(()=>{if(c)return document.body.style.cursor="crosshair",()=>{document.body.style.cursor=""}},[c]),E(()=>{if(!c)return;let o=document.createElement("div");o.dataset.ynsFeedbackUi="true",o.style.cssText=["position: fixed","pointer-events: none","z-index: 2147483644","border: 2px dashed #10b981","background: rgba(16, 185, 129, 0.08)","border-radius: 3px","display: none","transition: top 0.05s, left 0.05s, width 0.05s, height 0.05s"].join(";");let s=document.createElement("div");s.dataset.ynsFeedbackUi="true",s.textContent="Click to comment",s.style.cssText=["position: fixed","pointer-events: none","z-index: 2147483645","background: #059669","color: #fff","font-size: 11px","font-family: ui-sans-serif, system-ui, sans-serif","padding: 3px 8px","border-radius: 4px","white-space: nowrap","display: none","box-shadow: 0 2px 6px rgba(0,0,0,0.15)"].join(";"),document.documentElement.appendChild(o),document.documentElement.appendChild(s);let f=null,p=S=>{let w=document.elementFromPoint(S.clientX,S.clientY);if(!w||pe.has(w.tagName)||Q(w)){o.style.display="none",s.style.display="none",f=null;return}f=w,requestAnimationFrame(()=>{if(f!==w)return;let I=w.getBoundingClientRect();o.style.top=`${I.top}px`,o.style.left=`${I.left}px`,o.style.width=`${I.width}px`,o.style.height=`${I.height}px`,o.style.display="block",s.style.left=`${S.clientX+14}px`,s.style.top=`${S.clientY+14}px`,s.style.display="block"})},R=()=>{o.style.display="none",s.style.display="none",f=null};return document.addEventListener("mousemove",p,!0),document.addEventListener("mouseleave",R),()=>{document.removeEventListener("mousemove",p,!0),document.removeEventListener("mouseleave",R),o.remove(),s.remove()}},[c]),E(()=>{if(!c)return;let o=s=>{let f=s.target;if(!(f instanceof Element)||Q(f))return;s.preventDefault(),s.stopPropagation();let p=f.getBoundingClientRect(),R=p.width>0?(s.clientX-p.left)/p.width:.5,S=p.height>0?(s.clientY-p.top)/p.height:.5;a({cssSelector:ce(f),pagePath:window.location.pathname,surroundingHtml:ue(f),rect:{top:p.top+window.scrollY,left:p.left+window.scrollX,width:p.width,height:p.height},clickX:s.clientX+window.scrollX,clickY:s.clientY+window.scrollY,offsetXRatio:Math.min(1,Math.max(0,R)),offsetYRatio:Math.min(1,Math.max(0,S))}),u(!1)};return document.addEventListener("click",o,{capture:!0}),()=>document.removeEventListener("click",o,{capture:!0})},[c]);let $=()=>{T.current()},F=async(o,s)=>{!y.current||!m||!l||!(await fetch(`${y.current}/api/feedback-comments`,{method:"POST",credentials:"include",headers:{"Content-Type":"application/json"},body:JSON.stringify({feedbackSessionId:m.feedbackSessionId,content:o,pagePath:l.pagePath,cssSelector:l.cssSelector,surroundingHtml:l.surroundingHtml,offsetXRatio:l.offsetXRatio,offsetYRatio:l.offsetYRatio,...s.length>0?{attachments:s}:{}})})).ok||(a(null),u(!0),$())},z=async(o,s,f)=>{!y.current||!(await fetch(`${y.current}/api/feedback-comments/${o}`,{method:"PATCH",credentials:"include",headers:{"Content-Type":"application/json"},body:JSON.stringify({content:s,attachments:f})})).ok||(b(null),$())},O=async o=>{!y.current||!(await fetch(`${y.current}/api/feedback-comments/${o}`,{method:"DELETE",credentials:"include"})).ok||$()},j=async()=>{if(!(!y.current||!m)&&window.confirm("Finalize this feedback session? You won't be able to add more comments.")){P(!0);try{let o=await fetch(`${y.current}/api/feedback-sessions/${m.feedbackSessionId}/finalize`,{method:"POST",credentials:"include"});if(!o.ok)return;let f=(await o.json().catch(()=>null))?.status??"processing";t(p=>p?.viewer==="member"?{...p,canComment:!1,sessionStatus:f}:p)}finally{P(!1)}}},g=o=>{if(o.pagePath!==window.location.pathname){window.location.assign(o.pagePath);return}let s=null;try{s=document.querySelector(o.cssSelector)}catch{s=null}s&&(s.scrollIntoView({behavior:"smooth",block:"center"}),b(o.id))};if(i||!e)return null;if(e.viewer==="anonymous")return n(We,{loginUrl:e.loginUrl});if(e.viewer==="non-member")return n(Ve,{user:e.user,onSignOut:()=>void Z(()=>T.current())});if(!m)return null;if(!m.canComment)return m.sessionStatus!=="processing"&&m.sessionStatus!=="in_review"?null:n("div",{"data-yns-feedback-ui":"true",children:n(Se,{progress:m.progress,eta:m.eta,status:m.sessionStatus})});let C=m.comments.filter(o=>o.pagePath===window.location.pathname&&o.status!=="done");return h("div",{"data-yns-feedback-ui":"true",children:[C.map((o,s)=>n(xe,{pin:o,number:s+1,editing:d===o.id,feedbackSessionId:m.feedbackSessionId,apiBase:y.current,onStartEdit:()=>b(o.id),onCancelEdit:()=>b(null),onSave:(f,p)=>z(o.id,f,p),onRemove:()=>O(o.id)},o.id)),l&&n(ke,{pending:l,feedbackSessionId:m.feedbackSessionId,apiBase:y.current,onCancel:()=>{a(null),u(!0)},onSave:(o,s)=>F(o,s)}),x&&n(Ce,{comments:m.comments,currentPath:window.location.pathname,onClose:()=>k(!1),onSelect:g}),h("div",{style:W,children:[n("button",{type:"button",onClick:()=>u(o=>!o),style:c?Ie:M,children:c?"Cancel":"Add comment"}),n("button",{type:"button",onClick:()=>k(o=>!o),style:Te,children:x?"Hide list":`List (${m.comments.length})`}),n("button",{type:"button",onClick:j,disabled:N,style:Ae,children:N?"Finalizing\u2026":"Finalize"}),n("span",{style:V,children:c?"Click any element to comment":`${C.length} on this page`}),n(qe,{user:m.user,onSignOut:()=>void Z(()=>T.current())})]})]})}function Se({progress:e,eta:t,status:i}){let[,r]=v(0);E(()=>{let a=window.setInterval(()=>r(d=>d+1),6e4);return()=>window.clearInterval(a)},[]);let c=ge(t);return h("div",{style:dt,children:[n("style",{children:we}),h("div",{style:ut,children:[n(ve,{}),n("span",{style:pt,children:"Submitted"}),n("strong",{style:{fontSize:13},children:i==="in_review"?"Feedback under review":"Applying feedback"})]}),h("div",{style:mt,children:[n("span",{children:"Review progress"}),n("span",{style:{opacity:.7},children:e.label})]}),n("div",{style:ft,children:n("div",{style:{...bt,width:`${e.fillPct}%`}})}),h("p",{style:gt,children:["Estimated delivery: ",n("span",{style:{fontWeight:600},children:c})]})]})}var we="@keyframes yns-feedback-spin { to { transform: rotate(360deg); } }";function ve({size:e=14}){return n("span",{"aria-hidden":!0,style:{display:"inline-block",width:e,height:e,border:"2px solid rgba(16, 185, 129, 0.25)",borderTopColor:"#10b981",borderRadius:999,animation:"yns-feedback-spin 0.9s linear infinite"}})}function xe({pin:e,number:t,editing:i,feedbackSessionId:r,apiBase:c,onStartEdit:u,onCancelEdit:l,onSave:a,onRemove:d}){let b=Re(e.cssSelector,e.offsetXRatio,e.offsetYRatio);return b?h("div",{style:{position:"absolute",top:b.top,left:b.left,zIndex:2147483600,pointerEvents:"auto"},children:[n("button",{type:"button",onClick:u,style:ne,title:e.content,children:t}),i&&n(te,{initial:e.content,initialAttachments:e.attachments,feedbackSessionId:r,apiBase:c,onCancel:l,onSave:a,onRemove:d})]}):null}function ke({pending:e,feedbackSessionId:t,apiBase:i,onCancel:r,onSave:c}){return h(se,{children:[n("div",{style:{position:"absolute",top:e.rect.top+e.rect.height*e.offsetYRatio-12,left:e.rect.left+e.rect.width*e.offsetXRatio-12,zIndex:2147483600,pointerEvents:"none"},children:n("div",{style:ne,children:"\u2022"})}),n("div",{style:{position:"absolute",top:e.clickY+10,left:e.clickX+10,zIndex:2147483647},children:n(te,{initial:"",initialAttachments:[],feedbackSessionId:t,apiBase:i,onCancel:r,onSave:c})})]})}function Ce({comments:e,currentPath:t,onClose:i,onSelect:r}){let c=new Map;for(let l of e){let a=c.get(l.pagePath)??[];a.push(l),c.set(l.pagePath,a)}let u=Array.from(c.keys()).sort((l,a)=>l===t?-1:a===t?1:l.localeCompare(a));return h("div",{style:tt,children:[h("div",{style:nt,children:[h("strong",{style:{fontSize:14},children:["Comments (",e.length,")"]}),n("button",{type:"button",onClick:i,style:oe,children:"Close"})]}),n("div",{style:ot,children:e.length===0?n("div",{style:it,children:"No comments yet. Click \u201CAdd comment\u201D to leave one."}):u.map(l=>h("div",{style:{marginBottom:12},children:[n("div",{style:rt,children:l===t?`${l} \xB7 current`:l}),(c.get(l)??[]).map((a,d)=>h("button",{type:"button",onClick:()=>r(a),style:st,disabled:a.status==="done"&&!1,children:[n("span",{style:at,children:d+1}),n("span",{style:lt,children:a.content.length>140?`${a.content.slice(0,140)}\u2026`:a.content}),a.status==="done"&&n("span",{style:ct,children:"done"})]},a.id))]},l))})]})}var D=5,Ee=5*1024*1024,Pe=e=>new Promise(t=>{let i=URL.createObjectURL(e),r=new window.Image;r.onload=()=>{URL.revokeObjectURL(i),t({width:r.naturalWidth,height:r.naturalHeight})},r.onerror=()=>{URL.revokeObjectURL(i),t(null)},r.src=i});function te({initial:e,initialAttachments:t,feedbackSessionId:i,apiBase:r,onCancel:c,onSave:u,onRemove:l}){let[a,d]=v(e),[b,x]=v(t),[k,N]=v(!1),[P,y]=v(!1),[T,m]=v(null),$=B(null),F=B(null);E(()=>{let g=$.current;if(!g)return;g.focus();let C=g.value.length;g.setSelectionRange(C,C)},[]);let z=async g=>{g.preventDefault();let C=a.trim();if(C){N(!0);try{await u(C,b)}finally{N(!1)}}},O=async g=>{if(!g||g.length===0||!r)return;m(null);let C=D-b.length;if(C<=0){m(`Max ${D} images per comment`);return}let o=Array.from(g).slice(0,C);for(let s of o){if(!s.type.startsWith("image/")){m(`"${s.name}" is not an image`);return}if(s.size>Ee){m(`"${s.name}" exceeds 5 MB`);return}}y(!0);try{let s=await Promise.all(o.map(Pe)),f=new FormData;o.forEach((S,w)=>{f.append("file",S),f.append("width",s[w]?.width?String(s[w]?.width):""),f.append("height",s[w]?.height?String(s[w]?.height):"")});let p=await fetch(`${r}/api/feedback-comments/uploads?feedbackSessionId=${encodeURIComponent(i)}`,{method:"POST",credentials:"include",body:f});if(!p.ok){let S=await p.json().catch(()=>null);m(S?.error??"Upload failed");return}let R=await p.json();x(S=>[...S,...R.uploads])}catch{m("Upload failed")}finally{y(!1),F.current&&(F.current.value="")}},j=g=>{x(C=>C.filter(o=>o.url!==g))};return h("form",{onSubmit:z,style:Le,children:[n("textarea",{ref:$,value:a,onChange:g=>d(g.target.value),placeholder:"Leave a comment\u2026",style:$e,rows:3}),b.length>0&&n("div",{style:Be,children:b.map(g=>h("div",{style:Me,children:[n("img",{src:g.url,alt:"",style:Ue}),n("button",{type:"button",onClick:()=>j(g.url),style:ze,disabled:k||P,"aria-label":"Remove attachment",children:"\xD7"})]},g.url))}),T&&n("div",{style:Oe,children:T}),n("input",{ref:F,type:"file",accept:"image/*",multiple:!0,onChange:g=>void O(g.target.files),style:{display:"none"}}),h("div",{style:Fe,children:[l&&n("button",{type:"button",onClick:()=>l(),style:_e,disabled:k,children:"Delete"}),n("button",{type:"button",onClick:()=>F.current?.click(),style:je,disabled:k||P||b.length>=D,"aria-label":P?"Uploading\u2026":"Attach image",title:P?"Uploading\u2026":"Attach image",children:P?n(Ye,{}):n(Xe,{})}),n("div",{style:{flex:1}}),n("button",{type:"button",onClick:c,style:oe,disabled:k,children:"Cancel"}),n("button",{type:"submit",style:Ne,disabled:k||P||!a.trim(),children:k?"Saving\u2026":"Save"})]})]})}function Re(e,t,i){let[r,c]=v(null);return E(()=>{let u=()=>{let a=null;try{a=document.querySelector(e)}catch{a=null}if(!a){c(null);return}let d=a.getBoundingClientRect();c({top:d.top+window.scrollY+d.height*i-12,left:d.left+window.scrollX+d.width*t-12})};u();let l=new ResizeObserver(u);try{let a=document.querySelector(e);a&&l.observe(a)}catch{}return window.addEventListener("scroll",u,!0),window.addEventListener("resize",u),()=>{l.disconnect(),window.removeEventListener("scroll",u,!0),window.removeEventListener("resize",u)}},[e,t,i]),r}var W={position:"fixed",bottom:16,left:"50%",transform:"translateX(-50%)",zIndex:2147483646,display:"flex",alignItems:"center",gap:8,padding:"8px 12px",background:"rgba(17, 17, 17, 0.92)",color:"white",borderRadius:999,boxShadow:"0 8px 24px rgba(0,0,0,0.25)",fontFamily:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"',fontSize:14,pointerEvents:"auto"},M={border:"none",background:"white",color:"#111",padding:"6px 12px",borderRadius:999,cursor:"pointer",fontWeight:600,fontSize:13},Ie={...M,background:"#ef4444",color:"white"},Te={border:"1px solid rgba(255,255,255,0.4)",background:"transparent",color:"white",padding:"6px 12px",borderRadius:999,cursor:"pointer",fontWeight:500,fontSize:13},Ae={border:"none",background:"#10b981",color:"white",padding:"6px 12px",borderRadius:999,cursor:"pointer",fontWeight:600,fontSize:13},V={opacity:.8,fontSize:12},ne={width:24,height:24,borderRadius:999,background:"#10b981",color:"white",border:"2px solid white",cursor:"pointer",fontSize:12,fontWeight:700,boxShadow:"0 2px 6px rgba(0,0,0,0.3)",display:"inline-flex",alignItems:"center",justifyContent:"center",padding:0},Le={background:"white",border:"1px solid #e5e7eb",borderRadius:8,padding:12,width:280,boxShadow:"0 12px 32px rgba(0,0,0,0.18)",fontFamily:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"',display:"flex",flexDirection:"column",gap:8,color:"#111"},$e={width:"100%",border:"1px solid #d1d5db",borderRadius:6,padding:8,fontSize:14,resize:"vertical",fontFamily:"inherit",color:"#111",background:"white",boxSizing:"border-box"},Fe={display:"flex",alignItems:"center",gap:6},U={border:"1px solid transparent",borderRadius:6,padding:"6px 10px",fontSize:13,cursor:"pointer",fontWeight:500},Ne={...U,background:"#111",color:"white"},oe={...U,background:"transparent",color:"#374151",borderColor:"#d1d5db"},_e={...U,background:"transparent",color:"#b91c1c",borderColor:"#fecaca"},Be={display:"flex",flexWrap:"wrap",gap:6},Me={position:"relative",width:56,height:56,borderRadius:6,overflow:"hidden",border:"1px solid #e5e7eb",background:"#f9fafb"},Ue={width:"100%",height:"100%",objectFit:"cover",display:"block"},ze={position:"absolute",top:2,right:2,width:18,height:18,borderRadius:999,border:"none",background:"rgba(17, 17, 17, 0.85)",color:"white",fontSize:13,lineHeight:"16px",cursor:"pointer",padding:0,display:"inline-flex",alignItems:"center",justifyContent:"center"},Oe={color:"#b91c1c",fontSize:12,margin:0},je={...U,background:"transparent",color:"#374151",borderColor:"#d1d5db",width:30,height:30,padding:0,display:"inline-flex",alignItems:"center",justifyContent:"center",flexShrink:0};function Xe(){return h("svg",{role:"img","aria-label":"Attach image",width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[n("title",{children:"Attach image"}),n("path",{d:"m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l8.57-8.57A4 4 0 1 1 17.93 8.83l-8.59 8.57a2 2 0 0 1-2.83-2.83l8.49-8.48"})]})}function Ye(){return h(se,{children:[n("style",{children:"@keyframes yns-attach-spin { to { transform: rotate(360deg); } }"}),n("span",{"aria-hidden":!0,style:{display:"inline-block",width:12,height:12,border:"2px solid rgba(55, 65, 81, 0.25)",borderTopColor:"#374151",borderRadius:999,animation:"yns-attach-spin 0.9s linear infinite"}})]})}var He=480;function ie(){let[e,t]=v(!1);return E(()=>{let i=window.matchMedia(`(max-width: ${He}px)`),r=()=>t(i.matches);return r(),i.addEventListener("change",r),()=>i.removeEventListener("change",r)},[]),e}var De=e=>{let t=e.name?.trim();return t?t.split(/\s+/).filter(Boolean).slice(0,2).map(r=>r[0]?.toUpperCase()??"").join(""):e.email[0]?.toUpperCase()??"?"};function re({user:e,size:t=22}){return e.image?n("img",{src:e.image,alt:"",width:t,height:t,style:{width:t,height:t,borderRadius:999,objectFit:"cover",display:"block",flexShrink:0}}):n("span",{"aria-hidden":!0,style:{width:t,height:t,borderRadius:999,background:"rgba(255,255,255,0.18)",color:"white",display:"inline-flex",alignItems:"center",justifyContent:"center",fontSize:Math.max(10,Math.round(t*.45)),fontWeight:600,flexShrink:0},children:De(e)})}function We({loginUrl:e}){return n("div",{"data-yns-feedback-ui":"true",children:h("div",{style:W,children:[n("span",{style:V,children:"Log in to provide feedback"}),n("button",{type:"button",onClick:()=>window.location.assign(he(e)),style:M,children:"Log in"})]})})}function Ve({user:e,onSignOut:t}){let i=ie();return n("div",{"data-yns-feedback-ui":"true",children:h("div",{style:W,children:[n(re,{user:e}),!i&&n("span",{style:Ge,children:e.email}),n("span",{style:V,children:"You don't have access to this store"}),n("button",{type:"button",onClick:t,style:M,children:"Sign out"})]})})}function qe({user:e,onSignOut:t}){let[i,r]=v(!1),c=B(null),u=ie();E(()=>{if(!i)return;let d=b=>{c.current&&(b.target instanceof Node&&c.current.contains(b.target)||r(!1))};return document.addEventListener("mousedown",d),()=>document.removeEventListener("mousedown",d)},[i]);let l=e.name?.trim()||e.email,a=l.length>16?`${l.slice(0,16)}\u2026`:l;return h("div",{ref:c,style:{position:"relative"},children:[h("button",{type:"button",onClick:()=>r(d=>!d),style:Ke,"aria-haspopup":"menu","aria-expanded":i,title:l,children:[n(re,{user:e,size:20}),!u&&n("span",{style:Je,children:a}),n("span",{"aria-hidden":!0,style:Qe,children:"\u25BE"})]}),i&&n("div",{role:"menu",style:Ze,children:n("button",{type:"button",role:"menuitem",onClick:()=>{r(!1),t()},style:et,children:"Sign out"})})]})}var Ge={fontSize:13,color:"white",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",maxWidth:200},Ke={display:"inline-flex",alignItems:"center",gap:6,background:"rgba(255,255,255,0.08)",border:"1px solid rgba(255,255,255,0.16)",color:"white",padding:"4px 8px 4px 4px",borderRadius:999,cursor:"pointer",fontSize:12,fontWeight:500,fontFamily:"inherit"},Je={maxWidth:"16ch",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},Qe={opacity:.7,fontSize:10},Ze={position:"absolute",right:0,bottom:"calc(100% + 8px)",background:"white",color:"#111",border:"1px solid #e5e7eb",borderRadius:8,boxShadow:"0 12px 32px rgba(0,0,0,0.18)",minWidth:140,padding:4,zIndex:2147483647},et={display:"block",width:"100%",textAlign:"left",background:"transparent",border:"none",padding:"6px 10px",fontSize:13,color:"#111",cursor:"pointer",borderRadius:6},tt={position:"fixed",top:0,right:0,bottom:0,width:360,maxWidth:"92vw",background:"white",borderLeft:"1px solid #e5e7eb",boxShadow:"-12px 0 32px rgba(0,0,0,0.12)",zIndex:2147483646,display:"flex",flexDirection:"column",fontFamily:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"',color:"#111"},nt={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"12px 16px",borderBottom:"1px solid #e5e7eb"},ot={flex:1,overflow:"auto",padding:"12px 12px 24px"},it={color:"#6b7280",fontSize:13,padding:"24px 8px",textAlign:"center"},rt={fontSize:11,textTransform:"uppercase",letterSpacing:.5,color:"#6b7280",padding:"4px 4px 6px",wordBreak:"break-all"},st={display:"flex",alignItems:"flex-start",gap:8,width:"100%",textAlign:"left",background:"white",border:"1px solid #e5e7eb",borderRadius:6,padding:"8px 10px",cursor:"pointer",fontSize:13,marginBottom:6,color:"#111"},at={flexShrink:0,width:22,height:22,borderRadius:999,background:"#10b981",color:"white",fontWeight:700,fontSize:11,display:"inline-flex",alignItems:"center",justifyContent:"center"},lt={flex:1,whiteSpace:"pre-wrap",wordBreak:"break-word"},ct={flexShrink:0,background:"#d1fae5",color:"#065f46",fontSize:11,fontWeight:600,padding:"2px 6px",borderRadius:4,alignSelf:"center"},dt={position:"fixed",bottom:16,left:"50%",transform:"translateX(-50%)",zIndex:2147483646,display:"flex",flexDirection:"column",gap:8,padding:"12px 16px",width:"min(420px, calc(100vw - 32px))",background:"white",border:"1px solid #e5e7eb",borderRadius:12,boxShadow:"0 12px 32px rgba(0,0,0,0.18)",fontFamily:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"',color:"#111",pointerEvents:"auto"},ut={display:"flex",alignItems:"center",gap:8},pt={background:"#d1fae5",color:"#065f46",fontSize:11,fontWeight:700,padding:"2px 8px",borderRadius:999,textTransform:"uppercase",letterSpacing:.5},mt={display:"flex",justifyContent:"space-between",fontSize:12},ft={width:"100%",height:6,background:"#f3f4f6",borderRadius:999,overflow:"hidden"},bt={height:"100%",background:"#10b981",borderRadius:999,transition:"width 500ms"},gt={margin:0,fontSize:12,color:"#6b7280"};function ee(){if(console.log("[YNS Feedback Toolbar] mountFeedbackToolbar() called",{isWindow:typeof window<"u",vercelEnv:process.env.NEXT_PUBLIC_VERCEL_ENV,alreadyMounted:typeof document<"u"&&!!document.getElementById(Y)}),typeof window>"u")return null;if(process.env.NEXT_PUBLIC_VERCEL_ENV!=="preview")return console.log("[YNS Feedback Toolbar] gate failed \u2014 NEXT_PUBLIC_VERCEL_ENV is",process.env.NEXT_PUBLIC_VERCEL_ENV),null;if(document.getElementById(Y))return null;let e=document.createElement("div");e.id=Y,e.dataset.ynsFeedbackUi="true",document.body.appendChild(e);let t=ae(e);return t.render(n(ye,{})),{unmount:()=>{t.unmount(),e.remove()}}}typeof window<"u"&&console.log("[YNS Feedback Toolbar] module evaluated",{vercelEnv:process.env.NEXT_PUBLIC_VERCEL_ENV,readyState:document.readyState,willAutoMount:process.env.NEXT_PUBLIC_VERCEL_ENV==="preview"});typeof window<"u"&&process.env.NEXT_PUBLIC_VERCEL_ENV==="preview"&&(document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>{ee()}):ee());export{ee as mountFeedbackToolbar}; //# sourceMappingURL=feedback-toolbar.js.map