@siteping/widget 0.10.2 → 0.10.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chunk-RHP4S23A.cjs +1796 -0
- package/dist/chunk-RHP4S23A.cjs.map +1 -0
- package/dist/de-AZUOIGF2.cjs +2 -0
- package/dist/de-AZUOIGF2.cjs.map +1 -0
- package/dist/errors.d.cts +41 -0
- package/dist/errors.d.ts +41 -0
- package/dist/es-5XQA3TPT.cjs +2 -0
- package/dist/es-5XQA3TPT.cjs.map +1 -0
- package/dist/filters.d.cts +31 -0
- package/dist/filters.d.ts +31 -0
- package/dist/fr-ERYSAH32.cjs +2 -0
- package/dist/fr-ERYSAH32.cjs.map +1 -0
- package/dist/index.cjs +1589 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +24 -0
- package/dist/index.global.js +90 -90
- package/dist/index.global.js.map +1 -1
- package/dist/index.js +40 -40
- package/dist/index.js.map +1 -1
- package/dist/it-NXAZR4K6.cjs +2 -0
- package/dist/it-NXAZR4K6.cjs.map +1 -0
- package/dist/panel-N7TAQKDR.cjs +2 -0
- package/dist/panel-N7TAQKDR.cjs.map +1 -0
- package/dist/pt-CODDT6VY.cjs +2 -0
- package/dist/pt-CODDT6VY.cjs.map +1 -0
- package/dist/react.cjs +1589 -0
- package/dist/react.cjs.map +1 -0
- package/dist/react.d.cts +59 -0
- package/dist/react.js +44 -44
- package/dist/react.js.map +1 -1
- package/dist/ru-72WUEADV.cjs +2 -0
- package/dist/ru-72WUEADV.cjs.map +1 -0
- package/dist/schema.d.cts +263 -0
- package/dist/screenshot-storage.d.cts +56 -0
- package/dist/screenshot-storage.d.ts +56 -0
- package/dist/siteping-core.d.cts +11 -0
- package/dist/type-utils.d.cts +89 -0
- package/dist/type-utils.d.ts +89 -0
- package/dist/types.d.cts +799 -0
- package/package.json +19 -6
package/dist/index.cjs
ADDED
|
@@ -0,0 +1,1589 @@
|
|
|
1
|
+
'use strict';var chunkRHP4S23A_cjs=require('./chunk-RHP4S23A.cjs');var xn=new Set(["role","name","aria-label","rel","href"]);function wn(t,e){let n=xn.has(t);n||=t.startsWith("data-")&&V(t);let i=V(e)&&e.length<100;return i||=e.startsWith("#")&&V(e.slice(1)),n&&i}function En(t){return V(t)}function kn(t){return V(t)}function Sn(t){return true}function Pt(t,e){if(t.nodeType!==Node.ELEMENT_NODE)throw new Error("Can't generate CSS selector for non-element node type.");if(t.tagName.toLowerCase()==="html")return "html";let n={root:document.body,idName:En,className:kn,tagName:Sn,attr:wn,timeoutMs:1e3,seedMinLength:3,optimizedMinLength:2,maxNumberOfPathChecks:1/0},i=new Date,o={...n,...e},r=Mn(o.root,n),s,a=0;for(let c of Tn(t,o,r)){if(new Date().getTime()-i.getTime()>o.timeoutMs||a>=o.maxNumberOfPathChecks){let u=An(t,r);if(!u)throw new Error(`Timeout: Can't find a unique selector after ${o.timeoutMs}ms`);return Z(u)}if(a++,ze(c,r)){s=c;break}}if(!s)throw new Error("Selector was not found.");let l=[...Nt(s,t,o,r,i)];return l.sort(Oe),l.length>0?Z(l[0]):Z(s)}function*Tn(t,e,n){let i=[],o=[],r=t,s=0;for(;r&&r!==n;){let a=Cn(r,e);for(let l of a)l.level=s;if(i.push(a),r=r.parentElement,s++,o.push(...Ft(i)),s>=e.seedMinLength){o.sort(Oe);for(let l of o)yield l;o=[];}}o.sort(Oe);for(let a of o)yield a;}function V(t){if(/^[a-z\-]{3,}$/i.test(t)){let e=t.split(/-|[A-Z]/);for(let n of e)if(n.length<=2||/[^aeiou]{4,}/i.test(n))return false;return true}return false}function Cn(t,e){let n=[],i=t.getAttribute("id");i&&e.idName(i)&&n.push({name:"#"+CSS.escape(i),penalty:0});for(let s=0;s<t.classList.length;s++){let a=t.classList[s];e.className(a)&&n.push({name:"."+CSS.escape(a),penalty:1});}for(let s=0;s<t.attributes.length;s++){let a=t.attributes[s];e.attr(a.name,a.value)&&n.push({name:`[${CSS.escape(a.name)}="${CSS.escape(a.value)}"]`,penalty:2});}let o=t.tagName.toLowerCase();if(e.tagName(o)){n.push({name:o,penalty:5});let s=Be(t,o);s!==void 0&&n.push({name:It(o,s),penalty:10});}let r=Be(t);return r!==void 0&&n.push({name:Rn(o,r),penalty:50}),n}function Z(t){let e=t[0],n=e.name;for(let i=1;i<t.length;i++){let o=t[i].level||0;e.level===o-1?n=`${t[i].name} > ${n}`:n=`${t[i].name} ${n}`,e=t[i];}return n}function Lt(t){return t.map(e=>e.penalty).reduce((e,n)=>e+n,0)}function Oe(t,e){return Lt(t)-Lt(e)}function Be(t,e){let n=t.parentNode;if(!n)return;let i=n.firstChild;if(!i)return;let o=0;for(;i&&(i.nodeType===Node.ELEMENT_NODE&&(e===void 0||i.tagName.toLowerCase()===e)&&o++,i!==t);)i=i.nextSibling;return o}function An(t,e){let n=0,i=t,o=[];for(;i&&i!==e;){let r=i.tagName.toLowerCase(),s=Be(i,r);if(s===void 0)return;o.push({name:It(r,s),penalty:NaN,level:n}),i=i.parentElement,n++;}if(ze(o,e))return o}function Rn(t,e){return t==="html"?"html":`${t}:nth-child(${e})`}function It(t,e){return t==="html"?"html":`${t}:nth-of-type(${e})`}function*Ft(t,e=[]){if(t.length>0)for(let n of t[0])yield*Ft(t.slice(1,t.length),e.concat(n));else yield e;}function Mn(t,e){return t.nodeType===Node.DOCUMENT_NODE?t:t===e.root?t.ownerDocument:t}function ze(t,e){let n=Z(t);switch(e.querySelectorAll(n).length){case 0:throw new Error(`Can't select any node with this selector: ${n}`);case 1:return true;default:return false}}function*Nt(t,e,n,i,o){if(t.length>2&&t.length>n.optimizedMinLength)for(let r=1;r<t.length-1;r++){if(new Date().getTime()-o.getTime()>n.timeoutMs)return;let a=[...t];a.splice(r,1),ze(a,i)&&i.querySelector(Z(a))===e&&(yield a,yield*Nt(a,e,n,i,o));}}var Ln=["role","aria-label","type","name","href","src","data-testid","data-id"];function Pn(t){let e=5381;for(let n=0;n<t.length;n++)e=(e<<5)+e+t.charCodeAt(n)|0;return (e>>>0).toString(36)}function je(t){let e=t.children.length,n=0,i=t.parentElement;if(i)for(let o of i.children){if(o===t)break;o.tagName===t.tagName&&n++;}return `${e}:${n}:${Ke(t)}`}function Ke(t){let e=[];for(let n of Ln){let i=t.getAttribute(n);i&&e.push(`${n}=${i}`);}return e.length>0?Pn(e.join(",")):"0"}function _t(t,e){let n=e.split(":");if(n.length!==3)return 0;let[i,o,r]=n,s=Number(i),a=Number(o);if(Number.isNaN(s)||Number.isNaN(a))return 0;let l=je(t),[c,p,u]=l.split(":"),d=0,f=Math.abs(Number(c)-s);f===0?d+=.2:f<=2?d+=.1:f<=5&&(d+=.03);let m=Math.abs(Number(p)-a);return m===0?d+=.4:m===1?d+=.2:m<=3&&(d+=.08),u===r&&(d+=.4),d}function X(t,e){let n=e==="before"?"previousElementSibling":"nextElementSibling",i=t[n],o=3;for(;i&&o>0;){let r=e==="before"?In(i,256).trim():K(i,256).trim();if(r)return e==="before"?r.slice(-32):r.slice(0,32);i=i[n],o--;}return ""}function me(t){let e=t.previousElementSibling,n=t.nextElementSibling,i=e?K(e,256).trim().slice(0,40):"",o=n?K(n,256).trim().slice(0,40):"";return [i,o].filter(Boolean).join(" | ")}function K(t,e){let n="";if(t.firstElementChild===null){for(let o of t.childNodes)if(o.nodeType===3&&(n+=o.data,n.length>=e))break;return n.length>e?n.slice(0,e):n}let i=t.ownerDocument.createTreeWalker(t,NodeFilter.SHOW_TEXT);for(;n.length<e;){let o=i.nextNode();if(!o)break;n+=o.data;}return n.length>e?n.slice(0,e):n}function In(t,e){let n="",i=o=>{for(let r=o.lastChild;r;r=r.previousSibling)if(r.nodeType===3){if(n=r.data+n,n.length>=e)return true}else if(r.nodeType===1&&i(r))return true;return false};return i(t),n.length>e?n.slice(-e):n}function Ht(t){if(t.id){let i=t.id.includes("'")?`concat('${t.id.replace(/'/g,`',"'",'`)}')`:`'${t.id}'`;return `//${t.localName}[@id=${i}]`}let e=[],n=t;for(;n&&n!==document.body&&e.length<6;){let i=n.localName,o=n.parentElement;if(n.id){let s=n.id.includes("'")?`concat('${n.id.replace(/'/g,`',"'",'`)}')`:`'${n.id}'`;return e.unshift(`/${i}[@id=${s}]`),"/"+e.join("")}let r=1;if(o)for(let s of o.children){if(s===n)break;s.localName===i&&r++;}e.unshift(`/${i}[${r}]`),n=o;}return "/html/body"+e.join("")}var J="data-feedback-anchor";function Xe(t){let e=Pt(t,{className:u=>!/^(css|sc|emotion|styled)-/.test(u)&&!/^[a-z]{1,3}[A-Za-z0-9]{4,8}$/.test(u),attr:u=>["data-testid","data-id","role","aria-label"].includes(u),idName:u=>!u.startsWith("radix-")&&!/^:r[0-9]+:$/.test(u),seedMinLength:3,optimizedMinLength:2}),n=Ht(t),o=(t.textContent?.trim()??"").slice(0,120),r=X(t,"before"),s=X(t,"after"),a=je(t),l=me(t),p=t.closest(`[${J}]`)?.getAttribute(J)??null;return {cssSelector:e,xpath:n,textSnippet:o,textPrefix:r,textSuffix:s,fingerprint:a,neighborText:l,elementTag:t.tagName,elementId:t.id||void 0,anchorKey:p}}function Dt(t,e){let n=t.getBoundingClientRect();return n.left<=e.x&&n.top<=e.y&&n.right>=e.x+e.width&&n.bottom>=e.y+e.height}function $t(t,e=document.documentElement){let n=t.x+t.width/2,i=t.y+t.height/2,o=document.elementFromPoint(n,i);if(!o||o===e)return document.body;let r=o;for(;r&&r!==document.body;){if(r.hasAttribute(J)&&Dt(r,t))return r;r=r.parentElement;}for(r=o;r&&r!==document.body;){if(Dt(r,t))return r;r=r.parentElement;}return document.body}function Ot(t,e){return e.width<=0||e.height<=0?{xPct:0,yPct:0,wPct:1,hPct:1}:{xPct:(t.x-e.x)/e.width,yPct:(t.y-e.y)/e.height,wPct:t.width/e.width,hPct:t.height/e.height}}function We(t){return t.tagName==="SITEPING-WIDGET"||t.closest("siteping-widget")!==null||t.closest('[data-siteping-ignore="true"]')!==null||t.closest("#siteping-markers")!==null||t.closest("#sp-tooltip")!==null}function Bt(t){let e=null,n=i=>{let o=i.target;o instanceof HTMLElement&&(o===document.body||o===document.documentElement||o===t||We(o)||(e=o));};return document.addEventListener("focusin",n),{getLastPageFocus(){return e&&!e.isConnected&&(e=null),e},destroy(){document.removeEventListener("focusin",n),e=null;}}}var Fn={question:"type.question",change:"type.change",bug:"type.bug",other:"type.other"};function Nn(){let t=navigator.userAgentData;return t?t.platform==="macOS":navigator.platform?.includes("Mac")??/Macintosh|Mac OS X/i.test(navigator.userAgent)}var ge=class{constructor(e,n){this.colors=e;this.t=n;this.root=chunkRHP4S23A_cjs.b("div",{style:`
|
|
2
|
+
position:fixed;
|
|
3
|
+
z-index:${2147483647};
|
|
4
|
+
width:300px;
|
|
5
|
+
padding:16px;
|
|
6
|
+
border-radius:16px;
|
|
7
|
+
background:${this.colors.glassBg};
|
|
8
|
+
backdrop-filter:blur(24px);
|
|
9
|
+
-webkit-backdrop-filter:blur(24px);
|
|
10
|
+
border:1px solid ${this.colors.glassBorder};
|
|
11
|
+
box-shadow:0 8px 32px ${this.colors.shadow}, 0 2px 8px ${this.colors.shadow};
|
|
12
|
+
font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
13
|
+
opacity:0;
|
|
14
|
+
transform:translateY(8px) scale(0.98);
|
|
15
|
+
transition:opacity 0.25s cubic-bezier(0.16, 1, 0.3, 1),transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
|
|
16
|
+
display:none;
|
|
17
|
+
-webkit-font-smoothing:antialiased;
|
|
18
|
+
`}),this.root.setAttribute("role","dialog"),this.root.setAttribute("aria-modal","true"),this.root.setAttribute("data-siteping-ignore","true");let i=[{type:"question",icon:chunkRHP4S23A_cjs.l},{type:"change",icon:chunkRHP4S23A_cjs.m},{type:"bug",icon:chunkRHP4S23A_cjs.n},{type:"other",icon:chunkRHP4S23A_cjs.o}];this.typeRow=chunkRHP4S23A_cjs.b("div",{style:"display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:12px;"});for(let r of i){let s=document.createElement("button");s.style.cssText=`
|
|
19
|
+
height:44px;
|
|
20
|
+
border-radius:9999px;border:1px solid ${this.colors.border};
|
|
21
|
+
background:${this.colors.glassBg};cursor:pointer;
|
|
22
|
+
display:flex;align-items:center;justify-content:center;gap:5px;
|
|
23
|
+
font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
24
|
+
font-size:13px;font-weight:500;color:${this.colors.textTertiary};
|
|
25
|
+
transition:all 0.2s ease;
|
|
26
|
+
padding:0 12px;
|
|
27
|
+
`;let a=chunkRHP4S23A_cjs.a(r.icon);a.setAttribute("style","width:13px;height:13px;flex-shrink:0;"),s.appendChild(a),s.appendChild(document.createElement("span")),s.dataset.type=r.type,s.setAttribute("aria-pressed","false"),s.addEventListener("click",()=>{this.submittingState||this.selectType(r.type,this.typeRow);}),s.addEventListener("mouseenter",()=>{if(!this.submittingState&&s.dataset.type!==this.selectedType){let l=chunkRHP4S23A_cjs.A(s.dataset.type??"",this.colors);s.style.background=l,s.style.borderColor=chunkRHP4S23A_cjs.x(s.dataset.type??"",this.colors)+"40";}}),s.addEventListener("mouseleave",()=>{this.submittingState||s.dataset.type!==this.selectedType&&(s.style.background=this.colors.glassBg,s.style.borderColor=this.colors.border);}),this.typeRow.appendChild(s);}this.textarea=document.createElement("textarea"),this.textarea.style.cssText=`
|
|
28
|
+
width:100%;min-height:72px;max-height:152px;
|
|
29
|
+
padding:10px 12px;border-radius:12px;
|
|
30
|
+
border:1px solid ${this.colors.border};
|
|
31
|
+
background:${this.colors.glassBgHeavy};
|
|
32
|
+
color:${this.colors.text};font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
33
|
+
font-size:13px;line-height:1.5;resize:vertical;
|
|
34
|
+
outline:none;transition:all 0.2s ease;
|
|
35
|
+
box-sizing:border-box;
|
|
36
|
+
`,this.textarea.maxLength=5e3,this.hint=chunkRHP4S23A_cjs.b("div",{style:`
|
|
37
|
+
font-size:11px;color:${this.colors.textTertiary};
|
|
38
|
+
text-align:right;margin-top:4px;
|
|
39
|
+
font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
40
|
+
letter-spacing:0.01em;
|
|
41
|
+
`}),this.textarea.addEventListener("focus",()=>{this.submittingState||(this.textarea.style.borderColor=this.colors.accent,this.textarea.style.boxShadow=`0 0 0 3px ${this.colors.accent}14`,this.textarea.style.background=this.colors.bg);}),this.textarea.addEventListener("blur",()=>{this.submittingState||(this.textarea.style.borderColor=this.colors.border,this.textarea.style.boxShadow="none",this.textarea.style.background=this.colors.glassBgHeavy);}),this.textarea.addEventListener("input",()=>{this.updateSubmitState();}),this.textarea.addEventListener("keydown",r=>{this.submittingState||(r.key==="Enter"&&(r.ctrlKey||r.metaKey)&&(r.preventDefault(),this.submit()),r.key==="Escape"&&this.cancel());});let o=chunkRHP4S23A_cjs.b("div",{style:"display:flex;justify-content:flex-end;gap:8px;margin-top:12px;"});this.cancelBtn=document.createElement("button"),this.cancelBtn.style.cssText=`
|
|
42
|
+
height:34px;padding:0 16px;border-radius:9999px;
|
|
43
|
+
border:1px solid ${this.colors.border};
|
|
44
|
+
background:${this.colors.glassBg};
|
|
45
|
+
color:${this.colors.textTertiary};font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
46
|
+
font-size:13px;font-weight:500;cursor:pointer;
|
|
47
|
+
transition:all 0.2s ease;
|
|
48
|
+
`,this.cancelBtn.addEventListener("click",()=>this.cancel()),this.cancelBtn.addEventListener("mouseenter",()=>{this.submittingState||(this.cancelBtn.style.borderColor=this.colors.accent,this.cancelBtn.style.color=this.colors.accent);}),this.cancelBtn.addEventListener("mouseleave",()=>{this.submittingState||(this.cancelBtn.style.borderColor=this.colors.border,this.cancelBtn.style.color=this.colors.textTertiary);}),this.submitBtn=document.createElement("button"),this.submitBtn.style.cssText=`
|
|
49
|
+
height:34px;padding:0 18px;border-radius:9999px;
|
|
50
|
+
border:none;background:${this.colors.accentGradient};
|
|
51
|
+
color:#fff;font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
52
|
+
font-size:13px;font-weight:600;cursor:pointer;
|
|
53
|
+
opacity:0.35;pointer-events:none;
|
|
54
|
+
transition:all 0.2s ease;
|
|
55
|
+
box-shadow:0 2px 8px ${this.colors.accentGlow};
|
|
56
|
+
display:inline-flex;align-items:center;justify-content:center;min-width:64px;
|
|
57
|
+
`,this.submitLabel=document.createElement("span"),this.submitBtn.appendChild(this.submitLabel),this.submitBtn.addEventListener("click",()=>this.submit()),o.appendChild(this.cancelBtn),o.appendChild(this.submitBtn),this.root.appendChild(this.typeRow),this.root.appendChild(this.textarea),this.root.appendChild(this.hint),this.root.appendChild(o),document.body.appendChild(this.root),this.applyLabels();}colors;t;root;selectedType=null;textarea;submitBtn;cancelBtn;typeRow;submitLabel;hint;resolve=null;previouslyFocused=null;onKeydownTrap=null;onSubmit=null;submittingState=false;spinnerAnimation=null;refreshLabels(){this.applyLabels();}applyLabels(){this.root.setAttribute("aria-label",this.t("popup.ariaLabel"));let e=this.root.querySelectorAll("button[data-type]");for(let n of e){let i=n.dataset.type;if(!i)continue;let o=Fn[i];if(!o)continue;let r=n.querySelector("span");r&&chunkRHP4S23A_cjs.c(r,this.t(o));}this.textarea.placeholder=this.t("popup.placeholder"),this.textarea.setAttribute("aria-label",this.t("popup.textareaAria")),chunkRHP4S23A_cjs.c(this.hint,Nn()?this.t("popup.submitHintMac"):this.t("popup.submitHintOther")),chunkRHP4S23A_cjs.c(this.cancelBtn,this.t("popup.cancel")),chunkRHP4S23A_cjs.c(this.submitLabel,this.t("popup.submit"));}show(e,n){return new Promise(i=>{this.resolve=i,this.onSubmit=n??null,this.selectedType=null,this.textarea.value="",this.submittingState=false,this.updateSubmitState(),this.resetTypeButtons(),this.previouslyFocused=document.activeElement;let o=220,r=300,s=e.bottom+8,a=e.left;if(s+o>window.innerHeight){let c=e.top-o-8;c>=8?s=c:s=window.innerHeight-o-8;}a+r>window.innerWidth&&(a=e.right-r),a=Math.max(8,a),s=Math.max(8,s),this.root.style.top=`${s}px`,this.root.style.left=`${a}px`,this.root.style.display="block",this.onKeydownTrap=c=>{if(c.key==="Tab"){let p=Array.from(this.root.querySelectorAll('button:not([disabled]), textarea:not([disabled]), input:not([disabled]), [tabindex]:not([tabindex="-1"])'));if(p.length===0)return;let u=p[0],d=p[p.length-1];if(!u||!d)return;c.shiftKey?(document.activeElement===u||!this.root.contains(document.activeElement))&&(c.preventDefault(),d.focus()):(document.activeElement===d||!this.root.contains(document.activeElement))&&(c.preventDefault(),u.focus());}},this.root.addEventListener("keydown",this.onKeydownTrap);let l=typeof window<"u"&&window.matchMedia("(prefers-reduced-motion: reduce)").matches;this.root.style.transition=l?"none":"",requestAnimationFrame(()=>{this.root.style.opacity="1",this.root.style.transform="translateY(0) scale(1)",this.textarea.focus();});})}selectType(e,n){this.selectedType=e;let i=n.querySelectorAll("button");for(let o of i){let r=o.dataset.type===e,s=chunkRHP4S23A_cjs.x(o.dataset.type??"",this.colors),a=chunkRHP4S23A_cjs.A(o.dataset.type??"",this.colors);o.style.background=r?a:this.colors.glassBg,o.style.borderColor=r?s+"60":this.colors.border,o.style.color=r?s:this.colors.textTertiary,o.style.fontWeight=r?"600":"500",o.setAttribute("aria-pressed",String(r));}this.updateSubmitState();}resetTypeButtons(){let e=this.root.querySelectorAll("button[data-type]");for(let n of e)n.setAttribute("aria-pressed","false"),n.disabled=false,n.style.background=this.colors.glassBg,n.style.borderColor=this.colors.border,n.style.color=this.colors.textTertiary,n.style.fontWeight="500",n.style.cursor="pointer";}updateSubmitState(){if(this.submittingState)return;let e=this.selectedType!==null&&this.textarea.value.trim().length>0;this.submitBtn.disabled=!e,this.submitBtn.style.opacity=e?"1":"0.35",this.submitBtn.style.pointerEvents=e?"auto":"none";}submit(){if(this.submittingState||!this.selectedType||!this.textarea.value.trim())return;let e={type:this.selectedType,message:this.textarea.value.trim()};if(!this.onSubmit){this.resolve?.(e),this.resolve=null,this.hideElement();return}this.enterSubmittingState();let n=this.onSubmit;n(e).then(()=>{this.resolve?.(e),this.resolve=null,this.hideElement();}).catch(()=>{this.exitSubmittingState();});}cancel(){this.submittingState||(this.resolve?.(null),this.resolve=null,this.hideElement());}enterSubmittingState(){this.submittingState=true,this.submitLabel.style.display="none",this.submitBtn.disabled=true,this.submitBtn.style.cursor="wait",this.submitBtn.style.opacity="0.85",this.submitBtn.setAttribute("aria-busy","true"),this.submitBtn.appendChild(this.buildSpinner()),this.cancelBtn.disabled=true,this.cancelBtn.style.opacity="0.5",this.cancelBtn.style.cursor="not-allowed",this.cancelBtn.style.pointerEvents="none",this.textarea.disabled=true,this.textarea.style.opacity="0.6";let e=this.typeRow.querySelectorAll("button");for(let n of e)n.disabled=true,n.style.cursor="not-allowed",n.style.opacity="0.6";}exitSubmittingState(){this.submittingState=false,this.spinnerAnimation?.cancel(),this.spinnerAnimation=null,this.submitBtn.querySelector('[data-role="sp-popup-spinner"]')?.remove(),this.submitLabel.style.display="",this.submitBtn.removeAttribute("aria-busy"),this.submitBtn.style.cursor="pointer",this.cancelBtn.disabled=false,this.cancelBtn.style.opacity="1",this.cancelBtn.style.cursor="pointer",this.cancelBtn.style.pointerEvents="auto",this.textarea.disabled=false,this.textarea.style.opacity="1";let n=this.typeRow.querySelectorAll("button");for(let i of n)i.disabled=false,i.style.cursor="pointer",i.style.opacity="1";this.updateSubmitState();}buildSpinner(){let e=document.createElement("div");return e.dataset.role="sp-popup-spinner",e.style.cssText=`
|
|
58
|
+
width:14px;height:14px;
|
|
59
|
+
border:2px solid rgba(255,255,255,0.35);
|
|
60
|
+
border-top-color:#fff;
|
|
61
|
+
border-radius:50%;
|
|
62
|
+
box-sizing:border-box;
|
|
63
|
+
`,!(typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-reduced-motion: reduce)").matches)&&typeof e.animate=="function"&&(this.spinnerAnimation=e.animate([{transform:"rotate(0deg)"},{transform:"rotate(360deg)"}],{duration:600,iterations:1/0,easing:"linear"})),e}hideElement(){this.onKeydownTrap&&(this.root.removeEventListener("keydown",this.onKeydownTrap),this.onKeydownTrap=null),this.submittingState&&this.exitSubmittingState(),this.onSubmit=null,this.root.style.opacity="0",this.root.style.transform="translateY(8px) scale(0.98)",this.previouslyFocused?.focus(),this.previouslyFocused=null,setTimeout(()=>{this.root.style.display="none";},250);}destroy(){this.submittingState&&this.exitSubmittingState(),this.resolve?.(null),this.resolve=null,this.onSubmit=null,this.onKeydownTrap&&(this.root.removeEventListener("keydown",this.onKeydownTrap),this.onKeydownTrap=null),this.root.remove();}};var Q,zt=false;async function _n(){if(Q!==void 0)return Q;try{let t=await import('html2canvas');return Q=t.default??t,Q}catch(t){return Q=null,zt||(zt=true,console.warn("[siteping] html2canvas import failed unexpectedly. Capture is disabled for this session \u2014 feedbacks are still submitted, just without screenshots. Underlying error:",t)),null}}function Ye(t,e,n){return Math.min(n,Math.max(t,e))}function be(t){return Ye(0,Math.round(t*1e4)/1e4,1)}async function jt(t,e){let n=await _n();if(!n)return null;let i=.85,o=1200,r=Ye(48,t.width*.6,280),s=Ye(48,t.height*.6,220),a=window.scrollX+t.x,l=window.scrollY+t.y,c=Math.max(document.documentElement.scrollWidth,document.body.scrollWidth),p=Math.max(document.documentElement.scrollHeight,document.body.scrollHeight),u=Math.max(0,a-r),d=Math.max(0,l-s),f=Math.min(c,a+t.width+r)-u,m=Math.min(p,l+t.height+s)-d;if(f<=0||m<=0)return null;let T={xPct:be((a-u)/f),yPct:be((l-d)/m),wPct:be(t.width/f),hPct:be(t.height/m)};try{let E=await n(document.body,{x:u,y:d,width:f,height:m,scale:window.devicePixelRatio,useCORS:!0,allowTaint:!0,logging:!1,ignoreElements:v=>v.tagName==="SITEPING-WIDGET"||v.closest?.("siteping-widget")!==null||v.getAttribute?.("data-siteping-ignore")==="true"});if(E.width<=o)return {dataUrl:E.toDataURL("image/jpeg",i),region:T};let x=o/E.width,A=o,_=Math.round(E.height*x),k=document.createElement("canvas");k.width=A,k.height=_;let C=k.getContext("2d");return C?(C.drawImage(E,0,0,A,_),{dataUrl:k.toDataURL("image/jpeg",i),region:T}):null}catch(E){return console.warn("[siteping] Screenshot capture failed:",E),null}}var ye=class{constructor(e,n,i,o=false,r){this.colors=e;this.bus=n;this.t=i;this.enableScreenshot=o;this.getFallbackTarget=r;this.popup=new ge(e,i),this.bus.on("annotation:start",()=>this.activate());}colors;bus;t;enableScreenshot;getFallbackTarget;overlay=null;toolbar=null;drawingRect=null;startX=0;startY=0;isDrawing=false;isActive=false;instantMode=false;popup;savedOverflow="";preActiveFocusElement=null;keyboardTarget=null;rafId=null;pendingMoveEvent=null;rejectPendingSubmission=null;get isBusy(){return this.isActive}refreshLabels(){this.popup.refreshLabels();}get submissionInFlight(){return this.rejectPendingSubmission!==null}async maybeCapture(e){return this.enableScreenshot?jt(e):null}activate(){if(this.isActive)return;this.isActive=true;let e=!this.instantMode;this.preActiveFocusElement=document.activeElement;let n=document.activeElement;if(this.keyboardTarget=n instanceof HTMLElement&&n!==document.body&&n!==document.documentElement&&!We(n)?n:this.getFallbackTarget?.()??null,this.savedOverflow=document.body.style.overflow,document.body.style.overflow="hidden",this.overlay=chunkRHP4S23A_cjs.b("div",{style:`
|
|
64
|
+
position:fixed;inset:0;
|
|
65
|
+
z-index:${2147483646};
|
|
66
|
+
background:rgba(15, 23, 42, 0.04);
|
|
67
|
+
cursor:${e?"crosshair":"default"};
|
|
68
|
+
`}),this.overlay.setAttribute("role","application"),this.overlay.setAttribute("aria-label",e?this.t("annotator.instruction"):this.t("annotator.instantInstruction")),this.overlay.setAttribute("data-siteping-ignore","true"),e){this.toolbar=chunkRHP4S23A_cjs.b("div",{style:`
|
|
69
|
+
position:fixed;top:0;left:0;right:0;
|
|
70
|
+
z-index:${2147483647};
|
|
71
|
+
height:52px;
|
|
72
|
+
background:${this.colors.glassBg};
|
|
73
|
+
backdrop-filter:blur(24px);
|
|
74
|
+
-webkit-backdrop-filter:blur(24px);
|
|
75
|
+
border-bottom:1px solid ${this.colors.glassBorder};
|
|
76
|
+
display:flex;align-items:center;justify-content:center;gap:16px;
|
|
77
|
+
font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
78
|
+
font-size:14px;color:${this.colors.text};
|
|
79
|
+
box-shadow:0 4px 16px ${this.colors.shadow};
|
|
80
|
+
-webkit-font-smoothing:antialiased;
|
|
81
|
+
`}),this.toolbar.setAttribute("data-siteping-ignore","true");let i=chunkRHP4S23A_cjs.b("span",{style:`
|
|
82
|
+
width:8px;height:8px;border-radius:50%;
|
|
83
|
+
background:${this.colors.accent};
|
|
84
|
+
box-shadow:0 0 8px ${this.colors.accentGlow};
|
|
85
|
+
animation:pulse 1.5s ease-in-out infinite;
|
|
86
|
+
`}),o=document.createElement("style");o.textContent=["@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.4}}","@media(prefers-reduced-motion:reduce){@keyframes pulse{from,to{opacity:1}}}"].join(""),this.toolbar.appendChild(o);let r=chunkRHP4S23A_cjs.b("span",{style:"font-weight:500;letter-spacing:-0.01em;"});chunkRHP4S23A_cjs.c(r,this.t("annotator.instruction"));let s=document.createElement("button");s.style.cssText=`
|
|
87
|
+
height:34px;padding:0 18px;border-radius:9999px;
|
|
88
|
+
border:1px solid ${this.colors.border};
|
|
89
|
+
background:${this.colors.glassBg};
|
|
90
|
+
color:${this.colors.textTertiary};font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
91
|
+
font-size:13px;font-weight:500;cursor:pointer;
|
|
92
|
+
transition:all 0.2s ease;
|
|
93
|
+
`,chunkRHP4S23A_cjs.c(s,this.t("annotator.cancel")),s.addEventListener("click",()=>this.deactivate()),s.addEventListener("mouseenter",()=>{s.style.borderColor=this.colors.typeBug,s.style.color=this.colors.typeBug,s.style.background=this.colors.typeBugBg;}),s.addEventListener("mouseleave",()=>{s.style.borderColor=this.colors.border,s.style.color=this.colors.textTertiary,s.style.background=this.colors.glassBg;}),this.toolbar.appendChild(i),this.toolbar.appendChild(r),this.toolbar.appendChild(s);}e&&(this.overlay.addEventListener("mousedown",this.onMouseDown),this.overlay.addEventListener("mousemove",this.onMouseMove),this.overlay.addEventListener("mouseup",this.onMouseUp),this.overlay.addEventListener("touchstart",this.onTouchStart,{passive:false}),this.overlay.addEventListener("touchmove",this.onTouchMove,{passive:false}),this.overlay.addEventListener("touchend",this.onTouchEnd),this.overlay.addEventListener("keydown",this.onOverlayKeyDown)),this.overlay.setAttribute("tabindex","0"),document.addEventListener("keydown",this.onKeyDown),document.body.appendChild(this.overlay),this.toolbar&&document.body.appendChild(this.toolbar),this.overlay.focus({preventScroll:true});}deactivate(){if(!this.isActive)return;this.isActive=false,this.isDrawing=false,this.instantMode=false;let e=this.preActiveFocusElement;this.preActiveFocusElement=null,this.keyboardTarget=null,this.rafId!==null&&(cancelAnimationFrame(this.rafId),this.rafId=null),this.pendingMoveEvent=null,document.body.style.overflow=this.savedOverflow,document.removeEventListener("keydown",this.onKeyDown),this.overlay?.remove(),this.toolbar?.remove(),this.drawingRect?.remove(),this.overlay=null,this.toolbar=null,this.drawingRect=null,e instanceof HTMLElement&&e.isConnected&&e.focus({preventScroll:true}),this.bus.emit("annotation:end");}onKeyDown=e=>{e.key==="Escape"&&this.deactivate();};onOverlayKeyDown=async e=>{if(e.key!=="Enter"||(e.preventDefault(),this.submissionInFlight)||this.isDrawing)return;let n=this.keyboardTarget;if(!n||!(n instanceof HTMLElement))return;let i=n.getBoundingClientRect();if(i.width<=0||i.height<=0)return;let o=new DOMRect(i.x,i.y,i.width,i.height);this.drawingRect?.remove();let r=this.createDrawingRect();r.style.left=`${i.x}px`,r.style.top=`${i.y}px`,r.style.width=`${i.width}px`,r.style.height=`${i.height}px`,this.drawingRect=r,this.overlay?.appendChild(r);let a={anchor:Xe(n),rect:{xPct:0,yPct:0,wPct:1,hPct:1},scrollX:window.scrollX,scrollY:window.scrollY,viewportW:window.innerWidth,viewportH:window.innerHeight,devicePixelRatio:window.devicePixelRatio},l={},c=await this.popup.show(o,p=>this.runSubmission(a,p,o,l));this.drawingRect?.remove(),this.drawingRect=null,c&&this.deactivate();};onMouseDown=e=>{this.startDrawing(e.clientX,e.clientY);};onTouchStart=e=>{e.preventDefault();let n=e.touches[0];n&&this.startDrawing(n.clientX,n.clientY);};startDrawing(e,n){this.submissionInFlight||(this.isDrawing=true,this.startX=e,this.startY=n,this.drawingRect?.remove(),this.drawingRect=this.createDrawingRect(),this.overlay?.appendChild(this.drawingRect));}createDrawingRect(){let e=chunkRHP4S23A_cjs.b("div",{style:`
|
|
94
|
+
position:fixed;
|
|
95
|
+
border:2px solid ${this.colors.accent};
|
|
96
|
+
background:${this.colors.accent}12;
|
|
97
|
+
pointer-events:none;
|
|
98
|
+
border-radius:8px;
|
|
99
|
+
box-shadow:0 0 16px ${this.colors.accentGlow};
|
|
100
|
+
transition:box-shadow 0.15s ease;
|
|
101
|
+
`});return e.setAttribute("data-siteping-ignore","true"),e}onMouseMove=e=>{this.scheduleRectUpdate(e);};onTouchMove=e=>{e.preventDefault(),e.touches[0]&&this.scheduleRectUpdate(e.touches[0]);};scheduleRectUpdate(e){!this.isDrawing||!this.drawingRect||(this.pendingMoveEvent=e,this.rafId===null&&(this.rafId=requestAnimationFrame(()=>{this.rafId=null;let n=this.pendingMoveEvent;if(!n||!this.drawingRect)return;let i=Math.min(n.clientX,this.startX),o=Math.min(n.clientY,this.startY),r=Math.abs(n.clientX-this.startX),s=Math.abs(n.clientY-this.startY);this.drawingRect.style.left=`${i}px`,this.drawingRect.style.top=`${o}px`,this.drawingRect.style.width=`${r}px`,this.drawingRect.style.height=`${s}px`;})));}onTouchEnd=async e=>{let n=e.changedTouches[0];n&&await this.finishDrawing(n.clientX,n.clientY);};onMouseUp=async e=>{await this.finishDrawing(e.clientX,e.clientY);};finishDrawing=async(e,n)=>{if(!this.isDrawing||!this.drawingRect)return;this.isDrawing=false;let i=Math.min(e,this.startX),o=Math.min(n,this.startY),r=Math.abs(e-this.startX),s=Math.abs(n-this.startY);if(r<10||s<10){this.drawingRect.remove(),this.drawingRect=null;return}let a=new DOMRect(i,o,r,s),{annotation:l}=this.buildAnnotation(a),c={},p=await this.popup.show(a,u=>this.runSubmission(l,u,a,c));this.drawingRect?.remove(),this.drawingRect=null,p&&this.deactivate();};async startInstantAnnotation(e,n){if(this.isActive)return;this.instantMode=true,this.bus.emit("annotation:start");let i=Math.max(0,Math.min(e-20/2,window.innerWidth-20)),o=Math.max(0,Math.min(n-20/2,window.innerHeight-20)),r=new DOMRect(i,o,20,20),{annotation:s,anchorBounds:a}=this.buildAnnotation(r),l=Math.max(0,a.left),c=Math.max(0,a.top),p=new DOMRect(l,c,Math.max(0,Math.min(a.right,window.innerWidth)-l),Math.max(0,Math.min(a.bottom,window.innerHeight)-c));this.drawingRect?.remove(),this.drawingRect=chunkRHP4S23A_cjs.b("div",{style:`
|
|
102
|
+
position:fixed;
|
|
103
|
+
left:${i}px;
|
|
104
|
+
top:${o}px;
|
|
105
|
+
width:${20}px;
|
|
106
|
+
height:${20}px;
|
|
107
|
+
border:2px solid ${this.colors.accent};
|
|
108
|
+
background:${this.colors.accent}12;
|
|
109
|
+
pointer-events:none;
|
|
110
|
+
border-radius:8px;
|
|
111
|
+
box-shadow:0 0 16px ${this.colors.accentGlow};
|
|
112
|
+
`}),this.drawingRect.setAttribute("data-siteping-ignore","true"),this.overlay?.appendChild(this.drawingRect);let u={};await this.popup.show(r,d=>this.runSubmission(s,d,p,u)),this.drawingRect?.remove(),this.drawingRect=null,this.deactivate();}async runSubmission(e,n,i,o){o.value===void 0&&(o.value=await this.maybeCapture(i));let r=o.value;await new Promise((s,a)=>{let l=()=>{c(),p(),u(),this.rejectPendingSubmission=null;},c=this.bus.on("feedback:sent",()=>{l(),s();}),p=this.bus.on("feedback:error",d=>{l(),a(d);}),u=this.bus.on("submission:cancelled",()=>{l(),a(new Error("Feedback submission cancelled"));});this.rejectPendingSubmission=d=>{l(),a(d);},this.bus.emit("annotation:complete",{annotation:e,type:n.type,message:n.message,screenshotDataUrl:r?.dataUrl??null,screenshotRegion:r?.region??null});});}buildAnnotation(e){this.overlay&&(this.overlay.style.pointerEvents="none");let n=$t(e);this.overlay&&(this.overlay.style.pointerEvents="auto");let i=Xe(n),o=n.getBoundingClientRect(),r=Ot(e,o);return {annotation:{anchor:i,rect:r,scrollX:window.scrollX,scrollY:window.scrollY,viewportW:window.innerWidth,viewportH:window.innerHeight,devicePixelRatio:window.devicePixelRatio},anchorBounds:o}}destroy(){this.deactivate(),this.rejectPendingSubmission?.(new Error("Annotator destroyed during submission")),this.popup.destroy();}};async function ee(t,e){let n=await t.text().catch(()=>"Unknown error"),i=n?`${t.status} ${n}`:`${t.status}`,o=`${e}: ${i}`;return t.status===401||t.status===403?new chunkRHP4S23A_cjs.F(o):t.status>=400&&t.status<500?new chunkRHP4S23A_cjs.E(o):new chunkRHP4S23A_cjs.C(o,"SERVER",false)}function te(t,e){if(t instanceof chunkRHP4S23A_cjs.D)return t;let n=t instanceof Error?t.message:String(t);return new chunkRHP4S23A_cjs.D(`${e}: ${n}`)}async function W(t,e){let n={};e&&(n["Content-Type"]="application/json"),t.apiKey&&(n.Authorization=`Bearer ${t.apiKey}`);let i=typeof t.headers=="function"?await t.headers():t.headers;return i&&Object.assign(n,i),n}var Hn=3,Dn=1e4,ve="siteping_retry_queue",$n=20;async function ne(t,e,n=Hn){for(let i=0;i<=n;i++){let o=new AbortController,r=setTimeout(()=>o.abort(),Dn);try{let l=await fetch(t,{...e,signal:o.signal});if(clearTimeout(r),l.ok||l.status>=400&&l.status<500||i===n)return l}catch(l){if(clearTimeout(r),i===n)throw l}let s=1e3*2**i,a=Math.random()*1e3-500;await new Promise(l=>setTimeout(l,s+a));}throw new Error("Max retries exceeded")}var On="siteping_retry_queue";async function Wt(t){return typeof navigator<"u"&&navigator.locks?navigator.locks.request(On,()=>t()):t()}function Yt(){let t=localStorage.getItem(ve);if(!t)return [];let e=JSON.parse(t);return Array.isArray(e)?e:[]}function Bn(t,e){Wt(()=>{try{let n=Yt();n.length>=$n&&n.shift(),n.push({endpoint:t,payload:e}),localStorage.setItem(ve,JSON.stringify(n));}catch{}});}function Kt(t){return t.trim()}function Xt(t){return t.trim().toLowerCase()}async function Ut(t,e,n={}){await Wt(async()=>{try{let i=Yt();if(i.length===0)return;let o=[],r=[],s=0;for(let c of i){if(c.endpoint!==t){r.push(c);continue}!e||Kt(c.payload.authorName)===Kt(e.name)&&Xt(c.payload.authorEmail)===Xt(e.email)?o.push(c):s+=1;}if(o.length===0&&s===0)return;s>0;let a=[];if(o.length>0){let c=await W(n,!0);for(let p of o)try{(await fetch(t,{method:"POST",headers:c,body:JSON.stringify(p.payload)})).ok||a.push(p);}catch{a.push(p);}}let l=r.concat(a);l.length>0?localStorage.setItem(ve,JSON.stringify(l)):localStorage.removeItem(ve);}catch{}});}async function Ue(t){return await t.json()}var xe=class{constructor(e,n,i={}){this.endpoint=e;this.projectName=n;this.auth=i;}endpoint;projectName;auth;async sendFeedback(e){let{screenshotRegion:n,...i}=e,o=n?{...i,screenshotRegion:n}:i;try{let r;try{r=await ne(this.endpoint,{method:"POST",headers:await W(this.auth,!0),body:JSON.stringify(o)});}catch(s){throw te(s,"Failed to send feedback")}if(!r.ok)throw await ee(r,"Failed to send feedback");return Ue(r)}catch(r){throw Bn(this.endpoint,o),r}}async getFeedbacks(e,n){let i=new URLSearchParams({projectName:e});n?.page&&i.set("page",String(n.page)),n?.limit&&i.set("limit",String(n.limit)),n?.type&&i.set("type",n.type),n?.status&&i.set("status",n.status),n?.statuses?.length&&i.set("statuses",n.statuses.join(",")),n?.search&&i.set("search",n.search),n?.url&&i.set("url",n.url),n?.urlPattern&&i.set("urlPattern",n.urlPattern);let o;try{let r=await W(this.auth,!1);o=await ne(`${this.endpoint}?${i.toString()}`,{method:"GET",cache:"no-store",...Object.keys(r).length>0?{headers:r}:{}});}catch(r){throw te(r,"Failed to fetch feedbacks")}if(!o.ok)throw await ee(o,"Failed to fetch feedbacks");return Ue(o)}async resolveFeedback(e,n){let i;try{i=await ne(this.endpoint,{method:"PATCH",headers:await W(this.auth,!0),body:JSON.stringify({id:e,projectName:this.projectName,status:n?"resolved":"open"})});}catch(o){throw te(o,"Failed to update feedback")}if(!i.ok)throw await ee(i,"Failed to update feedback");return Ue(i)}async deleteFeedback(e){let n;try{n=await ne(this.endpoint,{method:"DELETE",headers:await W(this.auth,!0),body:JSON.stringify({id:e,projectName:this.projectName})});}catch(i){throw te(i,"Failed to delete feedback")}if(!n.ok)throw await ee(n,"Failed to delete feedback")}async deleteAllFeedbacks(e){let n;try{n=await ne(this.endpoint,{method:"DELETE",headers:await W(this.auth,!0),body:JSON.stringify({projectName:e,deleteAll:!0})});}catch(i){throw te(i,"Failed to delete all feedbacks")}if(!n.ok)throw await ee(n,"Failed to delete all feedbacks")}};var zn=["log","info","warn","error"];function jn(t){if(t===null)return "null";if(t===void 0)return "undefined";if(typeof t=="string")return t;if(typeof t=="number"||typeof t=="boolean"||typeof t=="bigint")return String(t);if(t instanceof Error)return `${t.name}: ${t.message}${t.stack?`
|
|
113
|
+
${t.stack}`:""}`;try{let e=new WeakSet;return JSON.stringify(t,(n,i)=>{if(typeof i=="function")return "[Function]";if(typeof i=="symbol")return i.toString();if(typeof i=="object"&&i!==null){if(e.has(i))return "[Circular]";e.add(i);}return i})}catch{try{return String(t)}catch{return "[Unserializable]"}}}function Kn(t){let e="";for(let n=0;n<t.length&&(n>0&&(e+=" "),e+=jn(t[n]),!(e.length>=500));n++);return e.length>500&&(e=`${e.slice(0,499)}\u2026`),e}var we=class{maxEntries;entries=[];originals=new Map;disposed=false;constructor(e=50){if(this.maxEntries=Math.min(Math.max(Math.floor(e),0),1e3),!(typeof console>"u"))for(let n of zn){let i=console[n];if(typeof i!="function")continue;this.originals.set(n,i);let o=this,r=function(...s){try{o.push(n,s);}catch{}i.apply(this??console,s);};try{Object.defineProperty(r,"name",{value:n});}catch{}console[n]=r;}}push(e,n){this.maxEntries!==0&&(this.entries.length>=this.maxEntries&&this.entries.shift(),this.entries.push({level:e,timestamp:new Date().toISOString(),message:Kn(n)}));}getEntries(){return this.entries.slice()}dispose(){if(!this.disposed&&(this.disposed=true,!(typeof console>"u"))){for(let[e,n]of this.originals)try{console[e]=n;}catch{}this.originals.clear();}}};function qt(t){return t.length<=2e3?t:`${t.slice(0,1999)}\u2026`}function Gt(t){if(typeof t=="string")return t;if(t instanceof URL)return t.href;if(typeof t=="object"&&t!==null&&"url"in t){let e=t.url;if(typeof e=="string")return e}try{return String(t)}catch{return "(unknown)"}}var Ee=class{maxEntries;entries=[];originalFetch=null;originalXhrOpen=null;originalXhrSend=null;disposed=false;constructor(e=20){this.maxEntries=Math.min(Math.max(Math.floor(e),0),500),this.installFetch(),this.installXhr();}push(e){this.maxEntries!==0&&(this.entries.length>=this.maxEntries&&this.entries.shift(),this.entries.push(e));}installFetch(){if(typeof globalThis.fetch!="function")return;let e=globalThis.fetch;this.originalFetch=e;let n=async(i,o)=>{let r=new Date,s=typeof performance<"u"?performance.now():Date.now(),a=qt(Gt(i)),l=(o?.method??(i instanceof Request?i.method:"GET")).toUpperCase();try{let c=await e(i,o);if(!c.ok){let p=typeof performance<"u"?performance.now():Date.now();this.push({url:a,method:l,status:c.status,durationMs:Math.round(p-s),timestamp:r.toISOString()});}return c}catch(c){let p=typeof performance<"u"?performance.now():Date.now();throw this.push({url:a,method:l,status:0,durationMs:Math.round(p-s),timestamp:r.toISOString()}),c}};globalThis.fetch=n;}installXhr(){if(typeof XMLHttpRequest>"u")return;let e=XMLHttpRequest.prototype,n=e.open,i=e.send;this.originalXhrOpen=n,this.originalXhrSend=i;let o=this,r=new WeakMap;e.open=function(s,a,...l){try{r.set(this,{method:s.toUpperCase(),url:qt(Gt(a)),startedAt:new Date,t0:typeof performance<"u"?performance.now():Date.now()});}catch{}return n.call(this,s,a,...l)},e.send=function(s){let a=r.get(this);if(a){let l=()=>{try{let c=typeof performance<"u"?performance.now():Date.now(),p=this.status;(p===0||p>=400)&&o.push({url:a.url,method:a.method,status:p,durationMs:Math.round(c-a.t0),timestamp:a.startedAt.toISOString()});}catch{}};try{this.addEventListener("loadend",l,{once:!0});}catch{try{this.addEventListener("loadend",l);}catch{}}}return i.call(this,s??null)};}getEntries(){return this.entries.slice()}dispose(){if(!this.disposed){if(this.disposed=true,this.originalFetch&&typeof globalThis.fetch=="function")try{globalThis.fetch=this.originalFetch;}catch{}if(typeof XMLHttpRequest<"u")try{this.originalXhrOpen&&(XMLHttpRequest.prototype.open=this.originalXhrOpen),this.originalXhrSend&&(XMLHttpRequest.prototype.send=this.originalXhrSend);}catch{}}}};var ie=class{listeners=new Map;on(e,n){let i=this.listeners.get(e);return i||(i=new Set,this.listeners.set(e,i)),i.add(n),()=>{i?.delete(n);}}off(e,n){this.listeners.get(e)?.delete(n);}emit(e,...n){let i=this.listeners.get(e);if(i)for(let o of i)try{o(...n);}catch(r){console.error(`[siteping] Error in event listener for "${String(e)}":`,r);}}removeAll(){this.listeners.clear();}};var Xn=54,Wn={chat:"fab.messages",annotate:"fab.annotate","toggle-annotations":"fab.annotations"},ke=class{constructor(e,n,i,o){this.bus=i;this.t=o;let r=n.position??"bottom-right",s=r==="bottom-right";this.items=[{id:"chat",icon:chunkRHP4S23A_cjs.u},{id:"annotate",icon:chunkRHP4S23A_cjs.v}],n.showAnnotationsToggle!==false&&this.items.push({id:"toggle-annotations",icon:chunkRHP4S23A_cjs.g,iconAlt:chunkRHP4S23A_cjs.h}),this.fab=document.createElement("button"),this.fab.className=`sp-fab sp-fab--${r} sp-anim-fab-in`,this.fab.style.position="fixed",this.fab.appendChild(chunkRHP4S23A_cjs.a(chunkRHP4S23A_cjs.f)),this.fab.setAttribute("aria-expanded","false"),this.fab.addEventListener("click",()=>this.toggle()),this.radialContainer=document.createElement("div"),this.radialContainer.className=`sp-radial sp-radial--${r}`,this.radialContainer.setAttribute("role","menu");for(let c=0;c<this.items.length;c++){let p=this.items[c];if(!p)continue;let u=document.createElement("button");u.className="sp-radial-item",u.style.setProperty("--sp-i",String(c)),u.appendChild(chunkRHP4S23A_cjs.a(p.icon)),u.setAttribute("role","menuitem"),u.dataset.itemId=p.id,u.addEventListener("click",f=>{f.stopPropagation(),this.handleItemClick(p.id);});let d=document.createElement("span");d.className="sp-radial-label",d.style.cssText=s?"position:absolute; right:54px; top:50%; transform:translateY(-50%); white-space:nowrap;":"position:absolute; left:54px; top:50%; transform:translateY(-50%); white-space:nowrap;",u.appendChild(d),this.radialContainer.appendChild(u);}this.root=document.createElement("div"),this.root.appendChild(this.radialContainer),this.root.appendChild(this.fab),e.appendChild(this.root),this.applyLabels();let a=e.host;this.onDocumentClick=c=>{this.isOpen&&!c.composedPath().includes(a)&&this.close();},document.addEventListener("click",this.onDocumentClick);let l=c=>{c.key==="Escape"&&this.isOpen&&(c.stopPropagation(),this.close());};this.fab.addEventListener("keydown",l),this.radialContainer.addEventListener("keydown",l),this.radialContainer.addEventListener("keydown",c=>{let p=Array.from(this.radialContainer.querySelectorAll(".sp-radial-item"));if(p.length===0||!this.isOpen)return;let u=e.activeElement??document.activeElement,d=p.indexOf(u);switch(c.key){case "ArrowUp":{c.preventDefault();let f=d<=0?p.length-1:d-1;p[f]?.focus();break}case "ArrowDown":{c.preventDefault();let f=d>=p.length-1?0:d+1;p[f]?.focus();break}case "Home":{c.preventDefault(),p[0]?.focus();break}case "End":{c.preventDefault(),p[p.length-1]?.focus();break}}});}bus;t;root;fab;radialContainer;badgeEl=null;isOpen=false;annotationsVisible=true;items;onDocumentClick;refreshLabels(){this.applyLabels();}applyLabels(){this.fab.setAttribute("aria-label",this.t("fab.aria"));let e=this.radialContainer.querySelectorAll(".sp-radial-item");for(let n of e){let i=n.dataset.itemId;if(!i)continue;let o=Wn[i];if(!o)continue;let r=this.t(o);n.setAttribute("aria-label",r);let s=n.querySelector(".sp-radial-label");s&&chunkRHP4S23A_cjs.c(s,r);}}updateBadge(e){if(e<=0){this.badgeEl?.remove(),this.badgeEl=null;return}this.badgeEl||(this.badgeEl=document.createElement("span"),this.badgeEl.className="sp-fab-badge",this.badgeEl.setAttribute("role","status"),this.badgeEl.setAttribute("aria-live","polite"),this.fab.appendChild(this.badgeEl));let n=e>99?"99+":String(e);chunkRHP4S23A_cjs.c(this.badgeEl,n),this.badgeEl.setAttribute("aria-label",this.t("fab.badge").replace("{count}",String(e)));}toggle(){this.isOpen?this.close():this.open();}open(){this.isOpen=true,this.setFabIcon(chunkRHP4S23A_cjs.i),this.fab.setAttribute("aria-expanded","true"),this.radialContainer.querySelectorAll(".sp-radial-item").forEach((n,i)=>{let o=-(16+Xn*(i+1));n.style.transform=`translate(0px, ${o}px) scale(1)`,n.classList.add("sp-radial-item--open");}),requestAnimationFrame(()=>{this.radialContainer.querySelector(".sp-radial-item")?.focus();});}close(){this.isOpen=false,this.setFabIcon(chunkRHP4S23A_cjs.f),this.fab.setAttribute("aria-expanded","false"),this.radialContainer.querySelectorAll(".sp-radial-item").forEach(n=>{n.style.transform="translate(0, 0) scale(0.8)",n.classList.remove("sp-radial-item--open");}),this.fab.focus();}setFabIcon(e){let n=this.badgeEl;this.fab.replaceChildren(chunkRHP4S23A_cjs.a(e)),n&&this.fab.appendChild(n);}handleItemClick(e){switch(this.close(),e){case "chat":this.bus.emit("panel:toggle",true);break;case "annotate":{let n=this.bus.on("annotation:end",()=>{n(),this.fab.focus();});this.bus.emit("annotation:start");break}case "toggle-annotations":{this.annotationsVisible=!this.annotationsVisible,this.bus.emit("annotations:toggle",this.annotationsVisible);let i=this.radialContainer.querySelector('[data-item-id="toggle-annotations"]')?.querySelector("svg");if(i){let o=chunkRHP4S23A_cjs.a(this.annotationsVisible?chunkRHP4S23A_cjs.g:chunkRHP4S23A_cjs.h);i.replaceWith(o);}break}}}destroy(){document.removeEventListener("click",this.onDocumentClick),this.root.remove();}};var Vt="siteping_identity";function Yn(t){if(!chunkRHP4S23A_cjs.G(t,"name")||!chunkRHP4S23A_cjs.G(t,"email"))return false;let e=t.name,n=t.email;return typeof e=="string"&&typeof n=="string"&&e.length>0&&n.length>0}function qe(){try{let t=localStorage.getItem(Vt);if(!t)return null;let e=JSON.parse(t);return Yn(e)?e:null}catch{return null}}function Zt(t){try{localStorage.setItem(Vt,JSON.stringify(t));}catch{}}function Y(t){return t.normalize("NFC").replace(/\s+/g," ").trim()}function Jt(t){return t.replace(/\s+/g," ").trim()}function Un(t,e){if(t===e)return 0;if(t.length===0)return e.length;if(e.length===0)return t.length;if(t.length>e.length){let s=t;t=e,e=s;}let n=t.length,i=e.length,o=new Array(n+1);for(let s=0;s<=n;s++)o[s]=s;let r=new Array(n+1);for(let s=1;s<=i;s++){r[0]=s;for(let l=1;l<=n;l++){let c=o[l-1];r[l]=t[l-1]===e[s-1]?c:1+Math.min(c,o[l],r[l-1]);}let a=o;o=r,r=a;}return o[n]}function oe(t,e){if(t===e)return 1;let n=Math.max(t.length,e.length);return n===0?1:1-Un(t,e)/n}function qn(t,e){let n=e.length,i=new Int32Array(n+1),o=new Int32Array(n+1);for(let s=0;s<=n;s++)i[s]=s;let r=n;for(let s=1;s<=t.length;s++){o[0]=0;let a=t.charCodeAt(s-1);for(let p=1;p<=n;p++){let u=i[p-1]+(e.charCodeAt(p-1)===a?0:1),d=i[p]+1,f=o[p-1]+1;o[p]=Math.min(u,d,f);}let l=o[n];l<r&&(r=l);let c=i;i=o,o=c;}return r}function Qt(t,e,n=.6){if(!e||!t)return 0;if(t.includes(e))return 1;let i=t.length>500?t.slice(0,500):t;if(e.length>i.length){let r=oe(i,e);return r>=n?r:0}if(e.length<8&&i.length>64)return 0;let o=1-qn(i,e)/e.length;return o>=n?o:0}function en(t){let e=new Map;for(let n=0;n<t.length-1;n++){let i=t.charCodeAt(n)<<16|t.charCodeAt(n+1);e.set(i,(e.get(i)??0)+1);}return e}function tn(t,e,n){let i=n.length-1;if(e<=0||i<=0)return 0;let o=0,r=new Map;for(let s=0;s<n.length-1;s++){let a=n.charCodeAt(s)<<16|n.charCodeAt(s+1),l=t.get(a);if(l===void 0)continue;let c=r.get(a)??0;c<l&&(r.set(a,c+1),o++);}return 2*o/(e+i)}function nn(t){let e=new Map,n=t.split(" ");for(let i=0;i<n.length-1;i++){let o=`${n[i]} ${n[i+1]}`;e.set(o,(e.get(o)??0)+1);}return e}function on(t,e,n){if(e<=0)return 0;let i=n.split(" "),o=i.length-1;if(o<=0)return 0;let r=0,s=new Map;for(let a=0;a<i.length-1;a++){let l=`${i[a]} ${i[a+1]}`,c=t.get(l);if(c===void 0)continue;let p=s.get(l)??0;p<c&&(s.set(l,p+1),r++);}return 2*r/(e+o)}var Gn={checkOpacity:true,opacityProperty:true,checkVisibilityCSS:true,visibilityProperty:true};function se(t){if(!t.isConnected)return "hidden";if(typeof t.checkVisibility=="function")return t.checkVisibility(Gn)?"visible":t.checkVisibility()?"soft-hidden":"hidden";if(t.getClientRects().length>0)try{return getComputedStyle(t).visibility==="visible"?"visible":"soft-hidden"}catch{return "visible"}let e=t.firstElementChild;return e&&e.getClientRects().length>0?"visible":t.ownerDocument.documentElement.getClientRects().length===0?"unknown":"hidden"}function sn(t){switch(t){case "hidden":return .3;case "soft-hidden":return .6;default:return 1}}var U={anchorKey:1,id:1,css:.95,xpath:.9,scan:.85},Se=16,Vn=24,Zn=1e4,Je=500,Jn=.5,Ge=.6,Qn=.4,ei=2e3,Ze=.8,Ve=.6,ti=.05;function Te(t,e){return Y((t??"").slice(0,ei)).slice(0,e)}function ni(t){let e=Te(t.textSnippet,Je),n=nn(e),i=0;for(let o of n.values())i+=o;return {snippet:e,snippetBigrams:en(e),snippetBigramTotal:Math.max(0,e.length-1),snippetWordPairs:n,snippetWordPairTotal:i,prefix:Te(t.textPrefix,128),suffix:Te(t.textSuffix,128),neighbor:Te(t.neighborText,128),fingerprint:(t.fingerprint??"").slice(0,64),tag:typeof t.elementTag=="string"?t.elementTag:""}}function ii(t,e){let n=ni(t),i=oi(t),o=[];for(let[u,d]of i){let f=rn(u,d,n);f&&o.push(f);}let r=0,s=false;for(let u of o)u.final>r&&(r=u.final),(u.strategy==="id"||u.strategy==="anchorKey")&&u.visibility===1&&(u.signals?.text??0)>=Ze&&(u.signals?.fingerprint===void 0||u.signals.fingerprint>=Ze)&&(s=true);let a=!!(n.snippet||n.fingerprint||n.prefix||n.suffix||n.neighbor),l=e?.scanBudget;if(a&&r<U.scan&&!s)if(l&&l.remaining<=0)l.starved=true;else {l&&l.remaining--;for(let u of si(n,i)){let d=rn(u,"scan",n);d&&o.push(d);}}let c=o.filter(ri);if(c.length===0)return null;c.sort((u,d)=>d.final-u.final);let p=li(c);return {element:p.element,confidence:ci(p),strategy:p.strategy}}function oi(t){let e=new Map,n=(i,o,r)=>{!i||e.has(i)||r&&i.tagName!==t.elementTag||e.set(i,o);};if(t.anchorKey){let i=t.anchorKey.replace(/\\/g,"\\\\").replace(/"/g,'\\"');try{let o=document.querySelectorAll(`[${J}="${i}"]`);for(let r=0;r<Math.min(o.length,Se);r++)n(o[r]??null,"anchorKey",!1);}catch{}}if(t.elementId){let i=t.elementId.replace(/\\/g,"\\\\").replace(/"/g,'\\"');try{let o=document.querySelectorAll(`[id="${i}"]`);for(let r=0;r<Math.min(o.length,Se);r++)n(o[r]??null,"id",!0);}catch{n(document.getElementById(t.elementId),"id",true);}}try{let i=document.querySelectorAll(t.cssSelector);for(let o=0;o<Math.min(i.length,Se);o++)n(i[o]??null,"css",!0);}catch{}try{let i=document.evaluate(t.xpath,document,null,XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,null),o=Math.min(i.snapshotLength,Se);for(let r=0;r<o;r++){let s=i.snapshotItem(r);s instanceof Element&&n(s,"xpath",!0);}}catch{}return e}function si(t,e){let n=t.tag.toLowerCase();if(!n)return [];let i;try{i=document.querySelectorAll(n);}catch{return []}let o=t.fingerprint.split(":"),r=o.length===3?Number(o[0]):Number.NaN,s=o.length===3?o[2]??"":"",a=Math.min(i.length,Zn),l=[];for(let c=0;c<a;c++){let p=i[c];if(!p||e.has(p))continue;let u=0;if(t.snippetBigramTotal>0){let d=Jt(K(p,Je)),f=tn(t.snippetBigrams,t.snippetBigramTotal,d);if(t.snippetWordPairTotal>0){let m=f>0?on(t.snippetWordPairs,t.snippetWordPairTotal,d):0;u+=.6*(.5*f+.5*m);}else u+=.6*f;}if(s&&Ke(p)===s&&(u+=.25),!Number.isNaN(r)){let d=Math.abs(p.children.length-r);d===0?u+=.15:d<=2&&(u+=.07);}l.push({element:p,cheap:u});}return l.sort((c,p)=>p.cheap-c.cheap),l.slice(0,Vn).map(c=>c.element)}function rn(t,e,n){let i=ai(t,n),o=sn(se(t));return i===null?e==="scan"?null:{element:t,strategy:e,verification:Ve,strongest:Ve,visibility:o,final:U[e]*Ve*o,unverified:true}:{element:t,strategy:e,verification:i.blend,strongest:i.strongest,signals:i,visibility:o,final:U[e]*i.blend*o}}function ri(t){if(t.strategy==="scan")return t.verification>=Qn;if(t.unverified||!t.signals)return true;let e=t.signals;return e.text===void 0||e.text>=Jn?true:(e.fingerprint??0)>=Ge||(e.context??0)>=Ge||(e.neighbor??0)>=Ge}function ai(t,e){let n=0,i=0,o={blend:0,strongest:0};if(e.snippet){i+=40;let r=Y(K(t,Je));o.text=Qt(r,e.snippet,.5),n+=o.text*40;}if(e.fingerprint&&(i+=20,o.fingerprint=_t(t,e.fingerprint),n+=o.fingerprint*20),e.prefix||e.suffix){i+=20;let r=0,s=0;if(e.prefix){let a=Y(X(t,"before"));r+=a?oe(a,e.prefix):0,s++;}if(e.suffix){let a=Y(X(t,"after"));r+=a?oe(a,e.suffix):0,s++;}s>0&&(o.context=r/s,n+=o.context*20);}if(e.neighbor){i+=20;let r=Y(me(t));o.neighbor=r?oe(r,e.neighbor):0,n+=o.neighbor*20;}return i===0?null:(o.blend=n/i,o.strongest=Math.max(o.text??0,o.fingerprint??0,o.context??0,o.neighbor??0),o)}function li(t){let e=t[0],n=t.filter(o=>e.final-o.final<=ti&&(o===e||e.element.contains(o.element))),i=e;for(let o of n)o!==i&&i.element.contains(o.element)&&(i=o);return i}function ci(t){return t.strategy==="scan"?Math.min(t.verification,U.scan):t.unverified?U[t.strategy]:U[t.strategy]*Math.min(1,t.strongest/Ze)}function Ce(t,e,n){let i=ii(t,n);if(!i)return null;let o=i.element.getBoundingClientRect(),r=new DOMRect(o.x+e.xPct*o.width,o.y+e.yPct*o.height,e.wPct*o.width,e.hPct*o.height);return {element:i.element,rect:r,confidence:i.confidence,strategy:i.strategy}}function Qe(t){return {cssSelector:t.cssSelector,xpath:t.xpath,textSnippet:t.textSnippet,elementTag:t.elementTag,elementId:t.elementId??void 0,textPrefix:t.textPrefix,textSuffix:t.textSuffix,fingerprint:t.fingerprint,neighborText:t.neighborText,anchorKey:t.anchorKey??null}}function Ae(t){return {xPct:t.xPct,yPct:t.yPct,wPct:t.wPct,hPct:t.hPct}}var an=13;function ln(t){return {top:t.top+window.scrollY-an,left:t.right+window.scrollX-an}}function re(t,e){let n=t.entries[e],i=t.elementIndices[e];if(!(!n||i===void 0))return n.elements[i]}var cn=300,pn=200,pi=3e3,di=.7,ui=28,dn=32,Re=class{constructor(e,n,i,o,r=null){this.colors=e;this.tooltip=n;this.bus=i;this.t=o;this.liveRegion=r;this.container=chunkRHP4S23A_cjs.b("div",{style:`position:absolute;top:0;left:0;pointer-events:none;z-index:${2147483646};`}),this.container.id="siteping-markers",document.body.appendChild(this.container),this.bus.on("annotations:toggle",s=>{this.container.style.display=s?"block":"none";}),this.resizeHandler=()=>this.scheduleReposition("resize"),window.addEventListener("resize",this.resizeHandler,{passive:true}),this.scrollHandler=()=>this.scheduleReposition("scroll"),window.addEventListener("scroll",this.scrollHandler,{passive:true,capture:true}),this.mutationObserver=new MutationObserver(s=>{let a=false;for(let l of s)if(!(this.container.contains(l.target)||this.tooltip.contains(l.target))){a=true;break}a&&this.scheduleReposition("mutation");}),this.mutationObserver.observe(document.body,{childList:true,subtree:true,attributes:false,characterData:false}),this.onDocumentClickForClusters=s=>{this.container.contains(s.target)||this.collapseAllClusters();},document.addEventListener("click",this.onDocumentClickForClusters);}colors;tooltip;bus;t;liveRegion;container;entries=[];highlightElements=[];pinnedFeedback=null;onDocumentClick=null;repositionTimer=null;mutationObserver=null;scrollHandler=null;resizeHandler=null;anchorCache=new Map;pendingLayoutChange=false;pendingResize=false;hiddenRecheckAt=new Map;clusters=[];onDocumentClickForClusters=null;lastOpenCount=-1;get count(){return this.entries.length}get openCount(){let e=0;for(let n of this.entries)chunkRHP4S23A_cjs.J(n.feedback.status)||e++;return e}scheduleReposition(e="mutation"){e!=="scroll"&&(this.pendingLayoutChange=true),e==="resize"&&(this.pendingResize=true),!this.repositionTimer&&("requestIdleCallback"in window?this.repositionTimer=window.requestIdleCallback(()=>{this.repositionTimer=null,this.repositionAll();},{timeout:pn+100}):this.repositionTimer=+setTimeout(()=>{this.repositionTimer=null,this.repositionAll();},pn));}repositionAll(){let e=this.pendingLayoutChange,n=this.pendingResize;this.pendingLayoutChange=false,this.pendingResize=false,n&&this.hiddenRecheckAt.clear();let i=Date.now(),o={remaining:2,starved:false},r=new Set;for(let s of this.entries)for(let a=0;a<s.feedback.annotations.length;a++){let l=s.elements[a];if(!l)continue;let c=s.feedback.annotations[a];if(!c)continue;let p=`${s.feedback.id}:${a}`;r.add(p);let d=this.anchorCache.get(p)?.deref(),f,m=(this.hiddenRecheckAt.get(p)??0)>i,T=d?.isConnected&&(m||!(e&&se(d)==="hidden"));if(d&&T){let x=d.getBoundingClientRect(),A=Ae(c);f={element:d,rect:new DOMRect(x.left+A.xPct*x.width,x.top+A.yPct*x.height,A.wPct*x.width,A.hPct*x.height),confidence:1,strategy:"css"};}else m?f=null:(o.starved=false,f=Ce(Qe(c),Ae(c),{scanBudget:o}),o.starved||(f?.element&&this.anchorCache.set(p,new WeakRef(f.element)),!f||se(f.element)==="hidden"?this.hiddenRecheckAt.set(p,i+pi):this.hiddenRecheckAt.delete(p)));if(!f){l.style.display="none";continue}let E=ln(f.rect);s.baseTop=E.top,s.baseLeft=E.left,l.style.display="flex",this.applyConfidenceStyle(l,f.confidence,s.feedback);}for(let s of this.anchorCache.keys())r.has(s)||this.anchorCache.delete(s);for(let s of this.hiddenRecheckAt.keys())r.has(s)||this.hiddenRecheckAt.delete(s);this.applyClusterPositions(),this.pinnedFeedback&&this.showHighlight(this.pinnedFeedback);}applyClusterPositions(){for(let e of this.clusters)e.expanded?this.applyFanPositions(e):this.applyStackPositions(e);}emitMarkersChanged(){let e=this.openCount;e!==this.lastOpenCount&&(this.lastOpenCount=e,this.bus.emit("markers:changed",e));}render(e){this.clear(),e.forEach((n,i)=>{let o=this.buildEntry(n,i+1);this.entries.push(o);}),this.buildClusters(),this.liveRegion&&this.entries.length>0&&(this.liveRegion.textContent=this.t("marker.count").replace("{count}",String(this.entries.length))),this.emitMarkersChanged();}addFeedback(e,n){let i=this.buildEntry(e,n);for(let o of i.elements)o.style.animation="sp-marker-in 0.35s cubic-bezier(0.34,1.56,0.64,1) both";this.entries.push(i),this.buildClusters(),this.emitMarkersChanged();}buildEntry(e,n){let i={feedback:e,elements:[],baseTop:0,baseLeft:0};for(let o of e.annotations){let r=Ce(Qe(o),Ae(o));if(!r)continue;let s=ln(r.rect);i.baseTop=s.top,i.baseLeft=s.left;let a=this.createMarker(n,e,s);this.applyConfidenceStyle(a,r.confidence,e),this.container.appendChild(a),i.elements.push(a);}return i}buildClusters(){for(let i of this.container.querySelectorAll(".sp-cluster-badge"))i.remove();let e=[];for(let i of this.entries)for(let o=0;o<i.elements.length;o++)e.push({entry:i,elIdx:o});let n=new Set;this.clusters=[];for(let i=0;i<e.length;i++){if(n.has(i))continue;let o=e[i];if(!o)continue;let r={entries:[o.entry],elementIndices:[o.elIdx],expanded:false};n.add(i);for(let s=i+1;s<e.length;s++){if(n.has(s))continue;let a=o.entry,l=e[s];if(!l)continue;let c=l.entry;Math.sqrt((a.baseLeft-c.baseLeft)**2+(a.baseTop-c.baseTop)**2)<ui&&(r.entries.push(c),r.elementIndices.push(l.elIdx),n.add(s));}this.clusters.push(r);}for(let i of this.clusters)i.entries.length<=1||(this.applyStackPositions(i),this.addClusterBadge(i));}applyStackPositions(e){let n=e.entries[0];if(!n)return;let{baseTop:i,baseLeft:o}=n,r=e.entries.length<=1;for(let s=0;s<e.entries.length;s++){let a=re(e,s);a&&(a.style.top=`${i+(r?0:s*3)}px`,a.style.left=`${o+(r?0:s*3)}px`,a.style.zIndex=String(s+1));}}applyFanPositions(e){let n=e.entries[0];if(!n)return;let{baseTop:i,baseLeft:o}=n,r=e.entries.length,s=(r-1)*dn,a=o-s/2;for(let l=0;l<r;l++){let c=re(e,l);c&&(c.style.top=`${i}px`,c.style.left=`${a+l*dn}px`,c.style.zIndex=String(10+l));}}addClusterBadge(e){let n=re(e,e.entries.length-1);if(!n)return;let i=chunkRHP4S23A_cjs.b("div",{class:"sp-cluster-badge",style:`
|
|
114
|
+
position:absolute;top:-6px;right:-6px;
|
|
115
|
+
min-width:16px;height:16px;padding:0 4px;
|
|
116
|
+
border-radius:9999px;
|
|
117
|
+
background:${this.colors.accent};color:#fff;
|
|
118
|
+
font-size:10px;font-weight:700;
|
|
119
|
+
display:flex;align-items:center;justify-content:center;
|
|
120
|
+
border:1.5px solid #fff;
|
|
121
|
+
pointer-events:none;
|
|
122
|
+
font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
123
|
+
line-height:1;
|
|
124
|
+
`});chunkRHP4S23A_cjs.c(i,String(e.entries.length)),n.appendChild(i);}setBadgesVisible(e,n){for(let i=0;i<e.entries.length;i++){let o=re(e,i)?.querySelector(".sp-cluster-badge");o&&(o.style.display=n?"flex":"none");}}findCluster(e){for(let n of this.clusters)if(!(n.entries.length<=1)){for(let i=0;i<n.entries.length;i++)if(re(n,i)===e)return n}return null}handleClusterClick(e,n){let i=this.findCluster(e);return i?i.expanded?false:(n.stopPropagation(),this.collapseAllClusters(),i.expanded=true,this.applyFanPositions(i),this.setBadgesVisible(i,false),true):false}collapseCluster(e){e.expanded&&(e.expanded=false,this.applyStackPositions(e),this.setBadgesVisible(e,true));}collapseAllClusters(){for(let e of this.clusters)this.collapseCluster(e);}applyConfidenceStyle(e,n,i){let o=chunkRHP4S23A_cjs.J(i.status);n<di&&!o?(e.style.borderStyle="dashed",e.style.opacity="0.7",e.title=this.t("marker.approximate").replace("{confidence}",String(Math.round(n*100)))):(e.style.borderStyle="solid",e.style.opacity="1",e.title="");}createMarker(e,n,i){let o=chunkRHP4S23A_cjs.x(n.type,this.colors),r=chunkRHP4S23A_cjs.J(n.status),s=chunkRHP4S23A_cjs.b("div",{style:`
|
|
125
|
+
position:absolute;
|
|
126
|
+
top:${i.top}px;
|
|
127
|
+
left:${i.left}px;
|
|
128
|
+
width:26px;height:26px;
|
|
129
|
+
border-radius:50%;
|
|
130
|
+
background:${r?"rgba(241,245,249,0.9)":"rgba(255,255,255,0.92)"};
|
|
131
|
+
border:2px solid ${r?"#cbd5e1":o};
|
|
132
|
+
display:flex;align-items:center;justify-content:center;
|
|
133
|
+
font-family:"Inter",system-ui,-apple-system,sans-serif;
|
|
134
|
+
font-size:11px;font-weight:700;
|
|
135
|
+
color:${r?"#94a3b8":o};
|
|
136
|
+
cursor:pointer;pointer-events:auto;
|
|
137
|
+
box-shadow:${r?"0 2px 8px rgba(0,0,0,0.06)":`0 2px 12px ${o}25, 0 2px 6px rgba(0,0,0,0.06)`};
|
|
138
|
+
transition:top 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), left 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), transform 0.15s ease, box-shadow 0.15s ease;
|
|
139
|
+
user-select:none;
|
|
140
|
+
-webkit-font-smoothing:antialiased;
|
|
141
|
+
`});s.dataset.feedbackId=n.id,s.setAttribute("tabindex","0"),s.setAttribute("role","button");let a=n.message.length>60?`${n.message.slice(0,60)}...`:n.message,l=this.t("marker.aria").replace("{number}",String(e)).replace("{type}",chunkRHP4S23A_cjs.N(n.type,this.t)).replace("{message}",a);s.setAttribute("aria-label",l),s.setAttribute("aria-describedby",this.tooltip.tooltipId),chunkRHP4S23A_cjs.c(s,r?"\u2713":String(e)),s.addEventListener("mouseenter",()=>{s.style.transform="scale(1.2)",s.style.boxShadow=r?"0 4px 16px rgba(0,0,0,0.1)":`0 4px 20px ${o}35, 0 4px 12px rgba(0,0,0,0.08)`,this.tooltip.show(n,s.getBoundingClientRect()),this.pinnedFeedback||this.showHighlight(n);}),s.addEventListener("mouseleave",()=>{s.style.transform="scale(1)",s.style.boxShadow=r?"0 2px 8px rgba(0,0,0,0.06)":`0 2px 12px ${o}25, 0 2px 6px rgba(0,0,0,0.06)`,this.tooltip.scheduleHide(),this.pinnedFeedback||this.clearHighlight();}),s.addEventListener("focus",()=>{this.tooltip.show(n,s.getBoundingClientRect()),this.pinnedFeedback||this.showHighlight(n);}),s.addEventListener("blur",()=>{this.tooltip.scheduleHide(),this.pinnedFeedback||this.clearHighlight();});let c=p=>{p instanceof MouseEvent&&this.handleClusterClick(s,p)||(this.pinHighlight(n),this.bus.emit("panel:toggle",true),s.dispatchEvent(new CustomEvent("sp-marker-click",{detail:{feedbackId:n.id},bubbles:true})));};return s.addEventListener("click",p=>c(p)),s.addEventListener("keydown",p=>{(p.key==="Enter"||p.key===" ")&&(p.preventDefault(),c(p));}),s}focusFeedback(e){let n=this.entries.find(o=>o.feedback.id===e);if(!n)return false;let i=n.elements[0];return i&&i.scrollIntoView({behavior:"smooth",block:"center"}),this.pinHighlight(n.feedback),this.highlight(e),true}highlight(e){for(let n of this.entries)if(n.feedback.id===e)for(let i of n.elements)i.style.animation="sp-pulse-ring 0.7s ease-out",i.addEventListener("animationend",()=>{i.style.animation="";},{once:true});}showHighlight(e){this.removeHighlightElements();for(let n of e.annotations){let i=Ce(Qe(n),Ae(n));if(!i)continue;let o=chunkRHP4S23A_cjs.x(e.type,this.colors),r=i.rect,s=chunkRHP4S23A_cjs.b("div",{style:`
|
|
142
|
+
position:absolute;
|
|
143
|
+
top:${r.top+window.scrollY}px;
|
|
144
|
+
left:${r.left+window.scrollX}px;
|
|
145
|
+
width:${r.width}px;height:${r.height}px;
|
|
146
|
+
border:2px solid ${o};
|
|
147
|
+
background:${o}0c;
|
|
148
|
+
border-radius:8px;
|
|
149
|
+
pointer-events:none;z-index:-1;
|
|
150
|
+
opacity:0;
|
|
151
|
+
box-shadow:0 0 16px ${o}20;
|
|
152
|
+
transition:opacity ${cn}ms ease;
|
|
153
|
+
`});this.container.appendChild(s),this.highlightElements.push(s),s.offsetHeight,s.style.opacity="1";}}pinHighlight(e){this.unpinHighlight(),this.showHighlight(e),this.pinnedFeedback=e,this.onDocumentClick=n=>{this.container.contains(n.target)||this.unpinHighlight();},document.addEventListener("click",this.onDocumentClick,{capture:true});}unpinHighlight(){this.onDocumentClick&&(document.removeEventListener("click",this.onDocumentClick,{capture:true}),this.onDocumentClick=null),this.pinnedFeedback=null,this.clearHighlight();}clearHighlight(){for(let e of this.highlightElements)e.style.opacity="0",setTimeout(()=>e.remove(),cn);this.highlightElements=[];}removeHighlightElements(){for(let e of this.highlightElements)e.remove();this.highlightElements=[];}clear(){this.unpinHighlight(),this.container.replaceChildren(),this.entries=[],this.clusters=[],this.anchorCache.clear();}destroy(){this.unpinHighlight(),this.repositionTimer&&("cancelIdleCallback"in window&&window.cancelIdleCallback(this.repositionTimer),clearTimeout(this.repositionTimer)),this.resizeHandler&&window.removeEventListener("resize",this.resizeHandler),this.scrollHandler&&window.removeEventListener("scroll",this.scrollHandler,{capture:true}),this.onDocumentClickForClusters&&document.removeEventListener("click",this.onDocumentClickForClusters),this.mutationObserver?.disconnect(),this.container.remove();}};var Me=class{constructor(e,n){this.store=e;this.projectName=n;}store;projectName;async sendFeedback(e){let n=await this.store.createFeedback({projectName:e.projectName,type:e.type,message:e.message,status:"open",url:e.url,urlPattern:e.urlPattern??null,viewport:e.viewport,userAgent:e.userAgent,authorName:e.authorName,authorEmail:e.authorEmail,clientId:e.clientId,annotations:e.annotations.map(chunkRHP4S23A_cjs.K),screenshotDataUrl:e.screenshotDataUrl??null,screenshotRegion:e.screenshotRegion??null,diagnostics:e.diagnostics??null});return et(n)}async getFeedbacks(e,n){let{feedbacks:i,total:o}=await this.store.getFeedbacks({projectName:e,page:n?.page,limit:n?.limit,type:n?.type,status:n?.status,statuses:n?.statuses,search:n?.search,url:n?.url,urlPattern:n?.urlPattern});return {feedbacks:i.map(et),total:o}}async resolveFeedback(e,n){let i=await this.store.updateFeedback(e,{status:n?"resolved":"open",resolvedAt:n?new Date:null});return et(i)}async deleteFeedback(e){await this.store.deleteFeedback(e);}async deleteAllFeedbacks(e){await this.store.deleteAllFeedbacks(e);}};function et(t){return {id:t.id,projectName:t.projectName,type:t.type,message:t.message,status:t.status,url:t.url,urlPattern:t.urlPattern??null,viewport:t.viewport,userAgent:t.userAgent,authorName:t.authorName,authorEmail:t.authorEmail,resolvedAt:t.resolvedAt?.toISOString()??null,createdAt:t.createdAt.toISOString(),updatedAt:t.updatedAt.toISOString(),annotations:t.annotations.map(hi),screenshotUrl:t.screenshotUrl??null,screenshotRegion:t.screenshotRegion??null,diagnostics:t.diagnostics??null}}function hi(t){return {id:t.id,feedbackId:t.feedbackId,cssSelector:t.cssSelector,xpath:t.xpath,textSnippet:t.textSnippet,elementTag:t.elementTag,elementId:t.elementId,textPrefix:t.textPrefix,textSuffix:t.textSuffix,fingerprint:t.fingerprint,neighborText:t.neighborText,anchorKey:t.anchorKey??null,xPct:t.xPct,yPct:t.yPct,wPct:t.wPct,hPct:t.hPct,scrollX:t.scrollX,scrollY:t.scrollY,viewportW:t.viewportW,viewportH:t.viewportH,devicePixelRatio:t.devicePixelRatio,createdAt:t.createdAt.toISOString()}}var fi="linear(0, 0.006, 0.025, 0.06, 0.11, 0.17, 0.25, 0.34, 0.45, 0.56, 0.67, 0.78, 0.88, 0.95, 1.01, 1.04, 1.05, 1.04, 1.02, 1, 0.99, 1)",tt="cubic-bezier(0.16, 1, 0.3, 1)",nt="cubic-bezier(0.34, 1.56, 0.64, 1)",mi="cubic-bezier(0.25, 1, 0.5, 1)",un=`
|
|
154
|
+
/* ---- Keyframes ---- */
|
|
155
|
+
|
|
156
|
+
@keyframes sp-fab-in {
|
|
157
|
+
from {
|
|
158
|
+
transform: scale(0) rotate(-180deg);
|
|
159
|
+
opacity: 0;
|
|
160
|
+
}
|
|
161
|
+
to {
|
|
162
|
+
transform: scale(1) rotate(0deg);
|
|
163
|
+
opacity: 1;
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
@keyframes sp-fab-glow {
|
|
168
|
+
0%, 100% { box-shadow: 0 4px 20px var(--sp-accent-glow), 0 2px 8px rgba(0, 0, 0, 0.08); }
|
|
169
|
+
50% { box-shadow: 0 4px 28px var(--sp-accent-glow), 0 2px 12px rgba(0, 0, 0, 0.1); }
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
@keyframes sp-marker-in {
|
|
173
|
+
0% {
|
|
174
|
+
transform: scale(0);
|
|
175
|
+
opacity: 0;
|
|
176
|
+
}
|
|
177
|
+
60% {
|
|
178
|
+
transform: scale(1.2);
|
|
179
|
+
opacity: 1;
|
|
180
|
+
}
|
|
181
|
+
100% {
|
|
182
|
+
transform: scale(1);
|
|
183
|
+
}
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
@keyframes sp-pulse-ring {
|
|
187
|
+
0% {
|
|
188
|
+
box-shadow: 0 0 0 0 var(--sp-accent-glow);
|
|
189
|
+
}
|
|
190
|
+
70% {
|
|
191
|
+
box-shadow: 0 0 0 8px transparent;
|
|
192
|
+
}
|
|
193
|
+
100% {
|
|
194
|
+
box-shadow: 0 0 0 0 transparent;
|
|
195
|
+
}
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
@keyframes sp-flash-bg {
|
|
199
|
+
0% { background-color: var(--sp-accent-light); }
|
|
200
|
+
100% { background-color: transparent; }
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
@keyframes sp-slide-up {
|
|
204
|
+
from {
|
|
205
|
+
transform: translateY(8px);
|
|
206
|
+
opacity: 0;
|
|
207
|
+
}
|
|
208
|
+
to {
|
|
209
|
+
transform: translateY(0);
|
|
210
|
+
opacity: 1;
|
|
211
|
+
}
|
|
212
|
+
}
|
|
213
|
+
|
|
214
|
+
@keyframes sp-fade-in {
|
|
215
|
+
from { opacity: 0; }
|
|
216
|
+
to { opacity: 1; }
|
|
217
|
+
}
|
|
218
|
+
|
|
219
|
+
@keyframes sp-shimmer {
|
|
220
|
+
0% { background-position: -200% 0; }
|
|
221
|
+
100% { background-position: 200% 0; }
|
|
222
|
+
}
|
|
223
|
+
|
|
224
|
+
/* ---- Animation classes ---- */
|
|
225
|
+
|
|
226
|
+
.sp-anim-fab-in {
|
|
227
|
+
animation: sp-fab-in 0.5s ${fi} both;
|
|
228
|
+
}
|
|
229
|
+
|
|
230
|
+
.sp-anim-marker-in {
|
|
231
|
+
animation: sp-marker-in 0.35s ${nt} both;
|
|
232
|
+
}
|
|
233
|
+
|
|
234
|
+
.sp-anim-pulse {
|
|
235
|
+
animation: sp-pulse-ring 0.7s ease-out;
|
|
236
|
+
}
|
|
237
|
+
|
|
238
|
+
.sp-anim-flash {
|
|
239
|
+
animation: sp-flash-bg 0.5s ${mi};
|
|
240
|
+
}
|
|
241
|
+
|
|
242
|
+
.sp-anim-slide-up {
|
|
243
|
+
animation: sp-slide-up 0.3s ${tt} both;
|
|
244
|
+
}
|
|
245
|
+
|
|
246
|
+
.sp-anim-fade-in {
|
|
247
|
+
animation: sp-fade-in 0.2s ease-out both;
|
|
248
|
+
}
|
|
249
|
+
|
|
250
|
+
/* ---- Transition utilities ---- */
|
|
251
|
+
|
|
252
|
+
.sp-panel {
|
|
253
|
+
transform: translateX(110%);
|
|
254
|
+
transition: transform 0.4s ${tt};
|
|
255
|
+
}
|
|
256
|
+
|
|
257
|
+
.sp-panel.sp-panel--open {
|
|
258
|
+
transform: translateX(0);
|
|
259
|
+
}
|
|
260
|
+
|
|
261
|
+
.sp-radial-item {
|
|
262
|
+
opacity: 0;
|
|
263
|
+
pointer-events: none;
|
|
264
|
+
transform: translate(0, 0) scale(0.8);
|
|
265
|
+
transition:
|
|
266
|
+
transform 0.35s ${nt},
|
|
267
|
+
opacity 0.2s ease,
|
|
268
|
+
background 0.2s ease,
|
|
269
|
+
border-color 0.2s ease,
|
|
270
|
+
box-shadow 0.2s ease;
|
|
271
|
+
}
|
|
272
|
+
|
|
273
|
+
.sp-radial-item.sp-radial-item--open {
|
|
274
|
+
opacity: 1;
|
|
275
|
+
pointer-events: auto;
|
|
276
|
+
}
|
|
277
|
+
|
|
278
|
+
/* Stagger delay via CSS custom property --sp-i */
|
|
279
|
+
.sp-radial-item {
|
|
280
|
+
transition-delay: calc(var(--sp-i, 0) * 50ms);
|
|
281
|
+
}
|
|
282
|
+
|
|
283
|
+
/* ---- Card stagger animation ---- */
|
|
284
|
+
|
|
285
|
+
@keyframes sp-card-in {
|
|
286
|
+
from {
|
|
287
|
+
transform: translateY(12px);
|
|
288
|
+
opacity: 0;
|
|
289
|
+
}
|
|
290
|
+
to {
|
|
291
|
+
transform: translateY(0);
|
|
292
|
+
opacity: 1;
|
|
293
|
+
}
|
|
294
|
+
}
|
|
295
|
+
|
|
296
|
+
.sp-card {
|
|
297
|
+
animation: sp-card-in 0.35s ${tt} both;
|
|
298
|
+
animation-delay: calc(var(--sp-card-i, 0) * 40ms);
|
|
299
|
+
}
|
|
300
|
+
|
|
301
|
+
/* ---- Loading spinner ---- */
|
|
302
|
+
|
|
303
|
+
@keyframes sp-spin {
|
|
304
|
+
to { transform: rotate(360deg); }
|
|
305
|
+
}
|
|
306
|
+
|
|
307
|
+
.sp-spinner {
|
|
308
|
+
width: 20px;
|
|
309
|
+
height: 20px;
|
|
310
|
+
border: 2px solid var(--sp-border);
|
|
311
|
+
border-top-color: var(--sp-accent);
|
|
312
|
+
border-radius: 50%;
|
|
313
|
+
animation: sp-spin 0.6s linear infinite;
|
|
314
|
+
}
|
|
315
|
+
|
|
316
|
+
/* ---- Badge bounce ---- */
|
|
317
|
+
|
|
318
|
+
@keyframes sp-badge-in {
|
|
319
|
+
0% { transform: scale(0); }
|
|
320
|
+
60% { transform: scale(1.3); }
|
|
321
|
+
100% { transform: scale(1); }
|
|
322
|
+
}
|
|
323
|
+
|
|
324
|
+
.sp-fab-badge {
|
|
325
|
+
animation: sp-badge-in 0.4s ${nt} both;
|
|
326
|
+
}
|
|
327
|
+
|
|
328
|
+
/* ---- Reduced motion ---- */
|
|
329
|
+
|
|
330
|
+
@media (prefers-reduced-motion: reduce) {
|
|
331
|
+
*, *::before, *::after {
|
|
332
|
+
animation-duration: 0.01ms !important;
|
|
333
|
+
animation-iteration-count: 1 !important;
|
|
334
|
+
transition-duration: 0.01ms !important;
|
|
335
|
+
}
|
|
336
|
+
}
|
|
337
|
+
|
|
338
|
+
`;function it(t){return `
|
|
339
|
+
:host {
|
|
340
|
+
all: initial;
|
|
341
|
+
position: fixed;
|
|
342
|
+
z-index: ${2147483647};
|
|
343
|
+
font-family: var(--sp-font);
|
|
344
|
+
font-size: 14px;
|
|
345
|
+
line-height: 1.5;
|
|
346
|
+
color: var(--sp-text);
|
|
347
|
+
/* Match native sub-controls (autofill, scrollbars, etc.) to the resolved theme */
|
|
348
|
+
color-scheme: ${t.bg==="#ffffff"?"light":"dark"};
|
|
349
|
+
-webkit-font-smoothing: antialiased;
|
|
350
|
+
-moz-osx-font-smoothing: grayscale;
|
|
351
|
+
${chunkRHP4S23A_cjs.B(t)}
|
|
352
|
+
|
|
353
|
+
/* Identity modal \u2014 theme-aware backdrop + panel */
|
|
354
|
+
--sp-identity-bg: ${t.glassBgHeavy};
|
|
355
|
+
--sp-identity-overlay: ${t.bg==="#ffffff"?"rgba(15, 23, 42, 0.2)":"rgba(0, 0, 0, 0.4)"};
|
|
356
|
+
}
|
|
357
|
+
|
|
358
|
+
*, *::before, *::after {
|
|
359
|
+
box-sizing: border-box;
|
|
360
|
+
margin: 0;
|
|
361
|
+
padding: 0;
|
|
362
|
+
}
|
|
363
|
+
|
|
364
|
+
/* ============================
|
|
365
|
+
Focus visible (accessibility)
|
|
366
|
+
============================ */
|
|
367
|
+
|
|
368
|
+
:focus-visible {
|
|
369
|
+
outline: 2px solid var(--sp-accent);
|
|
370
|
+
outline-offset: 2px;
|
|
371
|
+
/* Double-ring against any background colour: the bg-coloured halo
|
|
372
|
+
separates the accent ring from busy host-page surfaces. */
|
|
373
|
+
box-shadow: 0 0 0 4px var(--sp-bg);
|
|
374
|
+
}
|
|
375
|
+
|
|
376
|
+
/* ============================
|
|
377
|
+
FAB (Floating Action Button)
|
|
378
|
+
============================ */
|
|
379
|
+
|
|
380
|
+
.sp-fab {
|
|
381
|
+
position: fixed;
|
|
382
|
+
width: 52px;
|
|
383
|
+
height: 52px;
|
|
384
|
+
border-radius: var(--sp-radius-full);
|
|
385
|
+
background: var(--sp-accent-gradient);
|
|
386
|
+
color: #fff;
|
|
387
|
+
border: none;
|
|
388
|
+
cursor: pointer;
|
|
389
|
+
display: flex;
|
|
390
|
+
align-items: center;
|
|
391
|
+
justify-content: center;
|
|
392
|
+
box-shadow:
|
|
393
|
+
0 4px 20px var(--sp-accent-glow),
|
|
394
|
+
0 2px 8px rgba(0, 0, 0, 0.08);
|
|
395
|
+
transition:
|
|
396
|
+
transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1),
|
|
397
|
+
box-shadow 0.3s ease;
|
|
398
|
+
outline: none;
|
|
399
|
+
}
|
|
400
|
+
|
|
401
|
+
.sp-fab:focus-visible {
|
|
402
|
+
outline: 2px solid #fff;
|
|
403
|
+
outline-offset: 3px;
|
|
404
|
+
}
|
|
405
|
+
|
|
406
|
+
.sp-fab:hover {
|
|
407
|
+
transform: translateY(-2px) scale(1.05);
|
|
408
|
+
box-shadow:
|
|
409
|
+
0 8px 28px var(--sp-accent-glow),
|
|
410
|
+
0 4px 12px rgba(0, 0, 0, 0.1);
|
|
411
|
+
}
|
|
412
|
+
|
|
413
|
+
.sp-fab:active {
|
|
414
|
+
transform: translateY(0) scale(0.95);
|
|
415
|
+
transition-duration: 0.1s;
|
|
416
|
+
}
|
|
417
|
+
|
|
418
|
+
.sp-fab--bottom-right {
|
|
419
|
+
bottom: 24px;
|
|
420
|
+
right: 24px;
|
|
421
|
+
}
|
|
422
|
+
|
|
423
|
+
.sp-fab--bottom-left {
|
|
424
|
+
bottom: 24px;
|
|
425
|
+
left: 24px;
|
|
426
|
+
}
|
|
427
|
+
|
|
428
|
+
.sp-fab svg {
|
|
429
|
+
width: 22px;
|
|
430
|
+
height: 22px;
|
|
431
|
+
fill: currentColor;
|
|
432
|
+
transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
|
|
433
|
+
}
|
|
434
|
+
|
|
435
|
+
/* ---- FAB Badge ---- */
|
|
436
|
+
|
|
437
|
+
.sp-fab-badge {
|
|
438
|
+
position: absolute;
|
|
439
|
+
top: -4px;
|
|
440
|
+
right: -4px;
|
|
441
|
+
min-width: 20px;
|
|
442
|
+
height: 20px;
|
|
443
|
+
padding: 0 6px;
|
|
444
|
+
border-radius: var(--sp-radius-full);
|
|
445
|
+
background: #ef4444;
|
|
446
|
+
color: #fff;
|
|
447
|
+
font-size: 11px;
|
|
448
|
+
font-weight: 700;
|
|
449
|
+
display: flex;
|
|
450
|
+
align-items: center;
|
|
451
|
+
justify-content: center;
|
|
452
|
+
border: 2px solid #fff;
|
|
453
|
+
pointer-events: none;
|
|
454
|
+
font-family: var(--sp-font);
|
|
455
|
+
line-height: 1;
|
|
456
|
+
}
|
|
457
|
+
|
|
458
|
+
/* ============================
|
|
459
|
+
Radial Menu
|
|
460
|
+
============================ */
|
|
461
|
+
|
|
462
|
+
.sp-radial {
|
|
463
|
+
position: fixed;
|
|
464
|
+
pointer-events: none;
|
|
465
|
+
width: 52px;
|
|
466
|
+
height: 52px;
|
|
467
|
+
}
|
|
468
|
+
|
|
469
|
+
.sp-radial--bottom-right {
|
|
470
|
+
bottom: 24px;
|
|
471
|
+
right: 24px;
|
|
472
|
+
}
|
|
473
|
+
|
|
474
|
+
.sp-radial--bottom-left {
|
|
475
|
+
bottom: 24px;
|
|
476
|
+
left: 24px;
|
|
477
|
+
}
|
|
478
|
+
|
|
479
|
+
.sp-radial-item {
|
|
480
|
+
position: absolute;
|
|
481
|
+
left: 4px;
|
|
482
|
+
bottom: 4px;
|
|
483
|
+
width: 44px;
|
|
484
|
+
height: 44px;
|
|
485
|
+
border-radius: var(--sp-radius-full);
|
|
486
|
+
background: var(--sp-glass-bg-heavy);
|
|
487
|
+
backdrop-filter: blur(var(--sp-blur));
|
|
488
|
+
-webkit-backdrop-filter: blur(var(--sp-blur));
|
|
489
|
+
color: var(--sp-text);
|
|
490
|
+
border: 1px solid var(--sp-glass-border);
|
|
491
|
+
cursor: pointer;
|
|
492
|
+
display: flex;
|
|
493
|
+
align-items: center;
|
|
494
|
+
justify-content: center;
|
|
495
|
+
box-shadow: var(--sp-shadow-md);
|
|
496
|
+
font-size: 12px;
|
|
497
|
+
font-weight: 600;
|
|
498
|
+
}
|
|
499
|
+
|
|
500
|
+
.sp-radial-item:hover,
|
|
501
|
+
.sp-radial-item:focus-visible {
|
|
502
|
+
background: rgba(255, 255, 255, 0.95);
|
|
503
|
+
border-color: var(--sp-accent);
|
|
504
|
+
color: var(--sp-accent);
|
|
505
|
+
box-shadow:
|
|
506
|
+
var(--sp-shadow-md),
|
|
507
|
+
0 0 0 3px var(--sp-accent-light);
|
|
508
|
+
outline: none;
|
|
509
|
+
}
|
|
510
|
+
|
|
511
|
+
.sp-radial-item svg {
|
|
512
|
+
width: 18px;
|
|
513
|
+
height: 18px;
|
|
514
|
+
flex-shrink: 0;
|
|
515
|
+
stroke: currentColor;
|
|
516
|
+
fill: none;
|
|
517
|
+
}
|
|
518
|
+
|
|
519
|
+
.sp-radial-label {
|
|
520
|
+
white-space: nowrap;
|
|
521
|
+
font-size: 12px;
|
|
522
|
+
font-weight: 500;
|
|
523
|
+
color: var(--sp-text);
|
|
524
|
+
pointer-events: none;
|
|
525
|
+
opacity: 0;
|
|
526
|
+
padding: 4px 12px;
|
|
527
|
+
border-radius: var(--sp-radius);
|
|
528
|
+
background: var(--sp-glass-bg-heavy);
|
|
529
|
+
backdrop-filter: blur(12px);
|
|
530
|
+
-webkit-backdrop-filter: blur(12px);
|
|
531
|
+
border: 1px solid var(--sp-glass-border);
|
|
532
|
+
box-shadow: var(--sp-shadow-sm);
|
|
533
|
+
transform: translateX(4px);
|
|
534
|
+
transition: opacity 0.2s ease, transform 0.2s ease;
|
|
535
|
+
}
|
|
536
|
+
|
|
537
|
+
.sp-radial-item:hover .sp-radial-label,
|
|
538
|
+
.sp-radial-item:focus-visible .sp-radial-label {
|
|
539
|
+
opacity: 1;
|
|
540
|
+
transform: translateX(0);
|
|
541
|
+
}
|
|
542
|
+
|
|
543
|
+
/* ============================
|
|
544
|
+
Panel (Side drawer)
|
|
545
|
+
============================ */
|
|
546
|
+
|
|
547
|
+
.sp-panel {
|
|
548
|
+
position: fixed;
|
|
549
|
+
top: 0;
|
|
550
|
+
right: 0;
|
|
551
|
+
width: 400px;
|
|
552
|
+
max-width: 100vw;
|
|
553
|
+
height: 100vh;
|
|
554
|
+
height: 100dvh;
|
|
555
|
+
background: var(--sp-glass-bg);
|
|
556
|
+
backdrop-filter: blur(var(--sp-blur-heavy));
|
|
557
|
+
-webkit-backdrop-filter: blur(var(--sp-blur-heavy));
|
|
558
|
+
border-left: 1px solid var(--sp-glass-border);
|
|
559
|
+
box-shadow: var(--sp-shadow-xl);
|
|
560
|
+
display: flex;
|
|
561
|
+
flex-direction: column;
|
|
562
|
+
overflow: hidden;
|
|
563
|
+
}
|
|
564
|
+
|
|
565
|
+
@media (max-width: 480px) {
|
|
566
|
+
.sp-panel {
|
|
567
|
+
width: 100vw;
|
|
568
|
+
border-left: none;
|
|
569
|
+
}
|
|
570
|
+
}
|
|
571
|
+
|
|
572
|
+
.sp-panel-header {
|
|
573
|
+
display: flex;
|
|
574
|
+
align-items: center;
|
|
575
|
+
justify-content: space-between;
|
|
576
|
+
padding: 20px 24px;
|
|
577
|
+
border-bottom: 1px solid var(--sp-border);
|
|
578
|
+
background: var(--sp-glass-bg-heavy);
|
|
579
|
+
backdrop-filter: blur(var(--sp-blur));
|
|
580
|
+
-webkit-backdrop-filter: blur(var(--sp-blur));
|
|
581
|
+
position: relative;
|
|
582
|
+
z-index: 2;
|
|
583
|
+
}
|
|
584
|
+
|
|
585
|
+
.sp-panel-title {
|
|
586
|
+
font-size: 17px;
|
|
587
|
+
font-weight: 700;
|
|
588
|
+
color: var(--sp-text);
|
|
589
|
+
letter-spacing: -0.02em;
|
|
590
|
+
}
|
|
591
|
+
|
|
592
|
+
.sp-panel-close {
|
|
593
|
+
width: 44px;
|
|
594
|
+
height: 44px;
|
|
595
|
+
border-radius: var(--sp-radius);
|
|
596
|
+
border: none;
|
|
597
|
+
background: transparent;
|
|
598
|
+
cursor: pointer;
|
|
599
|
+
display: flex;
|
|
600
|
+
align-items: center;
|
|
601
|
+
justify-content: center;
|
|
602
|
+
color: var(--sp-text-tertiary);
|
|
603
|
+
transition: all 0.2s ease;
|
|
604
|
+
}
|
|
605
|
+
|
|
606
|
+
.sp-panel-close:hover {
|
|
607
|
+
background: var(--sp-bg-hover);
|
|
608
|
+
color: var(--sp-text);
|
|
609
|
+
}
|
|
610
|
+
|
|
611
|
+
.sp-panel-close svg {
|
|
612
|
+
width: 16px;
|
|
613
|
+
height: 16px;
|
|
614
|
+
}
|
|
615
|
+
|
|
616
|
+
/* ============================
|
|
617
|
+
Filters & Search
|
|
618
|
+
============================ */
|
|
619
|
+
|
|
620
|
+
.sp-filters {
|
|
621
|
+
padding: 16px 24px;
|
|
622
|
+
border-bottom: 1px solid var(--sp-border);
|
|
623
|
+
background: var(--sp-glass-bg-heavy);
|
|
624
|
+
backdrop-filter: blur(var(--sp-blur));
|
|
625
|
+
-webkit-backdrop-filter: blur(var(--sp-blur));
|
|
626
|
+
position: sticky;
|
|
627
|
+
top: 0;
|
|
628
|
+
z-index: 1;
|
|
629
|
+
}
|
|
630
|
+
|
|
631
|
+
.sp-search-wrap {
|
|
632
|
+
position: relative;
|
|
633
|
+
margin-bottom: 12px;
|
|
634
|
+
}
|
|
635
|
+
|
|
636
|
+
.sp-search {
|
|
637
|
+
width: 100%;
|
|
638
|
+
height: 40px;
|
|
639
|
+
padding: 0 12px 0 38px;
|
|
640
|
+
border-radius: var(--sp-radius);
|
|
641
|
+
border: 1px solid var(--sp-border);
|
|
642
|
+
background: var(--sp-glass-bg-heavy);
|
|
643
|
+
color: var(--sp-text);
|
|
644
|
+
font-family: var(--sp-font);
|
|
645
|
+
font-size: 13px;
|
|
646
|
+
outline: none;
|
|
647
|
+
transition: all 0.2s ease;
|
|
648
|
+
}
|
|
649
|
+
|
|
650
|
+
.sp-search::placeholder {
|
|
651
|
+
color: var(--sp-text-tertiary);
|
|
652
|
+
}
|
|
653
|
+
|
|
654
|
+
.sp-search:focus {
|
|
655
|
+
border-color: var(--sp-accent);
|
|
656
|
+
box-shadow: 0 0 0 3px var(--sp-accent-light);
|
|
657
|
+
background: var(--sp-bg);
|
|
658
|
+
}
|
|
659
|
+
|
|
660
|
+
.sp-search-icon {
|
|
661
|
+
position: absolute;
|
|
662
|
+
left: 12px;
|
|
663
|
+
top: 50%;
|
|
664
|
+
transform: translateY(-50%);
|
|
665
|
+
color: var(--sp-text-tertiary);
|
|
666
|
+
width: 16px;
|
|
667
|
+
height: 16px;
|
|
668
|
+
transition: color 0.2s ease;
|
|
669
|
+
}
|
|
670
|
+
|
|
671
|
+
.sp-search:focus ~ .sp-search-icon,
|
|
672
|
+
.sp-search-wrap:focus-within .sp-search-icon {
|
|
673
|
+
color: var(--sp-accent);
|
|
674
|
+
}
|
|
675
|
+
|
|
676
|
+
/* ============================
|
|
677
|
+
Filter bar (type dropdown + status segmented)
|
|
678
|
+
============================ */
|
|
679
|
+
|
|
680
|
+
.sp-filter-bar {
|
|
681
|
+
display: flex;
|
|
682
|
+
align-items: center;
|
|
683
|
+
gap: 8px;
|
|
684
|
+
margin-bottom: 8px;
|
|
685
|
+
flex-wrap: wrap;
|
|
686
|
+
}
|
|
687
|
+
|
|
688
|
+
/* ============================
|
|
689
|
+
Type filter dropdown
|
|
690
|
+
============================ */
|
|
691
|
+
|
|
692
|
+
.sp-filter-dropdown {
|
|
693
|
+
position: relative;
|
|
694
|
+
flex: 1 1 auto;
|
|
695
|
+
min-width: 0;
|
|
696
|
+
}
|
|
697
|
+
|
|
698
|
+
.sp-filter-dropdown-btn {
|
|
699
|
+
--sp-chip-color: var(--sp-text-secondary);
|
|
700
|
+
--sp-chip-bg: var(--sp-glass-bg-heavy);
|
|
701
|
+
|
|
702
|
+
display: inline-flex;
|
|
703
|
+
align-items: center;
|
|
704
|
+
gap: 8px;
|
|
705
|
+
width: 100%;
|
|
706
|
+
height: 32px;
|
|
707
|
+
padding: 0 8px 0 10px;
|
|
708
|
+
border-radius: var(--sp-radius-full);
|
|
709
|
+
border: 1px solid var(--sp-border);
|
|
710
|
+
background: var(--sp-glass-bg-heavy);
|
|
711
|
+
color: var(--sp-text);
|
|
712
|
+
font-family: var(--sp-font);
|
|
713
|
+
font-size: 12px;
|
|
714
|
+
font-weight: 500;
|
|
715
|
+
cursor: pointer;
|
|
716
|
+
white-space: nowrap;
|
|
717
|
+
transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
|
|
718
|
+
}
|
|
719
|
+
|
|
720
|
+
.sp-filter-dropdown-btn:hover {
|
|
721
|
+
border-color: var(--sp-chip-color);
|
|
722
|
+
background: var(--sp-chip-bg);
|
|
723
|
+
}
|
|
724
|
+
|
|
725
|
+
.sp-filter-dropdown-btn[aria-expanded="true"] {
|
|
726
|
+
border-color: var(--sp-chip-color);
|
|
727
|
+
background: var(--sp-chip-bg);
|
|
728
|
+
box-shadow: 0 0 0 3px color-mix(in srgb, var(--sp-chip-color) 14%, transparent);
|
|
729
|
+
}
|
|
730
|
+
|
|
731
|
+
.sp-filter-dropdown-btn--filtered {
|
|
732
|
+
border-color: var(--sp-chip-color);
|
|
733
|
+
background: var(--sp-chip-bg);
|
|
734
|
+
}
|
|
735
|
+
|
|
736
|
+
.sp-filter-dropdown-btn__icon {
|
|
737
|
+
display: inline-flex;
|
|
738
|
+
align-items: center;
|
|
739
|
+
justify-content: center;
|
|
740
|
+
width: 18px;
|
|
741
|
+
height: 18px;
|
|
742
|
+
flex-shrink: 0;
|
|
743
|
+
color: var(--sp-chip-color);
|
|
744
|
+
}
|
|
745
|
+
|
|
746
|
+
.sp-filter-dropdown-btn__icon svg {
|
|
747
|
+
width: 14px;
|
|
748
|
+
height: 14px;
|
|
749
|
+
}
|
|
750
|
+
|
|
751
|
+
.sp-filter-dropdown-btn__label {
|
|
752
|
+
display: inline-flex;
|
|
753
|
+
align-items: baseline;
|
|
754
|
+
gap: 6px;
|
|
755
|
+
flex: 1;
|
|
756
|
+
min-width: 0;
|
|
757
|
+
overflow: hidden;
|
|
758
|
+
}
|
|
759
|
+
|
|
760
|
+
.sp-filter-dropdown-btn__prefix {
|
|
761
|
+
color: var(--sp-text-tertiary);
|
|
762
|
+
font-weight: 500;
|
|
763
|
+
font-size: 11px;
|
|
764
|
+
text-transform: uppercase;
|
|
765
|
+
letter-spacing: 0.06em;
|
|
766
|
+
}
|
|
767
|
+
|
|
768
|
+
.sp-filter-dropdown-btn__value {
|
|
769
|
+
color: var(--sp-chip-color);
|
|
770
|
+
font-weight: 600;
|
|
771
|
+
overflow: hidden;
|
|
772
|
+
text-overflow: ellipsis;
|
|
773
|
+
}
|
|
774
|
+
|
|
775
|
+
.sp-filter-dropdown-btn__chevron {
|
|
776
|
+
display: inline-flex;
|
|
777
|
+
align-items: center;
|
|
778
|
+
justify-content: center;
|
|
779
|
+
width: 14px;
|
|
780
|
+
height: 14px;
|
|
781
|
+
flex-shrink: 0;
|
|
782
|
+
color: var(--sp-text-tertiary);
|
|
783
|
+
transition: transform 0.18s ease, color 0.18s ease;
|
|
784
|
+
}
|
|
785
|
+
|
|
786
|
+
.sp-filter-dropdown-btn__chevron svg {
|
|
787
|
+
width: 12px;
|
|
788
|
+
height: 12px;
|
|
789
|
+
}
|
|
790
|
+
|
|
791
|
+
.sp-filter-dropdown-btn[aria-expanded="true"] .sp-filter-dropdown-btn__chevron {
|
|
792
|
+
transform: rotate(180deg);
|
|
793
|
+
color: var(--sp-chip-color);
|
|
794
|
+
}
|
|
795
|
+
|
|
796
|
+
.sp-filter-dropdown-menu {
|
|
797
|
+
position: absolute;
|
|
798
|
+
top: calc(100% + 6px);
|
|
799
|
+
left: 0;
|
|
800
|
+
right: 0;
|
|
801
|
+
min-width: 180px;
|
|
802
|
+
padding: 4px;
|
|
803
|
+
border-radius: var(--sp-radius);
|
|
804
|
+
background: var(--sp-glass-bg-heavy);
|
|
805
|
+
backdrop-filter: blur(var(--sp-blur-heavy));
|
|
806
|
+
-webkit-backdrop-filter: blur(var(--sp-blur-heavy));
|
|
807
|
+
border: 1px solid var(--sp-glass-border);
|
|
808
|
+
box-shadow: var(--sp-shadow-md);
|
|
809
|
+
z-index: 10;
|
|
810
|
+
animation: sp-filter-menu-in 0.15s ease-out both;
|
|
811
|
+
}
|
|
812
|
+
|
|
813
|
+
@keyframes sp-filter-menu-in {
|
|
814
|
+
from { opacity: 0; transform: translateY(-4px) scale(0.98); }
|
|
815
|
+
to { opacity: 1; transform: translateY(0) scale(1); }
|
|
816
|
+
}
|
|
817
|
+
|
|
818
|
+
.sp-filter-dropdown-option {
|
|
819
|
+
--sp-chip-color: var(--sp-text-secondary);
|
|
820
|
+
--sp-chip-bg: transparent;
|
|
821
|
+
|
|
822
|
+
display: flex;
|
|
823
|
+
align-items: center;
|
|
824
|
+
gap: 10px;
|
|
825
|
+
width: 100%;
|
|
826
|
+
padding: 8px 10px;
|
|
827
|
+
border: none;
|
|
828
|
+
border-radius: 8px;
|
|
829
|
+
background: transparent;
|
|
830
|
+
color: var(--sp-text);
|
|
831
|
+
font-family: var(--sp-font);
|
|
832
|
+
font-size: 12px;
|
|
833
|
+
font-weight: 500;
|
|
834
|
+
cursor: pointer;
|
|
835
|
+
text-align: left;
|
|
836
|
+
transition: background 0.12s ease, color 0.12s ease;
|
|
837
|
+
}
|
|
838
|
+
|
|
839
|
+
.sp-filter-dropdown-option__icon {
|
|
840
|
+
display: inline-flex;
|
|
841
|
+
align-items: center;
|
|
842
|
+
justify-content: center;
|
|
843
|
+
width: 22px;
|
|
844
|
+
height: 22px;
|
|
845
|
+
flex-shrink: 0;
|
|
846
|
+
border-radius: 6px;
|
|
847
|
+
background: var(--sp-chip-bg);
|
|
848
|
+
color: var(--sp-chip-color);
|
|
849
|
+
}
|
|
850
|
+
|
|
851
|
+
.sp-filter-dropdown-option__icon svg {
|
|
852
|
+
width: 13px;
|
|
853
|
+
height: 13px;
|
|
854
|
+
}
|
|
855
|
+
|
|
856
|
+
.sp-filter-dropdown-option__label {
|
|
857
|
+
flex: 1;
|
|
858
|
+
min-width: 0;
|
|
859
|
+
}
|
|
860
|
+
|
|
861
|
+
.sp-filter-dropdown-option__check {
|
|
862
|
+
display: inline-flex;
|
|
863
|
+
align-items: center;
|
|
864
|
+
justify-content: center;
|
|
865
|
+
width: 14px;
|
|
866
|
+
height: 14px;
|
|
867
|
+
flex-shrink: 0;
|
|
868
|
+
color: var(--sp-chip-color);
|
|
869
|
+
}
|
|
870
|
+
|
|
871
|
+
.sp-filter-dropdown-option__check svg {
|
|
872
|
+
width: 13px;
|
|
873
|
+
height: 13px;
|
|
874
|
+
}
|
|
875
|
+
|
|
876
|
+
.sp-filter-dropdown-option:hover {
|
|
877
|
+
background: var(--sp-bg-hover);
|
|
878
|
+
}
|
|
879
|
+
|
|
880
|
+
.sp-filter-dropdown-option--active {
|
|
881
|
+
color: var(--sp-chip-color);
|
|
882
|
+
font-weight: 600;
|
|
883
|
+
}
|
|
884
|
+
|
|
885
|
+
.sp-filter-dropdown-option--active:hover {
|
|
886
|
+
background: var(--sp-chip-bg);
|
|
887
|
+
}
|
|
888
|
+
|
|
889
|
+
/* ============================
|
|
890
|
+
Status segmented control
|
|
891
|
+
============================ */
|
|
892
|
+
|
|
893
|
+
.sp-segmented {
|
|
894
|
+
display: inline-flex;
|
|
895
|
+
align-items: stretch;
|
|
896
|
+
padding: 2px;
|
|
897
|
+
border-radius: var(--sp-radius-full);
|
|
898
|
+
border: 1px solid var(--sp-border);
|
|
899
|
+
background: var(--sp-glass-bg-heavy);
|
|
900
|
+
flex-shrink: 0;
|
|
901
|
+
}
|
|
902
|
+
|
|
903
|
+
.sp-segmented__btn {
|
|
904
|
+
--sp-chip-color: var(--sp-text-tertiary);
|
|
905
|
+
--sp-chip-bg: transparent;
|
|
906
|
+
|
|
907
|
+
display: inline-flex;
|
|
908
|
+
align-items: center;
|
|
909
|
+
gap: 5px;
|
|
910
|
+
height: 26px;
|
|
911
|
+
padding: 0 10px;
|
|
912
|
+
border: none;
|
|
913
|
+
border-radius: var(--sp-radius-full);
|
|
914
|
+
background: transparent;
|
|
915
|
+
color: var(--sp-text-secondary);
|
|
916
|
+
font-family: var(--sp-font);
|
|
917
|
+
font-size: 12px;
|
|
918
|
+
font-weight: 500;
|
|
919
|
+
cursor: pointer;
|
|
920
|
+
white-space: nowrap;
|
|
921
|
+
transition: background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
|
|
922
|
+
}
|
|
923
|
+
|
|
924
|
+
.sp-segmented__icon {
|
|
925
|
+
display: inline-flex;
|
|
926
|
+
align-items: center;
|
|
927
|
+
justify-content: center;
|
|
928
|
+
width: 13px;
|
|
929
|
+
height: 13px;
|
|
930
|
+
flex-shrink: 0;
|
|
931
|
+
color: var(--sp-chip-color);
|
|
932
|
+
transition: color 0.18s ease, transform 0.18s ease;
|
|
933
|
+
}
|
|
934
|
+
|
|
935
|
+
.sp-segmented__icon svg {
|
|
936
|
+
width: 13px;
|
|
937
|
+
height: 13px;
|
|
938
|
+
}
|
|
939
|
+
|
|
940
|
+
.sp-segmented__btn:hover {
|
|
941
|
+
color: var(--sp-chip-color);
|
|
942
|
+
}
|
|
943
|
+
|
|
944
|
+
.sp-segmented__btn:hover .sp-segmented__icon {
|
|
945
|
+
color: var(--sp-chip-color);
|
|
946
|
+
}
|
|
947
|
+
|
|
948
|
+
.sp-segmented__btn--active {
|
|
949
|
+
background: var(--sp-chip-bg);
|
|
950
|
+
color: var(--sp-chip-color);
|
|
951
|
+
font-weight: 600;
|
|
952
|
+
box-shadow:
|
|
953
|
+
inset 0 0 0 1px color-mix(in srgb, var(--sp-chip-color) 35%, transparent),
|
|
954
|
+
0 1px 2px rgba(0, 0, 0, 0.04);
|
|
955
|
+
}
|
|
956
|
+
|
|
957
|
+
.sp-segmented__btn--active .sp-segmented__icon {
|
|
958
|
+
color: var(--sp-chip-color);
|
|
959
|
+
}
|
|
960
|
+
|
|
961
|
+
.sp-segmented__btn--open.sp-segmented__btn--active .sp-segmented__icon {
|
|
962
|
+
animation: sp-segmented-pulse 2.4s ease-in-out infinite;
|
|
963
|
+
}
|
|
964
|
+
|
|
965
|
+
@keyframes sp-segmented-pulse {
|
|
966
|
+
0%, 100% { transform: scale(1); }
|
|
967
|
+
50% { transform: scale(0.85); }
|
|
968
|
+
}
|
|
969
|
+
|
|
970
|
+
@media (prefers-reduced-motion: reduce) {
|
|
971
|
+
.sp-filter-dropdown-btn,
|
|
972
|
+
.sp-filter-dropdown-btn__chevron,
|
|
973
|
+
.sp-filter-dropdown-option,
|
|
974
|
+
.sp-segmented__btn,
|
|
975
|
+
.sp-segmented__icon {
|
|
976
|
+
transition: none;
|
|
977
|
+
}
|
|
978
|
+
.sp-filter-dropdown-menu {
|
|
979
|
+
animation: none;
|
|
980
|
+
}
|
|
981
|
+
.sp-segmented__btn--open.sp-segmented__btn--active .sp-segmented__icon {
|
|
982
|
+
animation: none;
|
|
983
|
+
}
|
|
984
|
+
}
|
|
985
|
+
|
|
986
|
+
/* ============================
|
|
987
|
+
Feedback Cards
|
|
988
|
+
============================ */
|
|
989
|
+
|
|
990
|
+
.sp-list {
|
|
991
|
+
flex: 1;
|
|
992
|
+
overflow-y: auto;
|
|
993
|
+
padding: 8px 12px;
|
|
994
|
+
}
|
|
995
|
+
|
|
996
|
+
.sp-list::-webkit-scrollbar {
|
|
997
|
+
width: 6px;
|
|
998
|
+
}
|
|
999
|
+
|
|
1000
|
+
.sp-list::-webkit-scrollbar-track {
|
|
1001
|
+
background: transparent;
|
|
1002
|
+
}
|
|
1003
|
+
|
|
1004
|
+
.sp-list::-webkit-scrollbar-thumb {
|
|
1005
|
+
background: var(--sp-border);
|
|
1006
|
+
border-radius: var(--sp-radius-full);
|
|
1007
|
+
}
|
|
1008
|
+
|
|
1009
|
+
.sp-list::-webkit-scrollbar-thumb:hover {
|
|
1010
|
+
background: var(--sp-text-tertiary);
|
|
1011
|
+
}
|
|
1012
|
+
|
|
1013
|
+
.sp-card {
|
|
1014
|
+
display: flex;
|
|
1015
|
+
padding: 14px 16px;
|
|
1016
|
+
margin-bottom: 6px;
|
|
1017
|
+
cursor: pointer;
|
|
1018
|
+
border-radius: var(--sp-radius);
|
|
1019
|
+
background: var(--sp-glass-bg-heavy);
|
|
1020
|
+
border: 1px solid var(--sp-glass-border);
|
|
1021
|
+
box-shadow: var(--sp-shadow-xs);
|
|
1022
|
+
transition: all 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
|
|
1023
|
+
}
|
|
1024
|
+
|
|
1025
|
+
.sp-card:hover {
|
|
1026
|
+
background: var(--sp-bg);
|
|
1027
|
+
border-color: var(--sp-border);
|
|
1028
|
+
box-shadow: var(--sp-shadow-md);
|
|
1029
|
+
transform: translateY(-2px);
|
|
1030
|
+
}
|
|
1031
|
+
|
|
1032
|
+
.sp-card:active {
|
|
1033
|
+
transform: translateY(0) scale(0.99);
|
|
1034
|
+
transition-duration: 0.1s;
|
|
1035
|
+
}
|
|
1036
|
+
|
|
1037
|
+
.sp-card-bar {
|
|
1038
|
+
width: 3px;
|
|
1039
|
+
border-radius: var(--sp-radius-full);
|
|
1040
|
+
margin-right: 14px;
|
|
1041
|
+
flex-shrink: 0;
|
|
1042
|
+
}
|
|
1043
|
+
|
|
1044
|
+
.sp-card-body {
|
|
1045
|
+
flex: 1;
|
|
1046
|
+
min-width: 0;
|
|
1047
|
+
}
|
|
1048
|
+
|
|
1049
|
+
.sp-card-header {
|
|
1050
|
+
display: flex;
|
|
1051
|
+
align-items: center;
|
|
1052
|
+
gap: 8px;
|
|
1053
|
+
margin-bottom: 6px;
|
|
1054
|
+
}
|
|
1055
|
+
|
|
1056
|
+
.sp-card-number {
|
|
1057
|
+
font-size: 12px;
|
|
1058
|
+
font-weight: 700;
|
|
1059
|
+
color: var(--sp-text-tertiary);
|
|
1060
|
+
font-variant-numeric: tabular-nums;
|
|
1061
|
+
}
|
|
1062
|
+
|
|
1063
|
+
.sp-badge {
|
|
1064
|
+
padding: 2px 10px;
|
|
1065
|
+
border-radius: var(--sp-radius-full);
|
|
1066
|
+
font-size: 11px;
|
|
1067
|
+
font-weight: 600;
|
|
1068
|
+
letter-spacing: 0.02em;
|
|
1069
|
+
}
|
|
1070
|
+
|
|
1071
|
+
.sp-card-date {
|
|
1072
|
+
font-size: 11px;
|
|
1073
|
+
color: var(--sp-text-tertiary);
|
|
1074
|
+
margin-left: auto;
|
|
1075
|
+
}
|
|
1076
|
+
|
|
1077
|
+
.sp-card-message {
|
|
1078
|
+
font-size: 13px;
|
|
1079
|
+
line-height: 1.5;
|
|
1080
|
+
color: var(--sp-text);
|
|
1081
|
+
display: -webkit-box;
|
|
1082
|
+
-webkit-line-clamp: 3;
|
|
1083
|
+
-webkit-box-orient: vertical;
|
|
1084
|
+
overflow: hidden;
|
|
1085
|
+
}
|
|
1086
|
+
|
|
1087
|
+
.sp-card-message--expanded {
|
|
1088
|
+
-webkit-line-clamp: unset;
|
|
1089
|
+
}
|
|
1090
|
+
|
|
1091
|
+
.sp-card-expand {
|
|
1092
|
+
font-size: 12px;
|
|
1093
|
+
font-weight: 500;
|
|
1094
|
+
color: var(--sp-accent);
|
|
1095
|
+
cursor: pointer;
|
|
1096
|
+
background: none;
|
|
1097
|
+
border: none;
|
|
1098
|
+
padding: 4px 0;
|
|
1099
|
+
font-family: var(--sp-font);
|
|
1100
|
+
transition: opacity 0.15s ease;
|
|
1101
|
+
}
|
|
1102
|
+
|
|
1103
|
+
.sp-card-expand:hover {
|
|
1104
|
+
opacity: 0.8;
|
|
1105
|
+
}
|
|
1106
|
+
|
|
1107
|
+
.sp-card-footer {
|
|
1108
|
+
display: flex;
|
|
1109
|
+
align-items: center;
|
|
1110
|
+
justify-content: flex-end;
|
|
1111
|
+
gap: 6px;
|
|
1112
|
+
margin-top: 10px;
|
|
1113
|
+
}
|
|
1114
|
+
|
|
1115
|
+
.sp-btn-resolve,
|
|
1116
|
+
.sp-btn-delete {
|
|
1117
|
+
padding: 8px 14px;
|
|
1118
|
+
border-radius: var(--sp-radius-full);
|
|
1119
|
+
border: 1px solid var(--sp-border);
|
|
1120
|
+
background: transparent;
|
|
1121
|
+
color: var(--sp-text-secondary);
|
|
1122
|
+
font-family: var(--sp-font);
|
|
1123
|
+
font-size: 12px;
|
|
1124
|
+
font-weight: 500;
|
|
1125
|
+
cursor: pointer;
|
|
1126
|
+
display: flex;
|
|
1127
|
+
align-items: center;
|
|
1128
|
+
gap: 4px;
|
|
1129
|
+
transition: all 0.2s ease;
|
|
1130
|
+
}
|
|
1131
|
+
|
|
1132
|
+
.sp-btn-resolve svg,
|
|
1133
|
+
.sp-btn-delete svg {
|
|
1134
|
+
width: 14px;
|
|
1135
|
+
height: 14px;
|
|
1136
|
+
}
|
|
1137
|
+
|
|
1138
|
+
.sp-btn-resolve:hover {
|
|
1139
|
+
border-color: #22c55e;
|
|
1140
|
+
color: #22c55e;
|
|
1141
|
+
background: rgba(34, 197, 94, 0.06);
|
|
1142
|
+
}
|
|
1143
|
+
|
|
1144
|
+
.sp-btn-delete:hover {
|
|
1145
|
+
border-color: #ef4444;
|
|
1146
|
+
color: #ef4444;
|
|
1147
|
+
background: rgba(239, 68, 68, 0.06);
|
|
1148
|
+
}
|
|
1149
|
+
|
|
1150
|
+
.sp-btn-resolve:disabled,
|
|
1151
|
+
.sp-btn-delete:disabled {
|
|
1152
|
+
opacity: 0.5;
|
|
1153
|
+
cursor: not-allowed;
|
|
1154
|
+
pointer-events: none;
|
|
1155
|
+
}
|
|
1156
|
+
|
|
1157
|
+
.sp-spinner--sm {
|
|
1158
|
+
width: 14px;
|
|
1159
|
+
height: 14px;
|
|
1160
|
+
}
|
|
1161
|
+
|
|
1162
|
+
/* ---- Delete All (header) ---- */
|
|
1163
|
+
|
|
1164
|
+
.sp-panel-header-right {
|
|
1165
|
+
display: flex;
|
|
1166
|
+
align-items: center;
|
|
1167
|
+
gap: 8px;
|
|
1168
|
+
}
|
|
1169
|
+
|
|
1170
|
+
.sp-btn-delete-all {
|
|
1171
|
+
padding: 5px 12px;
|
|
1172
|
+
border-radius: var(--sp-radius-full);
|
|
1173
|
+
border: 1px solid var(--sp-border);
|
|
1174
|
+
background: transparent;
|
|
1175
|
+
color: var(--sp-text-tertiary);
|
|
1176
|
+
font-family: var(--sp-font);
|
|
1177
|
+
font-size: 11px;
|
|
1178
|
+
font-weight: 500;
|
|
1179
|
+
cursor: pointer;
|
|
1180
|
+
display: flex;
|
|
1181
|
+
align-items: center;
|
|
1182
|
+
gap: 4px;
|
|
1183
|
+
transition: all 0.2s ease;
|
|
1184
|
+
}
|
|
1185
|
+
|
|
1186
|
+
.sp-btn-delete-all svg {
|
|
1187
|
+
width: 13px;
|
|
1188
|
+
height: 13px;
|
|
1189
|
+
}
|
|
1190
|
+
|
|
1191
|
+
.sp-btn-delete-all:hover {
|
|
1192
|
+
border-color: #ef4444;
|
|
1193
|
+
color: #ef4444;
|
|
1194
|
+
background: rgba(239, 68, 68, 0.06);
|
|
1195
|
+
}
|
|
1196
|
+
|
|
1197
|
+
.sp-btn-delete-all:disabled {
|
|
1198
|
+
opacity: 0.5;
|
|
1199
|
+
cursor: not-allowed;
|
|
1200
|
+
pointer-events: none;
|
|
1201
|
+
}
|
|
1202
|
+
|
|
1203
|
+
/* ---- Confirm Dialog ---- */
|
|
1204
|
+
|
|
1205
|
+
.sp-confirm-backdrop {
|
|
1206
|
+
position: fixed;
|
|
1207
|
+
inset: 0;
|
|
1208
|
+
background: var(--sp-backdrop, rgba(15, 23, 42, 0.2));
|
|
1209
|
+
backdrop-filter: blur(var(--sp-blur));
|
|
1210
|
+
-webkit-backdrop-filter: blur(var(--sp-blur));
|
|
1211
|
+
display: flex;
|
|
1212
|
+
align-items: center;
|
|
1213
|
+
justify-content: center;
|
|
1214
|
+
z-index: ${2147483647};
|
|
1215
|
+
opacity: 0;
|
|
1216
|
+
transition: opacity 0.2s ease;
|
|
1217
|
+
}
|
|
1218
|
+
|
|
1219
|
+
.sp-confirm-dialog {
|
|
1220
|
+
width: 340px;
|
|
1221
|
+
padding: 28px;
|
|
1222
|
+
border-radius: 20px;
|
|
1223
|
+
background: var(--sp-glass-bg-heavy);
|
|
1224
|
+
backdrop-filter: blur(var(--sp-blur-heavy));
|
|
1225
|
+
-webkit-backdrop-filter: blur(var(--sp-blur-heavy));
|
|
1226
|
+
border: 1px solid var(--sp-glass-border);
|
|
1227
|
+
box-shadow: var(--sp-shadow-xl);
|
|
1228
|
+
font-family: var(--sp-font);
|
|
1229
|
+
transform: translateY(8px) scale(0.97);
|
|
1230
|
+
transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
|
|
1231
|
+
}
|
|
1232
|
+
|
|
1233
|
+
.sp-confirm-title {
|
|
1234
|
+
font-size: 17px;
|
|
1235
|
+
font-weight: 700;
|
|
1236
|
+
color: var(--sp-text);
|
|
1237
|
+
letter-spacing: -0.02em;
|
|
1238
|
+
margin-bottom: 8px;
|
|
1239
|
+
}
|
|
1240
|
+
|
|
1241
|
+
.sp-confirm-message {
|
|
1242
|
+
font-size: 14px;
|
|
1243
|
+
color: var(--sp-text-secondary);
|
|
1244
|
+
line-height: 1.5;
|
|
1245
|
+
margin-bottom: 20px;
|
|
1246
|
+
}
|
|
1247
|
+
|
|
1248
|
+
.sp-confirm-actions {
|
|
1249
|
+
display: flex;
|
|
1250
|
+
gap: 8px;
|
|
1251
|
+
justify-content: flex-end;
|
|
1252
|
+
}
|
|
1253
|
+
|
|
1254
|
+
.sp-btn-danger {
|
|
1255
|
+
height: 40px;
|
|
1256
|
+
padding: 0 22px;
|
|
1257
|
+
border-radius: var(--sp-radius);
|
|
1258
|
+
border: none;
|
|
1259
|
+
background: #ef4444;
|
|
1260
|
+
color: #fff;
|
|
1261
|
+
font-family: var(--sp-font);
|
|
1262
|
+
font-size: 14px;
|
|
1263
|
+
font-weight: 600;
|
|
1264
|
+
cursor: pointer;
|
|
1265
|
+
transition: all 0.2s ease;
|
|
1266
|
+
box-shadow: 0 2px 8px rgba(239, 68, 68, 0.25);
|
|
1267
|
+
}
|
|
1268
|
+
|
|
1269
|
+
.sp-btn-danger:hover {
|
|
1270
|
+
background: #dc2626;
|
|
1271
|
+
box-shadow: 0 4px 16px rgba(239, 68, 68, 0.3);
|
|
1272
|
+
transform: translateY(-1px);
|
|
1273
|
+
}
|
|
1274
|
+
|
|
1275
|
+
.sp-btn-danger:active {
|
|
1276
|
+
transform: translateY(0) scale(0.98);
|
|
1277
|
+
transition-duration: 0.1s;
|
|
1278
|
+
}
|
|
1279
|
+
|
|
1280
|
+
.sp-card--resolved {
|
|
1281
|
+
opacity: 0.5;
|
|
1282
|
+
}
|
|
1283
|
+
|
|
1284
|
+
.sp-card--resolved .sp-card-message {
|
|
1285
|
+
text-decoration: line-through;
|
|
1286
|
+
text-decoration-color: var(--sp-text-tertiary);
|
|
1287
|
+
}
|
|
1288
|
+
|
|
1289
|
+
/* ============================
|
|
1290
|
+
Loading State
|
|
1291
|
+
============================ */
|
|
1292
|
+
|
|
1293
|
+
.sp-loading {
|
|
1294
|
+
display: flex;
|
|
1295
|
+
align-items: center;
|
|
1296
|
+
justify-content: center;
|
|
1297
|
+
padding: 48px 24px;
|
|
1298
|
+
}
|
|
1299
|
+
|
|
1300
|
+
/* ============================
|
|
1301
|
+
Identity Form
|
|
1302
|
+
============================ */
|
|
1303
|
+
|
|
1304
|
+
.sp-identity-title {
|
|
1305
|
+
font-size: 17px;
|
|
1306
|
+
font-weight: 700;
|
|
1307
|
+
color: var(--sp-text);
|
|
1308
|
+
letter-spacing: -0.02em;
|
|
1309
|
+
}
|
|
1310
|
+
|
|
1311
|
+
.sp-input {
|
|
1312
|
+
width: 100%;
|
|
1313
|
+
height: 42px;
|
|
1314
|
+
padding: 0 14px;
|
|
1315
|
+
border-radius: var(--sp-radius);
|
|
1316
|
+
border: 1px solid var(--sp-border);
|
|
1317
|
+
background: var(--sp-glass-bg-heavy);
|
|
1318
|
+
color: var(--sp-text);
|
|
1319
|
+
font-family: var(--sp-font);
|
|
1320
|
+
font-size: 14px;
|
|
1321
|
+
outline: none;
|
|
1322
|
+
transition: all 0.2s ease;
|
|
1323
|
+
}
|
|
1324
|
+
|
|
1325
|
+
.sp-input::placeholder {
|
|
1326
|
+
color: var(--sp-text-tertiary);
|
|
1327
|
+
}
|
|
1328
|
+
|
|
1329
|
+
.sp-input:focus {
|
|
1330
|
+
border-color: var(--sp-accent);
|
|
1331
|
+
box-shadow: 0 0 0 3px var(--sp-accent-light);
|
|
1332
|
+
background: var(--sp-bg);
|
|
1333
|
+
}
|
|
1334
|
+
|
|
1335
|
+
.sp-input-label {
|
|
1336
|
+
font-size: 13px;
|
|
1337
|
+
font-weight: 500;
|
|
1338
|
+
color: var(--sp-text-secondary);
|
|
1339
|
+
margin-bottom: 6px;
|
|
1340
|
+
display: block;
|
|
1341
|
+
}
|
|
1342
|
+
|
|
1343
|
+
/* ============================
|
|
1344
|
+
Buttons
|
|
1345
|
+
============================ */
|
|
1346
|
+
|
|
1347
|
+
.sp-btn-primary {
|
|
1348
|
+
height: 40px;
|
|
1349
|
+
padding: 0 22px;
|
|
1350
|
+
border-radius: var(--sp-radius);
|
|
1351
|
+
border: none;
|
|
1352
|
+
background: var(--sp-accent-gradient);
|
|
1353
|
+
color: #fff;
|
|
1354
|
+
font-family: var(--sp-font);
|
|
1355
|
+
font-size: 14px;
|
|
1356
|
+
font-weight: 600;
|
|
1357
|
+
cursor: pointer;
|
|
1358
|
+
transition: all 0.2s ease;
|
|
1359
|
+
box-shadow: 0 2px 8px var(--sp-accent-glow);
|
|
1360
|
+
}
|
|
1361
|
+
|
|
1362
|
+
.sp-btn-primary:hover {
|
|
1363
|
+
box-shadow: 0 4px 16px var(--sp-accent-glow);
|
|
1364
|
+
transform: translateY(-1px);
|
|
1365
|
+
}
|
|
1366
|
+
|
|
1367
|
+
.sp-btn-primary:active {
|
|
1368
|
+
transform: translateY(0) scale(0.98);
|
|
1369
|
+
transition-duration: 0.1s;
|
|
1370
|
+
}
|
|
1371
|
+
|
|
1372
|
+
.sp-btn-primary:disabled {
|
|
1373
|
+
opacity: 0.4;
|
|
1374
|
+
cursor: not-allowed;
|
|
1375
|
+
transform: none;
|
|
1376
|
+
box-shadow: none;
|
|
1377
|
+
}
|
|
1378
|
+
|
|
1379
|
+
.sp-btn-ghost {
|
|
1380
|
+
height: 40px;
|
|
1381
|
+
padding: 0 22px;
|
|
1382
|
+
border-radius: var(--sp-radius);
|
|
1383
|
+
border: 1px solid var(--sp-border);
|
|
1384
|
+
background: var(--sp-glass-bg-heavy);
|
|
1385
|
+
color: var(--sp-text-secondary);
|
|
1386
|
+
font-family: var(--sp-font);
|
|
1387
|
+
font-size: 14px;
|
|
1388
|
+
font-weight: 500;
|
|
1389
|
+
cursor: pointer;
|
|
1390
|
+
transition: all 0.2s ease;
|
|
1391
|
+
}
|
|
1392
|
+
|
|
1393
|
+
.sp-btn-ghost:hover {
|
|
1394
|
+
border-color: var(--sp-accent);
|
|
1395
|
+
color: var(--sp-accent);
|
|
1396
|
+
background: var(--sp-accent-light);
|
|
1397
|
+
}
|
|
1398
|
+
|
|
1399
|
+
/* ============================
|
|
1400
|
+
Empty State
|
|
1401
|
+
============================ */
|
|
1402
|
+
|
|
1403
|
+
.sp-empty {
|
|
1404
|
+
display: flex;
|
|
1405
|
+
flex-direction: column;
|
|
1406
|
+
align-items: center;
|
|
1407
|
+
justify-content: center;
|
|
1408
|
+
padding: 56px 24px;
|
|
1409
|
+
color: var(--sp-text-tertiary);
|
|
1410
|
+
text-align: center;
|
|
1411
|
+
gap: 8px;
|
|
1412
|
+
animation: sp-fade-in 0.3s ease-out both;
|
|
1413
|
+
}
|
|
1414
|
+
|
|
1415
|
+
.sp-empty-text {
|
|
1416
|
+
font-size: 14px;
|
|
1417
|
+
font-weight: 500;
|
|
1418
|
+
}
|
|
1419
|
+
|
|
1420
|
+
/* ============================
|
|
1421
|
+
Load More
|
|
1422
|
+
============================ */
|
|
1423
|
+
|
|
1424
|
+
.sp-load-more-wrap {
|
|
1425
|
+
display: flex;
|
|
1426
|
+
justify-content: center;
|
|
1427
|
+
padding: 12px 0 4px;
|
|
1428
|
+
}
|
|
1429
|
+
|
|
1430
|
+
.sp-btn-load-more {
|
|
1431
|
+
width: 100%;
|
|
1432
|
+
}
|
|
1433
|
+
|
|
1434
|
+
/* ============================
|
|
1435
|
+
Forced Colors / High Contrast
|
|
1436
|
+
============================ */
|
|
1437
|
+
|
|
1438
|
+
@media (forced-colors: active) {
|
|
1439
|
+
.sp-fab,
|
|
1440
|
+
.sp-radial-item,
|
|
1441
|
+
.sp-filter-dropdown-btn,
|
|
1442
|
+
.sp-segmented,
|
|
1443
|
+
.sp-segmented__btn,
|
|
1444
|
+
.sp-card,
|
|
1445
|
+
.sp-panel-close,
|
|
1446
|
+
.sp-search,
|
|
1447
|
+
.sp-btn-resolve,
|
|
1448
|
+
.sp-btn-delete,
|
|
1449
|
+
.sp-btn-delete-all,
|
|
1450
|
+
.sp-btn-primary,
|
|
1451
|
+
.sp-btn-ghost,
|
|
1452
|
+
.sp-btn-danger,
|
|
1453
|
+
.sp-card-expand,
|
|
1454
|
+
.sp-input,
|
|
1455
|
+
.sp-confirm-dialog {
|
|
1456
|
+
border: 2px solid ButtonText !important;
|
|
1457
|
+
background: Canvas !important;
|
|
1458
|
+
color: ButtonText !important;
|
|
1459
|
+
}
|
|
1460
|
+
|
|
1461
|
+
.sp-segmented__btn--active {
|
|
1462
|
+
background: Highlight !important;
|
|
1463
|
+
color: HighlightText !important;
|
|
1464
|
+
}
|
|
1465
|
+
|
|
1466
|
+
.sp-filter-dropdown-menu {
|
|
1467
|
+
border: 2px solid ButtonText !important;
|
|
1468
|
+
background: Canvas !important;
|
|
1469
|
+
}
|
|
1470
|
+
|
|
1471
|
+
.sp-filter-dropdown-option--active {
|
|
1472
|
+
background: Highlight !important;
|
|
1473
|
+
color: HighlightText !important;
|
|
1474
|
+
}
|
|
1475
|
+
|
|
1476
|
+
.sp-fab:focus-visible,
|
|
1477
|
+
.sp-radial-item:focus-visible,
|
|
1478
|
+
.sp-filter-dropdown-btn:focus-visible,
|
|
1479
|
+
.sp-segmented__btn:focus-visible,
|
|
1480
|
+
.sp-filter-dropdown-option:focus-visible,
|
|
1481
|
+
.sp-panel-close:focus-visible,
|
|
1482
|
+
.sp-btn-resolve:focus-visible,
|
|
1483
|
+
.sp-btn-delete:focus-visible,
|
|
1484
|
+
.sp-btn-delete-all:focus-visible,
|
|
1485
|
+
.sp-btn-primary:focus-visible,
|
|
1486
|
+
.sp-btn-ghost:focus-visible,
|
|
1487
|
+
.sp-btn-danger:focus-visible,
|
|
1488
|
+
.sp-card-expand:focus-visible,
|
|
1489
|
+
.sp-input:focus-visible,
|
|
1490
|
+
.sp-search:focus-visible {
|
|
1491
|
+
outline: 3px solid Highlight !important;
|
|
1492
|
+
}
|
|
1493
|
+
|
|
1494
|
+
.sp-panel {
|
|
1495
|
+
border: 2px solid ButtonText !important;
|
|
1496
|
+
}
|
|
1497
|
+
|
|
1498
|
+
.sp-fab-badge {
|
|
1499
|
+
border: 2px solid ButtonText !important;
|
|
1500
|
+
background: Canvas !important;
|
|
1501
|
+
color: ButtonText !important;
|
|
1502
|
+
}
|
|
1503
|
+
|
|
1504
|
+
.sp-card-bar {
|
|
1505
|
+
background: ButtonText !important;
|
|
1506
|
+
}
|
|
1507
|
+
}
|
|
1508
|
+
|
|
1509
|
+
${un}
|
|
1510
|
+
${chunkRHP4S23A_cjs._}
|
|
1511
|
+
${chunkRHP4S23A_cjs.Z}
|
|
1512
|
+
${chunkRHP4S23A_cjs.R}
|
|
1513
|
+
${chunkRHP4S23A_cjs.P}
|
|
1514
|
+
${chunkRHP4S23A_cjs.ca}
|
|
1515
|
+
${chunkRHP4S23A_cjs.T}
|
|
1516
|
+
`}var gi=120,bi=80,Le=class{constructor(e,n="en"){this.colors=e;this.locale=n;this.root=chunkRHP4S23A_cjs.b("div",{style:`
|
|
1517
|
+
position: fixed;
|
|
1518
|
+
z-index: ${2147483647};
|
|
1519
|
+
max-width: 280px;
|
|
1520
|
+
padding: 12px 14px;
|
|
1521
|
+
border-radius: 14px;
|
|
1522
|
+
background: ${this.colors.glassBgHeavy};
|
|
1523
|
+
backdrop-filter: blur(24px);
|
|
1524
|
+
-webkit-backdrop-filter: blur(24px);
|
|
1525
|
+
border: 1px solid ${this.colors.glassBorder};
|
|
1526
|
+
box-shadow: 0 8px 32px ${this.colors.shadow}, 0 2px 8px ${this.colors.shadow};
|
|
1527
|
+
font-family: "Inter", system-ui, -apple-system, sans-serif;
|
|
1528
|
+
pointer-events: auto;
|
|
1529
|
+
opacity: 0;
|
|
1530
|
+
transform: translateY(6px) scale(0.97);
|
|
1531
|
+
transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
|
|
1532
|
+
visibility: hidden;
|
|
1533
|
+
-webkit-font-smoothing: antialiased;
|
|
1534
|
+
`}),this.root.setAttribute("role","tooltip"),this.root.id=this.tooltipId,this.arrow=chunkRHP4S23A_cjs.b("div",{style:`
|
|
1535
|
+
position: absolute;
|
|
1536
|
+
width: 12px;
|
|
1537
|
+
height: 12px;
|
|
1538
|
+
background: ${this.colors.glassBgHeavy};
|
|
1539
|
+
border: 1px solid ${this.colors.glassBorder};
|
|
1540
|
+
transform: rotate(45deg);
|
|
1541
|
+
pointer-events: none;
|
|
1542
|
+
`}),this.root.appendChild(this.arrow),this.root.addEventListener("mouseenter",()=>this.cancelHide()),this.root.addEventListener("mouseleave",()=>this.scheduleHide()),document.body.appendChild(this.root);}colors;locale;root;arrow;showTimer=null;hideTimer=null;currentFeedbackId=null;tooltipId="sp-tooltip";show(e,n){this.currentFeedbackId!==e.id&&(this.cancelHide(),this.cancelShow(),this.showTimer=setTimeout(()=>{this.currentFeedbackId=e.id,this.render(e),this.position(n);let i=typeof window<"u"&&window.matchMedia("(prefers-reduced-motion: reduce)").matches;this.root.style.transition=i?"none":"",this.root.style.visibility="visible",this.root.style.opacity="1",this.root.style.transform="translateY(0) scale(1)";},gi));}scheduleHide(){this.cancelHide(),this.hideTimer=setTimeout(()=>this.hide(),bi);}hide(){this.cancelShow(),this.currentFeedbackId=null,this.root.style.opacity="0",this.root.style.transform="translateY(6px) scale(0.97)",setTimeout(()=>{this.currentFeedbackId||(this.root.style.visibility="hidden");},200);}cancelShow(){this.showTimer&&(clearTimeout(this.showTimer),this.showTimer=null);}cancelHide(){this.hideTimer&&(clearTimeout(this.hideTimer),this.hideTimer=null);}render(e){let n=Array.from(this.root.children);for(let u of n)u!==this.arrow&&u.remove();let i=chunkRHP4S23A_cjs.x(e.type,this.colors),o=chunkRHP4S23A_cjs.A(e.type,this.colors),r=chunkRHP4S23A_cjs.M(this.locale),s=chunkRHP4S23A_cjs.N(e.type,r),a=chunkRHP4S23A_cjs.b("div",{style:"display:flex;align-items:center;gap:8px;margin-bottom:8px;"}),l=chunkRHP4S23A_cjs.b("span",{style:`
|
|
1543
|
+
padding:3px 10px;border-radius:9999px;
|
|
1544
|
+
font-size:11px;font-weight:600;
|
|
1545
|
+
color:${i};background:${o};
|
|
1546
|
+
letter-spacing:0.02em;
|
|
1547
|
+
`});chunkRHP4S23A_cjs.c(l,s);let c=chunkRHP4S23A_cjs.b("span",{style:`font-size:11px;color:${this.colors.textSecondary};margin-left:auto;`});chunkRHP4S23A_cjs.c(c,chunkRHP4S23A_cjs.e(e.createdAt,this.locale)),a.appendChild(l),a.appendChild(c);let p=chunkRHP4S23A_cjs.b("div",{style:`font-size:13px;line-height:1.55;color:${this.colors.text};display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;`});chunkRHP4S23A_cjs.c(p,e.message),this.root.insertBefore(a,this.arrow),this.root.insertBefore(p,this.arrow);}position(e){let n=this.root.getBoundingClientRect(),i=10,o=e.top-n.height-i,r=e.left+e.width/2-n.width/2,s=true;o<8&&(o=e.bottom+i,s=false),r=Math.max(8,Math.min(r,window.innerWidth-n.width-8)),this.root.style.top=`${o}px`,this.root.style.left=`${r}px`;let a=Math.max(16,Math.min(e.left+e.width/2-r-6,n.width-22));s?this.arrow.style.cssText=`
|
|
1548
|
+
position:absolute;
|
|
1549
|
+
width:12px;height:12px;
|
|
1550
|
+
background:${this.colors.glassBgHeavy};
|
|
1551
|
+
border-right:1px solid ${this.colors.glassBorder};
|
|
1552
|
+
border-bottom:1px solid ${this.colors.glassBorder};
|
|
1553
|
+
transform:rotate(45deg);
|
|
1554
|
+
pointer-events:none;
|
|
1555
|
+
bottom:-6px;
|
|
1556
|
+
left:${a}px;
|
|
1557
|
+
`:this.arrow.style.cssText=`
|
|
1558
|
+
position:absolute;
|
|
1559
|
+
width:12px;height:12px;
|
|
1560
|
+
background:${this.colors.glassBgHeavy};
|
|
1561
|
+
border-left:1px solid ${this.colors.glassBorder};
|
|
1562
|
+
border-top:1px solid ${this.colors.glassBorder};
|
|
1563
|
+
transform:rotate(45deg);
|
|
1564
|
+
pointer-events:none;
|
|
1565
|
+
top:-6px;
|
|
1566
|
+
left:${a}px;
|
|
1567
|
+
`;}contains(e){return this.root.contains(e)}destroy(){this.cancelShow(),this.cancelHide(),this.root.remove();}};var ae=null;function yi(t){return t===void 0||t===false?{console:false,network:false,maxConsoleEntries:50,maxNetworkEntries:20}:t===true?{console:true,network:true,maxConsoleEntries:50,maxNetworkEntries:20}:{console:t.console!==false,network:t.network!==false,maxConsoleEntries:typeof t.maxConsoleEntries=="number"?t.maxConsoleEntries:50,maxNetworkEntries:typeof t.maxNetworkEntries=="number"?t.maxNetworkEntries:20}}function le(){let t=()=>{};return {destroy:t,open:t,close:t,refresh:t,focusFeedback:()=>false,on:()=>t,off:t}}function hn(){try{return process.env.NODE_ENV}catch{return}}function vi(t){return t===void 0||t===false?{enabled:false,param:"siteping"}:t===true?{enabled:true,param:"siteping"}:{enabled:true,param:t.param??"siteping"}}function fn(t){if(typeof window>"u"||typeof document>"u")return t.onSkip?.("ssr"),le();let e=t.debug?(...h)=>console.debug("[siteping]",...h):()=>{};if(ae)return e("initSiteping() called more than once \u2014 returning existing instance"),ae;if(!t.forceShow&&hn()==="production")return t.onSkip?.("production"),le();let n=typeof t.minViewportWidth=="number"&&Number.isFinite(t.minViewportWidth)?t.minViewportWidth:768;if(!t.forceShow&&window.innerWidth<n){let h="mobile";return t.onSkip?.(h),le()}if(!t.store&&(!t.endpoint||typeof t.endpoint!="string"))return console.error("[siteping] Missing 'endpoint' or 'store' in config. Provide an endpoint like '/api/siteping' or a SitepingStore instance."),le();if(!t.projectName||typeof t.projectName!="string")return console.error("[siteping] Missing or invalid 'projectName' in config. Expected a non-empty string."),le();let i=t.locale??"en",o=i==="en"?Promise.resolve():chunkRHP4S23A_cjs.L(i).catch(()=>{}),r=chunkRHP4S23A_cjs.M(i),s=t.scopeAnnotationsByUrl??true,a=()=>{try{let h=t.getPageScope?.();if(h)return h}catch(h){e("getPageScope() threw, falling back to pathname:",h);}return {url:window.location.pathname,urlPattern:null}};e("Initializing widget",{projectName:t.projectName,theme:t.theme??"light",locale:i,scopeAnnotationsByUrl:s});let l=yi(t.captureDiagnostics),c=l.console?new we(l.maxConsoleEntries):null,p=l.network?new Ee(l.maxNetworkEntries):null,u=chunkRHP4S23A_cjs.w(t.accentColor,t.theme),d=new ie,f=new ie,m=(()=>{if(t.store)return new Me(t.store,t.projectName);let h=t.endpoint;if(typeof h!="string"||h.length===0)throw new Error("[siteping] internal invariant: endpoint must be a non-empty string in HTTP mode");return new xe(h,t.projectName,{apiKey:t.apiKey,headers:t.headers})})();t.onOpen&&d.on("open",t.onOpen),t.onClose&&d.on("close",t.onClose),t.onFeedbackSent&&d.on("feedback:sent",t.onFeedbackSent),t.onError&&d.on("feedback:error",t.onError),t.onAnnotationStart&&d.on("annotation:start",t.onAnnotationStart),t.onAnnotationEnd&&d.on("annotation:end",t.onAnnotationEnd),d.on("feedback:sent",h=>f.emit("feedback:sent",h)),d.on("feedback:deleted",h=>f.emit("feedback:deleted",h)),d.on("open",()=>f.emit("panel:open")),d.on("close",()=>f.emit("panel:close")),d.on("open",()=>e("Panel opened")),d.on("close",()=>e("Panel closed")),d.on("feedback:sent",h=>e("Feedback sent",h.id)),d.on("feedback:error",h=>e("Feedback failed",h.message)),d.on("annotation:start",()=>e("Annotation started")),d.on("annotation:end",()=>e("Annotation ended"));let T=document.createElement("siteping-widget");T.style.cssText=`position:fixed;z-index:${2147483647};`;let E=hn()==="test"?"open":"closed",x=T.attachShadow({mode:E});if("adoptedStyleSheets"in ShadowRoot.prototype){let h=new CSSStyleSheet;h.replaceSync(it(u)),x.adoptedStyleSheets=[h];}else {let h=document.createElement("style");h.textContent=it(u),x.appendChild(h);}document.body.appendChild(T);let _=Bt(T),k=document.createElement("div");k.setAttribute("role","status"),k.setAttribute("aria-live","polite"),k.setAttribute("aria-atomic","true"),k.style.cssText="position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;",document.body.appendChild(k);let C=new Le(u,i),v=new Re(u,C,d,r,k),L=new ke(x,t,d,r);d.on("markers:changed",h=>L.updateBadge(h));let S=null,H=null,R=false,ce=0;async function st(){return R?null:S||(H||(H=import('./panel-N7TAQKDR.cjs').then(h=>R?null:(S=new h.Panel(x,u,d,m,t.projectName,v,r,i,{getScope:a,scopeAnnotationsByUrl:s}),S))),H)}if(typeof window<"u"){let h=()=>{R||st();},g=window.requestIdleCallback;typeof g=="function"?g(h):setTimeout(h,200);}let B=false,mn=d.on("panel:toggle",h=>{S||(h?(B=true,st().then(g=>{g&&B&&g.open(),B=false;}).catch(g=>e("Failed to lazy-load panel:",g))):B=false);}),pe=new ye(u,d,r,t.enableScreenshot??false,()=>_.getLastPageFocus()),de=null;t.enableRightClickComment&&(de=h=>{h.defaultPrevented||h.shiftKey||h.ctrlKey||h.altKey||h.metaKey||h.composedPath().some(b=>b===T||b instanceof Element&&(b.hasAttribute("data-siteping-ignore")||b.id==="siteping-markers"))||pe.isBusy||(h.preventDefault(),pe.startInstantAnnotation(h.clientX,h.clientY).catch(b=>e("right-click annotation failed",b)));},document.addEventListener("contextmenu",de)),i!=="en"&&o.then(()=>{R||(L.refreshLabels(),pe.refreshLabels());});let Pe=false,gn=d.on("annotation:complete",async h=>{if(Pe){d.emit("submission:cancelled");return}Pe=true;try{let{annotation:g,type:b,message:P,screenshotDataUrl:z,screenshotRegion:j}=h,I=t.identity??qe();if(!I){if(I=await xi(x,r),!I){d.emit("submission:cancelled");return}Zt(I);}let M=(()=>{try{return crypto.randomUUID()}catch{return `${Date.now()}-${Math.random().toString(36).slice(2)}`}})(),q=a(),lt=null;(c||p)&&(lt={console:c?.getEntries()??[],network:p?.getEntries()??[]});let vn={projectName:t.projectName,type:b,message:P,url:q.url,urlPattern:q.urlPattern,viewport:`${window.innerWidth}x${window.innerHeight}`,userAgent:navigator.userAgent,authorName:I.name,authorEmail:I.email,annotations:[g],clientId:M,screenshotDataUrl:z??null,screenshotRegion:j??null,diagnostics:lt};try{let D=await m.sendFeedback(vn);d.emit("feedback:sent",D),(!s||D.url===q.url)&&v.addFeedback(D,v.count+1),k.textContent=r("feedback.sent.confirmation"),S&&await S.refresh();}catch(D){d.emit("feedback:error",D instanceof Error?D:new Error(String(D))),k.textContent=r("feedback.error.message");}}finally{Pe=false;}}),Ie=a(),bn=s?{limit:20,url:Ie.url}:{limit:20},Fe=vi(t.deepLink),yn=++ce;Promise.all([m.getFeedbacks(t.projectName,bn),o]).then(([{feedbacks:h}])=>{if(R||ce!==yn)return;let g=s?h.filter(b=>b.url===Ie.url):h;if(v.render(g),Fe.enabled)try{let b=new URLSearchParams(window.location.search).get(Fe.param);if(b){let P=v.focusFeedback(b);e(`deepLink ?${Fe.param}=${b} ${P?"focused":"did not match a visible feedback"}`);}}catch(b){e("deepLink parsing failed:",b);}}).catch(h=>{e("Failed to load initial markers:",h);}),t.endpoint&&Ut(t.endpoint,t.identity??qe(),{apiKey:t.apiKey,headers:t.headers}).then(()=>e("Retry queue flushed")).catch(()=>{});let rt=()=>{let h=++ce;if(S?.isCurrentlyOpen)return S.refresh();let g=a(),b=s?{limit:20,url:g.url}:{limit:20};return m.getFeedbacks(t.projectName,b).then(({feedbacks:P})=>{if(R||h!==ce||S?.isCurrentlyOpen)return;let z=s?P.filter(j=>j.url===g.url):P;v.render(z);})},at=null;if(t.watchNavigation!==false&&typeof window<"u"&&typeof history<"u"){let h=M=>`${M.url}
|
|
1568
|
+
${M.urlPattern??""}`,g=h(Ie),b=()=>{if(R)return;let M=h(a());if(M===g)return;let q=g;g=M,e("SPA navigation detected \u2014 refreshing feedbacks for new scope"),rt().catch(()=>{g===M&&(g=q);});},P=history.pushState,z=history.replaceState,j=function(...M){P.apply(this,M),b();},I=function(...M){z.apply(this,M),b();};history.pushState=j,history.replaceState=I,window.addEventListener("popstate",b),window.addEventListener("hashchange",b),at=()=>{window.removeEventListener("popstate",b),window.removeEventListener("hashchange",b),history.pushState===j&&(history.pushState=P),history.replaceState===I&&(history.replaceState=z);};}return ae={destroy:()=>{e("Destroying widget"),de&&document.removeEventListener("contextmenu",de),R=true,B=false,at?.(),_.destroy(),gn(),mn(),L.destroy(),S?.destroy(),pe.destroy(),v.destroy(),C.destroy(),c?.dispose(),p?.dispose(),d.removeAll(),f.removeAll(),k.remove(),T.remove(),ae=null;},open:()=>{d.emit("panel:toggle",true);},close:()=>{S?S.close():B=false;},focusFeedback:h=>v.focusFeedback(h),refresh:()=>{rt().catch(()=>{});},on:(h,g)=>f.on(h,g),off:(h,g)=>{f.off(h,g);}},ae}function xi(t,e){return new Promise(n=>{let i=t.activeElement??document.activeElement,o=t.host;o.parentNode&&o.parentNode.appendChild(o);let r=document.createElement("div");r.style.cssText=`
|
|
1569
|
+
position:fixed;inset:0;
|
|
1570
|
+
background:var(--sp-identity-overlay);
|
|
1571
|
+
backdrop-filter:blur(8px);
|
|
1572
|
+
-webkit-backdrop-filter:blur(8px);
|
|
1573
|
+
display:flex;align-items:center;justify-content:center;
|
|
1574
|
+
z-index:${2147483647};
|
|
1575
|
+
opacity:0;transition:opacity 0.25s ease;
|
|
1576
|
+
`;let s=document.createElement("div");s.style.cssText=`
|
|
1577
|
+
width:340px;padding:28px;border-radius:var(--sp-radius-xl);
|
|
1578
|
+
background:var(--sp-identity-bg);
|
|
1579
|
+
backdrop-filter:blur(var(--sp-blur-heavy));
|
|
1580
|
+
-webkit-backdrop-filter:blur(var(--sp-blur-heavy));
|
|
1581
|
+
border:1px solid var(--sp-glass-border);
|
|
1582
|
+
box-shadow:0 16px 48px var(--sp-shadow), 0 8px 16px var(--sp-shadow);
|
|
1583
|
+
font-family:var(--sp-font, "Inter",system-ui,-apple-system,sans-serif);
|
|
1584
|
+
color:var(--sp-text);
|
|
1585
|
+
transform:translateY(12px) scale(0.97);
|
|
1586
|
+
transition:transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
|
|
1587
|
+
-webkit-font-smoothing:antialiased;
|
|
1588
|
+
`;let a=`sp-identity-title-${Date.now()}`;s.setAttribute("role","dialog"),s.setAttribute("aria-modal","true"),s.setAttribute("aria-labelledby",a);let l=document.createElement("div");l.className="sp-identity-title",l.id=a,l.textContent=e("identity.title"),l.style.marginBottom="20px";let c=`sp-identity-name-${Date.now()}`,p=`sp-identity-email-${Date.now()}`,u=document.createElement("label");u.className="sp-input-label",u.textContent=e("identity.nameLabel"),u.setAttribute("for",c);let d=document.createElement("input");d.className="sp-input",d.id=c,d.type="text",d.placeholder=e("identity.namePlaceholder"),d.style.marginBottom="14px";let f=document.createElement("label");f.className="sp-input-label",f.textContent=e("identity.emailLabel"),f.setAttribute("for",p);let m=document.createElement("input");m.className="sp-input",m.id=p,m.type="email",m.placeholder=e("identity.emailPlaceholder");let T=document.createElement("div");T.style.cssText="display:flex;gap:8px;justify-content:flex-end;margin-top:20px;";let E=C=>{r.removeEventListener("keydown",k),r.style.opacity="0",s.style.transform="translateY(12px) scale(0.97)",setTimeout(()=>{r.remove(),i?.focus(),n(C);},250);},x=document.createElement("button");x.className="sp-btn-ghost",x.textContent=e("identity.cancel"),x.addEventListener("click",()=>E(null));let A=document.createElement("button");A.className="sp-btn-primary",A.textContent=e("identity.submit"),A.addEventListener("click",()=>{let C=d.value.trim(),v=m.value.trim();if(!C||!v)return;if(!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(v)){m.style.borderColor="var(--sp-type-bug, #ef4444)";return}E({name:C,email:v});});let _='input, button, [tabindex]:not([tabindex="-1"])',k=C=>{let v=C;if(v.key==="Escape"){E(null);return}if(v.key==="Tab"){let L=Array.from(s.querySelectorAll(_));if(L.length===0)return;let S=L[0],H=L[L.length-1];if(!S||!H)return;let R=t.activeElement;v.shiftKey?(R===S||!s.contains(R))&&(v.preventDefault(),H.focus()):(R===H||!s.contains(R))&&(v.preventDefault(),S.focus());}};r.addEventListener("keydown",k),r.addEventListener("click",C=>{C.target===r&&E(null);}),T.appendChild(x),T.appendChild(A),s.appendChild(l),s.appendChild(u),s.appendChild(d),s.appendChild(f),s.appendChild(m),s.appendChild(T),r.appendChild(s),t.appendChild(r),requestAnimationFrame(()=>{r.style.opacity="1",s.style.transform="translateY(0) scale(1)",d.focus();});})}function Uo(t){return fn(t)}exports.initSiteping=Uo;//# sourceMappingURL=index.cjs.map
|
|
1589
|
+
//# sourceMappingURL=index.cjs.map
|