@oddsquad/vite-plugin-lit 0.2.3 → 0.4.0

package/lib/runtime/edge-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"edge-panel.js","sourceRoot":"","sources":["../../../../packages/labs/vite-plugin-lit/src/lib/runtime/edge-panel.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/**\n * Keeps our on-page dev UI (HMR indicator, source-overlay tooltip) clear of the\n * Vite DevTools edge panel so they don't sit on top of it.\n *\n * The panel is `#vite-devtools-edge-panel` inside the open shadow root of the\n * `<vite-devtools-dock-embedded>` host, and only exists while the dock is\n * docked to an edge (it can be moved/resized). We report the inset, in px, that\n * the panel occupies on each viewport edge it touches — plus a small gap — so\n * callers can offset themselves.\n */\n\nconst HOST_TAG = 'vite-devtools-dock-embedded';\nconst PANEL_ID = 'vite-devtools-edge-panel';\n/** Gap to leave between our UI and the devtools panel. */\nconst GAP = 12;\n/** Tolerance (px) for treating the panel as touching a viewport edge. */\nconst EDGE = 2;\n\nexport interface EdgeInsets {\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n}\n\nconst ZERO: EdgeInsets = {top: 0, right: 0, bottom: 0, left: 0};\n\nconst findPanel = (): HTMLElement | null => {\n  const host = document.querySelector(HOST_TAG);\n  const root = (host as {shadowRoot?: ShadowRoot | null} | null)?.shadowRoot;\n  return (root?.getElementById(PANEL_ID) as HTMLElement | null) ?? null;\n};\n\n/**\n * Inset (px + gap) the docked panel occupies, on the single edge it's docked\n * to. The panel docks to one edge and spans the perpendicular axis fully, so we\n * pick the dock edge from which axis it spans — a full-width panel is docked\n * top/bottom, a full-height one left/right. (Inferring the edge per-side would\n * wrongly flag a full-width bottom panel as also docked left and right.)\n */\nconst computeInsets = (): EdgeInsets => {\n  const panel = findPanel();\n  if (panel === null) return ZERO;\n  const r = panel.getBoundingClientRect();\n  if (r.width === 0 || r.height === 0) return ZERO;\n  // Use the layout viewport (excludes scrollbars) — a fixed `right:0`/`bottom:0`\n  // panel aligns to clientWidth/Height, not innerWidth/Height, so comparing\n  // against the latter would miss a full-width panel whenever a scrollbar is\n  // present.\n  const vw = document.documentElement.clientWidth;\n  const vh = document.documentElement.clientHeight;\n  const spansWidth = r.left <= EDGE && r.right >= vw - EDGE;\n  const spansHeight = r.top <= EDGE && r.bottom >= vh - EDGE;\n  const insets = {...ZERO};\n  if (spansWidth && !spansHeight) {\n    if (r.top <= EDGE) insets.top = r.bottom + GAP;\n    else if (r.bottom >= vh - EDGE) insets.bottom = vh - r.top + GAP;\n  } else if (spansHeight && !spansWidth) {\n    if (r.left <= EDGE) insets.left = r.right + GAP;\n    else if (r.right >= vw - EDGE) insets.right = vw - r.left + GAP;\n  }\n  return insets;\n};\n\n/**\n * Calls `onChange` with the current insets and again whenever they change — the\n * panel being docked/resized/moved, the window resizing, or the devtools\n * mounting after us. Returns a disposer.\n */\nexport const observeEdgeInsets = (\n  onChange: (insets: EdgeInsets) => void\n): (() => void) => {\n  let raf = 0;\n  let last = '';\n  let observedPanel: Element | null = null;\n  let observingRoot = false;\n\n  const emit = () => {\n    raf = 0;\n    const insets = computeInsets();\n    const key = `${insets.top}|${insets.right}|${insets.bottom}|${insets.left}`;\n    if (key !== last) {\n      last = key;\n      onChange(insets);\n    }\n  };\n  const schedule = () => {\n    if (raf === 0) raf = requestAnimationFrame(emit);\n  };\n\n  const ro = new ResizeObserver(schedule);\n  // Re-attach on any devtools DOM change (panel mounting, docking to a new edge)\n  // then recompute; cheap thanks to the rAF + diff above.\n  const mo = new MutationObserver(() => attach());\n\n  const attach = () => {\n    const host = document.querySelector(HOST_TAG);\n    const root = (host as {shadowRoot?: ShadowRoot | null} | null)?.shadowRoot;\n    if (root && !observingRoot) {\n      observingRoot = true;\n      mo.observe(root, {\n        childList: true,\n        subtree: true,\n        attributes: true,\n        attributeFilter: ['style', 'class'],\n      });\n    }\n    const panel = findPanel();\n    if (panel !== null && panel !== observedPanel) {\n      observedPanel = panel;\n      ro.observe(panel);\n    }\n    schedule();\n  };\n\n  // The devtools host mounts asynchronously; poll until it's present, then let\n  // the observers drive updates.\n  let tries = 0;\n  const poll = () => {\n    attach();\n    if (!observingRoot && tries++ < 60) {\n      setTimeout(poll, 250);\n    }\n  };\n  poll();\n\n  window.addEventListener('resize', schedule);\n\n  return () => {\n    window.removeEventListener('resize', schedule);\n    ro.disconnect();\n    mo.disconnect();\n    if (raf !== 0) cancelAnimationFrame(raf);\n  };\n};\n"]}
+{"version":3,"file":"edge-panel.js","sourceRoot":"","sources":["../../src/lib/runtime/edge-panel.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/**\n * Keeps our on-page dev UI (HMR indicator, source-overlay tooltip) clear of the\n * Vite DevTools edge panel so they don't sit on top of it.\n *\n * The panel is `#vite-devtools-edge-panel` inside the open shadow root of the\n * `<vite-devtools-dock-embedded>` host, and only exists while the dock is\n * docked to an edge (it can be moved/resized). We report the inset, in px, that\n * the panel occupies on each viewport edge it touches — plus a small gap — so\n * callers can offset themselves.\n */\n\nconst HOST_TAG = 'vite-devtools-dock-embedded';\nconst PANEL_ID = 'vite-devtools-edge-panel';\n/** Gap to leave between our UI and the devtools panel. */\nconst GAP = 12;\n/** Tolerance (px) for treating the panel as touching a viewport edge. */\nconst EDGE = 2;\n\nexport interface EdgeInsets {\n  top: number;\n  right: number;\n  bottom: number;\n  left: number;\n}\n\nconst ZERO: EdgeInsets = {top: 0, right: 0, bottom: 0, left: 0};\n\nconst findPanel = (): HTMLElement | null => {\n  const host = document.querySelector(HOST_TAG);\n  const root = (host as {shadowRoot?: ShadowRoot | null} | null)?.shadowRoot;\n  return (root?.getElementById(PANEL_ID) as HTMLElement | null) ?? null;\n};\n\n/**\n * Inset (px + gap) the docked panel occupies, on the single edge it's docked\n * to. The panel docks to one edge and spans the perpendicular axis fully, so we\n * pick the dock edge from which axis it spans — a full-width panel is docked\n * top/bottom, a full-height one left/right. (Inferring the edge per-side would\n * wrongly flag a full-width bottom panel as also docked left and right.)\n */\nconst computeInsets = (): EdgeInsets => {\n  const panel = findPanel();\n  if (panel === null) return ZERO;\n  const r = panel.getBoundingClientRect();\n  if (r.width === 0 || r.height === 0) return ZERO;\n  // Use the layout viewport (excludes scrollbars) — a fixed `right:0`/`bottom:0`\n  // panel aligns to clientWidth/Height, not innerWidth/Height, so comparing\n  // against the latter would miss a full-width panel whenever a scrollbar is\n  // present.\n  const vw = document.documentElement.clientWidth;\n  const vh = document.documentElement.clientHeight;\n  const spansWidth = r.left <= EDGE && r.right >= vw - EDGE;\n  const spansHeight = r.top <= EDGE && r.bottom >= vh - EDGE;\n  const insets = {...ZERO};\n  if (spansWidth && !spansHeight) {\n    if (r.top <= EDGE) insets.top = r.bottom + GAP;\n    else if (r.bottom >= vh - EDGE) insets.bottom = vh - r.top + GAP;\n  } else if (spansHeight && !spansWidth) {\n    if (r.left <= EDGE) insets.left = r.right + GAP;\n    else if (r.right >= vw - EDGE) insets.right = vw - r.left + GAP;\n  }\n  return insets;\n};\n\n/**\n * Calls `onChange` with the current insets and again whenever they change — the\n * panel being docked/resized/moved, the window resizing, or the devtools\n * mounting after us. Returns a disposer.\n */\nexport const observeEdgeInsets = (\n  onChange: (insets: EdgeInsets) => void\n): (() => void) => {\n  let raf = 0;\n  let last = '';\n  let observedPanel: Element | null = null;\n  let observingRoot = false;\n\n  const emit = () => {\n    raf = 0;\n    const insets = computeInsets();\n    const key = `${insets.top}|${insets.right}|${insets.bottom}|${insets.left}`;\n    if (key !== last) {\n      last = key;\n      onChange(insets);\n    }\n  };\n  const schedule = () => {\n    if (raf === 0) raf = requestAnimationFrame(emit);\n  };\n\n  const ro = new ResizeObserver(schedule);\n  // Re-attach on any devtools DOM change (panel mounting, docking to a new edge)\n  // then recompute; cheap thanks to the rAF + diff above.\n  const mo = new MutationObserver(() => attach());\n\n  const attach = () => {\n    const host = document.querySelector(HOST_TAG);\n    const root = (host as {shadowRoot?: ShadowRoot | null} | null)?.shadowRoot;\n    if (root && !observingRoot) {\n      observingRoot = true;\n      mo.observe(root, {\n        childList: true,\n        subtree: true,\n        attributes: true,\n        attributeFilter: ['style', 'class'],\n      });\n    }\n    const panel = findPanel();\n    if (panel !== null && panel !== observedPanel) {\n      observedPanel = panel;\n      ro.observe(panel);\n    }\n    schedule();\n  };\n\n  // The devtools host mounts asynchronously; poll until it's present, then let\n  // the observers drive updates.\n  let tries = 0;\n  const poll = () => {\n    attach();\n    if (!observingRoot && tries++ < 60) {\n      setTimeout(poll, 250);\n    }\n  };\n  poll();\n\n  window.addEventListener('resize', schedule);\n\n  return () => {\n    window.removeEventListener('resize', schedule);\n    ro.disconnect();\n    mo.disconnect();\n    if (raf !== 0) cancelAnimationFrame(raf);\n  };\n};\n"]}

