@visulima/dev-toolbar 0.0.1 → 1.0.0-alpha.10

package/dist/apps/inspector/annotation-overlay.d.ts

@@ -0,0 +1,55 @@
+/**
+ * Annotation overlay — renders annotation markers on the page canvas,
+ * provides inline annotation form, detail popup, edit mode, screenshot capture,
+ * freeze mode, markdown export, and SPA navigation persistence.
+ *
+ * All DOM elements are injected into document.body (outside Shadow DOM)
+ * to match the inspector's rendering approach.
+ */
+import type { Annotation, BoundingBox } from "../../types/annotations.d.ts";
+/**
+ * Returns true when the Annotations panel app is registered in the toolbar.
+ */
+export declare const isAnnotationsAppEnabled: () => boolean;
+/**
+ * Convert viewport click coords to page-absolute coords for storage.
+ * x = percentage of viewport width, y = absolute page Y (scrollY + clientY).
+ * For fixed elements, y stays as viewport-relative (no scrollY offset).
+ */
+export declare const toPageCoords: (clientX: number, clientY: number, fixed?: boolean) => {
+    x: number;
+    y: number;
+};
+/** Load annotations from server and render markers. */
+export declare const loadAndShowMarkers: () => Promise<void>;
+/** Remove all annotation markers and detach listeners. */
+export declare const removeAllMarkers: () => void;
+/** Close all annotation popups (form, detail) and area outline, but keep markers. */
+export declare const closeAnnotationPopups: () => void;
+/** Whether the annotation form popup is currently open. */
+export declare const isAnnotationFormOpen: () => boolean;
+/** Shake the annotation form to draw attention. */
+export declare const shakeAnnotationForm: () => void;
+/**
+ * Show annotation form popup. Captures selectedText, nearbyText, framework context,
+ * and generates a smart CSS selector.
+ */
+export declare const showAnnotationForm: (element: Element, rect: DOMRect, source: string | undefined, editAnnotation?: Annotation, clickPoint?: {
+    x: number;
+    y: number;
+}) => void;
+/**
+ * Show annotation form for a multi-select (drag) region.
+ * Creates a single annotation covering multiple elements.
+ */
+export declare const showMultiSelectForm: (elements: Element[], selectionRect: DOMRect, boundingBoxes: BoundingBox[]) => void;
+/**
+ * Show annotation form for an empty area selection (no elements found in drag region).
+ * Like agentation: creates an "Area selection" annotation with the region as bounding box.
+ * Shows a green dashed outline around the selected region.
+ */
+export declare const showAreaSelectionForm: (selectionRect: DOMRect) => void;
+export declare const attachMarkdownShortcut: () => void;
+export declare const detachMarkdownShortcut: () => void;
+/** Check if a target is over an annotation overlay element. */
+export declare const isOverAnnotationOverlay: (target: Element | undefined) => boolean;

package/dist/apps/inspector/annotation-settings.d.ts

@@ -0,0 +1,33 @@
+/**
+ * Annotation-specific settings — output detail level, marker appearance,
+ * interaction behavior. Persisted in localStorage.
+ */
+export type OutputDetailLevel = "compact" | "detailed" | "forensic" | "standard";
+export type MarkerClickBehavior = "delete" | "detail" | "edit";
+export interface MarkerColor {
+    /** Solid background for the marker */
+    bg: string;
+    /** Slightly darker ring / shadow tint */
+    border: string;
+    /** Text color inside the marker (white or dark for contrast) */
+    fg: string;
+    /** Translucent version for hover highlight overlay on elements */
+    highlightBg: string;
+    label: string;
+    name: string;
+}
+export declare const MARKER_COLORS: MarkerColor[];
+export interface AnnotationSettings {
+    /** Block clicks on interactive elements (buttons, links, inputs) while active */
+    blockInteractions: boolean;
+    /** What happens when you click a marker */
+    markerClickBehavior: MarkerClickBehavior;
+    /** Marker color name (from MARKER_COLORS) */
+    markerColorName: string;
+    /** Output detail level for markdown export */
+    outputDetail: OutputDetailLevel;
+}
+export declare const DEFAULT_SETTINGS: AnnotationSettings;
+export declare const loadSettings: () => AnnotationSettings;
+export declare const saveSettings: (settings: AnnotationSettings) => void;
+export declare const getMarkerColor: (settings?: AnnotationSettings) => MarkerColor;

package/dist/apps/inspector/element-utils.d.ts

@@ -0,0 +1,115 @@
+/**
+ * Element utility functions for annotation — shadow DOM piercing, CSS selector
+ * generation, smart naming, text extraction, a11y capture, computed styles,
+ * framework detection, screenshot, freeze, markdown export.
+ */
+import type { AccessibilityInfo, BoundingBox, FrameworkContext } from "../../types/annotations.d.ts";
+export declare const deepElementFromPoint: (x: number, y: number) => Element | null;
+/**
+ * Get the viewport-relative bounding rect for an element, accounting for
+ * it potentially being inside nested iframes.
+ */
+export declare const getViewportRect: (element: Element) => DOMRect;
+/**
+ * Pierce mode: Cmd+hover to find the actual element underneath invisible
+ * overlays, animation wrappers, and empty container divs.
+ *
+ * Two-pass approach:
+ *   1. Find elements with direct text content (skips empty wrappers)
+ *   2. If no text found, return the smallest visible element (catches
+ *      visual-only elements like timeline bars, chart segments, swatches)
+ */
+export declare const pierceElementFromPoint: (x: number, y: number) => Element | null;
+export declare const getParentElement: (element: Element) => Element | null;
+/**
+ * Check if element or any ancestor has fixed or sticky positioning.
+ */
+export declare const isElementFixed: (element: Element) => boolean;
+/**
+ * Generate a human-readable element label like agentation:
+ * button "Submit", link to /page, image "alt text", input[type=email]
+ */
+export declare const getElementLabel: (element: Element) => string;
+/**
+ * Generate a unique CSS selector for an element.
+ * Strategy: ID → unique class combo → nth-of-type fallback.
+ */
+export declare const generateSelector: (element: Element) => string;
+/**
+ * Clean CSS classes by stripping module hash suffixes.
+ */
+export declare const cleanCssClasses: (classes: DOMTokenList) => string;
+/**
+ * Build full DOM ancestry path (body > main > article > section > p).
+ * Marks shadow DOM boundary crossings with ⟨shadow⟩.
+ */
+export declare const getFullDomPath: (element: Element) => string;
+/**
+ * Get sibling elements as context (up to 5 siblings).
+ */
+export declare const getNearbyElements: (element: Element) => string;
+/**
+ * Extract nearby text content from an element (up to maxLength chars).
+ */
+export declare const getNearbyText: (element: Element, maxLength?: number) => string;
+/**
+ * Capture currently selected text (up to maxLength chars).
+ */
+export declare const getSelectedText: (maxLength?: number) => string;
+/**
+ * Capture accessibility attributes from an element.
+ */
+export declare const captureAccessibility: (element: Element) => AccessibilityInfo;
+/**
+ * Capture key computed styles for forensic context.
+ */
+export declare const captureComputedStyles: (element: Element) => string;
+/**
+ * Detect framework component for an element.
+ */
+export declare const detectFrameworkComponent: (element: Element) => FrameworkContext | undefined;
+/**
+ * Capture a screenshot of an element's bounding area.
+ *
+ * Uses the Screen Capture API (getDisplayMedia) to capture a frame from the
+ * screen, then crops to the element's bounding rect. This is the most reliable
+ * approach — works with external CSS, images, shadow DOM, and canvas content.
+ *
+ * Falls back to null if the user denies permission or the API is unavailable.
+ */
+export declare const captureElementScreenshot: (element: Element) => Promise<string | null>;
+/**
+ * Get all elements within a rectangular region.
+ * Searches across shadow DOM and same-origin iframes.
+ */
+export declare const getElementsInRect: (rect: DOMRect) => Element[];
+/**
+ * Get bounding boxes from a list of elements (iframe-aware).
+ */
+export declare const getElementBoundingBoxes: (elements: Element[]) => BoundingBox[];
+/**
+ * Output detail levels:
+ * - compact: "Element: comment (re: "selected text...")"
+ * - standard: Element + location + component + feedback
+ * - detailed: + classes, position, context text
+ * - forensic: + full DOM path, styles, accessibility, nearby elements
+ */
+export declare const annotationsToMarkdown: (annotations: {
+    accessibility?: AccessibilityInfo;
+    comment: string;
+    computedStyles?: string;
+    cssClasses?: string;
+    elementLabel?: string;
+    elementPath?: string;
+    elementTag: string;
+    frameworkContext?: FrameworkContext;
+    fullPath?: string;
+    intent: string;
+    nearbyElements?: string;
+    nearbyText?: string;
+    selectedText?: string;
+    severity: string;
+    source?: string;
+    status: string;
+    url: string;
+}[], detail?: "compact" | "detailed" | "forensic" | "standard") => string;

package/dist/apps/inspector/freeze-animations.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Freeze Animations — comprehensive animation/timer freeze system.
+ *
+ * Monkey-patches setTimeout, setInterval, and requestAnimationFrame so that
+ * callbacks are silently queued while frozen. Also injects CSS to pause
+ * CSS animations/transitions, pauses WAAPI animations, and pauses videos.
+ *
+ * Patches are installed as a side effect of importing this module.
+ * Toolbar/popup code must import `originalSetTimeout` to bypass the patch.
+ *
+ * Based on agentation's freeze-animations.ts pattern.
+ */
+/** Original (unpatched) setTimeout — use for toolbar/popup animations */
+export declare const originalSetTimeout: typeof setTimeout;
+/** Whether animations are currently frozen */
+export declare const isFrozen: () => boolean;
+/** Freeze all animations, timers, and videos */
+export declare const freezeAll: () => void;
+/** Unfreeze — resume everything and replay queued callbacks */
+export declare const unfreezeAll: () => void;
+/** Toggle freeze state */
+export declare const toggleFreeze: () => boolean;

package/dist/apps/inspector/index.d.ts

@@ -0,0 +1,3 @@
+import type { DevToolbarApp } from "../../types/app.d.ts";
+declare const inspectorApp: DevToolbarApp;
+export default inspectorApp;

package/dist/apps/inspector/index.js

