Usage notes
Use this hook when a component owns controls for one specific row: mute, visibility, lock, targeted state, grouping, or row height. It returns safe no-op failure commands when the track id is missing, so header components can remain mounted while project data changes.
Signature
useTimelineTrack(trackId: string, options: TimelineTrackGeometryOptions = {}): UseTimelineTrackResult<TrackKind>Type parameters
| Name | Constraint | Default | Description |
|---|---|---|---|
TrackKind | string | string | App-defined track kind value carried by the requested track. |
Parameters
| Name | Type | Description |
|---|---|---|
| trackId | string | Track id to read and update. |
| options | TimelineTrackGeometryOptions | Optional track geometry overrides matching the renderer. |
Returns
UseTimelineTrackResult<TrackKind>
Track row state, canvas-aligned geometry, and row-scoped commands.
Examples
import { useTimelineTrack } from '#react/hooks';
export function TrackMuteButton({ trackId }: { trackId: string }) { const track = useTimelineTrack(trackId);
return ( <button type="button" aria-pressed={track.muted} onClick={() => track.toggleMute()}> {track.muted ? 'Unmute' : 'Mute'} {track.name ?? track.trackId} </button> );}