Installation

Il vous faut un projet avec shadcn/ui configuré. Si vous partez de zéro :

npx shadcn@latest init

1. Ajoutez le registry

Ajoutez goodui au champ registries de components.json :

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

2. Installez des blocs

npx shadcn@latest add @goodui/resource-timeline

Le CLI installe le bloc, les composants shadcn qu’il utilise et les packages npm nécessaires. Vous pouvez aussi chercher dans le registry depuis le terminal :

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

Sans modifier components.json

Chaque bloc gratuit s’installe aussi depuis son URL complète :

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

Utiliser un bloc

import ResourceTimeline from "@/components/goodui/resource-timeline"

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

Les blocs sont des composants client avec leurs données de démo en haut du fichier. Remplacez-les par les vôtres.