CommandPalette
Searchable command palette for quick access to editor actions
The CommandPalette provides a Spotlight-style search interface for executing editor commands - adding tracks, toggling tools, navigating the timeline, and more.
Live Example
Loading...
Usage
import { CommandPalette, TimelineProvider } from '@timelinx/ui';
import { useState } from 'react';
function App() {
const [isOpen, setIsOpen] = useState(false);
return (
<TimelineProvider engine={engine}>
<CommandPalette isVisible={isOpen} onClose={() => setIsOpen(false)} />
</TimelineProvider>
);
}Props
Prop
Type
Context Requirement
CommandPalette must be inside a TimelineProvider. It dispatches commands to the engine and reads available actions from the current timeline state.