Bileşenler

EmptyState

Bir sayfa, panel ya da liste henüz boşken ya da arama sonuç vermediğinde gösterilen açıklama ve sonraki adım.

Durumlar

EmptyState’in etkileşim durumu yoktur; iki boyutu vardır.

Boyut	İkon alanı	Başlık	Açıklama	Kullanım
`md`	64 px	`heading-sm`	`body-md`	Sayfa, geniş panel
`sm`	40 px	`heading-sm`	`body-sm`	Kart, tablo, menü

Özellik	Değer	Token
Metin genişliği	En fazla 440 px	`empty-state-text-width`
İkon alanı	64 / 40 px	`empty-state-media-md`, `empty-state-media-sm`
İç boşluk	`md` her yönde 24 px; `sm` 16 px dikey, 12 px yatay	`space-3xl`, `space-xl`, `space-lg`
Parçalar arası (`md` / `sm`)	16 / 8 px	`space-xl`, `space-md`
Başlık ile açıklama arası	8 px	`space-md`
Eylemler arası	10 px	`empty-state-actions-gap`

Değerler seçili markaya göre gösterilir; markayı üst çubuktan değiştirebilirsiniz.

Token	Açık mod	Koyu mod
`--bigbang-empty-state-text-width`	`440px440px440px`	`440px440px440px`
`--bigbang-empty-state-media-sm`	`40px40px40px`	`40px40px40px`
`--bigbang-empty-state-media-md`	`64px64px64px`	`64px64px64px`
`--bigbang-empty-state-actions-gap`	`10px10px10px`	`10px10px10px`
`--bigbang-color-surface-sunken`	`#f5f5f5#f5f5f5#f5f5f5`	`#171717#171717#171717`
`--bigbang-color-icon-subtle`	`#737373#737373#737373`	`#a1a1a1#a1a1a1#a1a1a1`
`--bigbang-color-text-subtle`	`#404040#404040#404040`	`#d4d4d4#d4d4d4#d4d4d4`
`--bigbang-motion-skeleton-reveal-duration`	`0.11s0.11s0.11s`	`0.11s0.11s0.11s`

Etkileşim	Özellik	Süre token’ı	Easing token’ı	Hareketi azaltma
Belirme (`motion.reveal`)	`opacity`	`motion-skeleton-reveal-duration`	`easing-productive-enter`	Kısa sürer.

Değerler için Hareket sayfasına bakın.