Command
The command surfaces from @phauna/ds/command, surfaced through our ds/ layer (@/components/ds/command). A ⌘K fuzzy launcher, an app-wide search field, and a notification center — keyboard-driven, token-themed and a11y-wired (real buttons, labelled listbox, focus rings, unread state never carried by color alone). All client modules; flip the theme in the top bar to confirm each re-skins.
- import
- export * from "@savethemarshalldogs/design-system/command" via @/components/ds/command (a CLIENT-only barrel — the components own hooks/effects and load fuse.js at runtime).
- CommandPalette
- The ⌘K fuzzy command/navigation launcher (a Base UI Dialog). Takes commands: CommandItem[] (id, label, icon?, hint?, group?, keywords?, onSelect?), grouped by first-seen order; ranked with fuse.js when present, else a substring match. Controlled via open / onOpenChange.
- useCommandPalette
- Owns the open state and binds the global ⌘K / Ctrl-K hotkey. Returns { open, setOpen, onOpenChange, toggle } — wire onOpenChange into CommandPalette and trigger from a button with toggle.
- GlobalSearch<T>
- A debounced async search field. onQuery(query) returns T[] | Promise<T[]> (awaited safely); renderResult(result, i) draws a row, onSelect(result) fires on click / ⏎. Tunable debounceMs, placeholder, emptyText.
- NotificationCenter
- A bell + unread badge that opens a Drawer of notifications. Takes items: Notification[] (id, title, body?, icon?, date?, read?, action?) plus onMarkRead / onMarkAllRead / onDismiss; unread defaults to counting unread items.
- useNotifications
- Manages the queue. Returns { items, unread, add, markRead, markAllRead, dismiss, clear } — feed items + the handlers straight into NotificationCenter.
CommandPalette
The ⌘K launcher. Press ⌘K / Ctrl-K (bound by useCommandPalette) or click the button to open it, type to fuzzy-filter, arrow through the grouped results and press Enter to run. Each item carries an optional icon, a group bucket, extra keyword terms and a trailing shortcut hint.
Last command: —
GlobalSearch
An app-wide search field that debounces your keystrokes, awaits an async query and opens a results panel. Here the query is stubbed — it simulates a short round-trip over a sample corpus of people, communities, events and documents — and each row renders with a kind icon and label.
Last opened: —
NotificationCenter
A bell with an unread badge that opens a drawer of notifications. Open it to mark items read (or mark all read) and dismiss them; the unread count is announced and dotted, not carried by color alone. Push a notification to watch the queue and badge update live.