helldots 0.3.0

package/dist/helldots.esm.js

@@ -0,0 +1,1019 @@
+import{domToCanvas as $e}from"modern-screenshot";var A="helldots-root",Pe=()=>{customElements.get(A)||customElements.define(A,class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}})};function re(){Pe();let r=document.querySelector(A);return r||(r=document.createElement(A),document.body.appendChild(r)),r.shadowRoot}var D=.5,He=.7,se=r=>!r||r==="transparent"||r==="rgba(0, 0, 0, 0)",ke=()=>{let r=getComputedStyle(document.documentElement).backgroundColor;if(!se(r))return r;let e=getComputedStyle(document.body).backgroundColor;return se(e)?"#ffffff":e};async function q({scale:r=1}={}){return $e(document.body,{scale:r,backgroundColor:ke()})}async function K(r){let e=document.querySelector(A),t=e?.style.display;e&&(e.style.display="none");try{return await r()}finally{e&&(e.style.display=t||"")}}function ae(r,{left:e,top:t,width:o,height:i}){let s=document.createElement("canvas");s.width=o,s.height=i;let a=s.getContext("2d");return a?(a.drawImage(r,e+window.scrollX,t+window.scrollY,o,i,0,0,o,i),s.toDataURL("image/png")):null}function Z(r,{sourceScale:e=1,outputScale:t=D,quality:o=He}={}){let i=document.createElement("canvas");i.width=Math.round(window.innerWidth*t),i.height=Math.round(window.innerHeight*t);let s=i.getContext("2d");return s?(s.drawImage(r,window.scrollX*e,window.scrollY*e,window.innerWidth*e,window.innerHeight*e,0,0,i.width,i.height),i.toDataURL("image/jpeg",o)):null}var De=[{name:"Edge",re:/Edg\/([\d.]+)/},{name:"Chrome",re:/Chrome\/([\d.]+)/},{name:"Firefox",re:/Firefox\/([\d.]+)/},{name:"Safari",re:/Version\/([\d.]+).*Safari/}],Xe=[{name:"iOS",re:/(?:iPhone|iPad).*OS ([\d_]+) like Mac OS X/},{name:"Android",re:/Android ([\d.]+)/},{name:"Windows",re:/Windows NT ([\d.]+)/},{name:"macOS",re:/Mac OS X ([\d_.]+)/},{name:"Linux",re:/Linux/}],Ue={name:"unknown",version:""},Fe=r=>/not[\W_]*a[\W_]*brand/i.test(r),le=(r,e)=>{for(let{name:t,re:o}of r){let i=e.match(o);if(i)return{name:t,version:(i[1]||"").replace(/_/g,".")}}return{...Ue}};function ce(r=window){let e=r.navigator||{},t=e.userAgent||"",o=e.userAgentData,i=le(De,t),s=o?.brands?.find(l=>!Fe(l.brand));s&&(i={name:s.brand,version:s.version||""});let a=le(Xe,t);return o?.platform&&(a.name=o.platform),{version:1,url:r.location?.href||"",viewport:{width:r.innerWidth,height:r.innerHeight},screen:{width:r.screen?.width??0,height:r.screen?.height??0},devicePixelRatio:r.devicePixelRatio??1,userAgent:t,browser:i,os:a,language:e.language||""}}var n={CIRCLE:"comment-circle",CIRCLE_WRAPPER:"comment-circle-wrapper",TOOLTIP:"comment-tooltip",TOOLBAR_TEXT:"toolbar-text",SHORTCUT_HINT:"shortcut-hint",COMMENT_INPUT_AREA:"comment-input-area",CLOSE_TOOLTIP:"close-tooltip",ACTIVE:"active",COMMENT_CURSOR:"comment-cursor",COMMENT_OVERLAY:"comment-overlay",THREAD_POPOVER:"comment-thread-popover",THREAD_HEADER:"thread-header",THREAD_BODY:"thread-body",THREAD_REPLIES:"thread-replies",THREAD_REPLY:"thread-reply",THREAD_INPUT_AREA:"thread-input-area",THREAD_INPUT:"thread-input",THREAD_SUBMIT:"thread-submit",THREAD_META:"thread-meta",THREAD_AUTHOR:"thread-author",THREAD_TIME:"thread-time",PREVIEW_CIRCLE:"preview-circle",SELECTION_RECT:"selection-rect",SCREENSHOT_IMG:"screenshot-img",SCREENSHOT_REMOVE:"screenshot-remove",SCREENSHOTS_CONTAINER:"screenshots-container",SCREENSHOT_ITEM:"screenshot-item",LIGHTBOX:"helldots-lightbox",LIGHTBOX_IMG:"helldots-lightbox-img",LIGHTBOX_CLOSE:"helldots-lightbox-close",COMMENT_ACTIONS_BAR:"comment-actions-bar",ATTACH_IMAGE_BTN:"attach-image-btn",TOOLBAR_ACTIONS:"toolbar-actions",TOOLBAR_ACTION_BTN:"toolbar-action-btn",TOOLBAR_ACTION_WRAPPER:"toolbar-action-wrapper",TOOLBAR_ACTION_TOOLTIP:"toolbar-action-tooltip",TOOLBAR_COMMENT_BTN:"toolbar-comment-btn",TOOLBAR_MENU_BTN:"toolbar-menu-btn",INBOX_PANEL:"inbox-panel",INBOX_HEADER:"inbox-header",INBOX_FILTER:"inbox-filter",INBOX_FILTER_MENU:"inbox-filter-menu",INBOX_FILTER_OPTION:"inbox-filter-option",INBOX_FILTER_SECTION:"inbox-filter-section",INBOX_CLOSE:"inbox-close",INBOX_LIST:"inbox-list",INBOX_CARD:"inbox-card",INBOX_CARD_HEADER:"inbox-card-header",INBOX_CARD_ACTIONS:"inbox-card-actions",INBOX_CARD_TEXT:"inbox-card-text",INBOX_CARD_TAG:"inbox-card-tag",INBOX_CARD_REPLY_LINK:"inbox-card-reply-link",INBOX_ACTION_BTN:"inbox-action-btn",INBOX_ACTION_BTN_LABELED:"inbox-action-btn--labeled",INBOX_ACTION_LABEL:"inbox-action-label",INBOX_STATUS_DOT:"inbox-status-dot",INBOX_MENU:"inbox-menu",INBOX_MENU_ITEM:"inbox-menu-item",INBOX_DETAIL:"inbox-detail",INBOX_DETAIL_HEADER:"inbox-detail-header",INBOX_BACK:"inbox-back",INBOX_NAV_BTN:"inbox-nav-btn",INBOX_REPLIES:"inbox-replies",INBOX_EMPTY:"inbox-empty",CLASSIFY_ROW:"classify-row",TAGS_INPUT:"tags-input",TAG_CHIP:"tag-chip",TAG_CHIP_REMOVE:"tag-chip-remove",INBOX_BADGES:"inbox-badges",BADGE:"helldots-badge",BADGE_TYPE:"helldots-badge--type",BADGE_PRIORITY:"helldots-badge--priority",BADGE_TAG:"helldots-badge--tag",BADGE_DURATION:"helldots-badge--duration",CONTEXT_BLOCK:"inbox-context",CONTEXT_ROW:"inbox-context-row",CONTEXT_SCREENSHOT_CAPTION:"inbox-context-screenshot-caption",HIGHLIGHT:"helldots-highlight"},T={TOOLBAR:"comment-toolbar",COMMENT_BOX:"comment-box",COMMENT_INPUT:"comment-input",SUBMIT_COMMENT:"submit-comment",STYLES:"comment-overlay-styles",GLOBAL_STYLES:"comment-overlay-global-styles",ATTACH_IMAGE_INPUT:"attach-image-input"},M=["open","in_progress","resolved"],de={open:"#2E90FA",in_progress:"#FF9F0A",resolved:"#30D158"},y=["bug","suggestion","question","improvement"],w={bug:"#FF453A",suggestion:"#BF5AF2",question:"#64D2FF",improvement:"#5E5CE6"},S=["high","medium","low"],L={high:"#FF453A",medium:"#FF9F0A",low:"#8E8E93"},he={CONTAINER:'section, div[class*="container"], div[class*="content"]'},x={CIRCLE:9997,TOOLTIP:1e4,TOOLBAR:9998,COMMENT_BOX:9999,LIGHTBOX:10001},pe='data:image/svg+xml;utf8,<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><g filter="url(%23filter0_d_4_97)"><path d="M6 8C6 6.89543 6.89543 6 8 6H20C27.732 6 34 12.268 34 20V20C34 27.732 27.732 34 20 34V34C12.268 34 6 27.732 6 20V8Z" fill="%232E90FA"/><path d="M8 7H20C27.1797 7 33 12.8203 33 20C33 27.1797 27.1797 33 20 33C12.8203 33 7 27.1797 7 20V8C7 7.44772 7.44772 7 8 7Z" stroke="white" stroke-width="2"/></g><filter id="filter0_d_4_97" x="0" y="0" width="48" height="48" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dx="4" dy="4"/><feGaussianBlur stdDeviation="5"/><feComposite in2="hardAlpha" operator="out"/><feColorMatrix type="matrix" values="0 0 0 0 0.180392 0 0 0 0 0.564706 0 0 0 0 0.980392 0 0 0 0.16 0"/><feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4_97"/><feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4_97" result="shape"/></filter></svg>';var ue=()=>`
+
+    :host {
+        all: initial;
+        display: block;
+        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+        line-height: 1.5;
+        color-scheme: light;
+    }
+
+    :host *,
+    :host *::before,
+    :host *::after {
+        box-sizing: border-box;
+        font-family: inherit;
+    }
+
+    button {
+        padding: 0;
+        font: inherit;
+        color: inherit;
+    }
+
+    #${T.TOOLBAR} {
+        position: fixed;
+        bottom: 20px;
+        left: 50%;
+        transform: translateX(-50%);
+        z-index: ${x.TOOLBAR};
+    }
+
+    .${n.TOOLBAR_ACTION_WRAPPER} {
+        position: relative;
+    }
+
+    .${n.TOOLBAR_ACTION_TOOLTIP} {
+        position: absolute;
+        bottom: calc(100% + 10px);
+        left: 50%;
+        transform: translateX(-50%) translateY(4px);
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        background: rgba(20, 20, 23, 0.95);
+        backdrop-filter: blur(16px);
+        -webkit-backdrop-filter: blur(16px);
+        padding: 8px 12px;
+        border-radius: 10px;
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        box-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
+        color: white;
+        white-space: nowrap;
+        opacity: 0;
+        pointer-events: none;
+        transition: opacity 0.15s ease, transform 0.15s ease;
+    }
+
+    .${n.TOOLBAR_ACTION_WRAPPER}:hover .${n.TOOLBAR_ACTION_TOOLTIP} {
+        opacity: 1;
+        pointer-events: auto;
+        transform: translateX(-50%) translateY(0);
+    }
+
+    .${n.TOOLBAR_TEXT} {
+        font-size: 13px;
+        font-weight: 500;
+        letter-spacing: -0.01em;
+    }
+
+    .${n.SHORTCUT_HINT} {
+        font-size: 11px;
+        font-weight: 500;
+        color: rgba(255, 255, 255, 0.5);
+        background: rgba(255, 255, 255, 0.06);
+        border: 1px solid rgba(255, 255, 255, 0.1);
+        padding: 2px 6px;
+        border-radius: 5px;
+        line-height: 1;
+        white-space: nowrap;
+    }
+
+    .${n.TOOLBAR_ACTIONS} {
+        display: flex;
+        flex-direction: row;
+        background: rgba(20, 20, 23, 0.95);
+        backdrop-filter: blur(16px);
+        -webkit-backdrop-filter: blur(16px);
+        border-radius: 12px;
+        box-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
+    }
+
+    .${n.TOOLBAR_ACTION_BTN} {
+        width: 42px;
+        height: 42px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: none;
+        border: none;
+        outline: none;
+        color: rgba(255, 255, 255, 0.65);
+        cursor: pointer;
+        transition: background 0.2s, color 0.2s;
+        padding: 0;
+    }
+
+    .${n.TOOLBAR_ACTION_WRAPPER}:first-child .${n.TOOLBAR_ACTION_BTN} {
+        border-radius: 12px 0 0 12px;
+    }
+
+    .${n.TOOLBAR_ACTION_WRAPPER}:last-child .${n.TOOLBAR_ACTION_BTN} {
+        border-radius: 0 12px 12px 0;
+    }
+
+    .${n.TOOLBAR_ACTION_BTN}:hover {
+        background: rgba(255, 255, 255, 0.08);
+        color: white;
+    }
+
+    .${n.TOOLBAR_COMMENT_BTN}.${n.ACTIVE} {
+        color: #2E90FA;
+        background: rgba(46, 144, 250, 0.1);
+    }
+
+    
+    #${T.COMMENT_BOX} {
+        position: fixed;
+        background: #1C1C1E;
+        border-radius: 12px;
+        box-shadow: 0 4px 20px rgba(0,0,0,0.4);
+        padding: 16px;
+        z-index: ${x.COMMENT_BOX};
+        width: 400px;
+        display: none;
+        box-sizing: border-box;
+    }
+    
+    #${T.COMMENT_BOX} .${n.COMMENT_INPUT_AREA} {
+        display: flex;
+        flex-direction: column;
+        gap: 0;
+    }
+
+    .${n.CLASSIFY_ROW} {
+        display: flex;
+        align-items: center;
+        flex-wrap: wrap;
+        gap: 6px;
+        padding: 8px 10px 0;
+    }
+    .${n.TAGS_INPUT} {
+        flex: 1 1 90px;
+        min-width: 90px;
+        background: transparent;
+        border: none;
+        outline: none;
+        color: inherit;
+        font-size: 12px;
+        padding: 2px 0;
+    }
+    .${n.TAG_CHIP} {
+        display: inline-flex;
+        align-items: center;
+        gap: 4px;
+        padding: 2px 6px;
+        border-radius: 10px;
+        background: rgba(255, 255, 255, 0.1);
+        font-size: 11px;
+        line-height: 1.4;
+    }
+    .${n.TAG_CHIP_REMOVE} {
+        background: none;
+        border: none;
+        color: inherit;
+        cursor: pointer;
+        padding: 0;
+        font-size: 13px;
+        line-height: 1;
+        opacity: 0.6;
+    }
+    .${n.TAG_CHIP_REMOVE}:hover {
+        opacity: 1;
+    }
+
+    #${T.COMMENT_INPUT} {
+        flex: 1;
+        min-height: 20px;
+        background: #1C1C1E;
+        border: none;
+        resize: none;
+        font-family: inherit;
+        color: white;
+        font-size: 14px;
+        line-height: 1.4;
+        box-sizing: border-box;
+        field-sizing: content;
+        padding-top: 4px;
+        padding-bottom: 8px;
+    }
+
+    #${T.COMMENT_INPUT}::placeholder {
+        color: rgba(255, 255, 255, 0.5);
+    }
+    
+    #${T.COMMENT_INPUT}:focus {
+        outline: none;
+        box-shadow: none;
+    }
+
+    .${n.COMMENT_ACTIONS_BAR} {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        padding-top: 12px;
+    }
+
+    .${n.ATTACH_IMAGE_BTN} {
+        background: none;
+        border: none;
+        color: rgba(255, 255, 255, 0.5);
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        border-radius: 6px;
+        transition: background 0.2s, color 0.2s;
+    }
+
+    .${n.ATTACH_IMAGE_BTN}:hover {
+        background: rgba(255, 255, 255, 0.1);
+        color: rgba(255, 255, 255, 0.8);
+    }
+
+    .${n.CIRCLE} {
+        position: absolute;
+        width: 28px;
+        height: 28px;
+        background: #2E90FA;
+        border-radius: 0% 100% 100% 100%;
+        border: 2px solid #FFF;
+        cursor: pointer;
+        box-shadow: 0 1px 5px rgba(0,0,0,0.2);
+        transition: transform 0.2s, background 0.2s;
+        z-index: ${x.CIRCLE};
+        transform: translate(-50%, -50%);
+    }
+
+    .${n.CIRCLE}:hover {
+        transform: translate(-50%, -50%) scale(1.2) !important;
+        background: rgb(0, 123, 255);
+    }
+
+    .${n.CIRCLE}.${n.HIGHLIGHT} {
+        transform: translate(-50%, -50%) scale(1.2) !important;
+        background: rgb(0, 123, 255);
+        box-shadow: 0 0 0 4px rgba(46, 144, 250, 0.35), 0 1px 5px rgba(0,0,0,0.2);
+    }
+
+    .${n.CIRCLE_WRAPPER} {
+        position: absolute;
+        left: 0;
+        top: 0;
+        width: 100%;
+        height: 100%;
+        pointer-events: none;
+        z-index: ${x.CIRCLE};
+    }
+
+    .${n.TOOLTIP} {
+        position: fixed;
+        background: #1C1C1E;
+        border-radius: 12px;
+        padding: 16px;
+        box-shadow: 0 4px 20px rgba(0,0,0,0.4);
+        width: 400px;
+        z-index: ${x.TOOLTIP};
+        color: white;
+        font-size: 14px;
+        line-height: 1.5;
+        box-sizing: border-box;
+    }
+
+    .${n.TOOLTIP} .${n.THREAD_HEADER} {
+        padding: 0 0 0;
+    }
+
+    .${n.TOOLTIP} .${n.THREAD_BODY} {
+        padding: 8px 0;
+    }
+
+    .${n.THREAD_POPOVER} {
+        position: fixed;
+        background: #1C1C1E;
+        border-radius: 12px;
+        padding: 16px;
+        box-shadow: 0 4px 20px rgba(0,0,0,0.4);
+        width: 400px;
+        z-index: ${x.TOOLTIP};
+        color: white;
+        font-size: 14px;
+        line-height: 1.5;
+        box-sizing: border-box;
+    }
+
+    .${n.INBOX_PANEL} {
+        position: fixed;
+        top: 16px;
+        right: 16px;
+        bottom: 16px;
+        width: 380px;
+        display: flex;
+        flex-direction: column;
+        background: #1C1C1E;
+        border: 1px solid rgba(255,255,255,0.08);
+        border-radius: 14px;
+        box-shadow: 0 8px 32px rgba(0,0,0,0.5);
+        z-index: ${x.COMMENT_BOX};
+        color: white;
+        font-size: 14px;
+        line-height: 1.5;
+        box-sizing: border-box;
+        overflow: hidden;
+    }
+
+    @media (max-width: 420px) {
+        .${n.INBOX_PANEL} {
+            left: 16px;
+            width: auto;
+        }
+    }
+
+    .${n.INBOX_HEADER},
+    .${n.INBOX_DETAIL_HEADER} {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 8px;
+        padding: 12px 14px;
+        border-bottom: 1px solid rgba(255,255,255,0.08);
+        flex: none;
+    }
+
+    .${n.INBOX_FILTER}-wrapper {
+        position: relative;
+    }
+
+    .${n.INBOX_FILTER} {
+        display: flex;
+        align-items: center;
+        gap: 6px;
+        background: transparent;
+        border: none;
+        color: white;
+        font-size: 13px;
+        font-weight: 600;
+        cursor: pointer;
+        padding: 4px 6px;
+        border-radius: 6px;
+    }
+
+    .${n.INBOX_FILTER}:hover {
+        background: rgba(255,255,255,0.08);
+    }
+
+    .${n.INBOX_FILTER_MENU} {
+        position: absolute;
+        top: calc(100% + 4px);
+        left: 0;
+        background: #2C2C2E;
+        border: 1px solid rgba(255,255,255,0.1);
+        border-radius: 8px;
+        padding: 4px;
+        min-width: 190px;
+        z-index: 1;
+        box-shadow: 0 4px 16px rgba(0,0,0,0.4);
+    }
+
+    .${n.INBOX_FILTER_SECTION} {
+        padding: 8px 10px 4px;
+        font-size: 11px;
+        font-weight: 600;
+        color: rgba(255,255,255,0.45);
+        text-transform: none;
+    }
+
+    .${n.INBOX_FILTER_SECTION}:not(:first-child) {
+        margin-top: 4px;
+        border-top: 1px solid rgba(255,255,255,0.1);
+        padding-top: 10px;
+    }
+
+    .${n.INBOX_FILTER_OPTION} {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        gap: 12px;
+    }
+
+    .${n.INBOX_FILTER_OPTION},
+    .${n.INBOX_MENU_ITEM} {
+        display: block;
+        width: 100%;
+        text-align: left;
+        background: transparent;
+        border: none;
+        color: white;
+        font-size: 13px;
+        padding: 7px 10px;
+        border-radius: 6px;
+        cursor: pointer;
+    }
+
+    .${n.INBOX_FILTER_OPTION}:hover,
+    .${n.INBOX_MENU_ITEM}:hover {
+        background: rgba(255,255,255,0.08);
+    }
+
+    .${n.INBOX_CLOSE},
+    .${n.INBOX_NAV_BTN},
+    .${n.INBOX_BACK} {
+        display: flex;
+        align-items: center;
+        gap: 4px;
+        background: transparent;
+        border: none;
+        color: rgba(255,255,255,0.75);
+        cursor: pointer;
+        padding: 4px 6px;
+        border-radius: 6px;
+        font-size: 14px;
+    }
+
+    .${n.INBOX_CLOSE} {
+        font-size: 20px;
+        line-height: 1;
+    }
+
+    .${n.INBOX_CLOSE}:hover,
+    .${n.INBOX_NAV_BTN}:not(:disabled):hover,
+    .${n.INBOX_BACK}:hover {
+        background: rgba(255,255,255,0.08);
+        color: white;
+    }
+
+    .${n.INBOX_NAV_BTN}:disabled {
+        opacity: 0.35;
+        cursor: default;
+    }
+
+    .${n.INBOX_LIST},
+    .${n.INBOX_DETAIL} {
+        flex: 1;
+        overflow-y: auto;
+        padding: 12px;
+        display: flex;
+        flex-direction: column;
+        gap: 12px;
+    }
+
+    .${n.INBOX_CARD} {
+        border: 1px solid rgba(255,255,255,0.1);
+        border-radius: 10px;
+        padding: 12px;
+        display: flex;
+        flex-direction: column;
+        gap: 8px;
+    }
+
+    .${n.INBOX_LIST} .${n.INBOX_CARD} {
+        cursor: pointer;
+    }
+
+    .${n.INBOX_LIST} .${n.INBOX_CARD}:hover {
+        border-color: rgba(255,255,255,0.22);
+    }
+
+    .${n.INBOX_CARD}--resolved {
+        border-color: rgba(48, 209, 88, 0.4);
+        opacity: 0.75;
+    }
+
+    .${n.INBOX_LIST} .${n.INBOX_CARD}--resolved:hover {
+        border-color: rgba(48, 209, 88, 0.7);
+        opacity: 1;
+    }
+
+    .${n.INBOX_CARD_HEADER} {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 8px;
+    }
+
+    .${n.INBOX_CARD_ACTIONS} {
+        display: flex;
+        align-items: center;
+        gap: 6px;
+    }
+
+    .${n.INBOX_ACTION_BTN} {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 24px;
+        height: 24px;
+        background: transparent;
+        border: none;
+        border-radius: 6px;
+        color: rgba(255,255,255,0.65);
+        cursor: pointer;
+    }
+
+    .${n.INBOX_ACTION_BTN}:hover {
+        background: rgba(255,255,255,0.08);
+        color: white;
+    }
+
+    /* Type/priority pickers show their current value as text next to the
+       dot (colour alone can't tell bug/high apart \u2014 same hex, and there's
+       no hover on touch). Grow from the square icon-button width but stay
+       bounded so the strip doesn't crowd out copy/status/\u22EF next to it. */
+    .${n.INBOX_ACTION_BTN_LABELED} {
+        width: auto;
+        max-width: 72px;
+        padding: 0 8px 0 6px;
+        gap: 5px;
+        justify-content: flex-start;
+    }
+
+    .${n.INBOX_ACTION_LABEL} {
+        font-size: 11px;
+        line-height: 1;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+
+    .${n.INBOX_STATUS_DOT} {
+        width: 12px;
+        height: 12px;
+        border-radius: 50%;
+        border: 1.5px solid rgba(255,255,255,0.45);
+        display: inline-block;
+        flex: none;
+    }
+
+    .${n.INBOX_MENU_ITEM} .${n.INBOX_STATUS_DOT} {
+        width: 9px;
+        height: 9px;
+        border: none;
+        margin-right: 8px;
+        vertical-align: baseline;
+    }
+
+    .${n.INBOX_MENU_ITEM}[aria-checked="true"] {
+        background: rgba(255,255,255,0.08);
+    }
+
+    .${n.THREAD_HEADER} .${n.INBOX_CARD_ACTIONS} {
+        margin-left: auto;
+        margin-right: 8px;
+    }
+
+    /* Generic hover tooltip, same look as .thread-time[data-full-date] */
+    [data-hd-tooltip] {
+        position: relative;
+    }
+
+    [data-hd-tooltip]::after {
+        content: attr(data-hd-tooltip);
+        position: absolute;
+        bottom: calc(100% + 6px);
+        left: 50%;
+        transform: translateX(-50%);
+        background: #000;
+        color: white;
+        padding: 4px 8px;
+        border-radius: 6px;
+        font-size: 11px;
+        white-space: nowrap;
+        opacity: 0;
+        pointer-events: none;
+        transition: opacity 0.12s ease;
+        z-index: 2;
+    }
+
+    [data-hd-tooltip]:hover::after {
+        opacity: 1;
+    }
+
+    .${n.INBOX_MENU} {
+        position: absolute;
+        top: calc(100% + 4px);
+        right: 0;
+        background: #2C2C2E;
+        border: 1px solid rgba(255,255,255,0.1);
+        border-radius: 8px;
+        padding: 4px;
+        min-width: 130px;
+        z-index: 1;
+        box-shadow: 0 4px 16px rgba(0,0,0,0.4);
+    }
+
+    .${n.INBOX_CARD_TEXT} {
+        white-space: pre-wrap;
+        word-break: break-word;
+    }
+
+    .${n.INBOX_CARD_TAG} {
+        align-self: flex-start;
+        padding: 1px 8px;
+        border-radius: 999px;
+        background: rgba(255, 159, 10, 0.2);
+        color: #FF9F0A;
+        font-size: 11px;
+        font-weight: 600;
+    }
+
+    .${n.INBOX_BADGES} {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 4px;
+    }
+    /* Vertical separation from the card text above only applies to the
+       badge row on inbox cards -- inside the comment-box classify row,
+       .inbox-badges is one flex item among the type/priority pickers and
+       the tags input, and the classify row's own gap already spaces it
+       from its siblings, so an extra margin here would nudge it out of
+       alignment with them. */
+    .${n.INBOX_CARD} .${n.INBOX_BADGES} {
+        margin-top: 6px;
+    }
+    .${n.BADGE} {
+        display: inline-flex;
+        align-items: center;
+        padding: 1px 6px;
+        border: 1px solid rgba(255, 255, 255, 0.18);
+        border-radius: 10px;
+        font-size: 10px;
+        line-height: 1.6;
+        letter-spacing: 0.01em;
+        white-space: nowrap;
+    }
+    .${n.BADGE_TYPE},
+    .${n.BADGE_PRIORITY} {
+        font-weight: 600;
+    }
+    .${n.BADGE_TAG} {
+        opacity: 0.75;
+    }
+    .${n.BADGE_DURATION} {
+        opacity: 0.75;
+        border-style: dashed;
+    }
+
+    .${n.CONTEXT_BLOCK} {
+        display: flex;
+        flex-direction: column;
+        gap: 4px;
+        padding: 10px 12px;
+        border-top: 1px solid rgba(255, 255, 255, 0.08);
+        font-size: 11px;
+    }
+    .${n.CONTEXT_BLOCK} img {
+        width: 100%;
+        border-radius: 6px;
+        margin-bottom: 6px;
+        cursor: zoom-in;
+    }
+    .${n.CONTEXT_SCREENSHOT_CAPTION} {
+        opacity: 0.75;
+    }
+    .${n.CONTEXT_ROW} {
+        display: flex;
+        justify-content: space-between;
+        gap: 12px;
+        opacity: 0.75;
+    }
+    /* URLs and user agents have no spaces to break on, so the value column
+       would otherwise push the row wider than the panel. */
+    .${n.CONTEXT_ROW} span:last-child {
+        text-align: right;
+        word-break: break-all;
+    }
+
+    .${n.INBOX_CARD_REPLY_LINK} {
+        align-self: flex-start;
+        background: transparent;
+        border: none;
+        color: rgba(255,255,255,0.55);
+        font-size: 13px;
+        cursor: pointer;
+        padding: 0;
+    }
+
+    .${n.INBOX_CARD_REPLY_LINK}:hover {
+        color: white;
+    }
+
+    .${n.INBOX_REPLIES} {
+        display: flex;
+        flex-direction: column;
+        gap: 10px;
+        padding: 0 4px;
+    }
+
+    .${n.INBOX_EMPTY} {
+        padding: 24px 12px;
+        color: rgba(255,255,255,0.55);
+        text-align: center;
+    }
+
+    .${n.THREAD_HEADER} {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: 0 0 0;
+    }
+
+    .${n.THREAD_META} {
+        display: flex;
+        align-items: center;
+        gap: 6px;
+    }
+
+    .${n.THREAD_AUTHOR} {
+        font-weight: 600;
+        font-size: 13px;
+    }
+
+    .${n.THREAD_TIME} {
+        font-size: 12px;
+        color: rgba(255,255,255,0.5);
+        cursor: default;
+        position: relative;
+    }
+
+    .${n.THREAD_TIME}::after {
+        content: attr(data-full-date);
+        position: absolute;
+        bottom: calc(100% + 6px);
+        left: 50%;
+        transform: translateX(-50%);
+        background: #000;
+        color: white;
+        padding: 4px 8px;
+        border-radius: 6px;
+        font-size: 11px;
+        white-space: nowrap;
+        opacity: 0;
+        pointer-events: none;
+        transition: opacity 0.15s ease;
+        z-index: 1;
+    }
+
+    .${n.THREAD_TIME}:hover::after {
+        opacity: 1;
+    }
+
+    .${n.THREAD_BODY} {
+        padding: 8px 0;
+        white-space: pre-wrap;
+        word-break: break-word;
+    }
+
+    .${n.THREAD_REPLIES} {
+        padding: 0;
+    }
+
+    .${n.THREAD_REPLIES}:empty {
+        display: none;
+    }
+
+    .${n.THREAD_REPLY} {
+        padding: 16px 0 0 0;
+        border-top: 1px solid rgba(255,255,255,0.1);
+        white-space: pre-wrap;
+        word-break: break-word;
+        font-size: 13px;
+        color: rgba(255,255,255,0.85);
+    }
+
+    .${n.THREAD_REPLY} .${n.THREAD_META} {
+        margin-bottom: 2px;
+    }
+
+    .${n.THREAD_REPLY} .${n.SCREENSHOT_IMG} {
+        width: 144px;
+        height: 100px;
+        object-fit: cover;
+        border-radius: 8px;
+        margin-top: 4px;
+        cursor: pointer;
+        display: block;
+    }
+
+    .${n.THREAD_INPUT_AREA} {
+        display: flex;
+        flex-direction: column;
+        gap: 0;
+        padding: 12px 0 0;
+        border-top: 1px solid rgba(255,255,255,0.1);
+    }
+
+    .${n.THREAD_INPUT} {
+        width: 100%;
+        background: transparent;
+        border: none;
+        padding: 0;
+        color: white;
+        font-size: 14px;
+        font-family: inherit;
+        outline: none;
+        box-sizing: border-box;
+    }
+
+    .${n.THREAD_INPUT}::placeholder {
+        color: rgba(255,255,255,0.5);
+    }
+
+    .${n.THREAD_INPUT}:focus {
+        outline: none;
+        box-shadow: none;
+    }
+
+    .${n.THREAD_SUBMIT} {
+        background: none;
+        border: none;
+        color: #2E90FA;
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        border-radius: 6px;
+        transition: background 0.2s;
+    }
+
+    .${n.THREAD_SUBMIT}:hover {
+        background: rgba(46, 144, 250, 0.15);
+        color: #1570D6;
+    }
+
+    .${n.CLOSE_TOOLTIP} {
+        background: none;
+        border: none;
+        font-size: 18px;
+        cursor: pointer;
+        color: rgba(255,255,255,0.5);
+        line-height: 1;
+    }
+    
+    .${n.CLOSE_TOOLTIP}:hover {
+        color: white;
+    }
+
+    .${n.PREVIEW_CIRCLE} {
+        animation: helldots-pulse 1.5s ease-in-out infinite;
+    }
+
+    @keyframes helldots-pulse {
+        0%, 100% { box-shadow: 0 0 0 0 rgba(46, 144, 250, 0.4), 0 1px 5px rgba(0,0,0,0.2); }
+        50% { box-shadow: 0 0 0 8px rgba(46, 144, 250, 0), 0 1px 5px rgba(0,0,0,0.2); }
+    }
+
+    .${n.COMMENT_OVERLAY} {
+        position: fixed;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        background: transparent;
+        pointer-events: none;
+        z-index: ${x.TOOLBAR-1};
+    }
+
+    .${n.COMMENT_OVERLAY}.${n.ACTIVE} {
+        pointer-events: auto;
+        background: rgba(0, 0, 0, 0.1);
+    }
+
+    .${n.SELECTION_RECT} {
+        position: fixed;
+        border: 2px solid #2E90FA;
+        background: rgba(46, 144, 250, 0.1);
+        pointer-events: none;
+        z-index: ${x.TOOLTIP};
+        box-sizing: border-box;
+    }
+
+    .${n.SCREENSHOTS_CONTAINER} {
+        display: none;
+        overflow-x: auto;
+        gap: 8px;
+        margin-top: 4px;
+        padding: 4px 0;
+        scrollbar-width: none;
+        -ms-overflow-style: none;
+        margin-bottom: 16px;
+    }
+
+    .${n.SCREENSHOTS_CONTAINER}::-webkit-scrollbar {
+        display: none;
+    }
+
+    .${n.SCREENSHOTS_CONTAINER}.${n.ACTIVE} {
+        display: flex;
+    }
+
+    .${n.SCREENSHOT_ITEM} {
+        position: relative;
+        flex-shrink: 0;
+    }
+
+    .${n.SCREENSHOT_ITEM} .${n.SCREENSHOT_IMG} {
+        width: 50px;
+        height: 50px;
+        object-fit: cover;
+        border-radius: 8px;
+        cursor: pointer;
+        display: block;
+        margin: 0;
+    }
+
+    .${n.SCREENSHOT_ITEM} .${n.SCREENSHOT_IMG}:hover {
+        opacity: 0.85;
+    }
+
+    .${n.SCREENSHOT_ITEM} .${n.SCREENSHOT_REMOVE} {
+        position: absolute;
+        top: -5px;
+        right: -5px;
+        width: 18px;
+        height: 18px;
+        background: rgba(0,0,0,0.7);
+        border: none;
+        border-radius: 50%;
+        color: white;
+        font-size: 12px;
+        line-height: 1;
+        cursor: pointer;
+        display: none;
+        align-items: center;
+        justify-content: center;
+        z-index: 1;
+    }
+
+    .${n.SCREENSHOT_ITEM}:hover .${n.SCREENSHOT_REMOVE} {
+        display: flex;
+    }
+
+    .${n.SCREENSHOT_ITEM} .${n.SCREENSHOT_REMOVE}:hover {
+        background: rgba(0,0,0,0.9);
+    }
+
+    .${n.TOOLTIP} > .${n.SCREENSHOTS_CONTAINER} .${n.SCREENSHOT_ITEM} .${n.SCREENSHOT_IMG},
+    .${n.THREAD_POPOVER} > .${n.SCREENSHOTS_CONTAINER} .${n.SCREENSHOT_ITEM} .${n.SCREENSHOT_IMG},
+    .${n.THREAD_REPLY} .${n.SCREENSHOT_ITEM} .${n.SCREENSHOT_IMG} {
+        width: 144px;
+        height: 100px;
+    }
+
+    .${n.LIGHTBOX} {
+        position: fixed;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        background: rgba(0,0,0,0.92);
+        z-index: ${x.LIGHTBOX};
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        animation: helldots-fade-in 0.2s ease;
+    }
+
+    @keyframes helldots-fade-in {
+        from { opacity: 0; }
+        to { opacity: 1; }
+    }
+
+    .${n.LIGHTBOX_IMG} {
+        max-width: 90vw;
+        max-height: 90vh;
+        object-fit: contain;
+        border-radius: 8px;
+    }
+
+    .${n.LIGHTBOX_CLOSE} {
+        position: absolute;
+        top: 16px;
+        right: 16px;
+        background: rgba(255,255,255,0.15);
+        border: none;
+        color: white;
+        font-size: 24px;
+        width: 40px;
+        height: 40px;
+        border-radius: 50%;
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        transition: background 0.2s;
+    }
+
+    .${n.LIGHTBOX_CLOSE}:hover {
+        background: rgba(255,255,255,0.3);
+    }
+`,me=()=>`
+    .${n.COMMENT_CURSOR},
+    .${n.COMMENT_CURSOR} * {
+        cursor: url('${pe}') 6 6, auto !important;
+    }
+`;var v={commentAriaLabelPrefix:"Comment: ",anonymous:"Anonymous",justNow:"Just now",minutesAgoTemplate:"{n}m",hoursAgoTemplate:"{n}h",daysAgoTemplate:"{n}d",toolbarComment:"Comment",toolbarInbox:"Inbox",modifierAlt:"Alt",modifierCtrl:"Ctrl",commentBoxAriaLabel:"New comment",commentPlaceholder:"Type your comment...",attachImage:"Attach image",send:"Send",tooltipAriaLabel:"Comment preview",close:"Close",popoverAriaLabel:"Comment thread",replyPlaceholder:"Reply...",attachedScreenshot:"Attached screenshot",screenshotPreview:"Screenshot preview",removeScreenshot:"Remove screenshot",inboxAriaLabel:"Comments inbox",inboxEmpty:"No comments yet",orphanedBadge:"Unanchored",hiddenBadge:"Hidden",filterAll:"All comments",filterCurrentPage:"Current page",filterByPage:"Filter by Page",filterByStatus:"Filter by Status",filterStatusAll:"All",filterUnresolved:"Unresolved",filterResolved:"Resolved",back:"Back",deleteComment:"Delete",copyAgentContext:"Copy agent context",copied:"Copied",statusLabel:"Status",prevComment:"Previous comment",nextComment:"Next comment",replyLink:"Reply",commentOptions:"Comment options",moreOptions:"More",statusOpen:"Open",statusInProgress:"In progress",statusResolved:"Resolved",durationLessThanMinute:"<1m",resolvedInTemplate:"Resolved in {n}",typeLabel:"Type",priorityLabel:"Priority",unset:"Unset",typeBug:"Bug",typeSuggestion:"Suggestion",typeQuestion:"Question",typeImprovement:"Improvement",priorityHigh:"High",priorityMedium:"Medium",priorityLow:"Low",tagsPlaceholder:"Add tags...",removeTag:"Remove tag",filterByType:"Filter by Type",filterByPriority:"Filter by Priority",contextSection:"Context",autoScreenshotLabel:"Automatic context",contextUrl:"URL",contextViewport:"Viewport",contextScreen:"Screen",contextBrowser:"Browser",contextOs:"OS"};var ge={commentAriaLabelPrefix:"Comentario: ",anonymous:"An\xF3nimo",justNow:"Justo ahora",minutesAgoTemplate:"{n}m",hoursAgoTemplate:"{n}h",daysAgoTemplate:"{n}d",toolbarComment:"Comentar",toolbarInbox:"Bandeja",modifierAlt:"Alt",modifierCtrl:"Ctrl",commentBoxAriaLabel:"Nuevo comentario",commentPlaceholder:"Escribe tu comentario...",attachImage:"Adjuntar imagen",send:"Enviar",tooltipAriaLabel:"Vista previa del comentario",close:"Cerrar",popoverAriaLabel:"Hilo de comentarios",replyPlaceholder:"Responder...",attachedScreenshot:"Captura de pantalla adjunta",screenshotPreview:"Vista previa de la captura",removeScreenshot:"Quitar captura de pantalla",inboxAriaLabel:"Bandeja de comentarios",inboxEmpty:"A\xFAn no hay comentarios",orphanedBadge:"Desanclado",hiddenBadge:"Oculto",filterAll:"Todos los comentarios",filterCurrentPage:"P\xE1gina actual",filterByPage:"Filtrar por p\xE1gina",filterByStatus:"Filtrar por estado",filterStatusAll:"Todos",filterUnresolved:"Sin resolver",filterResolved:"Resueltos",back:"Volver",deleteComment:"Eliminar",copyAgentContext:"Copiar contexto de agente",copied:"Copiado",statusLabel:"Estado",prevComment:"Comentario anterior",nextComment:"Comentario siguiente",replyLink:"Responder",commentOptions:"Opciones del comentario",moreOptions:"M\xE1s",statusOpen:"Abierto",statusInProgress:"En progreso",statusResolved:"Resuelto",durationLessThanMinute:"<1m",resolvedInTemplate:"Resuelto en {n}",typeLabel:"Tipo",priorityLabel:"Prioridad",unset:"Sin definir",typeBug:"Bug",typeSuggestion:"Sugerencia",typeQuestion:"Pregunta",typeImprovement:"Mejora",priorityHigh:"Alta",priorityMedium:"Media",priorityLow:"Baja",tagsPlaceholder:"A\xF1adir etiquetas...",removeTag:"Quitar etiqueta",filterByType:"Filtrar por tipo",filterByPriority:"Filtrar por prioridad",contextSection:"Contexto",autoScreenshotLabel:"Contexto autom\xE1tico",contextUrl:"URL",contextViewport:"Viewport",contextScreen:"Pantalla",contextBrowser:"Navegador",contextOs:"SO"};var Q={en:v,es:ge},J="en";function Ee(){let r=(navigator.language||J).slice(0,2).toLowerCase();return r in Q?r:J}function fe(r){return Q[r]||Q[J]}function _(r,e){return r.replace("{n}",String(e))}var Ge=6e4;function X(r,e){if(!Number.isFinite(r)||r<0)return"";let t=Math.floor(r/Ge);if(t<1)return e.durationLessThanMinute;if(t<60)return _(e.minutesAgoTemplate,t);let o=Math.floor(t/60);if(o<24){let l=t%60,c=_(e.hoursAgoTemplate,o);return l?`${c} ${_(e.minutesAgoTemplate,l)}`:c}let i=Math.floor(o/24),s=o%24,a=_(e.daysAgoTemplate,i);return s?`${a} ${_(e.hoursAgoTemplate,s)}`:a}var Ve=/^(css|sc|jsx|emotion)-/i,ze=/^data-(reactid|react-|v-|svelte-)/,Ye=["id","name","role","aria-label"],je=["data-testid","name","aria-label"],ee=r=>typeof CSS<"u"&&CSS.escape?CSS.escape(r):String(r).replace(/[^a-zA-Z0-9_-]/g,"\\$&"),We=r=>String(r).replace(/["\\]/g,"\\$&"),P=(r,e)=>{try{return e.querySelectorAll(r).length===1}catch{return!1}},Ce=r=>(r||"").replace(/\s+/g," ").trim().slice(0,64),qe=r=>Ve.test(r)?!1:!r.split(/[-_]/).some(e=>e.length>=5&&/\d/.test(e)),Ke=r=>[...r.classList].filter(qe),Ze=r=>{let e={};for(let{name:t,value:o}of r.attributes)(Ye.includes(t)||t.startsWith("data-")&&!ze.test(t))&&o&&(e[t]=o.slice(0,64));return e},te=r=>{let e=r.parentElement;if(!e)return{index:0,count:1};let t=[...e.children].filter(o=>o.tagName===r.tagName);return{index:t.indexOf(r),count:t.length}},Qe=(r,e)=>{if(!r.id)return null;let t=`#${ee(r.id)}`;return P(t,e)?t:null},Je=(r,e)=>{let t=r.tagName.toLowerCase();for(let o of je){let i=r.getAttribute(o);if(!i)continue;let s=`${t}[${o}="${We(i)}"]`;if(P(s,e))return s}return null},et=(r,e)=>{let t=[],o=r;for(let i=0;i<3&&o;i++){let s=Ke(o),a=o.tagName.toLowerCase();if(t.unshift(s.length?`${a}.${s.map(ee).join(".")}`:a),i===0&&!s.length)return null;let l=t.join(" > ");if(P(l,e))return l;o=o.parentElement}return null},tt=(r,e)=>{if(r===e.body)return"body";let t=[],o=r;for(let s=0;s<5&&o;s++){if(o===e.body){t.unshift("body");break}if(o.id){let l=[`#${ee(o.id)}`,...t].join(" > ");if(P(l,e))return l}let{index:a}=te(o);t.unshift(`${o.tagName.toLowerCase()}:nth-of-type(${a+1})`),o=o.parentElement}let i=t.join(" > ");return P(i,e)?i:null},xe=(r,e)=>Qe(r,e)||Je(r,e)||et(r,e)||tt(r,e);function _e(r){return xe(r,r.ownerDocument)}function Oe(r,e,t){let o=r.ownerDocument,{index:i,count:s}=te(r);return{version:1,selector:xe(r,o),fingerprint:{tagName:r.tagName,textSnippet:Ce(r.textContent),attributes:Ze(r),siblingIndex:i,siblingCount:s},relativeX:e,relativeY:t}}var ot=(r,e)=>{if(!r&&!e)return 1;if(!r||!e)return 0;if(r===e)return 1;if(r.startsWith(e)||e.startsWith(r))return .8;let t=new Set(r.split(" ")),o=new Set(e.split(" ")),i=0;for(let s of t)o.has(s)&&i++;return 2*i/(t.size+o.size)},nt=(r,e)=>{let t=Object.keys(e);if(!t.length)return 1;let o=0;for(let i of t)(r.getAttribute(i)||"").slice(0,64)===e[i]&&o++;return o/t.length},be=(r,e)=>{let{index:t,count:o}=te(r),i=Math.abs(t-e.siblingIndex),s=Math.max(e.siblingCount,o,1);return Math.max(0,1-i/s)},it=(r,e)=>{if(r.tagName!==e.tagName)return 0;let t=!!e.textSnippet,o=Object.keys(e.attributes||{}).length>0,i=.5,s=.3,a=.2;return o?t||(s+=i,i=0):(i+=s,s=0),!t&&!o?be(r,e):i*ot(Ce(r.textContent),e.textSnippet)+s*nt(r,e.attributes||{})+a*be(r,e)},Te=(r,e)=>{let t=null;for(let o of r){let i=it(o,e);(!t||i>t.confidence)&&(t={element:o,confidence:i})}return t};function ye(r,e=document){let t=r?.fingerprint;if(!t||!t.tagName)return null;if(r.selector){let a=[];try{a=[...e.querySelectorAll(r.selector)]}catch{}let l=Te(a,t);if(l&&l.confidence>=.6)return l}if(!(!!t.textSnippet||Object.keys(t.attributes||{}).length>0))return null;let i;try{i=[...e.querySelectorAll(t.tagName)]}catch{return null}let s=Te(i,t);return s&&s.confidence>=.7?s:null}var ve="helldots-comments",U="helldots-pending-detail";function F(){try{let r=localStorage.getItem(ve);if(!r)return[];let e=JSON.parse(r);return Array.isArray(e)?e:[]}catch(r){return console.warn("HellDots: could not read stored comments",r),[]}}function Se(r){try{return localStorage.setItem(ve,JSON.stringify(r)),!0}catch{return!1}}function oe(r){if(Se(r))return!0;let e=r.map((i,s)=>({comment:i,index:s})).filter(({comment:i})=>i?.contextScreenshot).sort((i,s)=>{let a=Date.parse(i.comment.createdAt),l=Date.parse(s.comment.createdAt);return Number.isFinite(a)&&Number.isFinite(l)&&a!==l?a-l:i.index-s.index});if(e.length===0)return console.warn("HellDots: could not persist comments (storage quota exceeded, nothing left to shed)"),!1;let t=[...r],o=0;for(let{index:i}of e)if(t[i]={...t[i],contextScreenshot:null},o++,Se(t))return console.warn(`HellDots: localStorage quota exceeded \u2014 dropped the automatic context screenshot from the ${o} oldest comment(s) to keep all comments persisted. Comment text, replies and user-attached screenshots were not touched.`),!0;return console.warn(`HellDots: could not persist comments even after dropping all ${o} automatic context screenshot(s); storage quota exceeded`),!1}function ne(r,e,t){let o=new Set(e.map(s=>s.id));return[...r.filter(s=>!o.has(s.id)&&s.page!==t),...e]}var Ae='<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>',rt='<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>',st='<svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor"><circle cx="5" cy="12" r="1.6"/><circle cx="12" cy="12" r="1.6"/><circle cx="19" cy="12" r="1.6"/></svg>',G=r=>{if(navigator.clipboard?.writeText)return navigator.clipboard.writeText(r).catch(()=>{});let e=document.createElement("textarea");e.value=r,e.style.position="fixed",e.style.opacity="0",document.body.appendChild(e),e.select();try{document.execCommand("copy")}catch{}return e.remove(),Promise.resolve()},at=(r,e)=>({open:e.statusOpen,in_progress:e.statusInProgress,resolved:e.statusResolved})[r]||e.statusOpen,I=(r,e)=>({bug:e.typeBug,suggestion:e.typeSuggestion,question:e.typeQuestion,improvement:e.typeImprovement})[r]||e.unset,R=(r,e)=>({high:e.priorityHigh,medium:e.priorityMedium,low:e.priorityLow})[r]||e.unset,B=({action:r,options:e,value:t,colorOf:o,labelOf:i,tooltipLabel:s,onSelect:a,showLabel:l=!1})=>{let c=document.createElement("div");c.style.position="relative";let p=document.createElement("button");p.type="button",p.className=n.INBOX_ACTION_BTN,l&&p.classList.add(n.INBOX_ACTION_BTN_LABELED),p.dataset.action=r,p.setAttribute("aria-haspopup","true");let h=document.createElement("span");h.className=n.INBOX_STATUS_DOT,p.appendChild(h);let m=null;l&&(m=document.createElement("span"),m.className=n.INBOX_ACTION_LABEL,p.appendChild(m));let u=document.createElement("div");u.className=n.INBOX_MENU,u.style.display="none",u.setAttribute("role","menu");let d=t,E=()=>{let f=`${s}: ${i(d)}`;h.style.backgroundColor=o(d),p.dataset.hdTooltip=f,p.setAttribute("aria-label",f),m&&(m.textContent=i(d)),u.querySelectorAll("[data-picker-option]").forEach(g=>{let b=g.dataset.pickerOption,C=b===""?null:b;g.setAttribute("aria-checked",String(C===d))})};for(let f of e){let g=document.createElement("button");g.type="button",g.className=n.INBOX_MENU_ITEM,g.dataset.pickerOption=f===null?"":f,g.setAttribute("role","menuitemradio");let b=document.createElement("span");b.className=n.INBOX_STATUS_DOT,b.style.backgroundColor=o(f),g.appendChild(b),g.appendChild(document.createTextNode(i(f))),g.addEventListener("click",C=>{C.stopPropagation(),u.style.display="none",f!==d&&(d=f,a(f),E())}),u.appendChild(g)}return p.addEventListener("click",f=>{f.stopPropagation(),u.style.display=u.style.display==="none"?"block":"none"}),c.appendChild(p),c.appendChild(u),E(),c},V=(r,{strings:e,onCopy:t,onSetStatus:o,onSetType:i,onSetPriority:s,onDelete:a})=>{let l=document.createElement("div");l.className=n.INBOX_CARD_ACTIONS;let c=document.createElement("button");c.type="button",c.className=n.INBOX_ACTION_BTN,c.dataset.action="copy",c.dataset.hdTooltip=e.copyAgentContext,c.setAttribute("aria-label",e.copyAgentContext),c.innerHTML=Ae,c.addEventListener("click",d=>{d.stopPropagation(),t(r),c.innerHTML=rt,c.dataset.hdTooltip=e.copied,setTimeout(()=>{c.innerHTML=Ae,c.dataset.hdTooltip=e.copyAgentContext},1500)}),l.appendChild(c),l.appendChild(B({action:"status",options:M,value:r.status||"open",colorOf:d=>de[d]||"",labelOf:d=>at(d,e),tooltipLabel:e.statusLabel,onSelect:d=>o(r,d)})),l.appendChild(B({action:"type",options:[null,...y],value:r.type||null,colorOf:d=>w[d]||"transparent",labelOf:d=>I(d,e),tooltipLabel:e.typeLabel,onSelect:d=>i?.(r,d),showLabel:!0})),l.appendChild(B({action:"priority",options:[null,...S],value:r.priority||null,colorOf:d=>L[d]||"transparent",labelOf:d=>R(d,e),tooltipLabel:e.priorityLabel,onSelect:d=>s?.(r,d),showLabel:!0}));let p=document.createElement("div");p.style.position="relative";let h=document.createElement("button");h.type="button",h.className=n.INBOX_ACTION_BTN,h.dataset.action="menu",h.dataset.hdTooltip=e.moreOptions,h.setAttribute("aria-label",e.commentOptions),h.innerHTML=st;let m=document.createElement("div");m.className=n.INBOX_MENU,m.style.display="none";let u=document.createElement("button");return u.type="button",u.className=n.INBOX_MENU_ITEM,u.textContent=e.deleteComment,u.addEventListener("click",d=>{d.stopPropagation(),m.style.display="none",a(r)}),m.appendChild(u),h.addEventListener("click",d=>{d.stopPropagation(),m.style.display=m.style.display==="none"?"block":"none"}),p.appendChild(h),p.appendChild(m),l.appendChild(p),l};var lt=(r,e)=>{let t=Date.now()-new Date(r).getTime(),o=Math.floor(t/6e4),i=Math.floor(t/36e5),s=Math.floor(t/864e5);return o<1?e.justNow:o<60?_(e.minutesAgoTemplate,o):i<24?_(e.hoursAgoTemplate,i):_(e.daysAgoTemplate,s)},ct=(r,e)=>new Intl.DateTimeFormat(e,{month:"short",day:"numeric",hour:"numeric",minute:"2-digit"}).format(new Date(r)),$=(r,e,t,o)=>{let i=document.createElement("div");i.className=n.THREAD_META;let s=document.createElement("span");s.className=n.THREAD_AUTHOR,s.textContent=r||t.anonymous;let a=document.createElement("span");return a.className=n.THREAD_TIME,a.textContent=lt(e,t),a.dataset.fullDate=ct(e,o),i.appendChild(s),i.appendChild(a),i},dt=(r,e)=>{let t=/Mac|iPod|iPhone|iPad/.test(navigator.userAgent),o={alt:t?"\u2325":e.modifierAlt,ctrl:t?"\u2318":e.modifierCtrl,shift:"\u21E7"},i=o[r.shortcutModifier]||o.alt,s=r.shortcutKey?.toUpperCase()||"C";return`${i} + ${s}`},ht='<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"/><circle cx="8.5" cy="8.5" r="1.5"/><polyline points="21 15 16 10 5 21"/></svg>',pt='<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 2L11 13M22 2L15 22L11 13M11 13L2 9L22 2"/></svg>',ut='<svg width="16" height="16" viewBox="0 0 16 16" stroke-linejoin="round" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M2.8914 10.4028L2.98327 10.6318C3.22909 11.2445 3.5 12.1045 3.5 13C3.5 13.3588 3.4564 13.7131 3.38773 14.0495C3.69637 13.9446 4.01409 13.8159 4.32918 13.6584C4.87888 13.3835 5.33961 13.0611 5.70994 12.7521L6.22471 12.3226L6.88809 12.4196C7.24851 12.4724 7.61994 12.5 8 12.5C11.7843 12.5 14.5 9.85569 14.5 7C14.5 4.14431 11.7843 1.5 8 1.5C4.21574 1.5 1.5 4.14431 1.5 7C1.5 8.18175 1.94229 9.29322 2.73103 10.2153L2.8914 10.4028ZM2.8135 15.7653C1.76096 16 1 16 1 16C1 16 1.43322 15.3097 1.72937 14.4367C1.88317 13.9834 2 13.4808 2 13C2 12.3826 1.80733 11.7292 1.59114 11.1903C0.591845 10.0221 0 8.57152 0 7C0 3.13401 3.58172 0 8 0C12.4183 0 16 3.13401 16 7C16 10.866 12.4183 14 8 14C7.54721 14 7.10321 13.9671 6.67094 13.9038C6.22579 14.2753 5.66881 14.6656 5 15C4.23366 15.3832 3.46733 15.6195 2.8135 15.7653Z"/></svg>',mt='<svg width="16" height="16" viewBox="0 0 16 16" stroke-linejoin="round" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.67705 7.5L3.92705 3H12.0729L14.3229 7.5H10H9.25V8.25C9.25 8.94036 8.69036 9.5 8 9.5C7.30964 9.5 6.75 8.94036 6.75 8.25V7.5H6H1.67705ZM1.5 9V12C1.5 12.5523 1.94772 13 2.5 13H13.5C14.0523 13 14.5 12.5523 14.5 12V9H10.6465C10.32 10.1543 9.25878 11 8 11C6.74122 11 5.67998 10.1543 5.35352 9H1.5ZM3 1.5H13L15.8944 7.28885C15.9639 7.42771 16 7.58082 16 7.73607V12C16 13.3807 14.8807 14.5 13.5 14.5H2.5C1.11929 14.5 0 13.3807 0 12V7.73607C0 7.58082 0.0361451 7.42771 0.105573 7.28885L3 1.5Z"/></svg>',z=({areaClassName:r,inputTag:e="textarea",inputClassName:t,inputId:o,inputPlaceholder:i,submitBtnId:s,fileInputId:a},l)=>{let c=document.createElement("div");c.className=r;let p=document.createElement(e);o&&(p.id=o),t&&(p.className=t),p.placeholder=i,p.setAttribute("aria-label",i),e==="input"&&(p.type="text");let h=document.createElement("div");h.className=n.SCREENSHOTS_CONTAINER;let m=document.createElement("div");m.className=n.COMMENT_ACTIONS_BAR;let u=document.createElement("button");u.className=n.ATTACH_IMAGE_BTN,u.type="button",u.setAttribute("aria-label",l.attachImage),u.innerHTML=ht;let d=document.createElement("input");d.type="file",a&&(d.id=a),d.accept="image/*",d.style.display="none";let E=document.createElement("button");return s&&(E.id=s),E.className=n.THREAD_SUBMIT,E.type="button",E.setAttribute("aria-label",l.send),E.innerHTML=pt,m.appendChild(u),m.appendChild(d),m.appendChild(E),c.appendChild(p),c.appendChild(h),c.appendChild(m),{container:c,inputEl:p,screenshotsContainer:h,attachBtn:u,fileInput:d,submitBtn:E}},Ne=(r,e,t,o)=>{let i=document.createElement("div");i.className=n.TOOLBAR_ACTION_WRAPPER;let s=document.createElement("div");s.className=n.TOOLBAR_ACTION_TOOLTIP,t.forEach(l=>s.appendChild(l));let a=document.createElement("button");return a.type="button",a.className=`${n.TOOLBAR_ACTION_BTN} ${r}`,a.setAttribute("aria-label",o),a.innerHTML=e,i.appendChild(s),i.appendChild(a),i},Ie=(r={},e=v)=>{let t=document.createElement("div");t.id=T.TOOLBAR;let o=document.createElement("div");o.className=n.TOOLBAR_ACTIONS;let i=document.createElement("span");i.className=n.TOOLBAR_TEXT,i.textContent=e.toolbarComment;let s=document.createElement("span");s.className=n.SHORTCUT_HINT,s.textContent=dt(r,e);let a=Ne(n.TOOLBAR_COMMENT_BTN,ut,[i,s],e.toolbarComment);a.querySelector(`.${n.TOOLBAR_COMMENT_BTN}`)?.setAttribute("aria-pressed","false");let l=document.createElement("span");l.className=n.TOOLBAR_TEXT,l.textContent=e.toolbarInbox;let c=Ne(n.TOOLBAR_MENU_BTN,mt,[l],e.toolbarInbox);return o.appendChild(a),o.appendChild(c),t.appendChild(o),t},gt=r=>{let e=document.createElement("div");e.className=n.CLASSIFY_ROW;let t=null,o=null,i=[],s=document.createElement("div");s.className=n.INBOX_BADGES;let a=document.createElement("input");a.type="text",a.className=n.TAGS_INPUT,a.placeholder=r.tagsPlaceholder,a.setAttribute("aria-label",r.tagsPlaceholder);let l=()=>{s.innerHTML="",i.forEach((h,m)=>{let u=document.createElement("span");u.className=n.TAG_CHIP,u.appendChild(document.createTextNode(h));let d=document.createElement("button");d.type="button",d.className=n.TAG_CHIP_REMOVE,d.setAttribute("aria-label",`${r.removeTag}: ${h}`),d.innerHTML="&times;",d.addEventListener("click",E=>{E.stopPropagation(),i.splice(m,1),l()}),u.appendChild(d),s.appendChild(u)})},c=()=>{let h=a.value.trim().toLowerCase();h&&!i.includes(h)&&(i.push(h),l()),a.value=""};a.addEventListener("keydown",h=>{h.key!=="Enter"&&h.key!==","||(h.preventDefault(),c())});let p=()=>{e.replaceChildren(),e.appendChild(B({action:"type",options:[null,...y],value:null,colorOf:h=>w[h]||"transparent",labelOf:h=>I(h,r),tooltipLabel:r.typeLabel,onSelect:h=>t=h,showLabel:!0})),e.appendChild(B({action:"priority",options:[null,...S],value:null,colorOf:h=>L[h]||"transparent",labelOf:h=>R(h,r),tooltipLabel:r.priorityLabel,onSelect:h=>o=h,showLabel:!0})),e.appendChild(a),e.appendChild(s)};return p(),{container:e,getType:()=>t,getPriority:()=>o,getTags:()=>(c(),[...i]),reset:()=>{t=null,o=null,i.length=0,a.value="",l(),p()}}},Re=(r=v)=>{let e=document.createElement("div");e.id=T.COMMENT_BOX,e.setAttribute("role","dialog"),e.setAttribute("aria-label",r.commentBoxAriaLabel);let{container:t}=z({areaClassName:n.COMMENT_INPUT_AREA,inputTag:"textarea",inputId:T.COMMENT_INPUT,inputPlaceholder:r.commentPlaceholder,submitBtnId:T.SUBMIT_COMMENT,fileInputId:T.ATTACH_IMAGE_INPUT},r),o=gt(r);return e.appendChild(o.container),e.appendChild(t),e.style.display="none",e.classify=o,e},we=(r,e=v)=>{let t=document.createElement("div");return t.className=n.CIRCLE,t.dataset.commentId=r.id,t.dataset.commentText=r.text,t.setAttribute("role","button"),t.setAttribute("tabindex","0"),t.setAttribute("aria-label",`${e.commentAriaLabelPrefix}${r.text}`),t.style.cssText=`
+        position: absolute;
+        pointer-events: auto;
+    `,t},H=(r,e)=>{let t=document.createElement("div");return t.className=n.SCREENSHOTS_CONTAINER,t.classList.add(n.ACTIVE),r.forEach(o=>{let i=document.createElement("div");i.className=n.SCREENSHOT_ITEM;let s=document.createElement("img");s.className=n.SCREENSHOT_IMG,s.src=o,s.alt=e.attachedScreenshot,i.appendChild(s),t.appendChild(i)}),t},Le=(r,e=v,t)=>{let o=document.createElement("div");o.className=n.TOOLTIP,o.dataset.for=r.id,o.setAttribute("role","dialog"),o.setAttribute("aria-label",e.tooltipAriaLabel);let i=document.createElement("div");i.className=n.THREAD_HEADER;let s=$(r.author,r.createdAt,e,t),a=document.createElement("button");a.type="button",a.className=n.CLOSE_TOOLTIP,a.setAttribute("aria-label",e.close),a.innerHTML="&times;",i.appendChild(s),i.appendChild(a);let l=document.createElement("div");l.className=n.THREAD_BODY,l.textContent=r.text,o.appendChild(i),o.appendChild(l);let c=r.screenshots||(r.screenshot?[r.screenshot]:[]);return c.length>0&&o.appendChild(H(c,e)),o},k=(r,e=v,t)=>{let o=document.createElement("div");o.className=n.THREAD_REPLY;let i=$(r.author,r.timestamp,e,t),s=document.createElement("div");s.className=n.THREAD_BODY,s.textContent=r.text,o.appendChild(i),o.appendChild(s);let a=r.screenshots||(r.screenshot?[r.screenshot]:[]);return a.length>0&&o.appendChild(H(a,e)),o},Be=(r,e=v,t)=>{let o=document.createElement("div");o.className=n.THREAD_POPOVER,o.dataset.for=r.id,o.setAttribute("role","dialog"),o.setAttribute("aria-label",e.popoverAriaLabel);let i=document.createElement("div");i.className=n.THREAD_HEADER;let s=$(r.author,r.createdAt,e,t),a=document.createElement("button");a.type="button",a.className=n.CLOSE_TOOLTIP,a.setAttribute("aria-label",e.close),a.innerHTML="&times;",i.appendChild(s),i.appendChild(a);let l=document.createElement("div");l.className=n.THREAD_BODY,l.textContent=r.text;let c=document.createElement("div");c.className=n.THREAD_REPLIES,r.replies&&r.replies.forEach(m=>{c.appendChild(k(m,e,t))});let{container:p}=z({areaClassName:n.THREAD_INPUT_AREA,inputTag:"input",inputClassName:n.THREAD_INPUT,inputPlaceholder:e.replyPlaceholder},e);o.appendChild(i),o.appendChild(l);let h=r.screenshots||(r.screenshot?[r.screenshot]:[]);return h.length>0&&o.appendChild(H(h,e)),o.appendChild(c),o.appendChild(p),o};var Et=r=>{let e=[...r.attributes].map(({name:t,value:o})=>`${t}="${o}"`).join(" ");return`<${r.tagName.toLowerCase()}${e?` ${e}`:""}>`},ft=r=>{if(!r?.tagName)return"(unknown)";let e=Object.entries(r.attributes||{}).map(([t,o])=>`${t}="${o}"`).join(" ");return`<${r.tagName.toLowerCase()}${e?` ${e}`:""}>`},bt=r=>{let e=[],t=r;for(;t&&t!==document.documentElement;){let o=t.tagName.toLowerCase(),i=t.id?`#${t.id}`:"",s=[...t.classList].slice(0,2).map(a=>`.${a}`).join("");if(e.unshift(`${o}${i}${s}`),t===document.body)break;t=t.parentElement}return e.join(" > ")};function Y(r,{viewportWidth:e,viewportHeight:t,strings:o}){let i=r.anchor,s=i?.fingerprint,a=r.container?.isConnected?r.container:null,l=r.hidden?"hidden":r.anchorState,c=a?Et(a):ft(s),p=a?bt(a):"(unavailable)",h=r.context?.viewport,m=h?.width??e,u=h?.height??t,d=[`Page: ${r.page}`,`Viewport: ${m}x${u}`,`Anchor state: ${l}`,`Status: ${r.status||"open"}`,`Selector: ${i?.selector||"(none)"}`,`Element: ${c}`,`DOM path: ${p}`,`Nearby text: "${s?.textSnippet??""}"`,`Comment by ${r.author} (${r.createdAt}):`,`"${r.text}"`];r.type&&d.push(`Type: ${r.type}`),r.priority&&d.push(`Priority: ${r.priority}`),r.tags?.length&&d.push(`Tags: ${r.tags.join(", ")}`);let E=r.context;if(E&&(E.url&&d.push(`URL: ${E.url}`),E.screen&&d.push(`Screen: ${E.screen.width}x${E.screen.height}`),E.browser?.name&&d.push(`Browser: ${`${E.browser.name} ${E.browser.version||""}`.trim()}`),E.os?.name&&d.push(`OS: ${`${E.os.name} ${E.os.version||""}`.trim()}`)),o&&r.status==="resolved"&&r.resolvedAt){let g=X(new Date(r.resolvedAt).getTime()-new Date(r.createdAt).getTime(),o);g&&d.push(`Resolution time: ${g}`)}let f=r.replies||[];if(f.length>0){d.push(`Replies (${f.length}):`);for(let g of f)d.push(`- ${g.author}: "${g.text}"`)}return d.join(`
+`)}var Tt='<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>',Ct='<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 18 9 12 15 6"/></svg>',xt='<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="18 15 12 9 6 15"/></svg>',_t='<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>',j=class{constructor({shadowRoot:e,strings:t,locale:o,currentPage:i,getComments:s,callbacks:a}){this.shadowRoot=e,this.strings=t,this.locale=o,this.currentPage=i,this.getComments=s,this.callbacks=a,this.pageFilter="page",this.statusFilter="all",this.typeFilter="all",this.priorityFilter="all",this.detailId=null,this.el=null}isOpen(){return!!this.el}open(){this.el||(this.el=document.createElement("div"),this.el.className=n.INBOX_PANEL,this.el.setAttribute("role","dialog"),this.el.setAttribute("aria-label",this.strings.inboxAriaLabel),this.shadowRoot.appendChild(this.el),this.render())}close(){this._clearHighlight(),this.el?.remove(),this.el=null,this.detailId=null}refresh(){this.el&&this.render()}_highlight(e){if(this._clearHighlight(),e.anchorState!=="anchored"||e.hidden||e.status==="resolved")return;let t=this.shadowRoot.querySelector(`[data-comment-id="${e.id}"]`);t&&(t.classList.add(n.HIGHLIGHT),this._highlightedEl=t)}_clearHighlight(){this._highlightedEl?.classList.remove(n.HIGHLIGHT),this._highlightedEl=null}filteredComments(){let e=this.getComments();return this.pageFilter==="page"&&(e=e.filter(t=>t.page===this.currentPage)),this.statusFilter==="resolved"?e=e.filter(t=>t.status==="resolved"):this.statusFilter==="unresolved"&&(e=e.filter(t=>t.status!=="resolved")),this.typeFilter!=="all"&&(e=e.filter(t=>t.type===this.typeFilter)),this.priorityFilter!=="all"&&(e=e.filter(t=>t.priority===this.priorityFilter)),[...e.filter(t=>t.status!=="resolved"),...e.filter(t=>t.status==="resolved")]}render(){if(!this.el)return;this._clearHighlight(),this.el.innerHTML="";let e=this.filteredComments(),t=this.detailId!=null?e.find(o=>o.id===this.detailId):null;t?this._renderDetail(t,e):(this.detailId=null,this._renderList(e))}openDetail(e){this.el||this.open();let t=this.getComments().find(o=>o.id===e);t&&this._openDetail(t)}_openDetail(e){this.detailId=e.id,e.anchorState==="anchored"&&!e.hidden&&this.callbacks.onOpenDetailScroll(e),this.render()}_closeButton(){let e=document.createElement("button");return e.type="button",e.className=n.INBOX_CLOSE,e.setAttribute("aria-label",this.strings.close),e.innerHTML="&times;",e.addEventListener("click",()=>this.callbacks.onClose()),e}_renderList(e){let t=document.createElement("div");t.className=n.INBOX_HEADER,t.appendChild(this._buildFilter()),t.appendChild(this._closeButton()),this.el.appendChild(t);let o=document.createElement("div");if(o.className=n.INBOX_LIST,this.el.appendChild(o),e.length===0){let i=document.createElement("div");i.className=n.INBOX_EMPTY,i.textContent=this.strings.inboxEmpty,o.appendChild(i);return}for(let i of e)o.appendChild(this._buildCard(i,{interactive:!0}))}_pageFilterLabel(e){return e==="all"?this.strings.filterAll:this.strings.filterCurrentPage}_statusFilterLabel(e){return e==="unresolved"?this.strings.filterUnresolved:e==="resolved"?this.strings.filterResolved:this.strings.filterStatusAll}_filterSummaryLabel(){let e=[this._pageFilterLabel(this.pageFilter)];return this.statusFilter!=="all"&&e.push(this._statusFilterLabel(this.statusFilter)),this.typeFilter!=="all"&&e.push(I(this.typeFilter,this.strings)),this.priorityFilter!=="all"&&e.push(R(this.priorityFilter,this.strings)),e.join(" \xB7 ")}_buildFilter(){let e=document.createElement("div");e.className=n.INBOX_FILTER+"-wrapper";let t=this._filterSummaryLabel(),o=document.createElement("button");o.type="button",o.className=n.INBOX_FILTER,o.setAttribute("aria-haspopup","true"),o.setAttribute("aria-expanded","false"),o.innerHTML=`<span>${t}</span>${Tt}`;let i=document.createElement("div");i.className=n.INBOX_FILTER_MENU,i.style.display="none";let s=l=>{let c=document.createElement("div");c.className=n.INBOX_FILTER_SECTION,c.textContent=l,i.appendChild(c)},a=(l,c,p,h,m)=>{let u=document.createElement("button");u.type="button",u.className=n.INBOX_FILTER_OPTION,u.dataset[p]=h,u.setAttribute("role","menuitemradio"),u.setAttribute("aria-checked",String(c)),u.innerHTML=`<span>${l}</span>${c?"\u2713":""}`,u.addEventListener("click",d=>{d.stopPropagation(),m(),this.render()}),i.appendChild(u)};s(this.strings.filterByPage);for(let l of["all","page"])a(this._pageFilterLabel(l),this.pageFilter===l,"filterPage",l,()=>this.pageFilter=l);s(this.strings.filterByStatus);for(let l of["all","unresolved","resolved"])a(this._statusFilterLabel(l),this.statusFilter===l,"filterStatus",l,()=>this.statusFilter=l);s(this.strings.filterByType);for(let l of["all",...y])a(l==="all"?this.strings.filterStatusAll:I(l,this.strings),this.typeFilter===l,"filterType",l,()=>this.typeFilter=l);s(this.strings.filterByPriority);for(let l of["all",...S])a(l==="all"?this.strings.filterStatusAll:R(l,this.strings),this.priorityFilter===l,"filterPriority",l,()=>this.priorityFilter=l);return o.addEventListener("click",l=>{l.stopPropagation();let c=i.style.display!=="none";i.style.display=c?"none":"block",o.setAttribute("aria-expanded",String(!c))}),e.appendChild(o),e.appendChild(i),e}_buildCard(e,{interactive:t}){let o=document.createElement("div");o.className=n.INBOX_CARD,e.status==="resolved"&&o.classList.add(`${n.INBOX_CARD}--resolved`),o.dataset.commentId=e.id;let i=document.createElement("div");i.className=n.INBOX_CARD_HEADER,i.appendChild($(e.author,e.createdAt,this.strings,this.locale)),i.appendChild(this._buildCardActions(e)),o.appendChild(i);let s=document.createElement("div");if(s.className=n.INBOX_CARD_TEXT,s.textContent=e.text,o.appendChild(s),e.screenshots?.length){let c=H(e.screenshots,this.strings);c.querySelectorAll(`.${n.SCREENSHOT_IMG}`).forEach(p=>{p.addEventListener("click",h=>{h.stopPropagation(),this.callbacks.onShowLightbox(p.src)})}),o.appendChild(c)}let a=this._buildBadges(e);a&&o.appendChild(a);let l=this._buildTag(e);if(l&&o.appendChild(l),t){o.setAttribute("role","button"),o.setAttribute("tabindex","0");let c=()=>e.anchorState==="inactive"?this.callbacks.onNavigateToPage(e):this._openDetail(e),p=document.createElement("button");p.type="button",p.className=n.INBOX_CARD_REPLY_LINK,p.textContent=this.strings.replyLink,p.addEventListener("click",h=>{h.stopPropagation(),c()}),o.appendChild(p),o.addEventListener("click",c),o.addEventListener("keydown",h=>{(h.key==="Enter"||h.key===" ")&&(h.preventDefault(),c())}),o.addEventListener("mouseenter",()=>this._highlight(e)),o.addEventListener("mouseleave",()=>this._clearHighlight())}return o}_buildTag(e){let t=null;if(e.anchorState==="orphaned"?t=this.strings.orphanedBadge:e.hidden?t=this.strings.hiddenBadge:e.anchorState==="inactive"&&(t=e.page),!t)return null;let o=document.createElement("span");return o.className=n.INBOX_CARD_TAG,o.textContent=t,o}_buildBadges(e){let t=document.createElement("div");t.className=n.INBOX_BADGES;let o=(i,s,a)=>{let l=document.createElement("span");l.className=`${n.BADGE} ${s}`,l.textContent=i,a&&(l.style.borderColor=a),t.appendChild(l)};e.type&&o(I(e.type,this.strings),n.BADGE_TYPE,w[e.type]),e.priority&&o(R(e.priority,this.strings),n.BADGE_PRIORITY,L[e.priority]);for(let i of e.tags||[])o(i,n.BADGE_TAG,null);if(e.status==="resolved"){let i=e.resolvedAt?X(new Date(e.resolvedAt).getTime()-new Date(e.createdAt).getTime(),this.strings):"";o(_(this.strings.resolvedInTemplate,i||"\u2014"),n.BADGE_DURATION,null)}return t.children.length?t:null}_buildContextBlock(e){let{context:t,contextScreenshot:o}=e;if(!t&&!o)return null;let i=document.createElement("div");i.className=n.CONTEXT_BLOCK;let s=document.createElement("div");if(s.className=n.INBOX_FILTER_SECTION,s.textContent=this.strings.contextSection,i.appendChild(s),o){let a=document.createElement("div");a.className=n.CONTEXT_SCREENSHOT_CAPTION,a.textContent=this.strings.autoScreenshotLabel,i.appendChild(a);let l=document.createElement("img");l.className=n.SCREENSHOT_IMG,l.src=o,l.alt=this.strings.autoScreenshotLabel,l.addEventListener("click",c=>{c.stopPropagation(),this.callbacks.onShowLightbox(o)}),i.appendChild(l)}if(t){let a=(p,h)=>{if(!h)return;let m=document.createElement("div");m.className=n.CONTEXT_ROW;let u=document.createElement("span");u.textContent=p;let d=document.createElement("span");d.textContent=h,m.appendChild(u),m.appendChild(d),i.appendChild(m)},l=p=>p?`${p.width}\xD7${p.height}`:"",c=p=>p?.name?`${p.name} ${p.version||""}`.trim():"";a(this.strings.contextUrl,t.url),a(this.strings.contextViewport,l(t.viewport)),a(this.strings.contextScreen,l(t.screen)),a(this.strings.contextBrowser,c(t.browser)),a(this.strings.contextOs,c(t.os))}return i}_buildCardActions(e){return V(e,{strings:this.strings,onCopy:t=>G(Y(t,{viewportWidth:window.innerWidth,viewportHeight:window.innerHeight,strings:this.strings})),onSetStatus:(t,o)=>this.callbacks.onSetStatus(t.id,o),onSetType:(t,o)=>this.callbacks.onSetType(t.id,o),onSetPriority:(t,o)=>this.callbacks.onSetPriority(t.id,o),onDelete:t=>{this.detailId===t.id&&(this.detailId=null),this.callbacks.onDelete(t.id),this.render()}})}_renderDetail(e,t){let o=t.indexOf(e),i=document.createElement("div");i.className=n.INBOX_DETAIL_HEADER;let s=document.createElement("button");s.type="button",s.className=n.INBOX_BACK,s.innerHTML=`${Ct}<span>${this.strings.back}</span>`,s.addEventListener("click",()=>{this.detailId=null,this.render()}),i.appendChild(s);let a=document.createElement("div");a.className=n.INBOX_CARD_ACTIONS;let l=(m,u,d)=>{let E=document.createElement("button");E.type="button",E.className=n.INBOX_NAV_BTN,E.setAttribute("aria-label",u),E.title=u,E.innerHTML=m;let f=t[d];return E.disabled=!f,f&&E.addEventListener("click",()=>this._openDetail(f)),E};a.appendChild(l(xt,this.strings.prevComment,o-1)),a.appendChild(l(_t,this.strings.nextComment,o+1)),a.appendChild(this._closeButton()),i.appendChild(a),this.el.appendChild(i);let c=document.createElement("div");c.className=n.INBOX_DETAIL,c.appendChild(this._buildCard(e,{interactive:!1}));let p=this._buildContextBlock(e);p&&c.appendChild(p);let h=document.createElement("div");h.className=n.INBOX_REPLIES;for(let m of e.replies||[]){let u=k(m,this.strings,this.locale);u.querySelectorAll(`.${n.SCREENSHOT_IMG}`).forEach(d=>{d.addEventListener("click",E=>{E.stopPropagation(),this.callbacks.onShowLightbox(d.src)})}),h.appendChild(u)}c.appendChild(h),c.appendChild(this._buildReplyInput(e)),this.el.appendChild(c)}_buildReplyInput(e){let{container:t,inputEl:o,screenshotsContainer:i,attachBtn:s,fileInput:a,submitBtn:l}=z({areaClassName:n.THREAD_INPUT_AREA,inputTag:"input",inputClassName:n.THREAD_INPUT,inputPlaceholder:this.strings.replyPlaceholder},this.strings),c=[],p=()=>{i.innerHTML="",i.classList.toggle(n.ACTIVE,c.length>0),c.forEach((m,u)=>{let d=document.createElement("div");d.className=n.SCREENSHOT_ITEM;let E=document.createElement("img");E.className=n.SCREENSHOT_IMG,E.src=m,E.alt=this.strings.attachedScreenshot,E.onclick=()=>this.callbacks.onShowLightbox(m);let f=document.createElement("button");f.type="button",f.className=n.SCREENSHOT_REMOVE,f.setAttribute("aria-label",this.strings.removeScreenshot),f.innerHTML="&times;",f.onclick=g=>{g.stopPropagation(),c.splice(u,1),p()},d.appendChild(E),d.appendChild(f),i.appendChild(d)})};s.addEventListener("click",()=>a.click()),a.addEventListener("change",m=>{let u=m.target.files[0];if(!u||c.length>=5)return;let d=new FileReader;d.onload=E=>{c.push(E.target.result),p()},d.readAsDataURL(u),a.value=""});let h=()=>{let m=o.value.trim();!m&&c.length===0||(this.callbacks.onReply(e,m,[...c]),c=[],this.render())};return l.addEventListener("click",h),o.addEventListener("keydown",m=>{m.key==="Enter"&&!m.shiftKey&&(m.preventDefault(),h())}),t}};var Ot=r=>{let e=new Set;for(let t of r){let o=String(t).trim().toLowerCase();o&&e.add(o)}return[...e]},ie=class{constructor(e={}){this.comments=[],this.commentMode=!1,this.isMac=/Mac|iPod|iPhone|iPad/.test(navigator.userAgent),this.options={shortcutKey:e.shortcutKey||(this.isMac?"c":"C"),shortcutModifier:e.shortcutModifier||"alt",autoScreenshot:e.autoScreenshot!==!1,...e},this.locale=this.options.locale||Ee(),this.strings=fe(this.locale),this.resizeObservers=new Map,this.mutationObservers=new Map,this.positionValidationEnabled=!0,this._pendingRaf=null,this._pendingContextScreenshot=null,document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>this.initOverlay()):this.initOverlay()}initOverlay(){this.shadowRoot=re(),this.toolbar=Ie(this.options,this.strings),this.commentBox=Re(this.strings),this.overlay=document.createElement("div"),this.overlay.className=n.COMMENT_OVERLAY,this.shadowRoot.appendChild(this.overlay),this.shadowRoot.appendChild(this.toolbar),this.shadowRoot.appendChild(this.commentBox),this.commentBtn=this.toolbar.querySelector(`.${n.TOOLBAR_COMMENT_BTN}`),this.inboxBtn=this.toolbar.querySelector(`.${n.TOOLBAR_MENU_BTN}`),this.submitButton=this.shadowRoot.getElementById(T.SUBMIT_COMMENT),this.commentInput=this.shadowRoot.getElementById(T.COMMENT_INPUT),this.attachImageBtn=this.commentBox.querySelector(`.${n.ATTACH_IMAGE_BTN}`),this.attachImageInput=this.shadowRoot.getElementById(T.ATTACH_IMAGE_INPUT),this.bindEventListeners(),this.setupKeyboardShortcut(),this.setupResizeHandlers(),this.injectStyles(),this.options.persistence==="localStorage"&&(this.loadComments(F()),this._openPendingDetail())}_navigateTo(e){location.assign(e)}_openPendingDetail(){let e=null;try{e=sessionStorage.getItem(U),e!=null&&sessionStorage.removeItem(U)}catch{return}if(!e)return;let t=this.comments.find(o=>String(o.id)===e);t&&(this.showInbox(),this.inboxView.openDetail(t.id))}_syncStorage(){this.options.persistence==="localStorage"&&oe(ne(F(),this.serializeComments(),location.pathname))}bindEventListeners(){this.commentBtn.addEventListener("click",()=>this.toggleCommentMode()),this.inboxBtn.addEventListener("click",()=>this.toggleInbox()),this.submitButton.addEventListener("click",()=>this.saveComment()),this.commentInput.addEventListener("keydown",e=>{e.key==="Enter"&&!e.shiftKey&&(e.preventDefault(),this.saveComment())}),this.attachImageBtn.addEventListener("click",()=>{this.attachImageInput.click()}),this.attachImageInput.addEventListener("change",e=>{let t=e.target.files[0];if(!t||(this._pendingScreenshots||(this._pendingScreenshots=[]),this._pendingScreenshots.length>=5))return;let o=new FileReader;o.onload=i=>{this._pendingScreenshots.push(i.target.result),this._updateScreenshotsPreview()},o.readAsDataURL(t),this.attachImageInput.value=""}),this._handleDocumentClickBound=e=>this.handleDocumentClick(e),document.addEventListener("mousedown",this._handleDocumentClickBound)}setupKeyboardShortcut(){this.keydownHandler&&document.removeEventListener("keydown",this.keydownHandler),this.keydownHandler=e=>{if(e.key==="Escape"){this._activeLightbox?this.closeLightbox():this.activeThreadPopover?this.closeThreadPopover():this.inboxView?.isOpen()?this.closeInbox():this.commentBox.style.display!=="none"?(this.hideCommentBox(),this.toggleCommentMode()):this.commentMode&&this.toggleCommentMode();return}let t=this.isMac&&e.altKey&&(e.key==="\xE7"||e.key==="\xC7"),o=!this.isMac&&e.altKey&&e.key.toLowerCase()==="c",i=e.key.toLowerCase()===this.options.shortcutKey.toLowerCase()&&(this.options.shortcutModifier==="alt"&&e.altKey||this.options.shortcutModifier==="ctrl"&&(e.ctrlKey||e.metaKey)||this.options.shortcutModifier==="shift"&&e.shiftKey);if(t||o||i)return e.preventDefault(),e.stopPropagation(),this.toggleCommentMode(),!1},document.addEventListener("keydown",this.keydownHandler)}handleDocumentClick(e){if(!this.commentMode)return;let t=e.composedPath()[0]||e.target;if(!(this.toolbar.contains(t)||t?.closest?.(`.${n.CIRCLE}`)||t?.closest?.(`.${n.TOOLTIP}`)||t?.closest?.(`.${n.THREAD_POPOVER}`)||t?.closest?.(`.${n.INBOX_PANEL}`)||t?.closest?.(`.${n.LIGHTBOX}`))&&!this.commentBox.contains(t)){if(this.commentBox.style.display!=="none"){this.hideCommentBox(),this.toggleCommentMode();return}e.button===0&&(e.preventDefault(),this._dragStart={x:e.clientX,y:e.clientY},this._isDragging=!1,this._boundDragMove=o=>this._onDragMove(o),this._boundDragEnd=o=>this._onDragEnd(o),document.addEventListener("mousemove",this._boundDragMove),document.addEventListener("mouseup",this._boundDragEnd))}}_onDragMove(e){let t=e.clientX-this._dragStart.x,o=e.clientY-this._dragStart.y;if(!this._isDragging&&Math.hypot(t,o)<5)return;this._isDragging=!0;let i=Math.min(this._dragStart.x,e.clientX),s=Math.min(this._dragStart.y,e.clientY),a=Math.abs(t),l=Math.abs(o);this._selectionRect||(this._selectionRect=document.createElement("div"),this._selectionRect.className=n.SELECTION_RECT,this.shadowRoot.appendChild(this._selectionRect)),this._selectionRect.style.left=`${i}px`,this._selectionRect.style.top=`${s}px`,this._selectionRect.style.width=`${a}px`,this._selectionRect.style.height=`${l}px`}async _onDragEnd(e){if(document.removeEventListener("mousemove",this._boundDragMove),document.removeEventListener("mouseup",this._boundDragEnd),this._isDragging){let t=Math.min(this._dragStart.x,e.clientX),o=Math.min(this._dragStart.y,e.clientY),i=Math.abs(e.clientX-this._dragStart.x),s=Math.abs(e.clientY-this._dragStart.y);if(this._selectionRect?.remove(),this._selectionRect=null,i>10&&s>10)try{this._pendingScreenshots||(this._pendingScreenshots=[]);let a=await K(()=>q({scale:1})),l=ae(a,{left:t,top:o,width:i,height:s});l&&this._pendingScreenshots.length<5&&this._pendingScreenshots.push(l),this.options.autoScreenshot&&(this._pendingContextScreenshot=Z(a,{sourceScale:1}))}catch(a){console.warn("Screenshot capture failed:",a)}await this._placeCommentAtPoint(e.clientX,e.clientY)}else await this._placeCommentAtPoint(this._dragStart.x,this._dragStart.y);this._isDragging=!1,this._dragStart=null}async _placeCommentAtPoint(e,t){if(this.options.autoScreenshot&&!this._pendingContextScreenshot)try{let h=await K(()=>q({scale:D}));this._pendingContextScreenshot=Z(h,{sourceScale:D})}catch(h){console.warn("HellDots: automatic screenshot failed",h),this._pendingContextScreenshot=null}let o=this.overlay.style.pointerEvents;this.overlay.style.pointerEvents="none";let i=document.elementFromPoint(e,t);this.overlay.style.pointerEvents=o||"";let s=i?.closest?.(he.CONTAINER)||document.body,a=s.getBoundingClientRect(),l=a.width>0?(e-a.left)/a.width:0,c=a.height>0?(t-a.top)/a.height:0,p=Oe(s,l,c);p.targetSelector=i&&i!==s?_e(i):null,this.currentPosition={container:s,relativeX:l,relativeY:c,anchor:p,target:i||s},this.createPreviewCircle(e,t),document.body.classList.remove(n.COMMENT_CURSOR),this._pendingScreenshots&&this._pendingScreenshots.length>0&&this._updateScreenshotsPreview(),this.showCommentBox(e,t)}_updateScreenshotsPreview(){let e=this.commentBox.querySelector(`.${n.SCREENSHOTS_CONTAINER}`);if(e){if(e.innerHTML="",!this._pendingScreenshots||this._pendingScreenshots.length===0){e.classList.remove(n.ACTIVE);return}e.classList.add(n.ACTIVE),this._pendingScreenshots.forEach((t,o)=>{let i=document.createElement("div");i.className=n.SCREENSHOT_ITEM;let s=document.createElement("img");s.className=n.SCREENSHOT_IMG,s.src=t,s.alt=this.strings.attachedScreenshot,s.onclick=()=>this.showLightbox(t);let a=document.createElement("button");a.type="button",a.className=n.SCREENSHOT_REMOVE,a.setAttribute("aria-label",this.strings.removeScreenshot),a.innerHTML="&times;",a.onclick=l=>{l.stopPropagation(),this._pendingScreenshots.splice(o,1),this._updateScreenshotsPreview()},i.appendChild(s),i.appendChild(a),e.appendChild(i)})}}_clearScreenshotPreview(){this._pendingScreenshots=[];let e=this.commentBox.querySelector(`.${n.SCREENSHOTS_CONTAINER}`);e&&(e.innerHTML="",e.classList.remove(n.ACTIVE))}showCommentBox(e,t){this.commentBox.style.display="block";let o=300,s=28/2,a=s+10,l=window.innerWidth,c=window.innerHeight,p=e+s,h=t+s,m=p+a,u=h-s;m+o>l&&(m=p-a-o),m=Math.max(10,m);let d=this.commentBox.getBoundingClientRect();u+d.height>c&&(u=c-d.height-10),u=Math.max(10,u),this.commentBox.style.left=`${m}px`,this.commentBox.style.top=`${u}px`,this.commentInput.value="",setTimeout(()=>this.commentInput.focus(),50)}hideCommentBox(){this.commentBox.style.display="none",this.commentInput.style.height="auto",this.currentPosition=null,this.removePreviewCircle(),this._clearScreenshotPreview(),this._pendingContextScreenshot=null,this.commentBox.classify?.reset(),this.commentMode&&document.body.classList.add(n.COMMENT_CURSOR)}toggleCommentMode(){this.commentMode=!this.commentMode,this.commentBtn?.classList.toggle(n.ACTIVE,this.commentMode),this.commentBtn?.setAttribute("aria-pressed",String(this.commentMode)),this.overlay.classList.toggle(n.ACTIVE,this.commentMode),document.body.classList.toggle(n.COMMENT_CURSOR,this.commentMode),this.commentMode||this.hideCommentBox()}saveComment(){if(!this.commentInput.value.trim()||!this.currentPosition)return;let e={text:this.commentInput.value,container:this.currentPosition.container,relativeX:this.currentPosition.relativeX,relativeY:this.currentPosition.relativeY,anchor:this.currentPosition.anchor,anchorState:"anchored",target:this.currentPosition.target,hidden:!1,status:"open",page:location.pathname,id:Date.now(),replies:[],author:this.options.user?.name||this.strings.anonymous,createdAt:new Date().toISOString(),screenshots:this._pendingScreenshots?[...this._pendingScreenshots]:[],type:this.commentBox.classify?.getType()??null,priority:this.commentBox.classify?.getPriority()??null,tags:this.commentBox.classify?.getTags()??[],resolvedAt:null,context:ce(),contextScreenshot:this._pendingContextScreenshot};this.comments.push(e),this._syncStorage(),this.options.onCommentCreated?.(this._serializeComment(e)),this.renderCommentCircle(e),this.hideCommentBox(),this.toggleCommentMode();let t=this.shadowRoot.querySelector(`[data-comment-id="${e.id}"]`);t&&this.showThreadPopover(t,e)}renderCommentCircle(e){let t=we(e,this.strings);t.addEventListener("mouseenter",()=>this.showCommentTooltip(t,e)),t.addEventListener("mouseleave",()=>{setTimeout(()=>{let o=this.shadowRoot.querySelector(`.${n.TOOLTIP}[data-for="${e.id}"]`);o&&!o.matches(":hover")&&o.remove()},250)}),t.addEventListener("click",o=>{o.stopPropagation();let i=this.shadowRoot.querySelector(`.${n.TOOLTIP}[data-for="${e.id}"]`);i&&i.remove(),this.showThreadPopover(t,e)}),t.addEventListener("keydown",o=>{(o.key==="Enter"||o.key===" ")&&(o.preventDefault(),t.click())}),this.overlay.appendChild(t),this.updateCommentPosition(e,t),this.createResizeObserver(e,t),this.createMutationObserver(e)}showCommentTooltip(e,t){if(this.shadowRoot.querySelector(`.${n.THREAD_POPOVER}[data-for="${t.id}"]`)||this.shadowRoot.querySelector(`.${n.TOOLTIP}[data-for="${t.id}"]`))return;let s=Le(t,this.strings,this.locale);this.shadowRoot.appendChild(s),s.querySelectorAll(`.${n.SCREENSHOT_IMG}`).forEach(a=>{a.addEventListener("click",l=>{l.stopPropagation(),this.showLightbox(a.src)})}),setTimeout(()=>{this.positionPopoverAtCircle(s,e)},10),s.querySelector(`.${n.CLOSE_TOOLTIP}`).addEventListener("click",a=>{a.stopPropagation(),s.remove()}),s.addEventListener("mouseleave",()=>s.remove())}toggleInbox(){this.inboxView?.isOpen()?this.closeInbox():this.showInbox()}showInbox(){this.closeThreadPopover(),this.inboxView||(this.inboxView=new j({shadowRoot:this.shadowRoot,strings:this.strings,locale:this.locale,currentPage:location.pathname,getComments:()=>this.comments,callbacks:{onOpenDetailScroll:e=>e.container?.scrollIntoView?.({block:"center"}),onReply:(e,t,o)=>this.addReply(e,t,o),onDelete:e=>this.deleteComment(e),onSetStatus:(e,t)=>this.setCommentStatus(e,t),onSetType:(e,t)=>this.setCommentType(e,t),onSetPriority:(e,t)=>this.setCommentPriority(e,t),onNavigateToPage:e=>{try{sessionStorage.setItem(U,String(e.id))}catch{}this._navigateTo(e.page)},onShowLightbox:e=>this.showLightbox(e),onClose:()=>this.closeInbox()}})),this.inboxView.open(),setTimeout(()=>{this._inboxClickHandler=e=>{let t=e.composedPath()[0]||e.target;!this.inboxView.el?.contains(t)&&!this.inboxBtn.contains(t)&&this.closeInbox()},document.addEventListener("mousedown",this._inboxClickHandler)},0)}closeInbox(){this.inboxView?.close(),this._inboxClickHandler&&(document.removeEventListener("mousedown",this._inboxClickHandler),this._inboxClickHandler=null)}showThreadPopover(e,t){this.closeThreadPopover();let o=this.shadowRoot.querySelector(`.${n.TOOLTIP}[data-for="${t.id}"]`);o&&o.remove();let i=Be(t,this.strings,this.locale);this.shadowRoot.appendChild(i);let s=i.querySelector(`.${n.THREAD_HEADER}`),a=V(t,{strings:this.strings,onCopy:g=>G(Y(g,{viewportWidth:window.innerWidth,viewportHeight:window.innerHeight,strings:this.strings})),onSetStatus:(g,b)=>this.setCommentStatus(g.id,b),onSetType:(g,b)=>this.setCommentType(g.id,b),onSetPriority:(g,b)=>this.setCommentPriority(g.id,b),onDelete:g=>{this.closeThreadPopover(),this.deleteComment(g.id),this.inboxView?.isOpen()&&this.inboxView.refresh()}});s.insertBefore(a,s.querySelector(`.${n.CLOSE_TOOLTIP}`));let l=Array.from(i.children).find(g=>g.classList.contains(n.SCREENSHOTS_CONTAINER));l&&l.querySelectorAll(`.${n.SCREENSHOT_IMG}`).forEach(g=>{g.addEventListener("click",b=>{b.stopPropagation(),this.showLightbox(g.src)})}),setTimeout(()=>{e?this.positionPopoverAtCircle(i,e):this.centerPopover(i)},10),i.querySelector(`.${n.CLOSE_TOOLTIP}`).addEventListener("click",g=>{g.stopPropagation(),this.closeThreadPopover()});let c=i.querySelector(`.${n.THREAD_INPUT}`),p=i.querySelector(`.${n.THREAD_SUBMIT}`),h=i.querySelector(`.${n.THREAD_INPUT_AREA} .${n.ATTACH_IMAGE_BTN}`),m=i.querySelector(`.${n.THREAD_INPUT_AREA} input[type="file"]`),u=i.querySelector(`.${n.THREAD_INPUT_AREA} .${n.SCREENSHOTS_CONTAINER}`),d=[],E=()=>{if(u.innerHTML="",d.length===0){u.classList.remove(n.ACTIVE);return}u.classList.add(n.ACTIVE),d.forEach((g,b)=>{let C=document.createElement("div");C.className=n.SCREENSHOT_ITEM;let O=document.createElement("img");O.className=n.SCREENSHOT_IMG,O.src=g,O.alt=this.strings.attachedScreenshot,O.onclick=()=>this.showLightbox(g);let N=document.createElement("button");N.className=n.SCREENSHOT_REMOVE,N.innerHTML="&times;",N.onclick=W=>{W.stopPropagation(),d.splice(b,1),E()},C.appendChild(O),C.appendChild(N),u.appendChild(C)})};h.addEventListener("click",()=>{m.click()}),m.addEventListener("change",g=>{let b=g.target.files[0];if(!b||d.length>=5)return;let C=new FileReader;C.onload=O=>{d.push(O.target.result),E()},C.readAsDataURL(b),m.value=""});let f=()=>{let g=c.value.trim();if(!g&&d.length===0)return;let b=this.addReply(t,g,d.length>0?[...d]:[]),C=i.querySelector(`.${n.THREAD_REPLIES}`),O=k(b,this.strings,this.locale);C.appendChild(O),O.querySelectorAll(`.${n.SCREENSHOT_IMG}`).forEach(N=>{N.addEventListener("click",W=>{W.stopPropagation(),this.showLightbox(N.src)})}),c.value="",d=[],E(),c.focus()};p.addEventListener("click",f),c.addEventListener("keydown",g=>{g.key==="Enter"&&!g.shiftKey&&(g.preventDefault(),f())}),this.activeThreadPopover=i,setTimeout(()=>c.focus(),50),setTimeout(()=>{this._threadClickHandler=g=>{let b=g.composedPath()[0]||g.target;!i.contains(b)&&!e?.contains(b)&&this.closeThreadPopover()},document.addEventListener("mousedown",this._threadClickHandler)},0)}closeThreadPopover(){this.activeThreadPopover&&(this.activeThreadPopover.remove(),this.activeThreadPopover=null),this._threadClickHandler&&(document.removeEventListener("mousedown",this._threadClickHandler),this._threadClickHandler=null)}showLightbox(e){this.closeLightbox();let t=document.createElement("div");t.className=n.LIGHTBOX;let o=document.createElement("img");o.className=n.LIGHTBOX_IMG,o.src=e,o.alt=this.strings.screenshotPreview;let i=document.createElement("button");i.type="button",i.className=n.LIGHTBOX_CLOSE,i.setAttribute("aria-label",this.strings.close),i.innerHTML="&times;",i.addEventListener("click",()=>this.closeLightbox()),t.appendChild(o),t.appendChild(i),t.addEventListener("click",s=>{s.target===t&&this.closeLightbox()}),this.shadowRoot.appendChild(t),this._activeLightbox=t}closeLightbox(){this._activeLightbox?.remove(),this._activeLightbox=null}addReply(e,t,o=[]){e.replies||(e.replies=[]);let i={id:Date.now(),text:t,author:this.options.user?.name||this.strings.anonymous,timestamp:new Date().toISOString(),screenshots:o};return e.replies.push(i),this._syncStorage(),this.options.onReplyAdded?.(this._serializeComment(e),this._serializeReply(i)),i}_serializeReply({id:e,text:t,author:o,timestamp:i,screenshots:s}){return{id:e,text:t,author:o,timestamp:i,screenshots:s||[]}}_serializeComment(e){return{id:e.id,text:e.text,anchor:e.anchor||null,page:e.page||location.pathname,replies:(e.replies||[]).map(t=>this._serializeReply(t)),author:e.author,createdAt:e.createdAt,screenshots:e.screenshots||[],status:e.status||"open",type:e.type||null,priority:e.priority||null,tags:e.tags?[...e.tags]:[],resolvedAt:e.resolvedAt||null,context:e.context?{...e.context}:null,contextScreenshot:e.contextScreenshot||null}}setCommentStatus(e,t){if(!M.includes(t))return!1;let o=this.comments.find(s=>s.id===e);if(!o)return!1;if(o.status===t)return!0;o.status=t,o.resolvedAt=t==="resolved"?new Date().toISOString():null;let i=this.shadowRoot?.querySelector(`[data-comment-id="${e}"]`);return i&&this.updateCommentPosition(o,i),this._syncStorage(),this.inboxView?.isOpen()&&this.inboxView.refresh(),this.options.onCommentStatusChanged?.(this._serializeComment(o)),!0}_commitUpdate(e){return this._syncStorage(),this.inboxView?.isOpen()&&this.inboxView.refresh(),this.options.onCommentUpdated?.(this._serializeComment(e)),!0}setCommentType(e,t){if(t!==null&&!y.includes(t))return!1;let o=this.comments.find(i=>i.id===e);return o?(o.type=t,this._commitUpdate(o)):!1}setCommentPriority(e,t){if(t!==null&&!S.includes(t))return!1;let o=this.comments.find(i=>i.id===e);return o?(o.priority=t,this._commitUpdate(o)):!1}setCommentTags(e,t){if(!Array.isArray(t))return!1;let o=this.comments.find(i=>i.id===e);return o?(o.tags=Ot(t),this._commitUpdate(o)):!1}serializeComments(){return this.comments.map(e=>this._serializeComment(e))}deleteComment(e){return this.comments.some(t=>t.id===e)?(this._removeComment(e),this.options.persistence==="localStorage"&&oe(ne(F().filter(t=>t.id!==e),this.serializeComments(),location.pathname)),this.options.onCommentDeleted?.(e),!0):!1}_removeComment(e){if(this.cleanupResizeObserver(e),this.mutationObservers.has(e)){try{this.mutationObservers.get(e).disconnect()}catch{}this.mutationObservers.delete(e)}this.shadowRoot.querySelector(`[data-comment-id="${e}"]`)?.remove(),this.comments=this.comments.filter(t=>t.id!==e)}loadComments(e){let t=0,o=0,i=0;if(!Array.isArray(e))return{anchored:t,orphaned:o,inactive:i};for(let s of e){if(!s||s.id==null||typeof s.text!="string"){console.warn("HellDots: skipping malformed serialized comment",s);continue}this._removeComment(s.id);let a={id:s.id,text:s.text,anchor:s.anchor||null,anchorState:"orphaned",target:null,hidden:!1,page:s.page||location.pathname,container:null,relativeX:0,relativeY:0,replies:Array.isArray(s.replies)?[...s.replies]:[],author:s.author||this.strings.anonymous,createdAt:s.createdAt||new Date().toISOString(),screenshots:Array.isArray(s.screenshots)?[...s.screenshots]:[],status:s.status==="closed"?"resolved":M.includes(s.status)?s.status:"open",type:y.includes(s.type)?s.type:null,priority:S.includes(s.priority)?s.priority:null,tags:Array.isArray(s.tags)?[...s.tags]:[],resolvedAt:s.resolvedAt||null,context:s.context||null,contextScreenshot:s.contextScreenshot||null};if(s.page&&s.page!==location.pathname){a.anchorState="inactive",this.comments.push(a),i++;continue}let l=s.anchor?ye(s.anchor):null;l?(a.container=l.element,a.relativeX=s.anchor.relativeX,a.relativeY=s.anchor.relativeY,a.anchorState="anchored",this.comments.push(a),this.renderCommentCircle(a),t++):(this.comments.push(a),o++,this.options.onAnchorLost?.(this._serializeComment(a)))}return{anchored:t,orphaned:o,inactive:i}}centerPopover(e){let t=e.getBoundingClientRect(),o=Math.max(10,(window.innerWidth-(t.width||400))/2),i=Math.max(10,(window.innerHeight-t.height)/2);e.style.left=`${o}px`,e.style.top=`${i}px`}positionPopoverAtCircle(e,t){let o=t.getBoundingClientRect(),i=o.left+o.width/2,s=o.top+o.height/2,a=28,l=a/2+10,c=i+l,p=s-a/2;c+400>window.innerWidth&&(c=i-l-400),c=Math.max(10,c);let h=e.getBoundingClientRect();p+h.height>window.innerHeight&&(p=window.innerHeight-h.height-10),p=Math.max(10,p),e.style.left=`${c}px`,e.style.top=`${p}px`}createPreviewCircle(e,t){this.removePreviewCircle();let o=document.createElement("div");o.className=`${n.CIRCLE} ${n.PREVIEW_CIRCLE}`,o.style.position="absolute";let i=14;o.style.left=`${e+i}px`,o.style.top=`${t+i}px`,o.style.transform="translate(-50%, -50%)",o.style.pointerEvents="none",this.overlay.appendChild(o),this.previewCircle=o}removePreviewCircle(){this.previewCircle?.remove(),this.previewCircle=null}cleanupResizeObserver(e){if(this.resizeObservers&&this.resizeObservers.has(e)){let{circle:t,observer:o}=this.resizeObservers.get(e);o&&o.disconnect(),t&&t.parentNode&&t.parentNode.removeChild(t),this.resizeObservers.delete(e)}}validateAndCalculatePosition(e,t){if(!e.container||!t)return null;let o=e.container.getBoundingClientRect(),i=o.width,s=o.height;if(i<=0||s<=0)return null;let a=e.relativeX*i,l=e.relativeY*s,c=28,p=Math.max(0,Math.min(a,i-c)),h=Math.max(0,Math.min(l,s-c)),m=p/i,u=h/s;return{absoluteX:p,absoluteY:h,relativeX:m,relativeY:u,containerWidth:i,containerHeight:s,containerLeft:o.left,containerTop:o.top}}_isAnchorTargetVisible(e){let t=e.target;if((!t||!t.isConnected)&&e.anchor?.targetSelector){try{t=document.querySelector(e.anchor.targetSelector)}catch{t=null}e.target=t||null}if(!t||!t.isConnected)return!0;let o=t.getBoundingClientRect();return o.width>0&&o.height>0}_isMarkerOccluded(e,t,o){if(typeof document.elementsFromPoint!="function"||t<0||o<0||t>=window.innerWidth||o>=window.innerHeight)return!1;let s=document.elementsFromPoint(t,o).find(c=>c.tagName.toLowerCase()!==A.toLowerCase());if(!s)return!1;let a=e.target?.isConnected?e.target:null;if(a&&(a.contains(s)||s.contains(a)))return!1;let l=e.container;if(!l?.isConnected)return!1;if(!l.contains(s)&&!s.contains(l))return!0;if(l.contains(s)&&s!==l){for(let c=s;c&&c!==l;c=c.parentElement)if(this._looksLikeModalLayer(c,a))return!0}return!1}_looksLikeModalLayer(e,t){if(t&&e.contains(t))return!1;if(e.matches?.('dialog, [aria-modal="true"], [role="dialog"]'))return!0;if(getComputedStyle(e).position!=="fixed")return!1;let o=e.getBoundingClientRect();return o.width>=window.innerWidth*.5&&o.height>=window.innerHeight*.5}_dismissMarkerUi(e){this.shadowRoot.querySelector(`.${n.TOOLTIP}[data-for="${e.id}"]`)?.remove(),this.activeThreadPopover?.dataset.for===String(e.id)&&this.closeThreadPopover()}updateCommentPosition(e,t){if(e.status==="resolved"){t&&(t.style.display="none");return}let o=this.validateAndCalculatePosition(e,t);o&&!this._isAnchorTargetVisible(e)&&(o=null);let i=e.hidden===!0;if(!o){t&&e.container&&(e.hidden=!0,t.style.display="none",this._dismissMarkerUi(e),!i&&this.inboxView?.isOpen()&&this.inboxView.refresh());return}let s=14,a=o.containerLeft+o.absoluteX+s,l=o.containerTop+o.absoluteY+s;if(this._isMarkerOccluded(e,a,l)){e.hidden=!0,t.style.display="none",this._dismissMarkerUi(e),!i&&this.inboxView?.isOpen()&&this.inboxView.refresh();return}e.hidden=!1,t.style.display="",i&&this.inboxView?.isOpen()&&this.inboxView.refresh(),t.style.left=`${a}px`,t.style.top=`${l}px`,t.style.transform="translate(-50%, -50%)",t.style.position="absolute",e.relativeX=o.relativeX,e.relativeY=o.relativeY}setupResizeHandlers(){this.scheduleUpdatePositions=()=>{this._pendingRaf||(this._pendingRaf=requestAnimationFrame(()=>{this._pendingRaf=null,this.positionValidationEnabled&&this.comments.forEach(e=>{let t=this.shadowRoot.querySelector(`[data-comment-id="${e.id}"]`);t&&this.updateCommentPosition(e,t)})}))},this.windowResizeHandler=()=>{this.scheduleUpdatePositions()},window.addEventListener("resize",this.windowResizeHandler,{passive:!0}),this.scrollHandler=()=>{this.scheduleUpdatePositions()},window.addEventListener("scroll",this.scrollHandler,{capture:!0,passive:!0}),this.loadHandler=()=>{this.scheduleUpdatePositions()},window.addEventListener("load",this.loadHandler),window.MutationObserver&&(this._globalMutationObserver=new MutationObserver(()=>{this.scheduleUpdatePositions()}),this._globalMutationObserver.observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["style","class","hidden","open"]}))}debugPosition(e,t){if(!e||!t)return;let o=e.container.getBoundingClientRect(),i=t.getBoundingClientRect(),s=e.relativeX*o.width,a=e.relativeY*o.height;console.log("Position Debug:",{commentId:e.id,relativePosition:{x:e.relativeX,y:e.relativeY},containerRect:{left:o.left,top:o.top,width:o.width,height:o.height},circlePosition:{left:i.left,top:i.top,centerX:i.left+i.width/2,centerY:i.top+i.height/2},expectedPosition:{x:s,y:a},offset:{x:i.left+i.width/2-(o.left+s),y:i.top+i.height/2-(o.top+a)}})}createResizeObserver(e,t){if(!window.ResizeObserver){console.warn("ResizeObserver not supported, position validation will be limited");return}let o=new ResizeObserver(i=>{if(this.positionValidationEnabled)for(let s of i)s.target===e.container&&this.updateCommentPosition(e,t)});o.observe(e.container),this.resizeObservers.set(e.id,{circle:t,observer:o,container:e.container})}createMutationObserver(e){if(!window.MutationObserver)return;if(this.mutationObservers.has(e.id)){try{this.mutationObservers.get(e.id).disconnect()}catch{}this.mutationObservers.delete(e.id)}let t=new MutationObserver(()=>{this.scheduleUpdatePositions()});t.observe(e.container,{attributes:!0,attributeFilter:void 0,childList:!0,subtree:!0}),this.mutationObservers.set(e.id,t)}cleanup(){this.closeThreadPopover(),this.closeInbox(),this.closeLightbox(),this.removePreviewCircle(),this._selectionRect?.remove(),this._pendingScreenshots=[],this._handleDocumentClickBound&&document.removeEventListener("mousedown",this._handleDocumentClickBound),this.windowResizeHandler&&window.removeEventListener("resize",this.windowResizeHandler),this.scrollHandler&&window.removeEventListener("scroll",this.scrollHandler,{capture:!0}),this.loadHandler&&window.removeEventListener("load",this.loadHandler),this._globalMutationObserver&&(this._globalMutationObserver.disconnect(),this._globalMutationObserver=null),this.resizeObservers&&(this.resizeObservers.forEach(({observer:e})=>{e&&e.disconnect()}),this.resizeObservers.clear()),this.mutationObservers&&(this.mutationObservers.forEach(e=>{try{e.disconnect()}catch{}}),this.mutationObservers.clear()),this.keydownHandler&&document.removeEventListener("keydown",this.keydownHandler),this.toolbar&&this.toolbar.parentNode&&this.toolbar.parentNode.removeChild(this.toolbar),this.commentBox&&this.commentBox.parentNode&&this.commentBox.parentNode.removeChild(this.commentBox),this.overlay&&this.overlay.parentNode&&this.overlay.parentNode.removeChild(this.overlay),document.body.classList.remove(n.COMMENT_CURSOR),document.getElementById(T.GLOBAL_STYLES)?.remove(),this.comments.forEach(e=>{let t=this.shadowRoot.querySelector(`[data-comment-id="${e.id}"]`);t&&t.parentNode&&t.parentNode.removeChild(t)})}injectStyles(){let e=this.shadowRoot.getElementById(T.STYLES);e&&e.remove();let t=document.createElement("style");t.id=T.STYLES,t.textContent=ue(),this.shadowRoot.appendChild(t);let o=document.getElementById(T.GLOBAL_STYLES);o&&o.remove();let i=document.createElement("style");i.id=T.GLOBAL_STYLES,i.textContent=me(),document.head.appendChild(i)}},Me=ie;function yt(r={}){let{autoInit:e=!0,...t}=r,o=()=>new Me(t);return e?o():o}var fo=yt;export{Me as CommentOverlay,yt as createCommentOverlay,fo as default};
+//# sourceMappingURL=helldots.esm.js.map