package/lib/runtime/fonts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fonts.d.ts","sourceRoot":"","sources":["../../../../packages/labs/vite-plugin-lit/src/lib/runtime/fonts.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;;;;;;;GAQG;AACH,eAAO,MAAM,sBAAsB,qGAAqG,CAAC;AAEzI,kFAAkF;AAClF,eAAO,MAAM,aAAa,oIAA6D,CAAC"}
+{"version":3,"file":"fonts.d.ts","sourceRoot":"","sources":["../../src/lib/runtime/fonts.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;;;;;;;GAQG;AACH,eAAO,MAAM,sBAAsB,qGAAqG,CAAC;AAEzI,kFAAkF;AAClF,eAAO,MAAM,aAAa,oIAA6D,CAAC"}

package/lib/runtime/fonts.js

@@ -15,4 +15,4 @@
 export const LIT_DEVTOOLS_FONT_MONO = `ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace`;
 /** `var()` reference to the devtools mono font with the default stack inlined. */
 export const FONT_MONO_VAR = `var(--lit-devtools-font-mono, ${LIT_DEVTOOLS_FONT_MONO})`;
-//# sourceMappingURL=fonts.js.map
+//# sourceMappingURL=fonts.js.map

package/lib/runtime/fonts.js.map

@@ -1 +1 @@
-{"version":3,"file":"fonts.js","sourceRoot":"","sources":["../../../../packages/labs/vite-plugin-lit/src/lib/runtime/fonts.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,kGAAkG,CAAC;AAEzI,kFAAkF;AAClF,MAAM,CAAC,MAAM,aAAa,GAAG,iCAAiC,sBAAsB,GAAG,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/**\n * Default monospace font stack for the devtools UI (HMR indicator, source\n * overlay). Surfaced through the `--lit-devtools-font-mono` custom property so\n * consumers can override it; this constant is the fallback default, mirroring\n * the `--lit-devtools-radius` convention.\n *\n * The devtools only render code-adjacent text, so monospace is the only stack\n * they need.\n */\nexport const LIT_DEVTOOLS_FONT_MONO = `ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace`;\n\n/** `var()` reference to the devtools mono font with the default stack inlined. */\nexport const FONT_MONO_VAR = `var(--lit-devtools-font-mono, ${LIT_DEVTOOLS_FONT_MONO})`;\n"]}
+{"version":3,"file":"fonts.js","sourceRoot":"","sources":["../../src/lib/runtime/fonts.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,kGAAkG,CAAC;AAEzI,kFAAkF;AAClF,MAAM,CAAC,MAAM,aAAa,GAAG,iCAAiC,sBAAsB,GAAG,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/**\n * Default monospace font stack for the devtools UI (HMR indicator, source\n * overlay). Surfaced through the `--lit-devtools-font-mono` custom property so\n * consumers can override it; this constant is the fallback default, mirroring\n * the `--lit-devtools-radius` convention.\n *\n * The devtools only render code-adjacent text, so monospace is the only stack\n * they need.\n */\nexport const LIT_DEVTOOLS_FONT_MONO = `ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace`;\n\n/** `var()` reference to the devtools mono font with the default stack inlined. */\nexport const FONT_MONO_VAR = `var(--lit-devtools-font-mono, ${LIT_DEVTOOLS_FONT_MONO})`;\n"]}

package/lib/runtime/indicator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"indicator.d.ts","sourceRoot":"","sources":["../../../../packages/labs/vite-plugin-lit/src/lib/runtime/indicator.ts"],"names":[],"mappings":"AAAA;;;;GAIG"}
+{"version":3,"file":"indicator.d.ts","sourceRoot":"","sources":["../../src/lib/runtime/indicator.ts"],"names":[],"mappings":"AAAA;;;;GAIG"}

