نوار اطلاعیه

import { Banner } from "@kashi-ui/react";

برای پیامی که به کل صفحه یا حساب مربوط است. پیام مربوط به یک بخش یا فرم را با Alert و پیام گذرا را با Toast نشان دهید.

نمونه

<Banner tone="brand" icon={<InfoIcon />} onClose={dismiss}
actions={<Button size="sm" variant="primary">مشاهدهٔ تغییرات</Button>}>
<strong>نسخهٔ ۰٫۱۰ منتشر شد.</strong> هفت کامپوننت تازه…
</Banner>

<Banner tone="warning" icon={<WarningIcon />} actions={<Button size="sm">تمدید اشتراک</Button>}>
<strong>اشتراک شما ۳ روز دیگر تمام می‌شود.</strong> …
</Banner>

برای چسباندن به بالای صفحه، flush را بدهید تا حاشیه و گوشهٔ گرد حذف شود.

دسترس‌پذیری

ناحیهٔ role="region" با نام «اطلاعیه»، تا کاربر صفحه‌خوان بتواند به آن پرش کند. نوار به‌عمد aria-live ندارد، چون هنگام بارگذاری صفحه نمایش داده می‌شود؛ برای پیام‌هایی که بعداً ظاهر می‌شوند از Toast استفاده کنید.