Quick Start

Quick Start

1. Install the packages

   pnpm add @tailgrid/react @tailgrid/ai

2. Import and use

   import { TailGrid } from '@tailgrid/react';
   import { createOpenAIProvider } from '@tailgrid/ai';
   import '@tailgrid/react/themes/default.css';
   
   const aiProvider = createOpenAIProvider({
     apiKey: process.env.OPENAI_API_KEY,
   });
   
   function App() {
     return (
       <TailGrid
         data={users}
         columns={columns}
         enableSorting
         enableFiltering
         enablePagination
         enableAI
         aiProvider={aiProvider}
       />
     );
   }

3. Use natural language queries

   • “show active users”
   • “users with role admin”
   • “sort by name descending”

Without AI

<TailGrid
  data={data}
  columns={columns}
  enableSorting
  enableFiltering
  enablePagination
/>