@oddsquad/vite-plugin-lit 0.3.0 → 0.4.0

package/CHANGELOG.md

@@ -3,6 +3,54 @@
 Notable changes per release. Versions before 0.3.0 predate this file; see the
 git history for those.
 
+## 0.4.0 — 2026-09-29
+
+A maintenance release. The timeline panel stays fast with a full buffer, the
+live inspector stops walking the whole page, and several failures that used to
+pass silently now say so. Releases are published from CI now.
+
+### Added
+
+- **Verbose render layer.** lit-html's per-part debug events (template
+  instantiation, `set part`, each binding commit) go to a new "Lit Render
+  (verbose)" layer. It is off by default, because it fires once per binding on
+  every render. Values are summarized as strings (`string:"…"`, `node:<li>`,
+  `template`, `function:onClick`) and never passed through.
+- **Releases from a version tag.** Pushing a `v*` tag runs the CI gate, checks
+  the tag against `package.json` and `CHANGELOG.md`, publishes to npm over
+  trusted publishing (OIDC), and creates the GitHub Release from the changelog
+  section. Prereleases go to the `next` dist-tag.
+
+### Changed
+
+- **The timeline list renders only the visible rows**, through
+  `@lit-labs/virtualizer`. A 2500-event recording keeps about 75 rows in the
+  DOM instead of one per event. Filtering reruns only when the events or
+  filters change.
+- **Live inspector mode no longer re-walks the page on every mutation.**
+  Batches with no custom element or shadow root in them are dropped, and
+  relevant batches walk only the subtrees they added.
+- **The docs site was rewritten** in plain language, with a tutorial, task-sized
+  DevTools guides, a troubleshooting page, screenshots in both themes, and the
+  Lit Design System's colours and type.
+
+### Fixed
+
+- The source overlay's default hotkey is Ctrl+Shift+S, as documented. The
+  runtime used to fall back to `e`, which also collided with the DevTools pick
+  command.
+- The source overlay removes its HMR listeners when it disconnects. Moving the
+  element used to register the toggle twice, so the Vite DevTools overlay
+  command did nothing, and a removed overlay kept reacting.
+- `urlSheet()` and `?css-sheet` warn when a stylesheet fails to load, and treat
+  non-ok responses as failures. A 404 used to hand Vite's fallback page to the
+  sheet as CSS, with a clean console. The sheet keeps its last good CSS.
+- An unknown `LIT_PLUGIN_HMR_ON_INCOMPATIBLE` value logs a warning and falls
+  back to the default, instead of quietly acting as `reload`.
+- The Lightning CSS pass over `css` literals finds them by parsing the module,
+  so `css`-tagged text inside a string, a comment, or another template literal
+  is no longer rewritten.
+
 ## 0.3.0 — 2026-09-17
 
 The DevTools half of the plugin was rebuilt on

package/README.md

@@ -26,7 +26,7 @@ This plugin fixes that with two cooperating mechanisms:
    re-executed module patches the originally-registered class in place, then
    restores reactive property values through the new accessors.
 