@@ -0,0 +1,30 @@
+var Bn=Object.defineProperty;var ae=(e,t)=>Bn(e,"name",{value:t,configurable:!0});import{l as _t,g as Gt}from"../../packem_shared/annotation-settings-Bv0TH4WI.js";import{b as Mn}from"../../packem_shared/use-frame-state-CxrlPUM5.js";const zn=`<!-- @license lucide-static v1.8.0 - ISC -->
+<svg
+  class="lucide lucide-inspect"
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M12.034 12.681a.498.498 0 0 1 .647-.647l9 3.5a.5.5 0 0 1-.033.943l-3.444 1.068a1 1 0 0 0-.66.66l-1.067 3.443a.5.5 0 0 1-.943.033z" />
+  <path d="M21 11V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h6" />
+</svg>
+`;var Pn=Object.defineProperty,P=ae((e,t)=>Pn(e,"name",{value:t,configurable:!0}),"l$2");const Zt=P(e=>{try{const t=e.contentDocument;return t!==null&&t.body!==null}catch{return!1}},"isSameOriginIframe"),_e=P((e,t)=>{let n=document.elementFromPoint(e,t);if(!n)return null;let o=!0;for(;o;){for(o=!1;n?.shadowRoot;){const i=n.shadowRoot.elementFromPoint(e,t);if(!i||i===n)break;n=i,o=!0}if(n?.tagName==="IFRAME"){const i=n;if(Zt(i)){const r=i.getBoundingClientRect(),a=e-r.left,l=t-r.top;try{const d=i.contentDocument.elementFromPoint(a,l);d&&d!==i&&(n=d,o=!0)}catch{}}}}return n},"deepElementFromPoint"),st=P(e=>{const t=e.getBoundingClientRect();let n=0,o=0,i=e.ownerDocument;for(;i!==document;){const r=i.defaultView?.frameElement;if(!r)break;const a=r.getBoundingClientRect();n+=a.left,o+=a.top,i=r.ownerDocument}return new DOMRect(t.x+n,t.y+o,t.width,t.height)},"getViewportRect"),Rn=new Set(["ARTICLE","ASIDE","DIV","FOOTER","HEADER","MAIN","NAV","SECTION","SPAN"]),gt=P(e=>{if(typeof e.checkVisibility=="function")return!e.checkVisibility({checkOpacity:!0,checkVisibilityCSS:!0});let t=e;for(;t&&t!==document.body;){if(getComputedStyle(t).opacity==="0")return!0;t=t.parentElement}return!1},"isEffectivelyInvisible"),Dt=P(e=>{if(!Rn.has(e.tagName))return!0;for(const t of e.childNodes)if(t.nodeType===Node.TEXT_NODE&&t.textContent?.trim())return!0;return!1},"hasDirectContent"),rt=P((e,t)=>{const n=document.elementFromPoint(e,t);if(!n)return null;let o=n;for(;o.shadowRoot;){const x=o.shadowRoot.elementFromPoint(e,t);if(!x||x===o)break;o=x}if(Dt(o)&&!gt(o))return o;const i=document.elementsFromPoint(e,t);for(const x of i){if(x===n||x===document.documentElement||x===document.body)continue;let h=x;for(;h.shadowRoot;){const c=h.shadowRoot.elementFromPoint(e,t);if(!c||c===h)break;h=c}if(Dt(h)&&!gt(h))return h}const r=o.getBoundingClientRect(),a=r.width*r.height;let l=null,d=a;for(const x of i){if(x===n||x===document.documentElement||x===document.body||gt(x))continue;const h=x.getBoundingClientRect(),c=h.width*h.height;c>0&&c<d&&(l=x,d=c)}return l??o},"pierceElementFromPoint"),en=P(e=>{if(e.parentElement)return e.parentElement;const t=e.getRootNode();return t instanceof ShadowRoot?t.host:null},"getParentElement"),tn=P(e=>{let t=e;for(;t;){const{position:n}=getComputedStyle(t);if(n==="fixed"||n==="sticky")return!0;t=en(t)}return!1},"isElementFixed"),Tt=P(e=>{const t=e.tagName.toLowerCase();if(t==="button"||e.type==="submit"){const r=e.textContent?.trim().slice(0,40);return r?`button "${r}"`:"button"}if(t==="a"){const r=e.getAttribute("href"),a=e.textContent?.trim().slice(0,30);return r&&!r.startsWith("javascript:")?a?`link "${a}" to ${r}`:`link to ${r}`:a?`link "${a}"`:"link"}if(t==="img"){const{alt:r}=e;return r?`image "${r.slice(0,40)}"`:"image"}if(t==="input"){const{type:r}=e,{placeholder:a}=e;return a?`input[${r}] "${a.slice(0,30)}"`:`input[${r}]`}if(t==="textarea"){const{placeholder:r}=e;return r?`textarea "${r.slice(0,30)}"`:"textarea"}if(/^h[1-6]$/.test(t)){const r=e.textContent?.trim().slice(0,50);return r?`${t} "${r}"`:t}if(t==="select"){const r=e.getAttribute("aria-label")??e.name;return r?`select "${r}"`:"select"}const n=e.textContent?.trim();if(n&&n.length<=30&&n.length>0)return`${t} "${n}"`;const o=e.id?`#${e.id}`:"",i=e.classList.length>0?`.${[...e.classList].slice(0,2).join(".")}`:"";return`${t}${o}${i}`||t},"getElementLabel"),In=new Set(["active","checked","disabled","focus","hover","selected","visited"]),nn=P(e=>{if(e.id)return`#${CSS.escape(e.id)}`;const t=[...e.classList].filter(i=>!In.has(i)&&!i.startsWith("__")&&!Dn(i));if(t.length>0){const i=e.tagName.toLowerCase();for(const r of t){const a=`${i}.${CSS.escape(r)}`;if(document.querySelectorAll(a).length===1)return a}for(let r=0;r<t.length;r++)for(let a=r+1;a<t.length;a++){const l=`${i}.${CSS.escape(t[r])}.${CSS.escape(t[a])}`;if(document.querySelectorAll(l).length===1)return l}}const n=[];let o=e;for(;o&&o!==document.body&&o!==document.documentElement;){let i=o.tagName.toLowerCase();if(o.id){n.unshift(`#${CSS.escape(o.id)}`);break}const r=o.parentElement;if(r){const a=[...r.children].filter(l=>l.tagName===o.tagName);if(a.length>1){const l=a.indexOf(o)+1;i+=`:nth-of-type(${l})`}}n.unshift(i),o=r}return n.join(" > ")},"generateSelector"),on=/[_-][a-f0-9]{5,}$/i,Dn=P(e=>on.test(e),"isModuleHash"),rn=P(e=>Array.from(e,t=>t.replace(on,"")).filter(Boolean).join(" "),"cleanCssClasses"),an=P(e=>{const t=[];let n=e;for(;n&&n!==document.documentElement;){const o=n.tagName.toLowerCase();if(o==="body"){t.unshift("body");break}const i=n.getRootNode();i instanceof ShadowRoot?(t.unshift(`${o} ⟨shadow⟩`),n=i.host):(t.unshift(o),n=n.parentElement)}return t.join(" > ")},"getFullDomPath"),sn=P(e=>{const t=e.parentElement;return t?[...t.children].filter(n=>n!==e).slice(0,5).map(n=>n.tagName.toLowerCase()+(n.id?`#${n.id}`:"")).join(", "):""},"getNearbyElements"),ln=P((e,t=120)=>{const n=e.textContent?.trim()??"";if(n.length>0)return n.length>t?`${n.slice(0,t)}…`:n;const o=e.getAttribute("aria-label")??e.getAttribute("title")??"";return o?o.length>t?`${o.slice(0,t)}…`:o:e instanceof HTMLInputElement||e instanceof HTMLTextAreaElement?e.placeholder?.slice(0,t)??"":""},"getNearbyText"),cn=P((e=80)=>{const t=globalThis.getSelection();if(!t||t.isCollapsed)return"";const n=t.toString().trim();return n.length>e?`${n.slice(0,e)}…`:n},"getSelectedText"),Fn=new Set(["A","BUTTON","INPUT","SELECT","TEXTAREA"]),dn=P(e=>{const t=e,n=t.getAttribute("role")??t.tagName.toLowerCase(),o=t.getAttribute("aria-label")??void 0,i=t.getAttribute("aria-describedby")?document.getElementById(t.getAttribute("aria-describedby"))?.textContent?.trim():void 0,r=t.getAttribute("tabindex"),a=r===null?void 0:Number.parseInt(r,10),l=Fn.has(t.tagName)||a!==void 0&&a>=0;return{ariaDescribedBy:i,ariaLabel:o,focusable:l,role:n===t.tagName.toLowerCase()?void 0:n,tabindex:a}},"captureAccessibility"),On=["display","position","color","background-color","font-size","font-family","font-weight","line-height","padding","margin","border","width","height","overflow","z-index","opacity"],wt=P(e=>{const t=getComputedStyle(e),n=[];for(const o of On){const i=t.getPropertyValue(o);i&&i!=="normal"&&i!=="none"&&i!=="auto"&&i!=="0px"&&n.push(`${o}: ${i}`)}return n.join("; ")},"captureComputedStyles"),jn=P(e=>{const t=Object.keys(e).find(l=>l.startsWith("__reactFiber$")||l.startsWith("__reactInternalInstance$"));if(!t)return;let n=e[t],o,i,r;const a=[];for(;n;){if(typeof n.type=="function"||typeof n.type=="object"){const l=n.type?.displayName??n.type?.name;l&&!l.startsWith("_")&&l!=="Fragment"&&l!=="Suspense"&&l.length>1&&(a.push(l),o||(o=l,n._debugSource&&(i=n._debugSource.fileName,r=n._debugSource.lineNumber)))}n=n.return}if(o)return{componentName:o,componentStack:a.length>1?a.reverse():void 0,framework:"react",sourceFile:i,sourceLine:r}},"detectReact"),Nn=P(e=>{let t=e.__vueParentComponent;if(!t){let r=e;for(;r&&(t=r.__vueParentComponent,!t);)r=r.parentElement}if(!t)return;const n=t.type?.__name??t.type?.name??t.type?.__file?.split("/").pop()?.replace(".vue","");if(!n)return;const o=[n];let{parent:i}=t;for(;i;){const r=i.type?.__name??i.type?.name;r&&o.push(r),i=i.parent}return{componentName:n,componentStack:o.length>1?o.reverse():void 0,framework:"vue",sourceFile:t.type?.__file}},"detectVue"),qn=P(e=>{let t=e;for(;t;){const n=t.__svelte_meta;if(n){const o=n.loc?.file??"";return{componentName:o.split("/").pop()?.replace(".svelte","")??"Unknown",framework:"svelte",sourceFile:o,sourceLine:n.loc?.line}}t=t.parentElement}},"detectSvelte"),pn=P(e=>jn(e)??Nn(e)??qn(e),"detectFrameworkComponent"),un=P(async e=>{try{const t=e.getBoundingClientRect(),n=20,o=window.devicePixelRatio||1,i=await navigator.mediaDevices.getDisplayMedia({audio:!1,video:{displaySurface:"browser"}});if(!i.getVideoTracks()[0])return i.getTracks().forEach(b=>b.stop()),null;const r=document.createElement("video");r.srcObject=i,r.muted=!0,await r.play(),await new Promise(b=>{requestAnimationFrame(()=>b())});const a=document.createElement("canvas");a.width=r.videoWidth,a.height=r.videoHeight;const l=a.getContext("2d");if(!l)return i.getTracks().forEach(b=>b.stop()),null;l.drawImage(r,0,0),i.getTracks().forEach(b=>b.stop());const d=Math.max(0,(t.left-n)*o),x=Math.max(0,(t.top-n)*o),h=Math.min((t.width+n*2)*o,a.width-d),c=Math.min((t.height+n*2)*o,a.height-x),u=document.createElement("canvas");u.width=h,u.height=c;const p=u.getContext("2d");return p?(p.drawImage(a,d,x,h,c,0,0,h,c),u.toDataURL("image/png")):null}catch{return null}},"captureElementScreenshot"),Hn=P(e=>{const t=[],n=P(o=>{for(const i of o.querySelectorAll(e))t.push(i);for(const i of o.querySelectorAll("iframe"))if(Zt(i))try{n(i.contentDocument)}catch{}},"searchDocument");return n(document),t},"querySelectorAllWithIframes"),mn=P(e=>{const t=[],n=Math.max(10,e.width/20),o=Math.max(10,e.height/20),i=new Set;for(let{x:a}=e;a<=e.x+e.width;a+=n)for(let{y:l}=e;l<=e.y+e.height;l+=o){const d=_e(a,l);if(d&&!i.has(d)&&d.tagName!=="BODY"&&d.tagName!=="HTML"&&!d.tagName.includes("-")){const x=st(d);x.left>=e.x-5&&x.top>=e.y-5&&x.right<=e.x+e.width+5&&x.bottom<=e.y+e.height+5&&(i.add(d),t.push(d))}}const r="button, a, input, img, p, h1, h2, h3, h4, h5, h6, li, label, td, th";for(const a of Hn(r)){if(i.has(a)||a.tagName==="BODY"||a.tagName==="HTML")continue;const l=st(a);l.width>window.innerWidth*.8&&l.height>window.innerHeight*.5||l.width<10||l.height<10||l.left<e.x+e.width&&l.right>e.x&&l.top<e.y+e.height&&l.bottom>e.y&&(i.add(a),t.push(a))}return t.filter(a=>!t.some(l=>l!==a&&a.contains(l)))},"getElementsInRect"),gn=P(e=>e.map(t=>{const n=st(t);return{height:n.height,width:n.width,x:n.x,y:n.y}}),"getElementBoundingBoxes"),Ct=P((e,t="standard")=>{if(e.length===0)return`# Annotations
+
+No annotations found.`;if(t==="compact"){const o=[`# Annotations (${e.length})`,""];for(const i of e){const r=i.elementLabel??i.elementTag,a=i.selectedText?` (re: "${i.selectedText.slice(0,30)}...")`:"";o.push(`- **${r}:** ${i.comment}${a}`)}return o.join(`
+`)}const n=["# Annotations","",`> ${e.length} annotation(s)`,""];for(const[o,i]of e.entries()){const r=i.elementLabel??i.elementTag;if(n.push(`## ${o+1}. [${i.intent.toUpperCase()}] ${i.severity} — ${r}`,"",`**Status:** ${i.status}`,`**URL:** ${i.url}`),i.elementPath&&n.push(`**Selector:** \`${i.elementPath}\``),i.source&&n.push(`**Source:** \`${i.source}\``),i.frameworkContext){const a=i.frameworkContext;n.push(`**Component:** ${a.componentName} (${a.framework})`),a.componentStack&&a.componentStack.length>1&&n.push(`**Stack:** ${a.componentStack.join(" > ")}`),a.sourceFile&&n.push(`**File:** \`${a.sourceFile}${a.sourceLine?`:${a.sourceLine}`:""}\``)}i.selectedText&&n.push(`**Selected:** "${i.selectedText}"`),(t==="detailed"||t==="forensic")&&(i.cssClasses&&n.push(`**Classes:** \`${i.cssClasses}\``),i.nearbyText&&n.push(`**Context:** ${i.nearbyText}`),i.fullPath&&n.push(`**DOM Path:** \`${i.fullPath}\``)),t==="forensic"&&(i.accessibility?.role&&n.push(`**Role:** ${i.accessibility.role}`),i.nearbyElements&&n.push(`**Nearby:** ${i.nearbyElements}`),i.computedStyles&&n.push(`**Styles:** \`${i.computedStyles}\``)),n.push("",i.comment,"","---","")}return n.join(`
+`)},"annotationsToMarkdown"),Vn=Object.defineProperty({__proto__:null,annotationsToMarkdown:Ct,captureAccessibility:dn,captureComputedStyles:wt,captureElementScreenshot:un,cleanCssClasses:rn,deepElementFromPoint:_e,detectFrameworkComponent:pn,generateSelector:nn,getElementBoundingBoxes:gn,getElementLabel:Tt,getElementsInRect:mn,getFullDomPath:an,getNearbyElements:sn,getNearbyText:ln,getParentElement:en,getSelectedText:cn,getViewportRect:st,isElementFixed:tn,pierceElementFromPoint:rt},Symbol.toStringTag,{value:"Module"});var Yn=Object.defineProperty,ue=ae((e,t)=>Yn(e,"name",{value:t,configurable:!0}),"r$1");const Xn=["id^='__vdt_'","class*='__vdt_'"],xt=Xn.flatMap(e=>[`:not([${e}])`,`:not([${e}] *)`]).join(""),$t="__vdt_freeze_styles",ht="__vdt_freeze_state",ce=1e3,Un=ue(()=>{if(globalThis.window===void 0)return{frozen:!1,frozenRAFQueue:[],frozenTimeoutQueue:[],installed:!0,origRAF:ue((()=>0),"origRAF"),origSetInterval:ue((()=>0),"origSetInterval"),origSetTimeout:ue((()=>0),"origSetTimeout"),pausedAnimations:[]};const e=globalThis;return e[ht]||(e[ht]={frozen:!1,frozenRAFQueue:[],frozenTimeoutQueue:[],installed:!1,origRAF:null,origSetInterval:null,origSetTimeout:null,pausedAnimations:[]}),e[ht]},"getState"),E=Un();globalThis.window!==void 0&&!E.installed&&(E.origSetTimeout=globalThis.setTimeout.bind(globalThis),E.origSetInterval=globalThis.setInterval.bind(globalThis),E.origRAF=globalThis.requestAnimationFrame.bind(globalThis),globalThis.setTimeout=(e,t,...n)=>typeof e=="string"?E.origSetTimeout(e,t):E.origSetTimeout((...o)=>{E.frozen?E.frozenTimeoutQueue.length<ce?E.frozenTimeoutQueue.push(()=>e(...o)):E.frozenTimeoutQueue.length===ce&&(E.frozenTimeoutQueue.push(()=>{}),console.warn(`[dev-toolbar] frozenTimeoutQueue exceeded ${ce} entries — further callbacks are being dropped.`)):e(...o)},t,...n),globalThis.setInterval=(e,t,...n)=>typeof e=="string"?E.origSetInterval(e,t):E.origSetInterval((...o)=>{E.frozen||e(...o)},t,...n),globalThis.requestAnimationFrame=e=>E.origRAF(t=>{E.frozen?E.frozenRAFQueue.length<ce?E.frozenRAFQueue.push(e):E.frozenRAFQueue.length===ce&&(E.frozenRAFQueue.push(()=>{}),console.warn(`[dev-toolbar] frozenRAFQueue exceeded ${ce} entries — further callbacks are being dropped.`)):e(t)}),E.installed=!0);const xn=E.origSetTimeout,Qn=ue(()=>E.frozen,"isFrozen"),Kn=ue(()=>{if(typeof document>"u"||E.frozen)return;E.frozen=!0,E.frozenTimeoutQueue=[],E.frozenRAFQueue=[];let e=document.getElementById($t);e||(e=document.createElement("style"),e.id=$t),e.textContent=`
+        *${xt},
+        *${xt}::before,
+        *${xt}::after {
+            animation-play-state: paused !important;
+            transition: none !important;
+        }
+    `,document.head.append(e),E.pausedAnimations=[];try{for(const t of document.getAnimations()){if(t.playState!=="running")continue;const n=t.effect?.target;n&&!n.closest?.("[id^='__vdt_']")&&!n.closest?.("dev-toolbar")&&(t.pause(),E.pausedAnimations.push(t))}}catch{}for(const t of document.querySelectorAll("video"))t.paused||(t.dataset.wasPaused="false",t.pause())},"freezeAll"),hn=ue(()=>{if(typeof document>"u"||!E.frozen)return;E.frozen=!1;const e=E.frozenTimeoutQueue;E.frozenTimeoutQueue=[];for(const n of e)E.origSetTimeout(()=>{if(E.frozen){E.frozenTimeoutQueue.length<ce&&E.frozenTimeoutQueue.push(n);return}try{n()}catch{}},0);const t=E.frozenRAFQueue;E.frozenRAFQueue=[];for(const n of t)E.origRAF(o=>{if(E.frozen){E.frozenRAFQueue.length<ce&&E.frozenRAFQueue.push(n);return}n(o)});for(const n of E.pausedAnimations)try{n.play()}catch{}E.pausedAnimations=[],document.getElementById($t)?.remove();for(const n of document.querySelectorAll("video[data-was-paused='false']"))n.play().catch(()=>{}),delete n.dataset.wasPaused},"unfreezeAll"),Jn=ue(()=>E.frozen?(hn(),!1):(Kn(),!0),"toggleFreeze");var Wn=Object.defineProperty,Je=ae((e,t)=>Wn(e,"name",{value:t,configurable:!0}),"r");const fn={bg:"#212121",btnBg:"rgba(196,181,253,0.08)",btnBgHover:"rgba(196,181,253,0.16)",btnBorder:"rgba(196,181,253,0.25)",btnBorderHover:"rgba(196,181,253,0.5)",fg:"#fafafa",muted:"#a1a1aa",primary:"#c4b5fd",shadow:"0 6px 24px rgba(0,0,0,.7),0 2px 8px rgba(0,0,0,.5)"},bn={bg:"#f2f2f2",btnBg:"rgba(124,58,237,0.08)",btnBgHover:"rgba(124,58,237,0.16)",btnBorder:"rgba(124,58,237,0.25)",btnBorderHover:"rgba(124,58,237,0.5)",fg:"#18181b",muted:"#52525b",primary:"#7c3aed",shadow:"0 4px 20px rgba(0,0,0,.12),0 0 0 1px rgba(0,0,0,.08)"},yn={...fn,overlayBg:"rgba(196,181,253,0.06)",overlayBorder:"rgba(196,181,253,0.7)"},Gn={...bn,overlayBg:"rgba(124,58,237,0.06)",overlayBorder:"rgba(124,58,237,0.7)"},Zn={...fn,danger:"#ef4444",success:"#22c55e"},eo={...bn,danger:"#dc2626",success:"#16a34a"};let de;const St=Je(()=>{if(de!==void 0)return de;try{const e=localStorage.getItem("__v_dt__theme");if(e==="light")return de=!1,!1;if(e==="dark")return de=!0,!0}catch{}return de=globalThis.window?.matchMedia("(prefers-color-scheme: dark)").matches??!0,de},"resolveIsDark");Je(()=>St(),"isDarkTheme");const to=Je(()=>St()?yn:Gn,"getInspectorPalette"),no=Je(()=>St()?Zn:eo,"getAnnotationPalette");Je(()=>{de=void 0},"resetPaletteCache");const Ft="__vdt_palette_listener";globalThis.window!==void 0&&!globalThis[Ft]&&(globalThis[Ft]=!0,globalThis.addEventListener("storage",e=>{e.key==="__v_dt__theme"&&(de=void 0)}));var oo=Object.defineProperty,_=ae((e,t)=>oo(e,"name",{value:t,configurable:!0}),"p");const fe="__vdt_annotation_marker",be="__vdt_annotation_form",Lt="__vdt_annotation_detail",it="__vdt_area_outline",U={approve:{bg:"rgba(34,197,94,0.15)",border:"rgba(34,197,94,0.6)",fg:"#22c55e"},change:{bg:"rgba(234,179,8,0.15)",border:"rgba(234,179,8,0.6)",fg:"#eab308"},fix:{bg:"rgba(239,68,68,0.15)",border:"rgba(239,68,68,0.6)",fg:"#ef4444"},question:{bg:"rgba(59,130,246,0.15)",border:"rgba(59,130,246,0.6)",fg:"#3b82f6"}},Qe={approve:"Approve",change:"Change",fix:"Fix",question:"Question"},Ke={blocking:"Blocking",important:"Important",suggestion:"Suggestion"},We=no,Y=_(()=>globalThis.__VISULIMA_DEVTOOLS__?.rpc,"getRpc"),ft=_(e=>{if(!e)return null;try{return document.querySelector(e)}catch{return null}},"safeQuerySelector"),K=_((e,t="success")=>{const n="__vdt_toast";document.getElementById(n)?.remove();const o=document.createElement("div");o.id=n,o.textContent=e,o.style.cssText=`position:fixed;z-index:2147483648;bottom:1rem;right:1rem;padding:6px 14px;background:${t==="success"?"#22c55e":"#ef4444"};color:#fff;font:12px/1 "JetBrains Mono","Geist Mono",ui-monospace,"Cascadia Code","Fira Code",monospace;font-weight:600;pointer-events:none;opacity:0;transition:opacity 0.2s,transform 0.2s;transform:translateY(4px);`,document.body.append(o),requestAnimationFrame(()=>{o.style.opacity="1",o.style.transform="translateY(0)"}),setTimeout(()=>{o.style.opacity="0",setTimeout(()=>o.remove(),200)},1500)},"showToast"),ro=_(e=>{try{const t=new URL(e),n=globalThis.location;return t.origin===n.origin&&t.pathname===n.pathname}catch{return e===globalThis.location.href}},"matchesCurrentPage"),he=_((e,t,n)=>{const o=We(),i=document.createElement("button");return i.type="button",i.textContent=e,i.style.cssText=`background:${o.btnBg};border:1px solid ${o.btnBorder};color:${n??o.primary};cursor:pointer;font:11px/1 'JetBrains Mono',monospace;padding:5px 10px;white-space:nowrap;`,i.addEventListener("pointerover",()=>{i.style.background=o.btnBgHover,i.style.borderColor=o.btnBorderHover}),i.addEventListener("pointerout",()=>{i.style.background=o.btnBg,i.style.borderColor=o.btnBorder}),i.addEventListener("click",r=>{r.preventDefault(),r.stopPropagation(),t()}),i},"makeButton"),se=_((e,t,n,o)=>{const i=document.createElement("div"),r=document.createElement("b");r.textContent=`${t}: `;const a=document.createElement("span");a.textContent=n,o&&(a.style.color=o),i.append(r,a),e.append(i)},"addMetaRow"),At=_((e,t)=>{const n=document.createElement("button");return n.type="button",n.textContent="×",n.style.cssText=`position:absolute;top:6px;right:8px;background:transparent;border:none;color:${e.muted};cursor:pointer;font:16px/1 monospace;padding:0;`,n.addEventListener("click",o=>{o.preventDefault(),o.stopPropagation(),t()}),n},"makeCloseButton"),io=_(()=>globalThis.__VISULIMA_DEVTOOLS__?.getApps?.().some(e=>e.id==="dev-toolbar:annotations")??!1,"isAnnotationsAppEnabled");let W=[],Te,je,ge;const Bt=_((e,t,n=!1)=>({x:e/window.innerWidth*100,y:n?t:t+window.scrollY}),"toPageCoords"),Ne=_((e,t,n=!1)=>({left:e/100*window.innerWidth,top:n?t:t-window.scrollY}),"toViewportCoords"),ao=_(()=>{const e=document.querySelectorAll(`.${fe}`);for(const t of e){const n=Number.parseFloat(t.dataset.pageX??"0"),o=Number.parseFloat(t.dataset.pageY??"0"),i=t.dataset.isFixed==="true",{left:r,top:a}=Ne(n,o,i);t.style.left=`${r-11}px`,t.style.top=`${a-11}px`,t.style.display=a<-24||a>window.innerHeight+24?"none":"flex"}},"repositionMarkers");let bt=!1;const Ot=_(()=>{bt||(bt=!0,xn(()=>{ao(),bt=!1},16))},"throttledReposition"),so=_(()=>{Te||(Te=Ot,je=Ot,window.addEventListener("scroll",Te,{passive:!0}),window.addEventListener("resize",je,{passive:!0}))},"attachScrollListeners"),lo=_(()=>{Te&&(window.removeEventListener("scroll",Te),Te=void 0),je&&(window.removeEventListener("resize",je),je=void 0)},"detachScrollListeners");let qe,He,pe=[];const co=_(()=>{if(ge)return;ge=_(()=>{X().catch(()=>{})},"navigationHandler"),globalThis.addEventListener("popstate",ge),qe=history.pushState.bind(history),He=history.replaceState.bind(history);const e=ge;history.pushState=(...t)=>{qe(...t);const n=setTimeout(()=>{e(),pe=pe.filter(o=>o!==n)},50);pe.push(n)},history.replaceState=(...t)=>{He(...t);const n=setTimeout(()=>{e(),pe=pe.filter(o=>o!==n)},50);pe.push(n)}},"attachNavigationListener"),po=_(()=>{ge&&(globalThis.removeEventListener("popstate",ge),ge=void 0);for(const e of pe)clearTimeout(e);pe=[],qe&&(history.pushState=qe,qe=void 0),He&&(history.replaceState=He,He=void 0)},"detachNavigationListener");let xe;const uo=_(()=>{if(!xe)try{xe=new EventSource("/__devtoolbar/events"),xe.addEventListener("annotations.changed",()=>{const e=Y();e?.getAnnotations&&e.getAnnotations().then(t=>{W=t,lt()}).catch(()=>{})}),xe.addEventListener("error",()=>{})}catch{}},"attachSSE"),mo=_(()=>{xe&&(xe.close(),xe=void 0)},"detachSSE"),X=_(async()=>{if(!io())return;const e=Y();if(e?.getAnnotations)try{W=await e.getAnnotations(),lt(),so(),co(),uo()}catch{}},"loadAndShowMarkers"),vn=_(()=>{for(const e of document.querySelectorAll(`.${fe}`))e.remove();wn(),lo(),po(),mo(),hn()},"removeAllMarkers"),wn=_(()=>{q(),N(),document.getElementById(it)?.remove()},"closeAnnotationPopups"),lt=_(()=>{for(const t of document.querySelectorAll(`.${fe}`))t.remove();const e=W.filter(t=>(t.status==="pending"||t.status==="acknowledged")&&ro(t.url));for(const[t,n]of e.entries())xo(n,t+1)},"renderMarkers"),ne="__vdt_annotation_highlight",go={bg:"#22c55e",border:"#16a34a",fg:"#fff",highlightBg:"rgba(34,197,94,0.12)"},xo=_((e,t)=>{const n=_t(),o=e.isMultiSelect&&t>1?go:Gt(n),i=e.isFixed??!1,{left:r,top:a}=Ne(e.x,e.y,i),l=e.status==="acknowledged",d=document.createElement("div");d.className=fe,d.dataset.annotationId=e.id,d.dataset.pageX=String(e.x),d.dataset.pageY=String(e.y),d.dataset.isFixed=String(i),d.title=(e.elementLabel??e.comment.slice(0,60))||"Annotation",d.style.cssText=["position:fixed",`top:${a-11}px`,`left:${r-11}px`,"width:22px","height:22px","z-index:2147483643","pointer-events:auto","cursor:pointer","display:flex","align-items:center","justify-content:center",`background:${o.bg}`,"border:none","border-radius:50%","transition:transform 0.18s cubic-bezier(0.34,1.56,0.64,1),box-shadow 0.18s,opacity 0.15s",`box-shadow:0 1px 3px rgba(0,0,0,0.3),0 4px 12px ${o.border}66,inset 0 1px 0 rgba(255,255,255,0.2)`,l?"opacity:0.55":"",e.screenshot?`outline:2px solid ${o.bg};outline-offset:2px`:""].join(";");const x=document.createElement("span");x.style.cssText=[`color:${o.fg}`,"font-size:11px","font-weight:700","line-height:1","font-family:-apple-system,BlinkMacSystemFont,system-ui,sans-serif","letter-spacing:-0.02em"].join(";"),x.textContent=String(t),d.append(x),d.addEventListener("pointerover",()=>{d.style.transform="scale(1.25)",d.style.boxShadow=`0 2px 8px rgba(0,0,0,0.35),0 6px 20px ${o.border}88,inset 0 1px 0 rgba(255,255,255,0.25)`,x.style.display="none";let h=d.querySelector(".__vdt_edit_icon");if(h)h.style.display="flex";else{h=document.createElement("span"),h.className="__vdt_edit_icon",h.style.cssText="display:flex;align-items:center;justify-content:center;";const c=new DOMParser().parseFromString(`<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="${o.fg}" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"/></svg>`,"image/svg+xml");h.append(c.documentElement),d.append(h)}if(e.isMultiSelect&&e.boundingBox&&!e.elementBoundingBoxes?.length){const c=e.boundingBox,u=i?c.y:c.y-window.scrollY;let p=document.getElementById(ne);p||(p=document.createElement("div"),p.id=ne,document.body.append(p)),p.style.cssText=`position:fixed;pointer-events:none;z-index:2147483642;box-sizing:border-box;border:2px dashed ${o.bg};background:${o.highlightBg};transition:all 0.1s;top:${u}px;left:${c.x}px;width:${c.width}px;height:${c.height}px;`}else{let c=null;if(e.elementPath&&(c=ft(e.elementPath)),!c&&e.boundingBox){const u=e.boundingBox,p=u.x+u.width/2,b=i?u.y+u.height/2:u.y+u.height/2-window.scrollY;if(c=_e(p,b),c){const T=c.getBoundingClientRect(),v=u.width>0?T.width/u.width:1,D=u.height>0?T.height/u.height:1;(v<.5||D<.5)&&(c=null)}}if(c){const u=c.getBoundingClientRect();let p=document.getElementById(ne);p||(p=document.createElement("div"),p.id=ne,document.body.append(p)),p.style.cssText=`position:fixed;pointer-events:none;z-index:2147483642;box-sizing:border-box;border:2px solid ${o.bg};background:${o.highlightBg};transition:all 0.1s;top:${u.top}px;left:${u.left}px;width:${u.width}px;height:${u.height}px;`}else if(e.boundingBox){const u=e.boundingBox,p=i?u.y:u.y-window.scrollY;let b=document.getElementById(ne);b||(b=document.createElement("div"),b.id=ne,document.body.append(b)),b.style.cssText=`position:fixed;pointer-events:none;z-index:2147483642;box-sizing:border-box;border:2px dashed ${o.bg};background:${o.highlightBg};transition:all 0.1s;top:${p}px;left:${u.x}px;width:${u.width}px;height:${u.height}px;`}}if(e.elementBoundingBoxes&&e.elementBoundingBoxes.length>0)for(const[c,u]of e.elementBoundingBoxes.entries()){const p=`${ne}_${c}`;let b=document.getElementById(p);b||(b=document.createElement("div"),b.id=p,document.body.append(b));const T=u.y-window.scrollY;b.style.cssText=`position:fixed;pointer-events:none;z-index:2147483642;box-sizing:border-box;border:2px solid ${o.bg};background:${o.highlightBg};transition:all 0.1s;top:${T}px;left:${u.x}px;width:${u.width}px;height:${u.height}px;`}}),d.addEventListener("pointerout",()=>{if(d.dataset.popupOpen==="true")return;d.style.transform="",d.style.boxShadow=`0 1px 3px rgba(0,0,0,0.3),0 4px 12px ${o.border}66,inset 0 1px 0 rgba(255,255,255,0.2)`,x.style.display="";const h=d.querySelector(".__vdt_edit_icon");if(h&&(h.style.display="none"),document.getElementById(ne)?.remove(),e.elementBoundingBoxes)for(let c=0;c<e.elementBoundingBoxes.length;c++)document.getElementById(`${ne}_${c}`)?.remove()}),d.addEventListener("click",h=>{if(h.stopPropagation(),h.preventDefault(),n.markerClickBehavior==="delete")Y()?.deleteAnnotation?.(e.id)?.then(()=>{X().catch(()=>{})});else if(n.markerClickBehavior==="edit"){const c=ft(e.elementPath),{left:u,top:p}=Ne(e.x,e.y,e.isFixed),b=c?.getBoundingClientRect()??new DOMRect(u,p,100,20);ct(c??document.body,b,e.source,e)}else $e(e)}),d.addEventListener("contextmenu",h=>{if(h.preventDefault(),h.stopPropagation(),n.markerClickBehavior==="delete"){const c=ft(e.elementPath),{left:u,top:p}=Ne(e.x,e.y,e.isFixed),b=c?.getBoundingClientRect()??new DOMRect(u,p,100,20);ct(c??document.body,b,e.source,e)}else $e(e)}),(a<-24||a>window.innerHeight+24)&&(d.style.display="none"),document.body.append(d)},"createMarkerElement"),ho=_(e=>{e&&e.__resizeObserver?.disconnect()},"cleanupResizeObserver"),q=_(()=>{const e=document.querySelector(`#${be}`),t=!!e;e?.annotationId&&ut(e.annotationId,!1),ho(e),e?.remove(),document.querySelector("#__vdt_pending_marker")?.remove(),t&&document.dispatchEvent(new CustomEvent("__vdt_annotation_form_closed"))},"removeAnnotationForm"),Ze=_(()=>!!document.querySelector(`#${be}`),"isAnnotationFormOpen"),fo=_(()=>{const e=document.querySelector(`#${be}`);if(!e)return;const t="__vdt_shake_kf";if(!document.getElementById(t)){const n=document.createElement("style");n.id=t,n.textContent="@keyframes __vdt_shake{0%,100%{transform:translateX(0)}15%{transform:translateX(-6px)}30%{transform:translateX(5px)}45%{transform:translateX(-4px)}60%{transform:translateX(3px)}75%{transform:translateX(-2px)}90%{transform:translateX(1px)}}",document.head.append(n)}e.style.animation="none",e.style.animation="__vdt_shake 0.4s ease",e.addEventListener("animationend",()=>{e.style.animation=""},{once:!0})},"shakeAnnotationForm"),ct=_((e,t,n,o,i)=>{q(),N();const r=We(),a=e.tagName.toLowerCase(),l=e.id?`#${e.id}`:"",d=e.classList.length>0?`.${[...e.classList].slice(0,3).join(".")}`:"",x=nn(e),h=ln(e),c=cn(),u=pn(e),p=document.createElement("div");p.id=be,o&&(p.annotationId=o.id,ut(o.id,!0)),p.style.cssText=["position:fixed","z-index:2147483647",`background:${r.bg}`,`border:1px solid ${r.btnBorder}`,"padding:12px","font:12px/1.4 'JetBrains Mono',monospace",`color:${r.fg}`,`box-shadow:${r.shadow}`,"min-width:300px","max-width:400px","pointer-events:auto"].join(";");const b=i?.y??t.bottom,T=i?.x??t.left,v="__vdt_pending_marker";if(document.getElementById(v)?.remove(),i&&!o){const f=Gt(),M=document.createElement("div");M.id=v,M.style.cssText=["position:fixed",`top:${i.y-11}px`,`left:${i.x-11}px`,"width:22px","height:22px","z-index:2147483643","pointer-events:none","display:flex","align-items:center","justify-content:center",`background:${f.bg}`,"border:none","border-radius:50%",`box-shadow:0 1px 3px rgba(0,0,0,0.3),0 4px 12px ${f.border}66,inset 0 1px 0 rgba(255,255,255,0.2)`,"animation:__vdt_pulse 1.4s ease-in-out infinite"].join(";");const L=document.createElement("span");L.style.cssText=`color:${f.fg};font-size:13px;font-weight:700;line-height:1;`,L.textContent="+",M.append(L),document.body.append(M)}const D=document.createElement("div");D.style.cssText=`color:${r.primary};font-weight:bold;margin-bottom:8px;font-size:12px;`,D.textContent=o?"Edit Annotation":"Annotate Element",p.append(D);const k=document.createElement("div");k.style.cssText=`color:${r.muted};font-size:10px;margin-bottom:8px;padding:4px 6px;background:${r.btnBg};border:1px solid ${r.btnBorder};word-break:break-all;`;const C=document.createElement("span");if(C.textContent=`${a}${l}${d}`,k.append(C),n){const f=document.createElement("div");f.style.cssText=`color:${r.primary};opacity:0.6;margin-top:2px;`,f.textContent=n,k.append(f)}if(u){const f=document.createElement("div");f.style.cssText=`color:${r.success};margin-top:2px;`,f.textContent=`${u.framework}: <${u.componentName}>`,k.append(f)}if(c){const f=document.createElement("div");f.style.cssText=`color:${r.fg};opacity:0.5;margin-top:2px;font-style:italic;`,f.textContent=`"${c}"`,k.append(f)}if(p.append(k),!o){const f=wt(e);if(f){const M=document.createElement("details");M.style.cssText=`margin-bottom:8px;font-size:10px;color:${r.muted};`;const L=document.createElement("summary");L.style.cssText="cursor:pointer;font-size:10px;padding:2px 0;",L.textContent="Computed Styles",L.addEventListener("click",te=>te.stopPropagation());const Q=document.createElement("div");Q.style.cssText=`padding:4px 6px;margin-top:4px;background:${r.btnBg};border:1px solid ${r.btnBorder};font-family:'JetBrains Mono',monospace;white-space:pre-wrap;word-break:break-all;line-height:1.6;`,Q.textContent=f.replaceAll("; ",`;
+`),M.append(L,Q),p.append(M)}}let F=o?.intent??"fix";const R=Se(r,"Intent",["fix","change","question","approve"].map(f=>({active:f===F,activeStyle:`background:${U[f].bg};border-color:${U[f].border};color:${U[f].fg}`,key:f,label:Qe[f]})),f=>{F=f});p.append(R);let $=o?.severity??"important";const B=Se(r,"Severity",["blocking","important","suggestion"].map(f=>({active:f===$,activeStyle:`background:${r.btnBg};border-color:${r.primary};color:${r.primary}`,key:f,label:Ke[f]})),f=>{$=f});p.append(B);let A=o?.screenshot?"existing":null;const s=document.createElement("div");s.style.cssText="margin-bottom:8px;";const g=document.createElement("button");g.type="button",g.textContent=A?"Remove Screenshot":"Capture Screenshot",g.style.cssText=`cursor:pointer;font:10px/1 'JetBrains Mono',monospace;padding:4px 8px;background:${r.btnBg};border:1px solid ${r.btnBorder};color:${r.primary};`,g.addEventListener("click",async f=>{if(f.preventDefault(),f.stopPropagation(),A)A=null,g.textContent="Capture Screenshot",m.style.display="none";else{g.textContent="Capturing...",g.disabled=!0;const M=await un(e);M?(A=M,g.textContent="Remove Screenshot",m.style.display="block",m.style.backgroundImage=`url(${M})`):g.textContent="Capture Failed — Retry",g.disabled=!1}}),s.append(g);const m=document.createElement("div");m.style.cssText=`margin-top:4px;height:80px;background-size:contain;background-repeat:no-repeat;background-position:center;border:1px solid ${r.btnBorder};display:${A?"block":"none"};`,s.append(m),p.append(s);const y=document.createElement("textarea");y.placeholder=h?`Feedback about "${h.slice(0,40)}..."`:"Describe the issue or feedback...",y.value=o?.comment??"",y.style.cssText=`width:100%;min-height:60px;resize:vertical;margin-bottom:8px;padding:6px 8px;background:${r.btnBg};border:1px solid ${r.btnBorder};color:${r.fg};font:11px/1.4 'JetBrains Mono',monospace;box-sizing:border-box;outline:none;`,y.addEventListener("focus",()=>{y.style.borderColor=r.primary}),y.addEventListener("blur",()=>{y.style.borderColor=r.btnBorder}),y.addEventListener("click",f=>f.stopPropagation()),y.addEventListener("keydown",f=>{f.stopPropagation(),f.key==="Enter"&&!f.shiftKey&&(f.preventDefault(),z.click()),f.key==="Escape"&&(f.preventDefault(),q())}),p.append(y);const w=document.createElement("div");w.style.cssText="display:flex;gap:6px;";const z=he(o?"Save":"Create",async()=>{const f=y.value.trim();if(!f){y.style.borderColor=r.danger;return}const M=Y();if(M){z.textContent=o?"Saving...":"Creating...",z.disabled=!0;try{if(o)await M.updateAnnotation(o.id,{comment:f,intent:F,severity:$,...A!=="existing"&&{screenshot:A}}),A&&A!=="existing"&&await M.saveScreenshot(o.id,A).catch(()=>{});else{const L=tn(e),Q=i?.x??t.x+t.width/2,te=i?.y??t.y+t.height/2,re=Bt(Q,te,L),ye=dn(e),Me=wt(e),ze=an(e),Pe=sn(e),Ge=Tt(e),Re={accessibility:ye,boundingBox:{height:t.height,width:t.width,x:t.x+(L?0:window.scrollX),y:t.y+(L?0:window.scrollY)},comment:f,computedStyles:Me||void 0,cssClasses:rn(e.classList),elementLabel:Ge,elementPath:x,elementTag:a,frameworkContext:u,fullPath:ze,intent:F,isFixed:L||void 0,nearbyElements:Pe||void 0,nearbyText:h||void 0,selectedText:c||void 0,severity:$,source:n,url:globalThis.location.href,x:re.x,y:re.y},j=await M.createAnnotation(Re);A&&A!=="existing"&&await M.saveScreenshot(j.id,A).catch(()=>{}),W.push(j)}await X(),q(),K(o?"Annotation saved":"Annotation created")}catch{z.textContent="Error — retry",z.disabled=!1}}});w.append(z,he("Cancel",()=>q())),o&&w.append(he("Delete",async()=>{await Y()?.deleteAnnotation?.(o.id),await X(),q()},r.danger)),p.append(w),p.append(At(r,()=>q())),pt(p,T,b,y)},"showAnnotationForm"),jt=_((e,t,n)=>{q(),N();const o=We(),i=e.slice(0,5).map(p=>p.tagName.toLowerCase()).join(", "),r=document.createElement("div");r.id=be,r.style.cssText=["position:fixed","z-index:2147483647",`background:${o.bg}`,`border:1px solid ${o.btnBorder}`,"padding:12px","font:12px/1.4 'JetBrains Mono',monospace",`color:${o.fg}`,`box-shadow:${o.shadow}`,"min-width:300px","max-width:400px","pointer-events:auto"].join(";");const a=document.createElement("div");a.style.cssText=`color:${o.primary};font-weight:bold;margin-bottom:8px;font-size:12px;`,a.textContent=`Multi-Select: ${e.length} elements`,r.append(a);const l=document.createElement("div");l.style.cssText=`color:${o.muted};font-size:10px;margin-bottom:8px;padding:4px 6px;background:${o.btnBg};border:1px solid ${o.btnBorder};`,l.textContent=i+(e.length>5?` +${e.length-5} more`:""),r.append(l);let d="fix";r.append(Se(o,"Intent",["fix","change","question","approve"].map(p=>({active:p===d,activeStyle:`background:${U[p].bg};border-color:${U[p].border};color:${U[p].fg}`,key:p,label:Qe[p]})),p=>{d=p}));let x="important";r.append(Se(o,"Severity",["blocking","important","suggestion"].map(p=>({active:p===x,activeStyle:`background:${o.btnBg};border-color:${o.primary};color:${o.primary}`,key:p,label:Ke[p]})),p=>{x=p}));const h=document.createElement("textarea");h.placeholder=`Feedback about ${e.length} selected elements...`,h.style.cssText=`width:100%;min-height:60px;resize:vertical;margin-bottom:8px;padding:6px 8px;background:${o.btnBg};border:1px solid ${o.btnBorder};color:${o.fg};font:11px/1.4 'JetBrains Mono',monospace;box-sizing:border-box;outline:none;`,h.addEventListener("click",p=>p.stopPropagation()),h.addEventListener("keydown",p=>{p.stopPropagation(),p.key==="Enter"&&!p.shiftKey&&(p.preventDefault(),u.click()),p.key==="Escape"&&(p.preventDefault(),q())}),r.append(h);const c=document.createElement("div");c.style.cssText="display:flex;gap:6px;";const u=he("Create",async()=>{const p=h.value.trim();if(!p){h.style.borderColor=o.danger;return}const b=Y();if(!b)return;const T=Bt(t.x+t.width/2,t.y+t.height/2),v={boundingBox:{height:t.height,width:t.width,x:t.x+window.scrollX,y:t.y+window.scrollY},comment:p,elementBoundingBoxes:n,elementTag:"multi-select",intent:d,isMultiSelect:!0,severity:x,url:globalThis.location.href,x:T.x,y:T.y};await b.createAnnotation(v),await X(),q(),K("Annotation created")});c.append(u),c.append(he("Cancel",()=>q())),r.append(c),r.append(At(o,()=>q())),pt(r,t.x+t.width/2,t.bottom,h)},"showMultiSelectForm"),bo=_(e=>{q(),N();const t=We();document.getElementById(it)?.remove();const n=document.createElement("div");n.id=it,n.style.cssText=["position:fixed","pointer-events:none","z-index:2147483644","box-sizing:border-box",`top:${e.y}px`,`left:${e.x}px`,`width:${e.width}px`,`height:${e.height}px`,"border:2px dashed rgba(34,197,94,0.7)","background:rgba(34,197,94,0.04)","transition:opacity 0.15s"].join(";");const o=document.createElement("div");o.style.cssText="position:absolute;top:-10px;right:-10px;width:20px;height:20px;border-radius:50%;background:#22c55e;color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:bold;line-height:1;pointer-events:none;",o.textContent="+",n.append(o),document.body.append(n);const i=document.createElement("div");i.id=be,i.style.cssText=["position:fixed","z-index:2147483647",`background:${t.bg}`,`border:1px solid ${t.btnBorder}`,"padding:12px","font:12px/1.4 'JetBrains Mono',monospace",`color:${t.fg}`,`box-shadow:${t.shadow}`,"min-width:280px","max-width:360px","pointer-events:auto"].join(";");const r=document.createElement("div");r.style.cssText=`color:${t.primary};font-weight:bold;margin-bottom:8px;font-size:12px;`,r.textContent="Area selection",i.append(r);let a="fix";i.append(Se(t,"Intent",["fix","change","question","approve"].map(u=>({active:u===a,activeStyle:`background:${U[u].bg};border-color:${U[u].border};color:${U[u].fg}`,key:u,label:Qe[u]})),u=>{a=u}));let l="important";i.append(Se(t,"Severity",["blocking","important","suggestion"].map(u=>({active:u===l,activeStyle:`background:${t.btnBg};border-color:${t.primary};color:${t.primary}`,key:u,label:Ke[u]})),u=>{l=u}));const d=document.createElement("textarea");d.placeholder="Describe what should change in this area...",d.style.cssText=`width:100%;min-height:60px;resize:vertical;margin-bottom:8px;padding:6px 8px;background:${t.btnBg};border:1px solid ${t.btnBorder};color:${t.fg};font:11px/1.4 'JetBrains Mono',monospace;box-sizing:border-box;outline:none;`,d.addEventListener("click",u=>u.stopPropagation()),d.addEventListener("keydown",u=>{u.stopPropagation(),u.key==="Enter"&&!u.shiftKey&&(u.preventDefault(),c.click()),u.key==="Escape"&&(u.preventDefault(),x())}),i.append(d);const x=_(()=>{q(),document.getElementById(it)?.remove()},"cleanup"),h=document.createElement("div");h.style.cssText="display:flex;gap:6px;justify-content:flex-end;",h.append(he("Cancel",x));const c=he("Add",async()=>{const u=d.value.trim();if(!u){d.style.borderColor=t.danger;return}const p=Y();if(p){c.textContent="Adding...",c.disabled=!0;try{const b=Bt(e.x+e.width/2,e.y+e.height/2),T={boundingBox:{height:e.height,width:e.width,x:e.x+window.scrollX,y:e.y+window.scrollY},comment:u,elementLabel:"Area selection",elementPath:`region at (${Math.round(e.x)}, ${Math.round(e.y)})`,elementTag:"area",intent:a,isMultiSelect:!0,severity:l,url:globalThis.location.href,x:b.x,y:b.y};await p.createAnnotation(T),await X(),x(),K("Annotation created")}catch{c.textContent="Error — retry",c.disabled=!1}}},"#22c55e");h.append(c),i.append(h),i.append(At(t,x)),pt(i,e.x+e.width/2,e.bottom,d)},"showAreaSelectionForm"),yo=_((e,t,n)=>{const o=window.innerWidth,i=window.innerHeight,r=8;let a;n+r+e.height<=i-r?a=n+r:n-r-e.height>=r?a=n-r-e.height:a=Math.max(r,i-e.height-r);let l;return t+e.width<=o-r?l=t:t-e.width>=r?l=t-e.width:l=Math.max(r,o-e.width-r),{left:l,top:a}},"computePopupPosition"),pt=_((e,t,n,o)=>{e.style.top="-9999px",e.style.left="-9999px",e.parentElement||document.body.append(e);const i=_(()=>{if(!document.contains(e))return;const a=e.getBoundingClientRect(),{left:l,top:d}=yo(a,t,n);e.style.top=`${d}px`,e.style.left=`${l}px`},"applyPosition");requestAnimationFrame(()=>{i(),o?.focus()});const r=new ResizeObserver(()=>{i()});r.observe(e),e.__resizeObserver=r},"positionFormNearAnchor"),Se=_((e,t,n,o)=>{const i=document.createElement("div");i.style.cssText="margin-bottom:8px;";const r=document.createElement("div");r.style.cssText=`color:${e.muted};font-size:10px;margin-bottom:4px;`,r.textContent=t,i.append(r);const a=document.createElement("div");a.style.cssText="display:flex;gap:4px;";const l=[];for(const d of n){const x=document.createElement("button");x.type="button",x.textContent=d.label,x.dataset.key=d.key,x.style.cssText=`cursor:pointer;font:10px/1 'JetBrains Mono',monospace;padding:4px 8px;border:1px solid;white-space:nowrap;${d.active?d.activeStyle:`background:${e.btnBg};border-color:${e.btnBorder};color:${e.muted}`}`,x.addEventListener("click",h=>{h.preventDefault(),h.stopPropagation(),o(d.key);for(const c of l){const u=n.find(p=>p.key===c.dataset.key);c.dataset.key===d.key&&u?Object.assign(c.style,vo(u.activeStyle)):(c.style.background=e.btnBg,c.style.borderColor=e.btnBorder,c.style.color=e.muted)}}),l.push(x),a.append(x)}return i.append(a),i},"createToggleGroup"),vo=_(e=>{const t={};for(const n of e.split(";")){const o=n.indexOf(":");if(o===-1)continue;const i=n.slice(0,o).trim(),r=n.slice(o+1).trim();if(i&&r){const a=i.replaceAll(/-([a-z])/g,(l,d)=>d.toUpperCase());t[a]=r}}return t},"parseInlineStyle"),N=_(()=>{const e=document.querySelector(`#${Lt}`);e?.annotationId&&ut(e.annotationId,!1),e?.__cleanup?.(),e?.__resizeObserver?.disconnect(),e?.remove()},"removeAnnotationDetail"),ut=_((e,t)=>{const n=document.querySelector(`.${fe}[data-annotation-id="${e}"]`);if(n)if(t){n.dataset.popupOpen="true",n.style.transform="scale(1.25)";const o=n.querySelector("span:not(.__vdt_edit_icon)");if(o&&(o.style.display="none"),n.querySelector(".__vdt_edit_icon"))n.querySelector(".__vdt_edit_icon").style.display="flex";else{const i=document.createElement("span");i.className="__vdt_edit_icon",i.style.cssText="display:flex;align-items:center;justify-content:center;";const r=new DOMParser().parseFromString('<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"/></svg>',"image/svg+xml");i.append(r.documentElement),n.append(i)}}else{delete n.dataset.popupOpen,n.style.transform="";const o=n.querySelector("span:not(.__vdt_edit_icon)");o&&(o.style.display="");const i=n.querySelector(".__vdt_edit_icon");i&&(i.style.display="none")}},"setMarkerPopupOpen"),$e=_(e=>{N(),q(),ut(e.id,!0);const t=We(),n=U[e.intent],o=t.bg==="#18181b",i=document.createElement("div");i.id=Lt,i.annotationId=e.id,i.style.cssText=["position:fixed","z-index:2147483647",`background:${t.bg}`,`border:1px solid ${o?"rgba(255,255,255,0.08)":"rgba(0,0,0,0.1)"}`,"padding:0","font:12px/1.5 -apple-system,BlinkMacSystemFont,system-ui,sans-serif",`color:${t.fg}`,`box-shadow:0 8px 32px rgba(0,0,0,${o?"0.5":"0.15"}),0 0 0 1px rgba(${o?"255,255,255,0.06":"0,0,0,0.06"})`,"width:360px","max-height:70vh","overflow:hidden","display:flex","flex-direction:column","pointer-events:auto"].join(";");const{left:r,top:a}=Ne(e.x,e.y,e.isFixed??!1),l=document.createElement("div");l.style.cssText=`display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid ${o?"rgba(255,255,255,0.06)":"rgba(0,0,0,0.06)"};flex-shrink:0;`;const d=document.createElement("span");d.textContent=Qe[e.intent].toUpperCase(),d.style.cssText=`font-size:10px;font-weight:700;letter-spacing:0.05em;padding:2px 6px;background:${n.bg};color:${n.fg};`,l.append(d);const x=document.createElement("span");x.textContent=Ke[e.severity],x.style.cssText=`font-size:10px;font-weight:600;color:${e.severity==="blocking"?t.danger:t.muted};`,l.append(x);const h=document.createElement("span");h.textContent=e.status.toUpperCase(),h.style.cssText=`font-size:10px;font-weight:700;letter-spacing:0.08em;padding:2px 6px;margin-left:auto;background:${o?"rgba(255,255,255,0.06)":"rgba(0,0,0,0.05)"};color:${t.muted};`,l.append(h);const c=document.createElement("button");c.type="button",c.textContent="×",c.style.cssText=`background:none;border:none;color:${t.muted};cursor:pointer;font-size:16px;padding:0 0 0 4px;line-height:1;`,c.addEventListener("click",m=>{m.preventDefault(),m.stopPropagation(),N()}),l.append(c),i.append(l);const u=document.createElement("div");u.style.cssText="flex:1;overflow-y:auto;padding:10px 12px;";const p=document.createElement("div");p.style.cssText=`padding:8px 10px;background:${o?"rgba(255,255,255,0.04)":"rgba(0,0,0,0.03)"};font-size:13px;line-height:1.6;white-space:pre-wrap;word-break:break-word;margin-bottom:10px;`,p.textContent=e.comment,u.append(p);const b=document.createElement("details");b.style.cssText=`margin-bottom:10px;font-size:10px;color:${t.muted};`;const T=document.createElement("summary");T.textContent=`${e.elementLabel??e.elementTag}${e.source?` • ${e.source.split("/").pop()}`:""}`,T.style.cssText=`cursor:pointer;font-size:10px;color:${t.muted};padding:4px 0;list-style:none;`,T.addEventListener("click",m=>m.stopPropagation()),b.append(T);const v=document.createElement("div");if(v.style.cssText="padding:6px 0;line-height:1.7;",se(v,"Element",`${e.elementTag}${e.cssClasses?` .${e.cssClasses}`:""}`),e.elementPath&&se(v,"Selector",e.elementPath),e.source&&se(v,"Source",e.source,t.primary),e.frameworkContext&&se(v,"Component",`${e.frameworkContext.componentName} (${e.frameworkContext.framework})`,t.success),e.nearbyText&&se(v,"Context",e.nearbyText),e.selectedText&&se(v,"Selected",`"${e.selectedText}"`),se(v,"URL",e.url),se(v,"Created",new Date(e.createdAt).toLocaleString()),b.append(v),u.append(b),e.thread&&e.thread.length>0){const m=document.createElement("div");m.style.cssText=`font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:0.06em;color:${t.muted};margin-bottom:6px;`,m.textContent=`Thread · ${e.thread.length}`,u.append(m);const y=document.createElement("div");y.style.cssText="max-height:160px;overflow-y:auto;margin-bottom:8px;display:flex;flex-direction:column;gap:4px;";for(const w of e.thread){const z=w.role==="human",f=document.createElement("div");f.style.cssText=["max-width:85%","padding:6px 10px",`border-radius:${z?"2px 2px 0 2px":"2px 2px 2px 0"}`,"font-size:11px","line-height:1.45","white-space:pre-wrap","word-break:break-word",`align-self:${z?"flex-end":"flex-start"}`,z?`background:${t.primary};color:#18181b`:`background:${o?"rgba(255,255,255,0.08)":"rgba(0,0,0,0.06)"};color:${t.fg}`].join(";"),f.textContent=w.content;const M=document.createElement("div");M.style.cssText=`font-size:10px;color:${t.muted};margin-top:2px;opacity:0.6;text-align:${z?"right":"left"};`,M.textContent=new Date(w.timestamp).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"});const L=document.createElement("div");L.style.cssText=`display:flex;flex-direction:column;align-items:${z?"flex-end":"flex-start"};`,L.append(f,M),y.append(L)}requestAnimationFrame(()=>{y.scrollTop=y.scrollHeight}),u.append(y)}i.append(u);const D=document.createElement("div");D.style.cssText=`display:flex;gap:6px;align-items:flex-end;padding:8px 12px;border-top:1px solid ${o?"rgba(255,255,255,0.06)":"rgba(0,0,0,0.06)"};flex-shrink:0;`;const k=document.createElement("textarea");k.placeholder="Message...",k.rows=1,k.style.cssText=`flex:1;min-height:28px;max-height:80px;resize:none;padding:5px 8px;background:${o?"rgba(255,255,255,0.06)":"rgba(0,0,0,0.04)"};border:1px solid transparent;color:${t.fg};font:11px/1.4 -apple-system,BlinkMacSystemFont,system-ui,sans-serif;box-sizing:border-box;outline:none;`,k.addEventListener("click",m=>m.stopPropagation()),k.addEventListener("keydown",m=>m.stopPropagation()),k.addEventListener("focus",()=>{k.style.borderColor=t.primary}),k.addEventListener("blur",()=>{k.style.borderColor="transparent"}),k.addEventListener("input",()=>{k.style.height="auto",k.style.height=`${Math.min(k.scrollHeight,80)}px`}),D.append(k);const C=document.createElement("button");C.type="button",C.style.cssText=`width:28px;height:28px;border-radius:50%;border:none;background:${t.primary};color:#18181b;cursor:not-allowed;opacity:0.3;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity 0.15s,background 0.15s;`;const F=new DOMParser().parseFromString('<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="m5 12 7-7 7 7"/><path d="M12 19V5"/></svg>',"image/svg+xml");C.append(F.documentElement),C.disabled=!0,k.addEventListener("input",()=>{const m=k.value.trim().length>0;C.disabled=!m,C.style.opacity=m?"1":"0.3",C.style.cursor=m?"pointer":"not-allowed"}),C.addEventListener("click",async m=>{m.preventDefault(),m.stopPropagation();const y=k.value.trim();if(!y)return;await Y()?.updateAnnotation?.(e.id,{threadMessage:{content:y,role:"human",timestamp:new Date().toISOString()}}),K("Message sent"),await X();const w=W.find(z=>z.id===e.id);w&&$e(w)}),D.append(C),i.append(D);const R=document.createElement("div");if(R.style.cssText=`display:flex;align-items:center;gap:4px;padding:6px 12px;border-top:1px solid ${o?"rgba(255,255,255,0.04)":"rgba(0,0,0,0.04)"};flex-shrink:0;`,e.status==="pending"){const m=document.createElement("button");m.type="button",m.textContent="Resolve",m.style.cssText=`padding:4px 10px;border:none;background:${t.success};color:#fff;font-size:10px;font-weight:600;cursor:pointer;`,m.addEventListener("click",async w=>{w.stopPropagation(),await Y()?.updateAnnotation?.(e.id,{status:"resolved"}),K("Annotation resolved"),await X(),N()}),R.append(m);const y=document.createElement("button");y.type="button",y.textContent="Edit",y.style.cssText=`padding:4px 10px;border:1px solid ${t.btnBorder};background:transparent;color:${t.fg};font-size:10px;font-weight:500;cursor:pointer;`,y.addEventListener("click",w=>{for(w.stopPropagation();i.firstChild;)i.firstChild.remove();i.style.padding="0",i.style.overflow="hidden",i.style.display="flex";const z=document.createElement("div");z.style.cssText=`display:flex;align-items:center;padding:10px 12px;border-bottom:1px solid ${o?"rgba(255,255,255,0.06)":"rgba(0,0,0,0.06)"};flex-shrink:0;`;const f=document.createElement("span");f.textContent="Edit Annotation",f.style.cssText=`font-size:12px;font-weight:700;color:${t.fg};`,z.append(f);const M=document.createElement("button");M.type="button",M.textContent="×",M.style.cssText=`background:none;border:none;color:${t.muted};cursor:pointer;font-size:16px;padding:0;line-height:1;margin-left:auto;`,M.addEventListener("click",I=>{I.preventDefault(),I.stopPropagation(),N(),$e(e)}),z.append(M),i.append(z);const L=document.createElement("div");L.style.cssText="flex:1;overflow-y:auto;padding:12px;";const Q=document.createElement("div");Q.style.cssText=`font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:0.06em;color:${t.muted};margin-bottom:6px;`,Q.textContent="Intent",L.append(Q);let te=e.intent;const re=document.createElement("div");re.style.cssText="display:flex;gap:4px;margin-bottom:12px;";const ye=[];for(const I of["fix","change","question","approve"]){const O=U[I],V=document.createElement("button");V.type="button",V.textContent=Qe[I],V.dataset.intent=I,V.style.cssText=`padding:4px 10px;border:none;font-size:10px;font-weight:600;cursor:pointer;transition:all 0.15s;${I===te?`background:${O.bg};color:${O.fg};box-shadow:0 0 0 1px ${O.border};`:`background:${o?"rgba(255,255,255,0.06)":"rgba(0,0,0,0.05)"};color:${t.muted};`}`,V.addEventListener("click",G=>{G.preventDefault(),G.stopPropagation(),te=I;for(const ie of ye){const mt=U[ie.dataset.intent];ie.dataset.intent===I?(ie.style.background=mt.bg,ie.style.color=mt.fg,ie.style.boxShadow=`0 0 0 1px ${mt.border}`):(ie.style.background=o?"rgba(255,255,255,0.06)":"rgba(0,0,0,0.05)",ie.style.color=t.muted,ie.style.boxShadow="none")}}),ye.push(V),re.append(V)}L.append(re);const Me=document.createElement("div");Me.style.cssText=`font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:0.06em;color:${t.muted};margin-bottom:6px;`,Me.textContent="Severity",L.append(Me);let ze=e.severity;const Pe=document.createElement("div");Pe.style.cssText="display:flex;gap:4px;margin-bottom:12px;";const Ge=[];for(const I of["blocking","important","suggestion"]){const O=document.createElement("button");O.type="button",O.textContent=Ke[I],O.dataset.severity=I,O.style.cssText=`padding:4px 10px;border:none;font-size:10px;font-weight:600;cursor:pointer;transition:all 0.15s;${I===ze?`background:${t.primary};color:#18181b;`:`background:${o?"rgba(255,255,255,0.06)":"rgba(0,0,0,0.05)"};color:${t.muted};`}`,O.addEventListener("click",V=>{V.preventDefault(),V.stopPropagation(),ze=I;for(const G of Ge)G.dataset.severity===I?(G.style.background=t.primary,G.style.color="#18181b"):(G.style.background=o?"rgba(255,255,255,0.06)":"rgba(0,0,0,0.05)",G.style.color=t.muted)}),Ge.push(O),Pe.append(O)}L.append(Pe);const Re=document.createElement("div");Re.style.cssText=`font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:0.06em;color:${t.muted};margin-bottom:6px;`,Re.textContent="Comment",L.append(Re);const j=document.createElement("textarea");j.value=e.comment,j.style.cssText=`width:100%;min-height:90px;resize:vertical;padding:8px 10px;background:${o?"rgba(255,255,255,0.04)":"rgba(0,0,0,0.03)"};border:1px solid ${o?"rgba(255,255,255,0.1)":"rgba(0,0,0,0.1)"};color:${t.fg};font:12px/1.5 -apple-system,BlinkMacSystemFont,system-ui,sans-serif;box-sizing:border-box;outline:none;transition:border-color 0.15s;`,j.addEventListener("click",I=>I.stopPropagation()),j.addEventListener("keydown",I=>I.stopPropagation()),j.addEventListener("focus",()=>{j.style.borderColor=t.primary}),j.addEventListener("blur",()=>{j.style.borderColor=o?"rgba(255,255,255,0.1)":"rgba(0,0,0,0.1)"}),L.append(j),i.append(L);const Ie=document.createElement("div");Ie.style.cssText=`display:flex;align-items:center;gap:6px;padding:8px 12px;border-top:1px solid ${o?"rgba(255,255,255,0.06)":"rgba(0,0,0,0.06)"};flex-shrink:0;`;const De=document.createElement("button");De.type="button",De.textContent="Save",De.style.cssText=`padding:4px 10px;border:none;background:${t.primary};color:#18181b;font-size:10px;font-weight:600;cursor:pointer;`,De.addEventListener("click",async I=>{I.stopPropagation();const O=j.value.trim();if(!O){j.style.borderColor=t.danger;return}await Y()?.updateAnnotation?.(e.id,{comment:O,intent:te,severity:ze}),K("Annotation saved"),await X();const V=W.find(G=>G.id===e.id);V?(N(),$e(V)):N()}),Ie.append(De);const Fe=document.createElement("button");Fe.type="button",Fe.textContent="Cancel",Fe.style.cssText=`padding:4px 10px;border:1px solid ${t.btnBorder};background:transparent;color:${t.fg};font-size:10px;font-weight:500;cursor:pointer;`,Fe.addEventListener("click",I=>{I.stopPropagation(),N(),$e(e)}),Ie.append(Fe);const Oe=document.createElement("button");Oe.type="button",Oe.textContent="Delete",Oe.style.cssText=`padding:4px 10px;border:none;background:transparent;color:${t.danger};font-size:10px;cursor:pointer;margin-left:auto;`,Oe.addEventListener("click",async I=>{I.stopPropagation(),await Y()?.deleteAnnotation?.(e.id),W=W.filter(O=>O.id!==e.id),K("Annotation deleted"),N(),lt()}),Ie.append(Oe),i.append(Ie),setTimeout(()=>j.focus(),50)}),R.append(y)}const $=document.createElement("div");if($.style.cssText="display:flex;gap:2px;margin-left:auto;",e.status==="pending"){const m=document.createElement("button");m.type="button",m.textContent="Dismiss",m.style.cssText=`padding:4px 8px;border:none;background:transparent;color:${t.muted};font-size:10px;cursor:pointer;`,m.addEventListener("click",async y=>{y.stopPropagation(),await Y()?.updateAnnotation?.(e.id,{status:"dismissed"}),K("Annotation dismissed"),await X(),N()}),$.append(m)}const B=document.createElement("button");B.type="button",B.textContent="Copy",B.style.cssText=`padding:4px 8px;border:none;background:transparent;color:${t.muted};font-size:10px;cursor:pointer;`,B.addEventListener("click",async m=>{m.stopPropagation();try{await navigator.clipboard.writeText(Ct([e])),K("Copied to clipboard")}catch{K("Copy failed","error")}}),$.append(B);const A=document.createElement("button");A.type="button",A.textContent="Delete",A.style.cssText=`padding:4px 8px;border:none;background:transparent;color:${t.danger};font-size:10px;cursor:pointer;`,A.addEventListener("click",async m=>{m.stopPropagation(),await Y()?.deleteAnnotation?.(e.id),W=W.filter(y=>y.id!==e.id),K("Annotation deleted"),N(),lt()}),$.append(A),R.append($),i.append(R),pt(i,r+16,a);const s=_(m=>{!i.contains(m.target)&&!m.target?.classList.contains(fe)&&N()},"outsideHandler"),g=setTimeout(()=>{document.addEventListener("click",s,!0)},100);i.__cleanup=()=>{clearTimeout(g),document.removeEventListener("click",s,!0)}},"showAnnotationDetail");let Ce;const wo=_(()=>{Ce||(Ce=_(e=>{if((e.ctrlKey||e.metaKey)&&e.shiftKey&&e.key==="C"){e.preventDefault();const t=Ct(W);navigator.clipboard.writeText(t).catch(()=>{})}},"markdownShortcutHandler"),document.addEventListener("keydown",Ce))},"attachMarkdownShortcut"),$n=_(()=>{Ce&&(document.removeEventListener("keydown",Ce),Ce=void 0)},"detachMarkdownShortcut"),Nt=_(e=>{if(!e)return!1;for(const t of[be,Lt]){const n=document.querySelector(`#${t}`);if(n&&(e===n||n.contains(e)))return!0}return!!e.closest?.(`.${fe}`)},"isOverAnnotationOverlay");var $o=Object.defineProperty,kn=ae((e,t)=>$o(e,"name",{value:t,configurable:!0}),"o");const ko=kn(e=>{const t={};for(const h of e.attributes)h.name.startsWith("aria-")&&(t[h.name]=h.value);const n=e.getAttribute("role"),o=e.getAttribute("tabindex"),i=o===null?null:Number.parseInt(o,10),r=new Set(["a","button","details","input","select","summary","textarea"]),a=e.tagName.toLowerCase(),l=r.has(a)&&!e.hasAttribute("disabled"),d=e.hasAttribute("contenteditable")&&e.getAttribute("contenteditable")!=="false",x=l||d||i!==null&&i>=0;return{ariaAttributes:t,focusable:x,role:n,tabindex:i}},"captureA11yInfo"),Eo=kn(e=>{const t=[];e.role&&t.push(`role: ${e.role}`),t.push(`focusable: ${e.focusable}`),e.tabindex!==null&&t.push(`tabindex: ${e.tabindex}`);for(const[n,o]of Object.entries(e.ariaAttributes))t.push(`${n}: ${o}`);return t.join(`
+`)},"formatA11yText");var _o=Object.defineProperty,H=ae((e,t)=>_o(e,"name",{value:t,configurable:!0}),"u");const Mt="__vdt_ruler_corner",zt="__vdt_ruler_h",Pt="__vdt_ruler_v",Rt="__vdt_guideline",En='9px "JetBrains Mono","Geist Mono",ui-monospace,monospace';let Le=!1,ke=null,Z=null,ee=null,dt=new Set,Ve=null,Ye=null,Xe=null;const _n=H(e=>{const t=80/e,n=10**Math.floor(Math.log10(t)),o=t/n;let i;o<=1?i=1:o<=2?i=2:o<=5?i=5:i=10;const r=i*n,a=10,l=r/a;return{major:r,minor:l,stepsPerMajor:a}},"computeTickIntervals"),Tn=H((e,t)=>{const n=window.devicePixelRatio||1,o=e.clientWidth,i=20;e.width=o*n,e.height=i*n;const r=e.getContext("2d");if(!r)return;r.scale(n,n),r.clearRect(0,0,o,i),r.strokeStyle=t.btnBorder,r.lineWidth=1,r.beginPath(),r.moveTo(0,i-.5),r.lineTo(o,i-.5),r.stroke();const{scrollX:a}=globalThis,{minor:l,stepsPerMajor:d}=_n(1);r.fillStyle=t.muted,r.strokeStyle=t.muted,r.lineWidth=1,r.font=En,r.textAlign="center",r.textBaseline="top";const x=Math.floor(a/l),h=Math.ceil((a+o)/l);for(let c=x;c<=h;c++){const u=c*l,p=u-a;if(p<0||p>o)continue;const b=c%d===0,T=c%(d/2)===0;let v;b?v=10:T?v=7:v=4,r.beginPath(),r.moveTo(Math.round(p)+.5,i),r.lineTo(Math.round(p)+.5,i-v),r.stroke(),b&&(r.fillStyle=t.fg,r.fillText(String(Math.round(u)),Math.round(p),2),r.fillStyle=t.muted)}},"drawHorizontalRuler"),Cn=H((e,t)=>{const n=window.devicePixelRatio||1,o=20,i=e.clientHeight;e.width=o*n,e.height=i*n;const r=e.getContext("2d");if(!r)return;r.scale(n,n),r.clearRect(0,0,o,i),r.strokeStyle=t.btnBorder,r.lineWidth=1,r.beginPath(),r.moveTo(o-.5,0),r.lineTo(o-.5,i),r.stroke();const{scrollY:a}=globalThis,{minor:l,stepsPerMajor:d}=_n(1);r.fillStyle=t.muted,r.strokeStyle=t.muted,r.lineWidth=1,r.font=En;const x=Math.floor(a/l),h=Math.ceil((a+i)/l);for(let c=x;c<=h;c++){const u=c*l,p=u-a;if(p<0||p>i)continue;const b=c%d===0,T=c%(d/2)===0;let v;b?v=10:T?v=7:v=4,r.beginPath(),r.moveTo(o,Math.round(p)+.5),r.lineTo(o-v,Math.round(p)+.5),r.stroke(),b&&(r.save(),r.fillStyle=t.fg,r.translate(9,Math.round(p)),r.rotate(-Math.PI/2),r.textAlign="center",r.textBaseline="top",r.fillText(String(Math.round(u)),0,0),r.restore())}},"drawVerticalRuler"),qt=H(()=>{Xe&&(Z&&Tn(Z,Xe),ee&&Cn(ee,Xe))},"redraw"),To=H(e=>{const t=[],n=document.querySelectorAll("body *"),o=2e3;let i=0;for(const r of n){if(i>=o)break;if(r.id===Mt||r.id===zt||r.id===Pt||r.classList.contains(Rt))continue;const a=r.getBoundingClientRect();a.width===0&&a.height===0||(e==="horizontal"?t.push(a.top,a.bottom):t.push(a.left,a.right),i++)}return t},"collectSnapEdges"),Co=H((e,t)=>{let n=null,o=6;for(const i of t){const r=Math.abs(i-e);r<o&&(o=r,n=i)}return n},"findSnapEdge"),et=9,Ht=H((e,t,n)=>{const o=document.createElement("div");o.className=Rt;const i=e==="horizontal";o.style.cssText=["position:fixed","z-index:2147483644","pointer-events:none",i?`top:${t}px;left:0;width:100vw;height:0`:`left:${t}px;top:0;width:0;height:100vh`].join(";");const r=document.createElement("div");r.style.cssText=["position:absolute","pointer-events:none",i?"left:0;right:0;height:1px;top:0;transform:translateY(-0.5px)":"top:0;bottom:0;width:1px;left:0;transform:translateX(-0.5px)",`background:${n.primary}`].join(";"),o.append(r);const a=document.createElement("div");a.style.cssText=["position:absolute","pointer-events:auto",i?`left:0;right:0;height:${et*2+1}px;top:${-et}px`:`top:0;bottom:0;width:${et*2+1}px;left:${-et}px`,"background:transparent",i?"cursor:row-resize":"cursor:col-resize"].join(";"),o.append(a);const l=document.createElement("div");l.style.cssText=["position:absolute",`background:${n.primary}`,"color:#fff",'font:9px/1 "JetBrains Mono","Geist Mono",ui-monospace,monospace',"padding:2px 4px","white-space:nowrap","pointer-events:none",i?"left:24px;top:2px":"top:24px;left:2px"].join(";"),o.append(l),document.body.append(o),dt.add(o);let d=t;const x=H(c=>{d=c,i?o.style.top=`${d}px`:o.style.left=`${d}px`;const u=i?d+window.scrollY:d+window.scrollX;l.textContent=`${Math.round(u)}px`},"updatePosition"),h=H(()=>{let c=performance.now(),u=d,p=!1,b=null;l.style.display="";const T=H(D=>{const k=performance.now(),C=i?D.clientY:D.clientX,F=Math.abs(C-u)/Math.max(1,k-c);if(c=k,u=C,b===null&&(b=To(e)),F<3){const R=Co(C,b);if(R!==null){x(R),p||(p=!0,r.style.background="#0D99FF",l.style.background="#0D99FF");return}}p&&(p=!1,r.style.background=n.primary,l.style.background=n.primary),x(C)},"onPointerMove"),v=H(()=>{document.removeEventListener("pointermove",T),document.removeEventListener("pointerup",v),l.style.display="none",r.style.background=n.primary,l.style.background=n.primary,(i&&d<20||!i&&d<20)&&(o.remove(),dt.delete(o))},"onPointerUp");document.addEventListener("pointermove",T),document.addEventListener("pointerup",v)},"startDrag");a.addEventListener("pointerdown",c=>{c.preventDefault(),c.stopPropagation(),h()}),x(d),h()},"spawnGuideline"),So=H(e=>{Le||(Xe=e,ke=document.createElement("div"),ke.id=Mt,ke.style.cssText=["position:fixed","top:0","left:0","width:20px","height:20px",`background:${e.bg}`,`border-right:1px solid ${e.btnBorder}`,`border-bottom:1px solid ${e.btnBorder}`,"z-index:2147483646","pointer-events:none"].join(";"),document.body.append(ke),Z=document.createElement("canvas"),Z.id=zt,Z.style.cssText=["position:fixed","top:0","left:20px","height:20px","width:calc(100vw - 20px)",`background:${e.bg}`,"z-index:2147483646","pointer-events:auto","cursor:s-resize"].join(";"),Z.addEventListener("pointerdown",t=>{t.preventDefault(),Ht("horizontal",t.clientY,e)}),document.body.append(Z),ee=document.createElement("canvas"),ee.id=Pt,ee.style.cssText=["position:fixed","top:20px","left:0","width:20px","height:calc(100vh - 20px)",`background:${e.bg}`,"z-index:2147483646","pointer-events:auto","cursor:e-resize"].join(";"),ee.addEventListener("pointerdown",t=>{t.preventDefault(),Ht("vertical",t.clientX,e)}),document.body.append(ee),Tn(Z,e),Cn(ee,e),Ve=qt,window.addEventListener("resize",Ve),Ye=qt,window.addEventListener("scroll",Ye,{passive:!0}),Le=!0)},"createRulers"),Sn=H(()=>{if(Le){ke?.remove(),Z?.remove(),ee?.remove();for(const e of dt)e.remove();dt.clear(),Ve&&(window.removeEventListener("resize",Ve),Ve=null),Ye&&(window.removeEventListener("scroll",Ye),Ye=null),ke=null,Z=null,ee=null,Xe=null,Le=!1}},"removeRulers"),Vt=H(()=>Le,"areRulersVisible"),yt=H(e=>{if(!Le)return!1;const{id:t}=e;return t===Mt||t===zt||t===Pt?!0:e.classList.contains(Rt)},"isRulerElement");var Lo=Object.defineProperty,S=ae((e,t)=>Lo(e,"name",{value:t,configurable:!0}),"l");const Ae=to,Ao=yn,me="__vdt_inspector_overlay",Bo=new Set(["A","B","BLOCKQUOTE","CITE","CODE","EM","FIGCAPTION","H1","H2","H3","H4","H5","H6","I","LABEL","LI","MARK","P","PRE","Q","S","SMALL","SPAN","STRONG","TD","TH","TIME","U"]),Ln="__vdt_inspector_label",kt="__vdt_inspector_cursor",J="__vdt_inspector_badge",Yt="__vdt_inspector_kf",Be="__vdt_inspector_result",tt=S(e=>{if(!e)return!1;if(e.tagName==="DEV-TOOLBAR")return!0;let t=e;for(;t;)if(t instanceof ShadowRoot){if(t.host?.tagName==="DEV-TOOLBAR")return!0;t=t.host}else t=t.parentNode;return!1},"isInsideDevToolbar"),Mo=S(()=>{let e=document.querySelector(`#${me}`);if(!e){const t=Ae();e=document.createElement("div"),e.id=me,e.style.cssText=["position:fixed","pointer-events:none","z-index:2147483644","box-sizing:border-box",`border:1px solid ${t.overlayBorder}`,`background:${t.overlayBg}`,"transition:top 60ms,left 60ms,width 60ms,height 60ms","display:none"].join(";");const n=document.createElement("div");n.id=Ln,n.style.cssText=["position:absolute","bottom:calc(100% + 2px)","left:0",`background:${t.bg}`,`color:${t.primary}`,"font:11px/1.2 'JetBrains Mono',monospace","padding:2px 6px","white-space:nowrap","pointer-events:none",`border:1px solid ${t.btnBorder}`].join(";"),e.append(n),document.body.append(e)}return e},"getOrCreateOverlay"),Et=S(e=>{let t=e;for(;t;){const n=t.dataset.vdtSource;if(n)return n;t=t.parentElement??void 0}},"findSource"),zo=S(e=>{const t=e.split(":");if(t.length<3)return e;const n=t[t.length-2],o=t.slice(0,-2).join(":");return`${o.split("/").pop()??o}:${n}`},"formatSourceShort"),nt=S(e=>{const t=document.querySelector(`#${me}`);if(!t)return;const n=e.getBoundingClientRect();t.style.display="block",t.style.top=`${n.top}px`,t.style.left=`${n.left}px`,t.style.width=`${n.width}px`,t.style.height=`${n.height}px`;const o=document.querySelector(`#${Ln}`);if(o){const i=e.tagName.toLowerCase(),r=e.id?`#${e.id}`:"",a=e.classList.length>0?`.${[...e.classList].slice(0,3).join(".")}`:"",l=`${i}${r}${a}`,d=Et(e);o.textContent=d?`${l}  ·  ${zo(d)}`:l,n.top<28?(o.style.bottom="auto",o.style.top="calc(100% + 2px)"):(o.style.top="",o.style.bottom="calc(100% + 2px)")}},"updateOverlayPosition"),ve=S(()=>{const e=document.querySelector(`#${me}`);e&&(e.style.display="none")},"hideOverlay"),Po=S(()=>{document.querySelector(`#${me}`)?.remove(),document.querySelector(`#${kt}`)?.remove()},"removeOverlay"),Xt=S(e=>{let t=document.querySelector(`#${kt}`);e?(t||(t=document.createElement("style"),t.id=kt,document.head.append(t)),t.textContent=["*, *::before, *::after { cursor: crosshair !important; }",`#${J}, #${J} * { cursor: pointer !important; }`,`#${Be}, #${Be} * { cursor: pointer !important; }`,".__vdt_annotation_marker, .__vdt_annotation_marker * { cursor: pointer !important; }","#__vdt_annotation_form, #__vdt_annotation_form * { cursor: auto !important; }","#__vdt_annotation_form textarea { cursor: text !important; }","#__vdt_annotation_form button, #__vdt_annotation_form select { cursor: pointer !important; }","#__vdt_annotation_detail, #__vdt_annotation_detail * { cursor: auto !important; }","#__vdt_annotation_detail textarea { cursor: text !important; }","#__vdt_annotation_detail button { cursor: pointer !important; }","#__vdt_clear_confirm, #__vdt_clear_confirm * { cursor: auto !important; }","#__vdt_clear_confirm button { cursor: pointer !important; }","#__vdt_area_outline { cursor: auto !important; }","#__vdt_ruler_h { cursor: s-resize !important; }","#__vdt_ruler_v { cursor: e-resize !important; }",".__vdt_guideline { cursor: row-resize !important; }"].join(" ")):t&&t.remove()},"setCrosshairCursor");let Ue="inspect";const An=S(()=>{document.querySelector(`#${J}`)?.remove()},"removeFloatingBadge"),It=S(e=>new DOMParser().parseFromString(e,"image/svg+xml").documentElement,"parseSvg"),Ut='<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="14" y="4" width="4" height="16" rx="1"/><rect x="6" y="4" width="4" height="16" rx="1"/></svg>',Qt='<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="6 3 20 12 6 21 6 3"/></svg>',Kt='<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0"/><circle cx="12" cy="12" r="3"/></svg>',Ro='<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49"/><path d="M14.084 14.158a3 3 0 0 1-4.242-4.242"/><path d="M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143"/><path d="m2 2 20 20"/></svg>',Io='<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></svg>',Do='<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/></svg>',Fo='<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>',Oo='<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12.034 12.681a.498.498 0 0 1 .647-.647l9 3.5a.5.5 0 0 1-.033.943l-3.444 1.068a1 1 0 0 0-.66.66l-1.067 3.443a.5.5 0 0 1-.943.033z"/><path d="M21 11V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h6"/></svg>',jo='<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M7.9 20A9 9 0 1 0 4 16.1L2 22Z"/><path d="M12 8v4"/><path d="M12 16h.01"/></svg>',No='<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21.3 15.3a2.4 2.4 0 0 1 0 3.4l-2.6 2.6a2.4 2.4 0 0 1-3.4 0L2.7 8.7a2.41 2.41 0 0 1 0-3.4l2.6-2.6a2.41 2.41 0 0 1 3.4 0Z"/><path d="m14.5 12.5 2-2"/><path d="m11.5 9.5 2-2"/><path d="m8.5 6.5 2-2"/><path d="m17.5 15.5 2-2"/></svg>';let oe=!0;const we=S((e,t,n,o,i=!1)=>{const r=document.createElement("button");r.type="button",r.title=n,r.dataset.active=i?"1":"",r.style.cssText=["position:relative","display:flex","justify-content:center","align-items:center","border:0","white-space:nowrap","padding:0","margin:0","cursor:pointer",`background:${i?`${e.primary}1f`:"transparent"}`,`color:${i?e.primary:e.muted}`,"transition:all 150ms"].join(";");const a=document.createElement("div");return a.style.cssText="width:24px;height:24px;display:flex;align-items:center;justify-content:center;user-select:none;",a.append(It(t)),r.append(a),r.addEventListener("pointerover",()=>{r.style.background=`${e.primary}14`,r.style.color=e.primary}),r.addEventListener("pointerout",()=>{const l=r.dataset.active==="1";r.style.background=l?`${e.primary}1f`:"transparent",r.style.color=l?e.primary:e.muted}),r.addEventListener("pointerdown",()=>{r.style.transform="scale(0.94)"}),r.addEventListener("pointerup",()=>{r.style.transform=""}),r.addEventListener("click",l=>{l.preventDefault(),l.stopPropagation(),o()}),r},"makeToolbarButton"),Jt=S((e,t)=>{const n=e.querySelector("svg");n&&n.replaceWith(It(t))},"setButtonIcon"),vt=S((e,t="success")=>{const n="__vdt_toast";document.getElementById(n)?.remove();const o=document.createElement("div");o.id=n,o.textContent=e,o.style.cssText=["position:fixed","z-index:2147483646","bottom:1rem","right:1rem","padding:6px 14px","border-radius:4px",`background:${t==="success"?"#22c55e":"#ef4444"}`,"color:#fff",'font:12px/1 "JetBrains Mono","Geist Mono",ui-monospace,"Cascadia Code","Fira Code",monospace',"font-weight:600","pointer-events:none","opacity:0","transition:opacity 0.2s,transform 0.2s","transform:translateY(4px)"].join(";"),document.body.append(o),requestAnimationFrame(()=>{o.style.opacity="1",o.style.transform="translateY(0)"}),setTimeout(()=>{o.style.opacity="0",setTimeout(()=>o.remove(),200)},1500)},"showToast"),qo=S(e=>{if(!document.querySelector(`#${Yt}`)){const $=document.createElement("style");$.id=Yt,$.textContent="@keyframes __vdt_pulse{0%,100%{opacity:1}50%{opacity:.3}}",document.head.append($)}An(),oe=!0;const t=Ae(),n=document.createElement("div"),o=t===Ao,i=o?"0 6px 24px rgba(0,0,0,.7),0 2px 8px rgba(0,0,0,.5)":"0 4px 20px rgba(0,0,0,.12),0 0 0 1px rgba(0,0,0,.08)";n.id=J,n.style.cssText=["position:fixed","bottom:4rem","left:50%","transform:translateX(-50%)","z-index:2147483645","display:flex","align-items:center","gap:4px","padding:4px",`background:${t.bg}`,"border:0",`box-shadow:${i}`,"pointer-events:auto","user-select:none",'font:13px/1.6 "JetBrains Mono","Geist Mono",ui-monospace,"Cascadia Code","Fira Code",monospace'].join(";"),n.addEventListener("click",$=>$.stopPropagation()),n.addEventListener("mousedown",$=>$.stopPropagation());let r=0,a=0;const l=S($=>{n.style.left=`${$.clientX-r}px`,n.style.top=`${$.clientY-a}px`,n.style.transform="none",n.style.bottom="auto",n.style.cursor="grabbing"},"onDragMove"),d=S(()=>{document.removeEventListener("pointermove",l),document.removeEventListener("pointerup",d),n.style.cursor=""},"onDragEnd");n.addEventListener("pointerdown",$=>{if($.target.closest("button"))return;const B=n.getBoundingClientRect();r=$.clientX-B.left,a=$.clientY-B.top,document.addEventListener("pointermove",l),document.addEventListener("pointerup",d)});const x=document.createElement("div");x.style.cssText=["display:flex","flex-direction:column","gap:2px","padding:2px 4px","cursor:grab",`color:${t.muted}`,"opacity:0.4","transition:opacity 0.15s"].join(";"),x.addEventListener("pointerover",()=>{x.style.opacity="0.8"}),x.addEventListener("pointerout",()=>{x.style.opacity="0.4"});for(let $=0;$<3;$++){const B=document.createElement("div");B.style.cssText="display:flex;gap:2px;";for(let A=0;A<2;A++){const s=document.createElement("div");s.style.cssText=`width:2px;height:2px;border-radius:50%;background:${t.muted};`,B.append(s)}x.append(B)}n.append(x),Ue="inspect";const h=S(($,B,A)=>{const s=document.createElement("button");s.type="button",s.title=B;const g=document.createElement("div");g.style.cssText="width:24px;height:24px;display:flex;align-items:center;justify-content:center;user-select:none;",g.append(It($)),s.append(g);const m=S(()=>{const y=Ue===A;s.style.cssText=["position:relative","display:flex","justify-content:center","align-items:center","border:0","white-space:nowrap","padding:0","margin:0","cursor:pointer",`background:${y?`${t.primary}1f`:"transparent"}`,`color:${y?t.primary:t.muted}`,"transition:all 150ms"].join(";")},"applyState");return m(),s.addEventListener("pointerover",()=>{s.style.background=`${t.primary}14`,s.style.color=t.primary}),s.addEventListener("pointerout",m),s.addEventListener("pointerdown",()=>{s.style.transform="scale(0.94)"}),s.addEventListener("pointerup",()=>{s.style.transform=""}),s.addEventListener("click",y=>{y.preventDefault(),y.stopPropagation(),Ue=A,m();for(const w of n.querySelectorAll("[data-mode]"))w!==s&&w.dispatchEvent(new Event("pointerout"))}),s.dataset.mode=A,s},"createModeButton"),c=h(Oo,"Inspect mode — click to view source & info","inspect");n.append(c);const u=h(jo,"Annotate mode — click to add feedback","annotate");n.append(u);const p=document.createElement("span");p.style.cssText=`width:1px;height:20px;background:${o?"rgba(196,181,253,0.2)":"rgba(124,58,237,0.2)"};flex-shrink:0;`,n.append(p);const b=Qn(),T=we(t,b?Qt:Ut,b?"Resume animations (P)":"Pause animations (P)",()=>{const $=Jn();Jt(T,$?Qt:Ut),T.title=$?"Resume animations (P)":"Pause animations (P)",T.dataset.active=$?"1":"",T.style.color=$?t.primary:t.muted,T.style.background=$?`${t.primary}22`:"transparent"},b);n.append(T);const v=we(t,Kt,"Toggle markers (H)",()=>{oe=!oe;for(const $ of document.querySelectorAll(".__vdt_annotation_marker"))$.style.visibility=oe?"visible":"hidden";Jt(v,oe?Kt:Ro),v.title=oe?"Hide markers (H)":"Show markers (H)",v.dataset.active=oe?"":"1",v.style.color=oe?t.muted:t.primary,v.style.background=oe?"transparent":`${t.primary}22`});n.append(v);const D=we(t,Io,"Copy annotations (C)",async()=>{const $=globalThis.__VISULIMA_DEVTOOLS__?.rpc;if($?.getAnnotations)try{const B=await $.getAnnotations(),{annotationsToMarkdown:A}=await Promise.resolve().then(()=>Vn),s=A(B,_t().outputDetail);await navigator.clipboard.writeText(s),vt("Copied to clipboard")}catch{vt("Copy failed","error")}});n.append(D);const k=Vt(),C=we(t,No,"Toggle rulers (R)",()=>{Vt()?(Sn(),C.dataset.active="",C.style.color=t.muted,C.style.background="transparent"):(So(t),C.dataset.active="1",C.style.color=t.primary,C.style.background=`${t.primary}22`)},k);n.append(C);const F="__vdt_clear_confirm";n.append(we(t,Do,"Clear all annotations (X)",()=>{document.getElementById(F)?.remove();const $=n.getBoundingClientRect(),B=document.createElement("div");B.id=F,B.style.cssText=["position:fixed","z-index:2147483646",`bottom:${window.innerHeight-$.top+6}px`,`left:${$.left}px`,`background:${t.bg}`,`box-shadow:${i}`,"padding:6px 12px","display:flex","align-items:center","gap:8px",'font:12px/1 "JetBrains Mono","Geist Mono",ui-monospace,"Cascadia Code","Fira Code",monospace',`color:${t.fg}`,"pointer-events:auto"].join(";"),B.addEventListener("click",m=>m.stopPropagation()),B.addEventListener("mousedown",m=>m.stopPropagation());const A=document.createElement("span");A.textContent="Clear all annotations?",A.style.cssText=`color:${t.muted};font-size:11px;`;const s=document.createElement("button");s.type="button",s.textContent="Yes, clear",s.style.cssText="background:#ef4444;color:#fff;border:none;padding:4px 10px;cursor:pointer;font-size:11px;font-weight:600;",s.addEventListener("click",async m=>{m.stopPropagation(),B.remove();const y=globalThis.__VISULIMA_DEVTOOLS__?.rpc;if(!y?.getAnnotations||!y?.deleteAnnotation)return;const w=await y.getAnnotations();await Promise.all(w.map(z=>y.deleteAnnotation(z.id))),await X(),vt(`${w.length} annotation${w.length===1?"":"s"} cleared`)});const g=document.createElement("button");g.type="button",g.textContent="Cancel",g.style.cssText=`background:transparent;color:${t.muted};border:1px solid ${t.btnBorder};padding:4px 10px;cursor:pointer;font-size:11px;`,g.addEventListener("click",m=>{m.stopPropagation(),B.remove()}),B.append(A,s,g),document.body.append(B),setTimeout(()=>B.remove(),5e3)}));const R=document.createElement("span");R.style.cssText=`width:1px;height:20px;background:${o?"rgba(196,181,253,0.2)":"rgba(124,58,237,0.2)"};flex-shrink:0;`,n.append(R),n.append(we(t,Fo,"Close inspector (Esc)",()=>{e()})),document.body.append(n)},"createFloatingBadge"),Ho=S((e,t)=>{const n=document.createElement("div");n.style.cssText=`margin-bottom:10px;padding:6px 8px;background:${t.btnBg};border:1px solid ${t.btnBorder};font-size:10px;line-height:1.6;`;const o=document.createElement("div");o.style.cssText=`color:${t.primary};font-weight:bold;margin-bottom:2px;font-size:11px;`,o.textContent="Accessibility",n.append(o);const i=S((a,l,d=!1)=>{const x=document.createElement("div");x.style.cssText="display:flex;gap:6px;align-items:baseline;";const h=document.createElement("span");h.style.cssText=`color:${t.muted};min-width:70px;`,h.textContent=a;const c=document.createElement("span");c.style.cssText=`color:${d?t.primary:t.fg};word-break:break-all;`,c.textContent=l,x.append(h,c),n.append(x)},"addRow");e.role&&i("role",e.role,!0),i("focusable",String(e.focusable)),e.tabindex!==null&&i("tabindex",String(e.tabindex));const r=Object.keys(e.ariaAttributes);for(const a of r)i(a,e.ariaAttributes[a]);if(!e.role&&r.length===0&&e.tabindex===null){const a=document.createElement("div");a.style.cssText=`color:${t.muted};font-style:italic;`,a.textContent="No ARIA attributes",n.append(a)}return n},"renderA11ySection");let Ee;const Vo=S(e=>{const t=e.split(":"),n=Number.parseInt(t.at(-1)??"0",10)||void 0,o=Number.parseInt(t.at(-2)??"0",10)||void 0,i=t.slice(0,-2).join(":");globalThis.__VISULIMA_DEVTOOLS__?.rpc?.openInEditor?.(i,o,n,Mn()).catch(()=>{})},"openInEditor"),le=S(()=>{Ee?.(),Ee=void 0,document.querySelector(`#${Be}`)?.remove()},"removeResultPopup"),ot=S((e,t)=>{const n=Ae(),o=document.createElement("button");return o.textContent=e,o.style.cssText=[`background:${n.btnBg}`,`border:1px solid ${n.btnBorder}`,`color:${n.primary}`,"cursor:pointer","font:11px/1 'JetBrains Mono',monospace","padding:5px 10px","white-space:nowrap"].join(";"),o.addEventListener("pointerover",()=>{o.style.background=n.btnBgHover,o.style.borderColor=n.btnBorderHover}),o.addEventListener("pointerout",()=>{o.style.background=n.btnBg,o.style.borderColor=n.btnBorder}),o.addEventListener("click",i=>{i.stopPropagation(),t()}),o},"makeActionButton"),Wt=S((e,t,n,o,i)=>{Ee?.(),Ee=void 0,le();const r=Ae(),a=document.createElement("div");a.id=Be,a.style.cssText=["position:fixed","z-index:2147483646",`background:${r.bg}`,`border:1px solid ${r.btnBorder}`,"padding:10px 32px 10px 12px","font:12px/1.4 'JetBrains Mono',monospace",`color:${r.fg}`,`box-shadow:${r.shadow}`,"min-width:200px","max-width:400px","pointer-events:auto"].join(";");const l=o??t.left,d=i??t.bottom,x=e.tagName.toLowerCase(),h=e.id?`#${e.id}`:"",c=e.classList.length>0?`.${[...e.classList].slice(0,3).join(".")}`:"",u=document.createElement("div");if(u.style.cssText=`color:${r.primary};font-weight:bold;margin-bottom:4px;word-break:break-all;`,u.textContent=`${x}${h}${c}`,a.append(u),n){const k=document.createElement("div");k.style.cssText=`color:${r.muted};margin-bottom:10px;word-break:break-all;font-size:10px;`,k.textContent=n,a.append(k)}const p=ko(e);a.append(Ho(p,r));const b=document.createElement("div");b.style.cssText="display:flex;gap:6px;flex-wrap:wrap;",n&&b.append(ot("Open in editor",()=>{Vo(n),le()})),b.append(ot("Copy HTML",()=>{navigator.clipboard.writeText(e.outerHTML).catch(()=>{}),le()})),n&&b.append(ot("Copy path",()=>{navigator.clipboard.writeText(n).catch(()=>{}),le()})),b.append(ot("Copy A11y",()=>{navigator.clipboard.writeText(Eo(p)).catch(()=>{}),le()})),a.append(b);const T=document.createElement("button");T.textContent="×",T.style.cssText=["position:absolute","top:6px","right:8px","background:transparent","border:none",`color:${r.muted}`,"cursor:pointer","font:16px/1 'JetBrains Mono',monospace","padding:0","line-height:1","transition:color 0.15s"].join(";"),T.addEventListener("pointerover",()=>{T.style.color=r.fg}),T.addEventListener("pointerout",()=>{T.style.color=r.muted}),T.addEventListener("click",k=>{k.stopPropagation(),le()}),a.append(T),a.style.top="-9999px",a.style.left="-9999px",document.body.append(a),xn(()=>{if(!document.contains(a))return;const k=a.getBoundingClientRect(),C=window.innerWidth,F=window.innerHeight,R=8;let $;d+R+k.height<=F-R?$=d+R:d-t.height-R-k.height>=R?$=d-t.height-R-k.height:$=Math.max(R,F-k.height-R);let B;B=l+k.width<=C-R?l:Math.max(R,C-k.width-R),a.style.top=`${$}px`,a.style.left=`${B}px`},0);const v=S(k=>{a.contains(k.target)||(le(),document.removeEventListener("click",v,!0),Ee=void 0)},"handleOutside"),D=setTimeout(()=>{document.addEventListener("click",v,!0)},100);Ee=S(()=>{clearTimeout(D),document.removeEventListener("click",v,!0)},"removePopupOutsideHandler")},"showResultPopup");let at;const Yo=S(e=>{at?.(),Mo(),Xt(!0),X().catch(()=>{}),wo();const t=S(()=>document.querySelector(`#${J}`)??void 0,"badgeElement"),n=S(s=>{if(!s)return!1;const g=t();return!!(g&&(s===g||g.contains(s)))},"isOverBadge"),o=S(s=>{if(!s)return!1;const g=document.querySelector(`#${Be}`);return!!(g&&(s===g||g.contains(s)))},"isOverResultPopup"),i=new MutationObserver(s=>{for(const g of s)for(const m of g.addedNodes)if(m instanceof HTMLElement&&(m.tagName==="VITE-ERROR-OVERLAY"||m.id==="vite-error-overlay")){C.cleanup(),e();return}});i.observe(document.body,{childList:!0});const r="__vdt_multi_select_outline";let a=[];const l={cmd:!1,shift:!1},d=S(()=>{for(const g of document.querySelectorAll(`.${r}`))g.remove();const s=a.length>1;for(const g of a){const m=g.element.getBoundingClientRect(),y=document.createElement("div");y.className=r,y.style.cssText=["position:fixed","pointer-events:none","z-index:2147483644","box-sizing:border-box",`top:${m.top}px`,`left:${m.left}px`,`width:${m.width}px`,`height:${m.height}px`,s?"border:2px solid rgba(34,197,94,0.7);background:rgba(34,197,94,0.08);":`border:2px solid ${Ae().overlayBorder};background:${Ae().overlayBg};`,"transition:all 0.1s;"].join(""),document.body.append(y)}},"renderMultiSelectOutlines"),x=S(()=>{for(const s of document.querySelectorAll(`.${r}`))s.remove()},"removeMultiSelectOutlines"),h=S(()=>{if(a.length!==0)if(ve(),a.length===1){const s=a[0],g=s.element.getBoundingClientRect(),m=Et(s.element);x(),a=[],Ue==="annotate"?ct(s.element,g,m,void 0,{x:g.left+g.width/2,y:g.top+g.height/2}):Wt(s.element,g,m)}else{const s=a.map(w=>w.element),g=s.map(w=>w.getBoundingClientRect()),m=g.map(w=>({height:w.height,width:w.width,x:w.x,y:w.y})),y=new DOMRect(Math.min(...g.map(w=>w.left)),Math.min(...g.map(w=>w.top)),Math.max(...g.map(w=>w.right))-Math.min(...g.map(w=>w.left)),Math.max(...g.map(w=>w.bottom))-Math.min(...g.map(w=>w.top)));x(),a=[],jt(s,y,m)}},"commitMultiSelect"),c={hasMoved:!1,x:0,y:0},u=S(s=>{if((s.key==="Meta"||s.key==="Control")&&(l.cmd=!0,c.hasMoved&&!Ze())){const g=rt(c.x,c.y);if(g&&!tt(g)){nt(g);const m=document.querySelector(`#${me}`);m&&(m.style.borderStyle="dashed")}}s.key==="Shift"&&(l.shift=!0)},"handleModifierKeyDown"),p=S(s=>{const g=l.cmd&&l.shift;if((s.key==="Meta"||s.key==="Control")&&(l.cmd=!1,c.hasMoved&&!Ze())){const y=_e(c.x,c.y);if(y&&!tt(y)){nt(y);const w=document.querySelector(`#${me}`);w&&(w.style.borderStyle="solid")}}s.key==="Shift"&&(l.shift=!1);const m=l.cmd&&l.shift;g&&!m&&a.length>0&&h()},"handleModifierKeyUp"),b=S(()=>{l.cmd=!1,l.shift=!1,a.length>0&&(x(),a=[])},"handleModifierBlur");document.addEventListener("keydown",u),document.addEventListener("keyup",p),window.addEventListener("blur",b);const T="__vdt_drag_rect";let v,D=!1;const k=S(()=>{document.querySelector(`#${T}`)?.remove(),v=void 0,D=!1},"removeDragRect"),C={cleanup(){document.removeEventListener("mousemove",C.handleMouseMove),document.removeEventListener("mousedown",C.handleMouseDown),document.removeEventListener("mouseup",C.handleMouseUp,!0),document.removeEventListener("click",C.handleClick,!0),document.removeEventListener("keydown",C.handleKeyDown),i.disconnect(),ve(),Po(),k(),x(),a=[],document.removeEventListener("__vdt_annotation_form_closed",A),document.removeEventListener("keydown",u),document.removeEventListener("keyup",p),window.removeEventListener("blur",b),Xt(!1),Sn(),An(),at=void 0},handleClick(s){const g=((s.metaKey||s.ctrlKey)&&!s.shiftKey?rt(s.clientX,s.clientY):_e(s.clientX,s.clientY))??s.target;if(!g||tt(g)||n(g)||o(g)||Nt(g)||yt(g))return;if((s.metaKey||s.ctrlKey)&&s.shiftKey){s.preventDefault(),s.stopPropagation();const w=a.findIndex(z=>z.element===g);w===-1?a.push({element:g,name:Tt(g),rect:g.getBoundingClientRect()}):a.splice(w,1),d();return}if(s.preventDefault(),s.stopPropagation(),Ze()){fo();return}if(!_t().blockInteractions&&g.closest?.("button, a, input, select, textarea, [role='button'], [onclick]"))return;wn();const m=g.getBoundingClientRect(),y=Et(g);Ue==="annotate"?(nt(g),ct(g,m,y,void 0,{x:s.clientX,y:s.clientY})):(ve(),Wt(g,m,y,s.clientX,s.clientY))},handleKeyDown(s){const g=s.target?.tagName;if(g==="INPUT"||g==="TEXTAREA"||g==="SELECT")return;if(s.key==="Escape"){if(a.length>0){x(),a=[];return}C.cleanup(),e();return}const m=s.key.toLowerCase();if(m==="p"){s.preventDefault(),document.querySelector(`#${J} button[title*="animations"]`)?.click();return}if(m==="h"){s.preventDefault(),document.querySelector(`#${J} button[title*="markers"]`)?.click();return}if(m==="c"&&!s.ctrlKey&&!s.metaKey){s.preventDefault(),document.querySelector(`#${J} button[title*="Copy"]`)?.click();return}if(m==="r"){s.preventDefault(),document.querySelector(`#${J} button[title*="rulers"]`)?.click();return}m==="x"&&(s.preventDefault(),document.querySelector(`#${J} button[title*="Clear"]`)?.click())},handleMouseDown(s){const g=s.composedPath()[0]||s.target;g.closest?.(`#${J}`)||g.closest?.(`#${Be}`)||g.classList?.contains("__vdt_annotation_marker")||yt(g)||g.closest?.("#__vdt_annotation_form")||g.closest?.("#__vdt_annotation_detail")||Bo.has(g.tagName)||g.isContentEditable||(v={x:s.clientX,y:s.clientY},D=!1)},handleMouseMove(s){if(Ze())return;if(v){const w=s.clientX-v.x,z=s.clientY-v.y,f=w*w+z*z,M=8;if(!D&&f<M*M)return;D=!0;let L=document.querySelector(`#${T}`);L||(L=document.createElement("div"),L.id=T,L.style.cssText="position:fixed;pointer-events:none;z-index:2147483644;border:2px dashed rgba(99,102,241,0.7);background:rgba(99,102,241,0.1);",document.body.append(L));const Q=Math.min(v.x,s.clientX),te=Math.min(v.y,s.clientY),re=Math.abs(s.clientX-v.x),ye=Math.abs(s.clientY-v.y);L.style.left=`${Q}px`,L.style.top=`${te}px`,L.style.width=`${re}px`,L.style.height=`${ye}px`;return}c.x=s.clientX,c.y=s.clientY,c.hasMoved=!0;const g=(s.metaKey||s.ctrlKey)&&!s.shiftKey,m=(g?rt(s.clientX,s.clientY):_e(s.clientX,s.clientY))??s.target;if(!m||tt(m)||n(m)||o(m)||Nt(m)||yt(m)){ve();return}nt(m);const y=document.querySelector(`#${me}`);y&&(y.style.borderStyle=g?"dashed":"solid")},handleMouseUp(s){if(!v||!D){k();return}s.preventDefault(),s.stopPropagation();const g=Math.min(v.x,s.clientX),m=Math.min(v.y,s.clientY),y=Math.abs(s.clientX-v.x),w=Math.abs(s.clientY-v.y);if(k(),y<20||w<20)return;const z=new DOMRect(g,m,y,w),f=mn(z);if(ve(),f.length===0)bo(z);else{const M=gn(f);jt(f,z,M)}}},{cleanup:F,handleClick:R,handleKeyDown:$,handleMouseMove:B}=C;qo(()=>{F(),e()});const A=S(()=>{ve()},"onFormClosed");document.addEventListener("__vdt_annotation_form_closed",A),document.addEventListener("mousemove",B),document.addEventListener("mousedown",C.handleMouseDown),document.addEventListener("mouseup",C.handleMouseUp,!0),document.addEventListener("click",R,!0),document.addEventListener("keydown",$),at=F},"startGlobalInspection"),Xo=S(()=>{at?.(),le(),vn(),$n();const e=globalThis.__VISULIMA_DEVTOOLS__;e?.getActiveApp?.()==="dev-toolbar:annotations"&&e.setAppActive?.("dev-toolbar:annotations",!1)},"stopGlobalInspection"),Jo={icon:zn,id:"dev-toolbar:inspector",name:"Inspector",onClick(){const e=globalThis.__VISULIMA_DEVTOOLS__;Yo(async()=>{try{if(vn(),$n(),e?.getActiveApp?.()==="dev-toolbar:annotations")try{await e.closeApp?.()}catch{}}finally{e?.setAppActive&&e.setAppActive("dev-toolbar:inspector",!1)}})},onDeactivate(){Xo()}};export{Jo as default};

package/dist/apps/inspector/inspector-app.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Start element inspection mode.
+ * Attaches crosshair cursor, hover highlight overlay, and a floating badge.
+ * Inspection stays active after each click so the user can inspect multiple
+ * elements without re-activating. Only stops on explicit cancel (Escape,
+ * badge Cancel button) or via {@link stopGlobalInspection}.
+ * Survives component unmounts — state lives at module level.
+ * @param onCancel Called when the user cancels via badge button or Escape.
+ */
+export declare const startGlobalInspection: (onCancel: () => void) => void;
+/**
+ * Cancel any in-progress inspection and clean up all DOM side-effects.
+ */
+export declare const stopGlobalInspection: () => void;

package/dist/apps/inspector/rulers.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Viewport rulers & draggable guidelines for the inspector.
+ *
+ * Rulers are rendered with Canvas 2D (DPR-aware) along the top and left
+ * viewport edges. Users can drag from a ruler to spawn a guideline — a
+ * reference line that snaps to nearby element edges. Dragging a guideline
+ * back onto the ruler removes it.
+ */
+import type { InspectorPalette } from "./theme-palette.d.ts";
+export declare const createRulers: (palette: InspectorPalette) => void;
+export declare const removeRulers: () => void;
+export declare const areRulersVisible: () => boolean;
+/** Check if an element is part of the ruler/guideline system. */
+export declare const isRulerElement: (element: Element) => boolean;

package/dist/apps/inspector/theme-palette.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Shared theme palette for inspector and annotation overlay.
+ * Both run in document.body (outside Shadow DOM) so CSS variables
+ * from the toolbar's :host are not available. We resolve the theme
+ * from the same localStorage key used by use-theme.ts.
+ */
+export interface BasePalette {
+    bg: string;
+    btnBg: string;
+    btnBgHover: string;
+    btnBorder: string;
+    btnBorderHover: string;
+    fg: string;
+    muted: string;
+    primary: string;
+    shadow: string;
+}
+export interface InspectorPalette extends BasePalette {
+    overlayBg: string;
+    overlayBorder: string;
+}
+export interface AnnotationPalette extends BasePalette {
+    danger: string;
+    success: string;
+}
+export declare const INSPECTOR_DARK: InspectorPalette;
+export declare const INSPECTOR_LIGHT: InspectorPalette;
+export declare const ANNOTATION_DARK: AnnotationPalette;
+export declare const ANNOTATION_LIGHT: AnnotationPalette;
+export declare const isDarkTheme: () => boolean;
+export declare const getInspectorPalette: () => InspectorPalette;
+export declare const getAnnotationPalette: () => AnnotationPalette;
+/** Reset cache (e.g. when theme changes). */
+export declare const resetPaletteCache: () => void;

package/dist/apps/module-graph/index.d.ts

@@ -0,0 +1,3 @@
+import type { DevToolbarApp } from "../../types/app.d.ts";
+declare const moduleGraphApp: DevToolbarApp;
+export default moduleGraphApp;

package/dist/apps/module-graph/index.js

@@ -0,0 +1,20 @@
+var U=Object.defineProperty;var k=(o,d)=>U(o,"name",{value:d,configurable:!0});import{addHookName as i}from"preact/devtools";import{clsx as j}from"../../packem_shared/clsx-wGlvpUfw.js";import{useState as s,useRef as E,useEffect as S}from"preact/hooks";import{jsx as r,jsxs as t}from"preact/jsx-runtime";import b from"../../packem_shared/Button-Bkx66Co7.js";import A from"../../packem_shared/Input-Cs6aduTi.js";const G=`<!-- @license lucide-static v1.8.0 - ISC -->
+<svg
+  class="lucide lucide-network"
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <rect x="16" y="16" width="6" height="6" rx="1" />
+  <rect x="2" y="16" width="6" height="6" rx="1" />
+  <rect x="9" y="2" width="6" height="6" rx="1" />
+  <path d="M5 16v-3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v3" />
+  <path d="M12 12V8" />
+</svg>
+`;var $=Object.defineProperty,n=k((o,d)=>$(o,"name",{value:d,configurable:!0}),"o");const B={css:"bg-purple-500/15 text-purple-400 border-purple-500/30",js:"bg-green-500/15 text-green-400 border-green-500/30",json:"bg-yellow-500/15 text-yellow-400 border-yellow-500/30",jsx:"bg-green-500/15 text-green-400 border-green-500/30",svg:"bg-orange-500/15 text-orange-400 border-orange-500/30",ts:"bg-blue-500/15 text-blue-400 border-blue-500/30",tsx:"bg-blue-500/15 text-blue-400 border-blue-500/30",vue:"bg-emerald-500/15 text-emerald-400 border-emerald-500/30"},F=/\.([a-z]+)(?:\?|$)/i,H=n(o=>o.match(F)?.[1]?.toLowerCase()??"?","getExtension"),C=n(({ext:o})=>r("span",{class:j("inline-flex px-1.5 py-0.5 text-[0.6rem] font-mono font-bold uppercase border",B[o]??"bg-foreground/6 text-muted-foreground border-border"),children:o}),"ExtensionBadge"),N=n(({helpers:o})=>{const[d,I]=i(s([]),"modules"),[M,p]=i(s(!0),"loading"),[v,w]=i(s(void 0),"error"),[x,L]=i(s(""),"search"),[c,u]=i(s(void 0),"selectedId"),[y,h]=i(s([]),"importersList"),R=i(E(null),"searchRef"),f=n(()=>{p(!0),w(void 0),u(void 0),o.rpc.getModuleGraph().then(e=>{const a=e.map(l=>({ext:H(l.url??l.id??""),id:l.id??l.url??"",importers:l.importerCount??0,importerUrls:Array.isArray(l.importerUrls)?l.importerUrls:[],url:l.url??l.id??""}));I(a),p(!1)}).catch(e=>{w(e.message??"Failed to load module graph"),p(!1)})},"load");S(()=>{f()},[]);const g=d.filter(e=>{const a=x.toLowerCase();return!a||e.url.toLowerCase().includes(a)||e.ext.includes(a)}),m=c?d.find(e=>e.id===c):void 0,z=n(e=>{if(c===e.id){u(void 0),h([]);return}u(e.id),h(e.importerUrls)},"showImporters");return M?t("div",{class:"flex flex-col items-center justify-center h-full gap-3 p-8 select-none",children:[r("div",{"aria-hidden":"true",class:"flex gap-1.5 items-center",children:[0,160,320].map(e=>r("span",{class:"size-1.5 bg-primary/50 rounded-full animate-pulse",style:{animationDelay:`${e}ms`}},e))}),r("span",{class:"text-[0.75rem] text-muted-foreground",children:"Scanning module graph…"})]}):v?t("div",{class:"flex flex-col items-center justify-center h-full gap-3 p-8 text-center",children:[r("p",{class:"text-[0.8rem] text-destructive",children:v}),r(b,{onClick:f,size:"sm",variant:"outline",children:"Retry"})]}):t("div",{class:"flex flex-col h-full",children:[t("div",{class:"flex items-center gap-2 px-4 py-2.5 border-b border-border shrink-0",children:[r(A,{class:"flex-1 bg-foreground/4 font-mono text-[0.8rem] placeholder:text-muted-foreground/50 focus-visible:border-primary/50 border-border",onInput:n(e=>{L(e.target.value)},"onInput"),placeholder:"Filter modules…",ref:R,type:"text",value:x}),t("span",{class:"text-[0.7rem] text-muted-foreground shrink-0",children:[g.length," / ",d.length]}),r(b,{onClick:f,size:"sm",variant:"outline",children:"Refresh"})]}),t("div",{class:"flex flex-1 min-h-0 overflow-hidden",children:[r("div",{class:"flex-1 overflow-auto divide-y divide-border/30",children:g.length===0?t("div",{class:"flex items-center justify-center p-8 text-[0.8rem] text-muted-foreground",children:['No modules match "',x,'"']}):g.map(e=>t("button",{class:j("w-full flex items-center gap-3 px-4 py-2.5 text-left border-0 bg-transparent cursor-pointer","hover:bg-foreground/4 transition-colors duration-100",c===e.id&&"bg-primary/6"),onClick:n(()=>{z(e)},"onClick"),type:"button",children:[r(C,{ext:e.ext}),r("span",{class:"flex-1 text-[0.775rem] font-mono text-foreground/80 truncate min-w-0",children:e.url}),e.importers>0&&t("span",{class:"shrink-0 text-[0.65rem] text-muted-foreground px-1.5 py-0.5 bg-foreground/6 border border-border/50",children:[e.importers,"↑"]})]},e.id))}),m&&t("div",{class:"border-l border-border bg-background w-72 shrink-0 flex flex-col overflow-hidden",children:[t("div",{class:"flex items-center justify-between gap-2 px-4 py-3 border-b border-border shrink-0",children:[r("span",{class:"text-[0.7rem] font-semibold text-foreground uppercase tracking-wide",children:"Module Info"}),r(b,{"aria-label":"Close",class:"h-6 w-6 text-xs",onClick:n(()=>{u(void 0),h([])},"onClick"),size:"icon",variant:"ghost",children:"✕"})]}),t("div",{class:"flex-1 overflow-auto p-4 space-y-3",children:[t("div",{children:[r("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"URL"}),r("code",{class:"text-[0.7rem] font-mono text-foreground/80 break-all",children:m.url})]}),t("div",{children:[r("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"Type"}),r(C,{ext:m.ext})]}),t("div",{children:[r("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"Importers"}),r("span",{class:"text-[0.8rem] font-mono text-foreground",children:m.importers})]}),y.length>0&&t("div",{children:[r("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"Imported by"}),r("div",{class:"space-y-1",children:y.map(e=>r("code",{class:"block text-[0.65rem] font-mono text-muted-foreground break-all",children:e},e))})]})]})]})]})]})},"ModuleGraphApp"),K={component:N,icon:G,id:"dev-toolbar:module-graph",name:"Modules"};export{K as default};