package/lib/runtime/indicator.js

@@ -8,11 +8,11 @@
  * Injected by the Vite plugin as an external module so that
  * `import.meta.hot` is available.
  */
-import { FONT_MONO_VAR } from './fonts.js';
-import { FLAME_ICON } from '../icons.js';
-import { subscribeOverride } from './overrides.js';
-import { observeEdgeInsets } from './edge-panel.js';
-import { injectTokens } from '../tokens.js';
+import {FONT_MONO_VAR} from './fonts.js';
+import {FLAME_ICON} from '../icons.js';
+import {subscribeOverride} from './overrides.js';
+import {observeEdgeInsets} from './edge-panel.js';
+import {injectTokens} from '../tokens.js';
 /**
  * True when an HMR batch is purely a stylesheet swap — every update is either
  * a `css-update` or a `js-update` whose accepted module is a `.css` source
@@ -26,31 +26,29 @@ import { injectTokens } from '../tokens.js';
  * rather than being silently dropped.
  */
 function isStyleSwap(data) {
-    const updates = data?.updates;
-    if (!Array.isArray(updates) || updates.length === 0)
-        return false;
-    return updates.every((u) => {
-        if (u.type === 'css-update')
-            return true;
-        if (u.type === 'js-update') {
-            return (u.acceptedPath ?? u.path ?? '').split('?')[0].endsWith('.css');
-        }
-        return false;
-    });
+  const updates = data?.updates;
+  if (!Array.isArray(updates) || updates.length === 0) return false;
+  return updates.every((u) => {
+    if (u.type === 'css-update') return true;
+    if (u.type === 'js-update') {
+      return (u.acceptedPath ?? u.path ?? '').split('?')[0].endsWith('.css');
+    }
+    return false;
+  });
 }
 class LitDevtoolsIndicator extends HTMLElement {
-    #initialized = false;
-    #count = 0;
-    #container;
-    #countEl = null;
-    constructor() {
-        super();
-        const root = this.attachShadow({ mode: 'closed' });
-        // `--idle-op` is the at-rest opacity: 0 (invisible until a pulse) without a
-        // count, .5 (count stays legible) with one. The count display and idle
-        // opacity are both driven by the `.with-count` class so the panel can
-        // toggle the count on/off live (see #setCount).
-        root.innerHTML = `
+  #initialized = false;
+  #count = 0;
+  #container;
+  #countEl = null;
+  constructor() {
+    super();
+    const root = this.attachShadow({mode: 'closed'});
+    // `--idle-op` is the at-rest opacity: 0 (invisible until a pulse) without a
+    // count, .5 (count stays legible) with one. The count display and idle
+    // opacity are both driven by the `.with-count` class so the panel can
+    // toggle the count on/off live (see #setCount).
+    root.innerHTML = `
       <style>
         @keyframes pulse{0%{opacity:var(--idle-op,0)}15%{opacity:1}80%{opacity:1}100%{opacity:var(--idle-op,0)}}
         :host{
@@ -91,51 +89,50 @@ class LitDevtoolsIndicator extends HTMLElement {
       </style>
       <div id="container"><span id="icon">${FLAME_ICON}</span><span id="indicator"><span class="dot"></span><span class="count">0</span></span></div>
     `;
-        this.#container = root.getElementById('container');
-        this.#countEl = root.querySelector('.count');
-        this.#setCount(this.hasAttribute('count'));
-    }
-    /** Show/hide the cumulative update count (and the at-rest opacity). */
-    #setCount(enabled) {
-        this.#container.classList.toggle('with-count', enabled);
-    }
-    connectedCallback() {
-        if (this.#initialized)
-            return;
-        this.#initialized = true;
-        injectTokens();
-        const hot = import.meta.hot;
-        hot?.on('vite:afterUpdate', (data) => {
-            // Count only updates that actually re-render/re-execute a component;
-            // a pure shared-stylesheet swap (?css-sheet / ?raw / ?url adopted sheet)
-            // restyles in place without re-rendering, so it pulses but doesn't count.
-            const styleSwap = isStyleSwap(data);
-            if (!styleSwap && this.#countEl !== null) {
-                this.#countEl.textContent = String(++this.#count);
-            }
-            this.#container.classList.toggle('style-swap', styleSwap);
-            this.#container.classList.remove('active');
-            void this.#container.offsetWidth;
-            this.#container.classList.add('active');
-        });
-        // Let the DevTools panel hide/show the indicator and its count live (and
-        // across reloads).
-        subscribeOverride(hot, (o) => {
-            if (o.hmrIndicatorVisible !== undefined) {
-                this.style.display = o.hmrIndicatorVisible ? '' : 'none';
-            }
-            if (o.hmrIndicatorCount !== undefined) {
-                this.#setCount(o.hmrIndicatorCount);
-            }
-        });
-        // Stay clear of the Vite DevTools edge panel.
-        observeEdgeInsets((insets) => {
-            this.style.setProperty('--edge-top', `${insets.top}px`);
-            this.style.setProperty('--edge-right', `${insets.right}px`);
-            this.style.setProperty('--edge-bottom', `${insets.bottom}px`);
-            this.style.setProperty('--edge-left', `${insets.left}px`);
-        });
-    }
+    this.#container = root.getElementById('container');
+    this.#countEl = root.querySelector('.count');
+    this.#setCount(this.hasAttribute('count'));
+  }
+  /** Show/hide the cumulative update count (and the at-rest opacity). */
+  #setCount(enabled) {
+    this.#container.classList.toggle('with-count', enabled);
+  }
+  connectedCallback() {
+    if (this.#initialized) return;
+    this.#initialized = true;
+    injectTokens();
+    const hot = import.meta.hot;
+    hot?.on('vite:afterUpdate', (data) => {
+      // Count only updates that actually re-render/re-execute a component;
+      // a pure shared-stylesheet swap (?css-sheet / ?raw / ?url adopted sheet)
+      // restyles in place without re-rendering, so it pulses but doesn't count.
+      const styleSwap = isStyleSwap(data);
+      if (!styleSwap && this.#countEl !== null) {
+        this.#countEl.textContent = String(++this.#count);
+      }
+      this.#container.classList.toggle('style-swap', styleSwap);
+      this.#container.classList.remove('active');
+      void this.#container.offsetWidth;
+      this.#container.classList.add('active');
+    });
+    // Let the DevTools panel hide/show the indicator and its count live (and
+    // across reloads).
+    subscribeOverride(hot, (o) => {
+      if (o.hmrIndicatorVisible !== undefined) {
+        this.style.display = o.hmrIndicatorVisible ? '' : 'none';
+      }
+      if (o.hmrIndicatorCount !== undefined) {
+        this.#setCount(o.hmrIndicatorCount);
+      }
+    });
+    // Stay clear of the Vite DevTools edge panel.
+    observeEdgeInsets((insets) => {
+      this.style.setProperty('--edge-top', `${insets.top}px`);
+      this.style.setProperty('--edge-right', `${insets.right}px`);
+      this.style.setProperty('--edge-bottom', `${insets.bottom}px`);
+      this.style.setProperty('--edge-left', `${insets.left}px`);
+    });
+  }
 }
 customElements.define('lit-devtools-hmr-indicator', LitDevtoolsIndicator);
-//# sourceMappingURL=indicator.js.map
+//# sourceMappingURL=indicator.js.map

package/lib/runtime/indicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"indicator.js","sourceRoot":"","sources":["../../../../packages/labs/vite-plugin-lit/src/lib/runtime/indicator.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/**\n * Custom element for the HMR update indicator.\n * Injected by the Vite plugin as an external module so that\n * `import.meta.hot` is available.\n */\n\nimport {FONT_MONO_VAR} from './fonts.js';\nimport {FLAME_ICON} from '../icons.js';\nimport {subscribeOverride} from './overrides.js';\nimport {observeEdgeInsets} from './edge-panel.js';\nimport {injectTokens} from '../tokens.js';\n\n/** One entry of a Vite `vite:afterUpdate` payload. */\ninterface ViteUpdate {\n  type?: string;\n  path?: string;\n  acceptedPath?: string;\n}\n\n/**\n * True when an HMR batch is purely a stylesheet swap — every update is either\n * a `css-update` or a `js-update` whose accepted module is a `.css` source\n * (the shared-sheet queries `?css-sheet`/`?raw`/`?url` all accept a `.css`\n * path). Such a batch restyles adopted sheets in place with no re-render.\n *\n * Heuristic: keyed on the accepted path ending in `.css`. Robust for this\n * plugin's own queries; a user hand-wiring `import.meta.hot.accept` on a raw\n * `.css` would also read as a style swap, which is the intended grouping. An\n * empty/missing payload can't be classified, so it counts as a re-render\n * rather than being silently dropped.\n */\nfunction isStyleSwap(data: unknown): boolean {\n  const updates = (data as {updates?: ViteUpdate[]} | undefined)?.updates;\n  if (!Array.isArray(updates) || updates.length === 0) return false;\n  return updates.every((u) => {\n    if (u.type === 'css-update') return true;\n    if (u.type === 'js-update') {\n      return (u.acceptedPath ?? u.path ?? '').split('?')[0].endsWith('.css');\n    }\n    return false;\n  });\n}\n\nclass LitDevtoolsIndicator extends HTMLElement {\n  #initialized = false;\n  #count = 0;\n  #container: HTMLElement;\n  #countEl: HTMLElement | null = null;\n\n  constructor() {\n    super();\n    const root = this.attachShadow({mode: 'closed'});\n    // `--idle-op` is the at-rest opacity: 0 (invisible until a pulse) without a\n    // count, .5 (count stays legible) with one. The count display and idle\n    // opacity are both driven by the `.with-count` class so the panel can\n    // toggle the count on/off live (see #setCount).\n    root.innerHTML = `\n      <style>\n        @keyframes pulse{0%{opacity:var(--idle-op,0)}15%{opacity:1}80%{opacity:1}100%{opacity:var(--idle-op,0)}}\n        :host{\n          position:fixed;inset:0;display:grid;\n          z-index:2147483647;pointer-events:none;\n          /* Base padding plus the inset the Vite DevTools edge panel occupies\n             on each edge (set from JS), so the indicator never sits on it. */\n          padding:\n            calc(var(--lit-devtools-hmr-indicator-padding,16px) + var(--edge-top,0px))\n            calc(var(--lit-devtools-hmr-indicator-padding,16px) + var(--edge-right,0px))\n            calc(var(--lit-devtools-hmr-indicator-padding,16px) + var(--edge-bottom,0px))\n            calc(var(--lit-devtools-hmr-indicator-padding,16px) + var(--edge-left,0px))\n        }\n        #container{\n          place-self:var(--lit-devtools-hmr-indicator-align,end end);\n          display:flex;align-items:stretch;\n          background:var(--lit-devtools-surface-elevated);color:var(--lit-devtools-text-strong);\n          backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);\n          border-radius:var(--lit-devtools-radius-md);\n          font:12px/1 ${FONT_MONO_VAR};font-variant-numeric:tabular-nums;\n          overflow:hidden;opacity:var(--idle-op,0)\n        }\n        #container.with-count{--idle-op:.5}\n        #container.active{animation:pulse 2.5s ease-out forwards}\n        #icon{display:flex;align-items:center;justify-content:center;padding:0 10px}\n        #icon svg{width:16px;height:16px;display:block;fill:currentColor}\n        #indicator{\n          display:flex;align-items:center;gap:6px;\n          padding:7px 12px;\n          border-left:1px solid var(--lit-devtools-border-subtle)\n        }\n        .dot{width:8px;height:8px;border-radius:50%;background:var(--lit-devtools-success);flex-shrink:0}\n        /* Style-only swaps (shared adopted stylesheet hot-swap, no re-render)\n           pulse in the calmer info color and don't bump the count. */\n        #container.style-swap .dot{background:var(--lit-devtools-info)}\n        .count{display:none}\n        #container.with-count .count{display:inline}\n      </style>\n      <div id=\"container\"><span id=\"icon\">${FLAME_ICON}</span><span id=\"indicator\"><span class=\"dot\"></span><span class=\"count\">0</span></span></div>\n    `;\n    this.#container = root.getElementById('container')!;\n    this.#countEl = root.querySelector('.count');\n    this.#setCount(this.hasAttribute('count'));\n  }\n\n  /** Show/hide the cumulative update count (and the at-rest opacity). */\n  #setCount(enabled: boolean) {\n    this.#container.classList.toggle('with-count', enabled);\n  }\n\n  connectedCallback() {\n    if (this.#initialized) return;\n    this.#initialized = true;\n    injectTokens();\n    const hot = (\n      import.meta as {\n        hot?: {on: (event: string, cb: (data?: unknown) => void) => void};\n      }\n    ).hot;\n    hot?.on('vite:afterUpdate', (data) => {\n      // Count only updates that actually re-render/re-execute a component;\n      // a pure shared-stylesheet swap (?css-sheet / ?raw / ?url adopted sheet)\n      // restyles in place without re-rendering, so it pulses but doesn't count.\n      const styleSwap = isStyleSwap(data);\n      if (!styleSwap && this.#countEl !== null) {\n        this.#countEl.textContent = String(++this.#count);\n      }\n      this.#container.classList.toggle('style-swap', styleSwap);\n      this.#container.classList.remove('active');\n      void this.#container.offsetWidth;\n      this.#container.classList.add('active');\n    });\n    // Let the DevTools panel hide/show the indicator and its count live (and\n    // across reloads).\n    subscribeOverride(hot, (o) => {\n      if (o.hmrIndicatorVisible !== undefined) {\n        this.style.display = o.hmrIndicatorVisible ? '' : 'none';\n      }\n      if (o.hmrIndicatorCount !== undefined) {\n        this.#setCount(o.hmrIndicatorCount);\n      }\n    });\n    // Stay clear of the Vite DevTools edge panel.\n    observeEdgeInsets((insets) => {\n      this.style.setProperty('--edge-top', `${insets.top}px`);\n      this.style.setProperty('--edge-right', `${insets.right}px`);\n      this.style.setProperty('--edge-bottom', `${insets.bottom}px`);\n      this.style.setProperty('--edge-left', `${insets.left}px`);\n    });\n  }\n}\n\ncustomElements.define('lit-devtools-hmr-indicator', LitDevtoolsIndicator);\n"]}
+{"version":3,"file":"indicator.js","sourceRoot":"","sources":["../../src/lib/runtime/indicator.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/**\n * Custom element for the HMR update indicator.\n * Injected by the Vite plugin as an external module so that\n * `import.meta.hot` is available.\n */\n\nimport {FONT_MONO_VAR} from './fonts.js';\nimport {FLAME_ICON} from '../icons.js';\nimport {subscribeOverride} from './overrides.js';\nimport {observeEdgeInsets} from './edge-panel.js';\nimport {injectTokens} from '../tokens.js';\n\n/** One entry of a Vite `vite:afterUpdate` payload. */\ninterface ViteUpdate {\n  type?: string;\n  path?: string;\n  acceptedPath?: string;\n}\n\n/**\n * True when an HMR batch is purely a stylesheet swap — every update is either\n * a `css-update` or a `js-update` whose accepted module is a `.css` source\n * (the shared-sheet queries `?css-sheet`/`?raw`/`?url` all accept a `.css`\n * path). Such a batch restyles adopted sheets in place with no re-render.\n *\n * Heuristic: keyed on the accepted path ending in `.css`. Robust for this\n * plugin's own queries; a user hand-wiring `import.meta.hot.accept` on a raw\n * `.css` would also read as a style swap, which is the intended grouping. An\n * empty/missing payload can't be classified, so it counts as a re-render\n * rather than being silently dropped.\n */\nfunction isStyleSwap(data: unknown): boolean {\n  const updates = (data as {updates?: ViteUpdate[]} | undefined)?.updates;\n  if (!Array.isArray(updates) || updates.length === 0) return false;\n  return updates.every((u) => {\n    if (u.type === 'css-update') return true;\n    if (u.type === 'js-update') {\n      return (u.acceptedPath ?? u.path ?? '').split('?')[0].endsWith('.css');\n    }\n    return false;\n  });\n}\n\nclass LitDevtoolsIndicator extends HTMLElement {\n  #initialized = false;\n  #count = 0;\n  #container: HTMLElement;\n  #countEl: HTMLElement | null = null;\n\n  constructor() {\n    super();\n    const root = this.attachShadow({mode: 'closed'});\n    // `--idle-op` is the at-rest opacity: 0 (invisible until a pulse) without a\n    // count, .5 (count stays legible) with one. The count display and idle\n    // opacity are both driven by the `.with-count` class so the panel can\n    // toggle the count on/off live (see #setCount).\n    root.innerHTML = `\n      <style>\n        @keyframes pulse{0%{opacity:var(--idle-op,0)}15%{opacity:1}80%{opacity:1}100%{opacity:var(--idle-op,0)}}\n        :host{\n          position:fixed;inset:0;display:grid;\n          z-index:2147483647;pointer-events:none;\n          /* Base padding plus the inset the Vite DevTools edge panel occupies\n             on each edge (set from JS), so the indicator never sits on it. */\n          padding:\n            calc(var(--lit-devtools-hmr-indicator-padding,16px) + var(--edge-top,0px))\n            calc(var(--lit-devtools-hmr-indicator-padding,16px) + var(--edge-right,0px))\n            calc(var(--lit-devtools-hmr-indicator-padding,16px) + var(--edge-bottom,0px))\n            calc(var(--lit-devtools-hmr-indicator-padding,16px) + var(--edge-left,0px))\n        }\n        #container{\n          place-self:var(--lit-devtools-hmr-indicator-align,end end);\n          display:flex;align-items:stretch;\n          background:var(--lit-devtools-surface-elevated);color:var(--lit-devtools-text-strong);\n          backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);\n          border-radius:var(--lit-devtools-radius-md);\n          font:12px/1 ${FONT_MONO_VAR};font-variant-numeric:tabular-nums;\n          overflow:hidden;opacity:var(--idle-op,0)\n        }\n        #container.with-count{--idle-op:.5}\n        #container.active{animation:pulse 2.5s ease-out forwards}\n        #icon{display:flex;align-items:center;justify-content:center;padding:0 10px}\n        #icon svg{width:16px;height:16px;display:block;fill:currentColor}\n        #indicator{\n          display:flex;align-items:center;gap:6px;\n          padding:7px 12px;\n          border-left:1px solid var(--lit-devtools-border-subtle)\n        }\n        .dot{width:8px;height:8px;border-radius:50%;background:var(--lit-devtools-success);flex-shrink:0}\n        /* Style-only swaps (shared adopted stylesheet hot-swap, no re-render)\n           pulse in the calmer info color and don't bump the count. */\n        #container.style-swap .dot{background:var(--lit-devtools-info)}\n        .count{display:none}\n        #container.with-count .count{display:inline}\n      </style>\n      <div id=\"container\"><span id=\"icon\">${FLAME_ICON}</span><span id=\"indicator\"><span class=\"dot\"></span><span class=\"count\">0</span></span></div>\n    `;\n    this.#container = root.getElementById('container')!;\n    this.#countEl = root.querySelector('.count');\n    this.#setCount(this.hasAttribute('count'));\n  }\n\n  /** Show/hide the cumulative update count (and the at-rest opacity). */\n  #setCount(enabled: boolean) {\n    this.#container.classList.toggle('with-count', enabled);\n  }\n\n  connectedCallback() {\n    if (this.#initialized) return;\n    this.#initialized = true;\n    injectTokens();\n    const hot = (\n      import.meta as {\n        hot?: {on: (event: string, cb: (data?: unknown) => void) => void};\n      }\n    ).hot;\n    hot?.on('vite:afterUpdate', (data) => {\n      // Count only updates that actually re-render/re-execute a component;\n      // a pure shared-stylesheet swap (?css-sheet / ?raw / ?url adopted sheet)\n      // restyles in place without re-rendering, so it pulses but doesn't count.\n      const styleSwap = isStyleSwap(data);\n      if (!styleSwap && this.#countEl !== null) {\n        this.#countEl.textContent = String(++this.#count);\n      }\n      this.#container.classList.toggle('style-swap', styleSwap);\n      this.#container.classList.remove('active');\n      void this.#container.offsetWidth;\n      this.#container.classList.add('active');\n    });\n    // Let the DevTools panel hide/show the indicator and its count live (and\n    // across reloads).\n    subscribeOverride(hot, (o) => {\n      if (o.hmrIndicatorVisible !== undefined) {\n        this.style.display = o.hmrIndicatorVisible ? '' : 'none';\n      }\n      if (o.hmrIndicatorCount !== undefined) {\n        this.#setCount(o.hmrIndicatorCount);\n      }\n    });\n    // Stay clear of the Vite DevTools edge panel.\n    observeEdgeInsets((insets) => {\n      this.style.setProperty('--edge-top', `${insets.top}px`);\n      this.style.setProperty('--edge-right', `${insets.right}px`);\n      this.style.setProperty('--edge-bottom', `${insets.bottom}px`);\n      this.style.setProperty('--edge-left', `${insets.left}px`);\n    });\n  }\n}\n\ncustomElements.define('lit-devtools-hmr-indicator', LitDevtoolsIndicator);\n"]}

package/lib/runtime/inspector/collect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"collect.d.ts","sourceRoot":"","sources":["../../../../../packages/labs/vite-plugin-lit/src/lib/runtime/inspector/collect.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAUH,OAAO,KAAK,EAEV,gBAAgB,EAEhB,iBAAiB,EAClB,MAAM,6BAA6B,CAAC;AAsCrC;;;;GAIG;AACH,eAAO,MAAM,aAAa,GAAI,IAAI,OAAO,KAAG,OAO3C,CAAC;AA2CF,wEAAwE;AACxE,eAAO,MAAM,SAAS,QAAO,iBAAiB,EAI7C,CAAC;AAWF,yEAAyE;AACzE,eAAO,MAAM,cAAc,GAAI,IAAI,OAAO,KAAG,gBA6C5C,CAAC"}
+{"version":3,"file":"collect.d.ts","sourceRoot":"","sources":["../../../src/lib/runtime/inspector/collect.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAUH,OAAO,KAAK,EAEV,gBAAgB,EAEhB,iBAAiB,EAClB,MAAM,6BAA6B,CAAC;AAsCrC;;;;GAIG;AACH,eAAO,MAAM,aAAa,OAAQ,OAAO,KAAG,OAO3C,CAAC;AA2CF,wEAAwE;AACxE,eAAO,MAAM,SAAS,QAAO,iBAAiB,EAI7C,CAAC;AAWF,yEAAyE;AACzE,eAAO,MAAM,cAAc,OAAQ,OAAO,KAAG,gBA6C5C,CAAC"}

package/lib/runtime/inspector/collect.js

@@ -8,15 +8,15 @@
  * element's reactive state for the inspector panel. Runs entirely in the page;
  * the results are sent over the transport as plain JSON.
  */
-import { idOf } from '../timeline/identity.js';
-import { serialize, typeTag } from './serialize.js';
+import {idOf} from '../timeline/identity.js';
+import {serialize, typeTag} from './serialize.js';
 const SOURCE_META_KEY = Symbol.for('@lit-labs/vite-plugin-lit#source');
 const metaOf = (el) => el.constructor[SOURCE_META_KEY];
 const sourceOf = (el) => {
-    const meta = metaOf(el);
-    return meta === undefined
-        ? undefined
-        : { file: meta.filePath, line: meta.lineNumber };
+  const meta = metaOf(el);
+  return meta === undefined
+    ? undefined
+    : {file: meta.filePath, line: meta.lineNumber};
 };
 /**
  * An element worth showing in the tree: an upgraded custom element that
@@ -24,25 +24,25 @@ const sourceOf = (el) => {
  * the source-meta transform touched them, while skipping devtools' own UI.
  */
 export const isInspectable = (el) => {
-    const tag = el.tagName.toLowerCase();
-    if (!tag.includes('-'))
-        return false;
-    if (tag === 'lit-source-overlay' || tag.startsWith('lit-devtools-')) {
-        return false;
-    }
-    return typeof el.requestUpdate === 'function';
+  const tag = el.tagName.toLowerCase();
+  if (!tag.includes('-')) return false;
+  if (tag === 'lit-source-overlay' || tag.startsWith('lit-devtools-')) {
+    return false;
+  }
+  return typeof el.requestUpdate === 'function';
 };
 const nodeFor = (el, children) => {
-    const meta = metaOf(el);
-    return {
-        id: idOf(el),
-        tagName: el.tagName.toLowerCase(),
-        componentName: meta?.componentName,
-        source: meta === undefined
-            ? undefined
-            : { file: meta.filePath, line: meta.lineNumber },
-        children,
-    };
+  const meta = metaOf(el);
+  return {
+    id: idOf(el),
+    tagName: el.tagName.toLowerCase(),
+    componentName: meta?.componentName,
+    source:
+      meta === undefined
+        ? undefined
+        : {file: meta.filePath, line: meta.lineNumber},
+    children,
+  };
 };
 /**
  * Visits `el`: if it's inspectable it becomes a node whose children are the
@@ -51,82 +51,75 @@ const nodeFor = (el, children) => {
  * are flattened away).
  */
 const visit = (el, sink) => {
-    if (isInspectable(el)) {
-        const children = [];
-        descend(el, children);
-        sink.push(nodeFor(el, children));
-    }
-    else {
-        descend(el, sink);
-    }
+  if (isInspectable(el)) {
+    const children = [];
+    descend(el, children);
+    sink.push(nodeFor(el, children));
+  } else {
+    descend(el, sink);
+  }
 };
 const descend = (el, sink) => {
-    const shadow = el.shadowRoot;
-    if (shadow !== null) {
-        for (const child of shadow.children)
-            visit(child, sink);
-    }
-    for (const child of el.children)
-        visit(child, sink);
+  const shadow = el.shadowRoot;
+  if (shadow !== null) {
+    for (const child of shadow.children) visit(child, sink);
+  }
+  for (const child of el.children) visit(child, sink);
 };
 /** Build the full component render tree rooted at the document body. */
 export const buildTree = () => {
-    const roots = [];
-    for (const child of document.body.children)
-        visit(child, roots);
-    return roots;
+  const roots = [];
+  for (const child of document.body.children) visit(child, roots);
+  return roots;
 };
 const attributeName = (key, decl) => {
-    if (decl.attribute === false)
-        return false;
-    if (typeof decl.attribute === 'string')
-        return decl.attribute;
-    return String(key).toLowerCase();
+  if (decl.attribute === false) return false;
+  if (typeof decl.attribute === 'string') return decl.attribute;
+  return String(key).toLowerCase();
 };
 /** Snapshot one element's reactive properties, attributes, and flags. */
 export const collectDetails = (el) => {
-    const re = el;
-    const declarations = re.constructor.elementProperties;
-    const properties = [];
-    if (declarations !== undefined) {
-        for (const [key, decl] of declarations) {
-            // Reading a reactive property runs its accessor, which may throw; one bad
-            // getter must not take out the whole details snapshot.
-            let value;
-            let threw = false;
-            try {
-                value = el[key];
-            }
-            catch {
-                threw = true;
-            }
-            properties.push({
-                name: typeof key === 'symbol' ? key.toString() : String(key),
-                value: threw ? '[getter threw]' : serialize(value),
-                type: threw ? 'error' : typeTag(value),
-                attribute: attributeName(key, decl),
-                reflects: decl.reflect === true,
-                state: decl.state === true,
-            });
-        }
+  const re = el;
+  const declarations = re.constructor.elementProperties;
+  const properties = [];
+  if (declarations !== undefined) {
+    for (const [key, decl] of declarations) {
+      // Reading a reactive property runs its accessor, which may throw; one bad
+      // getter must not take out the whole details snapshot.
+      let value;
+      let threw = false;
+      try {
+        value = el[key];
+      } catch {
+        threw = true;
+      }
+      properties.push({
+        name: typeof key === 'symbol' ? key.toString() : String(key),
+        value: threw ? '[getter threw]' : serialize(value),
+        type: threw ? 'error' : typeTag(value),
+        attribute: attributeName(key, decl),
+        reflects: decl.reflect === true,
+        state: decl.state === true,
+      });
     }
-    const attributes = Array.from(el.attributes, (a) => ({
-        name: a.name,
-        value: a.value,
-    }));
-    const meta = metaOf(el);
-    return {
-        id: idOf(el),
-        tagName: el.tagName.toLowerCase(),
-        componentName: meta?.componentName,
-        source: sourceOf(el),
-        attributes,
-        properties,
-        flags: {
-            hasUpdated: re.hasUpdated === true,
-            isUpdatePending: re.isUpdatePending === true,
-            hasShadowRoot: el.shadowRoot !== null,
-        },
-    };
+  }
+  const attributes = Array.from(el.attributes, (a) => ({
+    name: a.name,
+    value: a.value,
+  }));
+  const meta = metaOf(el);
+  return {
+    id: idOf(el),
+    tagName: el.tagName.toLowerCase(),
+    componentName: meta?.componentName,
+    source: sourceOf(el),
+    attributes,
+    properties,
+    flags: {
+      hasUpdated: re.hasUpdated === true,
+      isUpdatePending: re.isUpdatePending === true,
+      hasShadowRoot: el.shadowRoot !== null,
+    },
+  };
 };
-//# sourceMappingURL=collect.js.map
+//# sourceMappingURL=collect.js.map

package/lib/runtime/inspector/collect.js.map

@@ -1 +1 @@
-{"version":3,"file":"collect.js","sourceRoot":"","sources":["../../../../../packages/labs/vite-plugin-lit/src/lib/runtime/inspector/collect.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/**\n * Walks the page to build the component render tree and to snapshot a single\n * element's reactive state for the inspector panel. Runs entirely in the page;\n * the results are sent over the transport as plain JSON.\n */\n\nimport {idOf} from '../timeline/identity.js';\nimport {serialize, typeTag} from './serialize.js';\nimport type {\n  ElementSource,\n  InspectorDetails,\n  InspectorProp,\n  InspectorTreeNode,\n} from '../../../types/inspector.js';\n\nconst SOURCE_META_KEY = Symbol.for('@lit-labs/vite-plugin-lit#source');\n\ninterface LitSourceMeta {\n  filePath: string;\n  lineNumber: number;\n  componentName: string;\n}\n\n/** Subset of ReactiveElement's `PropertyDeclaration` we read. */\ninterface PropertyDeclaration {\n  attribute?: boolean | string;\n  reflect?: boolean;\n  state?: boolean;\n}\n\n/** Subset of a ReactiveElement instance/constructor we duck-type against. */\ninterface ReactiveElementLike extends Element {\n  requestUpdate?: unknown;\n  hasUpdated?: boolean;\n  isUpdatePending?: boolean;\n  constructor: {\n    elementProperties?: Map<PropertyKey, PropertyDeclaration>;\n    [SOURCE_META_KEY]?: LitSourceMeta;\n  };\n}\n\nconst metaOf = (el: Element): LitSourceMeta | undefined =>\n  (el as ReactiveElementLike).constructor[SOURCE_META_KEY];\n\nconst sourceOf = (el: Element): ElementSource | undefined => {\n  const meta = metaOf(el);\n  return meta === undefined\n    ? undefined\n    : {file: meta.filePath, line: meta.lineNumber};\n};\n\n/**\n * An element worth showing in the tree: an upgraded custom element that\n * duck-types as a ReactiveElement. Catches Lit components regardless of whether\n * the source-meta transform touched them, while skipping devtools' own UI.\n */\nexport const isInspectable = (el: Element): boolean => {\n  const tag = el.tagName.toLowerCase();\n  if (!tag.includes('-')) return false;\n  if (tag === 'lit-source-overlay' || tag.startsWith('lit-devtools-')) {\n    return false;\n  }\n  return typeof (el as ReactiveElementLike).requestUpdate === 'function';\n};\n\nconst nodeFor = (\n  el: Element,\n  children: InspectorTreeNode[]\n): InspectorTreeNode => {\n  const meta = metaOf(el);\n  return {\n    id: idOf(el),\n    tagName: el.tagName.toLowerCase(),\n    componentName: meta?.componentName,\n    source:\n      meta === undefined\n        ? undefined\n        : {file: meta.filePath, line: meta.lineNumber},\n    children,\n  };\n};\n\n/**\n * Visits `el`: if it's inspectable it becomes a node whose children are the\n * inspectables nested in its shadow + light DOM; otherwise we descend, pushing\n * any inspectables we find into the current `sink` (so non-component wrappers\n * are flattened away).\n */\nconst visit = (el: Element, sink: InspectorTreeNode[]): void => {\n  if (isInspectable(el)) {\n    const children: InspectorTreeNode[] = [];\n    descend(el, children);\n    sink.push(nodeFor(el, children));\n  } else {\n    descend(el, sink);\n  }\n};\n\nconst descend = (el: Element, sink: InspectorTreeNode[]): void => {\n  const shadow = el.shadowRoot;\n  if (shadow !== null) {\n    for (const child of shadow.children) visit(child, sink);\n  }\n  for (const child of el.children) visit(child, sink);\n};\n\n/** Build the full component render tree rooted at the document body. */\nexport const buildTree = (): InspectorTreeNode[] => {\n  const roots: InspectorTreeNode[] = [];\n  for (const child of document.body.children) visit(child, roots);\n  return roots;\n};\n\nconst attributeName = (\n  key: PropertyKey,\n  decl: PropertyDeclaration\n): string | false => {\n  if (decl.attribute === false) return false;\n  if (typeof decl.attribute === 'string') return decl.attribute;\n  return String(key).toLowerCase();\n};\n\n/** Snapshot one element's reactive properties, attributes, and flags. */\nexport const collectDetails = (el: Element): InspectorDetails => {\n  const re = el as ReactiveElementLike;\n  const declarations = re.constructor.elementProperties;\n  const properties: InspectorProp[] = [];\n  if (declarations !== undefined) {\n    for (const [key, decl] of declarations) {\n      // Reading a reactive property runs its accessor, which may throw; one bad\n      // getter must not take out the whole details snapshot.\n      let value: unknown;\n      let threw = false;\n      try {\n        value = (el as unknown as Record<PropertyKey, unknown>)[key];\n      } catch {\n        threw = true;\n      }\n      properties.push({\n        name: typeof key === 'symbol' ? key.toString() : String(key),\n        value: threw ? '[getter threw]' : serialize(value),\n        type: threw ? 'error' : typeTag(value),\n        attribute: attributeName(key, decl),\n        reflects: decl.reflect === true,\n        state: decl.state === true,\n      });\n    }\n  }\n\n  const attributes = Array.from(el.attributes, (a) => ({\n    name: a.name,\n    value: a.value,\n  }));\n\n  const meta = metaOf(el);\n  return {\n    id: idOf(el),\n    tagName: el.tagName.toLowerCase(),\n    componentName: meta?.componentName,\n    source: sourceOf(el),\n    attributes,\n    properties,\n    flags: {\n      hasUpdated: re.hasUpdated === true,\n      isUpdatePending: re.isUpdatePending === true,\n      hasShadowRoot: el.shadowRoot !== null,\n    },\n  };\n};\n"]}
+{"version":3,"file":"collect.js","sourceRoot":"","sources":["../../../src/lib/runtime/inspector/collect.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/**\n * Walks the page to build the component render tree and to snapshot a single\n * element's reactive state for the inspector panel. Runs entirely in the page;\n * the results are sent over the transport as plain JSON.\n */\n\nimport {idOf} from '../timeline/identity.js';\nimport {serialize, typeTag} from './serialize.js';\nimport type {\n  ElementSource,\n  InspectorDetails,\n  InspectorProp,\n  InspectorTreeNode,\n} from '../../../types/inspector.js';\n\nconst SOURCE_META_KEY = Symbol.for('@lit-labs/vite-plugin-lit#source');\n\ninterface LitSourceMeta {\n  filePath: string;\n  lineNumber: number;\n  componentName: string;\n}\n\n/** Subset of ReactiveElement's `PropertyDeclaration` we read. */\ninterface PropertyDeclaration {\n  attribute?: boolean | string;\n  reflect?: boolean;\n  state?: boolean;\n}\n\n/** Subset of a ReactiveElement instance/constructor we duck-type against. */\ninterface ReactiveElementLike extends Element {\n  requestUpdate?: unknown;\n  hasUpdated?: boolean;\n  isUpdatePending?: boolean;\n  constructor: {\n    elementProperties?: Map<PropertyKey, PropertyDeclaration>;\n    [SOURCE_META_KEY]?: LitSourceMeta;\n  };\n}\n\nconst metaOf = (el: Element): LitSourceMeta | undefined =>\n  (el as ReactiveElementLike).constructor[SOURCE_META_KEY];\n\nconst sourceOf = (el: Element): ElementSource | undefined => {\n  const meta = metaOf(el);\n  return meta === undefined\n    ? undefined\n    : {file: meta.filePath, line: meta.lineNumber};\n};\n\n/**\n * An element worth showing in the tree: an upgraded custom element that\n * duck-types as a ReactiveElement. Catches Lit components regardless of whether\n * the source-meta transform touched them, while skipping devtools' own UI.\n */\nexport const isInspectable = (el: Element): boolean => {\n  const tag = el.tagName.toLowerCase();\n  if (!tag.includes('-')) return false;\n  if (tag === 'lit-source-overlay' || tag.startsWith('lit-devtools-')) {\n    return false;\n  }\n  return typeof (el as ReactiveElementLike).requestUpdate === 'function';\n};\n\nconst nodeFor = (\n  el: Element,\n  children: InspectorTreeNode[]\n): InspectorTreeNode => {\n  const meta = metaOf(el);\n  return {\n    id: idOf(el),\n    tagName: el.tagName.toLowerCase(),\n    componentName: meta?.componentName,\n    source:\n      meta === undefined\n        ? undefined\n        : {file: meta.filePath, line: meta.lineNumber},\n    children,\n  };\n};\n\n/**\n * Visits `el`: if it's inspectable it becomes a node whose children are the\n * inspectables nested in its shadow + light DOM; otherwise we descend, pushing\n * any inspectables we find into the current `sink` (so non-component wrappers\n * are flattened away).\n */\nconst visit = (el: Element, sink: InspectorTreeNode[]): void => {\n  if (isInspectable(el)) {\n    const children: InspectorTreeNode[] = [];\n    descend(el, children);\n    sink.push(nodeFor(el, children));\n  } else {\n    descend(el, sink);\n  }\n};\n\nconst descend = (el: Element, sink: InspectorTreeNode[]): void => {\n  const shadow = el.shadowRoot;\n  if (shadow !== null) {\n    for (const child of shadow.children) visit(child, sink);\n  }\n  for (const child of el.children) visit(child, sink);\n};\n\n/** Build the full component render tree rooted at the document body. */\nexport const buildTree = (): InspectorTreeNode[] => {\n  const roots: InspectorTreeNode[] = [];\n  for (const child of document.body.children) visit(child, roots);\n  return roots;\n};\n\nconst attributeName = (\n  key: PropertyKey,\n  decl: PropertyDeclaration\n): string | false => {\n  if (decl.attribute === false) return false;\n  if (typeof decl.attribute === 'string') return decl.attribute;\n  return String(key).toLowerCase();\n};\n\n/** Snapshot one element's reactive properties, attributes, and flags. */\nexport const collectDetails = (el: Element): InspectorDetails => {\n  const re = el as ReactiveElementLike;\n  const declarations = re.constructor.elementProperties;\n  const properties: InspectorProp[] = [];\n  if (declarations !== undefined) {\n    for (const [key, decl] of declarations) {\n      // Reading a reactive property runs its accessor, which may throw; one bad\n      // getter must not take out the whole details snapshot.\n      let value: unknown;\n      let threw = false;\n      try {\n        value = (el as unknown as Record<PropertyKey, unknown>)[key];\n      } catch {\n        threw = true;\n      }\n      properties.push({\n        name: typeof key === 'symbol' ? key.toString() : String(key),\n        value: threw ? '[getter threw]' : serialize(value),\n        type: threw ? 'error' : typeTag(value),\n        attribute: attributeName(key, decl),\n        reflects: decl.reflect === true,\n        state: decl.state === true,\n      });\n    }\n  }\n\n  const attributes = Array.from(el.attributes, (a) => ({\n    name: a.name,\n    value: a.value,\n  }));\n\n  const meta = metaOf(el);\n  return {\n    id: idOf(el),\n    tagName: el.tagName.toLowerCase(),\n    componentName: meta?.componentName,\n    source: sourceOf(el),\n    attributes,\n    properties,\n    flags: {\n      hasUpdated: re.hasUpdated === true,\n      isUpdatePending: re.isUpdatePending === true,\n      hasShadowRoot: el.shadowRoot !== null,\n    },\n  };\n};\n"]}

package/lib/runtime/inspector/highlight.d.ts

@@ -0,0 +1,16 @@
+/**
+ * @license
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+/** Draw the outline over `el`. */
+export declare const showHighlight: (el: Element) => void;
+/** Hide the outline. Cheap and safe before the box has ever been built. */
+export declare const clearHighlight: () => void;
+/**
+ * Outline the element with this id, or clear it for `null` — and also when
+ * the id no longer resolves, since a stale outline over the wrong element is
+ * worse than none.
+ */
+export declare const highlightById: (id: number | null) => void;
+//# sourceMappingURL=highlight.d.ts.map

package/lib/runtime/inspector/highlight.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"highlight.d.ts","sourceRoot":"","sources":["../../../src/lib/runtime/inspector/highlight.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAqCH,kCAAkC;AAClC,eAAO,MAAM,aAAa,OAAQ,OAAO,KAAG,IAS3C,CAAC;AAEF,2EAA2E;AAC3E,eAAO,MAAM,cAAc,QAAO,IAEjC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,aAAa,OAAQ,MAAM,GAAG,IAAI,KAAG,IAQjD,CAAC"}