feat(table): add TanStack Table prototype with headless table primitive

[invisal]

Summary

This PR introduces a prototype integration of TanStack Table (React Table) into the Kumo component library. It provides a new headless table primitive that enables powerful data table features while maintaining Kumo's design system consistency.

Changes

• New Block: Added `TanstackTable` block component (`packages/kumo-docs-astro/src/components/blocks/TanstackTable.tsx`) with comprehensive table functionality including sorting, filtering, and pagination.
• Demo Updates:
  • Enhanced the existing `TableDemo` with improved examples
  • Added new `TanstackTableDemo` showcasing advanced TanStack Table features
• Documentation: Created new documentation page for the TanStack Table block
• Component Updates: Refactored the core `table` component to work with the new TanStack integration
• Dependencies: Added `@tanstack/react-table` to support the new table primitive

Testing

• Manual testing completed with the new demo examples
• Visual regression tests reviewed

Checklist

• Reviews
  • bonk has reviewed the change
  • automated review not possible because: prototype feature requiring design review
• Tests
  • Tests included/updated
  • Automated tests not possible - manual testing has been completed as follows: verified demos render correctly and table interactions work
  • Additional testing not necessary because: prototype implementation

[pkg-pr-new]

npm i https://pkg.pr.new/@cloudflare/kumo@455

commit: 38776b2

[github-actions]

Docs Preview

View docs preview

Commit: 38776b2

[github-actions]

Visual Regression Report — 19 changed, 19 unchanged

19 screenshot(s) with visual changes:

Button / Variant: Destructive

680 px (0.67%) changed

Before	After	Diff

Button / Icon Only

32 px (0.03%) changed

Before	After	Diff

Button / Loading State

1 px (0%) changed

Before	After	Diff

Button / Title

272 px (0.27%) changed

Before	After	Diff

Dialog / Dialog With Select

298 px (0.29%) changed

Before	After	Diff

Dialog / Dialog With Combobox

130 px (0.13%) changed

Before	After	Diff

Dialog (Open)

0 px (0%) changed

Before	After	Diff

Select / Select Basic

485 px (0.48%) changed

Before	After	Diff

Select / Select Sizes

890 px (0.48%) changed

Before	After	Diff

Select / Select Without Label

160 px (0.16%) changed

Before	After	Diff

Select / Select With Field

852 px (0.72%) changed

Before	After	Diff

Select / Select Placeholder

724 px (0.71%) changed

Before	After	Diff

Select / Select With Tooltip

294 px (0.29%) changed

Before	After	Diff

Select / Select Loading

0 px (0%) changed

Before	After	Diff

Select / Select Complex

720 px (0.61%) changed

Before	After	Diff

Select / Select Disabled Items

176 px (0.17%) changed

Before	After	Diff

Select / Select Grouped With Disabled

673 px (0.66%) changed

Before	After	Diff

Select / Select Long List

1,683 px (1.42%) changed

Before	After	Diff

Select (Open)

538 px (0%) changed

Before	After	Diff

19 screenshot(s) unchanged

• Button / Basic
• Button / Variant: Primary
• Button / Variant: Secondary
• Button / Variant: Ghost
• Button / Variant: Outline
• Button / Variant: Secondary Destructive
• Button / Sizes
• Button / With Icon
• Button / Disabled State
• Button / Link as Button
• Dialog / Dialog With Actions
• Dialog / Dialog Basic
• Dialog / Dialog Alert
• Dialog / Dialog Confirmation
• Dialog / Dialog With Dropdown
• Select / Select Custom Rendering
• Select / Select Multiple
• Select / Select Disabled Options
• Select / Select Grouped

---

Generated by Kumo Visual Regression