Prérequis
Un projet déjà configuré avec Shadcn UI Un components.json avec l'alias ui configuré (recommandé : "ui": "@/components/ui") Un client TanStack Query partagé unique exposé via QueryClientProvider
Guide
Installez YaYaw Table, la table de donnees React open source pour Shadcn UI et TanStack Table, via la registry Shadcn
Un projet déjà configuré avec Shadcn UI Un components.json avec l'alias ui configuré (recommandé : "ui": "@/components/ui") Un client TanStack Query partagé unique exposé via QueryClientProvider
Depuis la racine de votre projet : Pour cibler une version précise, utilisez un snapshot de release : Si votre projet a le namespace registry YaYaw configuré (@yayaw), vous pouvez aussi lancer : Avec la CLI shadcn v4, l...
Pour les nouveaux projets qui veulent une base Shadcn prête pour YaYaw, installez l'item optionnel : Cet item configure base-vega, lucide, TypeScript, les React Server Components, la couleur de base neutral, le namespac...
Ce que cette page couvre
La source MDX originale est condensee en cartes CMS natives pour edition et republication depuis le control plane.
Un projet déjà configuré avec Shadcn UI Un components.json avec l'alias ui configuré (recommandé : "ui": "@/components/ui") Un client TanStack Query partagé unique exposé via QueryClientProvider
Depuis la racine de votre projet : Pour cibler une version précise, utilisez un snapshot de release : Si votre projet a le namespace registry YaYaw configuré (@yayaw), vous pouvez aussi lancer : Avec la CLI shadcn v4, l...
Pour les nouveaux projets qui veulent une base Shadcn prête pour YaYaw, installez l'item optionnel : Cet item configure base-vega, lucide, TypeScript, les React Server Components, la couleur de base neutral, le namespac...
La CLI shadcn v4 permet d'inspecter le payload registry avant d'écrire des fichiers : Vous pouvez aussi inspecter ou découvrir les items de registry : Pour capturer le contexte du projet local pendant le debug ou les wo...
Importez depuis votre code local copié : const queryClient = new QueryClient(); export const MyTable = () = ( tableType="products"
YaYaw Table ne crée plus automatiquement de QueryClient interne. Vous devez maintenant fournir exactement un client partagé : soit via votre QueryClientProvider au niveau app, soit via la prop queryClient (la même insta...
Notes d'implementation
Configuration pas à pas avec un exemple concret Next.js
$ const queryClient = new QueryClient();
$ export const MyTable = () => (
$ <QueryClientProvider client={queryClient}>
$ <DataTable
$ tableType="products"