Tree View
FREEAçılır klasörlü, seçimli, kılavuz çizgili ve tam klavye destekli dosya ağacı.
Kurulum
Terminal
npx @bloxa/cli add tree-view
# or: npx shadcn@latest add @bloxa/tree-viewÖrnekler
Proje dosyaları
Klavye: oklar, Home/End, Enter, * ile kardeşleri aç.
- app
- layout.tsx2 kB
- page.tsx6 kB
- docs
- page.tsx3 kB
- components
- ui
- button.tsx
- chart.tsx
- dialog.tsx
- site-header.tsx
- package.json1 kB
- .env
API
Her bileşen, oluşturduğu HTML elemanının özelliklerini de kabul eder.
TreeView
| Özellik | Tip | Varsayılan | Açıklama |
|---|---|---|---|
| data | { id, label, icon?, meta?, children?, disabled? }[] | — | Düğümler. |
| selected / onSelect | string / (node) => void | — | Seçili düğüm. |
| expanded / defaultExpanded / onExpandedChange | string[] | — | Açık klasörler. |
| guides | boolean | true | Kılavuz çizgileri. |
| folderIcon / fileIcon | (open) => ReactNode / ReactNode | — | Varsayılan ikonlar. |