Bileşenler
Pagination
Bir listenin ya da tablonun sayfaları arasında geçiş yapar. İlk ve son sayfayı, geçerli sayfanın yanındakileri ve aradaki boşluk için üç nokta gösterir.
Playground
Figma varyantı
Pagination
.Pagination Item › 🕹 State=Current (2)Durumlar
Bir sayfa öğesi Default, Hover ya da Current olur; Current birincil renktir. Önceki ve Sonraki küçük ghost ikon butonlardır; ilk ve son sayfada devre dışı kalır.
Tokenlar
| Part | Token |
|---|---|
| Item | --space-xxlarge (size), --radius-form-element-small, --text-ui-text-small-bold |
| Default | --color-foreground-medium-emphasis |
| Hover | --color-surface-level-2, --color-foreground-high-emphasis |
| Current | --color-primary, --color-on-primary |
| Gap | --layout-micro |
Figma’dan koda
| Figma | React |
|---|---|
| .Pagination Item › 🕹 State = Current | page={…} |
| .Pagination Item › 🕹 State = Hover | :hover |
| Previous / Next | previousLabel / nextLabel |