@siteping/widget 0.10.6 → 0.10.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.
Files changed (55) hide show
  1. package/dist/chunk-4CK3N4YE.js +1796 -0
  2. package/dist/chunk-4CK3N4YE.js.map +1 -0
  3. package/dist/chunk-BJFC7TVL.cjs +1796 -0
  4. package/dist/chunk-BJFC7TVL.cjs.map +1 -0
  5. package/dist/chunk-EYISG4OI.js +1796 -0
  6. package/dist/chunk-EYISG4OI.js.map +1 -0
  7. package/dist/chunk-OK2KX3KN.cjs +1796 -0
  8. package/dist/chunk-OK2KX3KN.cjs.map +1 -0
  9. package/dist/email.d.cts +19 -0
  10. package/dist/email.d.ts +19 -0
  11. package/dist/filters.d.cts +29 -4
  12. package/dist/filters.d.ts +29 -4
  13. package/dist/i18n.d.cts +67 -0
  14. package/dist/i18n.d.ts +67 -0
  15. package/dist/index.cjs +50 -50
  16. package/dist/index.cjs.map +1 -1
  17. package/dist/index.d.cts +152 -6
  18. package/dist/index.d.ts +152 -6
  19. package/dist/index.global.js +74 -74
  20. package/dist/index.global.js.map +1 -1
  21. package/dist/index.js +50 -50
  22. package/dist/index.js.map +1 -1
  23. package/dist/panel-KCYUMYAI.cjs +2 -0
  24. package/dist/panel-KCYUMYAI.cjs.map +1 -0
  25. package/dist/panel-KV2AQHC2.js +2 -0
  26. package/dist/panel-KV2AQHC2.js.map +1 -0
  27. package/dist/panel-LYS3425X.cjs +2 -0
  28. package/dist/panel-LYS3425X.cjs.map +1 -0
  29. package/dist/panel-W2LHYGFS.js +2 -0
  30. package/dist/panel-W2LHYGFS.js.map +1 -0
  31. package/dist/react.cjs +50 -50
  32. package/dist/react.cjs.map +1 -1
  33. package/dist/react.js +49 -49
  34. package/dist/react.js.map +1 -1
  35. package/dist/screenshot-storage.d.cts +5 -0
  36. package/dist/screenshot-storage.d.ts +5 -0
  37. package/dist/siteping-core.d.cts +11 -5
  38. package/dist/siteping-core.d.ts +11 -5
  39. package/dist/store-helpers.d.cts +96 -0
  40. package/dist/store-helpers.d.ts +96 -0
  41. package/dist/type-utils.d.cts +13 -44
  42. package/dist/type-utils.d.ts +13 -44
  43. package/dist/types.d.cts +149 -112
  44. package/dist/types.d.ts +149 -112
  45. package/dist/wire.d.cts +35 -0
  46. package/dist/wire.d.ts +35 -0
  47. package/package.json +4 -3
  48. package/dist/chunk-D2AVRF24.js +0 -1796
  49. package/dist/chunk-D2AVRF24.js.map +0 -1
  50. package/dist/chunk-GRKBXAGP.cjs +0 -1796
  51. package/dist/chunk-GRKBXAGP.cjs.map +0 -1
  52. package/dist/panel-LMVRKAQH.cjs +0 -2
  53. package/dist/panel-LMVRKAQH.cjs.map +0 -1
  54. package/dist/panel-OXUE7PJY.js +0 -2
  55. package/dist/panel-OXUE7PJY.js.map +0 -1
