@siteping/widget 0.10.8 → 0.10.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/dist/{chunk-BJFC7TVL.cjs → chunk-AFLWWD6M.cjs} +2 -2
  2. package/dist/chunk-AFLWWD6M.cjs.map +1 -0
  3. package/dist/{chunk-4CK3N4YE.js → chunk-ATTI2TS4.js} +2 -2
  4. package/dist/chunk-ATTI2TS4.js.map +1 -0
  5. package/dist/{chunk-EYISG4OI.js → chunk-BP5TH2CD.js} +2 -2
  6. package/dist/chunk-BP5TH2CD.js.map +1 -0
  7. package/dist/{chunk-OK2KX3KN.cjs → chunk-OSADAHGS.cjs} +2 -2
  8. package/dist/chunk-OSADAHGS.cjs.map +1 -0
  9. package/dist/index.cjs +30 -30
  10. package/dist/index.cjs.map +1 -1
  11. package/dist/index.global.js +107 -119
  12. package/dist/index.global.js.map +1 -1
  13. package/dist/index.js +3 -3
  14. package/dist/index.js.map +1 -1
  15. package/dist/{panel-KCYUMYAI.cjs → panel-2FEECS2N.cjs} +2 -2
  16. package/dist/{panel-KCYUMYAI.cjs.map → panel-2FEECS2N.cjs.map} +1 -1
  17. package/dist/{panel-LYS3425X.cjs → panel-CSFFA5FF.cjs} +2 -2
  18. package/dist/{panel-LYS3425X.cjs.map → panel-CSFFA5FF.cjs.map} +1 -1
  19. package/dist/{panel-W2LHYGFS.js → panel-S2UR5BSD.js} +2 -2
  20. package/dist/{panel-W2LHYGFS.js.map → panel-S2UR5BSD.js.map} +1 -1
  21. package/dist/{panel-KV2AQHC2.js → panel-SGSUHR7V.js} +2 -2
  22. package/dist/{panel-KV2AQHC2.js.map → panel-SGSUHR7V.js.map} +1 -1
  23. package/dist/react.cjs +30 -30
  24. package/dist/react.cjs.map +1 -1
  25. package/dist/react.js +3 -3
  26. package/dist/react.js.map +1 -1
  27. package/dist/types.d.cts +2 -2
  28. package/dist/types.d.ts +2 -2
  29. package/package.json +2 -2
  30. package/dist/chunk-4CK3N4YE.js.map +0 -1
  31. package/dist/chunk-BJFC7TVL.cjs.map +0 -1
  32. package/dist/chunk-EYISG4OI.js.map +0 -1
  33. package/dist/chunk-OK2KX3KN.cjs.map +0 -1
