🚀 Variables Editor, theme switcher, and dependency security fixes

[sergak01]

Summary

• 🚀 Adds a standalone Variables Editor page (/@pp-dev/variables-editor) for editing a template's variable schema and a page's live variable values, alongside the existing Request Inspector — plus new "Reload variables" / "Open variables editor…" buttons in the dev panel.
• 🚀 Adds an Auto/Dark/Light theme switcher, now hosted primarily in the dev panel's settings popover and shared (via localStorage) with the standalone Inspector and Variables Editor pages.
• 🔧 Fixes the Variables Editor's tab switch blanking out until the network request resolves (now shows cached content or a skeleton immediately, debounces the background reload), and adds a confirm-before-delete step plus a more ergonomic advanced-fields toggle in the Schema tab.
• 🔐 Resolves npm audit findings in root and all 3 test fixtures — 0 vulnerabilities across the board.
• 🧹 Replaces the outdated 1.0 planning docs with a real, screenshot-based feature tour (docs/features.md), linked from the README.

Key changes

Variables Editor

• src/lib/variables-editor.ts — new standalone page: Schema tab (edit __template_variables.json) and Values tab (edit live page-variable values), each with a raw-JSON escape hatch.
• src/lib/page-variables-diff.ts, src/api/page-variable.ts, src/lib/pp.middleware.ts — schema/export/validation helpers and PageVariableAPI backing the editor and the dev-panel "Reload variables" action.
• Dev panel gets "Reload variables" and "Open variables editor…" buttons (gated on the page having a template), plus an always-available "Open request inspector…" button.

Theme switcher

• src/client/theme.ts (new) — shared getStoredTheme/setTheme/initTheme, using one localStorage key (pp-dev-info-theme) and one DOM attribute (data-pp-dev-theme) across the dev panel, Inspector, and Variables Editor.
• Adds light-theme support to the previously dark-only Inspector/Variables Editor.

Variables Editor UX fixes

• Tab switches now repaint instantly with cached data (or a skeleton if never loaded) instead of leaving stale content on screen; the follow-up network reload is debounced (200ms) — the manual "↻ Refresh" button stays immediate.
• Schema-tab advanced fields (uid, tag_source, additional_options, editor flags) now expand via a chevron at the start of each row instead of a gear icon at the far right end.
• Deleting a Schema or Values row now requires confirmation.

Security

• Bumped brace-expansion/ip-address/undici overrides past newly-disclosed vulnerable ranges (root + all 3 fixtures), added a js-yaml override in the Next.js fixtures for a CVE published mid-session.
• Extended scripts/patch-npm-bundled-vulnerabilities.mjs to also cover undici (it already patched brace-expansion/ip-address/tar bundled inside the npm package via semantic-release), and to sync the patched versions into package-lock.json — the script only ever rewrote files on disk, so npm audit kept flagging the stale versions it still had recorded in the lockfile.

Included commits

36c727e feat: add page-variables API and schema/export/validation helpers
40bc88e feat: add standalone Variables Editor page with dev-panel entry points
536628c docs: document the Variables Editor, fix stale page-variables references
b6f72a6 feat: add Auto/Dark/Light theme switcher, shared across the dev panel, Inspector, and Variables Editor
bce87ee docs: add screenshot feature tour, link it from README
399930d fix: Variables Editor tab switch no longer blanks out until the fetch resolves
6cc96ee fix: Variables Editor — ergonomic advanced-fields toggle, confirm before delete
8600363 chore: reinstall pp-dev in test fixtures
a33aad3 fix: address npm audit vulnerabilities in root and test fixtures

Testing

• npx tsc --noEmit — clean
• npm run test:unit — 274/274 passing
• npm run test:integration — 39/39 passing
• npm run audit:all — 0 vulnerabilities in root + all 3 test fixtures
• Manually verified in a live browser session (Playwright + real dev server) against a Metric Insights staging instance: dev panel, Request Inspector, Variables Editor (Schema/Values/raw-JSON/theme), theme propagation across pages, tab-switch caching/debounce, and delete confirmation.

Merge Request: origin/pp-3990 → origin/develop

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 2ff9cdc4-938e-4b5a-a293-38bcbcb54da1

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}