From a9972f76bb6e72c88a1fc0d0056c091b348d7ecc Mon Sep 17 00:00:00 2001 From: Jake Date: Fri, 15 May 2026 12:53:56 +0100 Subject: [PATCH] v0.3 Phase 2: build flag wiring Wires VITE_LUMOTIA_QUIETWARE=1 to set via a $effect in src/routes/+layout.svelte. Without the flag the runtime app behaves exactly as v0.2; with the flag the v0.3 token overrides in src/design-system/v0.3-quietware-tokens.css activate. Hot-reload safety: if the env var is unset between dev rebuilds, the attribute is cleared so devs do not see a stuck quietware surface. Activation paths: VITE_LUMOTIA_QUIETWARE=1 npm run dev (development) VITE_LUMOTIA_QUIETWARE=1 npm run build (production) Or manually via dev tools: Combine with data-theme="light" (existing v0.2 theme wiring) and data-contrast="high" (existing v0.2 contrast wiring) to reach the light and high-contrast quietware modes. Smallest possible PR. No new dependencies. No bundle-size impact in the off path. No component changes. Plan doc updated to mark Phase 2 as landed. Co-Authored-By: Claude Opus 4.7 (1M context) --- docs/release/v0.3-tactile-quietware.md | 8 ++++++++ src/routes/+layout.svelte | 16 ++++++++++++++++ 2 files changed, 24 insertions(+) diff --git a/docs/release/v0.3-tactile-quietware.md b/docs/release/v0.3-tactile-quietware.md index 8754a62..d54bdd9 100644 --- a/docs/release/v0.3-tactile-quietware.md +++ b/docs/release/v0.3-tactile-quietware.md @@ -200,6 +200,14 @@ Each phase ships as its own PR. Each is flag-gated by `html[data-design="quietwa - Verified by visual inspection. Manual activation via dev tools toggling the attribute. - Palette iterated three times this session (brand-as-semantic → cobalt-pegged square → color.adobe.com primaries). Final values locked in commit on amendment. +### Phase 2 — Build flag wiring. Landed 2026-05-15. + +- `src/routes/+layout.svelte` extended with a `$effect` block that reads `import.meta.env.VITE_LUMOTIA_QUIETWARE` at runtime and sets `` when the flag is `"1"`. +- Hot-reload safety: if the env var is unset between dev rebuilds, the attribute is cleared. +- Activation: `VITE_LUMOTIA_QUIETWARE=1 npm run dev` (or `npm run build`) lights up the quietware tokens. Without the env var, app renders v0.2 unchanged. +- Combine with `data-theme="light"` and `data-contrast="high"` (already wired by v0.2) to reach the light and high-contrast quietware modes. +- No new dependencies. No bundle-size impact in the off path. + --- ## Regression diary diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 3caeb38..f95b3ab 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -21,6 +21,22 @@ $sveltePage.url.pathname.startsWith("/viewer") || $sveltePage.url.pathname.startsWith("/preview") ); + + // v0.3 Tactile Quietware activation. When VITE_LUMOTIA_QUIETWARE=1 + // is set at build time, mark so the + // v0.3 token overrides in src/design-system/v0.3-quietware-tokens.css + // become active. Without the flag the app behaves exactly as v0.2. + // Combine with data-theme="light" and data-contrast="high" (already + // wired elsewhere) for the light and high-contrast modes. + $effect(() => { + if (typeof document === "undefined") return; + if (import.meta.env.VITE_LUMOTIA_QUIETWARE === "1") { + document.documentElement.dataset.design = "quietware"; + } else if (document.documentElement.dataset.design === "quietware") { + // Hot-reload safety: env var unset between dev rebuilds. + delete document.documentElement.dataset.design; + } + });