mirror of
https://github.com/supabase/supabase.git
synced 2026-09-07 02:20:52 +08:00
243e079a2c
## Problem The `_Shadcn_` suffix isn't needed anymore on `Command` components ## Solution - Remove the `_Shadcn_` suffix - Simplify UI package exports - Apply prettier <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Simplified command component imports and exports across the UI library by removing internal naming aliases and adopting direct component references. Updated the public UI package barrel export to use wildcard re-exports for cleaner API surface. <!-- review_stack_entry_start --> [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46153?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack) <!-- review_stack_entry_end --> <!-- end of auto-generated comment: release notes by coderabbit.ai -->
80 lines
2.4 KiB
TypeScript
80 lines
2.4 KiB
TypeScript
'use client'
|
|
|
|
import { Calculator, Calendar, CreditCard, Settings, Smile, User } from 'lucide-react'
|
|
import * as React from 'react'
|
|
import {
|
|
CommandDialog,
|
|
CommandEmpty,
|
|
CommandGroup,
|
|
CommandInput,
|
|
CommandItem,
|
|
CommandList,
|
|
CommandSeparator,
|
|
CommandShortcut,
|
|
} from 'ui'
|
|
|
|
export default function CommandDialogDemo() {
|
|
const [open, setOpen] = React.useState(false)
|
|
|
|
React.useEffect(() => {
|
|
const down = (e: KeyboardEvent) => {
|
|
if (e.key === 'j' && (e.metaKey || e.ctrlKey)) {
|
|
e.preventDefault()
|
|
setOpen((open) => !open)
|
|
}
|
|
}
|
|
|
|
document.addEventListener('keydown', down)
|
|
return () => document.removeEventListener('keydown', down)
|
|
}, [])
|
|
|
|
return (
|
|
<>
|
|
<p className="text-sm text-muted-foreground">
|
|
Press{' '}
|
|
<kbd className="pointer-events-none inline-flex h-5 select-none items-center gap-1 rounded-sm border bg-muted px-1.5 font-mono text-[10px] font-medium text-muted-foreground opacity-100">
|
|
<span className="text-xs">⌘</span>J
|
|
</kbd>
|
|
</p>
|
|
<CommandDialog open={open} onOpenChange={setOpen}>
|
|
<CommandInput placeholder="Type a command or search..." />
|
|
<CommandList>
|
|
<CommandEmpty>No results found.</CommandEmpty>
|
|
<CommandGroup heading="Suggestions">
|
|
<CommandItem>
|
|
<Calendar className="mr-2 h-4 w-4" />
|
|
<span>Calendar</span>
|
|
</CommandItem>
|
|
<CommandItem>
|
|
<Smile className="mr-2 h-4 w-4" />
|
|
<span>Search Emoji</span>
|
|
</CommandItem>
|
|
<CommandItem>
|
|
<Calculator className="mr-2 h-4 w-4" />
|
|
<span>Calculator</span>
|
|
</CommandItem>
|
|
</CommandGroup>
|
|
<CommandSeparator />
|
|
<CommandGroup heading="Settings">
|
|
<CommandItem>
|
|
<User className="mr-2 h-4 w-4" />
|
|
<span>Profile</span>
|
|
<CommandShortcut>⌘P</CommandShortcut>
|
|
</CommandItem>
|
|
<CommandItem>
|
|
<CreditCard className="mr-2 h-4 w-4" />
|
|
<span>Billing</span>
|
|
<CommandShortcut>⌘B</CommandShortcut>
|
|
</CommandItem>
|
|
<CommandItem>
|
|
<Settings className="mr-2 h-4 w-4" />
|
|
<span>Settings</span>
|
|
<CommandShortcut>⌘S</CommandShortcut>
|
|
</CommandItem>
|
|
</CommandGroup>
|
|
</CommandList>
|
|
</CommandDialog>
|
|
</>
|
|
)
|
|
}
|