التثبيت

تحتاج إلى مشروع مُعدّ فيه shadcn/ui. إن كنت تبدأ من الصفر:

npx shadcn@latest init

1. أضف السجل

أضف goodui إلى حقل registries في components.json:

components.json
{
  "registries": {
    "@goodui": "https://goodui.dev/r/{name}.json"
  }
}

2. ثبّت الكتل

npx shadcn@latest add @goodui/resource-timeline

يثبّت CLI الكتلة ومكونات shadcn التي تستخدمها وأي حزم npm. يمكنك أيضًا البحث في السجل من الطرفية:

npx shadcn@latest search @goodui
npx shadcn@latest view @goodui/kpi-cards

بدون تعديل components.json

كل كتلة مجانية تُثبَّت أيضًا من رابطها الكامل:

npx shadcn@latest add https://goodui.dev/r/resource-timeline.json

استخدم كتلة

app/schedule/page.tsx
import ResourceTimeline from "@/components/goodui/resource-timeline"

export default function Page() {
  return <ResourceTimeline />
}

الكتل مكونات عميل وبياناتها التجريبية في أعلى الملف. استبدل تلك البيانات ببياناتك.