Same gated-layout pattern as Phase 5c. v0.2 surface untouched;
quietware path renders FilesPage via LumotiaPageSkeleton with the
four zones the page actually needs:
Capture header "File transcription" + "Transcribe audio files locally."
Primary surface drop zone / progress / transcript states
Action dock Browse files / Copy / Export
Mono footer formats · model · Local only
State + handlers preserved.
fileTranscript, segments, isDragOver, progress, progressText,
fileName, error, transcribing, showExportMenu — all unchanged.
handleBrowse, transcribeFiles, copyAll, handleExport — all
unchanged. Tauri drag-drop listeners stay live on onMount; new
MutationObserver for data-design joins them.
Primary surface state machine.
transcribing Upload icon, "Transcribing" label, mono file
name, LumotiaProgress (tone="transcribing", so
the blue Phase 4k progress fill applies).
Progress text below.
empty Dashed drop zone using --button-primary-bg
accent when isDragOver, neutral subtle border
otherwise. Empty-state typography mirrors
Dictation: Young Serif italic "Drop an audio
file.", Work Sans support, format list in
JetBrains Mono.
has transcript Full-bleed editable textarea.
Action dock.
Browse files (primary when no transcript; secondary when transcript
exists — at that point Export becomes the primary action).
Copy (tertiary, disabled until transcript exists).
Export (LumotiaMenu trigger — primary when transcript exists,
secondary otherwise).
Disabled controls render neutral per the Phase 4k token contract.
Mono footer.
Single line: "MP3 · WAV · M4A · MP4 · FLAC · OGG · {model} · Local only"
Capture script updated.
scripts/capture-quietware-screenshots.mjs now navigates to the
Files page via the sidebar nav button after capturing the root
route, and screenshots both quietware modes.
Verified.
- npm run check: 0 errors, 0 warnings across 5707 files.
- Headless captures confirm the new layout in both modes:
drop zone + action dock + mono footer with the right Phase 4j
colour grammar applied. Browse Files blue primary, disabled
actions neutral, dashed border picks up --button-primary-bg
when isDragOver.
Phase 5e (Tasks) and 5f (History) follow same pattern.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Two small infra changes to support visual verification of v0.3 phases
from a git worktree.
- vite.config.js. server.fs.allow extended to ["..", "../.."]. When
the dev server runs inside .worktrees/v0.3-tactile-quietware/ the
shared node_modules sits one extra directory up, which Vite's
default fs.strict policy rejected with HTTP 403 on the @sveltejs
runtime client. Allowing the parent path unblocks dev runs from
any worktree of this repo. No effect when dev runs from the main
checkout.
- scripts/capture-quietware-screenshots.mjs. Headless Playwright
driver that visits /design-system-v2 (and best-effort /) under
five attribute combinations (v0.2 baseline, quietware-dark,
quietware-light, quietware-hc-dark, quietware-hc-light) and
writes one PNG per combination to /tmp/lumotia-v0.3-screenshots/.
Used to email Jake the visual proof for Phase 4a review.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
