Command

Kurulum

Paket

@bigbang/ui

İçe aktarma

import { Command } from '@bigbang/ui';

Kaynak

Command.tsx

Storybook

Command · Playground

Command ve CommandDialog @bigbang/ui paketindedir. Tipler CommandGroup ve CommandItem olarak dışa aktarılır.

import { CommandDialog, type CommandGroup } from '@bigbang/ui';

const groups: CommandGroup[] = [
  { label: 'Sayfalar', items: [{ value: 'home', label: 'Ana sayfa', icon: 'home', onSelect: () => navigate('/') }] },
];

<CommandDialog groups={groups} />;

Özellikler

Command

groupsZorunlu

Açıklama

Gruplar halinde komutlar. Arama sırasında boş kalan gruplar gizlenir.

Tür

readonly CommandGroup[]

label

Açıklama

Arama girişinin erişilebilir adı. Varsayılanı Provider'dan "Komut paleti" ya da "Command palette".

Tür

string

placeholder

Açıklama

Boş girişteki metin. Varsayılanı "Komut ya da sayfa arayın" ya da "Search commands or pages".

Tür

string

emptyText

Açıklama

Hiçbir şey eşleşmediğindeki metin. Varsayılanı "Sonuç bulunamadı" ya da "No results".

Tür

string

hints

Açıklama

Listenin altında tuş ipuçlarını gösterir. 640 px'in altında gizlenir.

Tür

boolean

Varsayılan

true

className

Açıklama

Yalnızca yerleşim için: boyut ve konum.

Tür

string

CommandDialog

groupsZorunlu

Açıklama

Gruplar halinde komutlar. Arama sırasında boş kalan gruplar gizlenir.

Tür

readonly CommandGroup[]

label

Açıklama

Pencerenin ve arama girişinin erişilebilir adı. Varsayılanı "Komut paleti" ya da "Command palette".

Tür

string

placeholder

Açıklama

Boş girişteki metin. Varsayılanı "Komut ya da sayfa arayın" ya da "Search commands or pages".

Tür

string

emptyText

Açıklama

Hiçbir şey eşleşmediğindeki metin. Varsayılanı "Sonuç bulunamadı" ya da "No results".

Tür

string

hints

Açıklama

Listenin altında tuş ipuçlarını gösterir. 640 px'in altında gizlenir.

Tür

boolean

Varsayılan

true

className

Açıklama

Yalnızca yerleşim için: boyut ve konum.

Tür

string

open

Açıklama

Denetlediğinizde paletin açık olup olmadığı. onOpenChange ile kullanın.

Tür

boolean

onOpenChange

Açıklama

Palet açılıp kapandığında çağrılır: kısayol, Escape, dışarı tıklama ya da seçilen komutla.

Tür

(open: boolean) => void

hotkey

Açıklama

Paleti Apple cihazlarda ⌘K, diğerlerinde Ctrl+K ile açıp kapatır.

Tür

boolean

Varsayılan

true

material

Açıklama

'solid', cam bir Provider altında komut paletini opak tutar.

Tür

'auto' | 'solid'

Varsayılan

'auto'

CommandItem: value, label, onSelect, isteğe bağlı icon, shortcut, keywords ve disabled. CommandGroup: label ve items.

Veri öznitelikleri

• data-component="command": palette; data-component="command-dialog": pencerede.
• data-part="item" ve data-part="shortcut": komutta ve kısayol tuşlarında.
• data-highlighted, data-disabled: Base UI durumları.