@@ -1,2 +1,2 @@
1
- import {e,g,n,o,m,u,F,U,da,v,aa,W,Y,ha,ea,fa,f,p,Z,_,$,Q,J,R,M as M$1,L,K,S,q,E,w,B,x,y,z,A,D,C}from'./chunk-4CK3N4YE.js';var M=class{element;current;opts;onChange;datasetKey;constructor(e){this.opts=e.options,this.current=e.value,this.onChange=e.onChange,this.datasetKey=e.datasetKey,this.element=n("div",{class:`sp-segmented${e.extraClass?` ${e.extraClass}`:""}`,role:"radiogroup"}),this.element.setAttribute("aria-label",e.ariaLabel);for(let t of this.opts){let s=document.createElement("button");s.type="button",s.className=e.modifierPrefix!==void 0?`sp-segmented__btn ${e.modifierPrefix}${t.value}`:"sp-segmented__btn",s.dataset[this.datasetKey]=t.value,s.setAttribute("role","radio");let n$1=this.current===t.value;if(s.setAttribute("aria-checked",String(n$1)),s.tabIndex=n$1?0:-1,n$1&&s.classList.add("sp-segmented__btn--active"),t.color&&s.style.setProperty("--sp-chip-color",t.color),t.bg&&s.style.setProperty("--sp-chip-bg",t.bg),t.icon){let a=n("span",{class:"sp-segmented__icon"});a.appendChild(m(t.icon)),s.appendChild(a);}let o$1=n("span",{class:"sp-segmented__label"});o(o$1,t.label),s.appendChild(o$1),s.addEventListener("click",()=>this.select(t.value)),s.addEventListener("keydown",a=>this.handleKey(a,t.value)),this.element.appendChild(s);}}select(e){this.current=e,this.syncSelection(),this.onChange(e);}syncSelection(){let e=this.element.querySelectorAll(".sp-segmented__btn");for(let t of e){let s=t.dataset[this.datasetKey]===this.current;t.classList.toggle("sp-segmented__btn--active",s),t.setAttribute("aria-checked",String(s)),t.tabIndex=s?0:-1;}}setOptionVisible(e,t){let s=this.element.querySelector(`[data-${this.kebabKey()}="${e}"]`);return s?(s.style.display=t?"":"none",true):false}get value(){return this.current}focusOption(e){this.element.querySelector(`[data-${this.kebabKey()}="${e}"]`)?.focus();}handleKey(e,t){let s=this.opts.map(d=>d.value).filter(d=>{let c=this.element.querySelector(`[data-${this.kebabKey()}="${d}"]`);return c!==null&&c.style.display!=="none"}),n=s.indexOf(t);if(n<0)return;let o;switch(e.key){case "ArrowLeft":o=(n-1+s.length)%s.length;break;case "ArrowRight":o=(n+1)%s.length;break;case "Home":o=0;break;case "End":o=s.length-1;break;default:return}e.preventDefault();let a=s[o];a!==void 0&&(this.select(a),this.focusOption(a));}kebabKey(){return this.datasetKey.replace(/[A-Z]/g,e=>`-${e.toLowerCase()}`)}};var me=e.filter(O=>!g(O)),ue=class{constructor(e,t,s,n$1,o$1,a,d,c,b){this.colors=t;this.bus=s;this.client=n$1;this.projectName=o$1;this.markers=a;this.t=d;this.locale=c;this.shadowRoot=e,this.getScope=b?.getScope??(()=>({url:window.location.pathname,urlPattern:null})),this.scopeAnnotationsByUrl=b?.scopeAnnotationsByUrl??true,this.root=n("div",{class:"sp-panel"}),this.root.setAttribute("role","complementary"),this.root.setAttribute("aria-label",this.t("panel.ariaLabel")),this.root.setAttribute("aria-hidden","true");let m$1=n("div",{class:"sp-panel-header"}),p=n("span",{class:"sp-panel-title"});o(p,this.t("panel.title")),this.closeBtn=document.createElement("button"),this.closeBtn.className="sp-panel-close",this.closeBtn.setAttribute("aria-label",this.t("panel.close")),this.closeBtn.appendChild(m(u)),this.closeBtn.addEventListener("click",()=>this.close()),this.deleteAllBtn=document.createElement("button"),this.deleteAllBtn.className="sp-btn-delete-all",this.deleteAllBtn.setAttribute("aria-label",this.t("panel.deleteAll")),this.deleteAllBtn.appendChild(m(F));let y=document.createElement("span");o(y,` ${this.t("panel.deleteAll")}`),this.deleteAllBtn.appendChild(y),this.deleteAllBtn.addEventListener("click",()=>this.confirmDeleteAll()),this.exportBtn=new U(t,()=>this.feedbacks,this.t);let C=n("div",{class:"sp-panel-header-right"});C.appendChild(this.exportBtn.element),C.appendChild(this.deleteAllBtn),C.appendChild(this.closeBtn),m$1.appendChild(p),m$1.appendChild(C),this.stats=new da(t,this.t);let k=n("div",{class:"sp-filters"}),T=n("div",{class:"sp-search-wrap"}),f=m(v);f.setAttribute("class","sp-search-icon"),this.searchInput=document.createElement("input"),this.searchInput.type="text",this.searchInput.className="sp-search",this.searchInput.placeholder=this.t("panel.search"),this.searchInput.setAttribute("aria-label",this.t("panel.searchAria")),this.searchInput.addEventListener("input",()=>{this.searchTimeout&&clearTimeout(this.searchTimeout),this.searchTimeout=setTimeout(()=>this.loadFeedbacks().catch(()=>{}),200);}),T.appendChild(f),T.appendChild(this.searchInput);let L=n("div",{class:"sp-filter-bar"});L.appendChild(this.buildTypeDropdown()),L.appendChild(this.buildStatusSegmented()),L.appendChild(this.buildScopeSegmented()),this.sortControls=new aa(t,()=>this.renderList(),this.t),k.appendChild(T),k.appendChild(L),k.appendChild(this.sortControls.element),this.listContainer=n("div",{class:"sp-list"}),this.listContainer.setAttribute("role","list"),this.listContainer.setAttribute("aria-label",this.t("panel.feedbackList")),this.bulk=new W(t,{onResolve:i=>this.bulkResolve(i),onDelete:i=>this.bulkDelete(i)},this.t),this.bulk.setListContainer(this.listContainer),this.detail=new Y(t,{onBack:()=>this.detail.hide(),onResolve:async i=>{try{let r=!g(i.status);await this.client.resolveFeedback(i.id,r),await this.loadFeedbacks(),this.detail.hide();}catch(r){throw this.bus.emit("feedback:error",r instanceof Error?r:new Error(String(r))),r}},onDelete:async i=>{try{await this.client.deleteFeedback(i.id),this.bus.emit("feedback:deleted",i.id),await this.loadFeedbacks(),this.detail.hide();}catch(r){throw this.bus.emit("feedback:error",r instanceof Error?r:new Error(String(r))),r}},onGoToAnnotation:i=>{if(i.annotations.length>0){let r=i.annotations[0];if(!r)return;window.scrollTo({left:r.scrollX,top:r.scrollY,behavior:"smooth"}),this.markers.pinHighlight(i);}}},this.t,c),this.shortcuts=new ha(t,{onNavigate:i=>{let r=ea(this.listContainer);fa(this.listContainer,i==="down"?r+1:r-1);},onResolve:()=>{let i=this.getFocusedFeedback();if(i&&!this.pendingMutations.has(i.id)){let u=this.listContainer.querySelector(`[data-feedback-id="${CSS.escape(i.id)}"]`)?.querySelector('[data-action="resolve"]');u&&this.toggleResolve(i,u).catch(()=>{});}},onDelete:()=>{let i=this.getFocusedFeedback();if(i&&!this.pendingMutations.has(i.id)){let u=this.listContainer.querySelector(`[data-feedback-id="${CSS.escape(i.id)}"]`)?.querySelector('[data-action="delete"]');u&&this.deleteFeedback(i,u).catch(()=>{});}},onFocusSearch:()=>this.searchInput.focus(),onToggleSelect:()=>{let i=this.getFocusedFeedback();i&&this.bulk.toggle(i.id);}},this.t),this.root.appendChild(m$1),this.root.appendChild(this.stats.element),this.root.appendChild(k),this.root.appendChild(this.listContainer),this.root.appendChild(this.bulk.barElement),this.root.appendChild(this.detail.element),this.root.appendChild(this.shortcuts.helpOverlay),this.root.appendChild(this.shortcuts.hintButton),e.appendChild(this.root),this.onListClick=i=>{let r=i.target;if(r.closest(".sp-bulk-checkbox"))return;let u=r.closest("[data-action]");if(u){i.stopPropagation();let A=u.closest(".sp-card");if(!A)return;let w=A.dataset.feedbackId,g=this.feedbacks.find(E=>E.id===w);if(!g)return;let B=u.dataset.action;if(B==="expand"){let E=A.querySelector(".sp-card-message");if(!E)return;let R=E.classList.toggle("sp-card-message--expanded");o(u,R?this.t("panel.showLess"):this.t("panel.showMore")),u.setAttribute("aria-expanded",String(R));}else if(B==="resolve"){if(this.pendingMutations.has(g.id))return;let E=u;this.toggleResolve(g,E).catch(()=>{});}else if(B==="delete"){if(this.pendingMutations.has(g.id))return;let E=u;this.deleteFeedback(g,E).catch(()=>{});}return}let v=r.closest(".sp-card");if(v){let A=v.dataset.feedbackId,w=this.feedbacks.find(g=>g.id===A);if(w){let g=this.feedbacks.indexOf(w)+1;this.detail.show(w,g);}}},this.listContainer.addEventListener("click",this.onListClick),this.onListKeydown=i=>{let r=i;if(r.key!=="Enter"&&r.key!==" ")return;let u=r.target,v=u.closest(".sp-card");if(!v||u!==v)return;r.preventDefault();let A=v.dataset.feedbackId,w=this.feedbacks.find(g=>g.id===A);if(w){let g=this.feedbacks.indexOf(w)+1;this.detail.show(w,g);}},this.listContainer.addEventListener("keydown",this.onListKeydown),this.onListMouseover=i=>{let u=i.target.closest(".sp-card");if(!u)return;let v=u.dataset.feedbackId;v&&this.markers.highlight(v);},this.listContainer.addEventListener("mouseover",this.onListMouseover),this.onListMouseout=i=>{let r=i.relatedTarget;r&&this.listContainer.contains(r)||this.markers.highlight("");},this.listContainer.addEventListener("mouseout",this.onListMouseout),this.bus.on("panel:toggle",i=>{i?this.open():this.close();}),e.addEventListener("keydown",i=>{let r=i;if(r.key==="Escape"&&this.isOpen){if(this.detail.isVisible){this.detail.hide();return}this.close();return}if(r.key==="Tab"&&this.isOpen){let u=B=>{let E=B;for(;E&&E!==this.root;){if(E.style.display==="none")return false;E=E.parentElement;}return true},v=Array.from(this.root.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')).filter(B=>u(B)&&!B.hasAttribute("disabled"));if(v.length===0)return;let A=v[0],w=v[v.length-1];if(!A||!w)return;let g=e.activeElement;r.shiftKey&&g===A?(r.preventDefault(),w.focus()):!r.shiftKey&&g===w&&(r.preventDefault(),A.focus());}}),this.onMarkerClick=(i=>{this.scrollToFeedback(i.detail.feedbackId);}),document.addEventListener("sp-marker-click",this.onMarkerClick);}colors;bus;client;projectName;markers;t;locale;root;listContainer;searchInput;closeBtn;deleteAllBtn;activeFilters=new Set(["all"]);typeDropdownBtn;typeDropdownContainer;typeDropdownMenu=null;typeDropdownOutsideHandler=null;statusSegmented;typeOptions;feedbacks=[];currentPage=1;totalFeedbacks=0;isLoadingMore=false;isOpen=false;searchTimeout=null;loadController=null;pendingMutations=new Set;stats;sortControls;bulk;exportBtn;shortcuts;detail;shadowRoot;getScope;scopeAnnotationsByUrl;scopeSegmented;initialScopeFilter="this";onMarkerClick;onListClick;onListKeydown;onListMouseover;onListMouseout;async open(){this.isOpen||(this.isOpen=true,this.root.classList.add("sp-panel--open"),this.root.setAttribute("aria-hidden","false"),this.bus.emit("open"),this.shortcuts.enable(this.shadowRoot),await this.loadFeedbacks(),requestAnimationFrame(()=>{this.searchInput?this.searchInput.focus():this.closeBtn.focus();}));}close(){if(!this.isOpen)return;this.isOpen=false,this.root.classList.remove("sp-panel--open"),this.root.setAttribute("aria-hidden","true"),this.bus.emit("close"),this.shortcuts.disable(),this.detail.hide(),this.root.getRootNode().querySelector(".sp-fab")?.focus();}showLoading(){this.listContainer.replaceChildren();let e=n("div",{class:"sp-loading"});e.setAttribute("role","status"),e.setAttribute("aria-live","polite"),e.setAttribute("aria-label",this.t("panel.loading"));let t=n("div",{class:"sp-spinner"});e.appendChild(t),this.listContainer.appendChild(e);}showError(){this.listContainer.replaceChildren();let e=n("div",{class:"sp-empty"});e.setAttribute("role","status"),e.setAttribute("aria-live","polite");let t=n("div",{class:"sp-empty-text"});o(t,this.t("panel.loadError"));let s=document.createElement("button");s.className="sp-btn-ghost",s.style.marginTop="8px",o(s,this.t("panel.retry")),s.addEventListener("click",()=>this.loadFeedbacks().catch(()=>{})),e.appendChild(t),e.appendChild(s),this.listContainer.appendChild(e);}statusBucket(e){if(e!=="all")return g(e)?f:me}async loadFeedbacks(){this.loadController?.abort(),this.loadController=new AbortController;let{signal:e}=this.loadController;this.currentPage=1;let t=this.searchInput.value.trim()||void 0,s=this.activeFilters.has("all")?void 0:Array.from(this.activeFilters)[0],n=this.statusBucket(this.statusSegmented.value),o=this.getScope();this.syncScopeAvailability();let a=this.scopeSegmented.value,d={page:1,limit:20};s&&(d.type=s),n&&(d.statuses=n),t&&(d.search=t),a==="this"?d.url=o.url:a==="template"&&o.urlPattern&&(d.urlPattern=o.urlPattern);let c=this.feedbacks.length>0;c||this.showLoading();try{let{feedbacks:b,total:m}=await this.client.getFeedbacks(this.projectName,d);if(e.aborted)return;this.feedbacks=b,this.totalFeedbacks=m,this.stats.update(b,m),this.bulk.reset(),this.renderList();let p=this.scopeAnnotationsByUrl?b.filter(y=>y.url===o.url):b;this.markers.render(p);}catch(b){if(e.aborted)return;c||this.showError(),this.bus.emit("feedback:error",b instanceof Error?b:new Error(String(b)));}}async loadMoreFeedbacks(){if(this.isLoadingMore)return;this.isLoadingMore=true;let e=this.loadController,t=this.currentPage+1,s=this.searchInput.value.trim()||void 0,n=this.activeFilters.has("all")?void 0:Array.from(this.activeFilters)[0],o=this.statusBucket(this.statusSegmented.value),a=this.getScope(),d=this.scopeSegmented.value,c={page:t,limit:20};n&&(c.type=n),o&&(c.statuses=o),s&&(c.search=s),d==="this"?c.url=a.url:d==="template"&&a.urlPattern&&(c.urlPattern=a.urlPattern);let b=this.listContainer.querySelector(".sp-btn-load-more"),m;b&&(m=p(b));try{let{feedbacks:p,total:y}=await this.client.getFeedbacks(this.projectName,c);if(e!==this.loadController)return;this.currentPage=t,this.totalFeedbacks=y,this.feedbacks=[...this.feedbacks,...p],this.stats.update(this.feedbacks,y),this.renderList();let C=this.scopeAnnotationsByUrl?this.feedbacks.filter(k=>k.url===a.url):this.feedbacks;this.markers.render(C);}catch(p){m&&m(),this.bus.emit("feedback:error",p instanceof Error?p:new Error(String(p)));}finally{this.isLoadingMore=false;}}renderList(){if(this.listContainer.replaceChildren(),this.feedbacks.length===0){let o$1=n("div",{class:"sp-empty"});o$1.setAttribute("role","status"),o$1.setAttribute("aria-live","polite");let a=n("div",{class:"sp-empty-text"});o(a,this.t("panel.empty")),o$1.appendChild(a),this.listContainer.appendChild(o$1);return}let e=Z(this.feedbacks,this.sortControls.sortMode),t=e.map(o=>o.id),s=this.bulk.createSelectAllBar(t,this.t("bulk.selectAll"));if(this.listContainer.appendChild(s),this.sortControls.groupByPage){let o=_(e),a=0;for(let[d,c]of o){let b=$(d,c.length,this.colors);this.listContainer.appendChild(b);let m=n("div",{class:"sp-group-content"});for(let p of c){let y=this.createCard(p,a+1);y.style.setProperty("--sp-card-i",String(a)),m.appendChild(y),a++;}this.listContainer.appendChild(m);}}else e.forEach((o,a)=>{let d=this.createCard(o,a+1);d.style.setProperty("--sp-card-i",String(a)),this.listContainer.appendChild(d);});let n$1=this.totalFeedbacks-this.feedbacks.length;if(n$1>0){let o$1=n("div",{class:"sp-load-more-wrap"}),a=document.createElement("button");a.className="sp-btn-ghost sp-btn-load-more",o(a,Q(this.t,"panel.loadMore",{remaining:n$1})),a.addEventListener("click",()=>this.loadMoreFeedbacks().catch(()=>{})),o$1.appendChild(a),this.listContainer.appendChild(o$1);}}createCard(e,t){let s=g(e.status),n$1=J(e.type,this.colors),o$1=n("div",{class:`sp-card ${s?"sp-card--resolved":""}`});o$1.setAttribute("role","listitem"),o$1.setAttribute("tabindex","0"),o$1.setAttribute("aria-label",`Feedback #${t}: ${R(e.type,this.t)} \u2014 ${e.message.slice(0,80)}`),o$1.dataset.feedbackId=e.id;let a=n("div",{class:"sp-card-bar"});a.style.background=s?"#9ca3af":n$1;let d=n("div",{class:"sp-card-body"}),c=n("div",{class:"sp-card-header"}),b=this.bulk.createCheckbox(e.id);c.appendChild(b);let m$1=n("span",{class:"sp-card-number"});o(m$1,`#${t}`);let p=n("span",{class:"sp-badge"}),y=M$1(e.type,this.colors);p.style.background=y,p.style.color=n$1,o(p,R(e.type,this.t));let C=n("span",{class:"sp-badge sp-badge--status"});C.dataset.status=e.status,C.style.background=L(e.status,this.colors),C.style.color=K(e.status,this.colors),o(C,S(e.status,this.t));let k=n("span",{class:"sp-card-date"});o(k,q(e.createdAt,this.locale)),c.appendChild(m$1),c.appendChild(p),c.appendChild(C),c.appendChild(k);let T=n("div",{class:"sp-card-message"});o(T,e.message);let f=document.createElement("button");f.className="sp-card-expand",f.dataset.action="expand",o(f,this.t("panel.showMore")),f.style.display="none",f.setAttribute("aria-expanded","false"),requestAnimationFrame(()=>{T.scrollHeight>T.clientHeight&&(f.style.display="block");});let L$1=n("div",{class:"sp-card-footer"}),i=document.createElement("button");if(i.className="sp-btn-resolve",i.dataset.action="resolve",s){i.appendChild(m(E));let v=document.createElement("span");o(v,` ${this.t("panel.reopen")}`),i.appendChild(v);}else {i.appendChild(m(w));let v=document.createElement("span");o(v,` ${this.t("panel.resolve")}`),i.appendChild(v);}let r=document.createElement("button");r.className="sp-btn-delete",r.dataset.action="delete",r.appendChild(m(F));let u=document.createElement("span");return o(u,` ${this.t("panel.delete")}`),r.appendChild(u),L$1.appendChild(i),L$1.appendChild(r),d.appendChild(c),d.appendChild(T),d.appendChild(f),d.appendChild(L$1),o$1.appendChild(a),o$1.appendChild(d),o$1}async bulkResolve(e){try{await Promise.all(e.map(t=>this.client.resolveFeedback(t,!0))),await this.loadFeedbacks();}catch(t){throw this.bus.emit("feedback:error",t instanceof Error?t:new Error(String(t))),t}}async bulkDelete(e){try{await Promise.all(e.map(t=>this.client.deleteFeedback(t)));for(let t of e)this.bus.emit("feedback:deleted",t);await this.loadFeedbacks();}catch(t){throw this.bus.emit("feedback:error",t instanceof Error?t:new Error(String(t))),t}}async confirmDeleteAll(){if(await this.showConfirmDialog(this.t("panel.deleteAllConfirmTitle"),this.t("panel.deleteAllConfirmMessage"))){this.deleteAllBtn.disabled=true;try{await this.client.deleteAllFeedbacks(this.projectName),this.bus.emit("feedback:all-deleted"),await this.loadFeedbacks();}catch(t){this.bus.emit("feedback:error",t instanceof Error?t:new Error(String(t)));}finally{this.deleteAllBtn.disabled=false;}}}showConfirmDialog(e,t){return new Promise(s=>{let n$1=n("div",{class:"sp-confirm-backdrop"}),o$1=`sp-confirm-title-${Date.now()}`,a=`sp-confirm-msg-${Date.now()}`,d=n("div",{class:"sp-confirm-dialog"});d.setAttribute("role","alertdialog"),d.setAttribute("aria-modal","true"),d.setAttribute("aria-labelledby",o$1),d.setAttribute("aria-describedby",a);let c=n("div",{class:"sp-confirm-title"});c.id=o$1,o(c,e);let b=n("div",{class:"sp-confirm-message"});b.id=a,o(b,t);let m=n("div",{class:"sp-confirm-actions"}),p=document.createElement("button");p.type="button",p.className="sp-btn-ghost",o(p,this.t("panel.cancel"));let y=document.createElement("button");y.type="button",y.className="sp-btn-danger",o(y,this.t("panel.confirmDelete"));let C=false,k=f=>{C||(C=true,n$1.removeEventListener("keydown",T),n$1.style.opacity="0",d.style.transform="translateY(8px) scale(0.97)",setTimeout(()=>{n$1.remove(),s(f);},200));},T=f=>{let L=f;if(L.key==="Escape"){k(false);return}L.key==="Tab"&&(L.preventDefault(),n$1.getRootNode().activeElement===p?y.focus():p.focus());};n$1.addEventListener("keydown",T),p.addEventListener("click",()=>k(false)),y.addEventListener("click",()=>k(true)),n$1.addEventListener("click",f=>{f.target===n$1&&k(false);}),m.appendChild(p),m.appendChild(y),d.appendChild(c),d.appendChild(b),d.appendChild(m),n$1.appendChild(d),this.root.getRootNode()instanceof ShadowRoot?this.root.getRootNode().appendChild(n$1):this.root.appendChild(n$1),requestAnimationFrame(()=>{n$1.style.opacity="1",d.style.transform="translateY(0) scale(1)",p.focus();});})}async deleteFeedback(e,t){this.pendingMutations.add(e.id);let s=p(t);try{await this.client.deleteFeedback(e.id),this.bus.emit("feedback:deleted",e.id),await this.loadFeedbacks();}catch(n){s(),this.bus.emit("feedback:error",n instanceof Error?n:new Error(String(n)));}finally{this.pendingMutations.delete(e.id);}}async toggleResolve(e,t){this.pendingMutations.add(e.id);let s=p(t);try{let n=!g(e.status);await this.client.resolveFeedback(e.id,n),await this.loadFeedbacks();}catch(n){s(),this.bus.emit("feedback:error",n instanceof Error?n:new Error(String(n)));}finally{this.pendingMutations.delete(e.id);}}buildTypeDropdown(){return this.typeOptions=[{value:"all",label:this.t("panel.filterAll"),icon:B,color:this.colors.accent,bg:this.colors.accentLight},{value:"question",label:this.t("type.question"),icon:x,color:this.colors.typeQuestion,bg:this.colors.typeQuestionBg},{value:"change",label:this.t("type.change"),icon:y,color:this.colors.typeChange,bg:this.colors.typeChangeBg},{value:"bug",label:this.t("type.bug"),icon:z,color:this.colors.typeBug,bg:this.colors.typeBugBg},{value:"other",label:this.t("type.other"),icon:A,color:this.colors.typeOther,bg:this.colors.typeOtherBg}],this.typeDropdownContainer=n("div",{class:"sp-filter-dropdown"}),this.typeDropdownBtn=document.createElement("button"),this.typeDropdownBtn.type="button",this.typeDropdownBtn.className="sp-filter-dropdown-btn",this.typeDropdownBtn.setAttribute("aria-haspopup","listbox"),this.typeDropdownBtn.setAttribute("aria-expanded","false"),this.renderTypeDropdownTrigger(),this.typeDropdownBtn.addEventListener("click",e=>{e.stopPropagation(),this.typeDropdownMenu?this.closeTypeDropdown():this.openTypeDropdown();}),this.typeDropdownContainer.appendChild(this.typeDropdownBtn),this.typeDropdownContainer}renderTypeDropdownTrigger(){let e=this.typeOptions.find(d=>this.activeFilters.has(d.value))??this.typeOptions[0];if(!e)return;this.typeDropdownBtn.replaceChildren(),this.typeDropdownBtn.style.setProperty("--sp-chip-color",e.color),this.typeDropdownBtn.style.setProperty("--sp-chip-bg",e.bg),this.typeDropdownBtn.dataset.filter=e.value,this.typeDropdownBtn.classList.toggle("sp-filter-dropdown-btn--filtered",e.value!=="all"),this.typeDropdownBtn.setAttribute("aria-label",`${this.t("type.label")}: ${e.label}`);let t=n("span",{class:"sp-filter-dropdown-btn__icon"});t.appendChild(m(e.icon)),this.typeDropdownBtn.appendChild(t);let s=n("span",{class:"sp-filter-dropdown-btn__label"}),n$1=n("span",{class:"sp-filter-dropdown-btn__prefix"});o(n$1,this.t("type.label"));let o$1=n("span",{class:"sp-filter-dropdown-btn__value"});o(o$1,e.label),s.appendChild(n$1),s.appendChild(o$1),this.typeDropdownBtn.appendChild(s);let a=n("span",{class:"sp-filter-dropdown-btn__chevron"});a.appendChild(m(D)),this.typeDropdownBtn.appendChild(a);}openTypeDropdown(){this.typeDropdownMenu=n("div",{class:"sp-filter-dropdown-menu"}),this.typeDropdownMenu.setAttribute("role","listbox"),this.typeDropdownMenu.setAttribute("aria-label",this.t("type.label")),this.typeDropdownBtn.setAttribute("aria-expanded","true");for(let e of this.typeOptions){let t=document.createElement("button");t.type="button";let s=this.activeFilters.has(e.value);t.className=`sp-filter-dropdown-option${s?" sp-filter-dropdown-option--active":""}`,t.style.setProperty("--sp-chip-color",e.color),t.style.setProperty("--sp-chip-bg",e.bg),t.dataset.filter=e.value,t.setAttribute("role","option"),t.setAttribute("aria-selected",String(s));let n$1=n("span",{class:"sp-filter-dropdown-option__icon"});n$1.appendChild(m(e.icon)),t.appendChild(n$1);let o$1=n("span",{class:"sp-filter-dropdown-option__label"});if(o(o$1,e.label),t.appendChild(o$1),s){let a=n("span",{class:"sp-filter-dropdown-option__check"});a.appendChild(m(w)),t.appendChild(a);}t.addEventListener("click",a=>{a.stopPropagation(),this.selectTypeFilter(e.value);}),this.typeDropdownMenu.appendChild(t);}this.typeDropdownContainer.appendChild(this.typeDropdownMenu),requestAnimationFrame(()=>{this.typeDropdownOutsideHandler=e=>{this.typeDropdownMenu&&!this.typeDropdownContainer.contains(e.target)&&this.closeTypeDropdown();},document.addEventListener("click",this.typeDropdownOutsideHandler,true);}),this.typeDropdownMenu.addEventListener("keydown",e=>{e.key==="Escape"&&(this.closeTypeDropdown(),this.typeDropdownBtn.focus());});}closeTypeDropdown(){this.typeDropdownMenu&&(this.typeDropdownMenu.remove(),this.typeDropdownMenu=null),this.typeDropdownBtn.setAttribute("aria-expanded","false"),this.typeDropdownOutsideHandler&&(document.removeEventListener("click",this.typeDropdownOutsideHandler,true),this.typeDropdownOutsideHandler=null);}selectTypeFilter(e){this.activeFilters.clear(),this.activeFilters.add(e),this.renderTypeDropdownTrigger(),this.closeTypeDropdown(),this.loadFeedbacks().catch(()=>{});}buildStatusSegmented(){return this.statusSegmented=new M({options:[{value:"all",label:this.t("panel.statusAll"),icon:B,color:this.colors.accent,bg:this.colors.accentLight},{value:"open",label:this.t("panel.statusOpen"),icon:C,color:this.colors.statusOpen,bg:this.colors.statusOpenBg},{value:"resolved",label:this.t("panel.statusResolved"),icon:w,color:this.colors.statusResolved,bg:this.colors.statusResolvedBg}],value:"all",onChange:()=>{this.loadFeedbacks().catch(()=>{});},ariaLabel:this.t("status.label"),datasetKey:"statusFilter",modifierPrefix:"sp-segmented__btn--"}),this.statusSegmented.element}buildScopeSegmented(){return this.scopeSegmented=new M({options:[{value:"this",label:this.t("scope.thisPage")},{value:"template",label:this.t("scope.thisType")},{value:"all",label:this.t("scope.all")}],value:this.initialScopeFilter,onChange:()=>{this.loadFeedbacks().catch(()=>{});},ariaLabel:this.t("scope.label"),datasetKey:"scopeFilter",modifierPrefix:"sp-segmented__btn--scope-",extraClass:"sp-segmented--scope"}),this.syncScopeAvailability(),this.scopeSegmented.element}syncScopeAvailability(){if(!this.scopeSegmented)return;let t=!!this.getScope().urlPattern;this.scopeSegmented.setOptionVisible("template",t),!t&&this.scopeSegmented.value==="template"&&this.scopeSegmented.select("this");}getFocusedFeedback(){let e=ea(this.listContainer);if(e<0)return;let t=this.listContainer.querySelectorAll(".sp-card")[e];if(t)return this.feedbacks.find(s=>s.id===t.dataset.feedbackId)}scrollToFeedback(e){let t=CSS.escape(e),s=this.listContainer.querySelector(`[data-feedback-id="${t}"]`);s&&(s.scrollIntoView({behavior:"smooth",block:"center"}),s.classList.add("sp-anim-flash"),s.addEventListener("animationend",()=>{s.classList.remove("sp-anim-flash");},{once:true}));}async refresh(){this.isOpen&&await this.loadFeedbacks();}get isCurrentlyOpen(){return this.isOpen}destroy(){this.loadController?.abort(),this.searchTimeout&&clearTimeout(this.searchTimeout),this.listContainer.removeEventListener("click",this.onListClick),this.listContainer.removeEventListener("keydown",this.onListKeydown),this.listContainer.removeEventListener("mouseover",this.onListMouseover),this.listContainer.removeEventListener("mouseout",this.onListMouseout),document.removeEventListener("sp-marker-click",this.onMarkerClick),this.closeTypeDropdown(),this.sortControls.destroy(),this.bulk.destroy(),this.exportBtn.destroy(),this.shortcuts.destroy(),this.detail.destroy(),this.root.remove();}};export{ue as Panel};//# sourceMappingURL=panel-W2LHYGFS.js.map
2
- //# sourceMappingURL=panel-W2LHYGFS.js.map
1
+ import {e,g,n,o,m,u,F,U,da,v,aa,W,Y,ha,ea,fa,f,p,Z,_,$,Q,J,R,M as M$1,L,K,S,q,E,w,B,x,y,z,A,D,C}from'./chunk-ATTI2TS4.js';var M=class{element;current;opts;onChange;datasetKey;constructor(e){this.opts=e.options,this.current=e.value,this.onChange=e.onChange,this.datasetKey=e.datasetKey,this.element=n("div",{class:`sp-segmented${e.extraClass?` ${e.extraClass}`:""}`,role:"radiogroup"}),this.element.setAttribute("aria-label",e.ariaLabel);for(let t of this.opts){let s=document.createElement("button");s.type="button",s.className=e.modifierPrefix!==void 0?`sp-segmented__btn ${e.modifierPrefix}${t.value}`:"sp-segmented__btn",s.dataset[this.datasetKey]=t.value,s.setAttribute("role","radio");let n$1=this.current===t.value;if(s.setAttribute("aria-checked",String(n$1)),s.tabIndex=n$1?0:-1,n$1&&s.classList.add("sp-segmented__btn--active"),t.color&&s.style.setProperty("--sp-chip-color",t.color),t.bg&&s.style.setProperty("--sp-chip-bg",t.bg),t.icon){let a=n("span",{class:"sp-segmented__icon"});a.appendChild(m(t.icon)),s.appendChild(a);}let o$1=n("span",{class:"sp-segmented__label"});o(o$1,t.label),s.appendChild(o$1),s.addEventListener("click",()=>this.select(t.value)),s.addEventListener("keydown",a=>this.handleKey(a,t.value)),this.element.appendChild(s);}}select(e){this.current=e,this.syncSelection(),this.onChange(e);}syncSelection(){let e=this.element.querySelectorAll(".sp-segmented__btn");for(let t of e){let s=t.dataset[this.datasetKey]===this.current;t.classList.toggle("sp-segmented__btn--active",s),t.setAttribute("aria-checked",String(s)),t.tabIndex=s?0:-1;}}setOptionVisible(e,t){let s=this.element.querySelector(`[data-${this.kebabKey()}="${e}"]`);return s?(s.style.display=t?"":"none",true):false}get value(){return this.current}focusOption(e){this.element.querySelector(`[data-${this.kebabKey()}="${e}"]`)?.focus();}handleKey(e,t){let s=this.opts.map(d=>d.value).filter(d=>{let c=this.element.querySelector(`[data-${this.kebabKey()}="${d}"]`);return c!==null&&c.style.display!=="none"}),n=s.indexOf(t);if(n<0)return;let o;switch(e.key){case "ArrowLeft":o=(n-1+s.length)%s.length;break;case "ArrowRight":o=(n+1)%s.length;break;case "Home":o=0;break;case "End":o=s.length-1;break;default:return}e.preventDefault();let a=s[o];a!==void 0&&(this.select(a),this.focusOption(a));}kebabKey(){return this.datasetKey.replace(/[A-Z]/g,e=>`-${e.toLowerCase()}`)}};var me=e.filter(O=>!g(O)),ue=class{constructor(e,t,s,n$1,o$1,a,d,c,b){this.colors=t;this.bus=s;this.client=n$1;this.projectName=o$1;this.markers=a;this.t=d;this.locale=c;this.shadowRoot=e,this.getScope=b?.getScope??(()=>({url:window.location.pathname,urlPattern:null})),this.scopeAnnotationsByUrl=b?.scopeAnnotationsByUrl??true,this.root=n("div",{class:"sp-panel"}),this.root.setAttribute("role","complementary"),this.root.setAttribute("aria-label",this.t("panel.ariaLabel")),this.root.setAttribute("aria-hidden","true");let m$1=n("div",{class:"sp-panel-header"}),p=n("span",{class:"sp-panel-title"});o(p,this.t("panel.title")),this.closeBtn=document.createElement("button"),this.closeBtn.className="sp-panel-close",this.closeBtn.setAttribute("aria-label",this.t("panel.close")),this.closeBtn.appendChild(m(u)),this.closeBtn.addEventListener("click",()=>this.close()),this.deleteAllBtn=document.createElement("button"),this.deleteAllBtn.className="sp-btn-delete-all",this.deleteAllBtn.setAttribute("aria-label",this.t("panel.deleteAll")),this.deleteAllBtn.appendChild(m(F));let y=document.createElement("span");o(y,` ${this.t("panel.deleteAll")}`),this.deleteAllBtn.appendChild(y),this.deleteAllBtn.addEventListener("click",()=>this.confirmDeleteAll()),this.exportBtn=new U(t,()=>this.feedbacks,this.t);let C=n("div",{class:"sp-panel-header-right"});C.appendChild(this.exportBtn.element),C.appendChild(this.deleteAllBtn),C.appendChild(this.closeBtn),m$1.appendChild(p),m$1.appendChild(C),this.stats=new da(t,this.t);let k=n("div",{class:"sp-filters"}),T=n("div",{class:"sp-search-wrap"}),f=m(v);f.setAttribute("class","sp-search-icon"),this.searchInput=document.createElement("input"),this.searchInput.type="text",this.searchInput.className="sp-search",this.searchInput.placeholder=this.t("panel.search"),this.searchInput.setAttribute("aria-label",this.t("panel.searchAria")),this.searchInput.addEventListener("input",()=>{this.searchTimeout&&clearTimeout(this.searchTimeout),this.searchTimeout=setTimeout(()=>this.loadFeedbacks().catch(()=>{}),200);}),T.appendChild(f),T.appendChild(this.searchInput);let L=n("div",{class:"sp-filter-bar"});L.appendChild(this.buildTypeDropdown()),L.appendChild(this.buildStatusSegmented()),L.appendChild(this.buildScopeSegmented()),this.sortControls=new aa(t,()=>this.renderList(),this.t),k.appendChild(T),k.appendChild(L),k.appendChild(this.sortControls.element),this.listContainer=n("div",{class:"sp-list"}),this.listContainer.setAttribute("role","list"),this.listContainer.setAttribute("aria-label",this.t("panel.feedbackList")),this.bulk=new W(t,{onResolve:i=>this.bulkResolve(i),onDelete:i=>this.bulkDelete(i)},this.t),this.bulk.setListContainer(this.listContainer),this.detail=new Y(t,{onBack:()=>this.detail.hide(),onResolve:async i=>{try{let r=!g(i.status);await this.client.resolveFeedback(i.id,r),await this.loadFeedbacks(),this.detail.hide();}catch(r){throw this.bus.emit("feedback:error",r instanceof Error?r:new Error(String(r))),r}},onDelete:async i=>{try{await this.client.deleteFeedback(i.id),this.bus.emit("feedback:deleted",i.id),await this.loadFeedbacks(),this.detail.hide();}catch(r){throw this.bus.emit("feedback:error",r instanceof Error?r:new Error(String(r))),r}},onGoToAnnotation:i=>{if(i.annotations.length>0){let r=i.annotations[0];if(!r)return;window.scrollTo({left:r.scrollX,top:r.scrollY,behavior:"smooth"}),this.markers.pinHighlight(i);}}},this.t,c),this.shortcuts=new ha(t,{onNavigate:i=>{let r=ea(this.listContainer);fa(this.listContainer,i==="down"?r+1:r-1);},onResolve:()=>{let i=this.getFocusedFeedback();if(i&&!this.pendingMutations.has(i.id)){let u=this.listContainer.querySelector(`[data-feedback-id="${CSS.escape(i.id)}"]`)?.querySelector('[data-action="resolve"]');u&&this.toggleResolve(i,u).catch(()=>{});}},onDelete:()=>{let i=this.getFocusedFeedback();if(i&&!this.pendingMutations.has(i.id)){let u=this.listContainer.querySelector(`[data-feedback-id="${CSS.escape(i.id)}"]`)?.querySelector('[data-action="delete"]');u&&this.deleteFeedback(i,u).catch(()=>{});}},onFocusSearch:()=>this.searchInput.focus(),onToggleSelect:()=>{let i=this.getFocusedFeedback();i&&this.bulk.toggle(i.id);}},this.t),this.root.appendChild(m$1),this.root.appendChild(this.stats.element),this.root.appendChild(k),this.root.appendChild(this.listContainer),this.root.appendChild(this.bulk.barElement),this.root.appendChild(this.detail.element),this.root.appendChild(this.shortcuts.helpOverlay),this.root.appendChild(this.shortcuts.hintButton),e.appendChild(this.root),this.onListClick=i=>{let r=i.target;if(r.closest(".sp-bulk-checkbox"))return;let u=r.closest("[data-action]");if(u){i.stopPropagation();let A=u.closest(".sp-card");if(!A)return;let w=A.dataset.feedbackId,g=this.feedbacks.find(E=>E.id===w);if(!g)return;let B=u.dataset.action;if(B==="expand"){let E=A.querySelector(".sp-card-message");if(!E)return;let R=E.classList.toggle("sp-card-message--expanded");o(u,R?this.t("panel.showLess"):this.t("panel.showMore")),u.setAttribute("aria-expanded",String(R));}else if(B==="resolve"){if(this.pendingMutations.has(g.id))return;let E=u;this.toggleResolve(g,E).catch(()=>{});}else if(B==="delete"){if(this.pendingMutations.has(g.id))return;let E=u;this.deleteFeedback(g,E).catch(()=>{});}return}let v=r.closest(".sp-card");if(v){let A=v.dataset.feedbackId,w=this.feedbacks.find(g=>g.id===A);if(w){let g=this.feedbacks.indexOf(w)+1;this.detail.show(w,g);}}},this.listContainer.addEventListener("click",this.onListClick),this.onListKeydown=i=>{let r=i;if(r.key!=="Enter"&&r.key!==" ")return;let u=r.target,v=u.closest(".sp-card");if(!v||u!==v)return;r.preventDefault();let A=v.dataset.feedbackId,w=this.feedbacks.find(g=>g.id===A);if(w){let g=this.feedbacks.indexOf(w)+1;this.detail.show(w,g);}},this.listContainer.addEventListener("keydown",this.onListKeydown),this.onListMouseover=i=>{let u=i.target.closest(".sp-card");if(!u)return;let v=u.dataset.feedbackId;v&&this.markers.highlight(v);},this.listContainer.addEventListener("mouseover",this.onListMouseover),this.onListMouseout=i=>{let r=i.relatedTarget;r&&this.listContainer.contains(r)||this.markers.highlight("");},this.listContainer.addEventListener("mouseout",this.onListMouseout),this.bus.on("panel:toggle",i=>{i?this.open():this.close();}),e.addEventListener("keydown",i=>{let r=i;if(r.key==="Escape"&&this.isOpen){if(this.detail.isVisible){this.detail.hide();return}this.close();return}if(r.key==="Tab"&&this.isOpen){let u=B=>{let E=B;for(;E&&E!==this.root;){if(E.style.display==="none")return false;E=E.parentElement;}return true},v=Array.from(this.root.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')).filter(B=>u(B)&&!B.hasAttribute("disabled"));if(v.length===0)return;let A=v[0],w=v[v.length-1];if(!A||!w)return;let g=e.activeElement;r.shiftKey&&g===A?(r.preventDefault(),w.focus()):!r.shiftKey&&g===w&&(r.preventDefault(),A.focus());}}),this.onMarkerClick=(i=>{this.scrollToFeedback(i.detail.feedbackId);}),document.addEventListener("sp-marker-click",this.onMarkerClick);}colors;bus;client;projectName;markers;t;locale;root;listContainer;searchInput;closeBtn;deleteAllBtn;activeFilters=new Set(["all"]);typeDropdownBtn;typeDropdownContainer;typeDropdownMenu=null;typeDropdownOutsideHandler=null;statusSegmented;typeOptions;feedbacks=[];currentPage=1;totalFeedbacks=0;isLoadingMore=false;isOpen=false;searchTimeout=null;loadController=null;pendingMutations=new Set;stats;sortControls;bulk;exportBtn;shortcuts;detail;shadowRoot;getScope;scopeAnnotationsByUrl;scopeSegmented;initialScopeFilter="this";onMarkerClick;onListClick;onListKeydown;onListMouseover;onListMouseout;async open(){this.isOpen||(this.isOpen=true,this.root.classList.add("sp-panel--open"),this.root.setAttribute("aria-hidden","false"),this.bus.emit("open"),this.shortcuts.enable(this.shadowRoot),await this.loadFeedbacks(),requestAnimationFrame(()=>{this.searchInput?this.searchInput.focus():this.closeBtn.focus();}));}close(){if(!this.isOpen)return;this.isOpen=false,this.root.classList.remove("sp-panel--open"),this.root.setAttribute("aria-hidden","true"),this.bus.emit("close"),this.shortcuts.disable(),this.detail.hide(),this.root.getRootNode().querySelector(".sp-fab")?.focus();}showLoading(){this.listContainer.replaceChildren();let e=n("div",{class:"sp-loading"});e.setAttribute("role","status"),e.setAttribute("aria-live","polite"),e.setAttribute("aria-label",this.t("panel.loading"));let t=n("div",{class:"sp-spinner"});e.appendChild(t),this.listContainer.appendChild(e);}showError(){this.listContainer.replaceChildren();let e=n("div",{class:"sp-empty"});e.setAttribute("role","status"),e.setAttribute("aria-live","polite");let t=n("div",{class:"sp-empty-text"});o(t,this.t("panel.loadError"));let s=document.createElement("button");s.className="sp-btn-ghost",s.style.marginTop="8px",o(s,this.t("panel.retry")),s.addEventListener("click",()=>this.loadFeedbacks().catch(()=>{})),e.appendChild(t),e.appendChild(s),this.listContainer.appendChild(e);}statusBucket(e){if(e!=="all")return g(e)?f:me}async loadFeedbacks(){this.loadController?.abort(),this.loadController=new AbortController;let{signal:e}=this.loadController;this.currentPage=1;let t=this.searchInput.value.trim()||void 0,s=this.activeFilters.has("all")?void 0:Array.from(this.activeFilters)[0],n=this.statusBucket(this.statusSegmented.value),o=this.getScope();this.syncScopeAvailability();let a=this.scopeSegmented.value,d={page:1,limit:20};s&&(d.type=s),n&&(d.statuses=n),t&&(d.search=t),a==="this"?d.url=o.url:a==="template"&&o.urlPattern&&(d.urlPattern=o.urlPattern);let c=this.feedbacks.length>0;c||this.showLoading();try{let{feedbacks:b,total:m}=await this.client.getFeedbacks(this.projectName,d);if(e.aborted)return;this.feedbacks=b,this.totalFeedbacks=m,this.stats.update(b,m),this.bulk.reset(),this.renderList();let p=this.scopeAnnotationsByUrl?b.filter(y=>y.url===o.url):b;this.markers.render(p);}catch(b){if(e.aborted)return;c||this.showError(),this.bus.emit("feedback:error",b instanceof Error?b:new Error(String(b)));}}async loadMoreFeedbacks(){if(this.isLoadingMore)return;this.isLoadingMore=true;let e=this.loadController,t=this.currentPage+1,s=this.searchInput.value.trim()||void 0,n=this.activeFilters.has("all")?void 0:Array.from(this.activeFilters)[0],o=this.statusBucket(this.statusSegmented.value),a=this.getScope(),d=this.scopeSegmented.value,c={page:t,limit:20};n&&(c.type=n),o&&(c.statuses=o),s&&(c.search=s),d==="this"?c.url=a.url:d==="template"&&a.urlPattern&&(c.urlPattern=a.urlPattern);let b=this.listContainer.querySelector(".sp-btn-load-more"),m;b&&(m=p(b));try{let{feedbacks:p,total:y}=await this.client.getFeedbacks(this.projectName,c);if(e!==this.loadController)return;this.currentPage=t,this.totalFeedbacks=y,this.feedbacks=[...this.feedbacks,...p],this.stats.update(this.feedbacks,y),this.renderList();let C=this.scopeAnnotationsByUrl?this.feedbacks.filter(k=>k.url===a.url):this.feedbacks;this.markers.render(C);}catch(p){m&&m(),this.bus.emit("feedback:error",p instanceof Error?p:new Error(String(p)));}finally{this.isLoadingMore=false;}}renderList(){if(this.listContainer.replaceChildren(),this.feedbacks.length===0){let o$1=n("div",{class:"sp-empty"});o$1.setAttribute("role","status"),o$1.setAttribute("aria-live","polite");let a=n("div",{class:"sp-empty-text"});o(a,this.t("panel.empty")),o$1.appendChild(a),this.listContainer.appendChild(o$1);return}let e=Z(this.feedbacks,this.sortControls.sortMode),t=e.map(o=>o.id),s=this.bulk.createSelectAllBar(t,this.t("bulk.selectAll"));if(this.listContainer.appendChild(s),this.sortControls.groupByPage){let o=_(e),a=0;for(let[d,c]of o){let b=$(d,c.length,this.colors);this.listContainer.appendChild(b);let m=n("div",{class:"sp-group-content"});for(let p of c){let y=this.createCard(p,a+1);y.style.setProperty("--sp-card-i",String(a)),m.appendChild(y),a++;}this.listContainer.appendChild(m);}}else e.forEach((o,a)=>{let d=this.createCard(o,a+1);d.style.setProperty("--sp-card-i",String(a)),this.listContainer.appendChild(d);});let n$1=this.totalFeedbacks-this.feedbacks.length;if(n$1>0){let o$1=n("div",{class:"sp-load-more-wrap"}),a=document.createElement("button");a.className="sp-btn-ghost sp-btn-load-more",o(a,Q(this.t,"panel.loadMore",{remaining:n$1})),a.addEventListener("click",()=>this.loadMoreFeedbacks().catch(()=>{})),o$1.appendChild(a),this.listContainer.appendChild(o$1);}}createCard(e,t){let s=g(e.status),n$1=J(e.type,this.colors),o$1=n("div",{class:`sp-card ${s?"sp-card--resolved":""}`});o$1.setAttribute("role","listitem"),o$1.setAttribute("tabindex","0"),o$1.setAttribute("aria-label",`Feedback #${t}: ${R(e.type,this.t)} \u2014 ${e.message.slice(0,80)}`),o$1.dataset.feedbackId=e.id;let a=n("div",{class:"sp-card-bar"});a.style.background=s?"#9ca3af":n$1;let d=n("div",{class:"sp-card-body"}),c=n("div",{class:"sp-card-header"}),b=this.bulk.createCheckbox(e.id);c.appendChild(b);let m$1=n("span",{class:"sp-card-number"});o(m$1,`#${t}`);let p=n("span",{class:"sp-badge"}),y=M$1(e.type,this.colors);p.style.background=y,p.style.color=n$1,o(p,R(e.type,this.t));let C=n("span",{class:"sp-badge sp-badge--status"});C.dataset.status=e.status,C.style.background=L(e.status,this.colors),C.style.color=K(e.status,this.colors),o(C,S(e.status,this.t));let k=n("span",{class:"sp-card-date"});o(k,q(e.createdAt,this.locale)),c.appendChild(m$1),c.appendChild(p),c.appendChild(C),c.appendChild(k);let T=n("div",{class:"sp-card-message"});o(T,e.message);let f=document.createElement("button");f.className="sp-card-expand",f.dataset.action="expand",o(f,this.t("panel.showMore")),f.style.display="none",f.setAttribute("aria-expanded","false"),requestAnimationFrame(()=>{T.scrollHeight>T.clientHeight&&(f.style.display="block");});let L$1=n("div",{class:"sp-card-footer"}),i=document.createElement("button");if(i.className="sp-btn-resolve",i.dataset.action="resolve",s){i.appendChild(m(E));let v=document.createElement("span");o(v,` ${this.t("panel.reopen")}`),i.appendChild(v);}else {i.appendChild(m(w));let v=document.createElement("span");o(v,` ${this.t("panel.resolve")}`),i.appendChild(v);}let r=document.createElement("button");r.className="sp-btn-delete",r.dataset.action="delete",r.appendChild(m(F));let u=document.createElement("span");return o(u,` ${this.t("panel.delete")}`),r.appendChild(u),L$1.appendChild(i),L$1.appendChild(r),d.appendChild(c),d.appendChild(T),d.appendChild(f),d.appendChild(L$1),o$1.appendChild(a),o$1.appendChild(d),o$1}async bulkResolve(e){try{await Promise.all(e.map(t=>this.client.resolveFeedback(t,!0))),await this.loadFeedbacks();}catch(t){throw this.bus.emit("feedback:error",t instanceof Error?t:new Error(String(t))),t}}async bulkDelete(e){try{await Promise.all(e.map(t=>this.client.deleteFeedback(t)));for(let t of e)this.bus.emit("feedback:deleted",t);await this.loadFeedbacks();}catch(t){throw this.bus.emit("feedback:error",t instanceof Error?t:new Error(String(t))),t}}async confirmDeleteAll(){if(await this.showConfirmDialog(this.t("panel.deleteAllConfirmTitle"),this.t("panel.deleteAllConfirmMessage"))){this.deleteAllBtn.disabled=true;try{await this.client.deleteAllFeedbacks(this.projectName),this.bus.emit("feedback:all-deleted"),await this.loadFeedbacks();}catch(t){this.bus.emit("feedback:error",t instanceof Error?t:new Error(String(t)));}finally{this.deleteAllBtn.disabled=false;}}}showConfirmDialog(e,t){return new Promise(s=>{let n$1=n("div",{class:"sp-confirm-backdrop"}),o$1=`sp-confirm-title-${Date.now()}`,a=`sp-confirm-msg-${Date.now()}`,d=n("div",{class:"sp-confirm-dialog"});d.setAttribute("role","alertdialog"),d.setAttribute("aria-modal","true"),d.setAttribute("aria-labelledby",o$1),d.setAttribute("aria-describedby",a);let c=n("div",{class:"sp-confirm-title"});c.id=o$1,o(c,e);let b=n("div",{class:"sp-confirm-message"});b.id=a,o(b,t);let m=n("div",{class:"sp-confirm-actions"}),p=document.createElement("button");p.type="button",p.className="sp-btn-ghost",o(p,this.t("panel.cancel"));let y=document.createElement("button");y.type="button",y.className="sp-btn-danger",o(y,this.t("panel.confirmDelete"));let C=false,k=f=>{C||(C=true,n$1.removeEventListener("keydown",T),n$1.style.opacity="0",d.style.transform="translateY(8px) scale(0.97)",setTimeout(()=>{n$1.remove(),s(f);},200));},T=f=>{let L=f;if(L.key==="Escape"){k(false);return}L.key==="Tab"&&(L.preventDefault(),n$1.getRootNode().activeElement===p?y.focus():p.focus());};n$1.addEventListener("keydown",T),p.addEventListener("click",()=>k(false)),y.addEventListener("click",()=>k(true)),n$1.addEventListener("click",f=>{f.target===n$1&&k(false);}),m.appendChild(p),m.appendChild(y),d.appendChild(c),d.appendChild(b),d.appendChild(m),n$1.appendChild(d),this.root.getRootNode()instanceof ShadowRoot?this.root.getRootNode().appendChild(n$1):this.root.appendChild(n$1),requestAnimationFrame(()=>{n$1.style.opacity="1",d.style.transform="translateY(0) scale(1)",p.focus();});})}async deleteFeedback(e,t){this.pendingMutations.add(e.id);let s=p(t);try{await this.client.deleteFeedback(e.id),this.bus.emit("feedback:deleted",e.id),await this.loadFeedbacks();}catch(n){s(),this.bus.emit("feedback:error",n instanceof Error?n:new Error(String(n)));}finally{this.pendingMutations.delete(e.id);}}async toggleResolve(e,t){this.pendingMutations.add(e.id);let s=p(t);try{let n=!g(e.status);await this.client.resolveFeedback(e.id,n),await this.loadFeedbacks();}catch(n){s(),this.bus.emit("feedback:error",n instanceof Error?n:new Error(String(n)));}finally{this.pendingMutations.delete(e.id);}}buildTypeDropdown(){return this.typeOptions=[{value:"all",label:this.t("panel.filterAll"),icon:B,color:this.colors.accent,bg:this.colors.accentLight},{value:"question",label:this.t("type.question"),icon:x,color:this.colors.typeQuestion,bg:this.colors.typeQuestionBg},{value:"change",label:this.t("type.change"),icon:y,color:this.colors.typeChange,bg:this.colors.typeChangeBg},{value:"bug",label:this.t("type.bug"),icon:z,color:this.colors.typeBug,bg:this.colors.typeBugBg},{value:"other",label:this.t("type.other"),icon:A,color:this.colors.typeOther,bg:this.colors.typeOtherBg}],this.typeDropdownContainer=n("div",{class:"sp-filter-dropdown"}),this.typeDropdownBtn=document.createElement("button"),this.typeDropdownBtn.type="button",this.typeDropdownBtn.className="sp-filter-dropdown-btn",this.typeDropdownBtn.setAttribute("aria-haspopup","listbox"),this.typeDropdownBtn.setAttribute("aria-expanded","false"),this.renderTypeDropdownTrigger(),this.typeDropdownBtn.addEventListener("click",e=>{e.stopPropagation(),this.typeDropdownMenu?this.closeTypeDropdown():this.openTypeDropdown();}),this.typeDropdownContainer.appendChild(this.typeDropdownBtn),this.typeDropdownContainer}renderTypeDropdownTrigger(){let e=this.typeOptions.find(d=>this.activeFilters.has(d.value))??this.typeOptions[0];if(!e)return;this.typeDropdownBtn.replaceChildren(),this.typeDropdownBtn.style.setProperty("--sp-chip-color",e.color),this.typeDropdownBtn.style.setProperty("--sp-chip-bg",e.bg),this.typeDropdownBtn.dataset.filter=e.value,this.typeDropdownBtn.classList.toggle("sp-filter-dropdown-btn--filtered",e.value!=="all"),this.typeDropdownBtn.setAttribute("aria-label",`${this.t("type.label")}: ${e.label}`);let t=n("span",{class:"sp-filter-dropdown-btn__icon"});t.appendChild(m(e.icon)),this.typeDropdownBtn.appendChild(t);let s=n("span",{class:"sp-filter-dropdown-btn__label"}),n$1=n("span",{class:"sp-filter-dropdown-btn__prefix"});o(n$1,this.t("type.label"));let o$1=n("span",{class:"sp-filter-dropdown-btn__value"});o(o$1,e.label),s.appendChild(n$1),s.appendChild(o$1),this.typeDropdownBtn.appendChild(s);let a=n("span",{class:"sp-filter-dropdown-btn__chevron"});a.appendChild(m(D)),this.typeDropdownBtn.appendChild(a);}openTypeDropdown(){this.typeDropdownMenu=n("div",{class:"sp-filter-dropdown-menu"}),this.typeDropdownMenu.setAttribute("role","listbox"),this.typeDropdownMenu.setAttribute("aria-label",this.t("type.label")),this.typeDropdownBtn.setAttribute("aria-expanded","true");for(let e of this.typeOptions){let t=document.createElement("button");t.type="button";let s=this.activeFilters.has(e.value);t.className=`sp-filter-dropdown-option${s?" sp-filter-dropdown-option--active":""}`,t.style.setProperty("--sp-chip-color",e.color),t.style.setProperty("--sp-chip-bg",e.bg),t.dataset.filter=e.value,t.setAttribute("role","option"),t.setAttribute("aria-selected",String(s));let n$1=n("span",{class:"sp-filter-dropdown-option__icon"});n$1.appendChild(m(e.icon)),t.appendChild(n$1);let o$1=n("span",{class:"sp-filter-dropdown-option__label"});if(o(o$1,e.label),t.appendChild(o$1),s){let a=n("span",{class:"sp-filter-dropdown-option__check"});a.appendChild(m(w)),t.appendChild(a);}t.addEventListener("click",a=>{a.stopPropagation(),this.selectTypeFilter(e.value);}),this.typeDropdownMenu.appendChild(t);}this.typeDropdownContainer.appendChild(this.typeDropdownMenu),requestAnimationFrame(()=>{this.typeDropdownOutsideHandler=e=>{this.typeDropdownMenu&&!this.typeDropdownContainer.contains(e.target)&&this.closeTypeDropdown();},document.addEventListener("click",this.typeDropdownOutsideHandler,true);}),this.typeDropdownMenu.addEventListener("keydown",e=>{e.key==="Escape"&&(this.closeTypeDropdown(),this.typeDropdownBtn.focus());});}closeTypeDropdown(){this.typeDropdownMenu&&(this.typeDropdownMenu.remove(),this.typeDropdownMenu=null),this.typeDropdownBtn.setAttribute("aria-expanded","false"),this.typeDropdownOutsideHandler&&(document.removeEventListener("click",this.typeDropdownOutsideHandler,true),this.typeDropdownOutsideHandler=null);}selectTypeFilter(e){this.activeFilters.clear(),this.activeFilters.add(e),this.renderTypeDropdownTrigger(),this.closeTypeDropdown(),this.loadFeedbacks().catch(()=>{});}buildStatusSegmented(){return this.statusSegmented=new M({options:[{value:"all",label:this.t("panel.statusAll"),icon:B,color:this.colors.accent,bg:this.colors.accentLight},{value:"open",label:this.t("panel.statusOpen"),icon:C,color:this.colors.statusOpen,bg:this.colors.statusOpenBg},{value:"resolved",label:this.t("panel.statusResolved"),icon:w,color:this.colors.statusResolved,bg:this.colors.statusResolvedBg}],value:"all",onChange:()=>{this.loadFeedbacks().catch(()=>{});},ariaLabel:this.t("status.label"),datasetKey:"statusFilter",modifierPrefix:"sp-segmented__btn--"}),this.statusSegmented.element}buildScopeSegmented(){return this.scopeSegmented=new M({options:[{value:"this",label:this.t("scope.thisPage")},{value:"template",label:this.t("scope.thisType")},{value:"all",label:this.t("scope.all")}],value:this.initialScopeFilter,onChange:()=>{this.loadFeedbacks().catch(()=>{});},ariaLabel:this.t("scope.label"),datasetKey:"scopeFilter",modifierPrefix:"sp-segmented__btn--scope-",extraClass:"sp-segmented--scope"}),this.syncScopeAvailability(),this.scopeSegmented.element}syncScopeAvailability(){if(!this.scopeSegmented)return;let t=!!this.getScope().urlPattern;this.scopeSegmented.setOptionVisible("template",t),!t&&this.scopeSegmented.value==="template"&&this.scopeSegmented.select("this");}getFocusedFeedback(){let e=ea(this.listContainer);if(e<0)return;let t=this.listContainer.querySelectorAll(".sp-card")[e];if(t)return this.feedbacks.find(s=>s.id===t.dataset.feedbackId)}scrollToFeedback(e){let t=CSS.escape(e),s=this.listContainer.querySelector(`[data-feedback-id="${t}"]`);s&&(s.scrollIntoView({behavior:"smooth",block:"center"}),s.classList.add("sp-anim-flash"),s.addEventListener("animationend",()=>{s.classList.remove("sp-anim-flash");},{once:true}));}async refresh(){this.isOpen&&await this.loadFeedbacks();}get isCurrentlyOpen(){return this.isOpen}destroy(){this.loadController?.abort(),this.searchTimeout&&clearTimeout(this.searchTimeout),this.listContainer.removeEventListener("click",this.onListClick),this.listContainer.removeEventListener("keydown",this.onListKeydown),this.listContainer.removeEventListener("mouseover",this.onListMouseover),this.listContainer.removeEventListener("mouseout",this.onListMouseout),document.removeEventListener("sp-marker-click",this.onMarkerClick),this.closeTypeDropdown(),this.sortControls.destroy(),this.bulk.destroy(),this.exportBtn.destroy(),this.shortcuts.destroy(),this.detail.destroy(),this.root.remove();}};export{ue as Panel};//# sourceMappingURL=panel-S2UR5BSD.js.map
2
+ //# sourceMappingURL=panel-S2UR5BSD.js.map