WORK-066
ID:WORK-066Status:done

Media Slots Dimension

Priority:mediumComplexity:simpleMilestone:v0.9.0Source:SPEC-025
main View source

Criteria completion

Criteria completion: 5 of 5 (100%) checked; history from Mar 24 to Mar 240%25%50%75%100%Mar 24Mar 24

Relationships

Implements 1
Branches 3
main current done
claude/file-naming-convention-LJdwR donechangeset-release/main doneclaude/align-sidenav-styling-4MuxV done
History 5
  1. e900a90
    Created (done)by bjornolofandersson
  2. f262d7b
    Content editedby Claude
  3. 9ab3ef2
    • ☑ `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
    by Claude
  4. a129a9e
    Content editedby Claude
  5. a333007
    Created (ready)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)