TransportControls

The TransportControls component provides playback controls - play/pause toggle, frame stepping, and skip to start/end.

Live Example

Usage

import { TransportControls, TimelineProvider } from '@timelinx/ui';

function App() {
  return (
    <TimelineProvider engine={engine}>
      <TransportControls />
    </TimelineProvider>
  );
}

Props

Context Requirement

TransportControls must be inside a TimelineProvider. It reads the playhead frame, playing state, and timeline metadata (fps, duration) from the engine context.