الإشعار المنبثق
يعرض الإشعار المنبثق رسائل ملاحظات سياقية لأنواع النجاح والخطأ والتحذير والتنبيه والإدخال.
Loading demo: notification-popup-real-world
التثبيت
npx sdaia-ui@latest add notification-popup
الاستخدام
import { NotificationPopup } from "@/components/ui/notification-popup"<NotificationPopup type="success" />الأمثلة
التنبيه
إشعار منبثق للتنبيهات العامة التي تتطلب انتباه المستخدم.
Loading demo: notification-popup-alert
تحذير
إشعار منبثق يُشير إلى مشكلة محتملة أو يستدعي الحذر.
Loading demo: notification-popup-warning
خطأ
إشعار منبثق للأخطاء والعمليات الفاشلة.
Loading demo: notification-popup-error
نجاح
إشعار منبثق يؤكّد إجراءً ناجحاً.
Loading demo: notification-popup-success
إدخال
إشعار منبثق يطلب إدخالاً من المستخدم.
Loading demo: notification-popup-input
مرجع الواجهة البرمجية
NotificationPopupProps
خصائص مكوّن NotificationPopup.
Prop | Type | Default | Required |
|---|---|---|---|
type | 'success' | 'error' | 'warning' | 'alert' | 'input' | 'success' | optional |
title | ReactNode | - | required |
description | ReactNode | - | optional |
icon | ReactNode | - | optional |
actions | ReactNode | - | optional |
children | ReactNode | - | optional |
footer | ReactNode | - | optional |
dir | 'ltr' | 'rtl' | - | optional |
rtl | boolean | false (deprecated) | optional |
actionsLayout | "single" | "pair" | "stacked" | — | optional |