Usage notes
This is the high-level React shape used by the HTML media sync demo. Provide a media element ref, source map, and named layers. The hook creates an HTMLMediaAdapter, passes it to useTimelineMediaSync, and exposes transport commands suitable for toolbar buttons.
Signature
Interface UseHTMLTimelineMediaOptionsType parameters
| Name | Constraint | Default | Description |
|---|---|---|---|
LayerName | string | string | Named media layer keys inferred from `layers`, such as
`"visuals"` for a video-only preview. |
TMediaElement | HTMLMediaElement | HTMLMediaElement | Native element type held by `ref`. |
Properties
| Name | Signature | Description |
|---|---|---|
layers | layers: Record<LayerName, ActiveLayerSelector> | Named active layer selectors used by the external media surface. |
onError? | (message: string): void | Called when no content exists or no active layer clip is available. |
ref | ref: RefObject<TMediaElement | null> | Ref containing the media element once React has mounted it. |
sources | sources: Record<string, HTMLMediaAdapterSource> | Media sources keyed by timeline clip `sourceId`. |