インストール

shadcn/uiをセットアップ済みのプロジェクトが必要です。ゼロから始める場合：

npx shadcn@latest init

1. レジストリを追加

components.jsonのregistriesフィールドにgooduiを追加します：

components.json

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

npx shadcn@latest add @goodui/resource-timeline

CLIがブロック、それが使うshadcnコンポーネント、必要なnpmパッケージをインストールします。ターミナルからレジストリを検索することもできます：

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

無料ブロックはすべて、完全なURLからもインストールできます：

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 />
}

ブロックはクライアントコンポーネントで、ファイルの先頭にデモデータがあります。そのデータをあなたのものに差し替えてください。