The previous demos violated DEMO_AUTHORING_GUIDE in several places. Both
have been rewritten end-to-end against the aspect-ratio canary template
(canonical reference for 0-events eidos primitives).
Changes per demo:
- Stage always rendered between header and tablist (was inside Live tab).
- MutationObserver wired with stageRef + 6-entry trace strip (was absent —
required even for 0-event components per §6).
- Trace strip layout: 'no semantic events' badge + shape/variant + size +
color, matches aspect-ratio shape.
- Live tab adds the soma + eidos code snippets with full data-uix-code
wrappers and head badges (§7 + §8).
- somaSnippet now shows the equivalent semantic markup with a clear
"not real soma" note (since these are eidos-native).
- API tab uses data-uix-table with explicit "Skeleton-specific props" +
"Inherited from Box" + "Reference comparison" subsections (§4).
- Morfo tab matches §10: header field/value table + Parts table with
marker column + per-part data/aria subsection tables.
- Sema tab keeps the explicit 0-events explanation (was absent for one
of the demos).
- Recipe tab uses the Selectors table with morfo/eidos owner tags (§11)
instead of a single code snippet.
- A11y tab uses data-uix-table (concern/contract) instead of a bullet
list, matching aspect-ratio.
Reference template: web/routes/uix/components/aspect-ratio/+page.svelte.
Per §1, when in doubt, copy from the canary template and adapt.
svelte-check: 0 errors.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
dev
fead097ce1