@oddsquad/vite-plugin-lit 0.0.5 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/plugin.d.ts +57 -1
- package/lib/plugin.d.ts.map +1 -1
- package/lib/plugin.js +175 -80
- package/lib/plugin.js.map +1 -1
- package/lib/runtime/source-overlay/overlay-element.d.ts.map +1 -1
- package/lib/runtime/source-overlay/overlay-element.js +8 -4
- package/lib/runtime/source-overlay/overlay-element.js.map +1 -1
- package/lib/runtime/source-overlay/template.d.ts +1 -1
- package/lib/runtime/source-overlay/template.d.ts.map +1 -1
- package/lib/runtime/source-overlay/template.js +7 -1
- package/lib/runtime/source-overlay/template.js.map +1 -1
- package/lib/source-meta.d.ts.map +1 -1
- package/lib/source-meta.js +86 -21
- package/lib/source-meta.js.map +1 -1
- package/package.json +1 -1
- package/panel/components-view.d.ts.map +1 -1
- package/panel/components-view.js +7 -1
- package/panel/components-view.js.map +1 -1
package/lib/source-meta.js
CHANGED
|
@@ -14,17 +14,43 @@ export const SOURCE_META_SYM = `Symbol.for('${SOURCE_META_KEY}')`;
|
|
|
14
14
|
export const lineNumberAt = (code, index) => code.slice(0, index).split('\n').length;
|
|
15
15
|
/**
|
|
16
16
|
* Finds the index after the closing `}` of a class body starting at
|
|
17
|
-
* `classStart`. Skips braces inside strings,
|
|
18
|
-
* literals
|
|
17
|
+
* `classStart`. Skips braces inside strings, comments, regex literals, and
|
|
18
|
+
* template literals — including code in `${…}` interpolations, where nested
|
|
19
|
+
* templates (Lit's `html\`…\`` inside `.map()` etc.) recurse arbitrarily.
|
|
19
20
|
*/
|
|
20
21
|
const findClassBodyEnd = (code, classStart) => {
|
|
21
22
|
const open = code.indexOf('{', classStart);
|
|
22
23
|
if (open === -1)
|
|
23
24
|
return -1;
|
|
25
|
+
// Brace depth of the code scope currently being scanned. Entering a `${…}`
|
|
26
|
+
// interpolation pushes the enclosing scope's depth and restarts at 1 (the
|
|
27
|
+
// `${` counts as the open brace); balancing it pops back into the template.
|
|
24
28
|
let depth = 1;
|
|
29
|
+
const interpolationStack = [];
|
|
30
|
+
let inTemplate = false;
|
|
25
31
|
let i = open + 1;
|
|
26
|
-
while (i < code.length
|
|
32
|
+
while (i < code.length) {
|
|
27
33
|
const ch = code[i];
|
|
34
|
+
if (inTemplate) {
|
|
35
|
+
if (ch === '\\') {
|
|
36
|
+
i += 2;
|
|
37
|
+
continue;
|
|
38
|
+
}
|
|
39
|
+
if (ch === '`') {
|
|
40
|
+
inTemplate = false;
|
|
41
|
+
i++;
|
|
42
|
+
continue;
|
|
43
|
+
}
|
|
44
|
+
if (ch === '$' && code[i + 1] === '{') {
|
|
45
|
+
interpolationStack.push(depth);
|
|
46
|
+
depth = 1;
|
|
47
|
+
inTemplate = false;
|
|
48
|
+
i += 2;
|
|
49
|
+
continue;
|
|
50
|
+
}
|
|
51
|
+
i++;
|
|
52
|
+
continue;
|
|
53
|
+
}
|
|
28
54
|
if (ch === '"' || ch === "'") {
|
|
29
55
|
const quote = ch;
|
|
30
56
|
i++;
|
|
@@ -37,35 +63,74 @@ const findClassBodyEnd = (code, classStart) => {
|
|
|
37
63
|
continue;
|
|
38
64
|
}
|
|
39
65
|
if (ch === '`') {
|
|
40
|
-
|
|
41
|
-
while (i < code.length && code[i] !== '`') {
|
|
42
|
-
if (code[i] === '\\')
|
|
43
|
-
i++;
|
|
44
|
-
i++;
|
|
45
|
-
}
|
|
66
|
+
inTemplate = true;
|
|
46
67
|
i++;
|
|
47
68
|
continue;
|
|
48
69
|
}
|
|
49
70
|
if (ch === '/') {
|
|
50
|
-
const
|
|
51
|
-
if (/
|
|
52
|
-
i
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
i
|
|
71
|
+
const next = code[i + 1];
|
|
72
|
+
if (next === '/') {
|
|
73
|
+
i = code.indexOf('\n', i);
|
|
74
|
+
if (i === -1)
|
|
75
|
+
return -1;
|
|
76
|
+
continue;
|
|
77
|
+
}
|
|
78
|
+
if (next === '*') {
|
|
79
|
+
i = code.indexOf('*/', i + 2);
|
|
80
|
+
if (i === -1)
|
|
81
|
+
return -1;
|
|
82
|
+
i += 2;
|
|
59
83
|
continue;
|
|
60
84
|
}
|
|
85
|
+
// Regex literal vs division: scan back over whitespace to the last
|
|
86
|
+
// significant char — a regex can only follow an operator, opening
|
|
87
|
+
// punctuation, or a keyword like `return`. `a / b` has an identifier
|
|
88
|
+
// there, so it's division and scans on as plain code.
|
|
89
|
+
let j = i - 1;
|
|
90
|
+
while (j >= 0 && /\s/.test(code[j]))
|
|
91
|
+
j--;
|
|
92
|
+
const prev = j >= 0 ? code[j] : '';
|
|
93
|
+
const regexPossible = j < 0 ||
|
|
94
|
+
/[=:(,+\-!&|?{}[;]/.test(prev) ||
|
|
95
|
+
/(?:^|[^\w$])(?:return|typeof|case|instanceof|in|of|new|delete|void|throw|do|else|yield|await)$/.test(code.slice(Math.max(0, j - 11), j + 1));
|
|
96
|
+
if (regexPossible) {
|
|
97
|
+
let k = i + 1;
|
|
98
|
+
let inCharClass = false;
|
|
99
|
+
while (k < code.length &&
|
|
100
|
+
code[k] !== '\n' &&
|
|
101
|
+
(inCharClass || code[k] !== '/')) {
|
|
102
|
+
if (code[k] === '\\')
|
|
103
|
+
k++;
|
|
104
|
+
else if (code[k] === '[')
|
|
105
|
+
inCharClass = true;
|
|
106
|
+
else if (code[k] === ']')
|
|
107
|
+
inCharClass = false;
|
|
108
|
+
k++;
|
|
109
|
+
}
|
|
110
|
+
if (code[k] === '/') {
|
|
111
|
+
i = k + 1;
|
|
112
|
+
continue;
|
|
113
|
+
}
|
|
114
|
+
// No closing `/` before the line ends — not a regex after all.
|
|
115
|
+
}
|
|
61
116
|
}
|
|
62
|
-
if (ch === '{')
|
|
117
|
+
if (ch === '{') {
|
|
63
118
|
depth++;
|
|
64
|
-
|
|
119
|
+
}
|
|
120
|
+
else if (ch === '}') {
|
|
65
121
|
depth--;
|
|
122
|
+
if (depth === 0) {
|
|
123
|
+
const enclosing = interpolationStack.pop();
|
|
124
|
+
if (enclosing === undefined) {
|
|
125
|
+
return i + 1;
|
|
126
|
+
}
|
|
127
|
+
depth = enclosing;
|
|
128
|
+
inTemplate = true;
|
|
129
|
+
}
|
|
130
|
+
}
|
|
66
131
|
i++;
|
|
67
132
|
}
|
|
68
|
-
return
|
|
133
|
+
return -1;
|
|
69
134
|
};
|
|
70
135
|
const makeAssignment = (className, filePath, lineNumber) => `${className}[${SOURCE_META_SYM}]={filePath:${JSON.stringify(filePath)},lineNumber:${lineNumber},componentName:${JSON.stringify(className)}};`;
|
|
71
136
|
/** True when `className` is declared as a class/let/const in module code. */
|
package/lib/source-meta.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"source-meta.js","sourceRoot":"","sources":["../../../packages/labs/vite-plugin-lit/src/lib/source-meta.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\nimport type MagicString from 'magic-string';\n\n/** Stable key shared between transform output and runtime resolution. */\nexport const SOURCE_META_KEY = '@lit-labs/vite-plugin-lit#source';\n\n/**\n * The expression string used in generated code to reference the shared\n * symbol at runtime.\n */\nexport const SOURCE_META_SYM = `Symbol.for('${SOURCE_META_KEY}')`;\n\nexport interface InjectedSourceMeta {\n filePath: string;\n lineNumber: number;\n componentName?: string;\n}\n\n/** 1-based line number for an index in source text. */\nexport const lineNumberAt = (code: string, index: number): number =>\n code.slice(0, index).split('\\n').length;\n\n/**\n * Finds the index after the closing `}` of a class body starting at\n * `classStart`. Skips braces inside strings, template literals, and regex\n * literals so those don't throw off the count.\n */\nconst findClassBodyEnd = (code: string, classStart: number): number => {\n const open = code.indexOf('{', classStart);\n if (open === -1) return -1;\n let depth = 1;\n let i = open + 1;\n while (i < code.length && depth > 0) {\n const ch = code[i];\n if (ch === '\"' || ch === \"'\") {\n const quote = ch;\n i++;\n while (i < code.length && code[i] !== quote) {\n if (code[i] === '\\\\') i++;\n i++;\n }\n i++;\n continue;\n }\n if (ch === '`') {\n i++;\n while (i < code.length && code[i] !== '`') {\n if (code[i] === '\\\\') i++;\n i++;\n }\n i++;\n continue;\n }\n if (ch === '/') {\n const prev = i > 0 ? code[i - 1] : '';\n if (/[=:(,+\\-!&|?{}[; ]/.test(prev)) {\n i++;\n while (i < code.length && code[i] !== '/') {\n if (code[i] === '\\\\') i++;\n i++;\n }\n i++;\n continue;\n }\n }\n if (ch === '{') depth++;\n else if (ch === '}') depth--;\n i++;\n }\n return depth === 0 ? i : -1;\n};\n\nconst makeAssignment = (\n className: string,\n filePath: string,\n lineNumber: number\n) =>\n `${className}[${SOURCE_META_SYM}]={filePath:${JSON.stringify(filePath)},lineNumber:${lineNumber},componentName:${JSON.stringify(className)}};`;\n\n/** True when `className` is declared as a class/let/const in module code. */\nconst isClassDeclaredInModule = (code: string, className: string): boolean =>\n new RegExp(\n `^\\\\s*(?:export\\\\s+)?(?:class|let|const|var)\\\\s+${className}\\\\b`,\n 'm'\n ).test(code);\n\n/**\n * Injects component source metadata onto custom element class constructors.\n * Returns whether any injection was made.\n */\nexport const injectSourceMeta = (\n code: string,\n filePath: string,\n ms: MagicString\n): boolean => {\n if (code.includes(SOURCE_META_SYM)) {\n return false;\n }\n let changed = false;\n const injected = new Set<string>();\n\n const injectAtClassEnd = (\n className: string,\n matchIndex: number,\n match: string\n ) => {\n if (injected.has(className)) return;\n const classOffset = match.indexOf('class');\n if (classOffset === -1) return;\n const classStart = matchIndex + classOffset;\n const end = findClassBodyEnd(code, classStart);\n if (end === -1) return;\n // Report the match start (the `@customElement` decorator) rather than the\n // `class` keyword, so the overlay points at the top of the component.\n const line = lineNumberAt(code, matchIndex);\n ms.append('\\n' + makeAssignment(className, filePath, line));\n injected.add(className);\n changed = true;\n };\n\n // @customElement(...) class Foo (any whitespace between them)\n for (const m of code.matchAll(\n /@customElement\\s*\\([^)]*\\)\\s+(?:export\\s+)?class\\s+(\\w+)/g\n )) {\n injectAtClassEnd(m[1], m.index, m[0]);\n }\n\n // customElements.define('tag', ClassName)\n for (const m of code.matchAll(\n /customElements\\.define\\s*\\(\\s*['\"][^'\"]+['\"]\\s*,\\s*(\\w+)/g\n )) {\n const className = m[1];\n if (injected.has(className) || !isClassDeclaredInModule(code, className)) {\n continue;\n }\n const line = lineNumberAt(code, m.index);\n ms.append('\\n' + makeAssignment(className, filePath, line));\n injected.add(className);\n changed = true;\n }\n\n // TypeScript experimental-decorators / esbuild output\n // e.g. `Foo = __decorateClass([customElement(...)], Foo)`\n // `Foo = _decorate([customElement(...)], Foo)`\n for (const m of code.matchAll(\n /(\\w+)\\s*=\\s*__decorate\\w*\\(\\s*\\[[\\s\\S]*?customElement\\s*\\([^)]*\\)[\\s\\S]*?\\],\\s*\\1\\)/g\n )) {\n const className = m[1];\n if (injected.has(className)) continue;\n const line = lineNumberAt(code, m.index);\n ms.append('\\n' + makeAssignment(className, filePath, line));\n injected.add(className);\n changed = true;\n }\n\n return changed;\n};\n"]}
|
|
1
|
+
{"version":3,"file":"source-meta.js","sourceRoot":"","sources":["../../../packages/labs/vite-plugin-lit/src/lib/source-meta.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\nimport type MagicString from 'magic-string';\n\n/** Stable key shared between transform output and runtime resolution. */\nexport const SOURCE_META_KEY = '@lit-labs/vite-plugin-lit#source';\n\n/**\n * The expression string used in generated code to reference the shared\n * symbol at runtime.\n */\nexport const SOURCE_META_SYM = `Symbol.for('${SOURCE_META_KEY}')`;\n\nexport interface InjectedSourceMeta {\n filePath: string;\n lineNumber: number;\n componentName?: string;\n}\n\n/** 1-based line number for an index in source text. */\nexport const lineNumberAt = (code: string, index: number): number =>\n code.slice(0, index).split('\\n').length;\n\n/**\n * Finds the index after the closing `}` of a class body starting at\n * `classStart`. Skips braces inside strings, comments, regex literals, and\n * template literals — including code in `${…}` interpolations, where nested\n * templates (Lit's `html\\`…\\`` inside `.map()` etc.) recurse arbitrarily.\n */\nconst findClassBodyEnd = (code: string, classStart: number): number => {\n const open = code.indexOf('{', classStart);\n if (open === -1) return -1;\n // Brace depth of the code scope currently being scanned. Entering a `${…}`\n // interpolation pushes the enclosing scope's depth and restarts at 1 (the\n // `${` counts as the open brace); balancing it pops back into the template.\n let depth = 1;\n const interpolationStack: number[] = [];\n let inTemplate = false;\n let i = open + 1;\n while (i < code.length) {\n const ch = code[i];\n if (inTemplate) {\n if (ch === '\\\\') {\n i += 2;\n continue;\n }\n if (ch === '`') {\n inTemplate = false;\n i++;\n continue;\n }\n if (ch === '$' && code[i + 1] === '{') {\n interpolationStack.push(depth);\n depth = 1;\n inTemplate = false;\n i += 2;\n continue;\n }\n i++;\n continue;\n }\n if (ch === '\"' || ch === \"'\") {\n const quote = ch;\n i++;\n while (i < code.length && code[i] !== quote) {\n if (code[i] === '\\\\') i++;\n i++;\n }\n i++;\n continue;\n }\n if (ch === '`') {\n inTemplate = true;\n i++;\n continue;\n }\n if (ch === '/') {\n const next = code[i + 1];\n if (next === '/') {\n i = code.indexOf('\\n', i);\n if (i === -1) return -1;\n continue;\n }\n if (next === '*') {\n i = code.indexOf('*/', i + 2);\n if (i === -1) return -1;\n i += 2;\n continue;\n }\n // Regex literal vs division: scan back over whitespace to the last\n // significant char — a regex can only follow an operator, opening\n // punctuation, or a keyword like `return`. `a / b` has an identifier\n // there, so it's division and scans on as plain code.\n let j = i - 1;\n while (j >= 0 && /\\s/.test(code[j])) j--;\n const prev = j >= 0 ? code[j] : '';\n const regexPossible =\n j < 0 ||\n /[=:(,+\\-!&|?{}[;]/.test(prev) ||\n /(?:^|[^\\w$])(?:return|typeof|case|instanceof|in|of|new|delete|void|throw|do|else|yield|await)$/.test(\n code.slice(Math.max(0, j - 11), j + 1)\n );\n if (regexPossible) {\n let k = i + 1;\n let inCharClass = false;\n while (\n k < code.length &&\n code[k] !== '\\n' &&\n (inCharClass || code[k] !== '/')\n ) {\n if (code[k] === '\\\\') k++;\n else if (code[k] === '[') inCharClass = true;\n else if (code[k] === ']') inCharClass = false;\n k++;\n }\n if (code[k] === '/') {\n i = k + 1;\n continue;\n }\n // No closing `/` before the line ends — not a regex after all.\n }\n }\n if (ch === '{') {\n depth++;\n } else if (ch === '}') {\n depth--;\n if (depth === 0) {\n const enclosing = interpolationStack.pop();\n if (enclosing === undefined) {\n return i + 1;\n }\n depth = enclosing;\n inTemplate = true;\n }\n }\n i++;\n }\n return -1;\n};\n\nconst makeAssignment = (\n className: string,\n filePath: string,\n lineNumber: number\n) =>\n `${className}[${SOURCE_META_SYM}]={filePath:${JSON.stringify(filePath)},lineNumber:${lineNumber},componentName:${JSON.stringify(className)}};`;\n\n/** True when `className` is declared as a class/let/const in module code. */\nconst isClassDeclaredInModule = (code: string, className: string): boolean =>\n new RegExp(\n `^\\\\s*(?:export\\\\s+)?(?:class|let|const|var)\\\\s+${className}\\\\b`,\n 'm'\n ).test(code);\n\n/**\n * Injects component source metadata onto custom element class constructors.\n * Returns whether any injection was made.\n */\nexport const injectSourceMeta = (\n code: string,\n filePath: string,\n ms: MagicString\n): boolean => {\n if (code.includes(SOURCE_META_SYM)) {\n return false;\n }\n let changed = false;\n const injected = new Set<string>();\n\n const injectAtClassEnd = (\n className: string,\n matchIndex: number,\n match: string\n ) => {\n if (injected.has(className)) return;\n const classOffset = match.indexOf('class');\n if (classOffset === -1) return;\n const classStart = matchIndex + classOffset;\n const end = findClassBodyEnd(code, classStart);\n if (end === -1) return;\n // Report the match start (the `@customElement` decorator) rather than the\n // `class` keyword, so the overlay points at the top of the component.\n const line = lineNumberAt(code, matchIndex);\n ms.append('\\n' + makeAssignment(className, filePath, line));\n injected.add(className);\n changed = true;\n };\n\n // @customElement(...) class Foo (any whitespace between them)\n for (const m of code.matchAll(\n /@customElement\\s*\\([^)]*\\)\\s+(?:export\\s+)?class\\s+(\\w+)/g\n )) {\n injectAtClassEnd(m[1], m.index, m[0]);\n }\n\n // customElements.define('tag', ClassName)\n for (const m of code.matchAll(\n /customElements\\.define\\s*\\(\\s*['\"][^'\"]+['\"]\\s*,\\s*(\\w+)/g\n )) {\n const className = m[1];\n if (injected.has(className) || !isClassDeclaredInModule(code, className)) {\n continue;\n }\n const line = lineNumberAt(code, m.index);\n ms.append('\\n' + makeAssignment(className, filePath, line));\n injected.add(className);\n changed = true;\n }\n\n // TypeScript experimental-decorators / esbuild output\n // e.g. `Foo = __decorateClass([customElement(...)], Foo)`\n // `Foo = _decorate([customElement(...)], Foo)`\n for (const m of code.matchAll(\n /(\\w+)\\s*=\\s*__decorate\\w*\\(\\s*\\[[\\s\\S]*?customElement\\s*\\([^)]*\\)[\\s\\S]*?\\],\\s*\\1\\)/g\n )) {\n const className = m[1];\n if (injected.has(className)) continue;\n const line = lineNumberAt(code, m.index);\n ms.append('\\n' + makeAssignment(className, filePath, line));\n injected.add(className);\n changed = true;\n }\n\n return changed;\n};\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@oddsquad/vite-plugin-lit",
|
|
3
|
-
"version": "0.0
|
|
3
|
+
"version": "0.2.0",
|
|
4
4
|
"description": "Vite plugin providing true HMR for Lit components, plus CSS helpers and a DevTools panel",
|
|
5
5
|
"license": "BSD-3-Clause",
|
|
6
6
|
"author": "Oddsquad (based on @lit-labs/vite-hmr by Google LLC)",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components-view.d.ts","sourceRoot":"","sources":["../../../packages/labs/vite-plugin-lit/src/panel/components-view.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,UAAU,EAAsB,KAAK,cAAc,EAAC,MAAM,KAAK,CAAC;AAexE;;;;;;;;;;GAUG;AACH,qBACa,cAAe,SAAQ,UAAU;IAC5C,OAAgB,MAAM,4BAoLpB;IAEO,OAAO,CAAC,MAAM,CAA2B;IACzC,OAAO,CAAC,WAAW,CAAuB;IAC1C,OAAO,CAAC,QAAQ,CAAiC;IAC1D,gFAAgF;IACvE,OAAO,CAAC,KAAK,CAAS;IACtB,OAAO,CAAC,SAAS,CAAqB;IACtC,OAAO,CAAC,QAAQ,CAAS;IAClC,+EAA+E;IACtE,OAAO,CAAC,KAAK,CAAS;IAE/B,OAAO,CAAC,GAAG,CAA4B;IAE9B,iBAAiB;IAUjB,oBAAoB;IAU7B,6EAA6E;IAC7E,OAAO,CAAC,OAAO,CAMb;IAMF,OAAO,CAAC,KAAK;IAUb,OAAO,CAAC,UAAU,CA6ChB;IAMF;;;OAGG;IACH,UAAU,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI;IAI5B,OAAO,CAAC,OAAO;IAcf,qEAAqE;IACrE,OAAO,CAAC,gBAAgB;IAQxB,OAAO,CAAC,aAAa;IAWrB,OAAO,CAAC,QAAQ;IAOhB,OAAO,CAAC,WAAW;IAKnB,OAAO,CAAC,WAAW;IAYnB,OAAO,CAAC,UAAU;IAIlB,OAAO,CAAC,WAAW;
|
|
1
|
+
{"version":3,"file":"components-view.d.ts","sourceRoot":"","sources":["../../../packages/labs/vite-plugin-lit/src/panel/components-view.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,UAAU,EAAsB,KAAK,cAAc,EAAC,MAAM,KAAK,CAAC;AAexE;;;;;;;;;;GAUG;AACH,qBACa,cAAe,SAAQ,UAAU;IAC5C,OAAgB,MAAM,4BAoLpB;IAEO,OAAO,CAAC,MAAM,CAA2B;IACzC,OAAO,CAAC,WAAW,CAAuB;IAC1C,OAAO,CAAC,QAAQ,CAAiC;IAC1D,gFAAgF;IACvE,OAAO,CAAC,KAAK,CAAS;IACtB,OAAO,CAAC,SAAS,CAAqB;IACtC,OAAO,CAAC,QAAQ,CAAS;IAClC,+EAA+E;IACtE,OAAO,CAAC,KAAK,CAAS;IAE/B,OAAO,CAAC,GAAG,CAA4B;IAE9B,iBAAiB;IAUjB,oBAAoB;IAU7B,6EAA6E;IAC7E,OAAO,CAAC,OAAO,CAMb;IAMF,OAAO,CAAC,KAAK;IAUb,OAAO,CAAC,UAAU,CA6ChB;IAMF;;;OAGG;IACH,UAAU,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI;IAI5B,OAAO,CAAC,OAAO;IAcf,qEAAqE;IACrE,OAAO,CAAC,gBAAgB;IAQxB,OAAO,CAAC,aAAa;IAWrB,OAAO,CAAC,QAAQ;IAOhB,OAAO,CAAC,WAAW;IAKnB,OAAO,CAAC,WAAW;IAYnB,OAAO,CAAC,UAAU;IAIlB,OAAO,CAAC,WAAW;IAyBnB,OAAO,CAAC,WAAW;IA8BnB,OAAO,CAAC,gBAAgB;IAyBxB,OAAO,CAAC,cAAc;IA8Db,MAAM;CAgChB;AAuBD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,cAAc,CAAC;KACnC;CACF"}
|
package/panel/components-view.js
CHANGED
|
@@ -385,7 +385,13 @@ let ComponentsView = class ComponentsView extends LitElement {
|
|
|
385
385
|
file: src.file,
|
|
386
386
|
line: String(src.line),
|
|
387
387
|
});
|
|
388
|
-
fetch(`/__lit-open-in-editor?${params.toString()}`)
|
|
388
|
+
fetch(`/__lit-open-in-editor?${params.toString()}`)
|
|
389
|
+
.then(async (res) => {
|
|
390
|
+
if (!res.ok) {
|
|
391
|
+
console.warn(`[lit-devtools] open-in-editor failed (${res.status})`, await res.text());
|
|
392
|
+
}
|
|
393
|
+
})
|
|
394
|
+
.catch((err) => {
|
|
389
395
|
console.warn('[lit-devtools] open-in-editor failed', err);
|
|
390
396
|
});
|
|
391
397
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components-view.js","sourceRoot":"","sources":["../../../packages/labs/vite-plugin-lit/src/panel/components-view.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\nimport {LitElement, html, css, nothing, type TemplateResult} from 'lit';\nimport {customElement, state} from 'lit/decorators.js';\nimport {tokens} from '../lib/tokens.js';\nimport {\n INSPECT_PATH,\n INSPECT_SSE_EVENT,\n type InspectorCommand,\n type InspectorDetails,\n type InspectorMessage,\n type InspectorTreeNode,\n} from '../types/inspector.js';\n\n/** localStorage key remembering the opt-in live-tree toggle. */\nconst LIVE_LS_KEY = 'lit-devtools-components-live';\n\n/**\n * The Components view: a hierarchical tree of the page's Lit elements (left)\n * and a details pane for the selected one (right). A tab of the DevTools panel\n * shell (\\`lit-devtools-panel\\`).\n *\n * It can't touch the page DOM directly (separate iframe), so it drives the\n * page's inspector runtime over the transport: it POSTs {@link InspectorCommand}s\n * to {@link INSPECT_PATH} and receives {@link InspectorMessage}s on the shared\n * SSE stream's `inspect` event. An overlay inspect-pick arrives as a `pick`\n * message; the view selects that node and asks its host to switch to this tab.\n */\n@customElement('components-view')\nexport class ComponentsView extends LitElement {\n static override styles = [\n tokens,\n css`\n :host {\n display: flex;\n flex-direction: column;\n flex: 1;\n overflow: hidden;\n }\n :host([hidden]) {\n display: none;\n }\n .toolbar {\n display: flex;\n align-items: center;\n gap: var(--lit-devtools-space-4);\n padding: var(--lit-devtools-space-3) var(--lit-devtools-space-5);\n border-bottom: 1px solid var(--lit-devtools-border);\n background: var(--lit-devtools-surface-low);\n flex-shrink: 0;\n }\n .spacer {\n flex: 1;\n }\n button {\n padding: var(--lit-devtools-space-2) var(--lit-devtools-space-5);\n border-radius: var(--lit-devtools-radius-sm);\n border: 1px solid var(--lit-devtools-border);\n background: var(--lit-devtools-surface-elevated);\n color: var(--lit-devtools-text);\n font-size: var(--lit-devtools-text-2xs);\n cursor: pointer;\n }\n button:hover {\n background: var(--lit-devtools-surface-hover);\n border-color: var(--lit-devtools-border-strong);\n }\n button.pick.active,\n button.live.active {\n border-color: var(--lit-devtools-accent);\n background: var(--lit-devtools-accent-soft);\n color: var(--lit-devtools-accent);\n }\n button:disabled {\n opacity: 0.4;\n cursor: default;\n }\n .body {\n display: flex;\n flex: 1;\n overflow: hidden;\n }\n .tree {\n flex: 1;\n overflow: auto;\n padding: var(--lit-devtools-space-2) 0;\n min-width: 0;\n }\n .empty {\n padding: var(--lit-devtools-space-6);\n color: var(--lit-devtools-text-muted);\n font-size: var(--lit-devtools-text-xs);\n }\n .row {\n display: flex;\n align-items: center;\n gap: var(--lit-devtools-space-2);\n padding: 1px var(--lit-devtools-space-5);\n white-space: nowrap;\n cursor: pointer;\n font-family: var(--lit-devtools-font-mono);\n font-size: var(--lit-devtools-text-xs);\n line-height: 18px;\n }\n .row:hover {\n background: var(--lit-devtools-surface-hover);\n }\n .row.selected {\n background: var(--lit-devtools-surface-active);\n }\n .twisty {\n width: 12px;\n text-align: center;\n color: var(--lit-devtools-text-muted);\n flex-shrink: 0;\n }\n .twisty.leaf {\n visibility: hidden;\n }\n .tag {\n color: var(--lit-devtools-accent);\n }\n .tag .punct {\n color: var(--lit-devtools-text-muted);\n }\n .details {\n width: 340px;\n flex-shrink: 0;\n border-left: 1px solid var(--lit-devtools-border);\n overflow: auto;\n padding: var(--lit-devtools-space-5) var(--lit-devtools-space-5);\n font-size: var(--lit-devtools-text-xs);\n }\n .details h2 {\n font-size: var(--lit-devtools-text-xs);\n font-family: var(--lit-devtools-font-mono);\n color: var(--lit-devtools-accent);\n margin: 0 0 var(--lit-devtools-space-1);\n }\n .src {\n background: none;\n border: 0;\n padding: 0;\n color: var(--lit-devtools-text-link);\n font-size: var(--lit-devtools-text-2xs);\n cursor: pointer;\n text-decoration: underline;\n word-break: break-all;\n text-align: left;\n }\n section {\n margin-top: var(--lit-devtools-space-5);\n }\n section > .label {\n text-transform: uppercase;\n letter-spacing: var(--lit-devtools-tracking-caps);\n font-size: var(--lit-devtools-text-2xs);\n color: var(--lit-devtools-text-muted);\n margin-bottom: var(--lit-devtools-space-2);\n }\n table {\n width: 100%;\n border-collapse: collapse;\n font-family: var(--lit-devtools-font-mono);\n }\n td {\n padding: 2px var(--lit-devtools-space-4) 2px 0;\n vertical-align: top;\n word-break: break-word;\n }\n td.name {\n color: var(--lit-devtools-text);\n white-space: nowrap;\n }\n td.val {\n color: var(--lit-devtools-warning);\n width: 100%;\n }\n .badge {\n display: inline-block;\n margin-left: var(--lit-devtools-space-2);\n padding: 0 var(--lit-devtools-space-2);\n border-radius: var(--lit-devtools-radius-xs);\n font-size: 9px;\n background: var(--lit-devtools-surface-elevated);\n color: var(--lit-devtools-text-secondary);\n vertical-align: middle;\n }\n .flags {\n display: flex;\n gap: var(--lit-devtools-space-4);\n flex-wrap: wrap;\n }\n .flag {\n padding: 1px var(--lit-devtools-space-4);\n border-radius: var(--lit-devtools-radius-xs);\n background: var(--lit-devtools-surface-elevated);\n color: var(--lit-devtools-text-secondary);\n font-size: var(--lit-devtools-text-2xs);\n }\n .flag.on {\n background: var(--lit-devtools-accent-soft);\n color: var(--lit-devtools-accent);\n }\n .placeholder {\n color: var(--lit-devtools-text-muted);\n padding: var(--lit-devtools-space-8) 0;\n text-align: center;\n }\n `,\n ];\n\n @state() private _roots: InspectorTreeNode[] = [];\n @state() private _selectedId: number | null = null;\n @state() private _details: InspectorDetails | null = null;\n /** True when the selected element is no longer in the page (removed / GC'd). */\n @state() private _gone = false;\n @state() private _expanded = new Set<number>();\n @state() private _picking = false;\n /** Opt-in live tree (MutationObserver in the page); persisted, default off. */\n @state() private _live = false;\n\n private _es: EventSource | null = null;\n\n override connectedCallback() {\n super.connectedCallback();\n this._live = localStorage.getItem(LIVE_LS_KEY) === 'true';\n this._es = new EventSource('/__lit-devtools-events');\n this._es.addEventListener(INSPECT_SSE_EVENT, this._onMessage);\n // Request only once the stream is open — a command sent before we're\n // subscribed would have its reply broadcast before we could receive it.\n this._es.addEventListener('open', this._onOpen);\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n this._es?.removeEventListener(INSPECT_SSE_EVENT, this._onMessage);\n this._es?.removeEventListener('open', this._onOpen);\n this._es?.close();\n this._es = null;\n this._post({type: 'watch', id: null});\n if (this._live) this._post({type: 'observe', enabled: false});\n }\n\n /** Refresh the tree (and re-arm watch / live mode) once the SSE connects. */\n private _onOpen = (): void => {\n this._post({type: 'tree'});\n if (this._selectedId !== null) {\n this._post({type: 'watch', id: this._selectedId});\n }\n if (this._live) this._post({type: 'observe', enabled: true});\n };\n\n // ---------------------------------------------------------------------------\n // Transport\n // ---------------------------------------------------------------------------\n\n private _post(cmd: InspectorCommand): void {\n fetch(INSPECT_PATH, {\n method: 'POST',\n headers: {'Content-Type': 'application/json'},\n body: JSON.stringify(cmd),\n }).catch((err) => {\n console.warn('[lit-devtools] inspector POST failed', err);\n });\n }\n\n private _onMessage = (e: Event): void => {\n let msg: InspectorMessage;\n try {\n msg = JSON.parse((e as MessageEvent<string>).data) as InspectorMessage;\n } catch {\n return;\n }\n switch (msg.type) {\n case 'ready':\n // Runtime (re)connected — refresh the tree and re-arm any selection.\n this._post({type: 'tree'});\n if (this._selectedId !== null) {\n this._post({type: 'watch', id: this._selectedId});\n }\n break;\n case 'tree':\n this._roots = msg.roots;\n // Re-reveal the selection against the fresh tree: a just-picked node may\n // not have existed in the previous _roots, so the reveal in _select()\n // found no ancestors to expand and the node stayed hidden.\n if (this._selectedId !== null) {\n this._revealAncestors(this._selectedId);\n }\n break;\n case 'details':\n if (msg.details.id === this._selectedId) {\n this._details = msg.details;\n this._gone = false;\n }\n break;\n case 'gone':\n if (msg.id === this._selectedId) {\n this._details = null;\n this._gone = true;\n }\n break;\n case 'pick':\n this._picking = false;\n this._select(msg.id);\n // Bring this tab to the front so the pick is visible.\n this.dispatchEvent(\n new CustomEvent('inspector-activate', {bubbles: true, composed: true})\n );\n break;\n }\n };\n\n // ---------------------------------------------------------------------------\n // Selection / expansion\n // ---------------------------------------------------------------------------\n\n /**\n * Select an element by id from outside (e.g. a timeline event's \"inspect\"\n * link). Same as a tree click; the host is responsible for switching tabs.\n */\n selectById(id: number): void {\n this._select(id);\n }\n\n private _select(id: number): void {\n if (this._selectedId === id) return;\n if (this._selectedId !== null) {\n this._post({type: 'watch', id: null});\n }\n this._selectedId = id;\n this._details = null;\n this._gone = false;\n this._revealAncestors(id);\n this._post({type: 'tree'}); // refresh in case the picked node is new\n this._post({type: 'details', id});\n this._post({type: 'watch', id});\n }\n\n /** Expand every ancestor of `id` so the selected node is visible. */\n private _revealAncestors(id: number): void {\n const path = findAncestors(this._roots, id);\n if (path === null) return;\n const next = new Set(this._expanded);\n for (const ancestorId of path) next.add(ancestorId);\n this._expanded = next;\n }\n\n private _toggleExpand(id: number): void {\n const next = new Set(this._expanded);\n if (next.has(id)) next.delete(id);\n else next.add(id);\n this._expanded = next;\n }\n\n // ---------------------------------------------------------------------------\n // Actions\n // ---------------------------------------------------------------------------\n\n private _refresh(): void {\n this._post({type: 'tree'});\n if (this._selectedId !== null) {\n this._post({type: 'details', id: this._selectedId});\n }\n }\n\n private _togglePick(): void {\n this._picking = !this._picking;\n this._post({type: 'pick'});\n }\n\n private _toggleLive(): void {\n this._live = !this._live;\n try {\n localStorage.setItem(LIVE_LS_KEY, String(this._live));\n } catch {\n // ignore (private/storage unavailable)\n }\n this._post({type: 'observe', enabled: this._live});\n // Leaving live mode, pull one fresh tree so it doesn't go stale silently.\n if (!this._live) this._post({type: 'tree'});\n }\n\n private _highlight(id: number | null): void {\n this._post({type: 'highlight', id});\n }\n\n private _openSource(): void {\n const src = this._details?.source;\n if (src === undefined) return;\n const params = new URLSearchParams({\n file: src.file,\n line: String(src.line),\n });\n fetch(`/__lit-open-in-editor?${params.toString()}`).catch((err) => {\n console.warn('[lit-devtools] open-in-editor failed', err);\n });\n }\n\n // ---------------------------------------------------------------------------\n // Render\n // ---------------------------------------------------------------------------\n\n private _renderNode(node: InspectorTreeNode, depth: number): TemplateResult {\n const hasChildren = node.children.length > 0;\n const expanded = this._expanded.has(node.id);\n return html`\n <div\n class=\"row ${node.id === this._selectedId ? 'selected' : ''}\"\n style=\"padding-left:${8 + depth * 14}px\"\n @click=${() => this._select(node.id)}\n @mouseenter=${() => this._highlight(node.id)}\n >\n <span\n class=\"twisty ${hasChildren ? '' : 'leaf'}\"\n @click=${(e: Event) => {\n e.stopPropagation();\n this._toggleExpand(node.id);\n }}\n >${hasChildren ? (expanded ? '▾' : '▸') : '•'}</span\n >\n <span class=\"tag\"\n ><span class=\"punct\"><</span>${node.tagName}<span class=\"punct\"\n >></span\n ></span\n >\n </div>\n ${hasChildren && expanded\n ? node.children.map((c) => this._renderNode(c, depth + 1))\n : nothing}\n `;\n }\n\n private _renderPropTable(\n props: InspectorDetails['properties']\n ): TemplateResult {\n return html`\n <table>\n ${props.map(\n (p) => html`\n <tr>\n <td class=\"name\">\n ${p.name}${p.reflects\n ? html`<span class=\"badge\" title=\"reflects to attribute\"\n >${typeof p.attribute === 'string'\n ? p.attribute\n : 'attr'}</span\n >`\n : nothing}\n </td>\n <td class=\"val\">${p.value}</td>\n </tr>\n `\n )}\n </table>\n `;\n }\n\n private _renderDetails(): TemplateResult {\n const d = this._details;\n if (d === null) {\n let message: string;\n if (this._gone) {\n message = 'This element is no longer in the page.';\n } else if (this._selectedId === null) {\n message = 'Select a component to inspect.';\n } else {\n message = 'Loading…';\n }\n return html`<div class=\"placeholder\">${message}</div>`;\n }\n const props = d.properties.filter((p) => !p.state);\n const stateProps = d.properties.filter((p) => p.state);\n return html`\n <h2><${d.tagName}></h2>\n ${d.source !== undefined\n ? html`<button class=\"src\" @click=${this._openSource}>\n ${d.source.file}:${d.source.line}\n </button>`\n : nothing}\n <section>\n <div class=\"flags\">\n <span class=\"flag ${d.flags.hasUpdated ? 'on' : ''}\">updated</span>\n <span class=\"flag ${d.flags.isUpdatePending ? 'on' : ''}\"\n >update pending</span\n >\n <span class=\"flag ${d.flags.hasShadowRoot ? 'on' : ''}\"\n >shadow root</span\n >\n </div>\n </section>\n ${props.length > 0\n ? html`<section>\n <div class=\"label\">Properties</div>\n ${this._renderPropTable(props)}\n </section>`\n : nothing}\n ${stateProps.length > 0\n ? html`<section>\n <div class=\"label\">State</div>\n ${this._renderPropTable(stateProps)}\n </section>`\n : nothing}\n ${d.attributes.length > 0\n ? html`<section>\n <div class=\"label\">Attributes</div>\n <table>\n ${d.attributes.map(\n (a) =>\n html`<tr>\n <td class=\"name\">${a.name}</td>\n <td class=\"val\">${a.value}</td>\n </tr>`\n )}\n </table>\n </section>`\n : nothing}\n `;\n }\n\n override render() {\n return html`\n <div class=\"toolbar\">\n <button\n class=\"pick ${this._picking ? 'active' : ''}\"\n title=\"Pick an element on the page (Meta+Shift+E)\"\n @click=${this._togglePick}\n >\n ⌖ Pick\n </button>\n <span class=\"spacer\"></span>\n <button\n class=\"live ${this._live ? 'active' : ''}\"\n title=\"Update the tree automatically as the page changes\"\n @click=${this._toggleLive}\n >\n ${this._live ? '● Live' : '○ Live'}\n </button>\n <button @click=${this._refresh} ?disabled=${this._live}>Refresh</button>\n </div>\n <div class=\"body\">\n <div class=\"tree\" @mouseleave=${() => this._highlight(null)}>\n ${this._roots.length === 0\n ? html`<div class=\"empty\">\n No Lit components found on the page.\n </div>`\n : this._roots.map((n) => this._renderNode(n, 0))}\n </div>\n <div class=\"details\">${this._renderDetails()}</div>\n </div>\n `;\n }\n}\n\n/**\n * Returns the ids of every ancestor of `id` (nearest last), or `null` if `id`\n * isn't in the tree. The target id itself is not included.\n */\nconst findAncestors = (\n nodes: InspectorTreeNode[],\n id: number\n): number[] | null => {\n const trail: number[] = [];\n const walk = (list: InspectorTreeNode[]): boolean => {\n for (const node of list) {\n if (node.id === id) return true;\n trail.push(node.id);\n if (walk(node.children)) return true;\n trail.pop();\n }\n return false;\n };\n return walk(nodes) ? [...trail] : null;\n};\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'components-view': ComponentsView;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"components-view.js","sourceRoot":"","sources":["../../../packages/labs/vite-plugin-lit/src/panel/components-view.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2026 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\nimport {LitElement, html, css, nothing, type TemplateResult} from 'lit';\nimport {customElement, state} from 'lit/decorators.js';\nimport {tokens} from '../lib/tokens.js';\nimport {\n INSPECT_PATH,\n INSPECT_SSE_EVENT,\n type InspectorCommand,\n type InspectorDetails,\n type InspectorMessage,\n type InspectorTreeNode,\n} from '../types/inspector.js';\n\n/** localStorage key remembering the opt-in live-tree toggle. */\nconst LIVE_LS_KEY = 'lit-devtools-components-live';\n\n/**\n * The Components view: a hierarchical tree of the page's Lit elements (left)\n * and a details pane for the selected one (right). A tab of the DevTools panel\n * shell (\\`lit-devtools-panel\\`).\n *\n * It can't touch the page DOM directly (separate iframe), so it drives the\n * page's inspector runtime over the transport: it POSTs {@link InspectorCommand}s\n * to {@link INSPECT_PATH} and receives {@link InspectorMessage}s on the shared\n * SSE stream's `inspect` event. An overlay inspect-pick arrives as a `pick`\n * message; the view selects that node and asks its host to switch to this tab.\n */\n@customElement('components-view')\nexport class ComponentsView extends LitElement {\n static override styles = [\n tokens,\n css`\n :host {\n display: flex;\n flex-direction: column;\n flex: 1;\n overflow: hidden;\n }\n :host([hidden]) {\n display: none;\n }\n .toolbar {\n display: flex;\n align-items: center;\n gap: var(--lit-devtools-space-4);\n padding: var(--lit-devtools-space-3) var(--lit-devtools-space-5);\n border-bottom: 1px solid var(--lit-devtools-border);\n background: var(--lit-devtools-surface-low);\n flex-shrink: 0;\n }\n .spacer {\n flex: 1;\n }\n button {\n padding: var(--lit-devtools-space-2) var(--lit-devtools-space-5);\n border-radius: var(--lit-devtools-radius-sm);\n border: 1px solid var(--lit-devtools-border);\n background: var(--lit-devtools-surface-elevated);\n color: var(--lit-devtools-text);\n font-size: var(--lit-devtools-text-2xs);\n cursor: pointer;\n }\n button:hover {\n background: var(--lit-devtools-surface-hover);\n border-color: var(--lit-devtools-border-strong);\n }\n button.pick.active,\n button.live.active {\n border-color: var(--lit-devtools-accent);\n background: var(--lit-devtools-accent-soft);\n color: var(--lit-devtools-accent);\n }\n button:disabled {\n opacity: 0.4;\n cursor: default;\n }\n .body {\n display: flex;\n flex: 1;\n overflow: hidden;\n }\n .tree {\n flex: 1;\n overflow: auto;\n padding: var(--lit-devtools-space-2) 0;\n min-width: 0;\n }\n .empty {\n padding: var(--lit-devtools-space-6);\n color: var(--lit-devtools-text-muted);\n font-size: var(--lit-devtools-text-xs);\n }\n .row {\n display: flex;\n align-items: center;\n gap: var(--lit-devtools-space-2);\n padding: 1px var(--lit-devtools-space-5);\n white-space: nowrap;\n cursor: pointer;\n font-family: var(--lit-devtools-font-mono);\n font-size: var(--lit-devtools-text-xs);\n line-height: 18px;\n }\n .row:hover {\n background: var(--lit-devtools-surface-hover);\n }\n .row.selected {\n background: var(--lit-devtools-surface-active);\n }\n .twisty {\n width: 12px;\n text-align: center;\n color: var(--lit-devtools-text-muted);\n flex-shrink: 0;\n }\n .twisty.leaf {\n visibility: hidden;\n }\n .tag {\n color: var(--lit-devtools-accent);\n }\n .tag .punct {\n color: var(--lit-devtools-text-muted);\n }\n .details {\n width: 340px;\n flex-shrink: 0;\n border-left: 1px solid var(--lit-devtools-border);\n overflow: auto;\n padding: var(--lit-devtools-space-5) var(--lit-devtools-space-5);\n font-size: var(--lit-devtools-text-xs);\n }\n .details h2 {\n font-size: var(--lit-devtools-text-xs);\n font-family: var(--lit-devtools-font-mono);\n color: var(--lit-devtools-accent);\n margin: 0 0 var(--lit-devtools-space-1);\n }\n .src {\n background: none;\n border: 0;\n padding: 0;\n color: var(--lit-devtools-text-link);\n font-size: var(--lit-devtools-text-2xs);\n cursor: pointer;\n text-decoration: underline;\n word-break: break-all;\n text-align: left;\n }\n section {\n margin-top: var(--lit-devtools-space-5);\n }\n section > .label {\n text-transform: uppercase;\n letter-spacing: var(--lit-devtools-tracking-caps);\n font-size: var(--lit-devtools-text-2xs);\n color: var(--lit-devtools-text-muted);\n margin-bottom: var(--lit-devtools-space-2);\n }\n table {\n width: 100%;\n border-collapse: collapse;\n font-family: var(--lit-devtools-font-mono);\n }\n td {\n padding: 2px var(--lit-devtools-space-4) 2px 0;\n vertical-align: top;\n word-break: break-word;\n }\n td.name {\n color: var(--lit-devtools-text);\n white-space: nowrap;\n }\n td.val {\n color: var(--lit-devtools-warning);\n width: 100%;\n }\n .badge {\n display: inline-block;\n margin-left: var(--lit-devtools-space-2);\n padding: 0 var(--lit-devtools-space-2);\n border-radius: var(--lit-devtools-radius-xs);\n font-size: 9px;\n background: var(--lit-devtools-surface-elevated);\n color: var(--lit-devtools-text-secondary);\n vertical-align: middle;\n }\n .flags {\n display: flex;\n gap: var(--lit-devtools-space-4);\n flex-wrap: wrap;\n }\n .flag {\n padding: 1px var(--lit-devtools-space-4);\n border-radius: var(--lit-devtools-radius-xs);\n background: var(--lit-devtools-surface-elevated);\n color: var(--lit-devtools-text-secondary);\n font-size: var(--lit-devtools-text-2xs);\n }\n .flag.on {\n background: var(--lit-devtools-accent-soft);\n color: var(--lit-devtools-accent);\n }\n .placeholder {\n color: var(--lit-devtools-text-muted);\n padding: var(--lit-devtools-space-8) 0;\n text-align: center;\n }\n `,\n ];\n\n @state() private _roots: InspectorTreeNode[] = [];\n @state() private _selectedId: number | null = null;\n @state() private _details: InspectorDetails | null = null;\n /** True when the selected element is no longer in the page (removed / GC'd). */\n @state() private _gone = false;\n @state() private _expanded = new Set<number>();\n @state() private _picking = false;\n /** Opt-in live tree (MutationObserver in the page); persisted, default off. */\n @state() private _live = false;\n\n private _es: EventSource | null = null;\n\n override connectedCallback() {\n super.connectedCallback();\n this._live = localStorage.getItem(LIVE_LS_KEY) === 'true';\n this._es = new EventSource('/__lit-devtools-events');\n this._es.addEventListener(INSPECT_SSE_EVENT, this._onMessage);\n // Request only once the stream is open — a command sent before we're\n // subscribed would have its reply broadcast before we could receive it.\n this._es.addEventListener('open', this._onOpen);\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n this._es?.removeEventListener(INSPECT_SSE_EVENT, this._onMessage);\n this._es?.removeEventListener('open', this._onOpen);\n this._es?.close();\n this._es = null;\n this._post({type: 'watch', id: null});\n if (this._live) this._post({type: 'observe', enabled: false});\n }\n\n /** Refresh the tree (and re-arm watch / live mode) once the SSE connects. */\n private _onOpen = (): void => {\n this._post({type: 'tree'});\n if (this._selectedId !== null) {\n this._post({type: 'watch', id: this._selectedId});\n }\n if (this._live) this._post({type: 'observe', enabled: true});\n };\n\n // ---------------------------------------------------------------------------\n // Transport\n // ---------------------------------------------------------------------------\n\n private _post(cmd: InspectorCommand): void {\n fetch(INSPECT_PATH, {\n method: 'POST',\n headers: {'Content-Type': 'application/json'},\n body: JSON.stringify(cmd),\n }).catch((err) => {\n console.warn('[lit-devtools] inspector POST failed', err);\n });\n }\n\n private _onMessage = (e: Event): void => {\n let msg: InspectorMessage;\n try {\n msg = JSON.parse((e as MessageEvent<string>).data) as InspectorMessage;\n } catch {\n return;\n }\n switch (msg.type) {\n case 'ready':\n // Runtime (re)connected — refresh the tree and re-arm any selection.\n this._post({type: 'tree'});\n if (this._selectedId !== null) {\n this._post({type: 'watch', id: this._selectedId});\n }\n break;\n case 'tree':\n this._roots = msg.roots;\n // Re-reveal the selection against the fresh tree: a just-picked node may\n // not have existed in the previous _roots, so the reveal in _select()\n // found no ancestors to expand and the node stayed hidden.\n if (this._selectedId !== null) {\n this._revealAncestors(this._selectedId);\n }\n break;\n case 'details':\n if (msg.details.id === this._selectedId) {\n this._details = msg.details;\n this._gone = false;\n }\n break;\n case 'gone':\n if (msg.id === this._selectedId) {\n this._details = null;\n this._gone = true;\n }\n break;\n case 'pick':\n this._picking = false;\n this._select(msg.id);\n // Bring this tab to the front so the pick is visible.\n this.dispatchEvent(\n new CustomEvent('inspector-activate', {bubbles: true, composed: true})\n );\n break;\n }\n };\n\n // ---------------------------------------------------------------------------\n // Selection / expansion\n // ---------------------------------------------------------------------------\n\n /**\n * Select an element by id from outside (e.g. a timeline event's \"inspect\"\n * link). Same as a tree click; the host is responsible for switching tabs.\n */\n selectById(id: number): void {\n this._select(id);\n }\n\n private _select(id: number): void {\n if (this._selectedId === id) return;\n if (this._selectedId !== null) {\n this._post({type: 'watch', id: null});\n }\n this._selectedId = id;\n this._details = null;\n this._gone = false;\n this._revealAncestors(id);\n this._post({type: 'tree'}); // refresh in case the picked node is new\n this._post({type: 'details', id});\n this._post({type: 'watch', id});\n }\n\n /** Expand every ancestor of `id` so the selected node is visible. */\n private _revealAncestors(id: number): void {\n const path = findAncestors(this._roots, id);\n if (path === null) return;\n const next = new Set(this._expanded);\n for (const ancestorId of path) next.add(ancestorId);\n this._expanded = next;\n }\n\n private _toggleExpand(id: number): void {\n const next = new Set(this._expanded);\n if (next.has(id)) next.delete(id);\n else next.add(id);\n this._expanded = next;\n }\n\n // ---------------------------------------------------------------------------\n // Actions\n // ---------------------------------------------------------------------------\n\n private _refresh(): void {\n this._post({type: 'tree'});\n if (this._selectedId !== null) {\n this._post({type: 'details', id: this._selectedId});\n }\n }\n\n private _togglePick(): void {\n this._picking = !this._picking;\n this._post({type: 'pick'});\n }\n\n private _toggleLive(): void {\n this._live = !this._live;\n try {\n localStorage.setItem(LIVE_LS_KEY, String(this._live));\n } catch {\n // ignore (private/storage unavailable)\n }\n this._post({type: 'observe', enabled: this._live});\n // Leaving live mode, pull one fresh tree so it doesn't go stale silently.\n if (!this._live) this._post({type: 'tree'});\n }\n\n private _highlight(id: number | null): void {\n this._post({type: 'highlight', id});\n }\n\n private _openSource(): void {\n const src = this._details?.source;\n if (src === undefined) return;\n const params = new URLSearchParams({\n file: src.file,\n line: String(src.line),\n });\n fetch(`/__lit-open-in-editor?${params.toString()}`)\n .then(async (res) => {\n if (!res.ok) {\n console.warn(\n `[lit-devtools] open-in-editor failed (${res.status})`,\n await res.text()\n );\n }\n })\n .catch((err) => {\n console.warn('[lit-devtools] open-in-editor failed', err);\n });\n }\n\n // ---------------------------------------------------------------------------\n // Render\n // ---------------------------------------------------------------------------\n\n private _renderNode(node: InspectorTreeNode, depth: number): TemplateResult {\n const hasChildren = node.children.length > 0;\n const expanded = this._expanded.has(node.id);\n return html`\n <div\n class=\"row ${node.id === this._selectedId ? 'selected' : ''}\"\n style=\"padding-left:${8 + depth * 14}px\"\n @click=${() => this._select(node.id)}\n @mouseenter=${() => this._highlight(node.id)}\n >\n <span\n class=\"twisty ${hasChildren ? '' : 'leaf'}\"\n @click=${(e: Event) => {\n e.stopPropagation();\n this._toggleExpand(node.id);\n }}\n >${hasChildren ? (expanded ? '▾' : '▸') : '•'}</span\n >\n <span class=\"tag\"\n ><span class=\"punct\"><</span>${node.tagName}<span class=\"punct\"\n >></span\n ></span\n >\n </div>\n ${hasChildren && expanded\n ? node.children.map((c) => this._renderNode(c, depth + 1))\n : nothing}\n `;\n }\n\n private _renderPropTable(\n props: InspectorDetails['properties']\n ): TemplateResult {\n return html`\n <table>\n ${props.map(\n (p) => html`\n <tr>\n <td class=\"name\">\n ${p.name}${p.reflects\n ? html`<span class=\"badge\" title=\"reflects to attribute\"\n >${typeof p.attribute === 'string'\n ? p.attribute\n : 'attr'}</span\n >`\n : nothing}\n </td>\n <td class=\"val\">${p.value}</td>\n </tr>\n `\n )}\n </table>\n `;\n }\n\n private _renderDetails(): TemplateResult {\n const d = this._details;\n if (d === null) {\n let message: string;\n if (this._gone) {\n message = 'This element is no longer in the page.';\n } else if (this._selectedId === null) {\n message = 'Select a component to inspect.';\n } else {\n message = 'Loading…';\n }\n return html`<div class=\"placeholder\">${message}</div>`;\n }\n const props = d.properties.filter((p) => !p.state);\n const stateProps = d.properties.filter((p) => p.state);\n return html`\n <h2><${d.tagName}></h2>\n ${d.source !== undefined\n ? html`<button class=\"src\" @click=${this._openSource}>\n ${d.source.file}:${d.source.line}\n </button>`\n : nothing}\n <section>\n <div class=\"flags\">\n <span class=\"flag ${d.flags.hasUpdated ? 'on' : ''}\">updated</span>\n <span class=\"flag ${d.flags.isUpdatePending ? 'on' : ''}\"\n >update pending</span\n >\n <span class=\"flag ${d.flags.hasShadowRoot ? 'on' : ''}\"\n >shadow root</span\n >\n </div>\n </section>\n ${props.length > 0\n ? html`<section>\n <div class=\"label\">Properties</div>\n ${this._renderPropTable(props)}\n </section>`\n : nothing}\n ${stateProps.length > 0\n ? html`<section>\n <div class=\"label\">State</div>\n ${this._renderPropTable(stateProps)}\n </section>`\n : nothing}\n ${d.attributes.length > 0\n ? html`<section>\n <div class=\"label\">Attributes</div>\n <table>\n ${d.attributes.map(\n (a) =>\n html`<tr>\n <td class=\"name\">${a.name}</td>\n <td class=\"val\">${a.value}</td>\n </tr>`\n )}\n </table>\n </section>`\n : nothing}\n `;\n }\n\n override render() {\n return html`\n <div class=\"toolbar\">\n <button\n class=\"pick ${this._picking ? 'active' : ''}\"\n title=\"Pick an element on the page (Meta+Shift+E)\"\n @click=${this._togglePick}\n >\n ⌖ Pick\n </button>\n <span class=\"spacer\"></span>\n <button\n class=\"live ${this._live ? 'active' : ''}\"\n title=\"Update the tree automatically as the page changes\"\n @click=${this._toggleLive}\n >\n ${this._live ? '● Live' : '○ Live'}\n </button>\n <button @click=${this._refresh} ?disabled=${this._live}>Refresh</button>\n </div>\n <div class=\"body\">\n <div class=\"tree\" @mouseleave=${() => this._highlight(null)}>\n ${this._roots.length === 0\n ? html`<div class=\"empty\">\n No Lit components found on the page.\n </div>`\n : this._roots.map((n) => this._renderNode(n, 0))}\n </div>\n <div class=\"details\">${this._renderDetails()}</div>\n </div>\n `;\n }\n}\n\n/**\n * Returns the ids of every ancestor of `id` (nearest last), or `null` if `id`\n * isn't in the tree. The target id itself is not included.\n */\nconst findAncestors = (\n nodes: InspectorTreeNode[],\n id: number\n): number[] | null => {\n const trail: number[] = [];\n const walk = (list: InspectorTreeNode[]): boolean => {\n for (const node of list) {\n if (node.id === id) return true;\n trail.push(node.id);\n if (walk(node.children)) return true;\n trail.pop();\n }\n return false;\n };\n return walk(nodes) ? [...trail] : null;\n};\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'components-view': ComponentsView;\n }\n}\n"]}
|