51:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 52:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 53:T2050,"use client" import * as React from "react" import { Autocomplete } from "@base-ui/react/autocomplete" import { Dialog as BaseDialog } from "@base-ui/react/dialog" import { Search } from "lucide-react" import { cn } from "@/lib/utils" import { condense } from "@/lib/motion" import { Kbd } from "./kbd" // The ⌘K surface: Base UI Autocomplete rendered `inline` + always `open` // inside a Dialog (the documented composition — the dialog owns mount/unmount, // so filter, highlight, and input reset on close). The palette panel is a // modal key rising on condense; the search field is a debossed entry well; // shortcut hints are embossed Kbd caps. // Root: a Dialog that also owns the global ⌘/Ctrl+K binding. Controlled or // uncontrolled — the hotkey works either way because open state resolves here. function CommandPalette({ defaultOpen = false, open: openProp, onOpenChange, hotkey = true, ...props }: Omit, "onOpenChange"> & { /** Bind ⌘/Ctrl+K to toggle the palette. */ hotkey?: boolean /** Fires on open/close. `eventDetails` is `undefined` for the global-hotkey * toggle — no Base UI event originates it — and present otherwise. */ onOpenChange?: ( open: boolean, eventDetails?: Parameters< NonNullable["onOpenChange"]> >[1] ) => void }) { const [openState, setOpenState] = React.useState(defaultOpen) const open = openProp ?? openState const handleOpenChange: React.ComponentProps< typeof BaseDialog.Root >["onOpenChange"] = (next, eventDetails) => { if (openProp === undefined) setOpenState(next) onOpenChange?.(next, eventDetails) } React.useEffect(() => { if (!hotkey) return const onKeyDown = (e: KeyboardEvent) => { if ( e.key === "k" && (e.metaKey || e.ctrlKey) && !e.shiftKey && !e.altKey ) { e.preventDefault() if (openProp === undefined) setOpenState(!open) // no Base UI eventDetails exists for a global-hotkey toggle onOpenChange?.(!open) } } window.addEventListener("keydown", onKeyDown) return () => window.removeEventListener("keydown", onKeyDown) }, [hotkey, open, openProp, onOpenChange]) return ( ) } function CommandPaletteTrigger( props: React.ComponentProps ) { return } // The panel: top-aligned modal key + the always-open inline Autocomplete. // `items` drives Base UI's built-in filtering; `autoHighlight` keeps the top // match ready for Enter, cmdk-style. function CommandPaletteContent({ items, autocomplete, className, children, ...props }: React.ComponentProps & { items: React.ComponentProps["items"] /** Escape hatch for the underlying Autocomplete.Root: pass `filter`, * `value`/`onValueChange`, `itemToStringValue`, `onItemHighlighted`, etc. * Overrides the palette's tunable defaults (autoHighlight/keepHighlight); * the `open`/`inline` composition stays locked so the dialog keeps owning * mount/unmount. */ autocomplete?: Omit< React.ComponentProps, "items" | "children" | "open" | "inline" > }) { return ( {children} ) } // The debossed search well the palette opens onto. function CommandPaletteInput({ className, ...props }: React.ComponentProps) { return (

Close command palette

) } function CommandPaletteList({ className, ...props }: React.ComponentProps) { return ( ) } function CommandPaletteGroup( props: React.ComponentProps ) { return } function CommandPaletteGroupLabel({ className, ...props }: React.ComponentProps) { return ( ) } /** Renders the filtered items within a group. */ const CommandPaletteCollection = Autocomplete.Collection // A command row: icon slot, label, optional Kbd shortcut. Highlight is the // accent treatment shared with combobox/menu items. function CommandPaletteItem({ shortcut, className, children, ...props }: React.ComponentProps & { shortcut?: React.ReactNode }) { return ( {children} {shortcut ? {shortcut} : null} ) } function CommandPaletteEmpty({ className, ...props }: React.ComponentProps) { return ( ) } // Hint row of embossed keycaps along the bottom edge. function CommandPaletteFooter({ className, ...props }: React.ComponentProps<"div">) { return (

) } export { CommandPalette, CommandPaletteTrigger, CommandPaletteContent, CommandPaletteInput, CommandPaletteList, CommandPaletteGroup, CommandPaletteGroupLabel, CommandPaletteCollection, CommandPaletteItem, CommandPaletteEmpty, CommandPaletteFooter, } 50:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","@base-ui/react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/%40base-ui%2Freact","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"@base-ui/react"}]]}]}],["$","li","lucide-react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/lucide-react","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"lucide-react"}]]}]}]]}],["$","$L51",null,{"namespace":"@seamui","registryDependencies":["https://seamui.dev/r/utils.json","https://seamui.dev/r/motion.json","https://seamui.dev/r/kbd.json"]}]]}],null]}],["$","$L52",null,{"files":[{"path":"registry/seam/ui/command-palette.tsx","content":"$53","type":"registry:ui","target":"components/ui/command-palette.tsx"}],"className":"h-[70svh] min-h-80"}]]}]