@oddsquad/vite-plugin-lit 0.2.2 → 0.3.0

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":"AAAA;;;;GAIG;AAEH;;;;GAIG;AAEH,OAAO,EAAC,IAAI,EAAC,MAAM,yBAAyB,CAAC;AAC7C,OAAO,EAAC,SAAS,EAAE,OAAO,EAAC,MAAM,gBAAgB,CAAC;AAQlD,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAC,kCAAkC,CAAC,CAAC;AA0BvE,MAAM,MAAM,GAAG,CAAC,EAAW,EAA6B,EAAE,CACvD,EAA0B,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC;AAE3D,MAAM,QAAQ,GAAG,CAAC,EAAW,EAA6B,EAAE;IAC1D,MAAM,IAAI,GAAG,MAAM,CAAC,EAAE,CAAC,CAAC;IACxB,OAAO,IAAI,KAAK,SAAS;QACvB,CAAC,CAAC,SAAS;QACX,CAAC,CAAC,EAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAE,IAAI,CAAC,UAAU,EAAC,CAAC;AACnD,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAAW,EAAW,EAAE;IACpD,MAAM,GAAG,GAAG,EAAE,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;IACrC,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,GAAG,CAAC;QAAE,OAAO,KAAK,CAAC;IACrC,IAAI,GAAG,KAAK,oBAAoB,IAAI,GAAG,CAAC,UAAU,CAAC,eAAe,CAAC,EAAE,CAAC;QACpE,OAAO,KAAK,CAAC;IACf,CAAC;IACD,OAAO,OAAQ,EAA0B,CAAC,aAAa,KAAK,UAAU,CAAC;AACzE,CAAC,CAAC;AAEF,MAAM,OAAO,GAAG,CACd,EAAW,EACX,QAA6B,EACV,EAAE;IACrB,MAAM,IAAI,GAAG,MAAM,CAAC,EAAE,CAAC,CAAC;IACxB,OAAO;QACL,EAAE,EAAE,IAAI,CAAC,EAAE,CAAC;QACZ,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,WAAW,EAAE;QACjC,aAAa,EAAE,IAAI,EAAE,aAAa;QAClC,MAAM,EACJ,IAAI,KAAK,SAAS;YAChB,CAAC,CAAC,SAAS;YACX,CAAC,CAAC,EAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAE,IAAI,CAAC,UAAU,EAAC;QAClD,QAAQ;KACT,CAAC;AACJ,CAAC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,KAAK,GAAG,CAAC,EAAW,EAAE,IAAyB,EAAQ,EAAE;IAC7D,IAAI,aAAa,CAAC,EAAE,CAAC,EAAE,CAAC;QACtB,MAAM,QAAQ,GAAwB,EAAE,CAAC;QACzC,OAAO,CAAC,EAAE,EAAE,QAAQ,CAAC,CAAC;QACtB,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,EAAE,QAAQ,CAAC,CAAC,CAAC;IACnC,CAAC;SAAM,CAAC;QACN,OAAO,CAAC,EAAE,EAAE,IAAI,CAAC,CAAC;IACpB,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,OAAO,GAAG,CAAC,EAAW,EAAE,IAAyB,EAAQ,EAAE;IAC/D,MAAM,MAAM,GAAG,EAAE,CAAC,UAAU,CAAC;IAC7B,IAAI,MAAM,KAAK,IAAI,EAAE,CAAC;QACpB,KAAK,MAAM,KAAK,IAAI,MAAM,CAAC,QAAQ;YAAE,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;IAC1D,CAAC;IACD,KAAK,MAAM,KAAK,IAAI,EAAE,CAAC,QAAQ;QAAE,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;AACtD,CAAC,CAAC;AAEF,wEAAwE;AACxE,MAAM,CAAC,MAAM,SAAS,GAAG,GAAwB,EAAE;IACjD,MAAM,KAAK,GAAwB,EAAE,CAAC;IACtC,KAAK,MAAM,KAAK,IAAI,QAAQ,CAAC,IAAI,CAAC,QAAQ;QAAE,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;IAChE,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AAEF,MAAM,aAAa,GAAG,CACpB,GAAgB,EAChB,IAAyB,EACT,EAAE;IAClB,IAAI,IAAI,CAAC,SAAS,KAAK,KAAK;QAAE,OAAO,KAAK,CAAC;IAC3C,IAAI,OAAO,IAAI,CAAC,SAAS,KAAK,QAAQ;QAAE,OAAO,IAAI,CAAC,SAAS,CAAC;IAC9D,OAAO,MAAM,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,CAAC;AACnC,CAAC,CAAC;AAEF,yEAAyE;AACzE,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAW,EAAoB,EAAE;IAC9D,MAAM,EAAE,GAAG,EAAyB,CAAC;IACrC,MAAM,YAAY,GAAG,EAAE,CAAC,WAAW,CAAC,iBAAiB,CAAC;IACtD,MAAM,UAAU,GAAoB,EAAE,CAAC;IACvC,IAAI,YAAY,KAAK,SAAS,EAAE,CAAC;QAC/B,KAAK,MAAM,CAAC,GAAG,EAAE,IAAI,CAAC,IAAI,YAAY,EAAE,CAAC;YACvC,0EAA0E;YAC1E,uDAAuD;YACvD,IAAI,KAAc,CAAC;YACnB,IAAI,KAAK,GAAG,KAAK,CAAC;YAClB,IAAI,CAAC;gBACH,KAAK,GAAI,EAA8C,CAAC,GAAG,CAAC,CAAC;YAC/D,CAAC;YAAC,MAAM,CAAC;gBACP,KAAK,GAAG,IAAI,CAAC;YACf,CAAC;YACD,UAAU,CAAC,IAAI,CAAC;gBACd,IAAI,EAAE,OAAO,GAAG,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC;gBAC5D,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC;gBAClD,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC;gBACtC,SAAS,EAAE,aAAa,CAAC,GAAG,EAAE,IAAI,CAAC;gBACnC,QAAQ,EAAE,IAAI,CAAC,OAAO,KAAK,IAAI;gBAC/B,KAAK,EAAE,IAAI,CAAC,KAAK,KAAK,IAAI;aAC3B,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,UAAU,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;QACnD,IAAI,EAAE,CAAC,CAAC,IAAI;QACZ,KAAK,EAAE,CAAC,CAAC,KAAK;KACf,CAAC,CAAC,CAAC;IAEJ,MAAM,IAAI,GAAG,MAAM,CAAC,EAAE,CAAC,CAAC;IACxB,OAAO;QACL,EAAE,EAAE,IAAI,CAAC,EAAE,CAAC;QACZ,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,WAAW,EAAE;QACjC,aAAa,EAAE,IAAI,EAAE,aAAa;QAClC,MAAM,EAAE,QAAQ,CAAC,EAAE,CAAC;QACpB,UAAU;QACV,UAAU;QACV,KAAK,EAAE;YACL,UAAU,EAAE,EAAE,CAAC,UAAU,KAAK,IAAI;YAClC,eAAe,EAAE,EAAE,CAAC,eAAe,KAAK,IAAI;YAC5C,aAAa,EAAE,EAAE,CAAC,UAAU,KAAK,IAAI;SACtC;KACF,CAAC;AACJ,CAAC,CAAC","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"}

