Command

npx @noordvc/raster-cli add command

<div class="rs-command" style="border:1px solid var(--divider);border-radius:var(--radius)"><input class="rs-command-input" placeholder="Type a command or search…" /><div class="rs-command-list"><div class="rs-command-group">Go to</div><button class="rs-command-item rs-command-item-active"><span>Components</span><span class="rs-command-hint">⌘1</span></button><button class="rs-command-item"><span>Tokens</span><span class="rs-command-hint">⌘2</span></button></div></div>

import { CommandDialog } from "@/components/raster/command";

// wire the shortcut once in your app
useEffect(() => {
  const onKey = (e: KeyboardEvent) => {
    if (e.key === "k" && (e.metaKey || e.ctrlKey)) { e.preventDefault(); setOpen(true); }
  };
  window.addEventListener("keydown", onKey);
  return () => window.removeEventListener("keydown", onKey);
}, []);

<CommandDialog
  open={open}
  onClose={() => setOpen(false)}
  groups={[{ label: "Go to", items: [{ label: "Components", onSelect: go }] }]}
/>