@siteping/widget 0.9.7 → 0.9.8
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/README.md +1 -1
- package/dist/chunk-OTJZRTBK.js +1751 -0
- package/dist/chunk-OTJZRTBK.js.map +1 -0
- package/dist/de-32TXJQIE.js +2 -0
- package/dist/de-32TXJQIE.js.map +1 -0
- package/dist/es-GFAPKPTK.js +2 -0
- package/dist/es-GFAPKPTK.js.map +1 -0
- package/dist/fr-W2JZ3EUC.js +2 -0
- package/dist/fr-W2JZ3EUC.js.map +1 -0
- package/dist/index.global.js +377 -200
- package/dist/index.global.js.map +1 -1
- package/dist/index.js +59 -1630
- package/dist/index.js.map +1 -1
- package/dist/it-GASU527B.js +2 -0
- package/dist/it-GASU527B.js.map +1 -0
- package/dist/panel-HDPPIATU.js +2 -0
- package/dist/panel-HDPPIATU.js.map +1 -0
- package/dist/pt-AYXM6FG4.js +2 -0
- package/dist/pt-AYXM6FG4.js.map +1 -0
- package/dist/react.d.ts +59 -0
- package/dist/react.js +1568 -0
- package/dist/react.js.map +1 -0
- package/dist/ru-5DW2JCKR.js +2 -0
- package/dist/ru-5DW2JCKR.js.map +1 -0
- package/dist/schema.d.ts +4 -0
- package/dist/siteping-core.d.ts +4 -1
- package/dist/types.d.ts +82 -0
- package/package.json +25 -5
package/dist/index.js
CHANGED
|
@@ -1,41 +1,4 @@
|
|
|
1
|
-
var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw new Error("Can't generate CSS selector for non-element node type.");if(n.tagName.toLowerCase()==="html")return"html";let t={root:document.body,idName:o=>!0,className:o=>!0,tagName:o=>!0,attr:(o,i)=>!1,seedMinLength:1,optimizedMinLength:2,threshold:1e3,maxNumberOfTries:1e4,timeoutMs:void 0};R={...t,...e},Fe=bs(R.root,t);let s=G(n,"all",()=>G(n,"two",()=>G(n,"one",()=>G(n,"none"))));if(s){let o=at(lt(s,n));return o.length>0&&(s=o[0]),J(s)}else throw new Error("Selector was not found.")}function bs(n,e){return n.nodeType===Node.DOCUMENT_NODE?n:n===e.root?n.ownerDocument:n}function G(n,e,t){let s=null,o=[],i=n,r=0;for(;i;){let a=new Date().getTime()-nt.getTime();if(R.timeoutMs!==void 0&&a>R.timeoutMs)throw new Error(`Timeout: Can't find a unique selector after ${a}ms`);let l=Q(gs(i))||Q(...ms(i))||Q(...fs(i))||Q(vs(i))||[st()],d=ys(i);if(e=="all")d&&(l=l.concat(l.filter(Me).map(c=>V(c,d))));else if(e=="two")l=l.slice(0,1),d&&(l=l.concat(l.filter(Me).map(c=>V(c,d))));else if(e=="one"){let[c]=l=l.slice(0,1);d&&Me(c)&&(l=[V(c,d)])}else e=="none"&&(l=[st()],d&&(l=[V(l[0],d)]));for(let c of l)c.level=r;if(o.push(l),o.length>=R.seedMinLength&&(s=et(o,t),s))break;i=i.parentElement,r++}return s||(s=et(o,t)),!s&&t?t():s}function et(n,e){let t=at(rt(n));if(t.length>R.threshold)return e?e():null;for(let s of t)if(it(s))return s;return null}function J(n){let e=n[0],t=e.name;for(let s=1;s<n.length;s++){let o=n[s].level||0;e.level===o-1?t=`${n[s].name} > ${t}`:t=`${n[s].name} ${t}`,e=n[s]}return t}function tt(n){return n.map(e=>e.penalty).reduce((e,t)=>e+t,0)}function it(n){let e=J(n);switch(Fe.querySelectorAll(e).length){case 0:throw new Error(`Can't select any node with this selector: ${e}`);case 1:return!0;default:return!1}}function gs(n){let e=n.getAttribute("id");return e&&R.idName(e)?{name:"#"+CSS.escape(e),penalty:0}:null}function ms(n){return Array.from(n.attributes).filter(t=>R.attr(t.name,t.value)).map(t=>({name:`[${CSS.escape(t.name)}="${CSS.escape(t.value)}"]`,penalty:.5}))}function fs(n){return Array.from(n.classList).filter(R.className).map(t=>({name:"."+CSS.escape(t),penalty:1}))}function vs(n){let e=n.tagName.toLowerCase();return R.tagName(e)?{name:e,penalty:2}:null}function st(){return{name:"*",penalty:3}}function ys(n){let e=n.parentNode;if(!e)return null;let t=e.firstChild;if(!t)return null;let s=0;for(;t&&(t.nodeType===Node.ELEMENT_NODE&&s++,t!==n);)t=t.nextSibling;return s}function V(n,e){return{name:n.name+`:nth-child(${e})`,penalty:n.penalty+1}}function Me(n){return n.name!=="html"&&!n.name.startsWith("#")}function Q(...n){let e=n.filter(xs);return e.length>0?e:null}function xs(n){return n!=null}function*rt(n,e=[]){if(n.length>0)for(let t of n[0])yield*rt(n.slice(1,n.length),e.concat(t));else yield e}function at(n){return[...n].sort((e,t)=>tt(e)-tt(t))}function*lt(n,e,t={counter:0,visited:new Map}){if(n.length>2&&n.length>R.optimizedMinLength)for(let s=1;s<n.length-1;s++){if(t.counter>R.maxNumberOfTries)return;t.counter+=1;let o=[...n];o.splice(s,1);let i=J(o);if(t.visited.has(i))return;it(o)&&ks(o,e)&&(yield o,t.visited.set(i,!0),yield*lt(o,e,t))}}function ks(n,e){return Fe.querySelector(J(n))===e}var ws=["role","aria-label","type","name","href","src","data-testid","data-id"];function Cs(n){let e=5381;for(let t=0;t<n.length;t++)e=(e<<5)+e+n.charCodeAt(t)|0;return(e>>>0).toString(36)}function Be(n){let e=n.children.length,t=0,s=n.parentElement;if(s)for(let r of s.children){if(r===n)break;r.tagName===n.tagName&&t++}let o=[];for(let r of ws){let a=n.getAttribute(r);a&&o.push(`${r}=${a}`)}let i=o.length>0?Cs(o.join(",")):"0";return`${e}:${t}:${i}`}function pt(n,e){let t=e.split(":");if(t.length!==3)return 0;let[s,o,i]=t,r=Number(s),a=Number(o);if(Number.isNaN(r)||Number.isNaN(a))return 0;let l=Be(n),[d,c,u]=l.split(":"),b=0,f=Math.abs(Number(d)-r);f===0?b+=.2:f<=2?b+=.1:f<=5&&(b+=.03);let x=Math.abs(Number(c)-a);return x===0?b+=.4:x===1?b+=.2:x<=3&&(b+=.08),u===i&&(b+=.4),b}function _(n,e){let t=e==="before"?"previousElementSibling":"nextElementSibling",s=n[t],o=3;for(;s&&o>0;){let i=s.textContent?.trim();if(i)return e==="before"?i.slice(-32):i.slice(0,32);s=s[t],o--}return""}function Z(n){let e=n.previousElementSibling?.textContent?.trim().slice(0,40)??"",t=n.nextElementSibling?.textContent?.trim().slice(0,40)??"";return[e,t].filter(Boolean).join(" | ")}function dt(n){if(n.id){let s=n.id.includes("'")?`concat('${n.id.replace(/'/g,`',"'",'`)}')`:`'${n.id}'`;return`//${n.localName}[@id=${s}]`}let e=[],t=n;for(;t&&t!==document.body&&e.length<6;){let s=t.localName,o=t.parentElement;if(t.id){let r=t.id.includes("'")?`concat('${t.id.replace(/'/g,`',"'",'`)}')`:`'${t.id}'`;return e.unshift(`/${s}[@id=${r}]`),"/"+e.join("")}let i=1;if(o)for(let r of o.children){if(r===t)break;r.localName===s&&i++}e.unshift(`/${s}[${i}]`),t=o}return"/html/body"+e.join("")}var j="data-feedback-anchor";function Re(n){let e=ot(n,{className:u=>!/^(css|sc|emotion|styled)-/.test(u)&&!/^[a-z]{1,3}[A-Za-z0-9]{4,8}$/.test(u),attr:u=>["data-testid","data-id","role","aria-label"].includes(u),idName:u=>!u.startsWith("radix-")&&!/^:r[0-9]+:$/.test(u),seedMinLength:3,optimizedMinLength:2}),t=dt(n),o=(n.textContent?.trim()??"").slice(0,120),i=_(n,"before"),r=_(n,"after"),a=Be(n),l=Z(n),c=n.closest(`[${j}]`)?.getAttribute(j)??null;return{cssSelector:e,xpath:t,textSnippet:o,textPrefix:i,textSuffix:r,fingerprint:a,neighborText:l,elementTag:n.tagName,elementId:n.id||void 0,anchorKey:c}}function ct(n,e){let t=n.getBoundingClientRect();return t.left<=e.x&&t.top<=e.y&&t.right>=e.x+e.width&&t.bottom>=e.y+e.height}function ut(n,e=document.documentElement){let t=n.x+n.width/2,s=n.y+n.height/2,o=document.elementFromPoint(t,s);if(!o||o===e)return document.body;let i=o;for(;i&&i!==document.body;){if(i.hasAttribute(j)&&ct(i,n))return i;i=i.parentElement}for(i=o;i&&i!==document.body;){if(ct(i,n))return i;i=i.parentElement}return document.body}function ht(n,e){return e.width<=0||e.height<=0?{xPct:0,yPct:0,wPct:1,hPct:1}:{xPct:(n.x-e.x)/e.width,yPct:(n.y-e.y)/e.height,wPct:n.width/e.width,hPct:n.height/e.height}}function y(n){let s=document.createRange().createContextualFragment(n).firstElementChild;if(!s||s.nodeName.toLowerCase()!=="svg")throw new Error("[siteping] Invalid SVG string");for(let o of[...s.attributes])o.name.startsWith("on")&&s.removeAttribute(o.name);for(let o of s.querySelectorAll("*"))for(let i of[...o.attributes])i.name.startsWith("on")&&o.removeAttribute(i.name);return s}function p(n,e){let t=document.createElement(n);if(e)for(let[s,o]of Object.entries(e))s==="class"?t.className=o:s==="style"?t.style.cssText=o:t.setAttribute(s,o);return t}function h(n,e){n.textContent=e}function ee(n,e="en"){let t=Date.now()-new Date(n).getTime(),s=Math.floor(t/1e3);if(s<60)return new Intl.RelativeTimeFormat(e,{numeric:"auto"}).format(0,"second");let o=new Intl.RelativeTimeFormat(e,{numeric:"always",style:"narrow"}),i=Math.floor(s/60);if(i<60)return o.format(-i,"minute");let r=Math.floor(i/60);if(r<24)return o.format(-r,"hour");let a=Math.floor(r/24);return a<7?o.format(-a,"day"):new Date(n).toLocaleDateString(e)}var Pe='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/><circle cx="12" cy="10" r="1" fill="currentColor" stroke="none"/><circle cx="8" cy="10" r="1" fill="currentColor" stroke="none"/><circle cx="16" cy="10" r="1" fill="currentColor" stroke="none"/></svg>',bt='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg>',gt='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M3 9h18"/><path d="M9 3v18"/></svg>',Ie='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>',De='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94"/><path d="M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19"/><line x1="1" y1="1" x2="23" y2="23"/></svg>',te='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>',mt='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>',se='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="20 6 9 17 4 12"/></svg>',ne='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="10"/><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg>',oe='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/></svg>',ie='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="8" y="6" width="8" height="14" rx="4"/><path d="M19 9h2"/><path d="M3 9h2"/><path d="M19 13h2"/><path d="M3 13h2"/><path d="M19 17h2"/><path d="M3 17h2"/><path d="M10 2h4"/></svg>',re='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="1"/><circle cx="19" cy="12" r="1"/><circle cx="5" cy="12" r="1"/></svg>',Oe='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polygon points="12 2 2 7 12 12 22 7 12 2"/><polyline points="2 17 12 22 22 17"/><polyline points="2 12 12 17 22 12"/></svg>',ft='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="9"/><circle cx="12" cy="12" r="3" fill="currentColor" stroke="none"/></svg>',vt='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="6 9 12 15 18 9"/></svg>',yt='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="1 4 1 10 7 10"/><path d="M3.51 15a9 9 0 1 0 2.13-9.36L1 10"/></svg>',Ne='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="3 6 5 6 21 6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/><line x1="10" y1="11" x2="10" y2="17"/><line x1="14" y1="11" x2="14" y2="17"/></svg>';var kt="#0066ff",Es=/^#[0-9a-fA-F]{6}$/,xt=/^#([0-9a-fA-F])([0-9a-fA-F])([0-9a-fA-F])$/,Ss=/^#[0-9a-fA-F]{8}$/;function Ts(n){if(Es.test(n))return n;let e=xt.test(n)?n.match(xt):null;return e?`#${e[1]}${e[1]}${e[2]}${e[2]}${e[3]}${e[3]}`:Ss.test(n)?n.slice(0,7):(console.warn(`[siteping] Invalid accentColor "${n}" \u2014 only hex colors (#RGB, #RRGGBB, #RRGGBBAA) are supported. Using default.`),kt)}function As(n,e){let t=Math.max(0,Math.round(parseInt(n.slice(1,3),16)*(1-e))),s=Math.max(0,Math.round(parseInt(n.slice(3,5),16)*(1-e))),o=Math.max(0,Math.round(parseInt(n.slice(5,7),16)*(1-e)));return`#${t.toString(16).padStart(2,"0")}${s.toString(16).padStart(2,"0")}${o.toString(16).padStart(2,"0")}`}function Ls(){return typeof window>"u"?!1:window.matchMedia("(prefers-color-scheme: dark)").matches}function Ms(n){return n==="dark"||n==="auto"&&Ls()?"dark":"light"}function wt(n=kt,e){let t=Ts(n),s=As(t,.15);return Ms(e)==="dark"?{accent:t,accentLight:t+"22",accentDark:s,accentGlow:t+"44",accentGradient:`linear-gradient(135deg, ${t}, ${s})`,bg:"#0f172a",bgHover:"#1e293b",text:"#f1f5f9",textSecondary:"#94a3b8",textTertiary:"#64748b",border:"#334155",shadow:"rgba(0, 0, 0, 0.3)",glassBg:"rgba(15, 23, 42, 0.78)",glassBgHeavy:"rgba(15, 23, 42, 0.88)",glassBorder:"rgba(51, 65, 85, 0.5)",glassBorderSubtle:"rgba(51, 65, 85, 0.3)",typeQuestion:"#60a5fa",typeChange:"#fbbf24",typeBug:"#f87171",typeOther:"#94a3b8",typeQuestionBg:"rgba(59, 130, 246, 0.15)",typeChangeBg:"rgba(245, 158, 11, 0.15)",typeBugBg:"rgba(239, 68, 68, 0.15)",typeOtherBg:"rgba(100, 116, 139, 0.15)",statusOpen:"#4ade80",statusOpenBg:"rgba(74, 222, 128, 0.15)",statusResolved:"#94a3b8",statusResolvedBg:"rgba(148, 163, 184, 0.15)"}:{accent:t,accentLight:t+"14",accentDark:s,accentGlow:t+"33",accentGradient:`linear-gradient(135deg, ${t}, ${s})`,bg:"#ffffff",bgHover:"#f8f9fb",text:"#0f172a",textSecondary:"#475569",textTertiary:"#64748b",border:"#e2e8f0",shadow:"rgba(0, 0, 0, 0.06)",glassBg:"rgba(255, 255, 255, 0.72)",glassBgHeavy:"rgba(255, 255, 255, 0.85)",glassBorder:"rgba(255, 255, 255, 0.35)",glassBorderSubtle:"rgba(255, 255, 255, 0.18)",typeQuestion:"#3b82f6",typeChange:"#b45309",typeBug:"#ef4444",typeOther:"#64748b",typeQuestionBg:"#eff6ff",typeChangeBg:"#fffbeb",typeBugBg:"#fef2f2",typeOtherBg:"#f8fafc",statusOpen:"#16a34a",statusOpenBg:"#f0fdf4",statusResolved:"#64748b",statusResolvedBg:"#f1f5f9"}}function F(n,e){switch(n){case"question":return e.typeQuestion;case"change":return e.typeChange;case"bug":return e.typeBug;default:return e.typeOther}}function P(n,e){switch(n){case"question":return e.typeQuestionBg;case"change":return e.typeChangeBg;case"bug":return e.typeBugBg;default:return e.typeOtherBg}}function Ct(n){return`
|
|
2
|
-
--sp-accent: ${n.accent};
|
|
3
|
-
--sp-accent-light: ${n.accentLight};
|
|
4
|
-
--sp-accent-dark: ${n.accentDark};
|
|
5
|
-
--sp-accent-glow: ${n.accentGlow};
|
|
6
|
-
--sp-accent-gradient: ${n.accentGradient};
|
|
7
|
-
--sp-bg: ${n.bg};
|
|
8
|
-
--sp-bg-hover: ${n.bgHover};
|
|
9
|
-
--sp-text: ${n.text};
|
|
10
|
-
--sp-text-secondary: ${n.textSecondary};
|
|
11
|
-
--sp-text-tertiary: ${n.textTertiary};
|
|
12
|
-
--sp-border: ${n.border};
|
|
13
|
-
--sp-shadow: ${n.shadow};
|
|
14
|
-
--sp-glass-bg: ${n.glassBg};
|
|
15
|
-
--sp-glass-bg-heavy: ${n.glassBgHeavy};
|
|
16
|
-
--sp-glass-border: ${n.glassBorder};
|
|
17
|
-
--sp-glass-border-subtle: ${n.glassBorderSubtle};
|
|
18
|
-
--sp-type-question: ${n.typeQuestion};
|
|
19
|
-
--sp-type-change: ${n.typeChange};
|
|
20
|
-
--sp-type-bug: ${n.typeBug};
|
|
21
|
-
--sp-type-other: ${n.typeOther};
|
|
22
|
-
--sp-type-question-bg: ${n.typeQuestionBg};
|
|
23
|
-
--sp-type-change-bg: ${n.typeChangeBg};
|
|
24
|
-
--sp-type-bug-bg: ${n.typeBugBg};
|
|
25
|
-
--sp-type-other-bg: ${n.typeOtherBg};
|
|
26
|
-
--sp-radius: 12px;
|
|
27
|
-
--sp-radius-lg: 16px;
|
|
28
|
-
--sp-radius-xl: 20px;
|
|
29
|
-
--sp-radius-full: 9999px;
|
|
30
|
-
--sp-blur: 20px;
|
|
31
|
-
--sp-blur-heavy: 32px;
|
|
32
|
-
--sp-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
|
|
33
|
-
--sp-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.04);
|
|
34
|
-
--sp-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.08), 0 2px 4px rgba(0, 0, 0, 0.04);
|
|
35
|
-
--sp-shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.1), 0 4px 8px rgba(0, 0, 0, 0.04);
|
|
36
|
-
--sp-shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.12), 0 8px 16px rgba(0, 0, 0, 0.06);
|
|
37
|
-
--sp-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
|
|
38
|
-
`}var ae=class{constructor(e,t){this.colors=e;this.t=t;this.root=p("div",{style:`
|
|
1
|
+
import {A,B,w as w$1,O as O$1,N,F,D,S,H as H$1,z,b,x,y,C,c,e,g,h,j,i,a,f,k,n,o,p,q as q$1}from'./chunk-OTJZRTBK.js';var w,Pe,at;function lt(t,e){if(at=new Date,t.nodeType!==Node.ELEMENT_NODE)throw new Error("Can't generate CSS selector for non-element node type.");if(t.tagName.toLowerCase()==="html")return "html";let n={root:document.body,idName:i=>true,className:i=>true,tagName:i=>true,attr:(i,r)=>false,seedMinLength:1,optimizedMinLength:2,threshold:1e3,maxNumberOfTries:1e4,timeoutMs:void 0};w={...n,...e},Pe=Bt(w.root,n);let o=ne(t,"all",()=>ne(t,"two",()=>ne(t,"one",()=>ne(t,"none"))));if(o){let i=dt(ut(o,t));return i.length>0&&(o=i[0]),re(o)}else throw new Error("Selector was not found.")}function Bt(t,e){return t.nodeType===Node.DOCUMENT_NODE?t:t===e.root?t.ownerDocument:t}function ne(t,e,n){let o=null,i=[],r=t,s=0;for(;r;){let a=new Date().getTime()-at.getTime();if(w.timeoutMs!==void 0&&a>w.timeoutMs)throw new Error(`Timeout: Can't find a unique selector after ${a}ms`);let c=ie(jt(r))||ie(...zt(r))||ie(...Kt(r))||ie(Xt(r))||[st()],p=Ut(r);if(e=="all")p&&(c=c.concat(c.filter(Ae).map(l=>oe(l,p))));else if(e=="two")c=c.slice(0,1),p&&(c=c.concat(c.filter(Ae).map(l=>oe(l,p))));else if(e=="one"){let[l]=c=c.slice(0,1);p&&Ae(l)&&(c=[oe(l,p)]);}else e=="none"&&(c=[st()],p&&(c=[oe(c[0],p)]));for(let l of c)l.level=s;if(i.push(c),i.length>=w.seedMinLength&&(o=it(i,n),o))break;r=r.parentElement,s++;}return o||(o=it(i,n)),!o&&n?n():o}function it(t,e){let n=dt(pt(t));if(n.length>w.threshold)return e?e():null;for(let o of n)if(ct(o))return o;return null}function re(t){let e=t[0],n=e.name;for(let o=1;o<t.length;o++){let i=t[o].level||0;e.level===i-1?n=`${t[o].name} > ${n}`:n=`${t[o].name} ${n}`,e=t[o];}return n}function rt(t){return t.map(e=>e.penalty).reduce((e,n)=>e+n,0)}function ct(t){let e=re(t);switch(Pe.querySelectorAll(e).length){case 0:throw new Error(`Can't select any node with this selector: ${e}`);case 1:return true;default:return false}}function jt(t){let e=t.getAttribute("id");return e&&w.idName(e)?{name:"#"+CSS.escape(e),penalty:0}:null}function zt(t){return Array.from(t.attributes).filter(n=>w.attr(n.name,n.value)).map(n=>({name:`[${CSS.escape(n.name)}="${CSS.escape(n.value)}"]`,penalty:.5}))}function Kt(t){return Array.from(t.classList).filter(w.className).map(n=>({name:"."+CSS.escape(n),penalty:1}))}function Xt(t){let e=t.tagName.toLowerCase();return w.tagName(e)?{name:e,penalty:2}:null}function st(){return {name:"*",penalty:3}}function Ut(t){let e=t.parentNode;if(!e)return null;let n=e.firstChild;if(!n)return null;let o=0;for(;n&&(n.nodeType===Node.ELEMENT_NODE&&o++,n!==t);)n=n.nextSibling;return o}function oe(t,e){return {name:t.name+`:nth-child(${e})`,penalty:t.penalty+1}}function Ae(t){return t.name!=="html"&&!t.name.startsWith("#")}function ie(...t){let e=t.filter(Yt);return e.length>0?e:null}function Yt(t){return t!=null}function*pt(t,e=[]){if(t.length>0)for(let n of t[0])yield*pt(t.slice(1,t.length),e.concat(n));else yield e;}function dt(t){return [...t].sort((e,n)=>rt(e)-rt(n))}function*ut(t,e,n={counter:0,visited:new Map}){if(t.length>2&&t.length>w.optimizedMinLength)for(let o=1;o<t.length-1;o++){if(n.counter>w.maxNumberOfTries)return;n.counter+=1;let i=[...t];i.splice(o,1);let r=re(i);if(n.visited.has(r))return;ct(i)&&Wt(i,e)&&(yield i,n.visited.set(r,true),yield*ut(i,e,n));}}function Wt(t,e){return Pe.querySelector(re(t))===e}var qt=["role","aria-label","type","name","href","src","data-testid","data-id"];function Gt(t){let e=5381;for(let n=0;n<t.length;n++)e=(e<<5)+e+t.charCodeAt(n)|0;return (e>>>0).toString(36)}function Re(t){let e=t.children.length,n=0,o=t.parentElement;if(o)for(let s of o.children){if(s===t)break;s.tagName===t.tagName&&n++;}let i=[];for(let s of qt){let a=t.getAttribute(s);a&&i.push(`${s}=${a}`);}let r=i.length>0?Gt(i.join(",")):"0";return `${e}:${n}:${r}`}function ht(t,e){let n=e.split(":");if(n.length!==3)return 0;let[o,i,r]=n,s=Number(o),a=Number(i);if(Number.isNaN(s)||Number.isNaN(a))return 0;let c=Re(t),[p,l,d]=c.split(":"),h=0,f=Math.abs(Number(p)-s);f===0?h+=.2:f<=2?h+=.1:f<=5&&(h+=.03);let v=Math.abs(Number(l)-a);return v===0?h+=.4:v===1?h+=.2:v<=3&&(h+=.08),d===r&&(h+=.4),h}function $(t,e){let n=e==="before"?"previousElementSibling":"nextElementSibling",o=t[n],i=3;for(;o&&i>0;){let r=o.textContent?.trim();if(r)return e==="before"?r.slice(-32):r.slice(0,32);o=o[n],i--;}return ""}function se(t){let e=t.previousElementSibling?.textContent?.trim().slice(0,40)??"",n=t.nextElementSibling?.textContent?.trim().slice(0,40)??"";return [e,n].filter(Boolean).join(" | ")}function ft(t){if(t.id){let o=t.id.includes("'")?`concat('${t.id.replace(/'/g,`',"'",'`)}')`:`'${t.id}'`;return `//${t.localName}[@id=${o}]`}let e=[],n=t;for(;n&&n!==document.body&&e.length<6;){let o=n.localName,i=n.parentElement;if(n.id){let s=n.id.includes("'")?`concat('${n.id.replace(/'/g,`',"'",'`)}')`:`'${n.id}'`;return e.unshift(`/${o}[@id=${s}]`),"/"+e.join("")}let r=1;if(i)for(let s of i.children){if(s===n)break;s.localName===o&&r++;}e.unshift(`/${o}[${r}]`),n=i;}return "/html/body"+e.join("")}var K="data-feedback-anchor";function Fe(t){let e=lt(t,{className:d=>!/^(css|sc|emotion|styled)-/.test(d)&&!/^[a-z]{1,3}[A-Za-z0-9]{4,8}$/.test(d),attr:d=>["data-testid","data-id","role","aria-label"].includes(d),idName:d=>!d.startsWith("radix-")&&!/^:r[0-9]+:$/.test(d),seedMinLength:3,optimizedMinLength:2}),n=ft(t),i=(t.textContent?.trim()??"").slice(0,120),r=$(t,"before"),s=$(t,"after"),a=Re(t),c=se(t),l=t.closest(`[${K}]`)?.getAttribute(K)??null;return {cssSelector:e,xpath:n,textSnippet:i,textPrefix:r,textSuffix:s,fingerprint:a,neighborText:c,elementTag:t.tagName,elementId:t.id||void 0,anchorKey:l}}function mt(t,e){let n=t.getBoundingClientRect();return n.left<=e.x&&n.top<=e.y&&n.right>=e.x+e.width&&n.bottom>=e.y+e.height}function gt(t,e=document.documentElement){let n=t.x+t.width/2,o=t.y+t.height/2,i=document.elementFromPoint(n,o);if(!i||i===e)return document.body;let r=i;for(;r&&r!==document.body;){if(r.hasAttribute(K)&&mt(r,t))return r;r=r.parentElement;}for(r=i;r&&r!==document.body;){if(mt(r,t))return r;r=r.parentElement;}return document.body}function bt(t,e){return e.width<=0||e.height<=0?{xPct:0,yPct:0,wPct:1,hPct:1}:{xPct:(t.x-e.x)/e.width,yPct:(t.y-e.y)/e.height,wPct:t.width/e.width,hPct:t.height/e.height}}var ae=class{constructor(e,n$1){this.colors=e;this.t=n$1;this.root=b("div",{style:`
|
|
39
2
|
position:fixed;
|
|
40
3
|
z-index:${2147483647};
|
|
41
4
|
width:300px;
|
|
@@ -52,7 +15,7 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
52
15
|
transition:opacity 0.25s cubic-bezier(0.16, 1, 0.3, 1),transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
|
|
53
16
|
display:none;
|
|
54
17
|
-webkit-font-smoothing:antialiased;
|
|
55
|
-
`}),this.root.setAttribute("role","dialog"),this.root.setAttribute("aria-modal","true"),this.root.setAttribute("aria-label",this.t("popup.ariaLabel"));let
|
|
18
|
+
`}),this.root.setAttribute("role","dialog"),this.root.setAttribute("aria-modal","true"),this.root.setAttribute("aria-label",this.t("popup.ariaLabel"));let o$1=[{type:"question",label:this.t("type.question"),icon:n},{type:"change",label:this.t("type.change"),icon:o},{type:"bug",label:this.t("type.bug"),icon:p},{type:"other",label:this.t("type.other"),icon:q$1}],i=b("div",{style:"display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:12px;"});for(let l of o$1){let d=document.createElement("button");d.style.cssText=`
|
|
56
19
|
height:44px;
|
|
57
20
|
border-radius:9999px;border:1px solid ${this.colors.border};
|
|
58
21
|
background:${this.colors.glassBg};cursor:pointer;
|
|
@@ -61,7 +24,7 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
61
24
|
font-size:13px;font-weight:500;color:${this.colors.textTertiary};
|
|
62
25
|
transition:all 0.2s ease;
|
|
63
26
|
padding:0 12px;
|
|
64
|
-
`;let
|
|
27
|
+
`;let h=a(l.icon);h.setAttribute("style","width:13px;height:13px;flex-shrink:0;"),d.appendChild(h);let f=document.createElement("span");c(f,l.label),d.appendChild(f),d.dataset.type=l.type,d.setAttribute("aria-pressed","false"),d.addEventListener("click",()=>{this.selectType(l.type,i);}),d.addEventListener("mouseenter",()=>{if(d.dataset.type!==this.selectedType){let v=y(d.dataset.type??"",this.colors);d.style.background=v,d.style.borderColor=x(d.dataset.type??"",this.colors)+"40";}}),d.addEventListener("mouseleave",()=>{d.dataset.type!==this.selectedType&&(d.style.background=this.colors.glassBg,d.style.borderColor=this.colors.border);}),i.appendChild(d);}this.textarea=document.createElement("textarea"),this.textarea.style.cssText=`
|
|
65
28
|
width:100%;min-height:72px;max-height:152px;
|
|
66
29
|
padding:10px 12px;border-radius:12px;
|
|
67
30
|
border:1px solid ${this.colors.border};
|
|
@@ -70,19 +33,19 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
70
33
|
font-size:13px;line-height:1.5;resize:vertical;
|
|
71
34
|
outline:none;transition:all 0.2s ease;
|
|
72
35
|
box-sizing:border-box;
|
|
73
|
-
`,this.textarea.placeholder=this.t("popup.placeholder"),this.textarea.maxLength=5e3,this.textarea.setAttribute("aria-label",this.t("popup.textareaAria"));let
|
|
36
|
+
`,this.textarea.placeholder=this.t("popup.placeholder"),this.textarea.maxLength=5e3,this.textarea.setAttribute("aria-label",this.t("popup.textareaAria"));let r=b("div",{style:`
|
|
74
37
|
font-size:11px;color:${this.colors.textTertiary};
|
|
75
38
|
text-align:right;margin-top:4px;
|
|
76
39
|
font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
77
40
|
letter-spacing:0.01em;
|
|
78
|
-
`}),
|
|
41
|
+
`}),s=navigator.userAgentData,a$1=s?s.platform==="macOS":navigator.platform?.includes("Mac")??/Macintosh|Mac OS X/i.test(navigator.userAgent);c(r,a$1?this.t("popup.submitHintMac"):this.t("popup.submitHintOther")),this.textarea.addEventListener("focus",()=>{this.textarea.style.borderColor=this.colors.accent,this.textarea.style.boxShadow=`0 0 0 3px ${this.colors.accent}14`,this.textarea.style.background=this.colors.bg;}),this.textarea.addEventListener("blur",()=>{this.textarea.style.borderColor=this.colors.border,this.textarea.style.boxShadow="none",this.textarea.style.background=this.colors.glassBgHeavy;}),this.textarea.addEventListener("input",()=>{this.updateSubmitState();}),this.textarea.addEventListener("keydown",l=>{l.key==="Enter"&&(l.ctrlKey||l.metaKey)&&(l.preventDefault(),this.submit()),l.key==="Escape"&&this.cancel();});let c$1=b("div",{style:"display:flex;justify-content:flex-end;gap:8px;margin-top:12px;"}),p$1=document.createElement("button");p$1.style.cssText=`
|
|
79
42
|
height:34px;padding:0 16px;border-radius:9999px;
|
|
80
43
|
border:1px solid ${this.colors.border};
|
|
81
44
|
background:${this.colors.glassBg};
|
|
82
45
|
color:${this.colors.textTertiary};font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
83
46
|
font-size:13px;font-weight:500;cursor:pointer;
|
|
84
47
|
transition:all 0.2s ease;
|
|
85
|
-
`,
|
|
48
|
+
`,c(p$1,this.t("popup.cancel")),p$1.addEventListener("click",()=>this.cancel()),p$1.addEventListener("mouseenter",()=>{p$1.style.borderColor=this.colors.accent,p$1.style.color=this.colors.accent;}),p$1.addEventListener("mouseleave",()=>{p$1.style.borderColor=this.colors.border,p$1.style.color=this.colors.textTertiary;}),this.submitBtn=document.createElement("button"),this.submitBtn.style.cssText=`
|
|
86
49
|
height:34px;padding:0 18px;border-radius:9999px;
|
|
87
50
|
border:none;background:${this.colors.accentGradient};
|
|
88
51
|
color:#fff;font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
@@ -90,12 +53,12 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
90
53
|
opacity:0.35;pointer-events:none;
|
|
91
54
|
transition:all 0.2s ease;
|
|
92
55
|
box-shadow:0 2px 8px ${this.colors.accentGlow};
|
|
93
|
-
`,
|
|
56
|
+
`,c(this.submitBtn,this.t("popup.submit")),this.submitBtn.addEventListener("click",()=>this.submit()),c$1.appendChild(p$1),c$1.appendChild(this.submitBtn),this.root.appendChild(i),this.root.appendChild(this.textarea),this.root.appendChild(r),this.root.appendChild(c$1),document.body.appendChild(this.root);}colors;t;root;selectedType=null;textarea;submitBtn;resolve=null;previouslyFocused=null;onKeydownTrap=null;show(e){return new Promise(n=>{this.resolve=n,this.selectedType=null,this.textarea.value="",this.updateSubmitState(),this.resetTypeButtons(),this.previouslyFocused=document.activeElement;let o=220,i=300,r=e.bottom+8,s=e.left;if(r+o>window.innerHeight){let c=e.top-o-8;c>=8?r=c:r=window.innerHeight-o-8;}s+i>window.innerWidth&&(s=e.right-i),s=Math.max(8,s),r=Math.max(8,r),this.root.style.top=`${r}px`,this.root.style.left=`${s}px`,this.root.style.display="block",this.onKeydownTrap=c=>{if(c.key==="Tab"){let p=Array.from(this.root.querySelectorAll('button:not([disabled]), textarea, input, [tabindex]:not([tabindex="-1"])'));if(p.length===0)return;let l=p[0],d=p[p.length-1];if(!l||!d)return;c.shiftKey?(document.activeElement===l||!this.root.contains(document.activeElement))&&(c.preventDefault(),d.focus()):(document.activeElement===d||!this.root.contains(document.activeElement))&&(c.preventDefault(),l.focus());}},this.root.addEventListener("keydown",this.onKeydownTrap);let a=typeof window<"u"&&window.matchMedia("(prefers-reduced-motion: reduce)").matches;this.root.style.transition=a?"none":"",requestAnimationFrame(()=>{this.root.style.opacity="1",this.root.style.transform="translateY(0) scale(1)",this.textarea.focus();});})}selectType(e,n){this.selectedType=e;let o=n.querySelectorAll("button");for(let i of o){let r=i.dataset.type===e,s=x(i.dataset.type??"",this.colors),a=y(i.dataset.type??"",this.colors);i.style.background=r?a:this.colors.glassBg,i.style.borderColor=r?s+"60":this.colors.border,i.style.color=r?s:this.colors.textTertiary,i.style.fontWeight=r?"600":"500",i.setAttribute("aria-pressed",String(r));}this.updateSubmitState();}resetTypeButtons(){let e=this.root.querySelectorAll("button[data-type]");for(let n of e)n.setAttribute("aria-pressed","false"),n.style.background=this.colors.glassBg,n.style.borderColor=this.colors.border,n.style.color=this.colors.textTertiary,n.style.fontWeight="500";}updateSubmitState(){let e=this.selectedType!==null&&this.textarea.value.trim().length>0;this.submitBtn.disabled=!e,this.submitBtn.style.opacity=e?"1":"0.35",this.submitBtn.style.pointerEvents=e?"auto":"none";}submit(){!this.selectedType||!this.textarea.value.trim()||(this.resolve?.({type:this.selectedType,message:this.textarea.value.trim()}),this.resolve=null,this.hideElement());}cancel(){this.resolve?.(null),this.resolve=null,this.hideElement();}hideElement(){this.onKeydownTrap&&(this.root.removeEventListener("keydown",this.onKeydownTrap),this.onKeydownTrap=null),this.root.style.opacity="0",this.root.style.transform="translateY(8px) scale(0.98)",this.previouslyFocused?.focus(),this.previouslyFocused=null,setTimeout(()=>{this.root.style.display="none";},250);}destroy(){this.root.remove();}};var X,yt=false;async function Vt(){if(X!==void 0)return X;try{let t=await import('html2canvas');return X=t.default??t,X}catch(t){return X=null,yt||(yt=true,console.warn("[siteping] html2canvas import failed unexpectedly. Capture is disabled for this session \u2014 feedbacks are still submitted, just without screenshots. Underlying error:",t)),null}}async function xt(t,e){let n=await Vt();if(!n)return null;let o=.85,i=1200;try{let r=await n(document.body,{x:window.scrollX+t.x,y:window.scrollY+t.y,width:t.width,height:t.height,scale:window.devicePixelRatio,useCORS:!0,allowTaint:!0,logging:!1,ignoreElements:d=>d.tagName==="SITEPING-WIDGET"||d.closest?.("siteping-widget")!==null||d.getAttribute?.("data-siteping-ignore")==="true"});if(r.width<=i)return r.toDataURL("image/jpeg",o);let s=i/r.width,a=i,c=Math.round(r.height*s),p=document.createElement("canvas");p.width=a,p.height=c;let l=p.getContext("2d");return l?(l.drawImage(r,0,0,a,c),p.toDataURL("image/jpeg",o)):null}catch(r){return console.warn("[siteping] Screenshot capture failed:",r),null}}var le=class{constructor(e,n,o,i=false){this.colors=e;this.bus=n;this.t=o;this.enableScreenshot=i;this.popup=new ae(e,o),this.bus.on("annotation:start",()=>this.activate());}colors;bus;t;enableScreenshot;overlay=null;toolbar=null;drawingRect=null;startX=0;startY=0;isDrawing=false;isActive=false;popup;savedOverflow="";preActiveFocusElement=null;rafId=null;pendingMoveEvent=null;async maybeCapture(e){return this.enableScreenshot?xt(e):null}activate(){if(this.isActive)return;this.isActive=true,this.preActiveFocusElement=document.activeElement,this.savedOverflow=document.body.style.overflow,document.body.style.overflow="hidden",this.overlay=b("div",{style:`
|
|
94
57
|
position:fixed;inset:0;
|
|
95
58
|
z-index:${2147483646};
|
|
96
59
|
background:rgba(15, 23, 42, 0.04);
|
|
97
60
|
cursor:crosshair;
|
|
98
|
-
`}),this.overlay.setAttribute("aria-hidden","true"),this.toolbar=
|
|
61
|
+
`}),this.overlay.setAttribute("aria-hidden","true"),this.toolbar=b("div",{style:`
|
|
99
62
|
position:fixed;top:0;left:0;right:0;
|
|
100
63
|
z-index:${2147483647};
|
|
101
64
|
height:52px;
|
|
@@ -108,19 +71,19 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
108
71
|
font-size:14px;color:${this.colors.text};
|
|
109
72
|
box-shadow:0 4px 16px ${this.colors.shadow};
|
|
110
73
|
-webkit-font-smoothing:antialiased;
|
|
111
|
-
`});let e=
|
|
74
|
+
`});let e=b("span",{style:`
|
|
112
75
|
width:8px;height:8px;border-radius:50%;
|
|
113
76
|
background:${this.colors.accent};
|
|
114
77
|
box-shadow:0 0 8px ${this.colors.accentGlow};
|
|
115
78
|
animation:pulse 1.5s ease-in-out infinite;
|
|
116
|
-
`}),
|
|
79
|
+
`}),n=document.createElement("style");n.textContent=["@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.4}}","@media(prefers-reduced-motion:reduce){@keyframes pulse{from,to{opacity:1}}}"].join(""),this.toolbar.appendChild(n);let o=b("span",{style:"font-weight:500;letter-spacing:-0.01em;"});c(o,this.t("annotator.instruction"));let i=document.createElement("button");i.style.cssText=`
|
|
117
80
|
height:34px;padding:0 18px;border-radius:9999px;
|
|
118
81
|
border:1px solid ${this.colors.border};
|
|
119
82
|
background:${this.colors.glassBg};
|
|
120
83
|
color:${this.colors.textTertiary};font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
121
84
|
font-size:13px;font-weight:500;cursor:pointer;
|
|
122
85
|
transition:all 0.2s ease;
|
|
123
|
-
`,
|
|
86
|
+
`,c(i,this.t("annotator.cancel")),i.addEventListener("click",()=>this.deactivate()),i.addEventListener("mouseenter",()=>{i.style.borderColor=this.colors.typeBug,i.style.color=this.colors.typeBug,i.style.background=this.colors.typeBugBg;}),i.addEventListener("mouseleave",()=>{i.style.borderColor=this.colors.border,i.style.color=this.colors.textTertiary,i.style.background=this.colors.glassBg;}),this.toolbar.appendChild(e),this.toolbar.appendChild(o),this.toolbar.appendChild(i),this.overlay.addEventListener("mousedown",this.onMouseDown),this.overlay.addEventListener("mousemove",this.onMouseMove),this.overlay.addEventListener("mouseup",this.onMouseUp),this.overlay.addEventListener("touchstart",this.onTouchStart,{passive:false}),this.overlay.addEventListener("touchmove",this.onTouchMove,{passive:false}),this.overlay.addEventListener("touchend",this.onTouchEnd),this.overlay.addEventListener("keydown",this.onOverlayKeyDown),this.overlay.setAttribute("tabindex","0"),document.addEventListener("keydown",this.onKeyDown),document.body.appendChild(this.overlay),document.body.appendChild(this.toolbar);}deactivate(){this.isActive&&(this.isActive=false,this.isDrawing=false,this.preActiveFocusElement=null,this.rafId!==null&&(cancelAnimationFrame(this.rafId),this.rafId=null),this.pendingMoveEvent=null,document.body.style.overflow=this.savedOverflow,document.removeEventListener("keydown",this.onKeyDown),this.overlay?.remove(),this.toolbar?.remove(),this.drawingRect?.remove(),this.overlay=null,this.toolbar=null,this.drawingRect=null,this.bus.emit("annotation:end"));}onKeyDown=e=>{e.key==="Escape"&&this.deactivate();};onOverlayKeyDown=async e=>{if(e.key!=="Enter")return;e.preventDefault();let n=this.preActiveFocusElement;if(!n||!(n instanceof HTMLElement))return;let o=n.getBoundingClientRect();if(o.width<=0||o.height<=0)return;let i=new DOMRect(o.x,o.y,o.width,o.height),r=await this.popup.show(i);if(!r)return;let a={anchor:Fe(n),rect:{xPct:0,yPct:0,wPct:1,hPct:1},scrollX:window.scrollX,scrollY:window.scrollY,viewportW:window.innerWidth,viewportH:window.innerHeight,devicePixelRatio:window.devicePixelRatio},c=await this.maybeCapture(i);this.deactivate(),this.bus.emit("annotation:complete",{annotation:a,type:r.type,message:r.message,screenshotDataUrl:c});};onMouseDown=e=>{this.startDrawing(e.clientX,e.clientY);};onTouchStart=e=>{e.preventDefault();let n=e.touches[0];n&&this.startDrawing(n.clientX,n.clientY);};startDrawing(e,n){this.isDrawing=true,this.startX=e,this.startY=n,this.drawingRect?.remove(),this.drawingRect=b("div",{style:`
|
|
124
87
|
position:fixed;
|
|
125
88
|
border:2px solid ${this.colors.accent};
|
|
126
89
|
background:${this.colors.accent}12;
|
|
@@ -128,7 +91,8 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
128
91
|
border-radius:8px;
|
|
129
92
|
box-shadow:0 0 16px ${this.colors.accentGlow};
|
|
130
93
|
transition:box-shadow 0.15s ease;
|
|
131
|
-
`}),this.overlay?.appendChild(this.drawingRect)}onMouseMove=e=>{this.scheduleRectUpdate(e)};onTouchMove=e=>{e.preventDefault(),e.touches[0]&&this.scheduleRectUpdate(e.touches[0])};scheduleRectUpdate(e){!this.isDrawing||!this.drawingRect||(this.pendingMoveEvent=e,this.rafId===null&&(this.rafId=requestAnimationFrame(()=>{this.rafId=null;let t=this.pendingMoveEvent;if(!t||!this.drawingRect)return;let s=Math.min(t.clientX,this.startX),o=Math.min(t.clientY,this.startY),i=Math.abs(t.clientX-this.startX),r=Math.abs(t.clientY-this.startY);this.drawingRect.style.left=`${s}px`,this.drawingRect.style.top=`${o}px`,this.drawingRect.style.width=`${i}px`,this.drawingRect.style.height=`${r}px`})))}onTouchEnd=async e=>{let t=e.changedTouches[0];t&&await this.finishDrawing(t.clientX,t.clientY)};onMouseUp=async e=>{await this.finishDrawing(e.clientX,e.clientY)};finishDrawing=async(e,t)=>{if(!this.isDrawing||!this.drawingRect)return;this.isDrawing=!1;let s=Math.min(e,this.startX),o=Math.min(t,this.startY),i=Math.abs(e-this.startX),r=Math.abs(t-this.startY);if(i<10||r<10){this.drawingRect.remove(),this.drawingRect=null;return}let a=new DOMRect(s,o,i,r),l=await this.popup.show(a);if(!l){this.drawingRect?.remove(),this.drawingRect=null;return}let d=this.buildAnnotation(a);this.drawingRect?.remove(),this.drawingRect=null;let c=await this.maybeCapture(a);this.deactivate(),this.bus.emit("annotation:complete",{annotation:d,type:l.type,message:l.message,screenshotDataUrl:c})};buildAnnotation(e){this.overlay&&(this.overlay.style.pointerEvents="none");let t=ut(e);this.overlay&&(this.overlay.style.pointerEvents="auto");let s=Re(t),o=t.getBoundingClientRect(),i=ht(e,o);return{anchor:s,rect:i,scrollX:window.scrollX,scrollY:window.scrollY,viewportW:window.innerWidth,viewportH:window.innerHeight,devicePixelRatio:window.devicePixelRatio}}destroy(){this.deactivate(),this.popup.destroy()}};var U="siteping_retry_queue";async function K(n,e,t=3){for(let s=0;s<=t;s++){let o=new AbortController,i=setTimeout(()=>o.abort(),1e4);try{let l=await fetch(n,{...e,signal:o.signal});if(clearTimeout(i),l.ok||l.status>=400&&l.status<500||s===t)return l}catch(l){if(clearTimeout(i),s===t)throw l}let r=1e3*2**s,a=Math.random()*1e3-500;await new Promise(l=>setTimeout(l,r+a))}throw new Error("Max retries exceeded")}var Bs="siteping_retry_queue";async function Tt(n){return typeof navigator<"u"&&navigator.locks?navigator.locks.request(Bs,()=>n()):n()}function Rs(n,e){Tt(()=>{try{let t=localStorage.getItem(U),s=t?JSON.parse(t):[],o=Array.isArray(s)?s:[];o.length>=20&&o.shift(),o.push({endpoint:n,payload:e}),localStorage.setItem(U,JSON.stringify(o))}catch{}})}async function At(n){await Tt(async()=>{try{let e=localStorage.getItem(U);if(!e)return;let t=JSON.parse(e),s=Array.isArray(t)?t:[],o=s.filter(a=>a.endpoint===n);if(o.length===0)return;let i=[];for(let a of o)try{(await fetch(n,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(a.payload)})).ok||i.push(a)}catch{i.push(a)}let r=s.filter(a=>a.endpoint!==n).concat(i);r.length>0?localStorage.setItem(U,JSON.stringify(r)):localStorage.removeItem(U)}catch{}})}var pe=class{constructor(e,t){this.endpoint=e;this.projectName=t}endpoint;projectName;async sendFeedback(e){try{let t=await K(this.endpoint,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(e)});if(!t.ok){let s=await t.text().catch(()=>"Unknown error");throw new Error(`Failed to send feedback: ${t.status} ${s}`)}return await t.json()}catch(t){throw Rs(this.endpoint,e),t}}async getFeedbacks(e,t){let s=new URLSearchParams({projectName:e});t?.page&&s.set("page",String(t.page)),t?.limit&&s.set("limit",String(t.limit)),t?.type&&s.set("type",t.type),t?.status&&s.set("status",t.status),t?.search&&s.set("search",t.search),t?.url&&s.set("url",t.url),t?.urlPattern&&s.set("urlPattern",t.urlPattern);let o=await K(`${this.endpoint}?${s.toString()}`,{method:"GET",cache:"no-store"});if(!o.ok)throw new Error(`Failed to fetch feedbacks: ${o.status}`);return await o.json()}async resolveFeedback(e,t){let s=await K(this.endpoint,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify({id:e,projectName:this.projectName,status:t?"resolved":"open"})});if(!s.ok)throw new Error(`Failed to update feedback: ${s.status}`);return await s.json()}async deleteFeedback(e){let t=await K(this.endpoint,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({id:e,projectName:this.projectName})});if(!t.ok)throw new Error(`Failed to delete feedback: ${t.status}`)}async deleteAllFeedbacks(e){let t=await K(this.endpoint,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({projectName:e,deleteAll:!0})});if(!t.ok)throw new Error(`Failed to delete all feedbacks: ${t.status}`)}};var q=class{listeners=new Map;on(e,t){this.listeners.has(e)||this.listeners.set(e,new Set);let s=this.listeners.get(e);return s.add(t),()=>{s.delete(t)}}off(e,t){let s=this.listeners.get(e);s&&s.delete(t)}emit(e,...t){let s=this.listeners.get(e);if(s)for(let o of s)try{o(...t)}catch(i){console.error(`[siteping] Error in event listener for "${String(e)}":`,i)}}removeAll(){this.listeners.clear()}};var Ps=54,de=class{constructor(e,t,s,o){this.bus=s;this.t=o;let i=t.position??"bottom-right",r=i==="bottom-right";this.items=[{id:"chat",icon:bt,label:o("fab.messages")},{id:"annotate",icon:gt,label:o("fab.annotate")},{id:"toggle-annotations",icon:Ie,iconAlt:De,label:o("fab.annotations")}],this.fab=document.createElement("button"),this.fab.className=`sp-fab sp-fab--${i} sp-anim-fab-in`,this.fab.style.position="fixed",this.fab.appendChild(y(Pe)),this.fab.setAttribute("aria-label",o("fab.aria")),this.fab.setAttribute("aria-expanded","false"),this.fab.addEventListener("click",()=>this.toggle()),this.radialContainer=document.createElement("div"),this.radialContainer.className=`sp-radial sp-radial--${i}`,this.radialContainer.setAttribute("role","menu");for(let d=0;d<this.items.length;d++){let c=this.items[d];if(!c)continue;let u=document.createElement("button");u.className="sp-radial-item",u.style.setProperty("--sp-i",String(d)),u.appendChild(y(c.icon)),u.setAttribute("role","menuitem"),u.setAttribute("aria-label",c.label),u.dataset.itemId=c.id,u.addEventListener("click",f=>{f.stopPropagation(),this.handleItemClick(c.id)});let b=document.createElement("span");b.className="sp-radial-label",b.textContent=c.label,b.style.cssText=r?"position:absolute; right:54px; top:50%; transform:translateY(-50%); white-space:nowrap;":"position:absolute; left:54px; top:50%; transform:translateY(-50%); white-space:nowrap;",u.appendChild(b),this.radialContainer.appendChild(u)}this.root=document.createElement("div"),this.root.appendChild(this.radialContainer),this.root.appendChild(this.fab),e.appendChild(this.root);let a=e.host;this.onDocumentClick=d=>{this.isOpen&&!d.composedPath().includes(a)&&this.close()},document.addEventListener("click",this.onDocumentClick);let l=d=>{d.key==="Escape"&&this.isOpen&&(d.stopPropagation(),this.close())};this.fab.addEventListener("keydown",l),this.radialContainer.addEventListener("keydown",l),this.radialContainer.addEventListener("keydown",d=>{let c=Array.from(this.radialContainer.querySelectorAll(".sp-radial-item"));if(c.length===0||!this.isOpen)return;let u=e.activeElement??document.activeElement,b=c.indexOf(u);switch(d.key){case"ArrowUp":{d.preventDefault();let f=b<=0?c.length-1:b-1;c[f]?.focus();break}case"ArrowDown":{d.preventDefault();let f=b>=c.length-1?0:b+1;c[f]?.focus();break}case"Home":{d.preventDefault(),c[0]?.focus();break}case"End":{d.preventDefault(),c[c.length-1]?.focus();break}}})}bus;t;root;fab;radialContainer;badgeEl=null;isOpen=!1;annotationsVisible=!0;items;onDocumentClick;updateBadge(e){if(e<=0){this.badgeEl?.remove(),this.badgeEl=null;return}this.badgeEl||(this.badgeEl=document.createElement("span"),this.badgeEl.className="sp-fab-badge",this.badgeEl.setAttribute("role","status"),this.badgeEl.setAttribute("aria-live","polite"),this.fab.appendChild(this.badgeEl));let t=e>99?"99+":String(e);h(this.badgeEl,t),this.badgeEl.setAttribute("aria-label",this.t("fab.badge").replace("{count}",String(e)))}toggle(){this.isOpen?this.close():this.open()}open(){this.isOpen=!0,this.setFabIcon(te),this.fab.setAttribute("aria-expanded","true"),this.radialContainer.querySelectorAll(".sp-radial-item").forEach((t,s)=>{let o=-(16+Ps*(s+1));t.style.transform=`translate(0px, ${o}px) scale(1)`,t.classList.add("sp-radial-item--open")}),requestAnimationFrame(()=>{this.radialContainer.querySelector(".sp-radial-item")?.focus()})}close(){this.isOpen=!1,this.setFabIcon(Pe),this.fab.setAttribute("aria-expanded","false"),this.radialContainer.querySelectorAll(".sp-radial-item").forEach(t=>{t.style.transform="translate(0, 0) scale(0.8)",t.classList.remove("sp-radial-item--open")}),this.fab.focus()}setFabIcon(e){let t=this.badgeEl;this.fab.replaceChildren(y(e)),t&&this.fab.appendChild(t)}handleItemClick(e){switch(this.close(),e){case"chat":this.bus.emit("panel:toggle",!0);break;case"annotate":this.bus.emit("annotation:start");break;case"toggle-annotations":{this.annotationsVisible=!this.annotationsVisible,this.bus.emit("annotations:toggle",this.annotationsVisible);let t=this.radialContainer.querySelector('[data-item-id="toggle-annotations"]');t&&t.replaceChildren(y(this.annotationsVisible?Ie:De));break}}}destroy(){document.removeEventListener("click",this.onDocumentClick),this.root.remove()}};var Lt={"panel.title":"Feedbacks","panel.ariaLabel":"Siteping-Feedback-Panel","panel.feedbackList":"Feedbackliste","panel.loading":"Feedbacks werden geladen","panel.close":"Panel schlie\xDFen","panel.deleteAll":"Alle l\xF6schen","panel.deleteAllConfirmTitle":"Alle l\xF6schen","panel.deleteAllConfirmMessage":"Alle Feedbacks f\xFCr dieses Projekt l\xF6schen? Diese Aktion kann nicht r\xFCckg\xE4ngig gemacht werden.","panel.search":"Suchen...","panel.searchAria":"Feedbacks suchen","panel.filterAll":"Alle","panel.loadError":"Laden fehlgeschlagen","panel.retry":"Erneut versuchen","panel.empty":"Noch kein Feedback","panel.showMore":"Mehr anzeigen","panel.showLess":"Weniger anzeigen","panel.resolve":"Erledigen","panel.reopen":"Wieder \xF6ffnen","panel.delete":"L\xF6schen","panel.cancel":"Abbrechen","panel.confirmDelete":"L\xF6schen","panel.loadMore":"Mehr laden ({remaining} verbleibend)","panel.statusAll":"Alle","panel.statusOpen":"Offen","panel.statusResolved":"Erledigt","type.label":"Typ","type.question":"Frage","type.change":"\xC4nderung","type.bug":"Fehler","type.other":"Sonstiges","status.label":"Status","scope.label":"Bereich","scope.thisPage":"Diese Seite","scope.thisType":"Dieser Typ","scope.all":"Alle Seiten","fab.aria":"Siteping \u2014 Feedback-Men\xFC","fab.messages":"Nachrichten","fab.annotate":"Kommentieren","fab.annotations":"Anmerkungen","annotator.instruction":"Zeichne ein Rechteck um den Bereich, den du kommentieren m\xF6chtest","annotator.cancel":"Abbrechen","popup.ariaLabel":"Feedbackformular","popup.placeholder":"Beschreibe dein Feedback...","popup.textareaAria":"Feedbacknachricht","popup.submitHintMac":"\u2318+Enter zum Senden","popup.submitHintOther":"Strg+Enter zum Senden","popup.cancel":"Abbrechen","popup.submit":"Senden","identity.title":"Identifiziere dich","identity.nameLabel":"Name","identity.namePlaceholder":"Dein Name","identity.emailLabel":"E-Mail","identity.emailPlaceholder":"deine@email.de","identity.cancel":"Abbrechen","identity.submit":"Fortfahren","marker.approximate":"Ungef\xE4hre Position (Konfidenz: {confidence}%)","marker.aria":"Feedback #{number}: {type} \u2014 {message}","fab.badge":"{count} unerledigte Feedbacks","feedback.sent.confirmation":"Feedback erfolgreich gesendet","feedback.error.message":"Feedback konnte nicht gesendet werden","feedback.deleted.confirmation":"Feedback gel\xF6scht","badge.count":"{count} unerledigte Feedbacks"};var Mt={"panel.title":"Feedbacks","panel.ariaLabel":"Siteping feedback panel","panel.feedbackList":"Feedback list","panel.loading":"Loading feedbacks","panel.close":"Close panel","panel.deleteAll":"Delete all","panel.deleteAllConfirmTitle":"Delete all","panel.deleteAllConfirmMessage":"Delete all feedbacks for this project? This action cannot be undone.","panel.search":"Search...","panel.searchAria":"Search feedbacks","panel.filterAll":"All","panel.loadError":"Failed to load","panel.retry":"Retry","panel.empty":"No feedback yet","panel.showMore":"Show more","panel.showLess":"Show less","panel.resolve":"Resolve","panel.reopen":"Reopen","panel.delete":"Delete","panel.cancel":"Cancel","panel.confirmDelete":"Delete","panel.loadMore":"Load more ({remaining} remaining)","panel.statusAll":"All","panel.statusOpen":"Open","panel.statusResolved":"Resolved","type.label":"Type","type.question":"Question","type.change":"Change","type.bug":"Bug","type.other":"Other","status.label":"Status","scope.label":"Scope","scope.thisPage":"This page","scope.thisType":"This type","scope.all":"All pages","fab.aria":"Siteping \u2014 Feedback menu","fab.messages":"Messages","fab.annotate":"Annotate","fab.annotations":"Annotations","annotator.instruction":"Draw a rectangle on the area to comment","annotator.cancel":"Cancel","popup.ariaLabel":"Feedback form","popup.placeholder":"Describe your feedback...","popup.textareaAria":"Feedback message","popup.submitHintMac":"\u2318+Enter to send","popup.submitHintOther":"Ctrl+Enter to send","popup.cancel":"Cancel","popup.submit":"Send","identity.title":"Identify yourself","identity.nameLabel":"Name","identity.namePlaceholder":"Your name","identity.emailLabel":"Email","identity.emailPlaceholder":"your@email.com","identity.cancel":"Cancel","identity.submit":"Continue","marker.approximate":"Approximate position (confidence: {confidence}%)","marker.aria":"Feedback #{number}: {type} \u2014 {message}","fab.badge":"{count} unresolved feedbacks","feedback.sent.confirmation":"Feedback sent successfully","feedback.error.message":"Failed to send feedback","feedback.deleted.confirmation":"Feedback deleted","badge.count":"{count} unresolved feedbacks"};var Ft={"panel.title":"Comentarios","panel.ariaLabel":"Panel de comentarios de Siteping","panel.feedbackList":"Lista de comentarios","panel.loading":"Cargando comentarios","panel.close":"Cerrar panel","panel.deleteAll":"Eliminar todo","panel.deleteAllConfirmTitle":"Eliminar todo","panel.deleteAllConfirmMessage":"\xBFEliminar todos los comentarios de este proyecto? Esta acci\xF3n no se puede deshacer.","panel.search":"Buscar...","panel.searchAria":"Buscar comentarios","panel.filterAll":"Todos","panel.loadError":"No se pudo cargar","panel.retry":"Reintentar","panel.empty":"A\xFAn no hay comentarios","panel.showMore":"Mostrar m\xE1s","panel.showLess":"Mostrar menos","panel.resolve":"Resolver","panel.reopen":"Reabrir","panel.delete":"Eliminar","panel.cancel":"Cancelar","panel.confirmDelete":"Eliminar","panel.loadMore":"Cargar m\xE1s ({remaining} restantes)","panel.statusAll":"Todos","panel.statusOpen":"Abiertos","panel.statusResolved":"Resueltos","type.label":"Tipo","type.question":"Pregunta","type.change":"Cambio","type.bug":"Error","type.other":"Otro","status.label":"Estado","scope.label":"\xC1mbito","scope.thisPage":"Esta p\xE1gina","scope.thisType":"Este tipo","scope.all":"Todas las p\xE1ginas","fab.aria":"Siteping \u2014 Men\xFA de comentarios","fab.messages":"Mensajes","fab.annotate":"Anotar","fab.annotations":"Anotaciones","annotator.instruction":"Dibuja un rect\xE1ngulo sobre el \xE1rea que quieres comentar","annotator.cancel":"Cancelar","popup.ariaLabel":"Formulario de comentarios","popup.placeholder":"Describe tu comentario...","popup.textareaAria":"Mensaje de comentario","popup.submitHintMac":"\u2318+Enter para enviar","popup.submitHintOther":"Ctrl+Enter para enviar","popup.cancel":"Cancelar","popup.submit":"Enviar","identity.title":"Identif\xEDcate","identity.nameLabel":"Nombre","identity.namePlaceholder":"Tu nombre","identity.emailLabel":"Correo electr\xF3nico","identity.emailPlaceholder":"tu@email.com","identity.cancel":"Cancelar","identity.submit":"Continuar","marker.approximate":"Posici\xF3n aproximada (confianza: {confidence}%)","marker.aria":"Comentario #{number}: {type} \u2014 {message}","fab.badge":"{count} comentarios sin resolver","feedback.sent.confirmation":"Comentario enviado correctamente","feedback.error.message":"No se pudo enviar el comentario","feedback.deleted.confirmation":"Comentario eliminado","badge.count":"{count} comentarios sin resolver"};var Bt={"panel.title":"Feedbacks","panel.ariaLabel":"Panneau de feedback Siteping","panel.feedbackList":"Liste des feedbacks","panel.loading":"Chargement des feedbacks","panel.close":"Fermer le panneau","panel.deleteAll":"Tout supprimer","panel.deleteAllConfirmTitle":"Tout supprimer","panel.deleteAllConfirmMessage":"Supprimer tous les feedbacks de ce projet ? Cette action est irr\xE9versible.","panel.search":"Rechercher...","panel.searchAria":"Rechercher dans les feedbacks","panel.filterAll":"Tous","panel.loadError":"Erreur de chargement","panel.retry":"R\xE9essayer","panel.empty":"Aucun feedback pour le moment","panel.showMore":"Voir plus","panel.showLess":"Voir moins","panel.resolve":"R\xE9soudre","panel.reopen":"Rouvrir","panel.delete":"Supprimer","panel.cancel":"Annuler","panel.confirmDelete":"Supprimer","panel.loadMore":"Voir plus ({remaining} restants)","panel.statusAll":"Tous","panel.statusOpen":"Ouvert","panel.statusResolved":"R\xE9solu","type.label":"Type","type.question":"Question","type.change":"Changement","type.bug":"Bug","type.other":"Autre","status.label":"Statut","scope.label":"Port\xE9e","scope.thisPage":"Cette page","scope.thisType":"Ce type","scope.all":"Toutes les pages","fab.aria":"Siteping \u2014 Menu feedback","fab.messages":"Messages","fab.annotate":"Annoter","fab.annotations":"Annotations","annotator.instruction":"Tracez un rectangle sur la zone \xE0 commenter","annotator.cancel":"Annuler","popup.ariaLabel":"Formulaire de feedback","popup.placeholder":"D\xE9crivez votre retour...","popup.textareaAria":"Message de feedback","popup.submitHintMac":"\u2318+Entr\xE9e pour envoyer","popup.submitHintOther":"Ctrl+Entr\xE9e pour envoyer","popup.cancel":"Annuler","popup.submit":"Envoyer","identity.title":"Identifiez-vous","identity.nameLabel":"Nom","identity.namePlaceholder":"Votre nom","identity.emailLabel":"Email","identity.emailPlaceholder":"votre@email.com","identity.cancel":"Annuler","identity.submit":"Continuer","marker.approximate":"Position approximative (confiance : {confidence}%)","marker.aria":"Feedback n\xB0{number} : {type} \u2014 {message}","fab.badge":"{count} feedbacks non r\xE9solus","feedback.sent.confirmation":"Feedback envoy\xE9 avec succ\xE8s","feedback.error.message":"\xC9chec de l'envoi du feedback","feedback.deleted.confirmation":"Feedback supprim\xE9","badge.count":"{count} feedbacks non r\xE9solus"};var Rt={"panel.title":"Feedback","panel.ariaLabel":"Pannello feedback di Siteping","panel.feedbackList":"Elenco feedback","panel.loading":"Caricamento feedback","panel.close":"Chiudi pannello","panel.deleteAll":"Elimina tutto","panel.deleteAllConfirmTitle":"Elimina tutto","panel.deleteAllConfirmMessage":"Eliminare tutti i feedback per questo progetto? Questa azione non pu\xF2 essere annullata.","panel.search":"Cerca...","panel.searchAria":"Cerca feedback","panel.filterAll":"Tutti","panel.loadError":"Caricamento non riuscito","panel.retry":"Riprova","panel.empty":"Nessun feedback ancora","panel.showMore":"Mostra di pi\xF9","panel.showLess":"Mostra meno","panel.resolve":"Risolvi","panel.reopen":"Riapri","panel.delete":"Elimina","panel.cancel":"Annulla","panel.confirmDelete":"Elimina","panel.loadMore":"Carica altro ({remaining} rimanenti)","panel.statusAll":"Tutti","panel.statusOpen":"Aperti","panel.statusResolved":"Risolti","type.label":"Tipo","type.question":"Domanda","type.change":"Modifica","type.bug":"Bug","type.other":"Altro","status.label":"Stato","scope.label":"Ambito","scope.thisPage":"Questa pagina","scope.thisType":"Questo tipo","scope.all":"Tutte le pagine","fab.aria":"Siteping \u2014 Menu feedback","fab.messages":"Messaggi","fab.annotate":"Annota","fab.annotations":"Annotazioni","annotator.instruction":"Disegna un rettangolo sull'area da commentare","annotator.cancel":"Annulla","popup.ariaLabel":"Modulo feedback","popup.placeholder":"Descrivi il tuo feedback...","popup.textareaAria":"Messaggio di feedback","popup.submitHintMac":"\u2318+Invio per inviare","popup.submitHintOther":"Ctrl+Invio per inviare","popup.cancel":"Annulla","popup.submit":"Invia","identity.title":"Identificati","identity.nameLabel":"Nome","identity.namePlaceholder":"Il tuo nome","identity.emailLabel":"Email","identity.emailPlaceholder":"tua@email.com","identity.cancel":"Annulla","identity.submit":"Continua","marker.approximate":"Posizione approssimativa (confidenza: {confidence}%)","marker.aria":"Feedback #{number}: {type} \u2014 {message}","fab.badge":"{count} feedback non risolti","feedback.sent.confirmation":"Feedback inviato con successo","feedback.error.message":"Invio del feedback non riuscito","feedback.deleted.confirmation":"Feedback eliminato","badge.count":"{count} feedback non risolti"};var Pt={"panel.title":"Feedbacks","panel.ariaLabel":"Painel de feedback do Siteping","panel.feedbackList":"Lista de feedbacks","panel.loading":"Carregando feedbacks","panel.close":"Fechar painel","panel.deleteAll":"Excluir tudo","panel.deleteAllConfirmTitle":"Excluir tudo","panel.deleteAllConfirmMessage":"Excluir todos os feedbacks deste projeto? Esta a\xE7\xE3o n\xE3o pode ser desfeita.","panel.search":"Pesquisar...","panel.searchAria":"Pesquisar feedbacks","panel.filterAll":"Todos","panel.loadError":"Falha ao carregar","panel.retry":"Tentar novamente","panel.empty":"Nenhum feedback ainda","panel.showMore":"Mostrar mais","panel.showLess":"Mostrar menos","panel.resolve":"Resolver","panel.reopen":"Reabrir","panel.delete":"Excluir","panel.cancel":"Cancelar","panel.confirmDelete":"Excluir","panel.loadMore":"Carregar mais ({remaining} restantes)","panel.statusAll":"Todos","panel.statusOpen":"Abertos","panel.statusResolved":"Resolvidos","type.label":"Tipo","type.question":"Pergunta","type.change":"Altera\xE7\xE3o","type.bug":"Bug","type.other":"Outro","status.label":"Status","scope.label":"Escopo","scope.thisPage":"Esta p\xE1gina","scope.thisType":"Este tipo","scope.all":"Todas as p\xE1ginas","fab.aria":"Siteping \u2014 Menu de feedback","fab.messages":"Mensagens","fab.annotate":"Anotar","fab.annotations":"Anota\xE7\xF5es","annotator.instruction":"Desenhe um ret\xE2ngulo na \xE1rea que deseja comentar","annotator.cancel":"Cancelar","popup.ariaLabel":"Formul\xE1rio de feedback","popup.placeholder":"Descreva seu feedback...","popup.textareaAria":"Mensagem de feedback","popup.submitHintMac":"\u2318+Enter para enviar","popup.submitHintOther":"Ctrl+Enter para enviar","popup.cancel":"Cancelar","popup.submit":"Enviar","identity.title":"Identifique-se","identity.nameLabel":"Nome","identity.namePlaceholder":"Seu nome","identity.emailLabel":"E-mail","identity.emailPlaceholder":"seu@email.com","identity.cancel":"Cancelar","identity.submit":"Continuar","marker.approximate":"Posi\xE7\xE3o aproximada (confian\xE7a: {confidence}%)","marker.aria":"Feedback #{number}: {type} \u2014 {message}","fab.badge":"{count} feedbacks n\xE3o resolvidos","feedback.sent.confirmation":"Feedback enviado com sucesso","feedback.error.message":"Falha ao enviar feedback","feedback.deleted.confirmation":"Feedback exclu\xEDdo","badge.count":"{count} feedbacks n\xE3o resolvidos"};var It={"panel.title":"\u041E\u0431\u0440\u0430\u0442\u043D\u0430\u044F \u0441\u0432\u044F\u0437\u044C","panel.ariaLabel":"\u041F\u0430\u043D\u0435\u043B\u044C \u043E\u0431\u0440\u0430\u0442\u043D\u043E\u0439 \u0441\u0432\u044F\u0437\u0438 Siteping","panel.feedbackList":"\u0421\u043F\u0438\u0441\u043E\u043A \u043E\u0442\u0437\u044B\u0432\u043E\u0432","panel.loading":"\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430 \u043E\u0442\u0437\u044B\u0432\u043E\u0432","panel.close":"\u0417\u0430\u043A\u0440\u044B\u0442\u044C \u043F\u0430\u043D\u0435\u043B\u044C","panel.deleteAll":"\u0423\u0434\u0430\u043B\u0438\u0442\u044C \u0432\u0441\u0451","panel.deleteAllConfirmTitle":"\u0423\u0434\u0430\u043B\u0438\u0442\u044C \u0432\u0441\u0451","panel.deleteAllConfirmMessage":"\u0423\u0434\u0430\u043B\u0438\u0442\u044C \u0432\u0441\u0435 \u043E\u0442\u0437\u044B\u0432\u044B \u044D\u0442\u043E\u0433\u043E \u043F\u0440\u043E\u0435\u043A\u0442\u0430? \u042D\u0442\u043E \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u043D\u0435\u043E\u0431\u0440\u0430\u0442\u0438\u043C\u043E.","panel.search":"\u041F\u043E\u0438\u0441\u043A...","panel.searchAria":"\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u043E\u0442\u0437\u044B\u0432\u0430\u043C","panel.filterAll":"\u0412\u0441\u0435","panel.loadError":"\u041E\u0448\u0438\u0431\u043A\u0430 \u0437\u0430\u0433\u0440\u0443\u0437\u043A\u0438","panel.retry":"\u041F\u043E\u0432\u0442\u043E\u0440\u0438\u0442\u044C","panel.empty":"\u041F\u043E\u043A\u0430 \u043D\u0435\u0442 \u043E\u0442\u0437\u044B\u0432\u043E\u0432","panel.showMore":"\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u0431\u043E\u043B\u044C\u0448\u0435","panel.showLess":"\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u043C\u0435\u043D\u044C\u0448\u0435","panel.resolve":"\u0420\u0435\u0448\u0435\u043D\u043E","panel.reopen":"\u041E\u0442\u043A\u0440\u044B\u0442\u044C \u0437\u0430\u043D\u043E\u0432\u043E","panel.delete":"\u0423\u0434\u0430\u043B\u0438\u0442\u044C","panel.cancel":"\u041E\u0442\u043C\u0435\u043D\u0430","panel.confirmDelete":"\u0423\u0434\u0430\u043B\u0438\u0442\u044C","panel.loadMore":"\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u0435\u0449\u0451 ({remaining} \u043E\u0441\u0442\u0430\u043B\u043E\u0441\u044C)","panel.statusAll":"\u0412\u0441\u0435","panel.statusOpen":"\u041E\u0442\u043A\u0440\u044B\u0442\u044B\u0435","panel.statusResolved":"\u0420\u0435\u0448\u0451\u043D\u043D\u044B\u0435","type.label":"\u0422\u0438\u043F","type.question":"\u0412\u043E\u043F\u0440\u043E\u0441","type.change":"\u0423\u043B\u0443\u0447\u0448\u0435\u043D\u0438\u0435","type.bug":"\u0411\u0430\u0433","type.other":"\u0414\u0440\u0443\u0433\u043E\u0435","status.label":"\u0421\u0442\u0430\u0442\u0443\u0441","scope.label":"\u041E\u0431\u043B\u0430\u0441\u0442\u044C","scope.thisPage":"\u042D\u0442\u0430 \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0430","scope.thisType":"\u042D\u0442\u043E\u0442 \u0442\u0438\u043F","scope.all":"\u0412\u0441\u0435 \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u044B","fab.aria":"Siteping \u2014 \u041C\u0435\u043D\u044E \u043E\u0431\u0440\u0430\u0442\u043D\u043E\u0439 \u0441\u0432\u044F\u0437\u0438","fab.messages":"\u0421\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u044F","fab.annotate":"\u0410\u043D\u043D\u043E\u0442\u0430\u0446\u0438\u044F","fab.annotations":"\u0410\u043D\u043D\u043E\u0442\u0430\u0446\u0438\u0438","annotator.instruction":"\u0412\u044B\u0434\u0435\u043B\u0438\u0442\u0435 \u043E\u0431\u043B\u0430\u0441\u0442\u044C \u0434\u043B\u044F \u043A\u043E\u043C\u043C\u0435\u043D\u0442\u0430\u0440\u0438\u044F","annotator.cancel":"\u041E\u0442\u043C\u0435\u043D\u0430","popup.ariaLabel":"\u0424\u043E\u0440\u043C\u0430 \u043E\u0431\u0440\u0430\u0442\u043D\u043E\u0439 \u0441\u0432\u044F\u0437\u0438","popup.placeholder":"\u041E\u043F\u0438\u0448\u0438\u0442\u0435 \u043F\u0440\u043E\u0431\u043B\u0435\u043C\u0443 \u0438\u043B\u0438 \u043F\u0440\u0435\u0434\u043B\u043E\u0436\u0435\u043D\u0438\u0435...","popup.textareaAria":"\u0421\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435","popup.submitHintMac":"\u2318+Enter \u2014 \u043E\u0442\u043F\u0440\u0430\u0432\u0438\u0442\u044C","popup.submitHintOther":"Ctrl+Enter \u2014 \u043E\u0442\u043F\u0440\u0430\u0432\u0438\u0442\u044C","popup.cancel":"\u041E\u0442\u043C\u0435\u043D\u0430","popup.submit":"\u041E\u0442\u043F\u0440\u0430\u0432\u0438\u0442\u044C","identity.title":"\u041F\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u044C\u0442\u0435\u0441\u044C","identity.nameLabel":"\u0418\u043C\u044F","identity.namePlaceholder":"\u0412\u0430\u0448\u0435 \u0438\u043C\u044F","identity.emailLabel":"Email","identity.emailPlaceholder":"\u0432\u0430\u0448@email.com","identity.cancel":"\u041E\u0442\u043C\u0435\u043D\u0430","identity.submit":"\u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0438\u0442\u044C","marker.approximate":"\u041F\u0440\u0438\u0431\u043B\u0438\u0437\u0438\u0442\u0435\u043B\u044C\u043D\u0430\u044F \u043F\u043E\u0437\u0438\u0446\u0438\u044F (\u0442\u043E\u0447\u043D\u043E\u0441\u0442\u044C: {confidence}%)","marker.aria":"\u041E\u0442\u0437\u044B\u0432 #{number}: {type} \u2014 {message}","fab.badge":"\u041D\u0435\u0440\u0435\u0448\u0451\u043D\u043D\u044B\u0445 \u043E\u0442\u0437\u044B\u0432\u043E\u0432: {count}","feedback.sent.confirmation":"\u041E\u0442\u0437\u044B\u0432 \u0443\u0441\u043F\u0435\u0448\u043D\u043E \u043E\u0442\u043F\u0440\u0430\u0432\u043B\u0435\u043D","feedback.error.message":"\u041D\u0435 \u0443\u0434\u0430\u043B\u043E\u0441\u044C \u043E\u0442\u043F\u0440\u0430\u0432\u0438\u0442\u044C \u043E\u0442\u0437\u044B\u0432","feedback.deleted.confirmation":"\u041E\u0442\u0437\u044B\u0432 \u0443\u0434\u0430\u043B\u0451\u043D","badge.count":"\u041D\u0435\u0440\u0435\u0448\u0451\u043D\u043D\u044B\u0445 \u043E\u0442\u0437\u044B\u0432\u043E\u0432: {count}"};var He={de:Lt,en:Mt,es:Ft,fr:Bt,it:Rt,pt:Pt,ru:It};function ce(n){let e=(n.split("-")[0]??n).toLowerCase();He[e]||console.warn(`[siteping] Unknown locale "${n}", falling back to "en"`);let t=He[e]??He.en??{};return s=>t[s]??s}function O(n,e){switch(n){case"question":return e("type.question");case"change":return e("type.change");case"bug":return e("type.bug");case"other":return e("type.other");default:return n}}var Dt="siteping_identity";function Ot(){try{let n=localStorage.getItem(Dt);if(!n)return null;let e=JSON.parse(n);if(typeof e=="object"&&e!==null&&"name"in e&&typeof e.name=="string"&&"email"in e&&typeof e.email=="string"){let t=e;if(t.name&&t.email)return t}return null}catch{return null}}function Nt(n){try{localStorage.setItem(Dt,JSON.stringify(n))}catch{}}function Is(n,e){if(n===e)return 0;if(n.length===0)return e.length;if(e.length===0)return n.length;if(n.length>e.length){let r=n;n=e,e=r}let t=n.length,s=e.length,o=new Array(t+1);for(let r=0;r<=t;r++)o[r]=r;let i=new Array(t+1);for(let r=1;r<=s;r++){i[0]=r;for(let l=1;l<=t;l++){let d=o[l-1]??0;i[l]=n[l-1]===e[r-1]?d:1+Math.min(d,o[l]??0,i[l-1]??0)}let a=o;o=i,i=a}return o[t]??0}function $(n,e){if(n===e)return 1;let t=Math.max(n.length,e.length);return t===0?1:1-Is(n,e)/t}function _e(n,e,t=.6){if(!e||!n)return 0;if(n.includes(e))return 1;let s=e.length;if(s>n.length){let a=$(n,e);return a>=t?a:0}let o=0,i=n.length>500?n.slice(0,500):n,r=i.length-s;for(let a=0;a<=r;a++){let l=i.slice(a,a+s),d=$(l,e);if(d>o&&(o=d),o>=.95)break}return o>=t?o:0}var Ds=300,Os=.3;function ue(n,e){if(!e.textSnippet)return!0;let t=(n.textContent?.trim()??"").slice(0,500);return _e(t,e.textSnippet,.5)>Os}function Ns(n){if(n.anchorKey){let e=n.anchorKey.replace(/\\/g,"\\\\").replace(/"/g,'\\"');try{let t=document.querySelector(`[${j}="${e}"]`);if(t&&ue(t,n))return{element:t,confidence:1,strategy:"anchorKey"}}catch{}}if(n.elementId){let e=document.getElementById(n.elementId);if(e&&e.tagName===n.elementTag&&ue(e,n))return{element:e,confidence:1,strategy:"id"}}try{let e=document.querySelector(n.cssSelector);if(e&&e.tagName===n.elementTag&&ue(e,n))return{element:e,confidence:.95,strategy:"css"}}catch{}try{let t=document.evaluate(n.xpath,document,null,XPathResult.FIRST_ORDERED_NODE_TYPE,null).singleNodeValue;if(t instanceof Element&&t.tagName===n.elementTag&&ue(t,n))return{element:t,confidence:.9,strategy:"xpath"}}catch{}return Hs(n)}function Hs(n){let e=n.elementTag.toLowerCase(),t=document.querySelectorAll(e);if(t.length===0)return null;let s=null,o=0,i=Math.min(t.length,Ds);for(let r=0;r<i;r++){let a=t[r];if(!a)continue;let l=_s(a,n);if(l>o&&(o=l,s=a,o>=.85))break}return!s||o<.4?null:{element:s,confidence:Math.min(o,.85),strategy:"scan"}}function _s(n,e){let t=0,s=0,o=(n.textContent?.trim()??"").slice(0,500);if(e.textSnippet&&(s+=40,t+=_e(o,e.textSnippet,.5)*40),e.fingerprint&&(s+=20,t+=pt(n,e.fingerprint)*20),e.textPrefix||e.textSuffix){s+=20;let i=0,r=0;if(e.textPrefix){let a=_(n,"before");i+=a?$(a,e.textPrefix):0,r++}if(e.textSuffix){let a=_(n,"after");i+=a?$(a,e.textSuffix):0,r++}r>0&&(t+=i/r*20)}if(e.neighborText){s+=20;let i=Z(n);t+=i?$(i,e.neighborText)*20:0}return s>0?t/s:0}function he(n,e){let t=Ns(n);if(!t)return null;let s=t.element.getBoundingClientRect(),o=new DOMRect(s.x+e.xPct*s.width,s.y+e.yPct*s.height,e.wPct*s.width,e.hPct*s.height);return{element:t.element,rect:o,confidence:t.confidence,strategy:t.strategy}}function $e(n){return{cssSelector:n.cssSelector,xpath:n.xpath,textSnippet:n.textSnippet,elementTag:n.elementTag,elementId:n.elementId??void 0,textPrefix:n.textPrefix,textSuffix:n.textSuffix,fingerprint:n.fingerprint,neighborText:n.neighborText,anchorKey:n.anchorKey??null}}function be(n){return{xPct:n.xPct,yPct:n.yPct,wPct:n.wPct,hPct:n.hPct}}var Ht=13;function _t(n){return{top:n.top+window.scrollY-Ht,left:n.right+window.scrollX-Ht}}function Y(n,e){let t=n.entries[e],s=n.elementIndices[e];if(!(!t||s===void 0))return t.elements[s]}var $t=300,jt=200,$s=.7,js=28,zt=32,ge=class{constructor(e,t,s,o){this.colors=e;this.tooltip=t;this.bus=s;this.t=o;this.container=p("div",{style:`position:absolute;top:0;left:0;pointer-events:none;z-index:${2147483646};`}),this.container.id="siteping-markers",document.body.appendChild(this.container),this.bus.on("annotations:toggle",i=>{this.container.style.display=i?"block":"none"}),this.resizeHandler=()=>this.scheduleReposition(),window.addEventListener("resize",this.resizeHandler,{passive:!0}),this.scrollHandler=()=>this.scheduleReposition(),window.addEventListener("scroll",this.scrollHandler,{passive:!0,capture:!0}),this.mutationObserver=new MutationObserver(i=>{let r=!1;for(let a of i)if(!(this.container.contains(a.target)||this.tooltip.contains(a.target))){r=!0;break}r&&this.scheduleReposition()}),this.mutationObserver.observe(document.body,{childList:!0,subtree:!0,attributes:!1,characterData:!1}),this.onDocumentClickForClusters=i=>{this.container.contains(i.target)||this.collapseAllClusters()},document.addEventListener("click",this.onDocumentClickForClusters)}colors;tooltip;bus;t;container;entries=[];highlightElements=[];pinnedFeedback=null;onDocumentClick=null;repositionTimer=null;mutationObserver=null;scrollHandler=null;resizeHandler=null;anchorCache=new Map;clusters=[];onDocumentClickForClusters=null;get count(){return this.entries.length}scheduleReposition(){this.repositionTimer||("requestIdleCallback"in window?this.repositionTimer=window.requestIdleCallback(()=>{this.repositionTimer=null,this.repositionAll()},{timeout:jt+100}):this.repositionTimer=+setTimeout(()=>{this.repositionTimer=null,this.repositionAll()},jt))}repositionAll(){let e=new Set;for(let t of this.entries)for(let s=0;s<t.feedback.annotations.length;s++){let o=t.elements[s];if(!o)continue;let i=t.feedback.annotations[s];if(!i)continue;let r=`${t.feedback.id}:${s}`;e.add(r);let l=this.anchorCache.get(r)?.deref(),d;if(l?.isConnected){let u=l.getBoundingClientRect(),b=be(i);d={element:l,rect:new DOMRect(u.left+b.xPct*u.width,u.top+b.yPct*u.height,b.wPct*u.width,b.hPct*u.height),confidence:1,strategy:"css"}}else d=he($e(i),be(i)),d?.element&&this.anchorCache.set(r,new WeakRef(d.element));if(!d){o.style.display="none";continue}let c=_t(d.rect);t.baseTop=c.top,t.baseLeft=c.left,o.style.display="flex",this.applyConfidenceStyle(o,d.confidence,t.feedback)}for(let t of this.anchorCache.keys())e.has(t)||this.anchorCache.delete(t);this.applyClusterPositions(),this.pinnedFeedback&&this.showHighlight(this.pinnedFeedback)}applyClusterPositions(){for(let e of this.clusters)e.expanded?this.applyFanPositions(e):this.applyStackPositions(e)}render(e){this.clear(),e.forEach((t,s)=>{let o=this.buildEntry(t,s+1);this.entries.push(o)}),this.buildClusters()}addFeedback(e,t){let s=this.buildEntry(e,t);for(let o of s.elements)o.style.animation="sp-marker-in 0.35s cubic-bezier(0.34,1.56,0.64,1) both";this.entries.push(s),this.buildClusters()}buildEntry(e,t){let s={feedback:e,elements:[],baseTop:0,baseLeft:0};for(let o of e.annotations){let i=he($e(o),be(o));if(!i)continue;let r=_t(i.rect);s.baseTop=r.top,s.baseLeft=r.left;let a=this.createMarker(t,e,r);this.applyConfidenceStyle(a,i.confidence,e),this.container.appendChild(a),s.elements.push(a)}return s}buildClusters(){for(let s of this.container.querySelectorAll(".sp-cluster-badge"))s.remove();let e=[];for(let s of this.entries)for(let o=0;o<s.elements.length;o++)e.push({entry:s,elIdx:o});let t=new Set;this.clusters=[];for(let s=0;s<e.length;s++){if(t.has(s))continue;let o=e[s];if(!o)continue;let i={entries:[o.entry],elementIndices:[o.elIdx],expanded:!1};t.add(s);for(let r=s+1;r<e.length;r++){if(t.has(r))continue;let a=o.entry,l=e[r];if(!l)continue;let d=l.entry;Math.sqrt((a.baseLeft-d.baseLeft)**2+(a.baseTop-d.baseTop)**2)<js&&(i.entries.push(d),i.elementIndices.push(l.elIdx),t.add(r))}this.clusters.push(i)}for(let s of this.clusters)s.entries.length<=1||(this.applyStackPositions(s),this.addClusterBadge(s))}applyStackPositions(e){let t=e.entries[0];if(!t)return;let{baseTop:s,baseLeft:o}=t,i=e.entries.length<=1;for(let r=0;r<e.entries.length;r++){let a=Y(e,r);a&&(a.style.top=`${s+(i?0:r*3)}px`,a.style.left=`${o+(i?0:r*3)}px`,a.style.zIndex=String(r+1))}}applyFanPositions(e){let t=e.entries[0];if(!t)return;let{baseTop:s,baseLeft:o}=t,i=e.entries.length,r=(i-1)*zt,a=o-r/2;for(let l=0;l<i;l++){let d=Y(e,l);d&&(d.style.top=`${s}px`,d.style.left=`${a+l*zt}px`,d.style.zIndex=String(10+l))}}addClusterBadge(e){let t=Y(e,e.entries.length-1);if(!t)return;let s=p("div",{class:"sp-cluster-badge",style:`
|
|
94
|
+
`}),this.overlay?.appendChild(this.drawingRect);}onMouseMove=e=>{this.scheduleRectUpdate(e);};onTouchMove=e=>{e.preventDefault(),e.touches[0]&&this.scheduleRectUpdate(e.touches[0]);};scheduleRectUpdate(e){!this.isDrawing||!this.drawingRect||(this.pendingMoveEvent=e,this.rafId===null&&(this.rafId=requestAnimationFrame(()=>{this.rafId=null;let n=this.pendingMoveEvent;if(!n||!this.drawingRect)return;let o=Math.min(n.clientX,this.startX),i=Math.min(n.clientY,this.startY),r=Math.abs(n.clientX-this.startX),s=Math.abs(n.clientY-this.startY);this.drawingRect.style.left=`${o}px`,this.drawingRect.style.top=`${i}px`,this.drawingRect.style.width=`${r}px`,this.drawingRect.style.height=`${s}px`;})));}onTouchEnd=async e=>{let n=e.changedTouches[0];n&&await this.finishDrawing(n.clientX,n.clientY);};onMouseUp=async e=>{await this.finishDrawing(e.clientX,e.clientY);};finishDrawing=async(e,n)=>{if(!this.isDrawing||!this.drawingRect)return;this.isDrawing=false;let o=Math.min(e,this.startX),i=Math.min(n,this.startY),r=Math.abs(e-this.startX),s=Math.abs(n-this.startY);if(r<10||s<10){this.drawingRect.remove(),this.drawingRect=null;return}let a=new DOMRect(o,i,r,s),c=await this.popup.show(a);if(!c){this.drawingRect?.remove(),this.drawingRect=null;return}let p=this.buildAnnotation(a);this.drawingRect?.remove(),this.drawingRect=null;let l=await this.maybeCapture(a);this.deactivate(),this.bus.emit("annotation:complete",{annotation:p,type:c.type,message:c.message,screenshotDataUrl:l});};buildAnnotation(e){this.overlay&&(this.overlay.style.pointerEvents="none");let n=gt(e);this.overlay&&(this.overlay.style.pointerEvents="auto");let o=Fe(n),i=n.getBoundingClientRect(),r=bt(e,i);return {anchor:o,rect:r,scrollX:window.scrollX,scrollY:window.scrollY,viewportW:window.innerWidth,viewportH:window.innerHeight,devicePixelRatio:window.devicePixelRatio}}destroy(){this.deactivate(),this.popup.destroy();}};var T=class extends Error{code;retryable;constructor(e,n,o){super(e),this.code=n,this.retryable=o,this.name="SitepingError";}},H=class extends T{constructor(e){super(e,"NETWORK",true),this.name="SitepingNetworkError";}},U=class extends T{constructor(e){super(e,"VALIDATION",false),this.name="SitepingValidationError";}},Y=class extends T{constructor(e){super(e,"AUTH",false),this.name="SitepingAuthError";}};function Me(t){return {cssSelector:t.anchor.cssSelector,xpath:t.anchor.xpath,textSnippet:t.anchor.textSnippet,elementTag:t.anchor.elementTag,elementId:t.anchor.elementId,textPrefix:t.anchor.textPrefix,textSuffix:t.anchor.textSuffix,fingerprint:t.anchor.fingerprint,neighborText:t.anchor.neighborText,anchorKey:t.anchor.anchorKey??null,xPct:t.rect.xPct,yPct:t.rect.yPct,wPct:t.rect.wPct,hPct:t.rect.hPct,scrollX:t.scrollX,scrollY:t.scrollY,viewportW:t.viewportW,viewportH:t.viewportH,devicePixelRatio:t.devicePixelRatio}}async function W(t,e){let n=await t.text().catch(()=>"Unknown error"),o=n?`${t.status} ${n}`:`${t.status}`,i=`${e}: ${o}`;return t.status===401||t.status===403?new Y(i):t.status>=400&&t.status<500?new U(i):new T(i,"SERVER",false)}function q(t,e){if(t instanceof T&&t instanceof H)return t;let n=t instanceof Error?t.message:String(t);return new H(`${e}: ${n}`)}var Jt=3,Qt=1e4,V="siteping_retry_queue",Zt=20;async function G(t,e,n=Jt){for(let o=0;o<=n;o++){let i=new AbortController,r=setTimeout(()=>i.abort(),Qt);try{let c=await fetch(t,{...e,signal:i.signal});if(clearTimeout(r),c.ok||c.status>=400&&c.status<500||o===n)return c}catch(c){if(clearTimeout(r),o===n)throw c}let s=1e3*2**o,a=Math.random()*1e3-500;await new Promise(c=>setTimeout(c,s+a));}throw new Error("Max retries exceeded")}var en="siteping_retry_queue";async function vt(t){return typeof navigator<"u"&&navigator.locks?navigator.locks.request(en,()=>t()):t()}function tn(t,e){vt(()=>{try{let n=localStorage.getItem(V),o=n?JSON.parse(n):[],i=Array.isArray(o)?o:[];i.length>=Zt&&i.shift(),i.push({endpoint:t,payload:e}),localStorage.setItem(V,JSON.stringify(i));}catch{}});}async function wt(t){await vt(async()=>{try{let e=localStorage.getItem(V);if(!e)return;let n=JSON.parse(e),o=Array.isArray(n)?n:[],i=o.filter(a=>a.endpoint===t);if(i.length===0)return;let r=[];for(let a of i)try{(await fetch(t,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(a.payload)})).ok||r.push(a);}catch{r.push(a);}let s=o.filter(a=>a.endpoint!==t).concat(r);s.length>0?localStorage.setItem(V,JSON.stringify(s)):localStorage.removeItem(V);}catch{}});}var ce=class{constructor(e,n){this.endpoint=e;this.projectName=n;}endpoint;projectName;async sendFeedback(e){try{let n;try{n=await G(this.endpoint,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(e)});}catch(o){throw q(o,"Failed to send feedback")}if(!n.ok)throw await W(n,"Failed to send feedback");return await n.json()}catch(n){throw tn(this.endpoint,e),n}}async getFeedbacks(e,n){let o=new URLSearchParams({projectName:e});n?.page&&o.set("page",String(n.page)),n?.limit&&o.set("limit",String(n.limit)),n?.type&&o.set("type",n.type),n?.status&&o.set("status",n.status),n?.search&&o.set("search",n.search),n?.url&&o.set("url",n.url),n?.urlPattern&&o.set("urlPattern",n.urlPattern);let i;try{i=await G(`${this.endpoint}?${o.toString()}`,{method:"GET",cache:"no-store"});}catch(r){throw q(r,"Failed to fetch feedbacks")}if(!i.ok)throw await W(i,"Failed to fetch feedbacks");return await i.json()}async resolveFeedback(e,n){let o;try{o=await G(this.endpoint,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify({id:e,projectName:this.projectName,status:n?"resolved":"open"})});}catch(i){throw q(i,"Failed to update feedback")}if(!o.ok)throw await W(o,"Failed to update feedback");return await o.json()}async deleteFeedback(e){let n;try{n=await G(this.endpoint,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({id:e,projectName:this.projectName})});}catch(o){throw q(o,"Failed to delete feedback")}if(!n.ok)throw await W(n,"Failed to delete feedback")}async deleteAllFeedbacks(e){let n;try{n=await G(this.endpoint,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({projectName:e,deleteAll:!0})});}catch(o){throw q(o,"Failed to delete all feedbacks")}if(!n.ok)throw await W(n,"Failed to delete all feedbacks")}};var nn=["log","info","warn","error"];function on(t){if(t===null)return "null";if(t===void 0)return "undefined";if(typeof t=="string")return t;if(typeof t=="number"||typeof t=="boolean"||typeof t=="bigint")return String(t);if(t instanceof Error)return `${t.name}: ${t.message}${t.stack?`
|
|
95
|
+
${t.stack}`:""}`;try{let e=new WeakSet;return JSON.stringify(t,(n,o)=>{if(typeof o=="function")return "[Function]";if(typeof o=="symbol")return o.toString();if(typeof o=="object"&&o!==null){if(e.has(o))return "[Circular]";e.add(o);}return o})}catch{try{return String(t)}catch{return "[Unserializable]"}}}function rn(t){let e="";for(let n=0;n<t.length&&(n>0&&(e+=" "),e+=on(t[n]),!(e.length>=500));n++);return e.length>500&&(e=`${e.slice(0,499)}\u2026`),e}var pe=class{maxEntries;entries=[];originals=new Map;disposed=false;constructor(e=50){if(this.maxEntries=Math.min(Math.max(Math.floor(e),0),1e3),!(typeof console>"u"))for(let n of nn){let o=console[n];if(typeof o!="function")continue;this.originals.set(n,o);let i=this,r=function(...s){try{i.push(n,s);}catch{}o.apply(this??console,s);};try{Object.defineProperty(r,"name",{value:n});}catch{}console[n]=r;}}push(e,n){this.maxEntries!==0&&(this.entries.length>=this.maxEntries&&this.entries.shift(),this.entries.push({level:e,timestamp:new Date().toISOString(),message:rn(n)}));}getEntries(){return this.entries.slice()}dispose(){if(!this.disposed&&(this.disposed=true,!(typeof console>"u"))){for(let[e,n]of this.originals)try{console[e]=n;}catch{}this.originals.clear();}}};function kt(t){return t.length<=2e3?t:`${t.slice(0,1999)}\u2026`}function Et(t){if(typeof t=="string")return t;if(t instanceof URL)return t.href;if(typeof t=="object"&&t!==null&&"url"in t){let e=t.url;if(typeof e=="string")return e}try{return String(t)}catch{return "(unknown)"}}var de=class{maxEntries;entries=[];originalFetch=null;originalXhrOpen=null;originalXhrSend=null;disposed=false;constructor(e=20){this.maxEntries=Math.min(Math.max(Math.floor(e),0),500),this.installFetch(),this.installXhr();}push(e){this.maxEntries!==0&&(this.entries.length>=this.maxEntries&&this.entries.shift(),this.entries.push(e));}installFetch(){if(typeof globalThis.fetch!="function")return;let e=globalThis.fetch;this.originalFetch=e;let n=async(o,i)=>{let r=new Date,s=typeof performance<"u"?performance.now():Date.now(),a=kt(Et(o)),c=(i?.method??(o instanceof Request?o.method:"GET")).toUpperCase();try{let p=await e(o,i);if(!p.ok){let l=typeof performance<"u"?performance.now():Date.now();this.push({url:a,method:c,status:p.status,durationMs:Math.round(l-s),timestamp:r.toISOString()});}return p}catch(p){let l=typeof performance<"u"?performance.now():Date.now();throw this.push({url:a,method:c,status:0,durationMs:Math.round(l-s),timestamp:r.toISOString()}),p}};globalThis.fetch=n;}installXhr(){if(typeof XMLHttpRequest>"u")return;let e=XMLHttpRequest.prototype,n=e.open,o=e.send;this.originalXhrOpen=n,this.originalXhrSend=o;let i=this,r=new WeakMap;e.open=function(s,a,...c){try{r.set(this,{method:s.toUpperCase(),url:kt(Et(a)),startedAt:new Date,t0:typeof performance<"u"?performance.now():Date.now()});}catch{}return n.call(this,s,a,...c)},e.send=function(s){let a=r.get(this);if(a){let c=()=>{try{let p=typeof performance<"u"?performance.now():Date.now(),l=this.status;(l===0||l>=400)&&i.push({url:a.url,method:a.method,status:l,durationMs:Math.round(p-a.t0),timestamp:a.startedAt.toISOString()});}catch{}};try{this.addEventListener("loadend",c,{once:!0});}catch{try{this.addEventListener("loadend",c);}catch{}}}return o.call(this,s??null)};}getEntries(){return this.entries.slice()}dispose(){if(!this.disposed){if(this.disposed=true,this.originalFetch&&typeof globalThis.fetch=="function")try{globalThis.fetch=this.originalFetch;}catch{}if(typeof XMLHttpRequest<"u")try{this.originalXhrOpen&&(XMLHttpRequest.prototype.open=this.originalXhrOpen),this.originalXhrSend&&(XMLHttpRequest.prototype.send=this.originalXhrSend);}catch{}}}};var J=class{listeners=new Map;on(e,n){this.listeners.has(e)||this.listeners.set(e,new Set);let o=this.listeners.get(e);return o.add(n),()=>{o.delete(n);}}off(e,n){let o=this.listeners.get(e);o&&o.delete(n);}emit(e,...n){let o=this.listeners.get(e);if(o)for(let i of o)try{i(...n);}catch(r){console.error(`[siteping] Error in event listener for "${String(e)}":`,r);}}removeAll(){this.listeners.clear();}};var sn=54,ue=class{constructor(e,n,o,i$1){this.bus=o;this.t=i$1;let r=n.position??"bottom-right",s=r==="bottom-right";this.items=[{id:"chat",icon:g,label:i$1("fab.messages")},{id:"annotate",icon:h,label:i$1("fab.annotate")},{id:"toggle-annotations",icon:i,iconAlt:j,label:i$1("fab.annotations")}],this.fab=document.createElement("button"),this.fab.className=`sp-fab sp-fab--${r} sp-anim-fab-in`,this.fab.style.position="fixed",this.fab.appendChild(a(f)),this.fab.setAttribute("aria-label",i$1("fab.aria")),this.fab.setAttribute("aria-expanded","false"),this.fab.addEventListener("click",()=>this.toggle()),this.radialContainer=document.createElement("div"),this.radialContainer.className=`sp-radial sp-radial--${r}`,this.radialContainer.setAttribute("role","menu");for(let p=0;p<this.items.length;p++){let l=this.items[p];if(!l)continue;let d=document.createElement("button");d.className="sp-radial-item",d.style.setProperty("--sp-i",String(p)),d.appendChild(a(l.icon)),d.setAttribute("role","menuitem"),d.setAttribute("aria-label",l.label),d.dataset.itemId=l.id,d.addEventListener("click",f=>{f.stopPropagation(),this.handleItemClick(l.id);});let h=document.createElement("span");h.className="sp-radial-label",h.textContent=l.label,h.style.cssText=s?"position:absolute; right:54px; top:50%; transform:translateY(-50%); white-space:nowrap;":"position:absolute; left:54px; top:50%; transform:translateY(-50%); white-space:nowrap;",d.appendChild(h),this.radialContainer.appendChild(d);}this.root=document.createElement("div"),this.root.appendChild(this.radialContainer),this.root.appendChild(this.fab),e.appendChild(this.root);let a$1=e.host;this.onDocumentClick=p=>{this.isOpen&&!p.composedPath().includes(a$1)&&this.close();},document.addEventListener("click",this.onDocumentClick);let c=p=>{p.key==="Escape"&&this.isOpen&&(p.stopPropagation(),this.close());};this.fab.addEventListener("keydown",c),this.radialContainer.addEventListener("keydown",c),this.radialContainer.addEventListener("keydown",p=>{let l=Array.from(this.radialContainer.querySelectorAll(".sp-radial-item"));if(l.length===0||!this.isOpen)return;let d=e.activeElement??document.activeElement,h=l.indexOf(d);switch(p.key){case "ArrowUp":{p.preventDefault();let f=h<=0?l.length-1:h-1;l[f]?.focus();break}case "ArrowDown":{p.preventDefault();let f=h>=l.length-1?0:h+1;l[f]?.focus();break}case "Home":{p.preventDefault(),l[0]?.focus();break}case "End":{p.preventDefault(),l[l.length-1]?.focus();break}}});}bus;t;root;fab;radialContainer;badgeEl=null;isOpen=false;annotationsVisible=true;items;onDocumentClick;updateBadge(e){if(e<=0){this.badgeEl?.remove(),this.badgeEl=null;return}this.badgeEl||(this.badgeEl=document.createElement("span"),this.badgeEl.className="sp-fab-badge",this.badgeEl.setAttribute("role","status"),this.badgeEl.setAttribute("aria-live","polite"),this.fab.appendChild(this.badgeEl));let n=e>99?"99+":String(e);c(this.badgeEl,n),this.badgeEl.setAttribute("aria-label",this.t("fab.badge").replace("{count}",String(e)));}toggle(){this.isOpen?this.close():this.open();}open(){this.isOpen=true,this.setFabIcon(k),this.fab.setAttribute("aria-expanded","true"),this.radialContainer.querySelectorAll(".sp-radial-item").forEach((n,o)=>{let i=-(16+sn*(o+1));n.style.transform=`translate(0px, ${i}px) scale(1)`,n.classList.add("sp-radial-item--open");}),requestAnimationFrame(()=>{this.radialContainer.querySelector(".sp-radial-item")?.focus();});}close(){this.isOpen=false,this.setFabIcon(f),this.fab.setAttribute("aria-expanded","false"),this.radialContainer.querySelectorAll(".sp-radial-item").forEach(n=>{n.style.transform="translate(0, 0) scale(0.8)",n.classList.remove("sp-radial-item--open");}),this.fab.focus();}setFabIcon(e){let n=this.badgeEl;this.fab.replaceChildren(a(e)),n&&this.fab.appendChild(n);}handleItemClick(e){switch(this.close(),e){case "chat":this.bus.emit("panel:toggle",true);break;case "annotate":this.bus.emit("annotation:start");break;case "toggle-annotations":{this.annotationsVisible=!this.annotationsVisible,this.bus.emit("annotations:toggle",this.annotationsVisible);let n=this.radialContainer.querySelector('[data-item-id="toggle-annotations"]');n&&n.replaceChildren(a(this.annotationsVisible?i:j));break}}}destroy(){document.removeEventListener("click",this.onDocumentClick),this.root.remove();}};var St="siteping_identity";function Tt(){try{let t=localStorage.getItem(St);if(!t)return null;let e=JSON.parse(t);if(typeof e=="object"&&e!==null&&"name"in e&&typeof e.name=="string"&&"email"in e&&typeof e.email=="string"){let n=e;if(n.name&&n.email)return n}return null}catch{return null}}function Ct(t){try{localStorage.setItem(St,JSON.stringify(t));}catch{}}function an(t,e){if(t===e)return 0;if(t.length===0)return e.length;if(e.length===0)return t.length;if(t.length>e.length){let s=t;t=e,e=s;}let n=t.length,o=e.length,i=new Array(n+1);for(let s=0;s<=n;s++)i[s]=s;let r=new Array(n+1);for(let s=1;s<=o;s++){r[0]=s;for(let c=1;c<=n;c++){let p=i[c-1]??0;r[c]=t[c-1]===e[s-1]?p:1+Math.min(p,i[c]??0,r[c-1]??0);}let a=i;i=r,r=a;}return i[n]??0}function O(t,e){if(t===e)return 1;let n=Math.max(t.length,e.length);return n===0?1:1-an(t,e)/n}function Ie(t,e,n=.6){if(!e||!t)return 0;if(t.includes(e))return 1;let o=e.length;if(o>t.length){let a=O(t,e);return a>=n?a:0}let i=0,r=t.length>500?t.slice(0,500):t,s=r.length-o;for(let a=0;a<=s;a++){let c=r.slice(a,a+o),p=O(c,e);if(p>i&&(i=p),i>=.95)break}return i>=n?i:0}var ln=300,cn=.3;function he(t,e){if(!e.textSnippet)return true;let n=(t.textContent?.trim()??"").slice(0,500);return Ie(n,e.textSnippet,.5)>cn}function pn(t){if(t.anchorKey){let e=t.anchorKey.replace(/\\/g,"\\\\").replace(/"/g,'\\"');try{let n=document.querySelector(`[${K}="${e}"]`);if(n&&he(n,t))return {element:n,confidence:1,strategy:"anchorKey"}}catch{}}if(t.elementId){let e=document.getElementById(t.elementId);if(e&&e.tagName===t.elementTag&&he(e,t))return {element:e,confidence:1,strategy:"id"}}try{let e=document.querySelector(t.cssSelector);if(e&&e.tagName===t.elementTag&&he(e,t))return {element:e,confidence:.95,strategy:"css"}}catch{}try{let n=document.evaluate(t.xpath,document,null,XPathResult.FIRST_ORDERED_NODE_TYPE,null).singleNodeValue;if(n instanceof Element&&n.tagName===t.elementTag&&he(n,t))return {element:n,confidence:.9,strategy:"xpath"}}catch{}return dn(t)}function dn(t){let e=t.elementTag.toLowerCase(),n=document.querySelectorAll(e);if(n.length===0)return null;let o=null,i=0,r=Math.min(n.length,ln);for(let s=0;s<r;s++){let a=n[s];if(!a)continue;let c=un(a,t);if(c>i&&(i=c,o=a,i>=.85))break}return !o||i<.4?null:{element:o,confidence:Math.min(i,.85),strategy:"scan"}}function un(t,e){let n=0,o=0,i=(t.textContent?.trim()??"").slice(0,500);if(e.textSnippet&&(o+=40,n+=Ie(i,e.textSnippet,.5)*40),e.fingerprint&&(o+=20,n+=ht(t,e.fingerprint)*20),e.textPrefix||e.textSuffix){o+=20;let r=0,s=0;if(e.textPrefix){let a=$(t,"before");r+=a?O(a,e.textPrefix):0,s++;}if(e.textSuffix){let a=$(t,"after");r+=a?O(a,e.textSuffix):0,s++;}s>0&&(n+=r/s*20);}if(e.neighborText){o+=20;let r=se(t);n+=r?O(r,e.neighborText)*20:0;}return o>0?n/o:0}function fe(t,e){let n=pn(t);if(!n)return null;let o=n.element.getBoundingClientRect(),i=new DOMRect(o.x+e.xPct*o.width,o.y+e.yPct*o.height,e.wPct*o.width,e.hPct*o.height);return {element:n.element,rect:i,confidence:n.confidence,strategy:n.strategy}}function De(t){return {cssSelector:t.cssSelector,xpath:t.xpath,textSnippet:t.textSnippet,elementTag:t.elementTag,elementId:t.elementId??void 0,textPrefix:t.textPrefix,textSuffix:t.textSuffix,fingerprint:t.fingerprint,neighborText:t.neighborText,anchorKey:t.anchorKey??null}}function me(t){return {xPct:t.xPct,yPct:t.yPct,wPct:t.wPct,hPct:t.hPct}}var At=13;function Pt(t){return {top:t.top+window.scrollY-At,left:t.right+window.scrollX-At}}function Q(t,e){let n=t.entries[e],o=t.elementIndices[e];if(!(!n||o===void 0))return n.elements[o]}var Rt=300,Ft=200,hn=.7,fn=28,Mt=32,ge=class{constructor(e,n,o,i,r=null){this.colors=e;this.tooltip=n;this.bus=o;this.t=i;this.liveRegion=r;this.container=b("div",{style:`position:absolute;top:0;left:0;pointer-events:none;z-index:${2147483646};`}),this.container.id="siteping-markers",document.body.appendChild(this.container),this.bus.on("annotations:toggle",s=>{this.container.style.display=s?"block":"none";}),this.resizeHandler=()=>this.scheduleReposition(),window.addEventListener("resize",this.resizeHandler,{passive:true}),this.scrollHandler=()=>this.scheduleReposition(),window.addEventListener("scroll",this.scrollHandler,{passive:true,capture:true}),this.mutationObserver=new MutationObserver(s=>{let a=false;for(let c of s)if(!(this.container.contains(c.target)||this.tooltip.contains(c.target))){a=true;break}a&&this.scheduleReposition();}),this.mutationObserver.observe(document.body,{childList:true,subtree:true,attributes:false,characterData:false}),this.onDocumentClickForClusters=s=>{this.container.contains(s.target)||this.collapseAllClusters();},document.addEventListener("click",this.onDocumentClickForClusters);}colors;tooltip;bus;t;liveRegion;container;entries=[];highlightElements=[];pinnedFeedback=null;onDocumentClick=null;repositionTimer=null;mutationObserver=null;scrollHandler=null;resizeHandler=null;anchorCache=new Map;clusters=[];onDocumentClickForClusters=null;get count(){return this.entries.length}scheduleReposition(){this.repositionTimer||("requestIdleCallback"in window?this.repositionTimer=window.requestIdleCallback(()=>{this.repositionTimer=null,this.repositionAll();},{timeout:Ft+100}):this.repositionTimer=+setTimeout(()=>{this.repositionTimer=null,this.repositionAll();},Ft));}repositionAll(){let e=new Set;for(let n of this.entries)for(let o=0;o<n.feedback.annotations.length;o++){let i=n.elements[o];if(!i)continue;let r=n.feedback.annotations[o];if(!r)continue;let s=`${n.feedback.id}:${o}`;e.add(s);let c=this.anchorCache.get(s)?.deref(),p;if(c?.isConnected){let d=c.getBoundingClientRect(),h=me(r);p={element:c,rect:new DOMRect(d.left+h.xPct*d.width,d.top+h.yPct*d.height,h.wPct*d.width,h.hPct*d.height),confidence:1,strategy:"css"};}else p=fe(De(r),me(r)),p?.element&&this.anchorCache.set(s,new WeakRef(p.element));if(!p){i.style.display="none";continue}let l=Pt(p.rect);n.baseTop=l.top,n.baseLeft=l.left,i.style.display="flex",this.applyConfidenceStyle(i,p.confidence,n.feedback);}for(let n of this.anchorCache.keys())e.has(n)||this.anchorCache.delete(n);this.applyClusterPositions(),this.pinnedFeedback&&this.showHighlight(this.pinnedFeedback);}applyClusterPositions(){for(let e of this.clusters)e.expanded?this.applyFanPositions(e):this.applyStackPositions(e);}render(e){this.clear(),e.forEach((n,o)=>{let i=this.buildEntry(n,o+1);this.entries.push(i);}),this.buildClusters(),this.liveRegion&&this.entries.length>0&&(this.liveRegion.textContent=this.t("marker.count").replace("{count}",String(this.entries.length)));}addFeedback(e,n){let o=this.buildEntry(e,n);for(let i of o.elements)i.style.animation="sp-marker-in 0.35s cubic-bezier(0.34,1.56,0.64,1) both";this.entries.push(o),this.buildClusters();}buildEntry(e,n){let o={feedback:e,elements:[],baseTop:0,baseLeft:0};for(let i of e.annotations){let r=fe(De(i),me(i));if(!r)continue;let s=Pt(r.rect);o.baseTop=s.top,o.baseLeft=s.left;let a=this.createMarker(n,e,s);this.applyConfidenceStyle(a,r.confidence,e),this.container.appendChild(a),o.elements.push(a);}return o}buildClusters(){for(let o of this.container.querySelectorAll(".sp-cluster-badge"))o.remove();let e=[];for(let o of this.entries)for(let i=0;i<o.elements.length;i++)e.push({entry:o,elIdx:i});let n=new Set;this.clusters=[];for(let o=0;o<e.length;o++){if(n.has(o))continue;let i=e[o];if(!i)continue;let r={entries:[i.entry],elementIndices:[i.elIdx],expanded:false};n.add(o);for(let s=o+1;s<e.length;s++){if(n.has(s))continue;let a=i.entry,c=e[s];if(!c)continue;let p=c.entry;Math.sqrt((a.baseLeft-p.baseLeft)**2+(a.baseTop-p.baseTop)**2)<fn&&(r.entries.push(p),r.elementIndices.push(c.elIdx),n.add(s));}this.clusters.push(r);}for(let o of this.clusters)o.entries.length<=1||(this.applyStackPositions(o),this.addClusterBadge(o));}applyStackPositions(e){let n=e.entries[0];if(!n)return;let{baseTop:o,baseLeft:i}=n,r=e.entries.length<=1;for(let s=0;s<e.entries.length;s++){let a=Q(e,s);a&&(a.style.top=`${o+(r?0:s*3)}px`,a.style.left=`${i+(r?0:s*3)}px`,a.style.zIndex=String(s+1));}}applyFanPositions(e){let n=e.entries[0];if(!n)return;let{baseTop:o,baseLeft:i}=n,r=e.entries.length,s=(r-1)*Mt,a=i-s/2;for(let c=0;c<r;c++){let p=Q(e,c);p&&(p.style.top=`${o}px`,p.style.left=`${a+c*Mt}px`,p.style.zIndex=String(10+c));}}addClusterBadge(e){let n=Q(e,e.entries.length-1);if(!n)return;let o=b("div",{class:"sp-cluster-badge",style:`
|
|
132
96
|
position:absolute;top:-6px;right:-6px;
|
|
133
97
|
min-width:16px;height:16px;padding:0 4px;
|
|
134
98
|
border-radius:9999px;
|
|
@@ -139,1574 +103,36 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
139
103
|
pointer-events:none;
|
|
140
104
|
font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
141
105
|
line-height:1;
|
|
142
|
-
`});
|
|
106
|
+
`});c(o,String(e.entries.length)),n.appendChild(o);}setBadgesVisible(e,n){for(let o=0;o<e.entries.length;o++){let i=Q(e,o)?.querySelector(".sp-cluster-badge");i&&(i.style.display=n?"flex":"none");}}findCluster(e){for(let n of this.clusters)if(!(n.entries.length<=1)){for(let o=0;o<n.entries.length;o++)if(Q(n,o)===e)return n}return null}handleClusterClick(e,n){let o=this.findCluster(e);return o?o.expanded?false:(n.stopPropagation(),this.collapseAllClusters(),o.expanded=true,this.applyFanPositions(o),this.setBadgesVisible(o,false),true):false}collapseCluster(e){e.expanded&&(e.expanded=false,this.applyStackPositions(e),this.setBadgesVisible(e,true));}collapseAllClusters(){for(let e of this.clusters)this.collapseCluster(e);}applyConfidenceStyle(e,n,o){let i=o.status==="resolved";n<hn&&!i?(e.style.borderStyle="dashed",e.style.opacity="0.7",e.title=this.t("marker.approximate").replace("{confidence}",String(Math.round(n*100)))):(e.style.borderStyle="solid",e.style.opacity="1",e.title="");}createMarker(e,n,o){let i=x(n.type,this.colors),r=n.status==="resolved",s=b("div",{style:`
|
|
143
107
|
position:absolute;
|
|
144
|
-
top:${
|
|
145
|
-
left:${
|
|
108
|
+
top:${o.top}px;
|
|
109
|
+
left:${o.left}px;
|
|
146
110
|
width:26px;height:26px;
|
|
147
111
|
border-radius:50%;
|
|
148
|
-
background:${
|
|
149
|
-
border:2px solid ${
|
|
112
|
+
background:${r?"rgba(241,245,249,0.9)":"rgba(255,255,255,0.92)"};
|
|
113
|
+
border:2px solid ${r?"#cbd5e1":i};
|
|
150
114
|
display:flex;align-items:center;justify-content:center;
|
|
151
115
|
font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
152
116
|
font-size:11px;font-weight:700;
|
|
153
|
-
color:${
|
|
117
|
+
color:${r?"#94a3b8":i};
|
|
154
118
|
cursor:pointer;pointer-events:auto;
|
|
155
|
-
box-shadow:${
|
|
119
|
+
box-shadow:${r?"0 2px 8px rgba(0,0,0,0.06)":`0 2px 12px ${i}25, 0 2px 6px rgba(0,0,0,0.06)`};
|
|
156
120
|
transition:top 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), left 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), transform 0.15s ease, box-shadow 0.15s ease;
|
|
157
121
|
user-select:none;
|
|
158
122
|
-webkit-font-smoothing:antialiased;
|
|
159
|
-
`});
|
|
123
|
+
`});s.dataset.feedbackId=n.id,s.setAttribute("tabindex","0"),s.setAttribute("role","button");let a=n.message.length>60?`${n.message.slice(0,60)}...`:n.message,c$1=this.t("marker.aria").replace("{number}",String(e)).replace("{type}",C(n.type,this.t)).replace("{message}",a);s.setAttribute("aria-label",c$1),s.setAttribute("aria-describedby",this.tooltip.tooltipId),c(s,r?"\u2713":String(e)),s.addEventListener("mouseenter",()=>{s.style.transform="scale(1.2)",s.style.boxShadow=r?"0 4px 16px rgba(0,0,0,0.1)":`0 4px 20px ${i}35, 0 4px 12px rgba(0,0,0,0.08)`,this.tooltip.show(n,s.getBoundingClientRect()),this.pinnedFeedback||this.showHighlight(n);}),s.addEventListener("mouseleave",()=>{s.style.transform="scale(1)",s.style.boxShadow=r?"0 2px 8px rgba(0,0,0,0.06)":`0 2px 12px ${i}25, 0 2px 6px rgba(0,0,0,0.06)`,this.tooltip.scheduleHide(),this.pinnedFeedback||this.clearHighlight();}),s.addEventListener("focus",()=>{this.tooltip.show(n,s.getBoundingClientRect()),this.pinnedFeedback||this.showHighlight(n);}),s.addEventListener("blur",()=>{this.tooltip.scheduleHide(),this.pinnedFeedback||this.clearHighlight();});let p=l=>{l instanceof MouseEvent&&this.handleClusterClick(s,l)||(this.pinHighlight(n),this.bus.emit("panel:toggle",true),s.dispatchEvent(new CustomEvent("sp-marker-click",{detail:{feedbackId:n.id},bubbles:true})));};return s.addEventListener("click",l=>p(l)),s.addEventListener("keydown",l=>{(l.key==="Enter"||l.key===" ")&&(l.preventDefault(),p(l));}),s}highlight(e){for(let n of this.entries)if(n.feedback.id===e)for(let o of n.elements)o.style.animation="sp-pulse-ring 0.7s ease-out",o.addEventListener("animationend",()=>{o.style.animation="";},{once:true});}showHighlight(e){this.removeHighlightElements();for(let n of e.annotations){let o=fe(De(n),me(n));if(!o)continue;let i=x(e.type,this.colors),r=o.rect,s=b("div",{style:`
|
|
160
124
|
position:absolute;
|
|
161
|
-
top:${
|
|
162
|
-
left:${
|
|
163
|
-
width:${
|
|
164
|
-
border:2px solid ${
|
|
165
|
-
background:${
|
|
125
|
+
top:${r.top+window.scrollY}px;
|
|
126
|
+
left:${r.left+window.scrollX}px;
|
|
127
|
+
width:${r.width}px;height:${r.height}px;
|
|
128
|
+
border:2px solid ${i};
|
|
129
|
+
background:${i}0c;
|
|
166
130
|
border-radius:8px;
|
|
167
131
|
pointer-events:none;z-index:-1;
|
|
168
132
|
opacity:0;
|
|
169
|
-
box-shadow:0 0 16px ${
|
|
170
|
-
transition:opacity ${
|
|
171
|
-
`});this.container.appendChild(
|
|
172
|
-
/* ============================
|
|
173
|
-
Export Button & Menu
|
|
174
|
-
============================ */
|
|
175
|
-
|
|
176
|
-
.sp-export-btn {
|
|
177
|
-
padding: 5px 12px;
|
|
178
|
-
border-radius: var(--sp-radius-full);
|
|
179
|
-
border: 1px solid var(--sp-border);
|
|
180
|
-
background: transparent;
|
|
181
|
-
color: var(--sp-text-tertiary);
|
|
182
|
-
font-family: var(--sp-font);
|
|
183
|
-
font-size: 11px;
|
|
184
|
-
font-weight: 500;
|
|
185
|
-
cursor: pointer;
|
|
186
|
-
display: flex;
|
|
187
|
-
align-items: center;
|
|
188
|
-
gap: 4px;
|
|
189
|
-
transition: all 0.2s ease;
|
|
190
|
-
position: relative;
|
|
191
|
-
}
|
|
192
|
-
|
|
193
|
-
.sp-export-btn svg {
|
|
194
|
-
width: 13px;
|
|
195
|
-
height: 13px;
|
|
196
|
-
}
|
|
197
|
-
|
|
198
|
-
.sp-export-btn:hover {
|
|
199
|
-
border-color: var(--sp-accent);
|
|
200
|
-
color: var(--sp-accent);
|
|
201
|
-
background: var(--sp-accent-light);
|
|
202
|
-
}
|
|
203
|
-
|
|
204
|
-
.sp-export-btn:disabled {
|
|
205
|
-
opacity: 0.5;
|
|
206
|
-
cursor: not-allowed;
|
|
207
|
-
pointer-events: none;
|
|
208
|
-
}
|
|
209
|
-
|
|
210
|
-
.sp-export-menu {
|
|
211
|
-
position: absolute;
|
|
212
|
-
top: calc(100% + 6px);
|
|
213
|
-
right: 0;
|
|
214
|
-
min-width: 180px;
|
|
215
|
-
padding: 4px;
|
|
216
|
-
border-radius: var(--sp-radius);
|
|
217
|
-
background: var(--sp-glass-bg-heavy);
|
|
218
|
-
backdrop-filter: blur(var(--sp-blur));
|
|
219
|
-
-webkit-backdrop-filter: blur(var(--sp-blur));
|
|
220
|
-
border: 1px solid var(--sp-glass-border);
|
|
221
|
-
box-shadow: var(--sp-shadow-lg);
|
|
222
|
-
z-index: 10;
|
|
223
|
-
opacity: 0;
|
|
224
|
-
transform: translateY(-4px) scale(0.97);
|
|
225
|
-
transition: opacity 0.15s ease, transform 0.15s ease;
|
|
226
|
-
pointer-events: none;
|
|
227
|
-
}
|
|
228
|
-
|
|
229
|
-
.sp-export-menu--open {
|
|
230
|
-
opacity: 1;
|
|
231
|
-
transform: translateY(0) scale(1);
|
|
232
|
-
pointer-events: auto;
|
|
233
|
-
}
|
|
234
|
-
|
|
235
|
-
.sp-export-option {
|
|
236
|
-
display: flex;
|
|
237
|
-
align-items: center;
|
|
238
|
-
gap: 10px;
|
|
239
|
-
width: 100%;
|
|
240
|
-
padding: 8px 16px;
|
|
241
|
-
border: none;
|
|
242
|
-
border-radius: 8px;
|
|
243
|
-
background: transparent;
|
|
244
|
-
color: var(--sp-text-secondary);
|
|
245
|
-
font-family: var(--sp-font);
|
|
246
|
-
font-size: 13px;
|
|
247
|
-
font-weight: 500;
|
|
248
|
-
cursor: pointer;
|
|
249
|
-
transition: all 0.15s ease;
|
|
250
|
-
text-align: left;
|
|
251
|
-
}
|
|
252
|
-
|
|
253
|
-
.sp-export-option:hover,
|
|
254
|
-
.sp-export-option:focus-visible {
|
|
255
|
-
background: var(--sp-accent-light);
|
|
256
|
-
color: var(--sp-accent);
|
|
257
|
-
}
|
|
258
|
-
|
|
259
|
-
.sp-export-option-icon {
|
|
260
|
-
display: flex;
|
|
261
|
-
align-items: center;
|
|
262
|
-
justify-content: center;
|
|
263
|
-
flex-shrink: 0;
|
|
264
|
-
}
|
|
265
|
-
|
|
266
|
-
.sp-export-option-icon svg {
|
|
267
|
-
width: 16px;
|
|
268
|
-
height: 16px;
|
|
269
|
-
}
|
|
270
|
-
|
|
271
|
-
.sp-export-option-label {
|
|
272
|
-
flex: 1;
|
|
273
|
-
}
|
|
274
|
-
|
|
275
|
-
@media (forced-colors: active) {
|
|
276
|
-
.sp-export-btn,
|
|
277
|
-
.sp-export-option,
|
|
278
|
-
.sp-export-menu {
|
|
279
|
-
border: 2px solid ButtonText !important;
|
|
280
|
-
background: Canvas !important;
|
|
281
|
-
color: ButtonText !important;
|
|
282
|
-
}
|
|
283
|
-
|
|
284
|
-
.sp-export-btn:focus-visible,
|
|
285
|
-
.sp-export-option:focus-visible {
|
|
286
|
-
outline: 3px solid Highlight !important;
|
|
287
|
-
}
|
|
288
|
-
}
|
|
289
|
-
`,Kt=["id","type","status","message","url","authorName","authorEmail","createdAt","resolvedAt","viewport"];function qs(n){return n.includes('"')||n.includes(",")||n.includes(`
|
|
290
|
-
`)||n.includes("\r")?`"${n.replace(/"/g,'""')}"`:n}function Ys(n){let e=Kt.join(","),t=n.map(s=>Kt.map(o=>{let i=s[o];return qs(i==null?"":String(i))}).join(","));return[e,...t].join(`
|
|
291
|
-
`)}function Ws(n){return JSON.stringify(n,null,2)}function Ut(n,e,t){let s=new Blob([n],{type:t}),o=URL.createObjectURL(s),i=document.createElement("a");i.href=o,i.download=e,i.style.display="none",document.body.appendChild(i),i.click(),requestAnimationFrame(()=>{URL.revokeObjectURL(o),i.remove()})}var me=class{constructor(e,t){this.getFeedbacks=t;this.element=p("div",{style:"position: relative; display: inline-flex;"});let s=document.createElement("button");s.className="sp-export-btn",s.setAttribute("aria-haspopup","true"),s.setAttribute("aria-expanded","false"),s.appendChild(y(zs));let o=document.createElement("span");h(o,je["export.label"]),s.appendChild(o),s.addEventListener("click",a=>{a.stopPropagation(),this.toggle()}),this.menu=p("div",{class:"sp-export-menu"}),this.menu.setAttribute("role","menu");let i=this.createOption(Ks,je["export.csv"],()=>{this.exportAs("csv")}),r=this.createOption(Us,je["export.json"],()=>{this.exportAs("json")});this.menu.appendChild(i),this.menu.appendChild(r),this.element.appendChild(s),this.element.appendChild(this.menu),this.onDocumentClick=a=>{this.isOpen&&!this.element.contains(a.target)&&this.close()},document.addEventListener("click",this.onDocumentClick,!0)}getFeedbacks;element;menu;isOpen=!1;onDocumentClick;setLabels(e){let t=this.element.querySelector(".sp-export-btn");if(t){let o=t.querySelector("span");o&&h(o,e["export.label"])}let s=this.menu.querySelectorAll(".sp-export-option-label");s[0]&&h(s[0],e["export.csv"]),s[1]&&h(s[1],e["export.json"])}createOption(e,t,s){let o=document.createElement("button");o.className="sp-export-option",o.setAttribute("role","menuitem");let i=p("span",{class:"sp-export-option-icon"});i.appendChild(y(e));let r=p("span",{class:"sp-export-option-label"});return h(r,t),o.appendChild(i),o.appendChild(r),o.addEventListener("click",a=>{a.stopPropagation(),s(),this.close()}),o}toggle(){this.isOpen?this.close():this.open()}open(){this.isOpen=!0,this.menu.classList.add("sp-export-menu--open"),this.element.querySelector(".sp-export-btn")?.setAttribute("aria-expanded","true")}close(){this.isOpen=!1,this.menu.classList.remove("sp-export-menu--open"),this.element.querySelector(".sp-export-btn")?.setAttribute("aria-expanded","false")}exportAs(e){let t=this.getFeedbacks();if(t.length===0)return;let s=t[0]?.projectName??"feedbacks",o=new Date().toISOString().slice(0,10),i=s.replace(/[^a-zA-Z0-9_-]/g,"_");if(e==="csv"){let r=Ys(t);Ut(r,`feedbacks-${i}-${o}.csv`,"text/csv;charset=utf-8")}else{let r=Ws(t);Ut(r,`feedbacks-${i}-${o}.json`,"application/json;charset=utf-8")}}destroy(){document.removeEventListener("click",this.onDocumentClick,!0),this.element.remove()}};var fe='<svg viewBox="0 0 18 18" fill="none" aria-hidden="true"><rect x="1" y="1" width="16" height="16" rx="4" stroke="currentColor" stroke-width="2"/></svg>',Wt='<svg viewBox="0 0 18 18" fill="none" aria-hidden="true"><rect x="1" y="1" width="16" height="16" rx="4" fill="url(#sp-cb-grad)" stroke="none"/><polyline points="5 9 8 12 13 6" fill="none" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><defs><linearGradient id="sp-cb-grad" x1="0" y1="0" x2="18" y2="18" gradientUnits="userSpaceOnUse"><stop offset="0%" stop-color="var(--sp-accent)"/><stop offset="100%" stop-color="var(--sp-accent-dark)"/></linearGradient></defs></svg>',ze={"bulk.selectAll":"Select all","bulk.selected":"{count} selected","bulk.resolve":"Resolve","bulk.delete":"Delete","bulk.deselect":"Deselect"},Ke={"bulk.selectAll":"Tout s\xE9lectionner","bulk.selected":"{count} s\xE9lectionn\xE9(s)","bulk.resolve":"R\xE9soudre","bulk.delete":"Supprimer","bulk.deselect":"D\xE9s\xE9lectionner"},Xt=`
|
|
292
|
-
/* ============================
|
|
293
|
-
Bulk Checkbox
|
|
294
|
-
============================ */
|
|
295
|
-
|
|
296
|
-
.sp-bulk-checkbox {
|
|
297
|
-
position: relative;
|
|
298
|
-
width: 16px;
|
|
299
|
-
height: 16px;
|
|
300
|
-
flex-shrink: 0;
|
|
301
|
-
cursor: pointer;
|
|
302
|
-
border-radius: 4px;
|
|
303
|
-
color: var(--sp-border);
|
|
304
|
-
opacity: 0;
|
|
305
|
-
transition: opacity 0.15s ease, color 0.15s ease, transform 0.15s ease;
|
|
306
|
-
display: inline-flex;
|
|
307
|
-
align-items: center;
|
|
308
|
-
justify-content: center;
|
|
309
|
-
}
|
|
310
|
-
|
|
311
|
-
.sp-bulk-checkbox svg {
|
|
312
|
-
width: 16px;
|
|
313
|
-
height: 16px;
|
|
314
|
-
display: block;
|
|
315
|
-
}
|
|
316
|
-
|
|
317
|
-
.sp-bulk-checkbox:hover {
|
|
318
|
-
color: var(--sp-accent);
|
|
319
|
-
transform: scale(1.1);
|
|
320
|
-
}
|
|
321
|
-
|
|
322
|
-
.sp-bulk-checkbox--checked {
|
|
323
|
-
color: var(--sp-accent);
|
|
324
|
-
opacity: 1 !important;
|
|
325
|
-
filter: drop-shadow(0 0 4px var(--sp-accent-glow));
|
|
326
|
-
}
|
|
327
|
-
|
|
328
|
-
/* Show checkboxes when hovering a card */
|
|
329
|
-
.sp-card:hover .sp-bulk-checkbox {
|
|
330
|
-
opacity: 1;
|
|
331
|
-
}
|
|
332
|
-
|
|
333
|
-
/* When any card has selection, show ALL checkboxes */
|
|
334
|
-
.sp-list--has-selection .sp-bulk-checkbox {
|
|
335
|
-
opacity: 1;
|
|
336
|
-
}
|
|
337
|
-
|
|
338
|
-
/* ============================
|
|
339
|
-
Card Selected State
|
|
340
|
-
============================ */
|
|
341
|
-
|
|
342
|
-
.sp-card--selected {
|
|
343
|
-
border-left: 3px solid var(--sp-accent) !important;
|
|
344
|
-
background: var(--sp-accent-light) !important;
|
|
345
|
-
}
|
|
346
|
-
|
|
347
|
-
.sp-card--selected:hover {
|
|
348
|
-
background: var(--sp-accent-light) !important;
|
|
349
|
-
}
|
|
350
|
-
|
|
351
|
-
/* ============================
|
|
352
|
-
Select All Bar
|
|
353
|
-
============================ */
|
|
354
|
-
|
|
355
|
-
.sp-bulk-select-all {
|
|
356
|
-
display: flex;
|
|
357
|
-
align-items: center;
|
|
358
|
-
gap: 8px;
|
|
359
|
-
padding: 8px 12px;
|
|
360
|
-
margin-bottom: 4px;
|
|
361
|
-
border-radius: var(--sp-radius);
|
|
362
|
-
background: transparent;
|
|
363
|
-
cursor: pointer;
|
|
364
|
-
opacity: 0;
|
|
365
|
-
transition: opacity 0.2s ease, background 0.2s ease;
|
|
366
|
-
user-select: none;
|
|
367
|
-
font-family: var(--sp-font);
|
|
368
|
-
font-size: 12px;
|
|
369
|
-
font-weight: 500;
|
|
370
|
-
color: var(--sp-text-secondary);
|
|
371
|
-
}
|
|
372
|
-
|
|
373
|
-
.sp-bulk-select-all:hover {
|
|
374
|
-
background: var(--sp-bg-hover);
|
|
375
|
-
}
|
|
376
|
-
|
|
377
|
-
/* Show select-all on list hover or when selections exist */
|
|
378
|
-
.sp-list:hover .sp-bulk-select-all,
|
|
379
|
-
.sp-list--has-selection .sp-bulk-select-all {
|
|
380
|
-
opacity: 1;
|
|
381
|
-
}
|
|
382
|
-
|
|
383
|
-
.sp-bulk-select-all .sp-bulk-checkbox {
|
|
384
|
-
opacity: 1;
|
|
385
|
-
}
|
|
386
|
-
|
|
387
|
-
/* ============================
|
|
388
|
-
Floating Action Bar
|
|
389
|
-
============================ */
|
|
390
|
-
|
|
391
|
-
@keyframes sp-bulk-bar-in {
|
|
392
|
-
from {
|
|
393
|
-
transform: translateY(100%) scale(0.95);
|
|
394
|
-
opacity: 0;
|
|
395
|
-
}
|
|
396
|
-
to {
|
|
397
|
-
transform: translateY(0) scale(1);
|
|
398
|
-
opacity: 1;
|
|
399
|
-
}
|
|
400
|
-
}
|
|
401
|
-
|
|
402
|
-
@keyframes sp-bulk-bar-out {
|
|
403
|
-
from {
|
|
404
|
-
transform: translateY(0) scale(1);
|
|
405
|
-
opacity: 1;
|
|
406
|
-
}
|
|
407
|
-
to {
|
|
408
|
-
transform: translateY(100%) scale(0.95);
|
|
409
|
-
opacity: 0;
|
|
410
|
-
}
|
|
411
|
-
}
|
|
412
|
-
|
|
413
|
-
.sp-bulk-bar {
|
|
414
|
-
position: absolute;
|
|
415
|
-
bottom: 16px;
|
|
416
|
-
left: 16px;
|
|
417
|
-
right: 16px;
|
|
418
|
-
display: flex;
|
|
419
|
-
align-items: center;
|
|
420
|
-
justify-content: space-between;
|
|
421
|
-
gap: 12px;
|
|
422
|
-
padding: 12px 16px;
|
|
423
|
-
border-radius: 16px;
|
|
424
|
-
background: var(--sp-glass-bg-heavy);
|
|
425
|
-
backdrop-filter: blur(var(--sp-blur-heavy));
|
|
426
|
-
-webkit-backdrop-filter: blur(var(--sp-blur-heavy));
|
|
427
|
-
border: 1px solid var(--sp-glass-border);
|
|
428
|
-
box-shadow: var(--sp-shadow-xl);
|
|
429
|
-
z-index: 10;
|
|
430
|
-
pointer-events: none;
|
|
431
|
-
opacity: 0;
|
|
432
|
-
transform: translateY(100%) scale(0.95);
|
|
433
|
-
transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1),
|
|
434
|
-
opacity 0.25s ease;
|
|
435
|
-
font-family: var(--sp-font);
|
|
436
|
-
}
|
|
437
|
-
|
|
438
|
-
.sp-bulk-bar--visible {
|
|
439
|
-
pointer-events: auto;
|
|
440
|
-
opacity: 1;
|
|
441
|
-
transform: translateY(0) scale(1);
|
|
442
|
-
}
|
|
443
|
-
|
|
444
|
-
.sp-bulk-bar-count {
|
|
445
|
-
font-size: 13px;
|
|
446
|
-
font-weight: 600;
|
|
447
|
-
color: var(--sp-text);
|
|
448
|
-
white-space: nowrap;
|
|
449
|
-
letter-spacing: -0.01em;
|
|
450
|
-
}
|
|
451
|
-
|
|
452
|
-
.sp-bulk-bar-actions {
|
|
453
|
-
display: flex;
|
|
454
|
-
align-items: center;
|
|
455
|
-
gap: 6px;
|
|
456
|
-
}
|
|
457
|
-
|
|
458
|
-
.sp-bulk-btn-resolve,
|
|
459
|
-
.sp-bulk-btn-delete {
|
|
460
|
-
padding: 7px 14px;
|
|
461
|
-
border-radius: var(--sp-radius-full);
|
|
462
|
-
border: 1.5px solid transparent;
|
|
463
|
-
background: transparent;
|
|
464
|
-
font-family: var(--sp-font);
|
|
465
|
-
font-size: 12px;
|
|
466
|
-
font-weight: 600;
|
|
467
|
-
cursor: pointer;
|
|
468
|
-
display: flex;
|
|
469
|
-
align-items: center;
|
|
470
|
-
gap: 5px;
|
|
471
|
-
transition: all 0.2s ease;
|
|
472
|
-
white-space: nowrap;
|
|
473
|
-
}
|
|
474
|
-
|
|
475
|
-
.sp-bulk-btn-resolve {
|
|
476
|
-
color: #22c55e;
|
|
477
|
-
border-color: #22c55e;
|
|
478
|
-
}
|
|
479
|
-
|
|
480
|
-
.sp-bulk-btn-resolve:hover {
|
|
481
|
-
background: rgba(34, 197, 94, 0.1);
|
|
482
|
-
box-shadow: 0 0 12px rgba(34, 197, 94, 0.15);
|
|
483
|
-
}
|
|
484
|
-
|
|
485
|
-
.sp-bulk-btn-resolve:active {
|
|
486
|
-
transform: scale(0.96);
|
|
487
|
-
transition-duration: 0.1s;
|
|
488
|
-
}
|
|
489
|
-
|
|
490
|
-
.sp-bulk-btn-delete {
|
|
491
|
-
color: #ef4444;
|
|
492
|
-
border-color: #ef4444;
|
|
493
|
-
}
|
|
494
|
-
|
|
495
|
-
.sp-bulk-btn-delete:hover {
|
|
496
|
-
background: rgba(239, 68, 68, 0.1);
|
|
497
|
-
box-shadow: 0 0 12px rgba(239, 68, 68, 0.15);
|
|
498
|
-
}
|
|
499
|
-
|
|
500
|
-
.sp-bulk-btn-delete:active {
|
|
501
|
-
transform: scale(0.96);
|
|
502
|
-
transition-duration: 0.1s;
|
|
503
|
-
}
|
|
504
|
-
|
|
505
|
-
.sp-bulk-btn-resolve:disabled,
|
|
506
|
-
.sp-bulk-btn-delete:disabled {
|
|
507
|
-
opacity: 0.5;
|
|
508
|
-
cursor: not-allowed;
|
|
509
|
-
pointer-events: none;
|
|
510
|
-
}
|
|
511
|
-
|
|
512
|
-
.sp-bulk-btn-deselect {
|
|
513
|
-
width: 28px;
|
|
514
|
-
height: 28px;
|
|
515
|
-
border-radius: var(--sp-radius-full);
|
|
516
|
-
border: 1px solid var(--sp-border);
|
|
517
|
-
background: transparent;
|
|
518
|
-
color: var(--sp-text-tertiary);
|
|
519
|
-
cursor: pointer;
|
|
520
|
-
display: flex;
|
|
521
|
-
align-items: center;
|
|
522
|
-
justify-content: center;
|
|
523
|
-
transition: all 0.2s ease;
|
|
524
|
-
flex-shrink: 0;
|
|
525
|
-
padding: 0;
|
|
526
|
-
}
|
|
527
|
-
|
|
528
|
-
.sp-bulk-btn-deselect:hover {
|
|
529
|
-
background: var(--sp-bg-hover);
|
|
530
|
-
color: var(--sp-text);
|
|
531
|
-
border-color: var(--sp-text-tertiary);
|
|
532
|
-
}
|
|
533
|
-
|
|
534
|
-
.sp-bulk-btn-deselect:active {
|
|
535
|
-
transform: scale(0.92);
|
|
536
|
-
transition-duration: 0.1s;
|
|
537
|
-
}
|
|
538
|
-
|
|
539
|
-
.sp-bulk-btn-deselect svg {
|
|
540
|
-
width: 12px;
|
|
541
|
-
height: 12px;
|
|
542
|
-
}
|
|
543
|
-
|
|
544
|
-
/* Spinner inside bulk bar buttons */
|
|
545
|
-
.sp-bulk-btn-resolve .sp-spinner,
|
|
546
|
-
.sp-bulk-btn-delete .sp-spinner {
|
|
547
|
-
width: 14px;
|
|
548
|
-
height: 14px;
|
|
549
|
-
}
|
|
550
|
-
|
|
551
|
-
/* ============================
|
|
552
|
-
Forced Colors / High Contrast
|
|
553
|
-
============================ */
|
|
554
|
-
|
|
555
|
-
@media (forced-colors: active) {
|
|
556
|
-
.sp-bulk-checkbox,
|
|
557
|
-
.sp-bulk-btn-resolve,
|
|
558
|
-
.sp-bulk-btn-delete,
|
|
559
|
-
.sp-bulk-btn-deselect,
|
|
560
|
-
.sp-bulk-bar {
|
|
561
|
-
border: 2px solid ButtonText !important;
|
|
562
|
-
background: Canvas !important;
|
|
563
|
-
color: ButtonText !important;
|
|
564
|
-
}
|
|
565
|
-
|
|
566
|
-
.sp-bulk-checkbox--checked {
|
|
567
|
-
background: Highlight !important;
|
|
568
|
-
color: HighlightText !important;
|
|
569
|
-
}
|
|
570
|
-
|
|
571
|
-
.sp-card--selected {
|
|
572
|
-
border-left: 4px solid Highlight !important;
|
|
573
|
-
}
|
|
574
|
-
}
|
|
575
|
-
|
|
576
|
-
/* ============================
|
|
577
|
-
Reduced Motion
|
|
578
|
-
============================ */
|
|
579
|
-
|
|
580
|
-
@media (prefers-reduced-motion: reduce) {
|
|
581
|
-
.sp-bulk-bar {
|
|
582
|
-
transition-duration: 0.01ms !important;
|
|
583
|
-
}
|
|
584
|
-
|
|
585
|
-
.sp-bulk-checkbox {
|
|
586
|
-
transition-duration: 0.01ms !important;
|
|
587
|
-
}
|
|
588
|
-
}
|
|
589
|
-
`,ve=class{constructor(e,t,s){this.callbacks=t;this.i18n=s==="fr"?Ke:ze,this.barElement=p("div",{class:"sp-bulk-bar"}),this.barElement.setAttribute("role","toolbar"),this.barElement.setAttribute("aria-label","Bulk actions"),this.countLabel=p("span",{class:"sp-bulk-bar-count"}),h(this.countLabel,this.i18n["bulk.selected"].replace("{count}","0"));let o=p("div",{class:"sp-bulk-bar-actions"});this.resolveBtn=document.createElement("button"),this.resolveBtn.className="sp-bulk-btn-resolve",this.resolveBtn.type="button",this.resolveBtn.addEventListener("click",()=>this.handleResolve()),this.deleteBtn=document.createElement("button"),this.deleteBtn.className="sp-bulk-btn-delete",this.deleteBtn.type="button",this.deleteBtn.addEventListener("click",()=>this.handleDelete());let i=document.createElement("button");i.className="sp-bulk-btn-deselect",i.type="button",i.setAttribute("aria-label",this.i18n["bulk.deselect"]),i.appendChild(y('<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>')),i.addEventListener("click",()=>this.deselectAll()),o.appendChild(this.resolveBtn),o.appendChild(this.deleteBtn),o.appendChild(i),this.barElement.appendChild(this.countLabel),this.barElement.appendChild(o),this.updateButtonLabels()}callbacks;barElement;selected=new Set;checkboxMap=new Map;countLabel;resolveBtn;deleteBtn;selectAllCheckbox=null;listContainer=null;isProcessing=!1;i18n;createCheckbox(e){let t=p("div",{class:"sp-bulk-checkbox"});return t.setAttribute("role","checkbox"),t.setAttribute("aria-checked","false"),t.setAttribute("tabindex","0"),t.setAttribute("aria-label",`Select feedback ${e}`),t.appendChild(y(fe)),t.addEventListener("click",s=>{s.stopPropagation(),this.toggle(e)}),t.addEventListener("keydown",s=>{(s.key===" "||s.key==="Enter")&&(s.preventDefault(),s.stopPropagation(),this.toggle(e))}),this.checkboxMap.set(e,t),t}createSelectAllBar(e,t){let s=p("div",{class:"sp-bulk-select-all"}),o=p("div",{class:"sp-bulk-checkbox"});o.appendChild(y(fe)),this.selectAllCheckbox=o;let i=p("span");return h(i,t),s.appendChild(o),s.appendChild(i),s.addEventListener("click",()=>{this.selected.size===e.length&&e.length>0?this.deselectAll():this.selectAll(e)}),s}setListContainer(e){this.listContainer=e}toggle(e){this.isProcessing||(this.selected.has(e)?this.selected.delete(e):this.selected.add(e),this.updateCheckbox(e),this.updateBar(),this.updateSelectAllCheckbox(),this.updateListSelectionClass(),this.updateCardSelectedState(e))}selectAll(e){if(!this.isProcessing){for(let t of e)this.selected.add(t),this.updateCheckbox(t),this.updateCardSelectedState(t);this.updateBar(),this.updateSelectAllCheckbox(),this.updateListSelectionClass()}}deselectAll(){let e=[...this.selected];this.selected.clear();for(let t of e)this.updateCheckbox(t),this.updateCardSelectedState(t);this.updateBar(),this.updateSelectAllCheckbox(),this.updateListSelectionClass()}get selectedIds(){return[...this.selected]}get count(){return this.selected.size}get hasSelection(){return this.selected.size>0}reset(){this.selected.clear(),this.checkboxMap.clear(),this.selectAllCheckbox=null,this.isProcessing=!1,this.updateBar(),this.updateListSelectionClass()}destroy(){this.selected.clear(),this.checkboxMap.clear(),this.selectAllCheckbox=null,this.listContainer=null,this.barElement.remove()}updateBar(){let e=this.selected.size,t=e>0;this.barElement.classList.toggle("sp-bulk-bar--visible",t),h(this.countLabel,this.i18n["bulk.selected"].replace("{count}",String(e))),this.updateButtonLabels()}updateButtonLabels(){let e=this.selected.size;this.resolveBtn.replaceChildren();let t=document.createElement("span");h(t,e>0?`${this.i18n["bulk.resolve"]} ${e}`:this.i18n["bulk.resolve"]),this.resolveBtn.appendChild(t),this.deleteBtn.replaceChildren();let s=document.createElement("span");h(s,e>0?`${this.i18n["bulk.delete"]} ${e}`:this.i18n["bulk.delete"]),this.deleteBtn.appendChild(s)}updateCheckbox(e){let t=this.checkboxMap.get(e);if(!t)return;let s=this.selected.has(e);t.classList.toggle("sp-bulk-checkbox--checked",s),t.setAttribute("aria-checked",String(s)),t.replaceChildren(),t.appendChild(y(s?Wt:fe))}updateSelectAllCheckbox(){if(!this.selectAllCheckbox)return;let e=this.selected.size>0&&this.selected.size===this.checkboxMap.size;this.selectAllCheckbox.classList.toggle("sp-bulk-checkbox--checked",e),this.selectAllCheckbox.setAttribute("aria-checked",String(e)),this.selectAllCheckbox.replaceChildren(),this.selectAllCheckbox.appendChild(y(e?Wt:fe))}updateListSelectionClass(){this.listContainer&&this.listContainer.classList.toggle("sp-list--has-selection",this.selected.size>0)}updateCardSelectedState(e){if(!this.listContainer)return;let t=CSS.escape(e),s=this.listContainer.querySelector(`[data-feedback-id="${t}"]`);s&&s.classList.toggle("sp-card--selected",this.selected.has(e))}setButtonLoading(e){let t=Array.from(e.childNodes).map(s=>s.cloneNode(!0));return e.disabled=!0,e.replaceChildren(p("div",{class:"sp-spinner sp-spinner--sm"})),()=>{e.replaceChildren(...t),e.disabled=!1}}async handleResolve(){if(this.isProcessing||this.selected.size===0)return;this.isProcessing=!0;let e=[...this.selected],t=this.setButtonLoading(this.resolveBtn);this.deleteBtn.disabled=!0;try{await this.callbacks.onResolve(e),this.reset()}catch{t(),this.deleteBtn.disabled=!1}finally{this.isProcessing=!1}}async handleDelete(){if(this.isProcessing||this.selected.size===0)return;this.isProcessing=!0;let e=[...this.selected],t=this.setButtonLoading(this.deleteBtn);this.resolveBtn.disabled=!0;try{await this.callbacks.onDelete(e),this.reset()}catch{t(),this.resolveBtn.disabled=!1}finally{this.isProcessing=!1}}};var Xs='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><line x1="19" y1="12" x2="5" y2="12"/><polyline points="12 19 5 12 12 5"/></svg>',Ue='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>',Gs='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg>',Vs='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>',Qs='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>',Js='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="2" y="3" width="20" height="14" rx="2" ry="2"/><line x1="8" y1="21" x2="16" y2="21"/><line x1="12" y1="17" x2="12" y2="21"/></svg>',qe='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="20 6 9 17 4 12"/></svg>',Gt='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="1 4 1 10 7 10"/><path d="M3.51 15a9 9 0 1 0 2.13-9.36L1 10"/></svg>',Vt='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="3 6 5 6 21 6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/><line x1="10" y1="11" x2="10" y2="17"/><line x1="14" y1="11" x2="14" y2="17"/></svg>',Zs='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="16 18 22 12 16 6"/><polyline points="8 6 2 12 8 18"/></svg>',en='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="10"/><line x1="22" y1="12" x2="18" y2="12"/><line x1="6" y1="12" x2="2" y2="12"/><line x1="12" y1="6" x2="12" y2="2"/><line x1="12" y1="22" x2="12" y2="18"/></svg>',tn={"detail.back":"Back","detail.title":"Feedback #{number}","detail.status":"Status","detail.message":"Message","detail.screenshot":"Screenshot","detail.screenshotAlt":"Screenshot of the annotated area","detail.metadata":"Details","detail.annotation":"Annotation","detail.page":"Page","detail.author":"Author","detail.date":"Created","detail.viewport":"Viewport","detail.browser":"Browser","detail.resolvedAt":"Resolved at","detail.goToAnnotation":"Go to annotation","detail.element":"Element","detail.selector":"Selector","detail.position":"Position","detail.resolve":"Resolve","detail.reopen":"Reopen","detail.delete":"Delete"},Ye={"detail.back":"Retour","detail.title":"Feedback n\xB0{number}","detail.status":"Statut","detail.message":"Message","detail.screenshot":"Capture d'\xE9cran","detail.screenshotAlt":"Capture d'\xE9cran de la zone annot\xE9e","detail.metadata":"D\xE9tails","detail.annotation":"Annotation","detail.page":"Page","detail.author":"Auteur","detail.date":"Cr\xE9\xE9 le","detail.viewport":"Viewport","detail.browser":"Navigateur","detail.resolvedAt":"R\xE9solu le","detail.goToAnnotation":"Aller \xE0 l'annotation","detail.element":"\xC9l\xE9ment","detail.selector":"S\xE9lecteur","detail.position":"Position","detail.resolve":"R\xE9soudre","detail.reopen":"Rouvrir","detail.delete":"Supprimer"},Zt=`
|
|
590
|
-
/* ============================
|
|
591
|
-
Detail View \u2014 Panel-in-Panel
|
|
592
|
-
============================ */
|
|
593
|
-
|
|
594
|
-
.sp-detail {
|
|
595
|
-
position: absolute;
|
|
596
|
-
inset: 0;
|
|
597
|
-
display: flex;
|
|
598
|
-
flex-direction: column;
|
|
599
|
-
background: var(--sp-glass-bg);
|
|
600
|
-
backdrop-filter: blur(var(--sp-blur-heavy));
|
|
601
|
-
-webkit-backdrop-filter: blur(var(--sp-blur-heavy));
|
|
602
|
-
z-index: 20;
|
|
603
|
-
transform: translateX(100%);
|
|
604
|
-
transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
|
|
605
|
-
will-change: transform;
|
|
606
|
-
overflow: hidden;
|
|
607
|
-
}
|
|
608
|
-
|
|
609
|
-
.sp-detail--visible {
|
|
610
|
-
transform: translateX(0);
|
|
611
|
-
}
|
|
612
|
-
|
|
613
|
-
/* ---- Header ---- */
|
|
614
|
-
|
|
615
|
-
.sp-detail-header {
|
|
616
|
-
display: flex;
|
|
617
|
-
align-items: center;
|
|
618
|
-
gap: 12px;
|
|
619
|
-
padding: 16px 20px;
|
|
620
|
-
border-bottom: 1px solid var(--sp-border);
|
|
621
|
-
background: var(--sp-glass-bg-heavy);
|
|
622
|
-
backdrop-filter: blur(var(--sp-blur));
|
|
623
|
-
-webkit-backdrop-filter: blur(var(--sp-blur));
|
|
624
|
-
flex-shrink: 0;
|
|
625
|
-
min-height: 64px;
|
|
626
|
-
}
|
|
627
|
-
|
|
628
|
-
.sp-detail-back {
|
|
629
|
-
width: 40px;
|
|
630
|
-
height: 40px;
|
|
631
|
-
border-radius: var(--sp-radius);
|
|
632
|
-
border: none;
|
|
633
|
-
background: transparent;
|
|
634
|
-
cursor: pointer;
|
|
635
|
-
display: flex;
|
|
636
|
-
align-items: center;
|
|
637
|
-
justify-content: center;
|
|
638
|
-
color: var(--sp-text-tertiary);
|
|
639
|
-
transition: all 0.2s ease;
|
|
640
|
-
flex-shrink: 0;
|
|
641
|
-
padding: 0;
|
|
642
|
-
}
|
|
643
|
-
|
|
644
|
-
.sp-detail-back:hover {
|
|
645
|
-
background: var(--sp-bg-hover);
|
|
646
|
-
color: var(--sp-text);
|
|
647
|
-
}
|
|
648
|
-
|
|
649
|
-
.sp-detail-back:active {
|
|
650
|
-
transform: scale(0.92);
|
|
651
|
-
transition-duration: 0.1s;
|
|
652
|
-
}
|
|
653
|
-
|
|
654
|
-
.sp-detail-back svg {
|
|
655
|
-
width: 18px;
|
|
656
|
-
height: 18px;
|
|
657
|
-
}
|
|
658
|
-
|
|
659
|
-
.sp-detail-title {
|
|
660
|
-
font-size: 16px;
|
|
661
|
-
font-weight: 700;
|
|
662
|
-
color: var(--sp-text);
|
|
663
|
-
letter-spacing: -0.02em;
|
|
664
|
-
flex: 1;
|
|
665
|
-
min-width: 0;
|
|
666
|
-
overflow: hidden;
|
|
667
|
-
text-overflow: ellipsis;
|
|
668
|
-
white-space: nowrap;
|
|
669
|
-
}
|
|
670
|
-
|
|
671
|
-
.sp-detail-header .sp-badge {
|
|
672
|
-
flex-shrink: 0;
|
|
673
|
-
}
|
|
674
|
-
|
|
675
|
-
/* ---- Content ---- */
|
|
676
|
-
|
|
677
|
-
.sp-detail-content {
|
|
678
|
-
flex: 1;
|
|
679
|
-
overflow-y: auto;
|
|
680
|
-
overflow-x: hidden;
|
|
681
|
-
padding: 0;
|
|
682
|
-
}
|
|
683
|
-
|
|
684
|
-
.sp-detail-content::-webkit-scrollbar {
|
|
685
|
-
width: 6px;
|
|
686
|
-
}
|
|
687
|
-
|
|
688
|
-
.sp-detail-content::-webkit-scrollbar-track {
|
|
689
|
-
background: transparent;
|
|
690
|
-
}
|
|
691
|
-
|
|
692
|
-
.sp-detail-content::-webkit-scrollbar-thumb {
|
|
693
|
-
background: var(--sp-border);
|
|
694
|
-
border-radius: var(--sp-radius-full);
|
|
695
|
-
}
|
|
696
|
-
|
|
697
|
-
.sp-detail-content::-webkit-scrollbar-thumb:hover {
|
|
698
|
-
background: var(--sp-text-tertiary);
|
|
699
|
-
}
|
|
700
|
-
|
|
701
|
-
/* ---- Section ---- */
|
|
702
|
-
|
|
703
|
-
.sp-detail-section {
|
|
704
|
-
padding: 20px 24px;
|
|
705
|
-
border-bottom: 1px solid var(--sp-border);
|
|
706
|
-
opacity: 0;
|
|
707
|
-
transform: translateY(8px);
|
|
708
|
-
animation: sp-detail-section-in 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
|
|
709
|
-
}
|
|
710
|
-
|
|
711
|
-
@keyframes sp-detail-section-in {
|
|
712
|
-
to {
|
|
713
|
-
opacity: 1;
|
|
714
|
-
transform: translateY(0);
|
|
715
|
-
}
|
|
716
|
-
}
|
|
717
|
-
|
|
718
|
-
.sp-detail-section:last-child {
|
|
719
|
-
border-bottom: none;
|
|
720
|
-
}
|
|
721
|
-
|
|
722
|
-
.sp-detail-section-title {
|
|
723
|
-
font-size: 11px;
|
|
724
|
-
font-weight: 600;
|
|
725
|
-
color: var(--sp-text-tertiary);
|
|
726
|
-
text-transform: uppercase;
|
|
727
|
-
letter-spacing: 0.06em;
|
|
728
|
-
margin-bottom: 14px;
|
|
729
|
-
display: flex;
|
|
730
|
-
align-items: center;
|
|
731
|
-
gap: 6px;
|
|
732
|
-
}
|
|
733
|
-
|
|
734
|
-
.sp-detail-section-title svg {
|
|
735
|
-
width: 14px;
|
|
736
|
-
height: 14px;
|
|
737
|
-
opacity: 0.6;
|
|
738
|
-
}
|
|
739
|
-
|
|
740
|
-
/* ---- Status + Actions Section ---- */
|
|
741
|
-
|
|
742
|
-
.sp-detail-status {
|
|
743
|
-
display: flex;
|
|
744
|
-
align-items: center;
|
|
745
|
-
gap: 10px;
|
|
746
|
-
margin-bottom: 16px;
|
|
747
|
-
}
|
|
748
|
-
|
|
749
|
-
.sp-detail-status-pill {
|
|
750
|
-
display: inline-flex;
|
|
751
|
-
align-items: center;
|
|
752
|
-
gap: 6px;
|
|
753
|
-
padding: 5px 14px;
|
|
754
|
-
border-radius: var(--sp-radius-full);
|
|
755
|
-
font-size: 12px;
|
|
756
|
-
font-weight: 600;
|
|
757
|
-
letter-spacing: 0.02em;
|
|
758
|
-
}
|
|
759
|
-
|
|
760
|
-
.sp-detail-status-pill--open {
|
|
761
|
-
background: rgba(34, 197, 94, 0.1);
|
|
762
|
-
color: #22c55e;
|
|
763
|
-
border: 1px solid rgba(34, 197, 94, 0.2);
|
|
764
|
-
}
|
|
765
|
-
|
|
766
|
-
.sp-detail-status-pill--resolved {
|
|
767
|
-
background: rgba(156, 163, 175, 0.1);
|
|
768
|
-
color: #9ca3af;
|
|
769
|
-
border: 1px solid rgba(156, 163, 175, 0.2);
|
|
770
|
-
}
|
|
771
|
-
|
|
772
|
-
.sp-detail-status-dot {
|
|
773
|
-
width: 6px;
|
|
774
|
-
height: 6px;
|
|
775
|
-
border-radius: 50%;
|
|
776
|
-
flex-shrink: 0;
|
|
777
|
-
}
|
|
778
|
-
|
|
779
|
-
.sp-detail-actions {
|
|
780
|
-
display: flex;
|
|
781
|
-
gap: 8px;
|
|
782
|
-
}
|
|
783
|
-
|
|
784
|
-
.sp-detail-actions button {
|
|
785
|
-
flex: 1;
|
|
786
|
-
height: 40px;
|
|
787
|
-
padding: 0 16px;
|
|
788
|
-
border-radius: var(--sp-radius);
|
|
789
|
-
font-family: var(--sp-font);
|
|
790
|
-
font-size: 13px;
|
|
791
|
-
font-weight: 600;
|
|
792
|
-
cursor: pointer;
|
|
793
|
-
display: flex;
|
|
794
|
-
align-items: center;
|
|
795
|
-
justify-content: center;
|
|
796
|
-
gap: 6px;
|
|
797
|
-
transition: all 0.2s ease;
|
|
798
|
-
}
|
|
799
|
-
|
|
800
|
-
.sp-detail-actions button svg {
|
|
801
|
-
width: 15px;
|
|
802
|
-
height: 15px;
|
|
803
|
-
}
|
|
804
|
-
|
|
805
|
-
.sp-detail-btn-resolve {
|
|
806
|
-
border: 1.5px solid #22c55e;
|
|
807
|
-
background: rgba(34, 197, 94, 0.06);
|
|
808
|
-
color: #22c55e;
|
|
809
|
-
}
|
|
810
|
-
|
|
811
|
-
.sp-detail-btn-resolve:hover {
|
|
812
|
-
background: rgba(34, 197, 94, 0.14);
|
|
813
|
-
box-shadow: 0 0 16px rgba(34, 197, 94, 0.12);
|
|
814
|
-
transform: translateY(-1px);
|
|
815
|
-
}
|
|
816
|
-
|
|
817
|
-
.sp-detail-btn-resolve:active {
|
|
818
|
-
transform: translateY(0) scale(0.98);
|
|
819
|
-
transition-duration: 0.1s;
|
|
820
|
-
}
|
|
821
|
-
|
|
822
|
-
.sp-detail-btn-reopen {
|
|
823
|
-
border: 1.5px solid var(--sp-accent);
|
|
824
|
-
background: var(--sp-accent-light);
|
|
825
|
-
color: var(--sp-accent);
|
|
826
|
-
}
|
|
827
|
-
|
|
828
|
-
.sp-detail-btn-reopen:hover {
|
|
829
|
-
background: rgba(var(--sp-accent), 0.14);
|
|
830
|
-
box-shadow: 0 0 16px var(--sp-accent-glow);
|
|
831
|
-
transform: translateY(-1px);
|
|
832
|
-
}
|
|
833
|
-
|
|
834
|
-
.sp-detail-btn-reopen:active {
|
|
835
|
-
transform: translateY(0) scale(0.98);
|
|
836
|
-
transition-duration: 0.1s;
|
|
837
|
-
}
|
|
838
|
-
|
|
839
|
-
.sp-detail-btn-delete {
|
|
840
|
-
border: 1.5px solid #ef4444;
|
|
841
|
-
background: rgba(239, 68, 68, 0.06);
|
|
842
|
-
color: #ef4444;
|
|
843
|
-
}
|
|
844
|
-
|
|
845
|
-
.sp-detail-btn-delete:hover {
|
|
846
|
-
background: rgba(239, 68, 68, 0.14);
|
|
847
|
-
box-shadow: 0 0 16px rgba(239, 68, 68, 0.12);
|
|
848
|
-
transform: translateY(-1px);
|
|
849
|
-
}
|
|
850
|
-
|
|
851
|
-
.sp-detail-btn-delete:active {
|
|
852
|
-
transform: translateY(0) scale(0.98);
|
|
853
|
-
transition-duration: 0.1s;
|
|
854
|
-
}
|
|
855
|
-
|
|
856
|
-
.sp-detail-actions button:disabled {
|
|
857
|
-
opacity: 0.5;
|
|
858
|
-
cursor: not-allowed;
|
|
859
|
-
pointer-events: none;
|
|
860
|
-
transform: none;
|
|
861
|
-
box-shadow: none;
|
|
862
|
-
}
|
|
863
|
-
|
|
864
|
-
/* ---- Message Section ---- */
|
|
865
|
-
|
|
866
|
-
.sp-detail-message {
|
|
867
|
-
font-size: 14px;
|
|
868
|
-
line-height: 1.65;
|
|
869
|
-
color: var(--sp-text);
|
|
870
|
-
padding: 14px 16px;
|
|
871
|
-
border-left: 3px solid var(--sp-accent);
|
|
872
|
-
border-radius: 0 var(--sp-radius) var(--sp-radius) 0;
|
|
873
|
-
background: var(--sp-glass-bg-heavy);
|
|
874
|
-
white-space: pre-wrap;
|
|
875
|
-
word-break: break-word;
|
|
876
|
-
}
|
|
877
|
-
|
|
878
|
-
/* ---- Screenshot Section ---- */
|
|
879
|
-
|
|
880
|
-
.sp-detail-screenshot {
|
|
881
|
-
display: block;
|
|
882
|
-
width: 100%;
|
|
883
|
-
height: auto;
|
|
884
|
-
max-height: 400px;
|
|
885
|
-
object-fit: contain;
|
|
886
|
-
border-radius: var(--sp-radius);
|
|
887
|
-
border: 1px solid var(--sp-glass-border);
|
|
888
|
-
background: var(--sp-glass-bg-heavy);
|
|
889
|
-
}
|
|
890
|
-
|
|
891
|
-
/* ---- Metadata Section ---- */
|
|
892
|
-
|
|
893
|
-
.sp-detail-meta {
|
|
894
|
-
display: flex;
|
|
895
|
-
flex-direction: column;
|
|
896
|
-
gap: 14px;
|
|
897
|
-
}
|
|
898
|
-
|
|
899
|
-
.sp-detail-meta-row {
|
|
900
|
-
display: flex;
|
|
901
|
-
align-items: flex-start;
|
|
902
|
-
gap: 12px;
|
|
903
|
-
}
|
|
904
|
-
|
|
905
|
-
.sp-detail-meta-row svg {
|
|
906
|
-
width: 14px;
|
|
907
|
-
height: 14px;
|
|
908
|
-
color: var(--sp-text-tertiary);
|
|
909
|
-
flex-shrink: 0;
|
|
910
|
-
margin-top: 1px;
|
|
911
|
-
}
|
|
912
|
-
|
|
913
|
-
.sp-detail-meta-content {
|
|
914
|
-
flex: 1;
|
|
915
|
-
min-width: 0;
|
|
916
|
-
}
|
|
917
|
-
|
|
918
|
-
.sp-detail-meta-label {
|
|
919
|
-
font-size: 10px;
|
|
920
|
-
font-weight: 600;
|
|
921
|
-
color: var(--sp-text-tertiary);
|
|
922
|
-
text-transform: uppercase;
|
|
923
|
-
letter-spacing: 0.06em;
|
|
924
|
-
line-height: 1;
|
|
925
|
-
margin-bottom: 4px;
|
|
926
|
-
}
|
|
927
|
-
|
|
928
|
-
.sp-detail-meta-value {
|
|
929
|
-
font-size: 13px;
|
|
930
|
-
line-height: 1.4;
|
|
931
|
-
color: var(--sp-text);
|
|
932
|
-
word-break: break-all;
|
|
933
|
-
}
|
|
934
|
-
|
|
935
|
-
.sp-detail-meta-value--mono {
|
|
936
|
-
font-family: "SF Mono", "Cascadia Code", "Fira Code", "Consolas", monospace;
|
|
937
|
-
font-size: 12px;
|
|
938
|
-
background: var(--sp-glass-bg-heavy);
|
|
939
|
-
padding: 2px 6px;
|
|
940
|
-
border-radius: 4px;
|
|
941
|
-
border: 1px solid var(--sp-glass-border-subtle);
|
|
942
|
-
}
|
|
943
|
-
|
|
944
|
-
.sp-detail-meta-value--secondary {
|
|
945
|
-
color: var(--sp-text-secondary);
|
|
946
|
-
font-size: 12px;
|
|
947
|
-
}
|
|
948
|
-
|
|
949
|
-
/* ---- Annotation Section ---- */
|
|
950
|
-
|
|
951
|
-
.sp-detail-annotation {
|
|
952
|
-
display: flex;
|
|
953
|
-
flex-direction: column;
|
|
954
|
-
gap: 12px;
|
|
955
|
-
}
|
|
956
|
-
|
|
957
|
-
.sp-detail-annotation-info {
|
|
958
|
-
display: flex;
|
|
959
|
-
flex-direction: column;
|
|
960
|
-
gap: 10px;
|
|
961
|
-
padding: 14px;
|
|
962
|
-
border-radius: var(--sp-radius);
|
|
963
|
-
background: var(--sp-glass-bg-heavy);
|
|
964
|
-
border: 1px solid var(--sp-glass-border-subtle);
|
|
965
|
-
}
|
|
966
|
-
|
|
967
|
-
.sp-detail-annotation-row {
|
|
968
|
-
display: flex;
|
|
969
|
-
align-items: flex-start;
|
|
970
|
-
gap: 10px;
|
|
971
|
-
}
|
|
972
|
-
|
|
973
|
-
.sp-detail-annotation-row svg {
|
|
974
|
-
width: 13px;
|
|
975
|
-
height: 13px;
|
|
976
|
-
color: var(--sp-text-tertiary);
|
|
977
|
-
flex-shrink: 0;
|
|
978
|
-
margin-top: 2px;
|
|
979
|
-
}
|
|
980
|
-
|
|
981
|
-
.sp-detail-annotation-label {
|
|
982
|
-
font-size: 10px;
|
|
983
|
-
font-weight: 600;
|
|
984
|
-
color: var(--sp-text-tertiary);
|
|
985
|
-
text-transform: uppercase;
|
|
986
|
-
letter-spacing: 0.06em;
|
|
987
|
-
line-height: 1;
|
|
988
|
-
margin-bottom: 3px;
|
|
989
|
-
}
|
|
990
|
-
|
|
991
|
-
.sp-detail-annotation-value {
|
|
992
|
-
font-size: 12px;
|
|
993
|
-
line-height: 1.4;
|
|
994
|
-
color: var(--sp-text);
|
|
995
|
-
word-break: break-all;
|
|
996
|
-
}
|
|
997
|
-
|
|
998
|
-
.sp-detail-annotation-value--mono {
|
|
999
|
-
font-family: "SF Mono", "Cascadia Code", "Fira Code", "Consolas", monospace;
|
|
1000
|
-
font-size: 11px;
|
|
1001
|
-
background: var(--sp-bg-hover);
|
|
1002
|
-
padding: 2px 6px;
|
|
1003
|
-
border-radius: 4px;
|
|
1004
|
-
display: inline-block;
|
|
1005
|
-
max-width: 100%;
|
|
1006
|
-
overflow: hidden;
|
|
1007
|
-
text-overflow: ellipsis;
|
|
1008
|
-
white-space: nowrap;
|
|
1009
|
-
}
|
|
1010
|
-
|
|
1011
|
-
.sp-detail-btn-goto {
|
|
1012
|
-
width: 100%;
|
|
1013
|
-
height: 44px;
|
|
1014
|
-
padding: 0 20px;
|
|
1015
|
-
border-radius: var(--sp-radius);
|
|
1016
|
-
border: none;
|
|
1017
|
-
background: var(--sp-accent-gradient);
|
|
1018
|
-
color: #fff;
|
|
1019
|
-
font-family: var(--sp-font);
|
|
1020
|
-
font-size: 14px;
|
|
1021
|
-
font-weight: 600;
|
|
1022
|
-
cursor: pointer;
|
|
1023
|
-
display: flex;
|
|
1024
|
-
align-items: center;
|
|
1025
|
-
justify-content: center;
|
|
1026
|
-
gap: 8px;
|
|
1027
|
-
transition: all 0.25s ease;
|
|
1028
|
-
box-shadow: 0 2px 12px var(--sp-accent-glow);
|
|
1029
|
-
}
|
|
1030
|
-
|
|
1031
|
-
.sp-detail-btn-goto svg {
|
|
1032
|
-
width: 16px;
|
|
1033
|
-
height: 16px;
|
|
1034
|
-
}
|
|
1035
|
-
|
|
1036
|
-
.sp-detail-btn-goto:hover {
|
|
1037
|
-
box-shadow: 0 4px 20px var(--sp-accent-glow);
|
|
1038
|
-
transform: translateY(-2px);
|
|
1039
|
-
}
|
|
1040
|
-
|
|
1041
|
-
.sp-detail-btn-goto:active {
|
|
1042
|
-
transform: translateY(0) scale(0.98);
|
|
1043
|
-
transition-duration: 0.1s;
|
|
1044
|
-
}
|
|
1045
|
-
|
|
1046
|
-
/* ---- Forced Colors / High Contrast ---- */
|
|
1047
|
-
|
|
1048
|
-
@media (forced-colors: active) {
|
|
1049
|
-
.sp-detail {
|
|
1050
|
-
border: 2px solid ButtonText !important;
|
|
1051
|
-
background: Canvas !important;
|
|
1052
|
-
}
|
|
1053
|
-
|
|
1054
|
-
.sp-detail-back,
|
|
1055
|
-
.sp-detail-btn-goto,
|
|
1056
|
-
.sp-detail-btn-resolve,
|
|
1057
|
-
.sp-detail-btn-reopen,
|
|
1058
|
-
.sp-detail-btn-delete {
|
|
1059
|
-
border: 2px solid ButtonText !important;
|
|
1060
|
-
background: Canvas !important;
|
|
1061
|
-
color: ButtonText !important;
|
|
1062
|
-
}
|
|
1063
|
-
|
|
1064
|
-
.sp-detail-back:focus-visible,
|
|
1065
|
-
.sp-detail-btn-goto:focus-visible,
|
|
1066
|
-
.sp-detail-btn-resolve:focus-visible,
|
|
1067
|
-
.sp-detail-btn-reopen:focus-visible,
|
|
1068
|
-
.sp-detail-btn-delete:focus-visible {
|
|
1069
|
-
outline: 3px solid Highlight !important;
|
|
1070
|
-
}
|
|
1071
|
-
|
|
1072
|
-
.sp-detail-status-pill {
|
|
1073
|
-
border: 2px solid ButtonText !important;
|
|
1074
|
-
background: Canvas !important;
|
|
1075
|
-
color: ButtonText !important;
|
|
1076
|
-
}
|
|
1077
|
-
|
|
1078
|
-
.sp-detail-message {
|
|
1079
|
-
border-left: 3px solid ButtonText !important;
|
|
1080
|
-
}
|
|
1081
|
-
}
|
|
1082
|
-
|
|
1083
|
-
/* ---- Reduced Motion ---- */
|
|
1084
|
-
|
|
1085
|
-
@media (prefers-reduced-motion: reduce) {
|
|
1086
|
-
.sp-detail {
|
|
1087
|
-
transition-duration: 0.01ms !important;
|
|
1088
|
-
}
|
|
1089
|
-
|
|
1090
|
-
.sp-detail-section {
|
|
1091
|
-
animation-duration: 0.01ms !important;
|
|
1092
|
-
}
|
|
1093
|
-
}
|
|
1094
|
-
`;function sn(n){if(/Edg\//i.test(n)){let e=n.match(/Edg\/([\d.]+)/);return e?`Edge ${e[1]}`:"Edge"}if(/OPR\//i.test(n)||/Opera/i.test(n)){let e=n.match(/OPR\/([\d.]+)/);return e?`Opera ${e[1]}`:"Opera"}if(/Firefox\//i.test(n)){let e=n.match(/Firefox\/([\d.]+)/);return e?`Firefox ${e[1]}`:"Firefox"}if(/Chrome\//i.test(n)&&!/Chromium/i.test(n)){let e=n.match(/Chrome\/([\d.]+)/);return e?`Chrome ${e[1]}`:"Chrome"}if(/Safari\//i.test(n)&&!/Chrome/i.test(n)){let e=n.match(/Version\/([\d.]+)/);return e?`Safari ${e[1]}`:"Safari"}return"Unknown"}function Qt(n,e){try{return new Date(n).toLocaleString(e,{year:"numeric",month:"long",day:"numeric",hour:"2-digit",minute:"2-digit"})}catch{return n}}function nn(n){try{return new URL(n).pathname}catch{return n}}function on(n){return!!(/^data:image\/(jpeg|png|webp);/i.test(n)||/^https:\/\//i.test(n))}function Jt(n,e){return n.length<=e?n:n.slice(0,e-1)+"\u2026"}var ye=class{constructor(e,t,s){this.colors=e;this.callbacks=t;this.i18n=s.startsWith("fr")?Ye:tn,this.element=p("div",{class:"sp-detail"}),this.element.setAttribute("role","dialog"),this.element.setAttribute("aria-label","Feedback detail"),this.element.setAttribute("aria-hidden","true");let o=p("div",{class:"sp-detail-header"}),i=document.createElement("button");i.type="button",i.className="sp-detail-back",i.setAttribute("aria-label",this.i18n["detail.back"]),i.appendChild(y(Xs)),i.addEventListener("click",()=>{this.hide(),this.callbacks.onBack()}),this.element.appendChild(o),o.appendChild(i),this.content=p("div",{class:"sp-detail-content"}),this.element.appendChild(this.content)}colors;callbacks;element;_isVisible=!1;currentFeedback=null;content;i18n;resolveBtn=null;deleteBtn=null;isProcessing=!1;show(e,t){this.currentFeedback=e,this.isProcessing=!1;let s=this.element.querySelector(".sp-detail-header");if(!s)return;let o=s.querySelector(".sp-detail-back");if(!o)return;s.replaceChildren(o);let i=p("span",{class:"sp-detail-title"});h(i,this.i18n["detail.title"].replace("{number}",String(t))),s.appendChild(i);let r=p("span",{class:"sp-badge"});r.style.background=P(e.type,this.colors),r.style.color=F(e.type,this.colors),h(r,e.type),s.appendChild(r),this.content.replaceChildren();let a=0,l=this.buildSection(a++);this.buildStatusActions(l,e),this.content.appendChild(l);let d=this.buildSection(a++),c=p("div",{class:"sp-detail-section-title"});h(c,this.i18n["detail.message"]),d.appendChild(c);let u=p("div",{class:"sp-detail-message"});if(u.style.borderLeftColor=F(e.type,this.colors),h(u,e.message),d.appendChild(u),this.content.appendChild(d),e.screenshotUrl&&on(e.screenshotUrl)){let x=this.buildSection(a++),w=p("div",{class:"sp-detail-section-title"});h(w,this.i18n["detail.screenshot"]),x.appendChild(w);let C=document.createElement("img");C.className="sp-detail-screenshot",C.src=e.screenshotUrl,C.alt=this.i18n["detail.screenshotAlt"],C.loading="lazy",C.referrerPolicy="no-referrer",x.appendChild(C),this.content.appendChild(x)}let b=this.buildSection(a++),f=p("div",{class:"sp-detail-section-title"});if(h(f,this.i18n["detail.metadata"]),b.appendChild(f),this.buildMetadata(b,e),this.content.appendChild(b),e.annotations.length>0){let x=this.buildSection(a++),w=p("div",{class:"sp-detail-section-title"});w.appendChild(y(Ue));let C=p("span");h(C,this.i18n["detail.annotation"]),w.appendChild(C),x.appendChild(w),this.buildAnnotation(x,e),this.content.appendChild(x)}this._isVisible=!0,this.element.setAttribute("aria-hidden","false"),this.element.offsetHeight,this.element.classList.add("sp-detail--visible"),requestAnimationFrame(()=>{o.focus()})}hide(){this._isVisible&&(this._isVisible=!1,this.element.classList.remove("sp-detail--visible"),this.element.setAttribute("aria-hidden","true"),this.currentFeedback=null,this.resolveBtn=null,this.deleteBtn=null)}get isVisible(){return this._isVisible}destroy(){this.hide(),this.element.remove()}buildSection(e){let t=p("div",{class:"sp-detail-section"});return t.style.animationDelay=`${e*40}ms`,t}buildStatusActions(e,t){let s=t.status==="resolved",o=p("div",{class:"sp-detail-section-title"});h(o,this.i18n["detail.status"]),e.appendChild(o);let i=p("div",{class:"sp-detail-status"}),r=p("span",{class:`sp-detail-status-pill ${s?"sp-detail-status-pill--resolved":"sp-detail-status-pill--open"}`}),a=p("span",{class:"sp-detail-status-dot"});a.style.background=s?"#9ca3af":"#22c55e",r.appendChild(a);let l=p("span");h(l,s?this.i18n["detail.reopen"]:this.i18n["detail.resolve"]),h(l,s?"Resolved":"Open"),r.appendChild(l),i.appendChild(r),e.appendChild(i);let d=p("div",{class:"sp-detail-actions"});if(this.resolveBtn=document.createElement("button"),this.resolveBtn.type="button",s){this.resolveBtn.className="sp-detail-btn-reopen",this.resolveBtn.appendChild(y(Gt));let u=document.createElement("span");h(u,this.i18n["detail.reopen"]),this.resolveBtn.appendChild(u)}else{this.resolveBtn.className="sp-detail-btn-resolve",this.resolveBtn.appendChild(y(qe));let u=document.createElement("span");h(u,this.i18n["detail.resolve"]),this.resolveBtn.appendChild(u)}this.resolveBtn.addEventListener("click",()=>this.handleResolve()),this.deleteBtn=document.createElement("button"),this.deleteBtn.type="button",this.deleteBtn.className="sp-detail-btn-delete",this.deleteBtn.appendChild(y(Vt));let c=document.createElement("span");h(c,this.i18n["detail.delete"]),this.deleteBtn.appendChild(c),this.deleteBtn.addEventListener("click",()=>this.handleDelete()),d.appendChild(this.resolveBtn),d.appendChild(this.deleteBtn),e.appendChild(d)}buildMetadata(e,t){let s=p("div",{class:"sp-detail-meta"});if(this.addMetaRow(s,Gs,this.i18n["detail.page"],()=>{let o=p("div",{class:"sp-detail-meta-value"}),i=nn(t.url);return h(o,Jt(i,60)),o.title=t.url,o}),this.addMetaRow(s,Vs,this.i18n["detail.author"],()=>{let o=p("div",{class:"sp-detail-meta-value"}),i=t.authorName||"Anonymous",r=t.authorEmail;return h(o,r?`${i} (${r})`:i),o}),this.addMetaRow(s,Qs,this.i18n["detail.date"],()=>{let o=p("div",{class:"sp-detail-meta-value"});return h(o,Qt(t.createdAt,this.i18n===Ye?"fr":"en")),o}),this.addMetaRow(s,Js,this.i18n["detail.viewport"],()=>{let o=p("div",{class:"sp-detail-meta-value sp-detail-meta-value--mono"});return h(o,t.viewport||"Unknown"),o}),this.addMetaRow(s,'<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="10"/><line x1="2" y1="12" x2="22" y2="12"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/></svg>',this.i18n["detail.browser"],()=>{let o=p("div",{class:"sp-detail-meta-value"});return h(o,sn(t.userAgent)),o}),t.resolvedAt){let o=t.resolvedAt;this.addMetaRow(s,qe,this.i18n["detail.resolvedAt"],()=>{let i=p("div",{class:"sp-detail-meta-value sp-detail-meta-value--secondary"});return h(i,Qt(o,this.i18n===Ye?"fr":"en")),i})}e.appendChild(s)}addMetaRow(e,t,s,o){let i=p("div",{class:"sp-detail-meta-row"});i.appendChild(y(t));let r=p("div",{class:"sp-detail-meta-content"}),a=p("div",{class:"sp-detail-meta-label"});h(a,s),r.appendChild(a),r.appendChild(o()),i.appendChild(r),e.appendChild(i)}buildAnnotation(e,t){let s=t.annotations[0];if(!s)return;let o=p("div",{class:"sp-detail-annotation"}),i=p("div",{class:"sp-detail-annotation-info"});this.addAnnotationRow(i,Zs,this.i18n["detail.element"],()=>{let l=p("span",{class:"sp-detail-annotation-value sp-detail-annotation-value--mono"}),d=s.elementId?`<${s.elementTag}#${s.elementId}>`:`<${s.elementTag}>`;return h(l,d),l}),this.addAnnotationRow(i,en,this.i18n["detail.selector"],()=>{let l=p("span",{class:"sp-detail-annotation-value sp-detail-annotation-value--mono"});return h(l,Jt(s.cssSelector,60)),l.title=s.cssSelector,l}),this.addAnnotationRow(i,Ue,this.i18n["detail.position"],()=>{let l=p("span",{class:"sp-detail-annotation-value"});return h(l,`${s.xPct.toFixed(1)}%, ${s.yPct.toFixed(1)}%`+(s.wPct>0||s.hPct>0?` (${s.wPct.toFixed(1)}% \xD7 ${s.hPct.toFixed(1)}%)`:"")),l}),o.appendChild(i);let r=document.createElement("button");r.type="button",r.className="sp-detail-btn-goto",r.appendChild(y(Ue));let a=document.createElement("span");h(a,this.i18n["detail.goToAnnotation"]),r.appendChild(a),r.addEventListener("click",()=>{this.currentFeedback&&this.callbacks.onGoToAnnotation(this.currentFeedback)}),o.appendChild(r),e.appendChild(o)}addAnnotationRow(e,t,s,o){let i=p("div",{class:"sp-detail-annotation-row"});i.appendChild(y(t));let r=p("div",{class:"sp-detail-meta-content"}),a=p("div",{class:"sp-detail-annotation-label"});h(a,s),r.appendChild(a),r.appendChild(o()),i.appendChild(r),e.appendChild(i)}async handleResolve(){if(!(this.isProcessing||!this.currentFeedback)){this.isProcessing=!0,this.resolveBtn&&this.setButtonLoading(this.resolveBtn),this.deleteBtn&&(this.deleteBtn.disabled=!0);try{await this.callbacks.onResolve(this.currentFeedback)}catch{this.isProcessing=!1,this.resolveBtn&&this.restoreResolveBtn(this.currentFeedback),this.deleteBtn&&(this.deleteBtn.disabled=!1)}}}async handleDelete(){if(!(this.isProcessing||!this.currentFeedback)){this.isProcessing=!0,this.deleteBtn&&this.setButtonLoading(this.deleteBtn),this.resolveBtn&&(this.resolveBtn.disabled=!0);try{await this.callbacks.onDelete(this.currentFeedback)}catch{this.isProcessing=!1,this.deleteBtn&&this.restoreDeleteBtn(),this.resolveBtn&&(this.resolveBtn.disabled=!1)}}}setButtonLoading(e){e.disabled=!0,e.replaceChildren(p("div",{class:"sp-spinner sp-spinner--sm"}))}restoreResolveBtn(e){if(!this.resolveBtn)return;this.resolveBtn.disabled=!1,this.resolveBtn.replaceChildren();let t=e.status==="resolved";this.resolveBtn.appendChild(y(t?Gt:qe));let s=document.createElement("span");h(s,t?this.i18n["detail.reopen"]:this.i18n["detail.resolve"]),this.resolveBtn.appendChild(s)}restoreDeleteBtn(){if(!this.deleteBtn)return;this.deleteBtn.disabled=!1,this.deleteBtn.replaceChildren(),this.deleteBtn.appendChild(y(Vt));let e=document.createElement("span");h(e,this.i18n["detail.delete"]),this.deleteBtn.appendChild(e)}};var rn='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M11 5h10"/><path d="M11 9h7"/><path d="M11 13h4"/><path d="M3 17l3 3 3-3"/><path d="M6 18V4"/></svg>',ts='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/><polyline points="10 9 9 9 8 9"/></svg>',an='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="9 18 15 12 9 6"/></svg>',ln={"sort.newest":"Newest first","sort.oldest":"Oldest first","sort.byType":"By type","sort.openFirst":"Open first","sort.label":"Sort","group.byPage":"By page","group.feedbacks":"{count} feedbacks"},pn={"sort.newest":"Plus r\xE9cents","sort.oldest":"Plus anciens","sort.byType":"Par type","sort.openFirst":"Ouverts d'abord","sort.label":"Trier","group.byPage":"Par page","group.feedbacks":"{count} feedbacks"},es={question:0,change:1,bug:2,other:3};function ss(n,e){let t=[...n];switch(e){case"newest":t.sort((s,o)=>new Date(o.createdAt).getTime()-new Date(s.createdAt).getTime());break;case"oldest":t.sort((s,o)=>new Date(s.createdAt).getTime()-new Date(o.createdAt).getTime());break;case"by-type":t.sort((s,o)=>{let i=es[s.type]??99,r=es[o.type]??99;return i!==r?i-r:new Date(o.createdAt).getTime()-new Date(s.createdAt).getTime()});break;case"open-first":t.sort((s,o)=>{let i=s.status==="open"?0:1,r=o.status==="open"?0:1;return i!==r?i-r:new Date(o.createdAt).getTime()-new Date(s.createdAt).getTime()});break}return t}function dn(n){try{return new URL(n).pathname}catch{return n}}function cn(n,e){if(n.length<=e)return n;let t="\u2026",s=Math.floor((e-1)/2);return n.slice(0,s)+t+n.slice(-s)}function ns(n){let e=new Map;for(let s of n){let o=dn(s.url),i=e.get(o);i?i.push(s):e.set(o,[s])}return new Map([...e.entries()].sort((s,o)=>o[1].length-s[1].length))}function os(n,e,t){let s=p("div",{class:"sp-group-header"});s.setAttribute("role","button"),s.setAttribute("tabindex","0"),s.setAttribute("aria-expanded","true"),s.style.borderBottomColor=t.border;let o=p("span",{class:"sp-group-header-chevron"});o.appendChild(y(an)),s.appendChild(o);let i=p("span",{class:"sp-group-header-icon"});i.appendChild(y(ts)),s.appendChild(i);let r=p("span",{class:"sp-group-header-path"}),a=cn(n,40);h(r,a),n.length>40&&(r.title=n),s.appendChild(r);let l=p("span",{class:"sp-group-header-count"});l.style.background=t.accentLight,l.style.color=t.accent,h(l,String(e)),s.appendChild(l);let d=()=>{let c=s.getAttribute("aria-expanded")==="true";s.setAttribute("aria-expanded",String(!c)),s.classList.toggle("sp-group-header--collapsed",c);let u=s.nextElementSibling;u?.classList.contains("sp-group-content")&&u.classList.toggle("sp-group-content--collapsed",c)};return s.addEventListener("click",d),s.addEventListener("keydown",c=>{(c.key==="Enter"||c.key===" ")&&(c.preventDefault(),d())}),s}var xe=class{element;_sortMode="newest";_groupByPage=!1;menuEl=null;sortBtn;groupToggle;i18n;colors;onChange;outsideClickHandler=null;constructor(e,t,s){this.colors=e,this.onChange=t,this.i18n=s==="fr"?pn:ln,this.element=p("div",{class:"sp-sort-controls"}),this.sortBtn=document.createElement("button"),this.sortBtn.className="sp-sort-btn",this.sortBtn.setAttribute("aria-haspopup","listbox"),this.sortBtn.setAttribute("aria-expanded","false"),this.sortBtn.setAttribute("aria-label",this.i18n["sort.label"]);let o=y(rn);this.sortBtn.appendChild(o);let i=p("span",{class:"sp-sort-btn-label"});h(i,this.i18n["sort.newest"]),this.sortBtn.appendChild(i),this.sortBtn.addEventListener("click",l=>{l.stopPropagation(),this.toggleMenu()}),this.groupToggle=document.createElement("button"),this.groupToggle.className="sp-group-toggle",this.groupToggle.setAttribute("aria-pressed","false");let r=y(ts);this.groupToggle.appendChild(r);let a=p("span",{class:"sp-group-toggle-label"});h(a,this.i18n["group.byPage"]),this.groupToggle.appendChild(a),this.groupToggle.addEventListener("click",()=>{this._groupByPage=!this._groupByPage,this.groupToggle.classList.toggle("sp-group-toggle--active",this._groupByPage),this.groupToggle.setAttribute("aria-pressed",String(this._groupByPage)),this.onChange()}),this.element.appendChild(this.sortBtn),this.element.appendChild(this.groupToggle)}get sortMode(){return this._sortMode}get groupByPage(){return this._groupByPage}toggleMenu(){if(this.menuEl){this.closeMenu();return}this.openMenu()}openMenu(){this.menuEl=p("div",{class:"sp-sort-menu"}),this.menuEl.setAttribute("role","listbox"),this.menuEl.setAttribute("aria-label",this.i18n["sort.label"]),this.sortBtn.setAttribute("aria-expanded","true");let e=[{mode:"newest",label:this.i18n["sort.newest"]},{mode:"oldest",label:this.i18n["sort.oldest"]},{mode:"by-type",label:this.i18n["sort.byType"]},{mode:"open-first",label:this.i18n["sort.openFirst"]}];for(let t of e){let s=document.createElement("button");s.className=`sp-sort-option${t.mode===this._sortMode?" sp-sort-option--active":""}`,s.setAttribute("role","option"),s.setAttribute("aria-selected",String(t.mode===this._sortMode)),t.mode===this._sortMode&&(s.style.background=this.colors.accentLight,s.style.color=this.colors.accent),h(s,t.label),s.addEventListener("click",o=>{o.stopPropagation(),this._sortMode=t.mode,this.updateSortLabel(),this.closeMenu(),this.onChange()}),this.menuEl.appendChild(s)}this.element.appendChild(this.menuEl),requestAnimationFrame(()=>{this.outsideClickHandler=t=>{this.menuEl&&!this.element.contains(t.target)&&this.closeMenu()},document.addEventListener("click",this.outsideClickHandler,!0)}),this.menuEl.addEventListener("keydown",t=>{t.key==="Escape"&&(this.closeMenu(),this.sortBtn.focus())})}closeMenu(){this.menuEl&&(this.menuEl.remove(),this.menuEl=null),this.sortBtn.setAttribute("aria-expanded","false"),this.outsideClickHandler&&(document.removeEventListener("click",this.outsideClickHandler,!0),this.outsideClickHandler=null)}updateSortLabel(){let e={newest:this.i18n["sort.newest"],oldest:this.i18n["sort.oldest"],"by-type":this.i18n["sort.byType"],"open-first":this.i18n["sort.openFirst"]},t=this.sortBtn.querySelector(".sp-sort-btn-label");t&&h(t,e[this._sortMode])}destroy(){this.closeMenu()}},is=`
|
|
1095
|
-
/* ============================
|
|
1096
|
-
Sort Controls Container
|
|
1097
|
-
============================ */
|
|
1098
|
-
|
|
1099
|
-
.sp-sort-controls {
|
|
1100
|
-
display: flex;
|
|
1101
|
-
align-items: center;
|
|
1102
|
-
gap: 6px;
|
|
1103
|
-
margin-top: 4px;
|
|
1104
|
-
padding-top: 8px;
|
|
1105
|
-
border-top: 1px solid var(--sp-border);
|
|
1106
|
-
}
|
|
1107
|
-
|
|
1108
|
-
/* ============================
|
|
1109
|
-
Sort Dropdown Button
|
|
1110
|
-
============================ */
|
|
1111
|
-
|
|
1112
|
-
.sp-sort-btn {
|
|
1113
|
-
display: inline-flex;
|
|
1114
|
-
align-items: center;
|
|
1115
|
-
gap: 5px;
|
|
1116
|
-
padding: 5px 12px;
|
|
1117
|
-
border-radius: var(--sp-radius-full);
|
|
1118
|
-
border: 1px solid var(--sp-border);
|
|
1119
|
-
background: var(--sp-glass-bg-heavy);
|
|
1120
|
-
color: var(--sp-text-secondary);
|
|
1121
|
-
font-family: var(--sp-font);
|
|
1122
|
-
font-size: 12px;
|
|
1123
|
-
font-weight: 500;
|
|
1124
|
-
cursor: pointer;
|
|
1125
|
-
white-space: nowrap;
|
|
1126
|
-
transition: all 0.2s ease;
|
|
1127
|
-
position: relative;
|
|
1128
|
-
}
|
|
1129
|
-
|
|
1130
|
-
.sp-sort-btn svg {
|
|
1131
|
-
width: 14px;
|
|
1132
|
-
height: 14px;
|
|
1133
|
-
flex-shrink: 0;
|
|
1134
|
-
}
|
|
1135
|
-
|
|
1136
|
-
.sp-sort-btn:hover {
|
|
1137
|
-
border-color: var(--sp-accent);
|
|
1138
|
-
color: var(--sp-accent);
|
|
1139
|
-
background: var(--sp-accent-light);
|
|
1140
|
-
}
|
|
1141
|
-
|
|
1142
|
-
.sp-sort-btn[aria-expanded="true"] {
|
|
1143
|
-
border-color: var(--sp-accent);
|
|
1144
|
-
color: var(--sp-accent);
|
|
1145
|
-
background: var(--sp-accent-light);
|
|
1146
|
-
}
|
|
1147
|
-
|
|
1148
|
-
/* ============================
|
|
1149
|
-
Sort Floating Menu
|
|
1150
|
-
============================ */
|
|
1151
|
-
|
|
1152
|
-
.sp-sort-menu {
|
|
1153
|
-
position: absolute;
|
|
1154
|
-
top: calc(100% + 6px);
|
|
1155
|
-
left: 0;
|
|
1156
|
-
min-width: 170px;
|
|
1157
|
-
padding: 4px;
|
|
1158
|
-
border-radius: var(--sp-radius);
|
|
1159
|
-
background: var(--sp-glass-bg-heavy);
|
|
1160
|
-
backdrop-filter: blur(var(--sp-blur-heavy));
|
|
1161
|
-
-webkit-backdrop-filter: blur(var(--sp-blur-heavy));
|
|
1162
|
-
border: 1px solid var(--sp-glass-border);
|
|
1163
|
-
box-shadow: var(--sp-shadow-md);
|
|
1164
|
-
z-index: 10;
|
|
1165
|
-
animation: sp-sort-menu-in 0.15s ease-out both;
|
|
1166
|
-
}
|
|
1167
|
-
|
|
1168
|
-
@keyframes sp-sort-menu-in {
|
|
1169
|
-
from {
|
|
1170
|
-
opacity: 0;
|
|
1171
|
-
transform: translateY(-4px) scale(0.97);
|
|
1172
|
-
}
|
|
1173
|
-
to {
|
|
1174
|
-
opacity: 1;
|
|
1175
|
-
transform: translateY(0) scale(1);
|
|
1176
|
-
}
|
|
1177
|
-
}
|
|
1178
|
-
|
|
1179
|
-
/* ============================
|
|
1180
|
-
Sort Menu Option
|
|
1181
|
-
============================ */
|
|
1182
|
-
|
|
1183
|
-
.sp-sort-option {
|
|
1184
|
-
display: block;
|
|
1185
|
-
width: 100%;
|
|
1186
|
-
padding: 8px 12px;
|
|
1187
|
-
border: none;
|
|
1188
|
-
border-radius: 8px;
|
|
1189
|
-
background: transparent;
|
|
1190
|
-
color: var(--sp-text-secondary);
|
|
1191
|
-
font-family: var(--sp-font);
|
|
1192
|
-
font-size: 12px;
|
|
1193
|
-
font-weight: 500;
|
|
1194
|
-
cursor: pointer;
|
|
1195
|
-
text-align: left;
|
|
1196
|
-
transition: all 0.15s ease;
|
|
1197
|
-
}
|
|
1198
|
-
|
|
1199
|
-
.sp-sort-option:hover {
|
|
1200
|
-
background: var(--sp-bg-hover);
|
|
1201
|
-
color: var(--sp-text);
|
|
1202
|
-
}
|
|
1203
|
-
|
|
1204
|
-
.sp-sort-option--active {
|
|
1205
|
-
font-weight: 600;
|
|
1206
|
-
}
|
|
1207
|
-
|
|
1208
|
-
.sp-sort-option--active:hover {
|
|
1209
|
-
background: var(--sp-accent-light);
|
|
1210
|
-
color: var(--sp-accent);
|
|
1211
|
-
}
|
|
1212
|
-
|
|
1213
|
-
/* ============================
|
|
1214
|
-
Group by Page Toggle
|
|
1215
|
-
============================ */
|
|
1216
|
-
|
|
1217
|
-
.sp-group-toggle {
|
|
1218
|
-
display: inline-flex;
|
|
1219
|
-
align-items: center;
|
|
1220
|
-
gap: 5px;
|
|
1221
|
-
padding: 5px 12px;
|
|
1222
|
-
border-radius: var(--sp-radius-full);
|
|
1223
|
-
border: 1px solid var(--sp-border);
|
|
1224
|
-
background: var(--sp-glass-bg-heavy);
|
|
1225
|
-
color: var(--sp-text-secondary);
|
|
1226
|
-
font-family: var(--sp-font);
|
|
1227
|
-
font-size: 12px;
|
|
1228
|
-
font-weight: 500;
|
|
1229
|
-
cursor: pointer;
|
|
1230
|
-
white-space: nowrap;
|
|
1231
|
-
transition: all 0.2s ease;
|
|
1232
|
-
}
|
|
1233
|
-
|
|
1234
|
-
.sp-group-toggle svg {
|
|
1235
|
-
width: 13px;
|
|
1236
|
-
height: 13px;
|
|
1237
|
-
flex-shrink: 0;
|
|
1238
|
-
}
|
|
1239
|
-
|
|
1240
|
-
.sp-group-toggle:hover {
|
|
1241
|
-
border-color: var(--sp-accent);
|
|
1242
|
-
color: var(--sp-accent);
|
|
1243
|
-
background: var(--sp-accent-light);
|
|
1244
|
-
}
|
|
1245
|
-
|
|
1246
|
-
.sp-group-toggle--active {
|
|
1247
|
-
background: var(--sp-accent-gradient);
|
|
1248
|
-
border-color: transparent;
|
|
1249
|
-
color: #fff;
|
|
1250
|
-
box-shadow: 0 2px 8px var(--sp-accent-glow);
|
|
1251
|
-
}
|
|
1252
|
-
|
|
1253
|
-
.sp-group-toggle--active:hover {
|
|
1254
|
-
background: var(--sp-accent-gradient);
|
|
1255
|
-
border-color: transparent;
|
|
1256
|
-
color: #fff;
|
|
1257
|
-
}
|
|
1258
|
-
|
|
1259
|
-
/* ============================
|
|
1260
|
-
Page Group Header
|
|
1261
|
-
============================ */
|
|
1262
|
-
|
|
1263
|
-
.sp-group-header {
|
|
1264
|
-
display: flex;
|
|
1265
|
-
align-items: center;
|
|
1266
|
-
gap: 8px;
|
|
1267
|
-
padding: 8px 12px;
|
|
1268
|
-
background: var(--sp-accent-light);
|
|
1269
|
-
border-bottom: 1px solid var(--sp-border);
|
|
1270
|
-
cursor: pointer;
|
|
1271
|
-
user-select: none;
|
|
1272
|
-
position: sticky;
|
|
1273
|
-
top: 0;
|
|
1274
|
-
z-index: 2;
|
|
1275
|
-
transition: background 0.2s ease;
|
|
1276
|
-
}
|
|
1277
|
-
|
|
1278
|
-
.sp-group-header:hover {
|
|
1279
|
-
background: var(--sp-bg-hover);
|
|
1280
|
-
}
|
|
1281
|
-
|
|
1282
|
-
.sp-group-header:focus-visible {
|
|
1283
|
-
outline: 2px solid var(--sp-accent);
|
|
1284
|
-
outline-offset: -2px;
|
|
1285
|
-
}
|
|
1286
|
-
|
|
1287
|
-
.sp-group-header-chevron {
|
|
1288
|
-
display: flex;
|
|
1289
|
-
align-items: center;
|
|
1290
|
-
justify-content: center;
|
|
1291
|
-
width: 16px;
|
|
1292
|
-
height: 16px;
|
|
1293
|
-
flex-shrink: 0;
|
|
1294
|
-
transition: transform 0.2s ease;
|
|
1295
|
-
transform: rotate(90deg);
|
|
1296
|
-
}
|
|
1297
|
-
|
|
1298
|
-
.sp-group-header-chevron svg {
|
|
1299
|
-
width: 12px;
|
|
1300
|
-
height: 12px;
|
|
1301
|
-
color: var(--sp-text-tertiary);
|
|
1302
|
-
}
|
|
1303
|
-
|
|
1304
|
-
.sp-group-header--collapsed .sp-group-header-chevron {
|
|
1305
|
-
transform: rotate(0deg);
|
|
1306
|
-
}
|
|
1307
|
-
|
|
1308
|
-
.sp-group-header-icon {
|
|
1309
|
-
display: flex;
|
|
1310
|
-
align-items: center;
|
|
1311
|
-
flex-shrink: 0;
|
|
1312
|
-
}
|
|
1313
|
-
|
|
1314
|
-
.sp-group-header-icon svg {
|
|
1315
|
-
width: 14px;
|
|
1316
|
-
height: 14px;
|
|
1317
|
-
color: var(--sp-text-tertiary);
|
|
1318
|
-
}
|
|
1319
|
-
|
|
1320
|
-
.sp-group-header-path {
|
|
1321
|
-
font-size: 12px;
|
|
1322
|
-
font-weight: 600;
|
|
1323
|
-
color: var(--sp-text-secondary);
|
|
1324
|
-
flex: 1;
|
|
1325
|
-
min-width: 0;
|
|
1326
|
-
overflow: hidden;
|
|
1327
|
-
text-overflow: ellipsis;
|
|
1328
|
-
white-space: nowrap;
|
|
1329
|
-
}
|
|
1330
|
-
|
|
1331
|
-
.sp-group-header-count {
|
|
1332
|
-
font-size: 11px;
|
|
1333
|
-
font-weight: 700;
|
|
1334
|
-
padding: 1px 8px;
|
|
1335
|
-
border-radius: var(--sp-radius-full);
|
|
1336
|
-
flex-shrink: 0;
|
|
1337
|
-
font-variant-numeric: tabular-nums;
|
|
1338
|
-
}
|
|
1339
|
-
|
|
1340
|
-
/* ============================
|
|
1341
|
-
Page Group Content
|
|
1342
|
-
============================ */
|
|
1343
|
-
|
|
1344
|
-
.sp-group-content {
|
|
1345
|
-
overflow: hidden;
|
|
1346
|
-
transition: max-height 0.25s ease, opacity 0.2s ease;
|
|
1347
|
-
max-height: 5000px;
|
|
1348
|
-
opacity: 1;
|
|
1349
|
-
}
|
|
1350
|
-
|
|
1351
|
-
.sp-group-content--collapsed {
|
|
1352
|
-
max-height: 0;
|
|
1353
|
-
opacity: 0;
|
|
1354
|
-
pointer-events: none;
|
|
1355
|
-
}
|
|
1356
|
-
|
|
1357
|
-
/* ============================
|
|
1358
|
-
Forced Colors / High Contrast
|
|
1359
|
-
============================ */
|
|
1360
|
-
|
|
1361
|
-
@media (forced-colors: active) {
|
|
1362
|
-
.sp-sort-btn,
|
|
1363
|
-
.sp-group-toggle,
|
|
1364
|
-
.sp-sort-option,
|
|
1365
|
-
.sp-group-header {
|
|
1366
|
-
border: 2px solid ButtonText !important;
|
|
1367
|
-
background: Canvas !important;
|
|
1368
|
-
color: ButtonText !important;
|
|
1369
|
-
}
|
|
1370
|
-
|
|
1371
|
-
.sp-sort-btn:focus-visible,
|
|
1372
|
-
.sp-group-toggle:focus-visible,
|
|
1373
|
-
.sp-sort-option:focus-visible,
|
|
1374
|
-
.sp-group-header:focus-visible {
|
|
1375
|
-
outline: 3px solid Highlight !important;
|
|
1376
|
-
}
|
|
1377
|
-
|
|
1378
|
-
.sp-sort-menu {
|
|
1379
|
-
border: 2px solid ButtonText !important;
|
|
1380
|
-
background: Canvas !important;
|
|
1381
|
-
}
|
|
1382
|
-
}
|
|
1383
|
-
|
|
1384
|
-
/* ============================
|
|
1385
|
-
Reduced Motion
|
|
1386
|
-
============================ */
|
|
1387
|
-
|
|
1388
|
-
@media (prefers-reduced-motion: reduce) {
|
|
1389
|
-
.sp-sort-menu {
|
|
1390
|
-
animation: none;
|
|
1391
|
-
}
|
|
1392
|
-
.sp-group-header-chevron {
|
|
1393
|
-
transition: none;
|
|
1394
|
-
}
|
|
1395
|
-
.sp-group-content {
|
|
1396
|
-
transition: none;
|
|
1397
|
-
}
|
|
1398
|
-
}
|
|
1399
|
-
`;var un={"stats.open":"Open","stats.resolved":"Resolved","stats.bugs":"Bugs","stats.progress":"{percent}% resolved"},hn={"stats.open":"Ouverts","stats.resolved":"R\xE9solus","stats.bugs":"Bugs","stats.progress":"{percent}% r\xE9solus"},rs=`
|
|
1400
|
-
.sp-stats-bar {
|
|
1401
|
-
display: flex;
|
|
1402
|
-
flex-direction: column;
|
|
1403
|
-
gap: 8px;
|
|
1404
|
-
padding: 12px 24px;
|
|
1405
|
-
border-bottom: 1px solid var(--sp-border);
|
|
1406
|
-
user-select: none;
|
|
1407
|
-
}
|
|
1408
|
-
|
|
1409
|
-
.sp-stats-bar[hidden] {
|
|
1410
|
-
display: none;
|
|
1411
|
-
}
|
|
1412
|
-
|
|
1413
|
-
.sp-stats-row {
|
|
1414
|
-
display: flex;
|
|
1415
|
-
align-items: center;
|
|
1416
|
-
gap: 16px;
|
|
1417
|
-
}
|
|
1418
|
-
|
|
1419
|
-
.sp-stats-item {
|
|
1420
|
-
display: flex;
|
|
1421
|
-
align-items: center;
|
|
1422
|
-
gap: 6px;
|
|
1423
|
-
}
|
|
1424
|
-
|
|
1425
|
-
.sp-stats-dot {
|
|
1426
|
-
width: 6px;
|
|
1427
|
-
height: 6px;
|
|
1428
|
-
border-radius: 50%;
|
|
1429
|
-
flex-shrink: 0;
|
|
1430
|
-
}
|
|
1431
|
-
|
|
1432
|
-
.sp-stats-value {
|
|
1433
|
-
font-size: 16px;
|
|
1434
|
-
font-weight: 600;
|
|
1435
|
-
line-height: 1;
|
|
1436
|
-
color: var(--sp-text);
|
|
1437
|
-
font-variant-numeric: tabular-nums;
|
|
1438
|
-
font-feature-settings: "tnum";
|
|
1439
|
-
transition: opacity 0.3s ease;
|
|
1440
|
-
}
|
|
1441
|
-
|
|
1442
|
-
.sp-stats-label {
|
|
1443
|
-
font-size: 11px;
|
|
1444
|
-
line-height: 1;
|
|
1445
|
-
color: var(--sp-text-tertiary);
|
|
1446
|
-
text-transform: uppercase;
|
|
1447
|
-
letter-spacing: 0.04em;
|
|
1448
|
-
}
|
|
1449
|
-
|
|
1450
|
-
.sp-stats-progress {
|
|
1451
|
-
display: flex;
|
|
1452
|
-
align-items: center;
|
|
1453
|
-
gap: 8px;
|
|
1454
|
-
}
|
|
1455
|
-
|
|
1456
|
-
.sp-stats-progress-track {
|
|
1457
|
-
flex: 1;
|
|
1458
|
-
height: 4px;
|
|
1459
|
-
border-radius: 2px;
|
|
1460
|
-
background: var(--sp-border);
|
|
1461
|
-
overflow: hidden;
|
|
1462
|
-
}
|
|
1463
|
-
|
|
1464
|
-
.sp-stats-progress-fill {
|
|
1465
|
-
height: 100%;
|
|
1466
|
-
border-radius: 2px;
|
|
1467
|
-
background: linear-gradient(90deg, var(--sp-accent), #22c55e);
|
|
1468
|
-
width: 0%;
|
|
1469
|
-
transition: width 0.5s ease;
|
|
1470
|
-
}
|
|
1471
|
-
|
|
1472
|
-
.sp-stats-progress-label {
|
|
1473
|
-
font-size: 10px;
|
|
1474
|
-
line-height: 1;
|
|
1475
|
-
color: var(--sp-text-tertiary);
|
|
1476
|
-
white-space: nowrap;
|
|
1477
|
-
font-variant-numeric: tabular-nums;
|
|
1478
|
-
font-feature-settings: "tnum";
|
|
1479
|
-
min-width: 64px;
|
|
1480
|
-
text-align: right;
|
|
1481
|
-
}
|
|
1482
|
-
`,ke=class{constructor(e,t){this.colors=e;this.i18n=t==="fr"?hn:un,this.element=p("div",{class:"sp-stats-bar"}),this.element.setAttribute("aria-label","Feedback statistics"),this.element.hidden=!0;let s=p("div",{class:"sp-stats-row"}),o=p("div",{class:"sp-stats-item"}),i=p("span",{class:"sp-stats-dot"});i.style.background="#22c55e",this.valueOpen=p("span",{class:"sp-stats-value"}),h(this.valueOpen,"0");let r=p("span",{class:"sp-stats-label"});h(r,this.i18n["stats.open"]),o.appendChild(i),o.appendChild(this.valueOpen),o.appendChild(r);let a=p("div",{class:"sp-stats-item"}),l=p("span",{class:"sp-stats-dot"});l.style.background="#9ca3af",this.valueResolved=p("span",{class:"sp-stats-value"}),h(this.valueResolved,"0");let d=p("span",{class:"sp-stats-label"});h(d,this.i18n["stats.resolved"]),a.appendChild(l),a.appendChild(this.valueResolved),a.appendChild(d);let c=p("div",{class:"sp-stats-item"}),u=p("span",{class:"sp-stats-dot"});u.style.background=this.colors.typeBug,this.valueBugs=p("span",{class:"sp-stats-value"}),h(this.valueBugs,"0");let b=p("span",{class:"sp-stats-label"});h(b,this.i18n["stats.bugs"]),c.appendChild(u),c.appendChild(this.valueBugs),c.appendChild(b),s.appendChild(o),s.appendChild(a),s.appendChild(c);let f=p("div",{class:"sp-stats-progress"}),x=p("div",{class:"sp-stats-progress-track"});this.progressFill=p("div",{class:"sp-stats-progress-fill"}),x.appendChild(this.progressFill),this.progressLabel=p("span",{class:"sp-stats-progress-label"}),h(this.progressLabel,""),f.appendChild(x),f.appendChild(this.progressLabel),this.element.appendChild(s),this.element.appendChild(f)}colors;element;valueOpen;valueResolved;valueBugs;progressFill;progressLabel;i18n;update(e,t){if(t===0){this.element.hidden=!0;return}this.element.hidden=!1;let s=0,o=0,i=0;for(let d of e)d.status==="open"&&s++,d.status==="resolved"&&o++,d.type==="bug"&&i++;h(this.valueOpen,String(s)),h(this.valueResolved,String(o)),h(this.valueBugs,String(i));let r=e.length,a=r>0?Math.round(o/r*100):0;requestAnimationFrame(()=>{this.progressFill.style.width=`${a}%`});let l=this.i18n["stats.progress"].replace("{percent}",String(a));h(this.progressLabel,l)}};var bn='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="2" y="4" width="20" height="16" rx="2"/><path d="M6 8h.01"/><path d="M10 8h.01"/><path d="M14 8h.01"/><path d="M18 8h.01"/><path d="M6 12h.01"/><path d="M18 12h.01"/><path d="M8 16h8"/></svg>',We={"shortcuts.title":"Keyboard shortcuts","shortcuts.navigate":"Navigate feedbacks","shortcuts.resolve":"Resolve / Reopen","shortcuts.delete":"Delete","shortcuts.search":"Focus search","shortcuts.select":"Toggle selection","shortcuts.help":"Show shortcuts","shortcuts.close":"Close","shortcuts.hint":"Keyboard shortcuts"},as={"shortcuts.title":"Raccourcis clavier","shortcuts.navigate":"Naviguer les feedbacks","shortcuts.resolve":"R\xE9soudre / Rouvrir","shortcuts.delete":"Supprimer","shortcuts.search":"Rechercher","shortcuts.select":"S\xE9lectionner","shortcuts.help":"Raccourcis","shortcuts.close":"Fermer","shortcuts.hint":"Raccourcis clavier"};function Xe(n){let e=n.querySelectorAll(".sp-card");for(let t=0;t<e.length;t++)if(e[t]?.classList.contains("sp-card--focused"))return t;return-1}function ls(n,e){let t=n.querySelectorAll(".sp-card");if(t.length===0)return;for(let i of t)i.classList.remove("sp-card--focused");let s=Math.max(0,Math.min(e,t.length-1)),o=t[s];o&&(o.classList.add("sp-card--focused"),o.scrollIntoView({block:"nearest",behavior:"smooth"}),o.focus({preventScroll:!0}))}var gn=[{keys:["J","K"],label:"shortcuts.navigate"},{keys:["R"],label:"shortcuts.resolve"},{keys:["D"],label:"shortcuts.delete"},{keys:["F","/"],label:"shortcuts.search"},{keys:["X"],label:"shortcuts.select"},{keys:["?"],label:"shortcuts.help"},{keys:["Esc"],label:"shortcuts.close"}],ps=`
|
|
1483
|
-
/* ---- Help overlay backdrop ---- */
|
|
1484
|
-
|
|
1485
|
-
.sp-shortcuts-overlay {
|
|
1486
|
-
position: fixed;
|
|
1487
|
-
inset: 0;
|
|
1488
|
-
background: var(--sp-backdrop, rgba(15, 23, 42, 0.2));
|
|
1489
|
-
backdrop-filter: blur(var(--sp-blur));
|
|
1490
|
-
-webkit-backdrop-filter: blur(var(--sp-blur));
|
|
1491
|
-
display: flex;
|
|
1492
|
-
align-items: center;
|
|
1493
|
-
justify-content: center;
|
|
1494
|
-
z-index: 10;
|
|
1495
|
-
opacity: 0;
|
|
1496
|
-
pointer-events: none;
|
|
1497
|
-
transition: opacity 0.2s ease;
|
|
1498
|
-
}
|
|
1499
|
-
|
|
1500
|
-
.sp-shortcuts-overlay--visible {
|
|
1501
|
-
opacity: 1;
|
|
1502
|
-
pointer-events: auto;
|
|
1503
|
-
}
|
|
1504
|
-
|
|
1505
|
-
/* ---- Glassmorphism card ---- */
|
|
1506
|
-
|
|
1507
|
-
.sp-shortcuts-card {
|
|
1508
|
-
width: 380px;
|
|
1509
|
-
max-width: calc(100vw - 32px);
|
|
1510
|
-
padding: 24px 28px 20px;
|
|
1511
|
-
border-radius: 20px;
|
|
1512
|
-
background: var(--sp-glass-bg-heavy);
|
|
1513
|
-
backdrop-filter: blur(var(--sp-blur-heavy));
|
|
1514
|
-
-webkit-backdrop-filter: blur(var(--sp-blur-heavy));
|
|
1515
|
-
border: 1px solid var(--sp-glass-border);
|
|
1516
|
-
box-shadow: var(--sp-shadow-xl);
|
|
1517
|
-
font-family: var(--sp-font);
|
|
1518
|
-
position: relative;
|
|
1519
|
-
transform: scale(0.92) translateY(8px);
|
|
1520
|
-
transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
|
|
1521
|
-
}
|
|
1522
|
-
|
|
1523
|
-
.sp-shortcuts-overlay--visible .sp-shortcuts-card {
|
|
1524
|
-
transform: scale(1) translateY(0);
|
|
1525
|
-
}
|
|
1526
|
-
|
|
1527
|
-
/* ---- Title row ---- */
|
|
1528
|
-
|
|
1529
|
-
.sp-shortcuts-title {
|
|
1530
|
-
display: flex;
|
|
1531
|
-
align-items: center;
|
|
1532
|
-
gap: 8px;
|
|
1533
|
-
font-size: 16px;
|
|
1534
|
-
font-weight: 700;
|
|
1535
|
-
color: var(--sp-text);
|
|
1536
|
-
margin-bottom: 18px;
|
|
1537
|
-
}
|
|
1538
|
-
|
|
1539
|
-
.sp-shortcuts-title svg {
|
|
1540
|
-
width: 18px;
|
|
1541
|
-
height: 18px;
|
|
1542
|
-
color: var(--sp-text-secondary);
|
|
1543
|
-
flex-shrink: 0;
|
|
1544
|
-
}
|
|
1545
|
-
|
|
1546
|
-
/* ---- Close button ---- */
|
|
1547
|
-
|
|
1548
|
-
.sp-shortcuts-close {
|
|
1549
|
-
position: absolute;
|
|
1550
|
-
top: 16px;
|
|
1551
|
-
right: 16px;
|
|
1552
|
-
width: 28px;
|
|
1553
|
-
height: 28px;
|
|
1554
|
-
border-radius: 8px;
|
|
1555
|
-
border: none;
|
|
1556
|
-
background: transparent;
|
|
1557
|
-
color: var(--sp-text-tertiary);
|
|
1558
|
-
cursor: pointer;
|
|
1559
|
-
display: flex;
|
|
1560
|
-
align-items: center;
|
|
1561
|
-
justify-content: center;
|
|
1562
|
-
transition: background 0.15s ease, color 0.15s ease;
|
|
1563
|
-
}
|
|
1564
|
-
|
|
1565
|
-
.sp-shortcuts-close:hover {
|
|
1566
|
-
background: var(--sp-bg-hover);
|
|
1567
|
-
color: var(--sp-text);
|
|
1568
|
-
}
|
|
1569
|
-
|
|
1570
|
-
.sp-shortcuts-close svg {
|
|
1571
|
-
width: 14px;
|
|
1572
|
-
height: 14px;
|
|
1573
|
-
}
|
|
1574
|
-
|
|
1575
|
-
/* ---- Two-column grid ---- */
|
|
1576
|
-
|
|
1577
|
-
.sp-shortcuts-grid {
|
|
1578
|
-
display: flex;
|
|
1579
|
-
flex-direction: column;
|
|
1580
|
-
gap: 10px;
|
|
1581
|
-
}
|
|
1582
|
-
|
|
1583
|
-
.sp-shortcuts-row {
|
|
1584
|
-
display: flex;
|
|
1585
|
-
align-items: center;
|
|
1586
|
-
gap: 12px;
|
|
1587
|
-
}
|
|
1588
|
-
|
|
1589
|
-
.sp-shortcuts-keys {
|
|
1590
|
-
display: flex;
|
|
1591
|
-
align-items: center;
|
|
1592
|
-
gap: 4px;
|
|
1593
|
-
min-width: 80px;
|
|
1594
|
-
justify-content: flex-end;
|
|
1595
|
-
}
|
|
1596
|
-
|
|
1597
|
-
.sp-shortcuts-separator {
|
|
1598
|
-
font-size: 11px;
|
|
1599
|
-
color: var(--sp-text-tertiary);
|
|
1600
|
-
user-select: none;
|
|
1601
|
-
}
|
|
1602
|
-
|
|
1603
|
-
/* ---- Key badge (<kbd> styling) ---- */
|
|
1604
|
-
|
|
1605
|
-
.sp-kbd {
|
|
1606
|
-
display: inline-flex;
|
|
1607
|
-
align-items: center;
|
|
1608
|
-
justify-content: center;
|
|
1609
|
-
min-width: 28px;
|
|
1610
|
-
height: 26px;
|
|
1611
|
-
padding: 0 7px;
|
|
1612
|
-
border-radius: 6px;
|
|
1613
|
-
background: var(--sp-bg-hover);
|
|
1614
|
-
border: 1px solid var(--sp-border);
|
|
1615
|
-
box-shadow:
|
|
1616
|
-
inset 0 -1px 0 rgba(0, 0, 0, 0.08),
|
|
1617
|
-
0 1px 2px rgba(0, 0, 0, 0.04);
|
|
1618
|
-
font-family: ui-monospace, "SF Mono", "Cascadia Code", "Segoe UI Mono", Menlo, monospace;
|
|
1619
|
-
font-size: 12px;
|
|
1620
|
-
font-weight: 600;
|
|
1621
|
-
color: var(--sp-text);
|
|
1622
|
-
text-align: center;
|
|
1623
|
-
line-height: 1;
|
|
1624
|
-
user-select: none;
|
|
1625
|
-
}
|
|
1626
|
-
|
|
1627
|
-
/* ---- Description text ---- */
|
|
1628
|
-
|
|
1629
|
-
.sp-shortcuts-desc {
|
|
1630
|
-
font-size: 13px;
|
|
1631
|
-
color: var(--sp-text-secondary);
|
|
1632
|
-
line-height: 1.3;
|
|
1633
|
-
}
|
|
1634
|
-
|
|
1635
|
-
/* ---- Hint button (bottom-right of panel) ---- */
|
|
1636
|
-
|
|
1637
|
-
.sp-shortcuts-hint {
|
|
1638
|
-
width: 24px;
|
|
1639
|
-
height: 24px;
|
|
1640
|
-
border-radius: var(--sp-radius-full);
|
|
1641
|
-
border: 1px solid var(--sp-border);
|
|
1642
|
-
background: var(--sp-bg-hover);
|
|
1643
|
-
color: var(--sp-text-tertiary);
|
|
1644
|
-
font-family: ui-monospace, "SF Mono", "Cascadia Code", "Segoe UI Mono", Menlo, monospace;
|
|
1645
|
-
font-size: 12px;
|
|
1646
|
-
font-weight: 700;
|
|
1647
|
-
line-height: 1;
|
|
1648
|
-
cursor: pointer;
|
|
1649
|
-
display: flex;
|
|
1650
|
-
align-items: center;
|
|
1651
|
-
justify-content: center;
|
|
1652
|
-
transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
|
|
1653
|
-
position: absolute;
|
|
1654
|
-
bottom: 12px;
|
|
1655
|
-
right: 12px;
|
|
1656
|
-
}
|
|
1657
|
-
|
|
1658
|
-
.sp-shortcuts-hint:hover {
|
|
1659
|
-
background: var(--sp-accent-light);
|
|
1660
|
-
color: var(--sp-accent);
|
|
1661
|
-
border-color: var(--sp-accent);
|
|
1662
|
-
}
|
|
1663
|
-
|
|
1664
|
-
.sp-shortcuts-hint::after {
|
|
1665
|
-
content: attr(aria-label);
|
|
1666
|
-
position: absolute;
|
|
1667
|
-
bottom: calc(100% + 6px);
|
|
1668
|
-
right: 0;
|
|
1669
|
-
padding: 4px 8px;
|
|
1670
|
-
border-radius: 6px;
|
|
1671
|
-
background: var(--sp-glass-bg-heavy);
|
|
1672
|
-
border: 1px solid var(--sp-glass-border);
|
|
1673
|
-
box-shadow: var(--sp-shadow-sm);
|
|
1674
|
-
font-family: var(--sp-font);
|
|
1675
|
-
font-size: 11px;
|
|
1676
|
-
font-weight: 500;
|
|
1677
|
-
color: var(--sp-text-secondary);
|
|
1678
|
-
white-space: nowrap;
|
|
1679
|
-
opacity: 0;
|
|
1680
|
-
pointer-events: none;
|
|
1681
|
-
transform: translateY(4px);
|
|
1682
|
-
transition: opacity 0.15s ease, transform 0.15s ease;
|
|
1683
|
-
}
|
|
1684
|
-
|
|
1685
|
-
.sp-shortcuts-hint:hover::after {
|
|
1686
|
-
opacity: 1;
|
|
1687
|
-
transform: translateY(0);
|
|
1688
|
-
}
|
|
1689
|
-
|
|
1690
|
-
/* ---- Card focus highlight (navigation) ---- */
|
|
1691
|
-
|
|
1692
|
-
.sp-card--focused {
|
|
1693
|
-
outline: 2px solid var(--sp-accent);
|
|
1694
|
-
outline-offset: -2px;
|
|
1695
|
-
border-radius: inherit;
|
|
1696
|
-
}
|
|
1697
|
-
|
|
1698
|
-
/* ---- Reduced motion ---- */
|
|
1699
|
-
|
|
1700
|
-
@media (prefers-reduced-motion: reduce) {
|
|
1701
|
-
.sp-shortcuts-overlay,
|
|
1702
|
-
.sp-shortcuts-card,
|
|
1703
|
-
.sp-shortcuts-close,
|
|
1704
|
-
.sp-shortcuts-hint,
|
|
1705
|
-
.sp-shortcuts-hint::after {
|
|
1706
|
-
transition-duration: 0.01ms !important;
|
|
1707
|
-
}
|
|
1708
|
-
}
|
|
1709
|
-
`,mn='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>',we=class{constructor(e,t,s=We){this.i18n=s;this.keyMap=new Map([["j",()=>t.onNavigate("down")],["k",()=>t.onNavigate("up")],["r",()=>t.onResolve()],["d",()=>t.onDelete()],["f",()=>t.onFocusSearch()],["/",()=>t.onFocusSearch()],["x",()=>t.onToggleSelect()],["?",()=>this.toggleHelp()]]),this.helpOverlay=this.buildOverlay(),this.hintButton=this.buildHintButton(),this.boundHandler=o=>this.handleKeydown(o)}i18n;helpOverlay;hintButton;keyMap;boundHandler;shadowRoot=null;enabled=!1;helpVisible=!1;destroyed=!1;enable(e){if(this.destroyed||this.enabled)return;e&&(this.shadowRoot=e),(this.shadowRoot??document).addEventListener("keydown",this.boundHandler),this.enabled=!0}disable(){if(!this.enabled)return;(this.shadowRoot??document).removeEventListener("keydown",this.boundHandler),this.enabled=!1,this.helpVisible&&this.hideHelp()}toggleHelp(){this.helpVisible?this.hideHelp():this.showHelp()}destroy(){this.destroyed||(this.disable(),this.helpOverlay.remove(),this.hintButton.remove(),this.destroyed=!0)}handleKeydown(e){if(e.key==="Escape"){this.helpVisible&&(e.preventDefault(),e.stopPropagation(),this.hideHelp());return}if(this.helpVisible)return;let t=e.composedPath()[0];if(t){let o=t.tagName?.toLowerCase();if(o==="input"||o==="textarea"||o==="select"||t.isContentEditable)return}if(e.ctrlKey||e.altKey||e.metaKey)return;let s=this.keyMap.get(e.key);s&&(e.preventDefault(),e.stopPropagation(),s())}showHelp(){this.helpVisible=!0,this.helpOverlay.classList.add("sp-shortcuts-overlay--visible"),this.helpOverlay.querySelector(".sp-shortcuts-close")?.focus()}hideHelp(){this.helpVisible=!1,this.helpOverlay.classList.remove("sp-shortcuts-overlay--visible")}buildOverlay(){let e=p("div",{class:"sp-shortcuts-overlay"});e.setAttribute("role","dialog"),e.setAttribute("aria-modal","true"),e.setAttribute("aria-label",this.i18n["shortcuts.title"]),e.addEventListener("click",a=>{a.target===e&&this.hideHelp()});let t=p("div",{class:"sp-shortcuts-card"}),s=p("div",{class:"sp-shortcuts-title"});s.appendChild(y(bn));let o=p("span");h(o,this.i18n["shortcuts.title"]),s.appendChild(o),t.appendChild(s);let i=document.createElement("button");i.className="sp-shortcuts-close",i.setAttribute("aria-label",this.i18n["shortcuts.close"]),i.appendChild(y(mn)),i.addEventListener("click",()=>this.hideHelp()),t.appendChild(i);let r=p("div",{class:"sp-shortcuts-grid"});for(let a of gn){let l=p("div",{class:"sp-shortcuts-row"}),d=p("div",{class:"sp-shortcuts-keys"});a.keys.forEach((u,b)=>{if(b>0){let x=p("span",{class:"sp-shortcuts-separator"});h(x,"/"),d.appendChild(x)}let f=p("span",{class:"sp-kbd"});h(f,u),d.appendChild(f)});let c=p("span",{class:"sp-shortcuts-desc"});h(c,this.i18n[a.label]),l.appendChild(d),l.appendChild(c),r.appendChild(l)}return t.appendChild(r),e.appendChild(t),e}buildHintButton(){let e=document.createElement("button");return e.className="sp-shortcuts-hint",e.setAttribute("aria-label",this.i18n["shortcuts.hint"]),h(e,"?"),e.addEventListener("click",t=>{t.stopPropagation(),this.toggleHelp()}),e}};var Ce=class{constructor(e,t,s,o,i,r,a,l,d){this.colors=t;this.bus=s;this.client=o;this.projectName=i;this.markers=r;this.t=a;this.locale=l;this.shadowRoot=e,this.bulkI18n=l==="fr"?Ke:ze,this.getScope=d?.getScope??(()=>({url:window.location.pathname,urlPattern:null})),this.scopeAnnotationsByUrl=d?.scopeAnnotationsByUrl??!0,this.root=p("div",{class:"sp-panel"}),this.root.setAttribute("role","complementary"),this.root.setAttribute("aria-label",this.t("panel.ariaLabel")),this.root.setAttribute("aria-hidden","true");let c=p("div",{class:"sp-panel-header"}),u=p("span",{class:"sp-panel-title"});h(u,this.t("panel.title")),this.closeBtn=document.createElement("button"),this.closeBtn.className="sp-panel-close",this.closeBtn.setAttribute("aria-label",this.t("panel.close")),this.closeBtn.appendChild(y(te)),this.closeBtn.addEventListener("click",()=>this.close()),this.deleteAllBtn=document.createElement("button"),this.deleteAllBtn.className="sp-btn-delete-all",this.deleteAllBtn.setAttribute("aria-label",this.t("panel.deleteAll")),this.deleteAllBtn.appendChild(y(Ne));let b=document.createElement("span");h(b,` ${this.t("panel.deleteAll")}`),this.deleteAllBtn.appendChild(b),this.deleteAllBtn.addEventListener("click",()=>this.confirmDeleteAll()),this.exportBtn=new me(t,()=>this.feedbacks),l==="fr"&&this.exportBtn.setLabels(qt);let f=p("div",{class:"sp-panel-header-right"});f.appendChild(this.exportBtn.element),f.appendChild(this.deleteAllBtn),f.appendChild(this.closeBtn),c.appendChild(u),c.appendChild(f),this.stats=new ke(t,l);let x=p("div",{class:"sp-filters"}),w=p("div",{class:"sp-search-wrap"}),C=y(mt);C.setAttribute("class","sp-search-icon"),this.searchInput=document.createElement("input"),this.searchInput.type="text",this.searchInput.className="sp-search",this.searchInput.placeholder=this.t("panel.search"),this.searchInput.setAttribute("aria-label",this.t("panel.searchAria")),this.searchInput.addEventListener("input",()=>{this.searchTimeout&&clearTimeout(this.searchTimeout),this.searchTimeout=setTimeout(()=>this.loadFeedbacks().catch(()=>{}),200)}),w.appendChild(C),w.appendChild(this.searchInput);let E=p("div",{class:"sp-filter-bar"});E.appendChild(this.buildTypeDropdown()),E.appendChild(this.buildStatusSegmented()),E.appendChild(this.buildScopeSegmented()),this.sortControls=new xe(t,()=>this.renderList(),l),x.appendChild(w),x.appendChild(E),x.appendChild(this.sortControls.element),this.listContainer=p("div",{class:"sp-list"}),this.listContainer.setAttribute("role","list"),this.listContainer.setAttribute("aria-label",this.t("panel.feedbackList")),this.bulk=new ve(t,{onResolve:m=>this.bulkResolve(m),onDelete:m=>this.bulkDelete(m)},l),this.bulk.setListContainer(this.listContainer),this.detail=new ye(t,{onBack:()=>this.detail.hide(),onResolve:async m=>{let v=m.status!=="resolved";await this.client.resolveFeedback(m.id,v),await this.loadFeedbacks(),this.detail.hide()},onDelete:async m=>{await this.client.deleteFeedback(m.id),this.bus.emit("feedback:deleted",m.id),await this.loadFeedbacks(),this.detail.hide()},onGoToAnnotation:m=>{if(m.annotations.length>0){let v=m.annotations[0];if(!v)return;window.scrollTo({left:v.scrollX,top:v.scrollY,behavior:"smooth"}),this.markers.pinHighlight(m)}}},l);let B=l==="fr"?as:We;this.shortcuts=new we(t,{onNavigate:m=>{let v=Xe(this.listContainer);ls(this.listContainer,m==="down"?v+1:v-1)},onResolve:()=>{let m=this.getFocusedFeedback();if(m&&!this.pendingMutations.has(m.id)){let k=this.listContainer.querySelector(`[data-feedback-id="${CSS.escape(m.id)}"]`)?.querySelector('[data-action="resolve"]');k&&this.toggleResolve(m,k).catch(()=>{})}},onDelete:()=>{let m=this.getFocusedFeedback();if(m&&!this.pendingMutations.has(m.id)){let k=this.listContainer.querySelector(`[data-feedback-id="${CSS.escape(m.id)}"]`)?.querySelector('[data-action="delete"]');k&&this.deleteFeedback(m,k).catch(()=>{})}},onFocusSearch:()=>this.searchInput.focus(),onToggleSelect:()=>{let m=this.getFocusedFeedback();m&&this.bulk.toggle(m.id)}},B),this.root.appendChild(c),this.root.appendChild(this.stats.element),this.root.appendChild(x),this.root.appendChild(this.listContainer),this.root.appendChild(this.bulk.barElement),this.root.appendChild(this.detail.element),this.root.appendChild(this.shortcuts.helpOverlay),this.root.appendChild(this.shortcuts.hintButton),e.appendChild(this.root),this.onListClick=m=>{let v=m.target;if(v.closest(".sp-bulk-checkbox"))return;let k=v.closest("[data-action]");if(k){m.stopPropagation();let T=k.closest(".sp-card");if(!T)return;let A=T.dataset.feedbackId,g=this.feedbacks.find(L=>L.id===A);if(!g)return;let M=k.dataset.action;if(M==="expand"){let L=T.querySelector(".sp-card-message");if(!L)return;let N=L.classList.toggle("sp-card-message--expanded");h(k,N?this.t("panel.showLess"):this.t("panel.showMore")),k.setAttribute("aria-expanded",String(N))}else if(M==="resolve"){if(this.pendingMutations.has(g.id))return;let L=k;this.toggleResolve(g,L).catch(()=>{})}else if(M==="delete"){if(this.pendingMutations.has(g.id))return;let L=k;this.deleteFeedback(g,L).catch(()=>{})}return}let S=v.closest(".sp-card");if(S){let T=S.dataset.feedbackId,A=this.feedbacks.find(g=>g.id===T);if(A){let g=this.feedbacks.indexOf(A)+1;this.detail.show(A,g)}}},this.listContainer.addEventListener("click",this.onListClick),this.onListKeydown=m=>{let v=m;if(v.key!=="Enter"&&v.key!==" ")return;let k=v.target,S=k.closest(".sp-card");if(!S||k!==S)return;v.preventDefault();let T=S.dataset.feedbackId,A=this.feedbacks.find(g=>g.id===T);if(A){let g=this.feedbacks.indexOf(A)+1;this.detail.show(A,g)}},this.listContainer.addEventListener("keydown",this.onListKeydown),this.onListMouseover=m=>{let k=m.target.closest(".sp-card");if(!k)return;let S=k.dataset.feedbackId;S&&this.markers.highlight(S)},this.listContainer.addEventListener("mouseover",this.onListMouseover),this.onListMouseout=m=>{let v=m.relatedTarget;v&&this.listContainer.contains(v)||this.markers.highlight("")},this.listContainer.addEventListener("mouseout",this.onListMouseout),this.bus.on("panel:toggle",m=>{m?this.open():this.close()}),e.addEventListener("keydown",m=>{let v=m;if(v.key==="Escape"&&this.isOpen){if(this.detail.isVisible){this.detail.hide();return}this.close();return}if(v.key==="Tab"&&this.isOpen){let k=this.root.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');if(k.length===0)return;let S=k[0],T=k[k.length-1];if(!S||!T)return;let A=e.activeElement;v.shiftKey&&A===S?(v.preventDefault(),T.focus()):!v.shiftKey&&A===T&&(v.preventDefault(),S.focus())}}),this.onMarkerClick=(m=>{this.scrollToFeedback(m.detail.feedbackId)}),document.addEventListener("sp-marker-click",this.onMarkerClick)}colors;bus;client;projectName;markers;t;locale;root;listContainer;searchInput;closeBtn;deleteAllBtn;activeFilters=new Set(["all"]);activeStatusFilter="all";typeDropdownBtn;typeDropdownContainer;typeDropdownMenu=null;typeDropdownOutsideHandler=null;statusSegmented;typeOptions;statusOptions;feedbacks=[];currentPage=1;totalFeedbacks=0;isLoadingMore=!1;isOpen=!1;searchTimeout=null;loadController=null;pendingMutations=new Set;stats;sortControls;bulk;exportBtn;shortcuts;detail;shadowRoot;bulkI18n;getScope;scopeAnnotationsByUrl;activeScopeFilter="this";scopeSegmented;scopeOptions;onMarkerClick;onListClick;onListKeydown;onListMouseover;onListMouseout;async open(){this.isOpen||(this.isOpen=!0,this.root.classList.add("sp-panel--open"),this.root.setAttribute("aria-hidden","false"),this.bus.emit("open"),this.shortcuts.enable(this.shadowRoot),await this.loadFeedbacks(),requestAnimationFrame(()=>{this.searchInput?this.searchInput.focus():this.closeBtn.focus()}))}close(){if(!this.isOpen)return;this.isOpen=!1,this.root.classList.remove("sp-panel--open"),this.root.setAttribute("aria-hidden","true"),this.bus.emit("close"),this.shortcuts.disable(),this.detail.hide(),this.root.getRootNode().querySelector(".sp-fab")?.focus()}showLoading(){this.listContainer.replaceChildren();let e=p("div",{class:"sp-loading"});e.setAttribute("role","status"),e.setAttribute("aria-live","polite"),e.setAttribute("aria-label",this.t("panel.loading"));let t=p("div",{class:"sp-spinner"});e.appendChild(t),this.listContainer.appendChild(e)}showError(){this.listContainer.replaceChildren();let e=p("div",{class:"sp-empty"});e.setAttribute("role","status"),e.setAttribute("aria-live","polite");let t=p("div",{class:"sp-empty-text"});h(t,this.t("panel.loadError"));let s=document.createElement("button");s.className="sp-btn-ghost",s.style.marginTop="8px",h(s,this.t("panel.retry")),s.addEventListener("click",()=>this.loadFeedbacks().catch(()=>{})),e.appendChild(t),e.appendChild(s),this.listContainer.appendChild(e)}async loadFeedbacks(){this.loadController?.abort(),this.loadController=new AbortController;let{signal:e}=this.loadController;this.currentPage=1;let t=this.searchInput.value.trim()||void 0,s=this.activeFilters.has("all")?void 0:Array.from(this.activeFilters)[0],o=this.activeStatusFilter==="all"?void 0:this.activeStatusFilter,i=this.getScope();this.syncScopeAvailability();let r={page:1,limit:20};s&&(r.type=s),o&&(r.status=o),t&&(r.search=t),this.activeScopeFilter==="this"?r.url=i.url:this.activeScopeFilter==="template"&&i.urlPattern&&(r.urlPattern=i.urlPattern);let a=this.feedbacks.length>0;a||this.showLoading();try{let{feedbacks:l,total:d}=await this.client.getFeedbacks(this.projectName,r);if(e.aborted)return;this.feedbacks=l,this.totalFeedbacks=d,this.stats.update(l,d),this.bulk.reset(),this.renderList();let c=this.scopeAnnotationsByUrl?l.filter(u=>u.url===i.url):l;this.markers.render(c)}catch(l){if(e.aborted)return;a||this.showError(),this.bus.emit("feedback:error",l instanceof Error?l:new Error(String(l)))}}async loadMoreFeedbacks(){if(this.isLoadingMore)return;this.isLoadingMore=!0;let e=this.loadController,t=this.currentPage+1,s=this.searchInput.value.trim()||void 0,o=this.activeFilters.has("all")?void 0:Array.from(this.activeFilters)[0],i=this.activeStatusFilter==="all"?void 0:this.activeStatusFilter,r=this.getScope(),a={page:t,limit:20};o&&(a.type=o),i&&(a.status=i),s&&(a.search=s),this.activeScopeFilter==="this"?a.url=r.url:this.activeScopeFilter==="template"&&r.urlPattern&&(a.urlPattern=r.urlPattern);let l=this.listContainer.querySelector(".sp-btn-load-more"),d;l&&(d=this.setButtonLoading(l));try{let{feedbacks:c,total:u}=await this.client.getFeedbacks(this.projectName,a);if(e!==this.loadController)return;this.currentPage=t,this.totalFeedbacks=u,this.feedbacks=[...this.feedbacks,...c],this.stats.update(this.feedbacks,u),this.renderList();let b=this.scopeAnnotationsByUrl?this.feedbacks.filter(f=>f.url===r.url):this.feedbacks;this.markers.render(b)}catch(c){d&&d(),this.bus.emit("feedback:error",c instanceof Error?c:new Error(String(c)))}finally{this.isLoadingMore=!1}}renderList(){if(this.listContainer.replaceChildren(),this.feedbacks.length===0){let i=p("div",{class:"sp-empty"});i.setAttribute("role","status"),i.setAttribute("aria-live","polite");let r=p("div",{class:"sp-empty-text"});h(r,this.t("panel.empty")),i.appendChild(r),this.listContainer.appendChild(i);return}let e=ss(this.feedbacks,this.sortControls.sortMode),t=e.map(i=>i.id),s=this.bulk.createSelectAllBar(t,this.bulkI18n["bulk.selectAll"]);if(this.listContainer.appendChild(s),this.sortControls.groupByPage){let i=ns(e),r=0;for(let[a,l]of i){let d=os(a,l.length,this.colors);this.listContainer.appendChild(d);let c=p("div",{class:"sp-group-content"});for(let u of l){let b=this.createCard(u,r+1);b.style.setProperty("--sp-card-i",String(r)),c.appendChild(b),r++}this.listContainer.appendChild(c)}}else e.forEach((i,r)=>{let a=this.createCard(i,r+1);a.style.setProperty("--sp-card-i",String(r)),this.listContainer.appendChild(a)});let o=this.totalFeedbacks-this.feedbacks.length;if(o>0){let i=p("div",{class:"sp-load-more-wrap"}),r=document.createElement("button");r.className="sp-btn-ghost sp-btn-load-more",h(r,this.t("panel.loadMore").replace("{remaining}",String(o))),r.addEventListener("click",()=>this.loadMoreFeedbacks().catch(()=>{})),i.appendChild(r),this.listContainer.appendChild(i)}}createCard(e,t){let s=e.status==="resolved",o=F(e.type,this.colors),i=p("div",{class:`sp-card ${s?"sp-card--resolved":""}`});i.setAttribute("role","listitem"),i.setAttribute("tabindex","0"),i.setAttribute("aria-label",`Feedback #${t}: ${O(e.type,this.t)} \u2014 ${e.message.slice(0,80)}`),i.dataset.feedbackId=e.id;let r=p("div",{class:"sp-card-bar"});r.style.background=s?"#9ca3af":o;let a=p("div",{class:"sp-card-body"}),l=p("div",{class:"sp-card-header"}),d=this.bulk.createCheckbox(e.id);l.appendChild(d);let c=p("span",{class:"sp-card-number"});h(c,`#${t}`);let u=p("span",{class:"sp-badge"}),b=P(e.type,this.colors);u.style.background=b,u.style.color=o,h(u,O(e.type,this.t));let f=p("span",{class:"sp-card-date"});h(f,ee(e.createdAt,this.locale)),l.appendChild(c),l.appendChild(u),l.appendChild(f);let x=p("div",{class:"sp-card-message"});h(x,e.message);let w=document.createElement("button");w.className="sp-card-expand",w.dataset.action="expand",h(w,this.t("panel.showMore")),w.style.display="none",w.setAttribute("aria-expanded","false"),requestAnimationFrame(()=>{x.scrollHeight>x.clientHeight&&(w.style.display="block")});let C=p("div",{class:"sp-card-footer"}),E=document.createElement("button");if(E.className="sp-btn-resolve",E.dataset.action="resolve",s){E.appendChild(y(yt));let v=document.createElement("span");h(v,` ${this.t("panel.reopen")}`),E.appendChild(v)}else{E.appendChild(y(se));let v=document.createElement("span");h(v,` ${this.t("panel.resolve")}`),E.appendChild(v)}let B=document.createElement("button");B.className="sp-btn-delete",B.dataset.action="delete",B.appendChild(y(Ne));let m=document.createElement("span");return h(m,` ${this.t("panel.delete")}`),B.appendChild(m),C.appendChild(E),C.appendChild(B),a.appendChild(l),a.appendChild(x),a.appendChild(w),a.appendChild(C),i.appendChild(r),i.appendChild(a),i}async bulkResolve(e){try{await Promise.all(e.map(t=>this.client.resolveFeedback(t,!0))),await this.loadFeedbacks()}catch(t){throw this.bus.emit("feedback:error",t instanceof Error?t:new Error(String(t))),t}}async bulkDelete(e){try{await Promise.all(e.map(t=>this.client.deleteFeedback(t)));for(let t of e)this.bus.emit("feedback:deleted",t);await this.loadFeedbacks()}catch(t){throw this.bus.emit("feedback:error",t instanceof Error?t:new Error(String(t))),t}}async confirmDeleteAll(){if(await this.showConfirmDialog(this.t("panel.deleteAllConfirmTitle"),this.t("panel.deleteAllConfirmMessage"))){this.deleteAllBtn.disabled=!0;try{await this.client.deleteAllFeedbacks(this.projectName),this.bus.emit("feedback:all-deleted"),await this.loadFeedbacks()}catch(t){this.bus.emit("feedback:error",t instanceof Error?t:new Error(String(t)))}finally{this.deleteAllBtn.disabled=!1}}}showConfirmDialog(e,t){return new Promise(s=>{let o=p("div",{class:"sp-confirm-backdrop"}),i=`sp-confirm-title-${Date.now()}`,r=`sp-confirm-msg-${Date.now()}`,a=p("div",{class:"sp-confirm-dialog"});a.setAttribute("role","alertdialog"),a.setAttribute("aria-modal","true"),a.setAttribute("aria-labelledby",i),a.setAttribute("aria-describedby",r);let l=p("div",{class:"sp-confirm-title"});l.id=i,h(l,e);let d=p("div",{class:"sp-confirm-message"});d.id=r,h(d,t);let c=p("div",{class:"sp-confirm-actions"}),u=document.createElement("button");u.type="button",u.className="sp-btn-ghost",h(u,this.t("panel.cancel"));let b=document.createElement("button");b.type="button",b.className="sp-btn-danger",h(b,this.t("panel.confirmDelete"));let f=!1,x=C=>{f||(f=!0,o.removeEventListener("keydown",w),o.style.opacity="0",a.style.transform="translateY(8px) scale(0.97)",setTimeout(()=>{o.remove(),s(C)},200))},w=C=>{let E=C;if(E.key==="Escape"){x(!1);return}E.key==="Tab"&&(E.preventDefault(),o.getRootNode().activeElement===u?b.focus():u.focus())};o.addEventListener("keydown",w),u.addEventListener("click",()=>x(!1)),b.addEventListener("click",()=>x(!0)),o.addEventListener("click",C=>{C.target===o&&x(!1)}),c.appendChild(u),c.appendChild(b),a.appendChild(l),a.appendChild(d),a.appendChild(c),o.appendChild(a),this.root.getRootNode()instanceof ShadowRoot?this.root.getRootNode().appendChild(o):this.root.appendChild(o),requestAnimationFrame(()=>{o.style.opacity="1",a.style.transform="translateY(0) scale(1)",u.focus()})})}setButtonLoading(e){let t=Array.from(e.childNodes).map(s=>s.cloneNode(!0));return e.disabled=!0,e.replaceChildren(p("div",{class:"sp-spinner sp-spinner--sm"})),()=>{e.replaceChildren(...t),e.disabled=!1}}async deleteFeedback(e,t){this.pendingMutations.add(e.id);let s=this.setButtonLoading(t);try{await this.client.deleteFeedback(e.id),this.bus.emit("feedback:deleted",e.id),await this.loadFeedbacks()}catch(o){s(),this.bus.emit("feedback:error",o instanceof Error?o:new Error(String(o)))}finally{this.pendingMutations.delete(e.id)}}async toggleResolve(e,t){this.pendingMutations.add(e.id);let s=this.setButtonLoading(t);try{let o=e.status!=="resolved";await this.client.resolveFeedback(e.id,o),await this.loadFeedbacks()}catch(o){s(),this.bus.emit("feedback:error",o instanceof Error?o:new Error(String(o)))}finally{this.pendingMutations.delete(e.id)}}buildTypeDropdown(){return this.typeOptions=[{value:"all",label:this.t("panel.filterAll"),icon:Oe,color:this.colors.accent,bg:this.colors.accentLight},{value:"question",label:this.t("type.question"),icon:ne,color:this.colors.typeQuestion,bg:this.colors.typeQuestionBg},{value:"change",label:this.t("type.change"),icon:oe,color:this.colors.typeChange,bg:this.colors.typeChangeBg},{value:"bug",label:this.t("type.bug"),icon:ie,color:this.colors.typeBug,bg:this.colors.typeBugBg},{value:"other",label:this.t("type.other"),icon:re,color:this.colors.typeOther,bg:this.colors.typeOtherBg}],this.typeDropdownContainer=p("div",{class:"sp-filter-dropdown"}),this.typeDropdownBtn=document.createElement("button"),this.typeDropdownBtn.type="button",this.typeDropdownBtn.className="sp-filter-dropdown-btn",this.typeDropdownBtn.setAttribute("aria-haspopup","listbox"),this.typeDropdownBtn.setAttribute("aria-expanded","false"),this.renderTypeDropdownTrigger(),this.typeDropdownBtn.addEventListener("click",e=>{e.stopPropagation(),this.typeDropdownMenu?this.closeTypeDropdown():this.openTypeDropdown()}),this.typeDropdownContainer.appendChild(this.typeDropdownBtn),this.typeDropdownContainer}renderTypeDropdownTrigger(){let e=this.typeOptions.find(a=>this.activeFilters.has(a.value))??this.typeOptions[0];if(!e)return;this.typeDropdownBtn.replaceChildren(),this.typeDropdownBtn.style.setProperty("--sp-chip-color",e.color),this.typeDropdownBtn.style.setProperty("--sp-chip-bg",e.bg),this.typeDropdownBtn.dataset.filter=e.value,this.typeDropdownBtn.classList.toggle("sp-filter-dropdown-btn--filtered",e.value!=="all"),this.typeDropdownBtn.setAttribute("aria-label",`${this.t("type.label")}: ${e.label}`);let t=p("span",{class:"sp-filter-dropdown-btn__icon"});t.appendChild(y(e.icon)),this.typeDropdownBtn.appendChild(t);let s=p("span",{class:"sp-filter-dropdown-btn__label"}),o=p("span",{class:"sp-filter-dropdown-btn__prefix"});h(o,this.t("type.label"));let i=p("span",{class:"sp-filter-dropdown-btn__value"});h(i,e.label),s.appendChild(o),s.appendChild(i),this.typeDropdownBtn.appendChild(s);let r=p("span",{class:"sp-filter-dropdown-btn__chevron"});r.appendChild(y(vt)),this.typeDropdownBtn.appendChild(r)}openTypeDropdown(){this.typeDropdownMenu=p("div",{class:"sp-filter-dropdown-menu"}),this.typeDropdownMenu.setAttribute("role","listbox"),this.typeDropdownMenu.setAttribute("aria-label",this.t("type.label")),this.typeDropdownBtn.setAttribute("aria-expanded","true");for(let e of this.typeOptions){let t=document.createElement("button");t.type="button";let s=this.activeFilters.has(e.value);t.className=`sp-filter-dropdown-option${s?" sp-filter-dropdown-option--active":""}`,t.style.setProperty("--sp-chip-color",e.color),t.style.setProperty("--sp-chip-bg",e.bg),t.dataset.filter=e.value,t.setAttribute("role","option"),t.setAttribute("aria-selected",String(s));let o=p("span",{class:"sp-filter-dropdown-option__icon"});o.appendChild(y(e.icon)),t.appendChild(o);let i=p("span",{class:"sp-filter-dropdown-option__label"});if(h(i,e.label),t.appendChild(i),s){let r=p("span",{class:"sp-filter-dropdown-option__check"});r.appendChild(y(se)),t.appendChild(r)}t.addEventListener("click",r=>{r.stopPropagation(),this.selectTypeFilter(e.value)}),this.typeDropdownMenu.appendChild(t)}this.typeDropdownContainer.appendChild(this.typeDropdownMenu),requestAnimationFrame(()=>{this.typeDropdownOutsideHandler=e=>{this.typeDropdownMenu&&!this.typeDropdownContainer.contains(e.target)&&this.closeTypeDropdown()},document.addEventListener("click",this.typeDropdownOutsideHandler,!0)}),this.typeDropdownMenu.addEventListener("keydown",e=>{e.key==="Escape"&&(this.closeTypeDropdown(),this.typeDropdownBtn.focus())})}closeTypeDropdown(){this.typeDropdownMenu&&(this.typeDropdownMenu.remove(),this.typeDropdownMenu=null),this.typeDropdownBtn.setAttribute("aria-expanded","false"),this.typeDropdownOutsideHandler&&(document.removeEventListener("click",this.typeDropdownOutsideHandler,!0),this.typeDropdownOutsideHandler=null)}selectTypeFilter(e){this.activeFilters.clear(),this.activeFilters.add(e),this.renderTypeDropdownTrigger(),this.closeTypeDropdown(),this.loadFeedbacks().catch(()=>{})}buildStatusSegmented(){this.statusOptions=[{value:"all",label:this.t("panel.statusAll"),icon:Oe,color:this.colors.accent,bg:this.colors.accentLight},{value:"open",label:this.t("panel.statusOpen"),icon:ft,color:this.colors.statusOpen,bg:this.colors.statusOpenBg},{value:"resolved",label:this.t("panel.statusResolved"),icon:se,color:this.colors.statusResolved,bg:this.colors.statusResolvedBg}],this.statusSegmented=p("div",{class:"sp-segmented",role:"radiogroup"}),this.statusSegmented.setAttribute("aria-label",this.t("status.label"));for(let e of this.statusOptions){let t=document.createElement("button");t.type="button",t.className=`sp-segmented__btn sp-segmented__btn--${e.value}`,t.dataset.statusFilter=e.value,t.setAttribute("role","radio");let s=this.activeStatusFilter===e.value;t.setAttribute("aria-checked",String(s)),t.tabIndex=s?0:-1,s&&t.classList.add("sp-segmented__btn--active"),t.style.setProperty("--sp-chip-color",e.color),t.style.setProperty("--sp-chip-bg",e.bg);let o=p("span",{class:"sp-segmented__icon"});o.appendChild(y(e.icon)),t.appendChild(o);let i=p("span",{class:"sp-segmented__label"});h(i,e.label),t.appendChild(i),t.addEventListener("click",()=>this.selectStatusFilter(e.value)),t.addEventListener("keydown",r=>this.handleSegmentedKey(r,e.value)),this.statusSegmented.appendChild(t)}return this.statusSegmented}handleSegmentedKey(e,t){let s=this.statusOptions.map(l=>l.value),o=s.indexOf(t),i;switch(e.key){case"ArrowLeft":i=(o-1+s.length)%s.length;break;case"ArrowRight":i=(o+1)%s.length;break;case"Home":i=0;break;case"End":i=s.length-1;break;default:return}e.preventDefault();let r=s[i];if(!r)return;this.selectStatusFilter(r),this.statusSegmented.querySelector(`[data-status-filter="${r}"]`)?.focus()}selectStatusFilter(e){this.activeStatusFilter=e;let t=this.statusSegmented.querySelectorAll(".sp-segmented__btn");for(let s of t){let o=s.dataset.statusFilter===e;s.classList.toggle("sp-segmented__btn--active",o),s.setAttribute("aria-checked",String(o)),s.tabIndex=o?0:-1}this.loadFeedbacks().catch(()=>{})}buildScopeSegmented(){this.scopeOptions=[{value:"this",label:this.t("scope.thisPage")},{value:"template",label:this.t("scope.thisType")},{value:"all",label:this.t("scope.all")}],this.scopeSegmented=p("div",{class:"sp-segmented sp-segmented--scope",role:"radiogroup"}),this.scopeSegmented.setAttribute("aria-label",this.t("scope.label"));for(let e of this.scopeOptions){let t=document.createElement("button");t.type="button",t.className=`sp-segmented__btn sp-segmented__btn--scope-${e.value}`,t.dataset.scopeFilter=e.value,t.setAttribute("role","radio");let s=this.activeScopeFilter===e.value;t.setAttribute("aria-checked",String(s)),t.tabIndex=s?0:-1,s&&t.classList.add("sp-segmented__btn--active");let o=p("span",{class:"sp-segmented__label"});h(o,e.label),t.appendChild(o),t.addEventListener("click",()=>this.selectScopeFilter(e.value)),t.addEventListener("keydown",i=>this.handleScopeKey(i,e.value)),this.scopeSegmented.appendChild(t)}return this.syncScopeAvailability(),this.scopeSegmented}handleScopeKey(e,t){let s=this.scopeOptions.map(l=>l.value).filter(l=>{let d=this.scopeSegmented.querySelector(`[data-scope-filter="${l}"]`);return d&&d.style.display!=="none"}),o=s.indexOf(t);if(o<0)return;let i;switch(e.key){case"ArrowLeft":i=(o-1+s.length)%s.length;break;case"ArrowRight":i=(o+1)%s.length;break;case"Home":i=0;break;case"End":i=s.length-1;break;default:return}e.preventDefault();let r=s[i];if(!r)return;this.selectScopeFilter(r),this.scopeSegmented.querySelector(`[data-scope-filter="${r}"]`)?.focus()}selectScopeFilter(e){this.activeScopeFilter=e;let t=this.scopeSegmented.querySelectorAll(".sp-segmented__btn");for(let s of t){let o=s.dataset.scopeFilter===e;s.classList.toggle("sp-segmented__btn--active",o),s.setAttribute("aria-checked",String(o)),s.tabIndex=o?0:-1}this.loadFeedbacks().catch(()=>{})}syncScopeAvailability(){if(!this.scopeSegmented)return;let e=this.getScope(),t=this.scopeSegmented.querySelector('[data-scope-filter="template"]');if(!t)return;let s=!!e.urlPattern;t.style.display=s?"":"none",!s&&this.activeScopeFilter==="template"&&(this.activeScopeFilter="this",this.selectScopeFilter("this"))}getFocusedFeedback(){let e=Xe(this.listContainer);if(e<0)return;let t=this.listContainer.querySelectorAll(".sp-card")[e];if(t)return this.feedbacks.find(s=>s.id===t.dataset.feedbackId)}scrollToFeedback(e){let t=CSS.escape(e),s=this.listContainer.querySelector(`[data-feedback-id="${t}"]`);s&&(s.scrollIntoView({behavior:"smooth",block:"center"}),s.classList.add("sp-anim-flash"),s.addEventListener("animationend",()=>{s.classList.remove("sp-anim-flash")},{once:!0}))}async refresh(){this.isOpen&&await this.loadFeedbacks()}get isCurrentlyOpen(){return this.isOpen}destroy(){this.loadController?.abort(),this.searchTimeout&&clearTimeout(this.searchTimeout),this.listContainer.removeEventListener("click",this.onListClick),this.listContainer.removeEventListener("keydown",this.onListKeydown),this.listContainer.removeEventListener("mouseover",this.onListMouseover),this.listContainer.removeEventListener("mouseout",this.onListMouseout),document.removeEventListener("sp-marker-click",this.onMarkerClick),this.closeTypeDropdown(),this.sortControls.destroy(),this.bulk.destroy(),this.exportBtn.destroy(),this.shortcuts.destroy(),this.detail.destroy(),this.root.remove()}};function Ge(n){return{cssSelector:n.anchor.cssSelector,xpath:n.anchor.xpath,textSnippet:n.anchor.textSnippet,elementTag:n.anchor.elementTag,elementId:n.anchor.elementId,textPrefix:n.anchor.textPrefix,textSuffix:n.anchor.textSuffix,fingerprint:n.anchor.fingerprint,neighborText:n.anchor.neighborText,anchorKey:n.anchor.anchorKey??null,xPct:n.rect.xPct,yPct:n.rect.yPct,wPct:n.rect.wPct,hPct:n.rect.hPct,scrollX:n.scrollX,scrollY:n.scrollY,viewportW:n.viewportW,viewportH:n.viewportH,devicePixelRatio:n.devicePixelRatio}}var Ee=class{constructor(e,t){this.store=e;this.projectName=t}store;projectName;async sendFeedback(e){let t=await this.store.createFeedback({projectName:e.projectName,type:e.type,message:e.message,status:"open",url:e.url,urlPattern:e.urlPattern??null,viewport:e.viewport,userAgent:e.userAgent,authorName:e.authorName,authorEmail:e.authorEmail,clientId:e.clientId,annotations:e.annotations.map(Ge),screenshotDataUrl:e.screenshotDataUrl??null});return Ve(t)}async getFeedbacks(e,t){let{feedbacks:s,total:o}=await this.store.getFeedbacks({projectName:e,page:t?.page,limit:t?.limit,type:t?.type,status:t?.status,search:t?.search,url:t?.url,urlPattern:t?.urlPattern});return{feedbacks:s.map(Ve),total:o}}async resolveFeedback(e,t){let s=await this.store.updateFeedback(e,{status:t?"resolved":"open",resolvedAt:t?new Date:null});return Ve(s)}async deleteFeedback(e){await this.store.deleteFeedback(e)}async deleteAllFeedbacks(e){await this.store.deleteAllFeedbacks(e)}};function Ve(n){return{id:n.id,projectName:n.projectName,type:n.type,message:n.message,status:n.status,url:n.url,urlPattern:n.urlPattern??null,viewport:n.viewport,userAgent:n.userAgent,authorName:n.authorName,authorEmail:n.authorEmail,resolvedAt:n.resolvedAt?.toISOString()??null,createdAt:n.createdAt.toISOString(),updatedAt:n.updatedAt.toISOString(),annotations:n.annotations.map(fn),screenshotUrl:n.screenshotUrl??null}}function fn(n){return{id:n.id,feedbackId:n.feedbackId,cssSelector:n.cssSelector,xpath:n.xpath,textSnippet:n.textSnippet,elementTag:n.elementTag,elementId:n.elementId,textPrefix:n.textPrefix,textSuffix:n.textSuffix,fingerprint:n.fingerprint,neighborText:n.neighborText,anchorKey:n.anchorKey??null,xPct:n.xPct,yPct:n.yPct,wPct:n.wPct,hPct:n.hPct,scrollX:n.scrollX,scrollY:n.scrollY,viewportW:n.viewportW,viewportH:n.viewportH,devicePixelRatio:n.devicePixelRatio,createdAt:n.createdAt.toISOString()}}var vn="linear(0, 0.006, 0.025, 0.06, 0.11, 0.17, 0.25, 0.34, 0.45, 0.56, 0.67, 0.78, 0.88, 0.95, 1.01, 1.04, 1.05, 1.04, 1.02, 1, 0.99, 1)",Qe="cubic-bezier(0.16, 1, 0.3, 1)",Je="cubic-bezier(0.34, 1.56, 0.64, 1)",yn="cubic-bezier(0.25, 1, 0.5, 1)",ds=`
|
|
133
|
+
box-shadow:0 0 16px ${i}20;
|
|
134
|
+
transition:opacity ${Rt}ms ease;
|
|
135
|
+
`});this.container.appendChild(s),this.highlightElements.push(s),s.offsetHeight,s.style.opacity="1";}}pinHighlight(e){this.unpinHighlight(),this.showHighlight(e),this.pinnedFeedback=e,this.onDocumentClick=n=>{this.container.contains(n.target)||this.unpinHighlight();},document.addEventListener("click",this.onDocumentClick,{capture:true});}unpinHighlight(){this.onDocumentClick&&(document.removeEventListener("click",this.onDocumentClick,{capture:true}),this.onDocumentClick=null),this.pinnedFeedback=null,this.clearHighlight();}clearHighlight(){for(let e of this.highlightElements)e.style.opacity="0",setTimeout(()=>e.remove(),Rt);this.highlightElements=[];}removeHighlightElements(){for(let e of this.highlightElements)e.remove();this.highlightElements=[];}clear(){this.unpinHighlight(),this.container.replaceChildren(),this.entries=[],this.clusters=[],this.anchorCache.clear();}destroy(){this.unpinHighlight(),this.repositionTimer&&("cancelIdleCallback"in window&&window.cancelIdleCallback(this.repositionTimer),clearTimeout(this.repositionTimer)),this.resizeHandler&&window.removeEventListener("resize",this.resizeHandler),this.scrollHandler&&window.removeEventListener("scroll",this.scrollHandler,{capture:true}),this.onDocumentClickForClusters&&document.removeEventListener("click",this.onDocumentClickForClusters),this.mutationObserver?.disconnect(),this.container.remove();}};var be=class{constructor(e,n){this.store=e;this.projectName=n;}store;projectName;async sendFeedback(e){let n=await this.store.createFeedback({projectName:e.projectName,type:e.type,message:e.message,status:"open",url:e.url,urlPattern:e.urlPattern??null,viewport:e.viewport,userAgent:e.userAgent,authorName:e.authorName,authorEmail:e.authorEmail,clientId:e.clientId,annotations:e.annotations.map(Me),screenshotDataUrl:e.screenshotDataUrl??null});return Le(n)}async getFeedbacks(e,n){let{feedbacks:o,total:i}=await this.store.getFeedbacks({projectName:e,page:n?.page,limit:n?.limit,type:n?.type,status:n?.status,search:n?.search,url:n?.url,urlPattern:n?.urlPattern});return {feedbacks:o.map(Le),total:i}}async resolveFeedback(e,n){let o=await this.store.updateFeedback(e,{status:n?"resolved":"open",resolvedAt:n?new Date:null});return Le(o)}async deleteFeedback(e){await this.store.deleteFeedback(e);}async deleteAllFeedbacks(e){await this.store.deleteAllFeedbacks(e);}};function Le(t){return {id:t.id,projectName:t.projectName,type:t.type,message:t.message,status:t.status,url:t.url,urlPattern:t.urlPattern??null,viewport:t.viewport,userAgent:t.userAgent,authorName:t.authorName,authorEmail:t.authorEmail,resolvedAt:t.resolvedAt?.toISOString()??null,createdAt:t.createdAt.toISOString(),updatedAt:t.updatedAt.toISOString(),annotations:t.annotations.map(mn),screenshotUrl:t.screenshotUrl??null,diagnostics:t.diagnostics??null}}function mn(t){return {id:t.id,feedbackId:t.feedbackId,cssSelector:t.cssSelector,xpath:t.xpath,textSnippet:t.textSnippet,elementTag:t.elementTag,elementId:t.elementId,textPrefix:t.textPrefix,textSuffix:t.textSuffix,fingerprint:t.fingerprint,neighborText:t.neighborText,anchorKey:t.anchorKey??null,xPct:t.xPct,yPct:t.yPct,wPct:t.wPct,hPct:t.hPct,scrollX:t.scrollX,scrollY:t.scrollY,viewportW:t.viewportW,viewportH:t.viewportH,devicePixelRatio:t.devicePixelRatio,createdAt:t.createdAt.toISOString()}}var gn="linear(0, 0.006, 0.025, 0.06, 0.11, 0.17, 0.25, 0.34, 0.45, 0.56, 0.67, 0.78, 0.88, 0.95, 1.01, 1.04, 1.05, 1.04, 1.02, 1, 0.99, 1)",Ne="cubic-bezier(0.16, 1, 0.3, 1)",_e="cubic-bezier(0.34, 1.56, 0.64, 1)",bn="cubic-bezier(0.25, 1, 0.5, 1)",It=`
|
|
1710
136
|
/* ---- Keyframes ---- */
|
|
1711
137
|
|
|
1712
138
|
@keyframes sp-fab-in {
|
|
@@ -1780,11 +206,11 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
1780
206
|
/* ---- Animation classes ---- */
|
|
1781
207
|
|
|
1782
208
|
.sp-anim-fab-in {
|
|
1783
|
-
animation: sp-fab-in 0.5s ${
|
|
209
|
+
animation: sp-fab-in 0.5s ${gn} both;
|
|
1784
210
|
}
|
|
1785
211
|
|
|
1786
212
|
.sp-anim-marker-in {
|
|
1787
|
-
animation: sp-marker-in 0.35s ${
|
|
213
|
+
animation: sp-marker-in 0.35s ${_e} both;
|
|
1788
214
|
}
|
|
1789
215
|
|
|
1790
216
|
.sp-anim-pulse {
|
|
@@ -1792,11 +218,11 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
1792
218
|
}
|
|
1793
219
|
|
|
1794
220
|
.sp-anim-flash {
|
|
1795
|
-
animation: sp-flash-bg 0.5s ${
|
|
221
|
+
animation: sp-flash-bg 0.5s ${bn};
|
|
1796
222
|
}
|
|
1797
223
|
|
|
1798
224
|
.sp-anim-slide-up {
|
|
1799
|
-
animation: sp-slide-up 0.3s ${
|
|
225
|
+
animation: sp-slide-up 0.3s ${Ne} both;
|
|
1800
226
|
}
|
|
1801
227
|
|
|
1802
228
|
.sp-anim-fade-in {
|
|
@@ -1807,7 +233,7 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
1807
233
|
|
|
1808
234
|
.sp-panel {
|
|
1809
235
|
transform: translateX(110%);
|
|
1810
|
-
transition: transform 0.4s ${
|
|
236
|
+
transition: transform 0.4s ${Ne};
|
|
1811
237
|
}
|
|
1812
238
|
|
|
1813
239
|
.sp-panel.sp-panel--open {
|
|
@@ -1819,7 +245,7 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
1819
245
|
pointer-events: none;
|
|
1820
246
|
transform: translate(0, 0) scale(0.8);
|
|
1821
247
|
transition:
|
|
1822
|
-
transform 0.35s ${
|
|
248
|
+
transform 0.35s ${_e},
|
|
1823
249
|
opacity 0.2s ease,
|
|
1824
250
|
background 0.2s ease,
|
|
1825
251
|
border-color 0.2s ease,
|
|
@@ -1850,7 +276,7 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
1850
276
|
}
|
|
1851
277
|
|
|
1852
278
|
.sp-card {
|
|
1853
|
-
animation: sp-card-in 0.35s ${
|
|
279
|
+
animation: sp-card-in 0.35s ${Ne} both;
|
|
1854
280
|
animation-delay: calc(var(--sp-card-i, 0) * 40ms);
|
|
1855
281
|
}
|
|
1856
282
|
|
|
@@ -1878,7 +304,7 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
1878
304
|
}
|
|
1879
305
|
|
|
1880
306
|
.sp-fab-badge {
|
|
1881
|
-
animation: sp-badge-in 0.4s ${
|
|
307
|
+
animation: sp-badge-in 0.4s ${_e} both;
|
|
1882
308
|
}
|
|
1883
309
|
|
|
1884
310
|
/* ---- Reduced motion ---- */
|
|
@@ -1891,7 +317,7 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
1891
317
|
}
|
|
1892
318
|
}
|
|
1893
319
|
|
|
1894
|
-
`;function
|
|
320
|
+
`;function $e(t){return `
|
|
1895
321
|
:host {
|
|
1896
322
|
all: initial;
|
|
1897
323
|
position: fixed;
|
|
@@ -1902,11 +328,11 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
1902
328
|
color: var(--sp-text);
|
|
1903
329
|
-webkit-font-smoothing: antialiased;
|
|
1904
330
|
-moz-osx-font-smoothing: grayscale;
|
|
1905
|
-
${
|
|
331
|
+
${z(t)}
|
|
1906
332
|
|
|
1907
333
|
/* Identity modal \u2014 theme-aware backdrop + panel */
|
|
1908
|
-
--sp-identity-bg: ${
|
|
1909
|
-
--sp-identity-overlay: ${
|
|
334
|
+
--sp-identity-bg: ${t.glassBgHeavy};
|
|
335
|
+
--sp-identity-overlay: ${t.bg==="#ffffff"?"rgba(15, 23, 42, 0.2)":"rgba(0, 0, 0, 0.4)"};
|
|
1910
336
|
}
|
|
1911
337
|
|
|
1912
338
|
*, *::before, *::after {
|
|
@@ -1922,6 +348,9 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
1922
348
|
:focus-visible {
|
|
1923
349
|
outline: 2px solid var(--sp-accent);
|
|
1924
350
|
outline-offset: 2px;
|
|
351
|
+
/* Double-ring against any background colour: the bg-coloured halo
|
|
352
|
+
separates the accent ring from busy host-page surfaces. */
|
|
353
|
+
box-shadow: 0 0 0 4px var(--sp-bg);
|
|
1925
354
|
}
|
|
1926
355
|
|
|
1927
356
|
/* ============================
|
|
@@ -3057,14 +1486,14 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
3057
1486
|
}
|
|
3058
1487
|
}
|
|
3059
1488
|
|
|
3060
|
-
${
|
|
3061
|
-
${
|
|
3062
|
-
${
|
|
3063
|
-
${
|
|
3064
|
-
${
|
|
3065
|
-
${
|
|
3066
|
-
${
|
|
3067
|
-
`}var
|
|
1489
|
+
${It}
|
|
1490
|
+
${O$1}
|
|
1491
|
+
${N}
|
|
1492
|
+
${F}
|
|
1493
|
+
${D}
|
|
1494
|
+
${S}
|
|
1495
|
+
${H$1}
|
|
1496
|
+
`}var yn=120,xn=80,ye=class{constructor(e,n="en"){this.colors=e;this.locale=n;this.root=b("div",{style:`
|
|
3068
1497
|
position: fixed;
|
|
3069
1498
|
z-index: ${2147483647};
|
|
3070
1499
|
max-width: 280px;
|
|
@@ -3082,7 +1511,7 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
3082
1511
|
transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
|
|
3083
1512
|
visibility: hidden;
|
|
3084
1513
|
-webkit-font-smoothing: antialiased;
|
|
3085
|
-
`}),this.root.setAttribute("role","tooltip"),this.root.id=this.tooltipId,this.arrow=
|
|
1514
|
+
`}),this.root.setAttribute("role","tooltip"),this.root.id=this.tooltipId,this.arrow=b("div",{style:`
|
|
3086
1515
|
position: absolute;
|
|
3087
1516
|
width: 12px;
|
|
3088
1517
|
height: 12px;
|
|
@@ -3090,12 +1519,12 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
3090
1519
|
border: 1px solid ${this.colors.glassBorder};
|
|
3091
1520
|
transform: rotate(45deg);
|
|
3092
1521
|
pointer-events: none;
|
|
3093
|
-
`}),this.root.appendChild(this.arrow),this.root.addEventListener("mouseenter",()=>this.cancelHide()),this.root.addEventListener("mouseleave",()=>this.scheduleHide()),document.body.appendChild(this.root)}colors;locale;root;arrow;showTimer=null;hideTimer=null;currentFeedbackId=null;tooltipId="sp-tooltip";show(e,
|
|
1522
|
+
`}),this.root.appendChild(this.arrow),this.root.addEventListener("mouseenter",()=>this.cancelHide()),this.root.addEventListener("mouseleave",()=>this.scheduleHide()),document.body.appendChild(this.root);}colors;locale;root;arrow;showTimer=null;hideTimer=null;currentFeedbackId=null;tooltipId="sp-tooltip";show(e,n){this.currentFeedbackId!==e.id&&(this.cancelHide(),this.cancelShow(),this.showTimer=setTimeout(()=>{this.currentFeedbackId=e.id,this.render(e),this.position(n);let o=typeof window<"u"&&window.matchMedia("(prefers-reduced-motion: reduce)").matches;this.root.style.transition=o?"none":"",this.root.style.visibility="visible",this.root.style.opacity="1",this.root.style.transform="translateY(0) scale(1)";},yn));}scheduleHide(){this.cancelHide(),this.hideTimer=setTimeout(()=>this.hide(),xn);}hide(){this.cancelShow(),this.currentFeedbackId=null,this.root.style.opacity="0",this.root.style.transform="translateY(6px) scale(0.97)",setTimeout(()=>{this.currentFeedbackId||(this.root.style.visibility="hidden");},200);}cancelShow(){this.showTimer&&(clearTimeout(this.showTimer),this.showTimer=null);}cancelHide(){this.hideTimer&&(clearTimeout(this.hideTimer),this.hideTimer=null);}render(e$1){let n=Array.from(this.root.children);for(let d of n)d!==this.arrow&&d.remove();let o=x(e$1.type,this.colors),i=y(e$1.type,this.colors),r=B(this.locale),s=C(e$1.type,r),a=b("div",{style:"display:flex;align-items:center;gap:8px;margin-bottom:8px;"}),c$1=b("span",{style:`
|
|
3094
1523
|
padding:3px 10px;border-radius:9999px;
|
|
3095
1524
|
font-size:11px;font-weight:600;
|
|
3096
|
-
color:${
|
|
1525
|
+
color:${o};background:${i};
|
|
3097
1526
|
letter-spacing:0.02em;
|
|
3098
|
-
`});
|
|
1527
|
+
`});c(c$1,s);let p=b("span",{style:`font-size:11px;color:${this.colors.textSecondary};margin-left:auto;`});c(p,e(e$1.createdAt,this.locale)),a.appendChild(c$1),a.appendChild(p);let l=b("div",{style:`font-size:13px;line-height:1.55;color:${this.colors.text};display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;`});c(l,e$1.message),this.root.insertBefore(a,this.arrow),this.root.insertBefore(l,this.arrow);}position(e){let n=this.root.getBoundingClientRect(),o=10,i=e.top-n.height-o,r=e.left+e.width/2-n.width/2,s=true;i<8&&(i=e.bottom+o,s=false),r=Math.max(8,Math.min(r,window.innerWidth-n.width-8)),this.root.style.top=`${i}px`,this.root.style.left=`${r}px`;let a=Math.max(16,Math.min(e.left+e.width/2-r-6,n.width-22));s?this.arrow.style.cssText=`
|
|
3099
1528
|
position:absolute;
|
|
3100
1529
|
width:12px;height:12px;
|
|
3101
1530
|
background:${this.colors.glassBgHeavy};
|
|
@@ -3115,7 +1544,7 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
3115
1544
|
pointer-events:none;
|
|
3116
1545
|
top:-6px;
|
|
3117
1546
|
left:${a}px;
|
|
3118
|
-
|
|
1547
|
+
`;}contains(e){return this.root.contains(e)}destroy(){this.cancelShow(),this.cancelHide(),this.root.remove();}};var Z=null;function wn(t){return t===void 0||t===false?{console:false,network:false,maxConsoleEntries:50,maxNetworkEntries:20}:t===true?{console:true,network:true,maxConsoleEntries:50,maxNetworkEntries:20}:{console:t.console!==false,network:t.network!==false,maxConsoleEntries:typeof t.maxConsoleEntries=="number"?t.maxConsoleEntries:50,maxNetworkEntries:typeof t.maxNetworkEntries=="number"?t.maxNetworkEntries:20}}function xe(){let t=()=>{};return {destroy:t,open:t,close:t,refresh:t,on:()=>t,off:t}}function Dt(t){let e=t.debug?(...u)=>console.debug("[siteping]",...u):()=>{};if(Z)return e("initSiteping() called more than once \u2014 returning existing instance"),Z;if(!t.forceShow)try{if(typeof process<"u")return t.onSkip?.("production"),xe()}catch{}if(window.innerWidth<768){let u="mobile";return t.onSkip?.(u),xe()}if(!t.store&&(!t.endpoint||typeof t.endpoint!="string"))return console.error("[siteping] Missing 'endpoint' or 'store' in config. Provide an endpoint like '/api/siteping' or a SitepingStore instance."),xe();if(!t.projectName||typeof t.projectName!="string")return console.error("[siteping] Missing or invalid 'projectName' in config. Expected a non-empty string."),xe();let n=t.locale??"en";n!=="en"&&A(n).catch(()=>{});let o=B(n),i=t.scopeAnnotationsByUrl??true,r=()=>{try{let u=t.getPageScope?.();if(u)return u}catch(u){e("getPageScope() threw, falling back to pathname:",u);}return {url:window.location.pathname,urlPattern:null}};e("Initializing widget",{projectName:t.projectName,theme:t.theme??"light",locale:n,scopeAnnotationsByUrl:i});let s=wn(t.captureDiagnostics),a=s.console?new pe(s.maxConsoleEntries):null,c=s.network?new de(s.maxNetworkEntries):null,p=w$1(t.accentColor,t.theme),l=new J,d=new J,h=t.store?new be(t.store,t.projectName):new ce(t.endpoint,t.projectName);t.onOpen&&l.on("open",t.onOpen),t.onClose&&l.on("close",t.onClose),t.onFeedbackSent&&l.on("feedback:sent",t.onFeedbackSent),t.onError&&l.on("feedback:error",t.onError),t.onAnnotationStart&&l.on("annotation:start",t.onAnnotationStart),t.onAnnotationEnd&&l.on("annotation:end",t.onAnnotationEnd),l.on("feedback:sent",u=>d.emit("feedback:sent",u)),l.on("feedback:deleted",u=>d.emit("feedback:deleted",u)),l.on("open",()=>d.emit("panel:open")),l.on("close",()=>d.emit("panel:close")),l.on("open",()=>e("Panel opened")),l.on("close",()=>e("Panel closed")),l.on("feedback:sent",u=>e("Feedback sent",u.id)),l.on("feedback:error",u=>e("Feedback failed",u.message)),l.on("annotation:start",()=>e("Annotation started")),l.on("annotation:end",()=>e("Annotation ended"));let f=document.createElement("siteping-widget");f.style.cssText=`position:fixed;z-index:${2147483647};`;let v=false;try{typeof process<"u"&&process.env?.["NODE_ENV"]==="test"&&(v=!0);}catch{}let D=v?"open":"closed",S=f.attachShadow({mode:D});if("adoptedStyleSheets"in ShadowRoot.prototype){let u=new CSSStyleSheet;u.replaceSync($e(p)),S.adoptedStyleSheets=[u];}else {let u=document.createElement("style");u.textContent=$e(p),S.appendChild(u);}document.body.appendChild(f);let k=document.createElement("div");k.setAttribute("role","status"),k.setAttribute("aria-live","polite"),k.setAttribute("aria-atomic","true"),k.style.cssText="position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;",document.body.appendChild(k);let j=new ye(p,n),x=new ge(p,j,l,o,k),E=new ue(S,t,l,o),g=null,R=null,C=false;async function F(){return C?null:g||(R||(R=import('./panel-HDPPIATU.js').then(u=>C?null:(g=new u.Panel(S,p,l,h,t.projectName,x,o,n,{getScope:r,scopeAnnotationsByUrl:i}),g))),R)}if(typeof window<"u"){let u=()=>{C||F();},b=window.requestIdleCallback;typeof b=="function"?b(u):setTimeout(u,200);}let L=false,Lt=l.on("panel:toggle",u=>{g||(u?(L=true,F().then(b=>{b&&L&&b.open(),L=false;}).catch(b=>e("Failed to lazy-load panel:",b))):L=false);}),Nt=new le(p,l,o,t.enableScreenshot??false),ve=false,_t=l.on("annotation:complete",async u=>{if(!ve){ve=true;try{let{annotation:b,type:N,message:we,screenshotDataUrl:ke}=u,_=Tt();if(!_){if(_=await kn(S,o),!_)return;Ct(_);}let Ht=(()=>{try{return crypto.randomUUID()}catch{return `${Date.now()}-${Math.random().toString(36).slice(2)}`}})(),Ee=r(),Be=null;(a||c)&&(Be={console:a?.getEntries()??[],network:c?.getEntries()??[]});let Ot={projectName:t.projectName,type:N,message:we,url:Ee.url,urlPattern:Ee.urlPattern,viewport:`${window.innerWidth}x${window.innerHeight}`,userAgent:navigator.userAgent,authorName:_.name,authorEmail:_.email,annotations:[b],clientId:Ht,screenshotDataUrl:ke??null,diagnostics:Be};try{let M=await h.sendFeedback(Ot);l.emit("feedback:sent",M),(!i||M.url===Ee.url)&&x.addFeedback(M,x.count+1),k.textContent=o("feedback.sent.confirmation"),g&&await g.refresh();}catch(M){l.emit("feedback:error",M instanceof Error?M:new Error(String(M))),k.textContent=o("feedback.error.message");}}finally{ve=false;}}}),Oe=r(),$t=i?{limit:20,url:Oe.url}:{limit:20};return h.getFeedbacks(t.projectName,$t).then(({feedbacks:u})=>{let b=i?u.filter(N=>N.url===Oe.url):u;x.render(b);}).catch(u=>{e("Failed to load initial markers:",u);}),t.endpoint&&wt(t.endpoint).then(()=>e("Retry queue flushed")).catch(()=>{}),Z={destroy:()=>{e("Destroying widget"),C=true,L=false,_t(),Lt(),E.destroy(),g?.destroy(),Nt.destroy(),x.destroy(),j.destroy(),a?.dispose(),c?.dispose(),l.removeAll(),d.removeAll(),k.remove(),f.remove(),Z=null;},open:()=>{l.emit("panel:toggle",true);},close:()=>{g?g.close():L=false;},refresh:()=>{if(g?.isCurrentlyOpen){g.refresh();return}let u=r(),b=i?{limit:20,url:u.url}:{limit:20};h.getFeedbacks(t.projectName,b).then(({feedbacks:N})=>{let we=i?N.filter(ke=>ke.url===u.url):N;x.render(we);}).catch(()=>{});},on:(u,b)=>d.on(u,b),off:(u,b)=>{d.off(u,b);}},Z}function kn(t,e){return new Promise(n=>{let o=t.activeElement??document.activeElement,i=document.createElement("div");i.style.cssText=`
|
|
3119
1548
|
position:fixed;inset:0;
|
|
3120
1549
|
background:var(--sp-identity-overlay);
|
|
3121
1550
|
backdrop-filter:blur(8px);
|
|
@@ -3123,7 +1552,7 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
3123
1552
|
display:flex;align-items:center;justify-content:center;
|
|
3124
1553
|
z-index:${2147483647};
|
|
3125
1554
|
opacity:0;transition:opacity 0.25s ease;
|
|
3126
|
-
`;let
|
|
1555
|
+
`;let r=document.createElement("div");r.style.cssText=`
|
|
3127
1556
|
width:340px;padding:28px;border-radius:var(--sp-radius-xl);
|
|
3128
1557
|
background:var(--sp-identity-bg);
|
|
3129
1558
|
backdrop-filter:blur(var(--sp-blur-heavy));
|
|
@@ -3135,5 +1564,5 @@ var R,Fe,nt;function ot(n,e){if(nt=new Date,n.nodeType!==Node.ELEMENT_NODE)throw
|
|
|
3135
1564
|
transform:translateY(12px) scale(0.97);
|
|
3136
1565
|
transition:transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
|
|
3137
1566
|
-webkit-font-smoothing:antialiased;
|
|
3138
|
-
`;let
|
|
1567
|
+
`;let s=`sp-identity-title-${Date.now()}`;r.setAttribute("role","dialog"),r.setAttribute("aria-modal","true"),r.setAttribute("aria-labelledby",s);let a=document.createElement("div");a.className="sp-identity-title",a.id=s,a.textContent=e("identity.title"),a.style.marginBottom="20px";let c=`sp-identity-name-${Date.now()}`,p=`sp-identity-email-${Date.now()}`,l=document.createElement("label");l.className="sp-input-label",l.textContent=e("identity.nameLabel"),l.setAttribute("for",c);let d=document.createElement("input");d.className="sp-input",d.id=c,d.type="text",d.placeholder=e("identity.namePlaceholder"),d.style.marginBottom="14px";let h=document.createElement("label");h.className="sp-input-label",h.textContent=e("identity.emailLabel"),h.setAttribute("for",p);let f=document.createElement("input");f.className="sp-input",f.id=p,f.type="email",f.placeholder=e("identity.emailPlaceholder");let v=document.createElement("div");v.style.cssText="display:flex;gap:8px;justify-content:flex-end;margin-top:20px;";let D=x=>{i.removeEventListener("keydown",j),i.style.opacity="0",r.style.transform="translateY(12px) scale(0.97)",setTimeout(()=>{i.remove(),o?.focus(),n(x);},250);},S=document.createElement("button");S.className="sp-btn-ghost",S.textContent=e("identity.cancel"),S.addEventListener("click",()=>D(null));let B=document.createElement("button");B.className="sp-btn-primary",B.textContent=e("identity.submit"),B.addEventListener("click",()=>{let x=d.value.trim(),E=f.value.trim();if(!x||!E)return;if(!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(E)){f.style.borderColor="var(--sp-type-bug, #ef4444)";return}D({name:x,email:E});});let k='input, button, [tabindex]:not([tabindex="-1"])',j=x=>{let E=x;if(E.key==="Escape"){D(null);return}if(E.key==="Tab"){let g=Array.from(r.querySelectorAll(k));if(g.length===0)return;let R=g[0],C=g[g.length-1];if(!R||!C)return;let F=t.activeElement;E.shiftKey?(F===R||!r.contains(F))&&(E.preventDefault(),C.focus()):(F===C||!r.contains(F))&&(E.preventDefault(),R.focus());}};i.addEventListener("keydown",j),i.addEventListener("click",x=>{x.target===i&&D(null);}),v.appendChild(S),v.appendChild(B),r.appendChild(a),r.appendChild(l),r.appendChild(d),r.appendChild(h),r.appendChild(f),r.appendChild(v),i.appendChild(r),t.appendChild(i),requestAnimationFrame(()=>{i.style.opacity="1",r.style.transform="translateY(0) scale(1)",d.focus();});})}function Jo(t){return Dt(t)}export{Jo as initSiteping};//# sourceMappingURL=index.js.map
|
|
3139
1568
|
//# sourceMappingURL=index.js.map
|