-[How it works →](https://oddcelot.github.io/vite-plugin-lit/getting-started/how-it-works/)
+[How it works →](https://oddcelot.github.io/vite-plugin-lit/concepts/how-hmr-works/)
 
 ## Usage
 
@@ -51,7 +51,7 @@ CSS literal processing apply in both dev and build.
 - **[Stylesheets at scale](https://oddcelot.github.io/vite-plugin-lit/guides/stylesheets/)**
   — one shared `CSSStyleSheet` for thousands of shadow roots, hot-swapped
   without re-rendering, from a bare `?css-sheet` import.
-- **[DevTools timeline](https://oddcelot.github.io/vite-plugin-lit/guides/devtools-timeline/)**
+- **[DevTools timeline](https://oddcelot.github.io/vite-plugin-lit/guides/devtools/)**
   — a layered event recorder and live component inspector inside Vite DevTools.
 - **[Source overlay](https://oddcelot.github.io/vite-plugin-lit/guides/source-overlay/)**
   — click any element in the page to open its source in your editor.
@@ -65,15 +65,18 @@ Reference:
 [environment variables](https://oddcelot.github.io/vite-plugin-lit/reference/environment-variables/) ·
 [import queries](https://oddcelot.github.io/vite-plugin-lit/reference/import-queries/) ·
 [runtime API](https://oddcelot.github.io/vite-plugin-lit/reference/runtime-api/) ·
+[CLI](https://oddcelot.github.io/vite-plugin-lit/reference/cli/) ·
 [limitations](https://oddcelot.github.io/vite-plugin-lit/reference/limitations/) ·
-[benchmarks](https://oddcelot.github.io/vite-plugin-lit/reference/benchmarks/)
+[compatibility](https://oddcelot.github.io/vite-plugin-lit/reference/compatibility/) ·
+[benchmarks](https://oddcelot.github.io/vite-plugin-lit/reference/benchmarks/) ·
+[troubleshooting](https://oddcelot.github.io/vite-plugin-lit/guides/troubleshooting/)
 
 ## Coding agents (MCP)
 
 The DevTools panel's data is also exposed as MCP tools — `lit_list-components`,
-`lit_component-details`, `lit_recent-events`, `lit_get-meta`,
-`lit_hmr-incompatibilities`, `lit_set-recording` — so an agent can read the
-live component tree and timeline instead of guessing from source.
+`lit_component-details`, `lit_update-summary`, `lit_recent-events`,
+`lit_get-meta`, `lit_hmr-incompatibilities`, `lit_set-recording` — so an agent
+can read the live component tree and timeline instead of guessing from source.
 
 These answer only while a Vite dev server with DevTools is **running**. There
 is no stored data and nothing to go stale: with the server down an agent gets
@@ -135,6 +138,7 @@ pnpm dev   # builds the plugin, then serves http://localhost:5179
 ## Development
 
 Requires Node 26 and pnpm 12 (`corepack enable` picks up the pinned version).
+The published package itself runs on Node 20 or newer.
 
 ```sh
 pnpm install         # workspace: root package + playground + docs

package/dist/client/assets/{browser-agent-rpc-BXhoSh1z-BvWe4sTJ.js → browser-agent-rpc-BXhoSh1z-CdtPhBL-.js}

@@ -1,4 +1,4 @@
-import { n as onBrowserAgentToolsChanged, r as nanoid, t as listBrowserAgentTools } from "./index-CFrVgNfS.js";
+import { n as onBrowserAgentToolsChanged, r as nanoid, t as listBrowserAgentTools } from "./index-DVe6M4HV.js";
 //#region node_modules/.pnpm/devframe@1.0.0_@devframes+agentic@1.0.0_cac@7.0.0_srvx@1.0.5/node_modules/devframe/dist/browser-agent-rpc-BXhoSh1z.mjs
 var CLIENT_ID_STORAGE_KEY = "devframe:client-id";
 var memoryClientId;
@@ -66,4 +66,4 @@ function setupBrowserAgentRpcBridge(rpc) {
 //#endregion
 export { setupBrowserAgentRpcBridge };
 
-//# sourceMappingURL=browser-agent-rpc-BXhoSh1z-BvWe4sTJ.js.map
+//# sourceMappingURL=browser-agent-rpc-BXhoSh1z-CdtPhBL-.js.map

package/dist/client/assets/{browser-agent-rpc-BXhoSh1z-BvWe4sTJ.js.map → browser-agent-rpc-BXhoSh1z-CdtPhBL-.js.map}

@@ -1 +1 @@
-{"version":3,"file":"browser-agent-rpc-BXhoSh1z-BvWe4sTJ.js","names":[],"sources":["../../../node_modules/.pnpm/devframe@1.0.0_@devframes+agentic@1.0.0_cac@7.0.0_srvx@1.0.5/node_modules/devframe/dist/browser-agent-rpc-BXhoSh1z.mjs"],"sourcesContent":["import { nanoid } from \"./utils/nanoid.mjs\";\nimport { n as onBrowserAgentToolsChanged, t as listBrowserAgentTools } from \"./browser-agent-Pu-FLk6I.mjs\";\n//#region src/client/client-id.ts\nconst CLIENT_ID_STORAGE_KEY = \"devframe:client-id\";\nlet memoryClientId;\n/**\n* This browser tab's stable client id: one nanoid per tab, persisted in\n* `sessionStorage` so it survives page reloads and RPC reconnects. The node\n* side uses it to tell connected tabs apart across reconnects (see #394).\n*\n* Tab duplication copies `sessionStorage`, so two tabs can briefly share an id\n* until per-tab disambiguation lands with the wider tab-metadata work.\n*/\nfunction resolveClientId(win = globalThis.window) {\n\ttry {\n\t\tconst storage = win?.sessionStorage;\n\t\tif (storage) {\n\t\t\tlet id = storage.getItem(CLIENT_ID_STORAGE_KEY);\n\t\t\tif (!id) {\n\t\t\t\tid = nanoid();\n\t\t\t\tstorage.setItem(CLIENT_ID_STORAGE_KEY, id);\n\t\t\t}\n\t\t\treturn id;\n\t\t}\n\t} catch {}\n\tmemoryClientId ??= nanoid();\n\treturn memoryClientId;\n}\n//#endregion\n//#region src/client/browser-agent-rpc.ts\n/** Mirror this document's browser-agent registry over its existing RPC connection. */\nfunction setupBrowserAgentRpcBridge(rpc) {\n\trpc.client.register({\n\t\tname: \"devframe:agent:invoke-client-tool\",\n\t\ttype: \"action\",\n\t\tjsonSerializable: true,\n\t\thandler: async (id, args) => {\n\t\t\tconst tool = listBrowserAgentTools().find((tool) => tool.id === id);\n\t\t\tif (!tool) throw new Error(`[devframe/agent] browser tool \"${id}\" not found`);\n\t\t\treturn await tool.invoke(args);\n\t\t}\n\t});\n\tlet queued = false;\n\tlet disposed = false;\n\tlet lastSyncedCount = 0;\n\tconst sync = () => {\n\t\tif (queued || disposed) return;\n\t\tqueued = true;\n\t\tqueueMicrotask(async () => {\n\t\t\tqueued = false;\n\t\t\tif (disposed) return;\n\t\t\tconst manifests = listBrowserAgentTools().map(({ invoke: _, ...manifest }) => manifest);\n\t\t\tif (manifests.length === 0 && lastSyncedCount === 0) return;\n\t\t\tlastSyncedCount = manifests.length;\n\t\t\tawait rpc.callOptional(\"devframe:agent:sync-client-tools\", resolveClientId(), manifests).catch(() => {});\n\t\t});\n\t};\n\tconst stopTools = onBrowserAgentToolsChanged(sync);\n\tconst stopConnection = rpc.events.on(\"connection:status\", (status) => {\n\t\tif (status === \"connected\") sync();\n\t});\n\tsync();\n\treturn () => {\n\t\tdisposed = true;\n\t\tstopTools();\n\t\tstopConnection();\n\t};\n}\n//#endregion\nexport { setupBrowserAgentRpcBridge };\n"],"x_google_ignoreList":[0],"mappings":";;AAGA,IAAM,wBAAwB;AAC9B,IAAI;;;;;;;;;AASJ,SAAS,gBAAgB,MAAM,WAAW,QAAQ;CACjD,IAAI;EACH,MAAM,UAAU,KAAK;EACrB,IAAI,SAAS;GACZ,IAAI,KAAK,QAAQ,QAAQ,qBAAqB;GAC9C,IAAI,CAAC,IAAI;IACR,KAAK,OAAO;IACZ,QAAQ,QAAQ,uBAAuB,EAAE;GAC1C;GACA,OAAO;EACR;CACD,QAAQ,CAAC;CACT,mBAAmB,OAAO;CAC1B,OAAO;AACR;;AAIA,SAAS,2BAA2B,KAAK;CACxC,IAAI,OAAO,SAAS;EACnB,MAAM;EACN,MAAM;EACN,kBAAkB;EAClB,SAAS,OAAO,IAAI,SAAS;GAC5B,MAAM,OAAO,sBAAsB,CAAC,CAAC,MAAM,SAAS,KAAK,OAAO,EAAE;GAClE,IAAI,CAAC,MAAM,MAAM,IAAI,MAAM,kCAAkC,GAAG,YAAY;GAC5E,OAAO,MAAM,KAAK,OAAO,IAAI;EAC9B;CACD,CAAC;CACD,IAAI,SAAS;CACb,IAAI,WAAW;CACf,IAAI,kBAAkB;CACtB,MAAM,aAAa;EAClB,IAAI,UAAU,UAAU;EACxB,SAAS;EACT,eAAe,YAAY;GAC1B,SAAS;GACT,IAAI,UAAU;GACd,MAAM,YAAY,sBAAsB,CAAC,CAAC,KAAK,EAAE,QAAQ,GAAG,GAAG,eAAe,QAAQ;GACtF,IAAI,UAAU,WAAW,KAAK,oBAAoB,GAAG;GACrD,kBAAkB,UAAU;GAC5B,MAAM,IAAI,aAAa,oCAAoC,gBAAgB,GAAG,SAAS,CAAC,CAAC,YAAY,CAAC,CAAC;EACxG,CAAC;CACF;CACA,MAAM,YAAY,2BAA2B,IAAI;CACjD,MAAM,iBAAiB,IAAI,OAAO,GAAG,sBAAsB,WAAW;EACrE,IAAI,WAAW,aAAa,KAAK;CAClC,CAAC;CACD,KAAK;CACL,aAAa;EACZ,WAAW;EACX,UAAU;EACV,eAAe;CAChB;AACD"}
+{"version":3,"file":"browser-agent-rpc-BXhoSh1z-CdtPhBL-.js","names":[],"sources":["../../../node_modules/.pnpm/devframe@1.0.0_@devframes+agentic@1.0.0_cac@7.0.0_srvx@1.0.5/node_modules/devframe/dist/browser-agent-rpc-BXhoSh1z.mjs"],"sourcesContent":["import { nanoid } from \"./utils/nanoid.mjs\";\nimport { n as onBrowserAgentToolsChanged, t as listBrowserAgentTools } from \"./browser-agent-Pu-FLk6I.mjs\";\n//#region src/client/client-id.ts\nconst CLIENT_ID_STORAGE_KEY = \"devframe:client-id\";\nlet memoryClientId;\n/**\n* This browser tab's stable client id: one nanoid per tab, persisted in\n* `sessionStorage` so it survives page reloads and RPC reconnects. The node\n* side uses it to tell connected tabs apart across reconnects (see #394).\n*\n* Tab duplication copies `sessionStorage`, so two tabs can briefly share an id\n* until per-tab disambiguation lands with the wider tab-metadata work.\n*/\nfunction resolveClientId(win = globalThis.window) {\n\ttry {\n\t\tconst storage = win?.sessionStorage;\n\t\tif (storage) {\n\t\t\tlet id = storage.getItem(CLIENT_ID_STORAGE_KEY);\n\t\t\tif (!id) {\n\t\t\t\tid = nanoid();\n\t\t\t\tstorage.setItem(CLIENT_ID_STORAGE_KEY, id);\n\t\t\t}\n\t\t\treturn id;\n\t\t}\n\t} catch {}\n\tmemoryClientId ??= nanoid();\n\treturn memoryClientId;\n}\n//#endregion\n//#region src/client/browser-agent-rpc.ts\n/** Mirror this document's browser-agent registry over its existing RPC connection. */\nfunction setupBrowserAgentRpcBridge(rpc) {\n\trpc.client.register({\n\t\tname: \"devframe:agent:invoke-client-tool\",\n\t\ttype: \"action\",\n\t\tjsonSerializable: true,\n\t\thandler: async (id, args) => {\n\t\t\tconst tool = listBrowserAgentTools().find((tool) => tool.id === id);\n\t\t\tif (!tool) throw new Error(`[devframe/agent] browser tool \"${id}\" not found`);\n\t\t\treturn await tool.invoke(args);\n\t\t}\n\t});\n\tlet queued = false;\n\tlet disposed = false;\n\tlet lastSyncedCount = 0;\n\tconst sync = () => {\n\t\tif (queued || disposed) return;\n\t\tqueued = true;\n\t\tqueueMicrotask(async () => {\n\t\t\tqueued = false;\n\t\t\tif (disposed) return;\n\t\t\tconst manifests = listBrowserAgentTools().map(({ invoke: _, ...manifest }) => manifest);\n\t\t\tif (manifests.length === 0 && lastSyncedCount === 0) return;\n\t\t\tlastSyncedCount = manifests.length;\n\t\t\tawait rpc.callOptional(\"devframe:agent:sync-client-tools\", resolveClientId(), manifests).catch(() => {});\n\t\t});\n\t};\n\tconst stopTools = onBrowserAgentToolsChanged(sync);\n\tconst stopConnection = rpc.events.on(\"connection:status\", (status) => {\n\t\tif (status === \"connected\") sync();\n\t});\n\tsync();\n\treturn () => {\n\t\tdisposed = true;\n\t\tstopTools();\n\t\tstopConnection();\n\t};\n}\n//#endregion\nexport { setupBrowserAgentRpcBridge };\n"],"x_google_ignoreList":[0],"mappings":";;AAGA,IAAM,wBAAwB;AAC9B,IAAI;;;;;;;;;AASJ,SAAS,gBAAgB,MAAM,WAAW,QAAQ;CACjD,IAAI;EACH,MAAM,UAAU,KAAK;EACrB,IAAI,SAAS;GACZ,IAAI,KAAK,QAAQ,QAAQ,qBAAqB;GAC9C,IAAI,CAAC,IAAI;IACR,KAAK,OAAO;IACZ,QAAQ,QAAQ,uBAAuB,EAAE;GAC1C;GACA,OAAO;EACR;CACD,QAAQ,CAAC;CACT,mBAAmB,OAAO;CAC1B,OAAO;AACR;;AAIA,SAAS,2BAA2B,KAAK;CACxC,IAAI,OAAO,SAAS;EACnB,MAAM;EACN,MAAM;EACN,kBAAkB;EAClB,SAAS,OAAO,IAAI,SAAS;GAC5B,MAAM,OAAO,sBAAsB,CAAC,CAAC,MAAM,SAAS,KAAK,OAAO,EAAE;GAClE,IAAI,CAAC,MAAM,MAAM,IAAI,MAAM,kCAAkC,GAAG,YAAY;GAC5E,OAAO,MAAM,KAAK,OAAO,IAAI;EAC9B;CACD,CAAC;CACD,IAAI,SAAS;CACb,IAAI,WAAW;CACf,IAAI,kBAAkB;CACtB,MAAM,aAAa;EAClB,IAAI,UAAU,UAAU;EACxB,SAAS;EACT,eAAe,YAAY;GAC1B,SAAS;GACT,IAAI,UAAU;GACd,MAAM,YAAY,sBAAsB,CAAC,CAAC,KAAK,EAAE,QAAQ,GAAG,GAAG,eAAe,QAAQ;GACtF,IAAI,UAAU,WAAW,KAAK,oBAAoB,GAAG;GACrD,kBAAkB,UAAU;GAC5B,MAAM,IAAI,aAAa,oCAAoC,gBAAgB,GAAG,SAAS,CAAC,CAAC,YAAY,CAAC,CAAC;EACxG,CAAC;CACF;CACA,MAAM,YAAY,2BAA2B,IAAI;CACjD,MAAM,iBAAiB,IAAI,OAAO,GAAG,sBAAsB,WAAW;EACrE,IAAI,WAAW,aAAa,KAAK;CAClC,CAAC;CACD,KAAK;CACL,aAAa;EACZ,WAAW;EACX,UAAU;EACV,eAAe;CAChB;AACD"}