وسم الحالة
StatusTagحبة حالة في React بنقطة ملونة وتسمية لحالات الطلبات والإجراءات: نجاح وتحذير وخطأ ومعلومة ومحايد، بأنماط معبأة أو خفيفة.
يجمع StatusTag نقطة ملونة مع تسمية قصيرة. حدد tone للمعنى وstatus للتعبئة. استخدم Tag للفئات بدلاً منه.
متى تستخدمه
استخدم StatusTag حيثما كان للسجل حالة: "قيد المراجعة"، "معتمد"، "مرفوض"، و"مدفوع". اختر tone بحسب المعنى، وثبّت الصياغة عبر الشاشات ليتعلم المستخدم المفردات.
استخدم Tag للفئات التي ليست حالات.
أمثلة
الخصائص
الخصائص التي يعرفها StatusTag. سمات العنصر الأصلي تمر كما هي.
| الخاصية | النوع | الافتراضي | الوصف |
|---|---|---|---|
tone | "error" | "neutral" | "success" | "warning" | "info" | ||
status | "ghost" | "subtle" | "inverted" | ||
size | "sm" | "md" | "lg" |
إمكانية الوصول
يحمل النص الحالة. النقطة الملونة زخرفية وتحمل aria-hidden، لذا لا يعتمد المعنى على اللون وحده.
تحقق الدرجات متطلبات التباين في التعبئتين وفي الوضعين الفاتح والداكن. أبق التسميات قصيرة ومتطابقة في كل جدول وبطاقة تعرض الحالة نفسها.