Command

import { useState } from 'react'

import { Button, CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem } from '@amineslab/ui'

function CommandExample({ shouldFilter = true, scrollable = true, title = '명령 검색', description = '실행할 작업을 선택하세요.', } = {}) {
    const [open, setOpen] = useState(false);
    return (<>
      <Button variant="outline" onClick={() => setOpen(true)}>
        검색 열기
      </Button>
      <CommandDialog shouldFilter={shouldFilter} title={title} description={description} open={open} onOpenChange={setOpen}>
        <CommandInput placeholder="기능 검색"/>
        <CommandList scrollable={scrollable}>
          <CommandEmpty>결과가 없습니다.</CommandEmpty>
          <CommandGroup heading="빠른 이동">
            <CommandItem value="settings" onSelect={() => setOpen(false)}>
              설정
            </CommandItem>
            <CommandItem value="members" onSelect={() => setOpen(false)}>
              멤버
            </CommandItem>
          </CommandGroup>
        </CommandList>
      </CommandDialog>
    </>);
}

export default function ExamplePreview() {
  return (<CommandExample {...({"title":"명령 검색","description":"실행할 작업을 선택하세요.","shouldFilter":true,"scrollable":true} as const)}/>)
}