@@ -1,1796 +0,0 @@
1
- function c(t){let n=document.createRange().createContextualFragment(t).firstElementChild;if(n?.nodeName.toLowerCase()!=="svg")throw new Error("[siteping] Invalid SVG string");for(let r of [...n.attributes])r.name.startsWith("on")&&n.removeAttribute(r.name);for(let r of n.querySelectorAll("*"))for(let i of [...r.attributes])i.name.startsWith("on")&&r.removeAttribute(i.name);return n}function o(t,e){let s=document.createElement(t);if(e)for(let[n,r]of Object.entries(e))n==="class"?s.className=r:n==="style"?s.style.cssText=r:s.setAttribute(n,r);return s}function a(t,e){t.textContent=e;}function F(t){let e=Array.from(t.childNodes).map(s=>s.cloneNode(true));return t.disabled=true,t.replaceChildren(o("div",{class:"sp-spinner sp-spinner--sm"})),()=>{t.replaceChildren(...e),t.disabled=false;}}function Ve(t,e="en"){let s=Date.now()-new Date(t).getTime(),n=Math.floor(s/1e3);if(n<60)return new Intl.RelativeTimeFormat(e,{numeric:"auto"}).format(0,"second");let r=new Intl.RelativeTimeFormat(e,{numeric:"always",style:"narrow"}),i=Math.floor(n/60);if(i<60)return r.format(-i,"minute");let l=Math.floor(i/60);if(l<24)return r.format(-l,"hour");let d=Math.floor(l/24);return d<7?r.format(-d,"day"):new Date(t).toLocaleDateString(e)}var Ge='<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>';var qe='<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>',We='<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>',Xe='<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>',Qe='<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>',Je='<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>',Ze='<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>',et='<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>',tt='<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>',st='<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>',nt='<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>',rt='<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>',ot='<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>',it='<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>',at='<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>',lt='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><line x1="8" y1="6" x2="21" y2="6"/><line x1="8" y1="12" x2="21" y2="12"/><line x1="8" y1="18" x2="21" y2="18"/><line x1="3" y1="6" x2="3.01" y2="6"/><line x1="3" y1="12" x2="3.01" y2="12"/><line x1="3" y1="18" x2="3.01" y2="18"/></svg>',pt='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 20h9"/><path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4 12.5-12.5z"/></svg>';var j="#0066ff",le=/^#[0-9a-fA-F]{6}$/,_=/^#([0-9a-fA-F])([0-9a-fA-F])([0-9a-fA-F])$/,pe=/^#[0-9a-fA-F]{8}$/;function de(t){if(le.test(t))return t;let e=_.test(t)?t.match(_):null;return e?`#${e[1]}${e[1]}${e[2]}${e[2]}${e[3]}${e[3]}`:pe.test(t)?t.slice(0,7):(console.warn(`[siteping] Invalid accentColor "${t}" \u2014 only hex colors (#RGB, #RRGGBB, #RRGGBBAA) are supported. Using default.`),j)}function ce(t,e){let s=Math.max(0,Math.round(parseInt(t.slice(1,3),16)*(1-e))),n=Math.max(0,Math.round(parseInt(t.slice(3,5),16)*(1-e))),r=Math.max(0,Math.round(parseInt(t.slice(5,7),16)*(1-e)));return `#${s.toString(16).padStart(2,"0")}${n.toString(16).padStart(2,"0")}${r.toString(16).padStart(2,"0")}`}function ue(){return typeof window>"u"?false:window.matchMedia("(prefers-color-scheme: dark)").matches}function he(t){return t==="dark"||t==="auto"&&ue()?"dark":"light"}function ct(t=j,e){let s=de(t),n=ce(s,.15);return he(e)==="dark"?{accent:s,accentLight:s+"22",accentDark:n,accentGlow:s+"44",accentGradient:`linear-gradient(135deg, ${s}, ${n})`,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)",statusInProgress:"#fbbf24",statusInProgressBg:"rgba(245, 158, 11, 0.15)",statusWontFix:"#94a3b8",statusWontFixBg:"rgba(148, 163, 184, 0.15)"}:{accent:s,accentLight:s+"14",accentDark:n,accentGlow:s+"33",accentGradient:`linear-gradient(135deg, ${s}, ${n})`,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",statusInProgress:"#d97706",statusInProgressBg:"#fffbeb",statusWontFix:"#64748b",statusWontFixBg:"#f1f5f9"}}function M(t,e){switch(t){case "question":return e.typeQuestion;case "change":return e.typeChange;case "bug":return e.typeBug;default:return e.typeOther}}function ut(t,e){switch(t){case "in_progress":return e.statusInProgress;case "resolved":return e.statusResolved;case "wont_fix":return e.statusWontFix;default:return e.statusOpen}}function ht(t,e){switch(t){case "in_progress":return e.statusInProgressBg;case "resolved":return e.statusResolvedBg;case "wont_fix":return e.statusWontFixBg;default:return e.statusOpenBg}}function $(t,e){switch(t){case "question":return e.typeQuestionBg;case "change":return e.typeChangeBg;case "bug":return e.typeBugBg;default:return e.typeOtherBg}}function gt(t){return `
2
- --sp-accent: ${t.accent};
3
- --sp-accent-light: ${t.accentLight};
4
- --sp-accent-dark: ${t.accentDark};
5
- --sp-accent-glow: ${t.accentGlow};
6
- --sp-accent-gradient: ${t.accentGradient};
7
- --sp-bg: ${t.bg};
8
- --sp-bg-hover: ${t.bgHover};
9
- --sp-text: ${t.text};
10
- --sp-text-secondary: ${t.textSecondary};
11
- --sp-text-tertiary: ${t.textTertiary};
12
- --sp-border: ${t.border};
13
- --sp-shadow: ${t.shadow};
14
- --sp-glass-bg: ${t.glassBg};
15
- --sp-glass-bg-heavy: ${t.glassBgHeavy};
16
- --sp-glass-border: ${t.glassBorder};
17
- --sp-glass-border-subtle: ${t.glassBorderSubtle};
18
- --sp-type-question: ${t.typeQuestion};
19
- --sp-type-change: ${t.typeChange};
20
- --sp-type-bug: ${t.typeBug};
21
- --sp-type-other: ${t.typeOther};
22
- --sp-type-question-bg: ${t.typeQuestionBg};
23
- --sp-type-change-bg: ${t.typeChangeBg};
24
- --sp-type-bug-bg: ${t.typeBugBg};
25
- --sp-type-other-bg: ${t.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
- `}function K(t){return typeof t=="object"&&t!==null}function ge(t,e){return K(t)&&e in t}var P=["en","fr","de","es","it","pt","ru"];var be=["open","in_progress","resolved","wont_fix"],z=["resolved","wont_fix"];function C(t){return z.includes(t)}function xe(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}}var E=class extends Error{code;retryable;constructor(e,s,n){super(e),this.code=s,this.retryable=n,this.name="SitepingError";}},O=class extends E{constructor(e){super(e,"NETWORK",true),this.name="SitepingNetworkError";}},N=class extends E{constructor(e){super(e,"VALIDATION",false),this.name="SitepingValidationError";}},D=class extends E{constructor(e){super(e,"AUTH",false),this.name="SitepingAuthError";}};var U={"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","panel.statusInProgress":"In progress","panel.statusWontFix":"Won't fix","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":"Show sidebar","fab.annotate":"Create new annotation","fab.annotations":"Show or hide markers","annotator.instruction":"Draw a rectangle on the area to comment \u2014 or press Enter to comment on the last focused element","annotator.instantInstruction":"Comment on the clicked spot","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}","marker.count":"{count} feedback markers displayed","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","bulk.selectAll":"Select all","bulk.selected":"{count} selected","bulk.resolve":"Resolve","bulk.delete":"Delete","bulk.deselect":"Deselect","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","stats.open":"Open","stats.resolved":"Resolved","stats.bugs":"Bugs","stats.progress":"{percent}% resolved","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.closedAt":"Closed at","detail.goToAnnotation":"Go to annotation","detail.element":"Element","detail.selector":"Selector","detail.position":"Position","detail.resolve":"Resolve","detail.reopen":"Reopen","detail.delete":"Delete","detail.diagnostics":"Diagnostics","detail.diagnostics.console":"Console","detail.diagnostics.network":"Failed network","detail.diagnostics.expand":"Show diagnostics","detail.diagnostics.collapse":"Hide diagnostics","detail.diagnostics.noEntries":"No entries","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","export.label":"Export","export.csv":"Export CSV","export.json":"Export JSON"};var T={en:U},ve=new Set(P.filter(t=>t!=="en"));function V(t){return ve.has(t)}function Y(t){return (t.split("-")[0]??t).toLowerCase()}async function Pt(t){let e=Y(t),s=T[e];if(s)return s;if(!V(e))return null;let n;switch(e){case "de":n=await import('./de-MAGIJBFC.js');break;case "es":n=await import('./es-HEVFJPRI.js');break;case "fr":n=await import('./fr-OM2PHLDH.js');break;case "it":n=await import('./it-OQVYHKKV.js');break;case "pt":n=await import('./pt-VUUNL42H.js');break;case "ru":n=await import('./ru-NDWY7Y36.js');break;default:return null}let r=n[e];return r?(T[e]=r,r):null}function Ot(t){let e=Y(t);return e!=="en"&&!T[e]&&!V(e)&&console.warn(`[siteping] Unknown locale "${t}", falling back to "en"`),s=>(T[e]??T.en)?.[s]??T.en?.[s]??s}function Nt(t,e){switch(t){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 t}}function G(t,e){switch(t){case "open":return e("panel.statusOpen");case "in_progress":return e("panel.statusInProgress");case "resolved":return e("panel.statusResolved");case "wont_fix":return e("panel.statusWontFix");default:return t}}var fe='<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 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></svg>',me='<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"/><line x1="3" y1="9" x2="21" y2="9"/><line x1="3" y1="15" x2="21" y2="15"/><line x1="9" y1="3" x2="9" y2="21"/><line x1="15" y1="3" x2="15" y2="21"/></svg>',ye='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M8 3H6a2 2 0 0 0-2 2v4a2 2 0 0 1-2 2 2 2 0 0 1 2 2v4a2 2 0 0 0 2 2h2"/><path d="M16 3h2a2 2 0 0 1 2 2v4a2 2 0 0 0 2 2 2 2 0 0 0-2 2v4a2 2 0 0 1-2 2h-2"/></svg>',It=`
39
- /* ============================
40
- Export Button & Menu
41
- ============================ */
42
-
43
- .sp-export-btn {
44
- padding: 5px 12px;
45
- border-radius: var(--sp-radius-full);
46
- border: 1px solid var(--sp-border);
47
- background: transparent;
48
- color: var(--sp-text-tertiary);
49
- font-family: var(--sp-font);
50
- font-size: 11px;
51
- font-weight: 500;
52
- cursor: pointer;
53
- display: flex;
54
- align-items: center;
55
- gap: 4px;
56
- transition: all 0.2s ease;
57
- position: relative;
58
- }
59
-
60
- .sp-export-btn svg {
61
- width: 13px;
62
- height: 13px;
63
- }
64
-
65
- .sp-export-btn:hover {
66
- border-color: var(--sp-accent);
67
- color: var(--sp-accent);
68
- background: var(--sp-accent-light);
69
- }
70
-
71
- .sp-export-btn:disabled {
72
- opacity: 0.5;
73
- cursor: not-allowed;
74
- pointer-events: none;
75
- }
76
-
77
- .sp-export-menu {
78
- position: absolute;
79
- top: calc(100% + 6px);
80
- right: 0;
81
- min-width: 180px;
82
- padding: 4px;
83
- border-radius: var(--sp-radius);
84
- background: var(--sp-glass-bg-heavy);
85
- backdrop-filter: blur(var(--sp-blur));
86
- -webkit-backdrop-filter: blur(var(--sp-blur));
87
- border: 1px solid var(--sp-glass-border);
88
- box-shadow: var(--sp-shadow-lg);
89
- z-index: 10;
90
- opacity: 0;
91
- transform: translateY(-4px) scale(0.97);
92
- transition: opacity 0.15s ease, transform 0.15s ease;
93
- pointer-events: none;
94
- }
95
-
96
- .sp-export-menu--open {
97
- opacity: 1;
98
- transform: translateY(0) scale(1);
99
- pointer-events: auto;
100
- }
101
-
102
- .sp-export-option {
103
- display: flex;
104
- align-items: center;
105
- gap: 10px;
106
- width: 100%;
107
- padding: 8px 16px;
108
- border: none;
109
- border-radius: 8px;
110
- background: transparent;
111
- color: var(--sp-text-secondary);
112
- font-family: var(--sp-font);
113
- font-size: 13px;
114
- font-weight: 500;
115
- cursor: pointer;
116
- transition: all 0.15s ease;
117
- text-align: left;
118
- }
119
-
120
- .sp-export-option:hover,
121
- .sp-export-option:focus-visible {
122
- background: var(--sp-accent-light);
123
- color: var(--sp-accent);
124
- }
125
-
126
- .sp-export-option-icon {
127
- display: flex;
128
- align-items: center;
129
- justify-content: center;
130
- flex-shrink: 0;
131
- }
132
-
133
- .sp-export-option-icon svg {
134
- width: 16px;
135
- height: 16px;
136
- }
137
-
138
- .sp-export-option-label {
139
- flex: 1;
140
- }
141
-
142
- @media (forced-colors: active) {
143
- .sp-export-btn,
144
- .sp-export-option,
145
- .sp-export-menu {
146
- border: 2px solid ButtonText !important;
147
- background: Canvas !important;
148
- color: ButtonText !important;
149
- }
150
-
151
- .sp-export-btn:focus-visible,
152
- .sp-export-option:focus-visible {
153
- outline: 3px solid Highlight !important;
154
- }
155
- }
156
- `,q=["id","type","status","message","url","authorName","authorEmail","createdAt","resolvedAt","viewport"];function ke(t){let e=/^[=+\-@\t\r]/.test(t)?`'${t}`:t;return e.includes('"')||e.includes(",")||e.includes(`
157
- `)||e.includes("\r")?`"${e.replace(/"/g,'""')}"`:e}function Ce(t){let e=q.join(","),s=t.map(n=>q.map(r=>{let i=n[r];return ke(i==null?"":String(i))}).join(","));return [e,...s].join(`
158
- `)}function we(t){return JSON.stringify(t,null,2)}function W(t,e,s){let n=new Blob([t],{type:s}),r=URL.createObjectURL(n),i=document.createElement("a");i.href=r,i.download=e,i.style.display="none",document.body.appendChild(i),i.click(),requestAnimationFrame(()=>{URL.revokeObjectURL(r),i.remove();});}var X=class{constructor(e,s,n){this.getFeedbacks=s;this.element=o("div",{style:"position: relative; display: inline-flex;"});let r=document.createElement("button");r.className="sp-export-btn",r.setAttribute("aria-haspopup","true"),r.setAttribute("aria-expanded","false"),r.appendChild(c(fe));let i=document.createElement("span");a(i,n("export.label")),r.appendChild(i),r.addEventListener("click",p=>{p.stopPropagation(),this.toggle();}),this.menu=o("div",{class:"sp-export-menu"}),this.menu.setAttribute("role","menu");let l=this.createOption(me,n("export.csv"),()=>{this.exportAs("csv");}),d=this.createOption(ye,n("export.json"),()=>{this.exportAs("json");});this.menu.appendChild(l),this.menu.appendChild(d),this.element.appendChild(r),this.element.appendChild(this.menu),this.onDocumentClick=p=>{this.isOpen&&!this.element.contains(p.target)&&this.close();},document.addEventListener("click",this.onDocumentClick,true);}getFeedbacks;element;menu;isOpen=false;onDocumentClick;createOption(e,s,n){let r=document.createElement("button");r.className="sp-export-option",r.setAttribute("role","menuitem");let i=o("span",{class:"sp-export-option-icon"});i.appendChild(c(e));let l=o("span",{class:"sp-export-option-label"});return a(l,s),r.appendChild(i),r.appendChild(l),r.addEventListener("click",d=>{d.stopPropagation(),n(),this.close();}),r}toggle(){this.isOpen?this.close():this.open();}open(){this.isOpen=true,this.menu.classList.add("sp-export-menu--open"),this.element.querySelector(".sp-export-btn")?.setAttribute("aria-expanded","true");}close(){this.isOpen=false,this.menu.classList.remove("sp-export-menu--open"),this.element.querySelector(".sp-export-btn")?.setAttribute("aria-expanded","false");}exportAs(e){let s=this.getFeedbacks();if(s.length===0)return;let n=s[0]?.projectName??"feedbacks",r=new Date().toISOString().slice(0,10),i=n.replace(/[^a-zA-Z0-9_-]/g,"_");if(e==="csv"){let l=Ce(s);W(l,`feedbacks-${i}-${r}.csv`,"text/csv;charset=utf-8");}else {let l=we(s);W(l,`feedbacks-${i}-${r}.json`,"application/json;charset=utf-8");}}destroy(){document.removeEventListener("click",this.onDocumentClick,true),this.element.remove();}};var A='<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>',Q='<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>',$t=`
159
- /* ============================
160
- Bulk Checkbox
161
- ============================ */
162
-
163
- .sp-bulk-checkbox {
164
- position: relative;
165
- width: 16px;
166
- height: 16px;
167
- flex-shrink: 0;
168
- cursor: pointer;
169
- border-radius: 4px;
170
- color: var(--sp-border);
171
- opacity: 0;
172
- transition: opacity 0.15s ease, color 0.15s ease, transform 0.15s ease;
173
- display: inline-flex;
174
- align-items: center;
175
- justify-content: center;
176
- }
177
-
178
- .sp-bulk-checkbox svg {
179
- width: 16px;
180
- height: 16px;
181
- display: block;
182
- }
183
-
184
- .sp-bulk-checkbox:hover {
185
- color: var(--sp-accent);
186
- transform: scale(1.1);
187
- }
188
-
189
- .sp-bulk-checkbox--checked {
190
- color: var(--sp-accent);
191
- opacity: 1 !important;
192
- filter: drop-shadow(0 0 4px var(--sp-accent-glow));
193
- }
194
-
195
- /* Show checkboxes when hovering a card */
196
- .sp-card:hover .sp-bulk-checkbox {
197
- opacity: 1;
198
- }
199
-
200
- /* When any card has selection, show ALL checkboxes */
201
- .sp-list--has-selection .sp-bulk-checkbox {
202
- opacity: 1;
203
- }
204
-
205
- /* ============================
206
- Card Selected State
207
- ============================ */
208
-
209
- .sp-card--selected {
210
- border-left: 3px solid var(--sp-accent) !important;
211
- background: var(--sp-accent-light) !important;
212
- }
213
-
214
- .sp-card--selected:hover {
215
- background: var(--sp-accent-light) !important;
216
- }
217
-
218
- /* ============================
219
- Select All Bar
220
- ============================ */
221
-
222
- .sp-bulk-select-all {
223
- display: flex;
224
- align-items: center;
225
- gap: 8px;
226
- padding: 8px 12px;
227
- margin-bottom: 4px;
228
- border-radius: var(--sp-radius);
229
- background: transparent;
230
- cursor: pointer;
231
- opacity: 0;
232
- transition: opacity 0.2s ease, background 0.2s ease;
233
- user-select: none;
234
- font-family: var(--sp-font);
235
- font-size: 12px;
236
- font-weight: 500;
237
- color: var(--sp-text-secondary);
238
- }
239
-
240
- .sp-bulk-select-all:hover {
241
- background: var(--sp-bg-hover);
242
- }
243
-
244
- /* Show select-all on list hover or when selections exist */
245
- .sp-list:hover .sp-bulk-select-all,
246
- .sp-list--has-selection .sp-bulk-select-all {
247
- opacity: 1;
248
- }
249
-
250
- .sp-bulk-select-all .sp-bulk-checkbox {
251
- opacity: 1;
252
- }
253
-
254
- /* ============================
255
- Floating Action Bar
256
- ============================ */
257
-
258
- @keyframes sp-bulk-bar-in {
259
- from {
260
- transform: translateY(100%) scale(0.95);
261
- opacity: 0;
262
- }
263
- to {
264
- transform: translateY(0) scale(1);
265
- opacity: 1;
266
- }
267
- }
268
-
269
- @keyframes sp-bulk-bar-out {
270
- from {
271
- transform: translateY(0) scale(1);
272
- opacity: 1;
273
- }
274
- to {
275
- transform: translateY(100%) scale(0.95);
276
- opacity: 0;
277
- }
278
- }
279
-
280
- .sp-bulk-bar {
281
- position: absolute;
282
- bottom: 16px;
283
- left: 16px;
284
- right: 16px;
285
- display: flex;
286
- align-items: center;
287
- justify-content: space-between;
288
- gap: 12px;
289
- padding: 12px 16px;
290
- border-radius: 16px;
291
- background: var(--sp-glass-bg-heavy);
292
- backdrop-filter: blur(var(--sp-blur-heavy));
293
- -webkit-backdrop-filter: blur(var(--sp-blur-heavy));
294
- border: 1px solid var(--sp-glass-border);
295
- box-shadow: var(--sp-shadow-xl);
296
- z-index: 10;
297
- pointer-events: none;
298
- opacity: 0;
299
- transform: translateY(100%) scale(0.95);
300
- transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1),
301
- opacity 0.25s ease;
302
- font-family: var(--sp-font);
303
- }
304
-
305
- .sp-bulk-bar--visible {
306
- pointer-events: auto;
307
- opacity: 1;
308
- transform: translateY(0) scale(1);
309
- }
310
-
311
- .sp-bulk-bar-count {
312
- font-size: 13px;
313
- font-weight: 600;
314
- color: var(--sp-text);
315
- white-space: nowrap;
316
- letter-spacing: -0.01em;
317
- }
318
-
319
- .sp-bulk-bar-actions {
320
- display: flex;
321
- align-items: center;
322
- gap: 6px;
323
- }
324
-
325
- .sp-bulk-btn-resolve,
326
- .sp-bulk-btn-delete {
327
- padding: 7px 14px;
328
- border-radius: var(--sp-radius-full);
329
- border: 1.5px solid transparent;
330
- background: transparent;
331
- font-family: var(--sp-font);
332
- font-size: 12px;
333
- font-weight: 600;
334
- cursor: pointer;
335
- display: flex;
336
- align-items: center;
337
- gap: 5px;
338
- transition: all 0.2s ease;
339
- white-space: nowrap;
340
- }
341
-
342
- .sp-bulk-btn-resolve {
343
- color: #22c55e;
344
- border-color: #22c55e;
345
- }
346
-
347
- .sp-bulk-btn-resolve:hover {
348
- background: rgba(34, 197, 94, 0.1);
349
- box-shadow: 0 0 12px rgba(34, 197, 94, 0.15);
350
- }
351
-
352
- .sp-bulk-btn-resolve:active {
353
- transform: scale(0.96);
354
- transition-duration: 0.1s;
355
- }
356
-
357
- .sp-bulk-btn-delete {
358
- color: #ef4444;
359
- border-color: #ef4444;
360
- }
361
-
362
- .sp-bulk-btn-delete:hover {
363
- background: rgba(239, 68, 68, 0.1);
364
- box-shadow: 0 0 12px rgba(239, 68, 68, 0.15);
365
- }
366
-
367
- .sp-bulk-btn-delete:active {
368
- transform: scale(0.96);
369
- transition-duration: 0.1s;
370
- }
371
-
372
- .sp-bulk-btn-resolve:disabled,
373
- .sp-bulk-btn-delete:disabled {
374
- opacity: 0.5;
375
- cursor: not-allowed;
376
- pointer-events: none;
377
- }
378
-
379
- .sp-bulk-btn-deselect {
380
- width: 28px;
381
- height: 28px;
382
- border-radius: var(--sp-radius-full);
383
- border: 1px solid var(--sp-border);
384
- background: transparent;
385
- color: var(--sp-text-tertiary);
386
- cursor: pointer;
387
- display: flex;
388
- align-items: center;
389
- justify-content: center;
390
- transition: all 0.2s ease;
391
- flex-shrink: 0;
392
- padding: 0;
393
- }
394
-
395
- .sp-bulk-btn-deselect:hover {
396
- background: var(--sp-bg-hover);
397
- color: var(--sp-text);
398
- border-color: var(--sp-text-tertiary);
399
- }
400
-
401
- .sp-bulk-btn-deselect:active {
402
- transform: scale(0.92);
403
- transition-duration: 0.1s;
404
- }
405
-
406
- .sp-bulk-btn-deselect svg {
407
- width: 12px;
408
- height: 12px;
409
- }
410
-
411
- /* Spinner inside bulk bar buttons */
412
- .sp-bulk-btn-resolve .sp-spinner,
413
- .sp-bulk-btn-delete .sp-spinner {
414
- width: 14px;
415
- height: 14px;
416
- }
417
-
418
- /* ============================
419
- Forced Colors / High Contrast
420
- ============================ */
421
-
422
- @media (forced-colors: active) {
423
- .sp-bulk-checkbox,
424
- .sp-bulk-btn-resolve,
425
- .sp-bulk-btn-delete,
426
- .sp-bulk-btn-deselect,
427
- .sp-bulk-bar {
428
- border: 2px solid ButtonText !important;
429
- background: Canvas !important;
430
- color: ButtonText !important;
431
- }
432
-
433
- .sp-bulk-checkbox--checked {
434
- background: Highlight !important;
435
- color: HighlightText !important;
436
- }
437
-
438
- .sp-card--selected {
439
- border-left: 4px solid Highlight !important;
440
- }
441
- }
442
-
443
- /* ============================
444
- Reduced Motion
445
- ============================ */
446
-
447
- @media (prefers-reduced-motion: reduce) {
448
- .sp-bulk-bar {
449
- transition-duration: 0.01ms !important;
450
- }
451
-
452
- .sp-bulk-checkbox {
453
- transition-duration: 0.01ms !important;
454
- }
455
- }
456
- `,J=class{constructor(e,s,n){this.callbacks=s;this.t=n,this.barElement=o("div",{class:"sp-bulk-bar"}),this.barElement.setAttribute("role","toolbar"),this.barElement.setAttribute("aria-label","Bulk actions"),this.countLabel=o("span",{class:"sp-bulk-bar-count"}),a(this.countLabel,this.t("bulk.selected").replace("{count}","0"));let r=o("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.t("bulk.deselect")),i.appendChild(c('<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()),r.appendChild(this.resolveBtn),r.appendChild(this.deleteBtn),r.appendChild(i),this.barElement.appendChild(this.countLabel),this.barElement.appendChild(r),this.updateButtonLabels();}callbacks;barElement;selected=new Set;checkboxMap=new Map;countLabel;resolveBtn;deleteBtn;selectAllCheckbox=null;listContainer=null;isProcessing=false;t;createCheckbox(e){let s=o("div",{class:"sp-bulk-checkbox"});return s.setAttribute("role","checkbox"),s.setAttribute("aria-checked","false"),s.setAttribute("tabindex","0"),s.setAttribute("aria-label",`Select feedback ${e}`),s.appendChild(c(A)),s.addEventListener("click",n=>{n.stopPropagation(),this.toggle(e);}),s.addEventListener("keydown",n=>{(n.key===" "||n.key==="Enter")&&(n.preventDefault(),n.stopPropagation(),this.toggle(e));}),this.checkboxMap.set(e,s),s}createSelectAllBar(e,s){let n=o("div",{class:"sp-bulk-select-all"}),r=o("div",{class:"sp-bulk-checkbox"});r.appendChild(c(A)),this.selectAllCheckbox=r;let i=o("span");return a(i,s),n.appendChild(r),n.appendChild(i),n.addEventListener("click",()=>{this.selected.size===e.length&&e.length>0?this.deselectAll():this.selectAll(e);}),n}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 s of e)this.selected.add(s),this.updateCheckbox(s),this.updateCardSelectedState(s);this.updateBar(),this.updateSelectAllCheckbox(),this.updateListSelectionClass();}}deselectAll(){let e=[...this.selected];this.selected.clear();for(let s of e)this.updateCheckbox(s),this.updateCardSelectedState(s);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=false,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,s=e>0;this.barElement.classList.toggle("sp-bulk-bar--visible",s),a(this.countLabel,this.t("bulk.selected").replace("{count}",String(e))),this.updateButtonLabels();}updateButtonLabels(){let e=this.selected.size,s=this.t("bulk.resolve"),n=this.t("bulk.delete");this.resolveBtn.replaceChildren();let r=document.createElement("span");a(r,e>0?`${s} ${e}`:s),this.resolveBtn.appendChild(r),this.deleteBtn.replaceChildren();let i=document.createElement("span");a(i,e>0?`${n} ${e}`:n),this.deleteBtn.appendChild(i);}updateCheckbox(e){let s=this.checkboxMap.get(e);if(!s)return;let n=this.selected.has(e);s.classList.toggle("sp-bulk-checkbox--checked",n),s.setAttribute("aria-checked",String(n)),s.replaceChildren(),s.appendChild(c(n?Q:A));}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(c(e?Q:A));}updateListSelectionClass(){this.listContainer&&this.listContainer.classList.toggle("sp-list--has-selection",this.selected.size>0);}updateCardSelectedState(e){if(!this.listContainer)return;let s=CSS.escape(e),n=this.listContainer.querySelector(`[data-feedback-id="${s}"]`);n&&n.classList.toggle("sp-card--selected",this.selected.has(e));}async handleResolve(){if(this.isProcessing||this.selected.size===0)return;this.isProcessing=true;let e=[...this.selected],s=F(this.resolveBtn);this.deleteBtn.disabled=true;try{await this.callbacks.onResolve(e),this.reset();}catch{s(),this.deleteBtn.disabled=false;}finally{this.isProcessing=false;}}async handleDelete(){if(this.isProcessing||this.selected.size===0)return;this.isProcessing=true;let e=[...this.selected],s=F(this.deleteBtn);this.resolveBtn.disabled=true;try{await this.callbacks.onDelete(e),this.reset();}catch{s(),this.resolveBtn.disabled=false;}finally{this.isProcessing=false;}}};var Se='<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>',H='<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>',Ee='<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>',Te='<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>',Be='<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>',Ae='<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>',I='<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>',Z='<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>',ee='<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>',Le='<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>',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="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>',Fe='<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>',Me='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="4 17 10 11 4 5"/><line x1="12" y1="19" x2="20" y2="19"/></svg>',Gt=`
457
- /* ============================
458
- Detail View \u2014 Panel-in-Panel
459
- ============================ */
460
-
461
- .sp-detail {
462
- position: absolute;
463
- inset: 0;
464
- display: flex;
465
- flex-direction: column;
466
- background: var(--sp-glass-bg);
467
- backdrop-filter: blur(var(--sp-blur-heavy));
468
- -webkit-backdrop-filter: blur(var(--sp-blur-heavy));
469
- z-index: 20;
470
- transform: translateX(100%);
471
- transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
472
- will-change: transform;
473
- overflow: hidden;
474
- }
475
-
476
- .sp-detail--visible {
477
- transform: translateX(0);
478
- }
479
-
480
- /* Fallback for browsers that cannot deliver a readable "frosted glass":
481
- drop the translucent background to a solid one so the underlying list
482
- does not bleed through. Two disjoint cohorts:
483
-
484
- 1. No backdrop-filter at all (Firefox <=102, legacy Edge / IE,
485
- older Chromium on Linux).
486
- 2. Safari / iOS Safari where backdrop-filter is detectable only
487
- via the -webkit- prefix. Empirically this still includes recent
488
- Safari (observed on macOS Safari 18.6 in 2026, where
489
- CSS.supports('backdrop-filter', 'blur(...)') returns false even
490
- though the unprefixed property has shipped). On these builds the
491
- long-standing nested-backdrop + transform compositing bug
492
- silently no-ops the blur on .sp-detail (which is transformed and
493
- lives inside another backdrop-filter ancestor, .sp-panel), so
494
- the translucent default is unreadable. Detection is a pure
495
- feature query: prefixed supported AND unprefixed not. No
496
- user-agent sniffing.
497
-
498
- Browsers where the glass effect renders correctly (most Chromium,
499
- modern Firefox, any engine that advertises both property names via
500
- CSS.supports) are unaffected. */
501
- @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
502
- .sp-detail {
503
- background: var(--sp-bg);
504
- }
505
- }
506
-
507
- @supports (-webkit-backdrop-filter: blur(1px)) and (not (backdrop-filter: blur(1px))) {
508
- .sp-detail {
509
- background: var(--sp-bg);
510
- }
511
- }
512
-
513
- /* ---- Header ---- */
514
-
515
- .sp-detail-header {
516
- display: flex;
517
- align-items: center;
518
- gap: 12px;
519
- padding: 16px 20px;
520
- border-bottom: 1px solid var(--sp-border);
521
- background: var(--sp-glass-bg-heavy);
522
- backdrop-filter: blur(var(--sp-blur));
523
- -webkit-backdrop-filter: blur(var(--sp-blur));
524
- flex-shrink: 0;
525
- min-height: 64px;
526
- }
527
-
528
- .sp-detail-back {
529
- width: 40px;
530
- height: 40px;
531
- border-radius: var(--sp-radius);
532
- border: none;
533
- background: transparent;
534
- cursor: pointer;
535
- display: flex;
536
- align-items: center;
537
- justify-content: center;
538
- color: var(--sp-text-tertiary);
539
- transition: all 0.2s ease;
540
- flex-shrink: 0;
541
- padding: 0;
542
- }
543
-
544
- .sp-detail-back:hover {
545
- background: var(--sp-bg-hover);
546
- color: var(--sp-text);
547
- }
548
-
549
- .sp-detail-back:active {
550
- transform: scale(0.92);
551
- transition-duration: 0.1s;
552
- }
553
-
554
- .sp-detail-back svg {
555
- width: 18px;
556
- height: 18px;
557
- }
558
-
559
- .sp-detail-title {
560
- font-size: 16px;
561
- font-weight: 700;
562
- color: var(--sp-text);
563
- letter-spacing: -0.02em;
564
- flex: 1;
565
- min-width: 0;
566
- overflow: hidden;
567
- text-overflow: ellipsis;
568
- white-space: nowrap;
569
- }
570
-
571
- .sp-detail-header .sp-badge {
572
- flex-shrink: 0;
573
- }
574
-
575
- /* ---- Content ---- */
576
-
577
- .sp-detail-content {
578
- flex: 1;
579
- overflow-y: auto;
580
- overflow-x: hidden;
581
- padding: 0;
582
- }
583
-
584
- .sp-detail-content::-webkit-scrollbar {
585
- width: 6px;
586
- }
587
-
588
- .sp-detail-content::-webkit-scrollbar-track {
589
- background: transparent;
590
- }
591
-
592
- .sp-detail-content::-webkit-scrollbar-thumb {
593
- background: var(--sp-border);
594
- border-radius: var(--sp-radius-full);
595
- }
596
-
597
- .sp-detail-content::-webkit-scrollbar-thumb:hover {
598
- background: var(--sp-text-tertiary);
599
- }
600
-
601
- /* ---- Section ---- */
602
-
603
- .sp-detail-section {
604
- padding: 20px 24px;
605
- border-bottom: 1px solid var(--sp-border);
606
- opacity: 0;
607
- transform: translateY(8px);
608
- animation: sp-detail-section-in 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
609
- }
610
-
611
- @keyframes sp-detail-section-in {
612
- to {
613
- opacity: 1;
614
- transform: translateY(0);
615
- }
616
- }
617
-
618
- .sp-detail-section:last-child {
619
- border-bottom: none;
620
- }
621
-
622
- .sp-detail-section-title {
623
- font-size: 11px;
624
- font-weight: 600;
625
- color: var(--sp-text-tertiary);
626
- text-transform: uppercase;
627
- letter-spacing: 0.06em;
628
- margin-bottom: 14px;
629
- display: flex;
630
- align-items: center;
631
- gap: 6px;
632
- }
633
-
634
- .sp-detail-section-title svg {
635
- width: 14px;
636
- height: 14px;
637
- opacity: 0.6;
638
- }
639
-
640
- /* ---- Status + Actions Section ---- */
641
-
642
- .sp-detail-status {
643
- display: flex;
644
- align-items: center;
645
- gap: 10px;
646
- margin-bottom: 16px;
647
- }
648
-
649
- .sp-detail-status-pill {
650
- display: inline-flex;
651
- align-items: center;
652
- gap: 6px;
653
- padding: 5px 14px;
654
- border-radius: var(--sp-radius-full);
655
- font-size: 12px;
656
- font-weight: 600;
657
- letter-spacing: 0.02em;
658
- }
659
-
660
- .sp-detail-status-pill--open {
661
- background: rgba(34, 197, 94, 0.1);
662
- color: #22c55e;
663
- border: 1px solid rgba(34, 197, 94, 0.2);
664
- }
665
-
666
- .sp-detail-status-pill--resolved {
667
- background: rgba(156, 163, 175, 0.1);
668
- color: #9ca3af;
669
- border: 1px solid rgba(156, 163, 175, 0.2);
670
- }
671
-
672
- .sp-detail-status-pill--in-progress {
673
- background: rgba(245, 158, 11, 0.1);
674
- color: #f59e0b;
675
- border: 1px solid rgba(245, 158, 11, 0.2);
676
- }
677
-
678
- .sp-detail-status-pill--wont-fix {
679
- background: rgba(148, 163, 184, 0.1);
680
- color: #94a3b8;
681
- border: 1px solid rgba(148, 163, 184, 0.2);
682
- }
683
-
684
- .sp-detail-status-dot {
685
- width: 6px;
686
- height: 6px;
687
- border-radius: 50%;
688
- flex-shrink: 0;
689
- }
690
-
691
- .sp-detail-actions {
692
- display: flex;
693
- gap: 8px;
694
- }
695
-
696
- .sp-detail-actions button {
697
- flex: 1;
698
- height: 40px;
699
- padding: 0 16px;
700
- border-radius: var(--sp-radius);
701
- font-family: var(--sp-font);
702
- font-size: 13px;
703
- font-weight: 600;
704
- cursor: pointer;
705
- display: flex;
706
- align-items: center;
707
- justify-content: center;
708
- gap: 6px;
709
- transition: all 0.2s ease;
710
- }
711
-
712
- .sp-detail-actions button svg {
713
- width: 15px;
714
- height: 15px;
715
- }
716
-
717
- .sp-detail-btn-resolve {
718
- border: 1.5px solid #22c55e;
719
- background: rgba(34, 197, 94, 0.06);
720
- color: #22c55e;
721
- }
722
-
723
- .sp-detail-btn-resolve:hover {
724
- background: rgba(34, 197, 94, 0.14);
725
- box-shadow: 0 0 16px rgba(34, 197, 94, 0.12);
726
- transform: translateY(-1px);
727
- }
728
-
729
- .sp-detail-btn-resolve:active {
730
- transform: translateY(0) scale(0.98);
731
- transition-duration: 0.1s;
732
- }
733
-
734
- .sp-detail-btn-reopen {
735
- border: 1.5px solid var(--sp-accent);
736
- background: var(--sp-accent-light);
737
- color: var(--sp-accent);
738
- }
739
-
740
- .sp-detail-btn-reopen:hover {
741
- background: rgba(var(--sp-accent), 0.14);
742
- box-shadow: 0 0 16px var(--sp-accent-glow);
743
- transform: translateY(-1px);
744
- }
745
-
746
- .sp-detail-btn-reopen:active {
747
- transform: translateY(0) scale(0.98);
748
- transition-duration: 0.1s;
749
- }
750
-
751
- .sp-detail-btn-delete {
752
- border: 1.5px solid #ef4444;
753
- background: rgba(239, 68, 68, 0.06);
754
- color: #ef4444;
755
- }
756
-
757
- .sp-detail-btn-delete:hover {
758
- background: rgba(239, 68, 68, 0.14);
759
- box-shadow: 0 0 16px rgba(239, 68, 68, 0.12);
760
- transform: translateY(-1px);
761
- }
762
-
763
- .sp-detail-btn-delete:active {
764
- transform: translateY(0) scale(0.98);
765
- transition-duration: 0.1s;
766
- }
767
-
768
- .sp-detail-actions button:disabled {
769
- opacity: 0.5;
770
- cursor: not-allowed;
771
- pointer-events: none;
772
- transform: none;
773
- box-shadow: none;
774
- }
775
-
776
- /* ---- Message Section ---- */
777
-
778
- .sp-detail-message {
779
- font-size: 14px;
780
- line-height: 1.65;
781
- color: var(--sp-text);
782
- padding: 14px 16px;
783
- border-left: 3px solid var(--sp-accent);
784
- border-radius: 0 var(--sp-radius) var(--sp-radius) 0;
785
- background: var(--sp-glass-bg-heavy);
786
- white-space: pre-wrap;
787
- word-break: break-word;
788
- }
789
-
790
- /* ---- Screenshot Section ---- */
791
-
792
- .sp-detail-screenshot {
793
- display: block;
794
- width: 100%;
795
- height: auto;
796
- max-height: 400px;
797
- object-fit: contain;
798
- border-radius: var(--sp-radius);
799
- border: 1px solid var(--sp-glass-border);
800
- background: var(--sp-glass-bg-heavy);
801
- }
802
-
803
- /* ---- Metadata Section ---- */
804
-
805
- .sp-detail-meta {
806
- display: flex;
807
- flex-direction: column;
808
- gap: 14px;
809
- }
810
-
811
- .sp-detail-meta-row {
812
- display: flex;
813
- align-items: flex-start;
814
- gap: 12px;
815
- }
816
-
817
- .sp-detail-meta-row svg {
818
- width: 14px;
819
- height: 14px;
820
- color: var(--sp-text-tertiary);
821
- flex-shrink: 0;
822
- margin-top: 1px;
823
- }
824
-
825
- .sp-detail-meta-content {
826
- flex: 1;
827
- min-width: 0;
828
- }
829
-
830
- .sp-detail-meta-label {
831
- font-size: 10px;
832
- font-weight: 600;
833
- color: var(--sp-text-tertiary);
834
- text-transform: uppercase;
835
- letter-spacing: 0.06em;
836
- line-height: 1;
837
- margin-bottom: 4px;
838
- }
839
-
840
- .sp-detail-meta-value {
841
- font-size: 13px;
842
- line-height: 1.4;
843
- color: var(--sp-text);
844
- word-break: break-all;
845
- }
846
-
847
- .sp-detail-meta-value--mono {
848
- font-family: "SF Mono", "Cascadia Code", "Fira Code", "Consolas", monospace;
849
- font-size: 12px;
850
- background: var(--sp-glass-bg-heavy);
851
- padding: 2px 6px;
852
- border-radius: 4px;
853
- border: 1px solid var(--sp-glass-border-subtle);
854
- }
855
-
856
- .sp-detail-meta-value--secondary {
857
- color: var(--sp-text-secondary);
858
- font-size: 12px;
859
- }
860
-
861
- /* ---- Annotation Section ---- */
862
-
863
- .sp-detail-annotation {
864
- display: flex;
865
- flex-direction: column;
866
- gap: 12px;
867
- }
868
-
869
- .sp-detail-annotation-info {
870
- display: flex;
871
- flex-direction: column;
872
- gap: 10px;
873
- padding: 14px;
874
- border-radius: var(--sp-radius);
875
- background: var(--sp-glass-bg-heavy);
876
- border: 1px solid var(--sp-glass-border-subtle);
877
- }
878
-
879
- .sp-detail-annotation-row {
880
- display: flex;
881
- align-items: flex-start;
882
- gap: 10px;
883
- }
884
-
885
- .sp-detail-annotation-row svg {
886
- width: 13px;
887
- height: 13px;
888
- color: var(--sp-text-tertiary);
889
- flex-shrink: 0;
890
- margin-top: 2px;
891
- }
892
-
893
- .sp-detail-annotation-label {
894
- font-size: 10px;
895
- font-weight: 600;
896
- color: var(--sp-text-tertiary);
897
- text-transform: uppercase;
898
- letter-spacing: 0.06em;
899
- line-height: 1;
900
- margin-bottom: 3px;
901
- }
902
-
903
- .sp-detail-annotation-value {
904
- font-size: 12px;
905
- line-height: 1.4;
906
- color: var(--sp-text);
907
- word-break: break-all;
908
- }
909
-
910
- .sp-detail-annotation-value--mono {
911
- font-family: "SF Mono", "Cascadia Code", "Fira Code", "Consolas", monospace;
912
- font-size: 11px;
913
- background: var(--sp-bg-hover);
914
- padding: 2px 6px;
915
- border-radius: 4px;
916
- display: inline-block;
917
- max-width: 100%;
918
- overflow: hidden;
919
- text-overflow: ellipsis;
920
- white-space: nowrap;
921
- }
922
-
923
- .sp-detail-btn-goto {
924
- width: 100%;
925
- height: 44px;
926
- padding: 0 20px;
927
- border-radius: var(--sp-radius);
928
- border: none;
929
- background: var(--sp-accent-gradient);
930
- color: #fff;
931
- font-family: var(--sp-font);
932
- font-size: 14px;
933
- font-weight: 600;
934
- cursor: pointer;
935
- display: flex;
936
- align-items: center;
937
- justify-content: center;
938
- gap: 8px;
939
- transition: all 0.25s ease;
940
- box-shadow: 0 2px 12px var(--sp-accent-glow);
941
- }
942
-
943
- .sp-detail-btn-goto svg {
944
- width: 16px;
945
- height: 16px;
946
- }
947
-
948
- .sp-detail-btn-goto:hover {
949
- box-shadow: 0 4px 20px var(--sp-accent-glow);
950
- transform: translateY(-2px);
951
- }
952
-
953
- .sp-detail-btn-goto:active {
954
- transform: translateY(0) scale(0.98);
955
- transition-duration: 0.1s;
956
- }
957
-
958
- /* ---- Forced Colors / High Contrast ---- */
959
-
960
- @media (forced-colors: active) {
961
- .sp-detail {
962
- border: 2px solid ButtonText !important;
963
- background: Canvas !important;
964
- }
965
-
966
- .sp-detail-back,
967
- .sp-detail-btn-goto,
968
- .sp-detail-btn-resolve,
969
- .sp-detail-btn-reopen,
970
- .sp-detail-btn-delete {
971
- border: 2px solid ButtonText !important;
972
- background: Canvas !important;
973
- color: ButtonText !important;
974
- }
975
-
976
- .sp-detail-back:focus-visible,
977
- .sp-detail-btn-goto:focus-visible,
978
- .sp-detail-btn-resolve:focus-visible,
979
- .sp-detail-btn-reopen:focus-visible,
980
- .sp-detail-btn-delete:focus-visible {
981
- outline: 3px solid Highlight !important;
982
- }
983
-
984
- .sp-detail-status-pill {
985
- border: 2px solid ButtonText !important;
986
- background: Canvas !important;
987
- color: ButtonText !important;
988
- }
989
-
990
- .sp-detail-message {
991
- border-left: 3px solid ButtonText !important;
992
- }
993
- }
994
-
995
- /* ---- Diagnostics Section ---- */
996
-
997
- .sp-detail-diag {
998
- display: flex;
999
- flex-direction: column;
1000
- gap: 12px;
1001
- }
1002
-
1003
- .sp-detail-diag-toggle {
1004
- width: 100%;
1005
- display: flex;
1006
- align-items: center;
1007
- justify-content: space-between;
1008
- gap: 8px;
1009
- padding: 10px 12px;
1010
- border-radius: var(--sp-radius);
1011
- border: 1px solid var(--sp-glass-border-subtle);
1012
- background: var(--sp-glass-bg-heavy);
1013
- color: var(--sp-text);
1014
- font-family: var(--sp-font);
1015
- font-size: 12px;
1016
- font-weight: 600;
1017
- cursor: pointer;
1018
- transition: background 0.15s ease;
1019
- }
1020
-
1021
- .sp-detail-diag-toggle:hover {
1022
- background: var(--sp-bg-hover);
1023
- }
1024
-
1025
- .sp-detail-diag-toggle svg {
1026
- width: 12px;
1027
- height: 12px;
1028
- transition: transform 0.2s ease;
1029
- }
1030
-
1031
- .sp-detail-diag-toggle[aria-expanded="true"] svg {
1032
- transform: rotate(90deg);
1033
- }
1034
-
1035
- .sp-detail-diag-counts {
1036
- display: inline-flex;
1037
- gap: 6px;
1038
- font-weight: 500;
1039
- color: var(--sp-text-tertiary);
1040
- }
1041
-
1042
- .sp-detail-diag-count {
1043
- padding: 1px 7px;
1044
- border-radius: var(--sp-radius-full);
1045
- background: var(--sp-bg-hover);
1046
- font-variant-numeric: tabular-nums;
1047
- }
1048
-
1049
- .sp-detail-diag-count--errors {
1050
- background: rgba(239, 68, 68, 0.14);
1051
- color: #ef4444;
1052
- }
1053
-
1054
- .sp-detail-diag-body {
1055
- display: none;
1056
- flex-direction: column;
1057
- gap: 14px;
1058
- }
1059
-
1060
- .sp-detail-diag-body--open {
1061
- display: flex;
1062
- }
1063
-
1064
- .sp-detail-diag-group-title {
1065
- font-size: 10px;
1066
- font-weight: 700;
1067
- color: var(--sp-text-tertiary);
1068
- text-transform: uppercase;
1069
- letter-spacing: 0.06em;
1070
- margin-bottom: 6px;
1071
- }
1072
-
1073
- .sp-detail-diag-list {
1074
- list-style: none;
1075
- padding: 0;
1076
- margin: 0;
1077
- border-radius: var(--sp-radius);
1078
- border: 1px solid var(--sp-glass-border-subtle);
1079
- background: var(--sp-glass-bg-heavy);
1080
- max-height: 240px;
1081
- overflow-y: auto;
1082
- }
1083
-
1084
- .sp-detail-diag-list li {
1085
- display: flex;
1086
- align-items: flex-start;
1087
- gap: 8px;
1088
- padding: 8px 10px;
1089
- border-bottom: 1px solid var(--sp-glass-border-subtle);
1090
- font-family: "SF Mono", "Cascadia Code", "Fira Code", "Consolas", monospace;
1091
- font-size: 11px;
1092
- line-height: 1.45;
1093
- color: var(--sp-text);
1094
- }
1095
-
1096
- .sp-detail-diag-list li:last-child {
1097
- border-bottom: none;
1098
- }
1099
-
1100
- .sp-detail-diag-level {
1101
- flex-shrink: 0;
1102
- font-weight: 700;
1103
- width: 44px;
1104
- text-transform: uppercase;
1105
- letter-spacing: 0.04em;
1106
- font-size: 10px;
1107
- }
1108
-
1109
- .sp-detail-diag-level--log {
1110
- color: var(--sp-text-tertiary);
1111
- }
1112
- .sp-detail-diag-level--info {
1113
- color: #3b82f6;
1114
- }
1115
- .sp-detail-diag-level--warn {
1116
- color: #f59e0b;
1117
- }
1118
- .sp-detail-diag-level--error {
1119
- color: #ef4444;
1120
- }
1121
-
1122
- .sp-detail-diag-message {
1123
- flex: 1;
1124
- min-width: 0;
1125
- word-break: break-word;
1126
- white-space: pre-wrap;
1127
- }
1128
-
1129
- .sp-detail-diag-net {
1130
- display: grid;
1131
- grid-template-columns: auto 1fr auto;
1132
- gap: 8px;
1133
- align-items: center;
1134
- }
1135
-
1136
- .sp-detail-diag-net-status {
1137
- flex-shrink: 0;
1138
- font-weight: 700;
1139
- color: #ef4444;
1140
- min-width: 32px;
1141
- text-align: right;
1142
- font-variant-numeric: tabular-nums;
1143
- }
1144
-
1145
- .sp-detail-diag-net-method {
1146
- flex-shrink: 0;
1147
- font-weight: 600;
1148
- color: var(--sp-text-tertiary);
1149
- min-width: 44px;
1150
- }
1151
-
1152
- .sp-detail-diag-net-url {
1153
- flex: 1;
1154
- min-width: 0;
1155
- overflow: hidden;
1156
- text-overflow: ellipsis;
1157
- white-space: nowrap;
1158
- color: var(--sp-text);
1159
- }
1160
-
1161
- .sp-detail-diag-empty {
1162
- padding: 12px;
1163
- font-style: italic;
1164
- font-size: 11px;
1165
- color: var(--sp-text-tertiary);
1166
- text-align: center;
1167
- }
1168
-
1169
- /* ---- Reduced Motion ---- */
1170
-
1171
- @media (prefers-reduced-motion: reduce) {
1172
- .sp-detail {
1173
- transition-duration: 0.01ms !important;
1174
- }
1175
-
1176
- .sp-detail-section {
1177
- animation-duration: 0.01ms !important;
1178
- }
1179
- }
1180
- `;function Pe(t){if(/Edg\//i.test(t)){let e=t.match(/Edg\/([\d.]+)/);return e?`Edge ${e[1]}`:"Edge"}if(/OPR\//i.test(t)||/Opera/i.test(t)){let e=t.match(/OPR\/([\d.]+)/);return e?`Opera ${e[1]}`:"Opera"}if(/Firefox\//i.test(t)){let e=t.match(/Firefox\/([\d.]+)/);return e?`Firefox ${e[1]}`:"Firefox"}if(/Chrome\//i.test(t)&&!/Chromium/i.test(t)){let e=t.match(/Chrome\/([\d.]+)/);return e?`Chrome ${e[1]}`:"Chrome"}if(/Safari\//i.test(t)&&!/Chrome/i.test(t)){let e=t.match(/Version\/([\d.]+)/);return e?`Safari ${e[1]}`:"Safari"}return "Unknown"}function te(t,e){try{return new Date(t).toLocaleString(e,{year:"numeric",month:"long",day:"numeric",hour:"2-digit",minute:"2-digit"})}catch{return t}}function Oe(t){try{return new URL(t).pathname}catch{return t}}function Ne(t){return !!(/^data:image\/(jpeg|png|webp);/i.test(t)||/^https:\/\//i.test(t))}function L(t,e){return t.length<=e?t:t.slice(0,e-1)+"\u2026"}function De(t){if(!t)return false;let e=Array.isArray(t.console)?t.console.length:0,s=Array.isArray(t.network)?t.network.length:0;return e>0||s>0}function He(t){return !Number.isFinite(t)||t<0?"\u2014":t<1e3?`${Math.round(t)} ms`:`${(t/1e3).toFixed(1)} s`}var se=class{constructor(e,s,n,r){this.colors=e;this.callbacks=s;this.t=n,this.locale=r,this.element=o("div",{class:"sp-detail"}),this.element.setAttribute("role","dialog"),this.element.setAttribute("aria-label","Feedback detail"),this.element.setAttribute("aria-hidden","true");let i=o("div",{class:"sp-detail-header"}),l=document.createElement("button");l.type="button",l.className="sp-detail-back",l.setAttribute("aria-label",this.t("detail.back")),l.appendChild(c(Se)),l.addEventListener("click",()=>{this.hide(),this.callbacks.onBack();}),this.element.appendChild(i),i.appendChild(l),this.content=o("div",{class:"sp-detail-content"}),this.element.appendChild(this.content);}colors;callbacks;element;_isVisible=false;currentFeedback=null;content;t;locale;resolveBtn=null;deleteBtn=null;isProcessing=false;show(e,s){this.currentFeedback=e,this.isProcessing=false;let n=this.element.querySelector(".sp-detail-header");if(!n)return;let r=n.querySelector(".sp-detail-back");if(!r)return;n.replaceChildren(r);let i=o("span",{class:"sp-detail-title"});a(i,this.t("detail.title").replace("{number}",String(s))),n.appendChild(i);let l=o("span",{class:"sp-badge"});l.style.background=$(e.type,this.colors),l.style.color=M(e.type,this.colors),a(l,e.type),n.appendChild(l),this.content.replaceChildren();let d=0,p=this.buildSection(d++);this.buildStatusActions(p,e),this.content.appendChild(p);let h=this.buildSection(d++),u=o("div",{class:"sp-detail-section-title"});a(u,this.t("detail.message")),h.appendChild(u);let v=o("div",{class:"sp-detail-message"});if(v.style.borderLeftColor=M(e.type,this.colors),a(v,e.message),h.appendChild(v),this.content.appendChild(h),e.screenshotUrl&&Ne(e.screenshotUrl)){let g=this.buildSection(d++),x=o("div",{class:"sp-detail-section-title"});a(x,this.t("detail.screenshot")),g.appendChild(x);let b=document.createElement("img");b.className="sp-detail-screenshot",b.src=e.screenshotUrl,b.alt=this.t("detail.screenshotAlt"),b.loading="lazy",b.referrerPolicy="no-referrer",g.appendChild(b),this.content.appendChild(g);}let m=this.buildSection(d++),f=o("div",{class:"sp-detail-section-title"});if(a(f,this.t("detail.metadata")),m.appendChild(f),this.buildMetadata(m,e),this.content.appendChild(m),e.annotations.length>0){let g=this.buildSection(d++),x=o("div",{class:"sp-detail-section-title"});x.appendChild(c(H));let b=o("span");a(b,this.t("detail.annotation")),x.appendChild(b),g.appendChild(x),this.buildAnnotation(g,e),this.content.appendChild(g);}if(De(e.diagnostics)){let g=this.buildSection(d++),x=o("div",{class:"sp-detail-section-title"});x.appendChild(c(Me));let b=o("span");a(b,this.t("detail.diagnostics")),x.appendChild(b),g.appendChild(x),this.buildDiagnostics(g,e),this.content.appendChild(g);}this._isVisible=true,this.element.setAttribute("aria-hidden","false"),this.element.offsetHeight,this.element.classList.add("sp-detail--visible"),requestAnimationFrame(()=>{r.focus();});}hide(){this._isVisible&&(this._isVisible=false,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 s=o("div",{class:"sp-detail-section"});return s.style.animationDelay=`${e*40}ms`,s}buildStatusActions(e,s){let n=C(s.status),r=o("div",{class:"sp-detail-section-title"});a(r,this.t("detail.status")),e.appendChild(r);let i=s.status.replace(/_/g,"-"),l={open:"#22c55e",in_progress:"#f59e0b",resolved:"#9ca3af",wont_fix:"#94a3b8"},d=o("div",{class:"sp-detail-status"}),p=o("span",{class:`sp-detail-status-pill sp-detail-status-pill--${i}`}),h=o("span",{class:"sp-detail-status-dot"});h.style.background=l[s.status]??l.open,p.appendChild(h);let u=o("span");a(u,G(s.status,this.t)),p.appendChild(u),d.appendChild(p),e.appendChild(d);let v=o("div",{class:"sp-detail-actions"});if(this.resolveBtn=document.createElement("button"),this.resolveBtn.type="button",n){this.resolveBtn.className="sp-detail-btn-reopen",this.resolveBtn.appendChild(c(Z));let f=document.createElement("span");a(f,this.t("detail.reopen")),this.resolveBtn.appendChild(f);}else {this.resolveBtn.className="sp-detail-btn-resolve",this.resolveBtn.appendChild(c(I));let f=document.createElement("span");a(f,this.t("detail.resolve")),this.resolveBtn.appendChild(f);}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(c(ee));let m=document.createElement("span");a(m,this.t("detail.delete")),this.deleteBtn.appendChild(m),this.deleteBtn.addEventListener("click",()=>this.handleDelete()),v.appendChild(this.resolveBtn),v.appendChild(this.deleteBtn),e.appendChild(v);}buildMetadata(e,s){let n=o("div",{class:"sp-detail-meta"});if(this.addMetaRow(n,Ee,this.t("detail.page"),()=>{let r=o("div",{class:"sp-detail-meta-value"}),i=Oe(s.url);return a(r,L(i,60)),r.title=s.url,r}),this.addMetaRow(n,Te,this.t("detail.author"),()=>{let r=o("div",{class:"sp-detail-meta-value"}),i=s.authorName||"Anonymous",l=s.authorEmail;return a(r,l?`${i} (${l})`:i),r}),this.addMetaRow(n,Be,this.t("detail.date"),()=>{let r=o("div",{class:"sp-detail-meta-value"});return a(r,te(s.createdAt,this.locale.startsWith("fr")?"fr":"en")),r}),this.addMetaRow(n,Ae,this.t("detail.viewport"),()=>{let r=o("div",{class:"sp-detail-meta-value sp-detail-meta-value--mono"});return a(r,s.viewport||"Unknown"),r}),this.addMetaRow(n,'<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.t("detail.browser"),()=>{let r=o("div",{class:"sp-detail-meta-value"});return a(r,Pe(s.userAgent)),r}),s.resolvedAt){let r=s.resolvedAt,i=s.status==="wont_fix"?this.t("detail.closedAt"):this.t("detail.resolvedAt");this.addMetaRow(n,I,i,()=>{let l=o("div",{class:"sp-detail-meta-value sp-detail-meta-value--secondary"});return a(l,te(r,this.locale.startsWith("fr")?"fr":"en")),l});}e.appendChild(n);}addMetaRow(e,s,n,r){let i=o("div",{class:"sp-detail-meta-row"});i.appendChild(c(s));let l=o("div",{class:"sp-detail-meta-content"}),d=o("div",{class:"sp-detail-meta-label"});a(d,n),l.appendChild(d),l.appendChild(r()),i.appendChild(l),e.appendChild(i);}buildAnnotation(e,s){let n=s.annotations[0];if(!n)return;let r=o("div",{class:"sp-detail-annotation"}),i=o("div",{class:"sp-detail-annotation-info"});this.addAnnotationRow(i,Le,this.t("detail.element"),()=>{let p=o("span",{class:"sp-detail-annotation-value sp-detail-annotation-value--mono"}),h=n.elementId?`<${n.elementTag}#${n.elementId}>`:`<${n.elementTag}>`;return a(p,h),p}),this.addAnnotationRow(i,Re,this.t("detail.selector"),()=>{let p=o("span",{class:"sp-detail-annotation-value sp-detail-annotation-value--mono"});return a(p,L(n.cssSelector,60)),p.title=n.cssSelector,p}),this.addAnnotationRow(i,H,this.t("detail.position"),()=>{let p=o("span",{class:"sp-detail-annotation-value"});return a(p,`${n.xPct.toFixed(1)}%, ${n.yPct.toFixed(1)}%`+(n.wPct>0||n.hPct>0?` (${n.wPct.toFixed(1)}% \xD7 ${n.hPct.toFixed(1)}%)`:"")),p}),r.appendChild(i);let l=document.createElement("button");l.type="button",l.className="sp-detail-btn-goto",l.appendChild(c(H));let d=document.createElement("span");a(d,this.t("detail.goToAnnotation")),l.appendChild(d),l.addEventListener("click",()=>{this.currentFeedback&&this.callbacks.onGoToAnnotation(this.currentFeedback);}),r.appendChild(l),e.appendChild(r);}buildDiagnostics(e,s){let n=s.diagnostics;if(!n)return;let r=Array.isArray(n.console)?n.console:[],i=Array.isArray(n.network)?n.network:[],l=r.filter(x=>x.level==="error").length,d=o("div",{class:"sp-detail-diag"}),p=document.createElement("button");p.type="button",p.className="sp-detail-diag-toggle",p.setAttribute("aria-expanded","false"),p.setAttribute("aria-label",this.t("detail.diagnostics.expand"));let h=document.createElement("span"),u=document.createElement("span");u.style.display="inline-flex",u.style.alignItems="center",u.style.gap="8px",u.appendChild(c(Fe)),a(h,this.t("detail.diagnostics")),u.appendChild(h),p.appendChild(u);let v=o("span",{class:"sp-detail-diag-counts"}),m=o("span",{class:`sp-detail-diag-count${l>0?" sp-detail-diag-count--errors":""}`});a(m,`${r.length} console`);let f=o("span",{class:`sp-detail-diag-count${i.length>0?" sp-detail-diag-count--errors":""}`});a(f,`${i.length} net`),v.appendChild(m),v.appendChild(f),p.appendChild(v);let g=o("div",{class:"sp-detail-diag-body"});if(r.length>0){let x=document.createElement("div"),b=o("div",{class:"sp-detail-diag-group-title"});a(b,this.t("detail.diagnostics.console")),x.appendChild(b);let w=document.createElement("ul");w.className="sp-detail-diag-list";for(let y of r){let k=document.createElement("li"),B=o("span",{class:`sp-detail-diag-level sp-detail-diag-level--${y.level}`});a(B,y.level);let S=o("span",{class:"sp-detail-diag-message"});a(S,L(y.message,240)),S.title=y.message,k.appendChild(B),k.appendChild(S),w.appendChild(k);}x.appendChild(w),g.appendChild(x);}if(i.length>0){let x=document.createElement("div"),b=o("div",{class:"sp-detail-diag-group-title"});a(b,this.t("detail.diagnostics.network")),x.appendChild(b);let w=document.createElement("ul");w.className="sp-detail-diag-list";for(let y of i){let k=document.createElement("li");k.classList.add("sp-detail-diag-net");let B=o("span",{class:"sp-detail-diag-net-status"});a(B,y.status===0?"ERR":String(y.status));let S=o("span",{class:"sp-detail-diag-net-method"});a(S,y.method);let R=o("span",{class:"sp-detail-diag-net-url"});a(R,L(y.url,120)),R.title=`${y.url} \u2014 ${He(y.durationMs)}`,k.appendChild(B),k.appendChild(S),k.appendChild(R),w.appendChild(k);}x.appendChild(w),g.appendChild(x);}p.addEventListener("click",()=>{let b=!(p.getAttribute("aria-expanded")==="true");p.setAttribute("aria-expanded",String(b)),p.setAttribute("aria-label",b?this.t("detail.diagnostics.collapse"):this.t("detail.diagnostics.expand")),g.classList.toggle("sp-detail-diag-body--open",b);}),d.appendChild(p),d.appendChild(g),e.appendChild(d);}addAnnotationRow(e,s,n,r){let i=o("div",{class:"sp-detail-annotation-row"});i.appendChild(c(s));let l=o("div",{class:"sp-detail-meta-content"}),d=o("div",{class:"sp-detail-annotation-label"});a(d,n),l.appendChild(d),l.appendChild(r()),i.appendChild(l),e.appendChild(i);}async handleResolve(){if(!(this.isProcessing||!this.currentFeedback)){this.isProcessing=true,this.resolveBtn&&this.setButtonLoading(this.resolveBtn),this.deleteBtn&&(this.deleteBtn.disabled=true);try{await this.callbacks.onResolve(this.currentFeedback);}catch{this.isProcessing=false,this.resolveBtn&&this.restoreResolveBtn(this.currentFeedback),this.deleteBtn&&(this.deleteBtn.disabled=false);}}}async handleDelete(){if(!(this.isProcessing||!this.currentFeedback)){this.isProcessing=true,this.deleteBtn&&this.setButtonLoading(this.deleteBtn),this.resolveBtn&&(this.resolveBtn.disabled=true);try{await this.callbacks.onDelete(this.currentFeedback);}catch{this.isProcessing=false,this.deleteBtn&&this.restoreDeleteBtn(),this.resolveBtn&&(this.resolveBtn.disabled=false);}}}setButtonLoading(e){e.disabled=true,e.replaceChildren(o("div",{class:"sp-spinner sp-spinner--sm"}));}restoreResolveBtn(e){if(!this.resolveBtn)return;this.resolveBtn.disabled=false,this.resolveBtn.replaceChildren();let s=C(e.status);this.resolveBtn.appendChild(c(s?Z:I));let n=document.createElement("span");a(n,s?this.t("detail.reopen"):this.t("detail.resolve")),this.resolveBtn.appendChild(n);}restoreDeleteBtn(){if(!this.deleteBtn)return;this.deleteBtn.disabled=false,this.deleteBtn.replaceChildren(),this.deleteBtn.appendChild(c(ee));let e=document.createElement("span");a(e,this.t("detail.delete")),this.deleteBtn.appendChild(e);}};var 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="M11 5h10"/><path d="M11 9h7"/><path d="M11 13h4"/><path d="M3 17l3 3 3-3"/><path d="M6 18V4"/></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="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>',_e='<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>',ne={question:0,change:1,bug:2,other:3};function Qt(t,e){let s=[...t];switch(e){case "newest":s.sort((n,r)=>new Date(r.createdAt).getTime()-new Date(n.createdAt).getTime());break;case "oldest":s.sort((n,r)=>new Date(n.createdAt).getTime()-new Date(r.createdAt).getTime());break;case "by-type":s.sort((n,r)=>{let i=ne[n.type]??99,l=ne[r.type]??99;return i!==l?i-l:new Date(r.createdAt).getTime()-new Date(n.createdAt).getTime()});break;case "open-first":s.sort((n,r)=>{let i=C(n.status)?1:0,l=C(r.status)?1:0;return i!==l?i-l:new Date(r.createdAt).getTime()-new Date(n.createdAt).getTime()});break}return s}function je(t){try{return new URL(t).pathname}catch{return t}}function $e(t,e){if(t.length<=e)return t;let s="\u2026",n=Math.floor((e-1)/2);return t.slice(0,n)+s+t.slice(-n)}function Jt(t){let e=new Map;for(let n of t){let r=je(n.url),i=e.get(r);i?i.push(n):e.set(r,[n]);}return new Map([...e.entries()].sort((n,r)=>r[1].length-n[1].length))}function Zt(t,e,s){let n=o("div",{class:"sp-group-header"});n.setAttribute("role","button"),n.setAttribute("tabindex","0"),n.setAttribute("aria-expanded","true"),n.style.borderBottomColor=s.border;let r=o("span",{class:"sp-group-header-chevron"});r.appendChild(c(_e)),n.appendChild(r);let i=o("span",{class:"sp-group-header-icon"});i.appendChild(c(oe)),n.appendChild(i);let l=o("span",{class:"sp-group-header-path"}),d=$e(t,40);a(l,d),t.length>40&&(l.title=t),n.appendChild(l);let p=o("span",{class:"sp-group-header-count"});p.style.background=s.accentLight,p.style.color=s.accent,a(p,String(e)),n.appendChild(p);let h=()=>{let u=n.getAttribute("aria-expanded")==="true";n.setAttribute("aria-expanded",String(!u)),n.classList.toggle("sp-group-header--collapsed",u);let v=n.nextElementSibling;v?.classList.contains("sp-group-content")&&v.classList.toggle("sp-group-content--collapsed",u);};return n.addEventListener("click",h),n.addEventListener("keydown",u=>{(u.key==="Enter"||u.key===" ")&&(u.preventDefault(),h());}),n}var re=class{element;_sortMode="newest";_groupByPage=false;menuEl=null;sortBtn;groupToggle;t;colors;onChange;outsideClickHandler=null;constructor(e,s,n){this.colors=e,this.onChange=s,this.t=n,this.element=o("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.t("sort.label"));let r=c(Ie);this.sortBtn.appendChild(r);let i=o("span",{class:"sp-sort-btn-label"});a(i,this.t("sort.newest")),this.sortBtn.appendChild(i),this.sortBtn.addEventListener("click",p=>{p.stopPropagation(),this.toggleMenu();}),this.groupToggle=document.createElement("button"),this.groupToggle.className="sp-group-toggle",this.groupToggle.setAttribute("aria-pressed","false");let l=c(oe);this.groupToggle.appendChild(l);let d=o("span",{class:"sp-group-toggle-label"});a(d,this.t("group.byPage")),this.groupToggle.appendChild(d),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=o("div",{class:"sp-sort-menu"}),this.menuEl.setAttribute("role","listbox"),this.menuEl.setAttribute("aria-label",this.t("sort.label")),this.sortBtn.setAttribute("aria-expanded","true");let e=[{mode:"newest",label:this.t("sort.newest")},{mode:"oldest",label:this.t("sort.oldest")},{mode:"by-type",label:this.t("sort.byType")},{mode:"open-first",label:this.t("sort.openFirst")}];for(let s of e){let n=document.createElement("button");n.className=`sp-sort-option${s.mode===this._sortMode?" sp-sort-option--active":""}`,n.setAttribute("role","option"),n.setAttribute("aria-selected",String(s.mode===this._sortMode)),s.mode===this._sortMode&&(n.style.background=this.colors.accentLight,n.style.color=this.colors.accent),a(n,s.label),n.addEventListener("click",r=>{r.stopPropagation(),this._sortMode=s.mode,this.updateSortLabel(),this.closeMenu(),this.onChange();}),this.menuEl.appendChild(n);}this.element.appendChild(this.menuEl),requestAnimationFrame(()=>{this.outsideClickHandler=s=>{this.menuEl&&!this.element.contains(s.target)&&this.closeMenu();},document.addEventListener("click",this.outsideClickHandler,true);}),this.menuEl.addEventListener("keydown",s=>{s.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,true),this.outsideClickHandler=null);}updateSortLabel(){let e={newest:this.t("sort.newest"),oldest:this.t("sort.oldest"),"by-type":this.t("sort.byType"),"open-first":this.t("sort.openFirst")},s=this.sortBtn.querySelector(".sp-sort-btn-label");s&&a(s,e[this._sortMode]);}destroy(){this.closeMenu();}},es=`
1181
- /* ============================
1182
- Sort Controls Container
1183
- ============================ */
1184
-
1185
- .sp-sort-controls {
1186
- display: flex;
1187
- align-items: center;
1188
- gap: 6px;
1189
- margin-top: 4px;
1190
- padding-top: 8px;
1191
- border-top: 1px solid var(--sp-border);
1192
- }
1193
-
1194
- /* ============================
1195
- Sort Dropdown Button
1196
- ============================ */
1197
-
1198
- .sp-sort-btn {
1199
- display: inline-flex;
1200
- align-items: center;
1201
- gap: 5px;
1202
- padding: 5px 12px;
1203
- border-radius: var(--sp-radius-full);
1204
- border: 1px solid var(--sp-border);
1205
- background: var(--sp-glass-bg-heavy);
1206
- color: var(--sp-text-secondary);
1207
- font-family: var(--sp-font);
1208
- font-size: 12px;
1209
- font-weight: 500;
1210
- cursor: pointer;
1211
- white-space: nowrap;
1212
- transition: all 0.2s ease;
1213
- position: relative;
1214
- }
1215
-
1216
- .sp-sort-btn svg {
1217
- width: 14px;
1218
- height: 14px;
1219
- flex-shrink: 0;
1220
- }
1221
-
1222
- .sp-sort-btn:hover {
1223
- border-color: var(--sp-accent);
1224
- color: var(--sp-accent);
1225
- background: var(--sp-accent-light);
1226
- }
1227
-
1228
- .sp-sort-btn[aria-expanded="true"] {
1229
- border-color: var(--sp-accent);
1230
- color: var(--sp-accent);
1231
- background: var(--sp-accent-light);
1232
- }
1233
-
1234
- /* ============================
1235
- Sort Floating Menu
1236
- ============================ */
1237
-
1238
- .sp-sort-menu {
1239
- position: absolute;
1240
- top: calc(100% + 6px);
1241
- left: 0;
1242
- min-width: 170px;
1243
- padding: 4px;
1244
- border-radius: var(--sp-radius);
1245
- background: var(--sp-glass-bg-heavy);
1246
- backdrop-filter: blur(var(--sp-blur-heavy));
1247
- -webkit-backdrop-filter: blur(var(--sp-blur-heavy));
1248
- border: 1px solid var(--sp-glass-border);
1249
- box-shadow: var(--sp-shadow-md);
1250
- z-index: 10;
1251
- animation: sp-sort-menu-in 0.15s ease-out both;
1252
- }
1253
-
1254
- @keyframes sp-sort-menu-in {
1255
- from {
1256
- opacity: 0;
1257
- transform: translateY(-4px) scale(0.97);
1258
- }
1259
- to {
1260
- opacity: 1;
1261
- transform: translateY(0) scale(1);
1262
- }
1263
- }
1264
-
1265
- /* ============================
1266
- Sort Menu Option
1267
- ============================ */
1268
-
1269
- .sp-sort-option {
1270
- display: block;
1271
- width: 100%;
1272
- padding: 8px 12px;
1273
- border: none;
1274
- border-radius: 8px;
1275
- background: transparent;
1276
- color: var(--sp-text-secondary);
1277
- font-family: var(--sp-font);
1278
- font-size: 12px;
1279
- font-weight: 500;
1280
- cursor: pointer;
1281
- text-align: left;
1282
- transition: all 0.15s ease;
1283
- }
1284
-
1285
- .sp-sort-option:hover {
1286
- background: var(--sp-bg-hover);
1287
- color: var(--sp-text);
1288
- }
1289
-
1290
- .sp-sort-option--active {
1291
- font-weight: 600;
1292
- }
1293
-
1294
- .sp-sort-option--active:hover {
1295
- background: var(--sp-accent-light);
1296
- color: var(--sp-accent);
1297
- }
1298
-
1299
- /* ============================
1300
- Group by Page Toggle
1301
- ============================ */
1302
-
1303
- .sp-group-toggle {
1304
- display: inline-flex;
1305
- align-items: center;
1306
- gap: 5px;
1307
- padding: 5px 12px;
1308
- border-radius: var(--sp-radius-full);
1309
- border: 1px solid var(--sp-border);
1310
- background: var(--sp-glass-bg-heavy);
1311
- color: var(--sp-text-secondary);
1312
- font-family: var(--sp-font);
1313
- font-size: 12px;
1314
- font-weight: 500;
1315
- cursor: pointer;
1316
- white-space: nowrap;
1317
- transition: all 0.2s ease;
1318
- }
1319
-
1320
- .sp-group-toggle svg {
1321
- width: 13px;
1322
- height: 13px;
1323
- flex-shrink: 0;
1324
- }
1325
-
1326
- .sp-group-toggle:hover {
1327
- border-color: var(--sp-accent);
1328
- color: var(--sp-accent);
1329
- background: var(--sp-accent-light);
1330
- }
1331
-
1332
- .sp-group-toggle--active {
1333
- background: var(--sp-accent-gradient);
1334
- border-color: transparent;
1335
- color: #fff;
1336
- box-shadow: 0 2px 8px var(--sp-accent-glow);
1337
- }
1338
-
1339
- .sp-group-toggle--active:hover {
1340
- background: var(--sp-accent-gradient);
1341
- border-color: transparent;
1342
- color: #fff;
1343
- }
1344
-
1345
- /* ============================
1346
- Page Group Header
1347
- ============================ */
1348
-
1349
- .sp-group-header {
1350
- display: flex;
1351
- align-items: center;
1352
- gap: 8px;
1353
- padding: 8px 12px;
1354
- background: var(--sp-accent-light);
1355
- border-bottom: 1px solid var(--sp-border);
1356
- cursor: pointer;
1357
- user-select: none;
1358
- position: sticky;
1359
- top: 0;
1360
- z-index: 2;
1361
- transition: background 0.2s ease;
1362
- }
1363
-
1364
- .sp-group-header:hover {
1365
- background: var(--sp-bg-hover);
1366
- }
1367
-
1368
- .sp-group-header:focus-visible {
1369
- outline: 2px solid var(--sp-accent);
1370
- outline-offset: -2px;
1371
- }
1372
-
1373
- .sp-group-header-chevron {
1374
- display: flex;
1375
- align-items: center;
1376
- justify-content: center;
1377
- width: 16px;
1378
- height: 16px;
1379
- flex-shrink: 0;
1380
- transition: transform 0.2s ease;
1381
- transform: rotate(90deg);
1382
- }
1383
-
1384
- .sp-group-header-chevron svg {
1385
- width: 12px;
1386
- height: 12px;
1387
- color: var(--sp-text-tertiary);
1388
- }
1389
-
1390
- .sp-group-header--collapsed .sp-group-header-chevron {
1391
- transform: rotate(0deg);
1392
- }
1393
-
1394
- .sp-group-header-icon {
1395
- display: flex;
1396
- align-items: center;
1397
- flex-shrink: 0;
1398
- }
1399
-
1400
- .sp-group-header-icon svg {
1401
- width: 14px;
1402
- height: 14px;
1403
- color: var(--sp-text-tertiary);
1404
- }
1405
-
1406
- .sp-group-header-path {
1407
- font-size: 12px;
1408
- font-weight: 600;
1409
- color: var(--sp-text-secondary);
1410
- flex: 1;
1411
- min-width: 0;
1412
- overflow: hidden;
1413
- text-overflow: ellipsis;
1414
- white-space: nowrap;
1415
- }
1416
-
1417
- .sp-group-header-count {
1418
- font-size: 11px;
1419
- font-weight: 700;
1420
- padding: 1px 8px;
1421
- border-radius: var(--sp-radius-full);
1422
- flex-shrink: 0;
1423
- font-variant-numeric: tabular-nums;
1424
- }
1425
-
1426
- /* ============================
1427
- Page Group Content
1428
- ============================ */
1429
-
1430
- .sp-group-content {
1431
- overflow: hidden;
1432
- transition: max-height 0.25s ease, opacity 0.2s ease;
1433
- max-height: 5000px;
1434
- opacity: 1;
1435
- }
1436
-
1437
- .sp-group-content--collapsed {
1438
- max-height: 0;
1439
- opacity: 0;
1440
- pointer-events: none;
1441
- }
1442
-
1443
- /* ============================
1444
- Forced Colors / High Contrast
1445
- ============================ */
1446
-
1447
- @media (forced-colors: active) {
1448
- .sp-sort-btn,
1449
- .sp-group-toggle,
1450
- .sp-sort-option,
1451
- .sp-group-header {
1452
- border: 2px solid ButtonText !important;
1453
- background: Canvas !important;
1454
- color: ButtonText !important;
1455
- }
1456
-
1457
- .sp-sort-btn:focus-visible,
1458
- .sp-group-toggle:focus-visible,
1459
- .sp-sort-option:focus-visible,
1460
- .sp-group-header:focus-visible {
1461
- outline: 3px solid Highlight !important;
1462
- }
1463
-
1464
- .sp-sort-menu {
1465
- border: 2px solid ButtonText !important;
1466
- background: Canvas !important;
1467
- }
1468
- }
1469
-
1470
- /* ============================
1471
- Reduced Motion
1472
- ============================ */
1473
-
1474
- @media (prefers-reduced-motion: reduce) {
1475
- .sp-sort-menu {
1476
- animation: none;
1477
- }
1478
- .sp-group-header-chevron {
1479
- transition: none;
1480
- }
1481
- .sp-group-content {
1482
- transition: none;
1483
- }
1484
- }
1485
- `;var rs=`
1486
- .sp-stats-bar {
1487
- display: flex;
1488
- flex-direction: column;
1489
- gap: 8px;
1490
- padding: 12px 24px;
1491
- border-bottom: 1px solid var(--sp-border);
1492
- user-select: none;
1493
- }
1494
-
1495
- .sp-stats-bar[hidden] {
1496
- display: none;
1497
- }
1498
-
1499
- .sp-stats-row {
1500
- display: flex;
1501
- align-items: center;
1502
- gap: 16px;
1503
- }
1504
-
1505
- .sp-stats-item {
1506
- display: flex;
1507
- align-items: center;
1508
- gap: 6px;
1509
- }
1510
-
1511
- .sp-stats-dot {
1512
- width: 6px;
1513
- height: 6px;
1514
- border-radius: 50%;
1515
- flex-shrink: 0;
1516
- }
1517
-
1518
- .sp-stats-value {
1519
- font-size: 16px;
1520
- font-weight: 600;
1521
- line-height: 1;
1522
- color: var(--sp-text);
1523
- font-variant-numeric: tabular-nums;
1524
- font-feature-settings: "tnum";
1525
- transition: opacity 0.3s ease;
1526
- }
1527
-
1528
- .sp-stats-label {
1529
- font-size: 11px;
1530
- line-height: 1;
1531
- color: var(--sp-text-tertiary);
1532
- text-transform: uppercase;
1533
- letter-spacing: 0.04em;
1534
- }
1535
-
1536
- .sp-stats-progress {
1537
- display: flex;
1538
- align-items: center;
1539
- gap: 8px;
1540
- }
1541
-
1542
- .sp-stats-progress-track {
1543
- flex: 1;
1544
- height: 4px;
1545
- border-radius: 2px;
1546
- background: var(--sp-border);
1547
- overflow: hidden;
1548
- }
1549
-
1550
- .sp-stats-progress-fill {
1551
- height: 100%;
1552
- border-radius: 2px;
1553
- background: linear-gradient(90deg, var(--sp-accent), #22c55e);
1554
- width: 0%;
1555
- transition: width 0.5s ease;
1556
- }
1557
-
1558
- .sp-stats-progress-label {
1559
- font-size: 10px;
1560
- line-height: 1;
1561
- color: var(--sp-text-tertiary);
1562
- white-space: nowrap;
1563
- font-variant-numeric: tabular-nums;
1564
- font-feature-settings: "tnum";
1565
- min-width: 64px;
1566
- text-align: right;
1567
- }
1568
- `,ie=class{constructor(e,s){this.colors=e;this.t=s,this.element=o("div",{class:"sp-stats-bar"}),this.element.setAttribute("aria-label","Feedback statistics"),this.element.hidden=true;let n=o("div",{class:"sp-stats-row"}),r=o("div",{class:"sp-stats-item"}),i=o("span",{class:"sp-stats-dot"});i.style.background="#22c55e",this.valueOpen=o("span",{class:"sp-stats-value"}),a(this.valueOpen,"0");let l=o("span",{class:"sp-stats-label"});a(l,this.t("stats.open")),r.appendChild(i),r.appendChild(this.valueOpen),r.appendChild(l);let d=o("div",{class:"sp-stats-item"}),p=o("span",{class:"sp-stats-dot"});p.style.background="#9ca3af",this.valueResolved=o("span",{class:"sp-stats-value"}),a(this.valueResolved,"0");let h=o("span",{class:"sp-stats-label"});a(h,this.t("stats.resolved")),d.appendChild(p),d.appendChild(this.valueResolved),d.appendChild(h);let u=o("div",{class:"sp-stats-item"}),v=o("span",{class:"sp-stats-dot"});v.style.background=this.colors.typeBug,this.valueBugs=o("span",{class:"sp-stats-value"}),a(this.valueBugs,"0");let m=o("span",{class:"sp-stats-label"});a(m,this.t("stats.bugs")),u.appendChild(v),u.appendChild(this.valueBugs),u.appendChild(m),n.appendChild(r),n.appendChild(d),n.appendChild(u);let f=o("div",{class:"sp-stats-progress"}),g=o("div",{class:"sp-stats-progress-track"});this.progressFill=o("div",{class:"sp-stats-progress-fill"}),g.appendChild(this.progressFill),this.progressLabel=o("span",{class:"sp-stats-progress-label"}),a(this.progressLabel,""),f.appendChild(g),f.appendChild(this.progressLabel),this.element.appendChild(n),this.element.appendChild(f);}colors;element;valueOpen;valueResolved;valueBugs;progressFill;progressLabel;t;update(e,s){if(s===0){this.element.hidden=true;return}this.element.hidden=false;let n=0,r=0,i=0;for(let h of e)C(h.status)?r++:n++,h.type==="bug"&&i++;a(this.valueOpen,String(n)),a(this.valueResolved,String(r)),a(this.valueBugs,String(i));let l=e.length,d=l>0?Math.round(r/l*100):0;requestAnimationFrame(()=>{this.progressFill.style.width=`${d}%`;});let p=this.t("stats.progress").replace("{percent}",String(d));a(this.progressLabel,p);}};var Ke='<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>';function as(t){let e=t.querySelectorAll(".sp-card");for(let s=0;s<e.length;s++)if(e[s]?.classList.contains("sp-card--focused"))return s;return -1}function ls(t,e){let s=t.querySelectorAll(".sp-card");if(s.length===0)return;for(let i of s)i.classList.remove("sp-card--focused");let n=Math.max(0,Math.min(e,s.length-1)),r=s[n];r&&(r.classList.add("sp-card--focused"),r.scrollIntoView({block:"nearest",behavior:"smooth"}),r.focus({preventScroll:true}));}var ze=[{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=`
1569
- /* ---- Help overlay backdrop ---- */
1570
-
1571
- .sp-shortcuts-overlay {
1572
- position: fixed;
1573
- inset: 0;
1574
- background: var(--sp-backdrop, rgba(15, 23, 42, 0.2));
1575
- backdrop-filter: blur(var(--sp-blur));
1576
- -webkit-backdrop-filter: blur(var(--sp-blur));
1577
- display: flex;
1578
- align-items: center;
1579
- justify-content: center;
1580
- z-index: 10;
1581
- opacity: 0;
1582
- pointer-events: none;
1583
- transition: opacity 0.2s ease;
1584
- }
1585
-
1586
- .sp-shortcuts-overlay--visible {
1587
- opacity: 1;
1588
- pointer-events: auto;
1589
- }
1590
-
1591
- /* ---- Glassmorphism card ---- */
1592
-
1593
- .sp-shortcuts-card {
1594
- width: 380px;
1595
- max-width: calc(100vw - 32px);
1596
- padding: 24px 28px 20px;
1597
- border-radius: 20px;
1598
- background: var(--sp-glass-bg-heavy);
1599
- backdrop-filter: blur(var(--sp-blur-heavy));
1600
- -webkit-backdrop-filter: blur(var(--sp-blur-heavy));
1601
- border: 1px solid var(--sp-glass-border);
1602
- box-shadow: var(--sp-shadow-xl);
1603
- font-family: var(--sp-font);
1604
- position: relative;
1605
- transform: scale(0.92) translateY(8px);
1606
- transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
1607
- }
1608
-
1609
- .sp-shortcuts-overlay--visible .sp-shortcuts-card {
1610
- transform: scale(1) translateY(0);
1611
- }
1612
-
1613
- /* ---- Title row ---- */
1614
-
1615
- .sp-shortcuts-title {
1616
- display: flex;
1617
- align-items: center;
1618
- gap: 8px;
1619
- font-size: 16px;
1620
- font-weight: 700;
1621
- color: var(--sp-text);
1622
- margin-bottom: 18px;
1623
- }
1624
-
1625
- .sp-shortcuts-title svg {
1626
- width: 18px;
1627
- height: 18px;
1628
- color: var(--sp-text-secondary);
1629
- flex-shrink: 0;
1630
- }
1631
-
1632
- /* ---- Close button ---- */
1633
-
1634
- .sp-shortcuts-close {
1635
- position: absolute;
1636
- top: 16px;
1637
- right: 16px;
1638
- width: 28px;
1639
- height: 28px;
1640
- border-radius: 8px;
1641
- border: none;
1642
- background: transparent;
1643
- color: var(--sp-text-tertiary);
1644
- cursor: pointer;
1645
- display: flex;
1646
- align-items: center;
1647
- justify-content: center;
1648
- transition: background 0.15s ease, color 0.15s ease;
1649
- }
1650
-
1651
- .sp-shortcuts-close:hover {
1652
- background: var(--sp-bg-hover);
1653
- color: var(--sp-text);
1654
- }
1655
-
1656
- .sp-shortcuts-close svg {
1657
- width: 14px;
1658
- height: 14px;
1659
- }
1660
-
1661
- /* ---- Two-column grid ---- */
1662
-
1663
- .sp-shortcuts-grid {
1664
- display: flex;
1665
- flex-direction: column;
1666
- gap: 10px;
1667
- }
1668
-
1669
- .sp-shortcuts-row {
1670
- display: flex;
1671
- align-items: center;
1672
- gap: 12px;
1673
- }
1674
-
1675
- .sp-shortcuts-keys {
1676
- display: flex;
1677
- align-items: center;
1678
- gap: 4px;
1679
- min-width: 80px;
1680
- justify-content: flex-end;
1681
- }
1682
-
1683
- .sp-shortcuts-separator {
1684
- font-size: 11px;
1685
- color: var(--sp-text-tertiary);
1686
- user-select: none;
1687
- }
1688
-
1689
- /* ---- Key badge (<kbd> styling) ---- */
1690
-
1691
- .sp-kbd {
1692
- display: inline-flex;
1693
- align-items: center;
1694
- justify-content: center;
1695
- min-width: 28px;
1696
- height: 26px;
1697
- padding: 0 7px;
1698
- border-radius: 6px;
1699
- background: var(--sp-bg-hover);
1700
- border: 1px solid var(--sp-border);
1701
- box-shadow:
1702
- inset 0 -1px 0 rgba(0, 0, 0, 0.08),
1703
- 0 1px 2px rgba(0, 0, 0, 0.04);
1704
- font-family: ui-monospace, "SF Mono", "Cascadia Code", "Segoe UI Mono", Menlo, monospace;
1705
- font-size: 12px;
1706
- font-weight: 600;
1707
- color: var(--sp-text);
1708
- text-align: center;
1709
- line-height: 1;
1710
- user-select: none;
1711
- }
1712
-
1713
- /* ---- Description text ---- */
1714
-
1715
- .sp-shortcuts-desc {
1716
- font-size: 13px;
1717
- color: var(--sp-text-secondary);
1718
- line-height: 1.3;
1719
- }
1720
-
1721
- /* ---- Hint button (bottom-right of panel) ---- */
1722
-
1723
- .sp-shortcuts-hint {
1724
- width: 24px;
1725
- height: 24px;
1726
- border-radius: var(--sp-radius-full);
1727
- border: 1px solid var(--sp-border);
1728
- background: var(--sp-bg-hover);
1729
- color: var(--sp-text-tertiary);
1730
- font-family: ui-monospace, "SF Mono", "Cascadia Code", "Segoe UI Mono", Menlo, monospace;
1731
- font-size: 12px;
1732
- font-weight: 700;
1733
- line-height: 1;
1734
- cursor: pointer;
1735
- display: flex;
1736
- align-items: center;
1737
- justify-content: center;
1738
- transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
1739
- position: absolute;
1740
- bottom: 12px;
1741
- right: 12px;
1742
- }
1743
-
1744
- .sp-shortcuts-hint:hover {
1745
- background: var(--sp-accent-light);
1746
- color: var(--sp-accent);
1747
- border-color: var(--sp-accent);
1748
- }
1749
-
1750
- .sp-shortcuts-hint::after {
1751
- content: attr(aria-label);
1752
- position: absolute;
1753
- bottom: calc(100% + 6px);
1754
- right: 0;
1755
- padding: 4px 8px;
1756
- border-radius: 6px;
1757
- background: var(--sp-glass-bg-heavy);
1758
- border: 1px solid var(--sp-glass-border);
1759
- box-shadow: var(--sp-shadow-sm);
1760
- font-family: var(--sp-font);
1761
- font-size: 11px;
1762
- font-weight: 500;
1763
- color: var(--sp-text-secondary);
1764
- white-space: nowrap;
1765
- opacity: 0;
1766
- pointer-events: none;
1767
- transform: translateY(4px);
1768
- transition: opacity 0.15s ease, transform 0.15s ease;
1769
- }
1770
-
1771
- .sp-shortcuts-hint:hover::after {
1772
- opacity: 1;
1773
- transform: translateY(0);
1774
- }
1775
-
1776
- /* ---- Card focus highlight (navigation) ---- */
1777
-
1778
- .sp-card--focused {
1779
- outline: 2px solid var(--sp-accent);
1780
- outline-offset: -2px;
1781
- border-radius: inherit;
1782
- }
1783
-
1784
- /* ---- Reduced motion ---- */
1785
-
1786
- @media (prefers-reduced-motion: reduce) {
1787
- .sp-shortcuts-overlay,
1788
- .sp-shortcuts-card,
1789
- .sp-shortcuts-close,
1790
- .sp-shortcuts-hint,
1791
- .sp-shortcuts-hint::after {
1792
- transition-duration: 0.01ms !important;
1793
- }
1794
- }
1795
- `,Ue='<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>',ae=class{constructor(e,s,n){this.t=n;this.keyMap=new Map([["j",()=>s.onNavigate("down")],["k",()=>s.onNavigate("up")],["r",()=>s.onResolve()],["d",()=>s.onDelete()],["f",()=>s.onFocusSearch()],["/",()=>s.onFocusSearch()],["x",()=>s.onToggleSelect()],["?",()=>this.toggleHelp()]]),this.helpOverlay=this.buildOverlay(),this.hintButton=this.buildHintButton(),this.boundHandler=r=>this.handleKeydown(r);}t;helpOverlay;hintButton;keyMap;boundHandler;shadowRoot=null;enabled=false;helpVisible=false;destroyed=false;enable(e){if(this.destroyed||this.enabled)return;e&&(this.shadowRoot=e),(this.shadowRoot??document).addEventListener("keydown",this.boundHandler),this.enabled=true;}disable(){if(!this.enabled)return;(this.shadowRoot??document).removeEventListener("keydown",this.boundHandler),this.enabled=false,this.helpVisible&&this.hideHelp();}toggleHelp(){this.helpVisible?this.hideHelp():this.showHelp();}destroy(){this.destroyed||(this.disable(),this.helpOverlay.remove(),this.hintButton.remove(),this.destroyed=true);}handleKeydown(e){if(e.key==="Escape"){this.helpVisible&&(e.preventDefault(),e.stopPropagation(),this.hideHelp());return}if(this.helpVisible)return;let s=e.composedPath()[0];if(s){let r=s.tagName?.toLowerCase();if(r==="input"||r==="textarea"||r==="select"||s.isContentEditable)return}if(e.ctrlKey||e.altKey||e.metaKey)return;let n=this.keyMap.get(e.key);n&&(e.preventDefault(),e.stopPropagation(),n());}showHelp(){this.helpVisible=true,this.helpOverlay.classList.add("sp-shortcuts-overlay--visible"),this.helpOverlay.querySelector(".sp-shortcuts-close")?.focus();}hideHelp(){this.helpVisible=false,this.helpOverlay.classList.remove("sp-shortcuts-overlay--visible");}buildOverlay(){let e=o("div",{class:"sp-shortcuts-overlay"});e.setAttribute("role","dialog"),e.setAttribute("aria-modal","true"),e.setAttribute("aria-label",this.t("shortcuts.title")),e.addEventListener("click",d=>{d.target===e&&this.hideHelp();});let s=o("div",{class:"sp-shortcuts-card"}),n=o("div",{class:"sp-shortcuts-title"});n.appendChild(c(Ke));let r=o("span");a(r,this.t("shortcuts.title")),n.appendChild(r),s.appendChild(n);let i=document.createElement("button");i.className="sp-shortcuts-close",i.setAttribute("aria-label",this.t("shortcuts.close")),i.appendChild(c(Ue)),i.addEventListener("click",()=>this.hideHelp()),s.appendChild(i);let l=o("div",{class:"sp-shortcuts-grid"});for(let d of ze){let p=o("div",{class:"sp-shortcuts-row"}),h=o("div",{class:"sp-shortcuts-keys"});d.keys.forEach((v,m)=>{if(m>0){let g=o("span",{class:"sp-shortcuts-separator"});a(g,"/"),h.appendChild(g);}let f=o("span",{class:"sp-kbd"});a(f,v),h.appendChild(f);});let u=o("span",{class:"sp-shortcuts-desc"});a(u,this.t(d.label)),p.appendChild(h),p.appendChild(u),l.appendChild(p);}return s.appendChild(l),e.appendChild(s),e}buildHintButton(){let e=document.createElement("button");return e.className="sp-shortcuts-hint",e.setAttribute("aria-label",this.t("shortcuts.hint")),a(e,"?"),e.addEventListener("click",s=>{s.stopPropagation(),this.toggleHelp();}),e}};export{ie as $,$ as A,gt as B,E as C,O as D,N as E,D as F,ge as G,be as H,z as I,C as J,xe as K,Pt as L,Ot as M,Nt as N,G as O,It as P,X as Q,$t as R,J as S,Gt as T,se as U,Qt as V,Jt as W,Zt as X,re as Y,es as Z,rs as _,c as a,as as aa,o as b,ls as ba,a as c,ps as ca,F as d,ae as da,Ve as e,Ge as f,qe as g,We as h,Xe as i,Qe as j,Je as k,Ze as l,et as m,tt as n,st as o,nt as p,rt as q,ot as r,it as s,at as t,lt as u,pt as v,ct as w,M as x,ut as y,ht as z};//# sourceMappingURL=chunk-D2AVRF24.js.map
1796
- //# sourceMappingURL=chunk-D2AVRF24.js.map