1 viewer
Back to Components
Component · Content

MediaPlayer

Server-rendered <audio>/<video> mount with placeholder, aspect, and HLS/MJPEG enhancement via window.CRE8_MEDIA.

Category
Content
Slots
3
States
4
Writer
Shared
cre8.primitive.media-player

Preview

Live renderShared SSR + WASM writers
No source selected.
<MediaPlayer aspect="16:9" kind="video" title="Lobby stream" />

Anatomy

The named parts of the rendered markup. Recipes style these hooks, and every renderer keeps them stable.

SlotDOM class
root.primitive-media-wrap
media—
placeholder—
3 rows

States and platforms

The states the contract publishes, the platforms it declares, and the style recipes that dress it.

States
placeholderplayingaudiovideo
Platforms
webruntime-node
Recipes
unstyledruntime-console

Renderers

Shared writer
MediaPlayer renders through the one writer the server and the WASM DOM share, so both emit the same markup.

Every tag in the example above renders through a shared writer.

Declared adapters. A status is the manifest's declaration, not a measured parity result.

TargetRendererStatus
webreactexperimental
runtime-nodeview-nodeready
ssrhtml-semanticready
terminalterminal-textplanned
4 rows

Accessibility

Uses native <audio>/<video> semantics with a visible fallback span that stays announced when no source can play.

  • Sources surface through native <source> children so the browser exposes controls and quality picking.
  • Empty source lists still expose a placeholder span readable by assistive technology.
  • When delegating to the global CRE8_MEDIA helper, the wrapper retains data-cre8-media-player so hydrators can locate the host element.