کامپوننتها
گروه دکمه
دکمههای چسبیده به هم برای عملهای مرتبط، مثل «روز / هفته / ماه» یا «قبلی / امروز / بعدی».
import { ButtonGroup, Button } from "@kashi-ui/react";
نمونه
<ButtonGroup aria-label="بازهٔ تقویم">
<Button aria-pressed={view === "day"} onClick={() => setView("day")}>روز</Button>
<Button aria-pressed={view === "week"} onClick={() => setView("week")}>هفته</Button>
<Button aria-pressed={view === "month"} onClick={() => setView("month")}>ماه</Button>
</ButtonGroup>
<ButtonGroup aria-label="پیمایش">
<Button iconOnly aria-label="قبلی">…</Button>
<Button>امروز</Button>
<Button iconOnly aria-label="بعدی">…</Button>
</ButtonGroup>برای انتخاب یک گزینه از چند گزینه، SegmentedControl معمولاً مناسبتر است؛ ButtonGroup برای عملهاست. دکمهٔ روشن با aria-pressed یا aria-current برجسته میشود.
| نام | نوع | پیشفرض | توضیح |
|---|---|---|---|
aria-label | string | — | نام گروه برای صفحهخوان |
children | Button[] | — | دکمهها؛ همهٔ گونهها و اندازههای Button |
دسترسپذیری
ظرف role="group" با نام دارد. هر دکمه جدا در ترتیب Tab است و حلقهٔ فوکوس روی دکمهٔ کناری نمیرود.