WORK-066
ID:WORK-066Status:done

Media Slots Dimension

Priority:mediumComplexity:simpleMilestone:v0.9.0
claude/align-sidenav-styling-4MuxV View source

Criteria completion

No incremental history — criteria tracking started on Apr 17.

Relationships

Implements 1
Branches 3
claude/align-sidenav-styling-4MuxV current done
main doneclaude/file-naming-convention-LJdwR donechangeset-release/main done
History 3
  1. 9ab3ef2
    Content editedby Claude
    feat(transform): add media slots dimension to rune configs (WORK-066)
  2. a129a9e
    Content editedby Claude
    Assign all new work items (WORK-051–068) to v0.9.0 milestone
  3. a333007
    Created (done)by Claude
    Add work items for SPEC-024 (Metadata) and SPEC-025 (Universal Theming)

Summary

Add a media slots mapping to rune configs and the identity transform. Runes declare mediaSlots that map image ref names to media treatment types (portrait, cover, thumbnail, hero, icon). The transform emits data-media on image elements, enabling themes to style all media uniformly — circular portraits, full-width covers, small thumbnails — with ~5 CSS rules.

Acceptance Criteria

  • RuneConfig in packages/transform/src/types.ts gains mediaSlots?: Record<string, 'portrait' | 'cover' | 'thumbnail' | 'hero' | 'icon'>
  • Identity transform emits data-media on image/media elements whose ref maps to a media slot
  • Rune configs annotated per SPEC-025 Table 2: Character portrait → portrait, Recipe image → cover, Track artwork → thumbnail, Hero media → hero, etc.
  • refrakt inspect output shows data-media attributes on media elements
  • Unit tests verify media attribute emission

Approach

  1. Add mediaSlots to RuneConfig interface
  2. In the engine, when processing a structure entry or content element whose ref matches a key in mediaSlots, emit data-media with the mapped slot type
  3. Annotate rune configs per SPEC-025 Table 2

References

  • SPEC-025 (Universal Theming Dimensions — Media Slots, Table 2: Media Slots Map)