TableCraft

🚀 Drizzle table query builder engine + Shadcn + Airtable = Complex table setup in 5 minutes instead of 1 hour.

🎉 Explore the Demo | 📚 Explore the Docs

---

✨ Quick Example

Backend (Hono)

import { Hono } from "hono";
import { createHonoApp } from "@tablecraft/adapter-hono";
import { defineTable } from "@tablecraft/engine";
import { db } from "./db";
import * as schema from "./db/schema";

const users = defineTable(schema.users).hide("password").search("email", "name").sort("-createdAt");

const app = createHonoApp({
  db,
  schema,
  configs: { users },
});

new Hono().route("/api/engine", app);

Frontend (React)

import { DataTable, createTableCraftAdapter } from "@tablecraft/table";

const adapter = createTableCraftAdapter({
  baseUrl: "/api/engine",
  table: "users",
});

export function UsersPage() {
  return <DataTable adapter={adapter} />;
}

Tailwind CSS v4: Import the package styles and add the @source directive so Tailwind detects the utility classes:

@import "tailwindcss";
@import "@tablecraft/table/styles.css";
@source "../node_modules/@tablecraft/table/src";

The @source path is relative to your CSS file — adjust based on how deep your CSS file is from the project root's node_modules/. See the @tablecraft/table README for a full path reference table.

That's it! 🎉 No column definitions needed.

---

🔥 Features

Feature	Description
🏗️ Auto Columns	Columns generated from your Drizzle schema automatically
🔍 Global Search	Full-text search across all columns with operator support
📅 Date Filters	Smart date range picker (auto-detects date columns)
📤 Export	CSV & Excel export with selected/all rows
📊 Sorting	Multi-column sorting with URL sync
📑 Pagination	Cursor or offset-based pagination
🎨 Column Resizing	Drag-to-resize columns with persistence
👁️ Column Visibility	Show/hide columns with URL state sync
🔗 URL State Sync	Search, filters, sort, page stored in URL for shareable links
⌨️ Keyboard Navigation	Full keyboard accessibility
🔐 Role-based Visibility	Control column visibility by user role
🗑️ Soft Delete Support	Built-in soft delete filtering

Plus: Caching plugin, multiple backend adapters (Hono, Express, Next.js, SvelteKit, Elysia), computed columns, relationships & joins, type generation, OpenAPI spec, and more...

📚 Explore all features in the docs →

---

📦 Packages

Package	Description
@tablecraft/engine	Backend query engine for Drizzle ORM
@tablecraft/table	React data table component (TanStack Table + Shadcn)
@tablecraft/codegen	Generate types & adapters from schema
@tablecraft/client	Client utilities for API communication
@tablecraft/adapter-hono	Hono server adapter
@tablecraft/adapter-next	Next.js server adapter
@tablecraft/adapter-sveltekit	SvelteKit server adapter
@tablecraft/adapter-express	Express server adapter
@tablecraft/adapter-elysia	Elysia server adapter
@tablecraft/plugin-cache	Caching plugin

---

📚 Documentation

For full guides, API reference, and examples:

👉 jacksonkasi.gitbook.io/tablecraft

---

🌟 Related Projects

• tnks-data-table: An example application exploring the capabilities of TableCraft's data table component.

---

📄 License

MIT