Canvas Timeline
Function

useTimelineSelector

Selects a value from the engine's immutable, settled state snapshot.

Usage notes

Primitive results use Object.is; arrays and plain objects compare their own enumerable fields shallowly. Supply isEqual for another selection policy. This hook excludes per-frame playback and edit-preview updates. Use useTimelinePlayheadTime for a live playback readout.

Signature

Type Definition
useTimelineSelector(selector: (state: object) => Value, isEqual: (previous: Value, next: Value) => boolean = shallowEqual): Value

Type parameters

NameConstraintDefaultDescription
ValueNoneNoneSelected value, including primitive values.

Parameters

NameTypeDescription
selector(state: object) => ValuePure projection of the readonly timeline snapshot.
isEqual(previous: Value, next: Value) => booleanEquality check used to preserve the last selected value.

Returns

Value

The selected value, updated only when its equality check changes.

Examples

tsx Example
import { useTimelineSelector } from '@techsquidtv/canvas-timeline-react';
export function TrackCount() {
  const count = useTimelineSelector(state => state.tracks.length);
  return <output>{count}</output>;
}