package/lib/runtime/inspector/highlight.js

@@ -0,0 +1,66 @@
+/**
+ * @license
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+/**
+ * The hover outline the panel draws over an element in the page.
+ *
+ * Its own module because two transports drive it: the in-page channel (the
+ * fast path, no server in the loop) and the Vite HMR command channel (the
+ * fallback, for a panel with no page script to handshake with). Both end up
+ * here, so the box is created once and behaves identically either way.
+ *
+ * Deliberately independent of the source overlay, which draws its own,
+ * richer highlight — this one has to work whether or not `sourceOverlay` is
+ * enabled.
+ */
+import {elementById} from '../timeline/identity.js';
+let box = null;
+const ensureBox = () => {
+  if (box === null) {
+    box = document.createElement('div');
+    box.setAttribute('data-lit-devtools-highlight', '');
+    Object.assign(box.style, {
+      position: 'fixed',
+      zIndex: '2147483646',
+      pointerEvents: 'none',
+      background: 'rgba(77, 99, 255, 0.25)',
+      outline: '1px solid #4d63ff',
+      borderRadius: '2px',
+      transition: 'all 80ms ease-out',
+    });
+    document.body.append(box);
+  }
+  return box;
+};
+/** Draw the outline over `el`. */
+export const showHighlight = (el) => {
+  const r = el.getBoundingClientRect();
+  Object.assign(ensureBox().style, {
+    display: 'block',
+    left: `${r.left}px`,
+    top: `${r.top}px`,
+    width: `${r.width}px`,
+    height: `${r.height}px`,
+  });
+};
+/** Hide the outline. Cheap and safe before the box has ever been built. */
+export const clearHighlight = () => {
+  if (box !== null) box.style.display = 'none';
+};
+/**
+ * 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 const highlightById = (id) => {
+  if (id === null) {
+    clearHighlight();
+    return;
+  }
+  const el = elementById(id);
+  if (el !== undefined) showHighlight(el);
+  else clearHighlight();
+};
+//# sourceMappingURL=highlight.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"highlight.js","sourceRoot":"","sources":["../../../src/lib/runtime/inspector/highlight.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;;;;;;;;;;GAWG;AAEH,OAAO,EAAC,WAAW,EAAC,MAAM,yBAAyB,CAAC;AAEpD,IAAI,GAAG,GAAuB,IAAI,CAAC;AAEnC,MAAM,SAAS,GAAG,GAAgB,EAAE;IAClC,IAAI,GAAG,KAAK,IAAI,EAAE,CAAC;QACjB,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QACpC,GAAG,CAAC,YAAY,CAAC,6BAA6B,EAAE,EAAE,CAAC,CAAC;QACpD,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,EAAE;YACvB,QAAQ,EAAE,OAAO;YACjB,MAAM,EAAE,YAAY;YACpB,aAAa,EAAE,MAAM;YACrB,UAAU,EAAE,yBAAyB;YACrC,OAAO,EAAE,mBAAmB;YAC5B,YAAY,EAAE,KAAK;YACnB,UAAU,EAAE,mBAAmB;SACO,CAAC,CAAC;QAC1C,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;IAC5B,CAAC;IACD,OAAO,GAAG,CAAC;AACb,CAAC,CAAC;AAEF,kCAAkC;AAClC,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAAW,EAAQ,EAAE;IACjD,MAAM,CAAC,GAAG,EAAE,CAAC,qBAAqB,EAAE,CAAC;IACrC,MAAM,CAAC,MAAM,CAAC,SAAS,EAAE,CAAC,KAAK,EAAE;QAC/B,OAAO,EAAE,OAAO;QAChB,IAAI,EAAE,GAAG,CAAC,CAAC,IAAI,IAAI;QACnB,GAAG,EAAE,GAAG,CAAC,CAAC,GAAG,IAAI;QACjB,KAAK,EAAE,GAAG,CAAC,CAAC,KAAK,IAAI;QACrB,MAAM,EAAE,GAAG,CAAC,CAAC,MAAM,IAAI;KACxB,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,2EAA2E;AAC3E,MAAM,CAAC,MAAM,cAAc,GAAG,GAAS,EAAE;IACvC,IAAI,GAAG,KAAK,IAAI;QAAE,GAAG,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC;AAC/C,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAAiB,EAAQ,EAAE;IACvD,IAAI,EAAE,KAAK,IAAI,EAAE,CAAC;QAChB,cAAc,EAAE,CAAC;QACjB,OAAO;IACT,CAAC;IACD,MAAM,EAAE,GAAG,WAAW,CAAC,EAAE,CAAC,CAAC;IAC3B,IAAI,EAAE,KAAK,SAAS;QAAE,aAAa,CAAC,EAAE,CAAC,CAAC;;QACnC,cAAc,EAAE,CAAC;AACxB,CAAC,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/**\n * The hover outline the panel draws over an element in the page.\n *\n * Its own module because two transports drive it: the in-page channel (the\n * fast path, no server in the loop) and the Vite HMR command channel (the\n * fallback, for a panel with no page script to handshake with). Both end up\n * here, so the box is created once and behaves identically either way.\n *\n * Deliberately independent of the source overlay, which draws its own,\n * richer highlight — this one has to work whether or not `sourceOverlay` is\n * enabled.\n */\n\nimport {elementById} from '../timeline/identity.js';\n\nlet box: HTMLElement | null = null;\n\nconst ensureBox = (): HTMLElement => {\n  if (box === null) {\n    box = document.createElement('div');\n    box.setAttribute('data-lit-devtools-highlight', '');\n    Object.assign(box.style, {\n      position: 'fixed',\n      zIndex: '2147483646',\n      pointerEvents: 'none',\n      background: 'rgba(77, 99, 255, 0.25)',\n      outline: '1px solid #4d63ff',\n      borderRadius: '2px',\n      transition: 'all 80ms ease-out',\n    } satisfies Partial<CSSStyleDeclaration>);\n    document.body.append(box);\n  }\n  return box;\n};\n\n/** Draw the outline over `el`. */\nexport const showHighlight = (el: Element): void => {\n  const r = el.getBoundingClientRect();\n  Object.assign(ensureBox().style, {\n    display: 'block',\n    left: `${r.left}px`,\n    top: `${r.top}px`,\n    width: `${r.width}px`,\n    height: `${r.height}px`,\n  });\n};\n\n/** Hide the outline. Cheap and safe before the box has ever been built. */\nexport const clearHighlight = (): void => {\n  if (box !== null) box.style.display = 'none';\n};\n\n/**\n * Outline the element with this id, or clear it for `null` — and also when\n * the id no longer resolves, since a stale outline over the wrong element is\n * worse than none.\n */\nexport const highlightById = (id: number | null): void => {\n  if (id === null) {\n    clearHighlight();\n    return;\n  }\n  const el = elementById(id);\n  if (el !== undefined) showHighlight(el);\n  else clearHighlight();\n};\n"]}

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

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