@choice-ui/table-core

A high-performance, extensible React table library built on TanStack Table.

Installation

pnpm add @choice-ui/table-core

Features

• Built on TanStack Table core
• Reactive state management (Legend State)
• Drag and drop sorting (dnd-kit)
• Cell selection and range fill
• Column pinning
• Row grouping and expansion
• Column resizing
• Undo/Redo support
• Virtual scrolling optimization

Basic Usage

import { TableCore, TableProvider } from "@choice-ui/table-core";

const columns = [
  { accessorKey: "name", header: "Name" },
  { accessorKey: "email", header: "Email" },
];

const data = [
  { name: "John", email: "[email protected]" },
  { name: "Jane", email: "[email protected]" },
];

function App() {
  return (
    <TableCore
      data={data}
      columns={columns}
      width={800}
      height={400}
    />
  );
}

Exports

Components

• TableCore - Main table component
• TableProvider - Table context provider
• TablePane - Table pane
• TableScroll - Scroll container
• TableHeader - Table header
• TableBody - Table body
• TableRow - Table row
• TableCell - Table cell
• TableFooter - Table footer
• FillHandle - Fill handle for cell range operations

Hooks

• useTable - Get table instance
• useReactTable - Create table instance
• useCell - Cell state
• useHeader - Header state
• useCellEditing - Cell editing
• useUpdateCell - Update cell value
• useRenderCell - Render cell content
• usePosition - Position calculation
• useCellHover - Cell hover state
• useRowHover - Row hover state
• useColumnHover - Column hover state

Features

• PropsFeature - Props extension
• dndFeature - Drag and drop functionality
• agentFeature - Agent functionality

Types

import type {
  RowData,
  ColumnDef,
  Row,
  Column,
  Header,
  Cell,
  TableOptions,
  PaginationState,
  TableState,
  TableServerState,
  TableCoreProps,
  TableInstance,
} from "@choice-ui/table-core";

License

MIT