TimelineToolbar

TimelineToolbar renders the timeline toolbar with tool selection buttons (selection, razor, trim, slip, slide, hand), undo/redo, zoom controls, snap toggle, and a timecode position display.

Live Example

Usage

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

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

Props

Context Requirement

TimelineToolbar must be inside a TimelineProvider. It reads the active tool, playing state, history, playhead frame, timeline metadata (fps, duration), and zoom level (ppf) from the engine context.