InlineNotice — اعلان درون‌جریان

InlineNoticeکپی کد پیام ایستایی است که در جای خودش در صفحه یا فرم می‌ماند، با آیکون و متن. برای تعارض ویرایش (۴۰۹)، خطای ذخیره و خطای کلی فرم.

تفاوت با Toast

Toast تنها هشدار شناور سیستم است و از داک (dockAlertکپی کد) می‌گذرد. InlineNoticeکپی کد هشدار نیست و مثل یک پاراگراف در جریان صفحه می‌ماند. برای InlineNoticeکپی کد هرگز از dockAlertکپی کد استفاده نکنید.

• کاربرد: پیامی که باید تا رفع مشکل در همان محل بماند و کنش بازیابی کنارش لازم است.
• نه: پیام گذرا (Toast)، خطای یک فیلد (زیر همان فیلد نشان دهید)، تأیید کنش مخرب (AlertDialog).

وضعیت: beta · لایه: ۳ (@tokapps/tukکپی کد) · کد: packages/tuk/src/feedback/inline-notice/کپی کد

import { InlineNotice } from '@tokapps/tuk';

نمونهٔ زنده

کد قابل کپی

موفقیت و اطلاع

import { InlineNotice } from '@tokapps/tuk';<InlineNotice tone="info" title="پیش‌نویس خودکار ذخیره می‌شود" description="تغییرات هر چند ثانیه یک‌بار نگه‌داری می‌شوند." /><InlineNotice tone="success" description="تغییرات با موفقیت ذخیره شد." />

تعارض ویرایش با کنش

import { Button, InlineNotice } from '@tokapps/tuk';<InlineNotice  tone="warning"  title="این ایده هم‌زمان ویرایش شده است"  description="کاربر دیگری پس از شما آن را تغییر داد. نسخهٔ او را بارگذاری کنید یا تغییرات خود را نگه دارید."  action={<Button size="sm" variant="secondary">بارگذاری نسخهٔ جدید</Button>}/>

خطای ذخیره با دکمهٔ بستن

<InlineNotice  tone="danger"  title="ذخیره نشد"  description="ارتباط با سرور برقرار نشد."  action={<Button size="sm" variant="secondary">تلاش دوباره</Button>}  dismissible/>

فشرده

<InlineNotice tone="danger" density="compact" description="نام کاربری از پیش وجود دارد." />

Props

دسترس‌پذیری

infoکپی کد و successکپی کد با role="status"کپی کد، و warningکپی کد و dangerکپی کد با role="alert"کپی کد اعلام می‌شوند. برچسب وضعیت پیش از متن خوانده می‌شود و آیکون aria-hiddenکپی کد است. برای اعلان، پیام باید پس از رندر اولیه وارد DOM شود.