نقطة الحالة

تجريبي

نقطة ملونة مع تسمية لحالة حساب أو بطاقة أو دفعة أو خدمة.

المعاينة

«معكوس» هو المحتوى الإنجليزي نفسه من اليمين إلى اليسار، ليفصل خطأ الاتجاه عن خطأ الترجمة.

أضف المكوّن
$ npx ritla add status-dot
ويعمل أيضًا مع shadcn: npx shadcn@latest add @ritla/status-dot
أو انسخه يدويًا
التثبيت اليدوي ينسخ مصدر المكوّن إلى مشروعك. المصدر يأتي مع ترخيص Ritla UI، وأداة سطر الأوامر هي الطريق الأقصر إلى الملفات نفسها.

status-dot.tsx

import { StatusDot } from "@/components/ui/status-dot";<StatusDot status="success">Active</StatusDot>

الخاصية	النوع	الافتراضي	الوصف
`status`	`"success" \| "warning" \| "danger" \| "info" \| "neutral"`	لا يوجد	خاصية Status.
`children`	`ReactNode`	لا يوجد	خاصية Label.
`label`	`string`	لا يوجد	اسم النقطة حين تُخفى التسمية.