# Docs

- Getting Started
  - [Installation](/docs/getting-started/install): Add shadcn-table to a shadcn/ui project
  - [Usage](/docs/getting-started/usage): A brief overview of how to use shadcn-table and create columns and data
  - [AI Agent Setup](/docs/getting-started/agents): Set up shadcn-table with a coding agent
  - [Migrating to v1 (TanStack Table v9)](/docs/getting-started/migrating-v1): What changes when updating shadcn-table from v0.x (TanStack Table v8) to v1 (TanStack Table v9)
- API Reference
  - [API Reference](/docs/api)

  - **Props and Options**
  - [Table Options](/docs/api/table-options): All the table options that can be used in the useShadcnTable hook
  - [Column Options](/docs/api/column-options): All the column options that can be used in Shadcn Table
  - [State Options](/docs/api/state-options): All the state options that can be used in Shadcn Table

  - **Instance APIs**
  - [Table Instance APIs](/docs/api/table-instance-apis): All the table instance methods and objects that can be accessed from the table instance in Shadcn Table
  - [Column Instance APIs](/docs/api/column-instance-apis): All the column instance methods and objects that can be accessed from a column instance in Shadcn Table
  - [Row Instance APIs](/docs/api/row-instance-apis): All the row instance methods and objects that can be accessed from the table instance in Shadcn Table
  - [Cell Instance APIs](/docs/api/cell-instance-apis): All the cell instance methods and objects that can be accessed from a cell in Shadcn Table

  - **Components and Hooks**
  - [ST Components](/docs/api/st-components): All the internal ST components that can be used to build your own custom table components
  - [ST Hooks](/docs/api/st-hooks): All the ST hooks that can be used
- Quick Examples
  - [Examples](/docs/examples): Shadcn Table examples
  - [Basic Example](/docs/examples/basic): A basic example of Shadcn Table which includes sorting, filtering, search, and pagination features by default
  - [Minimal Example](/docs/examples/minimal): A minimal example of Shadcn Table which turns off most of the advanced features
  - [Advanced Example](/docs/examples/advanced): Advanced Shadcn Table Example with pagination, filtering, sorting, selection, detail panels, column ordering, pinning, custom toolbars, and more
  - [Custom Headless Example](/docs/examples/custom-headless): A custom headless example of Shadcn Table which shows how you can use the useShadcnTable hook to build with your own UI components

  - **Data Export Examples**
  - [CSV Export Example](/docs/examples/export-csv): An example of how to export data to CSV using Shadcn Table.
  - [PDF Export Example](/docs/examples/export-pdf): An example of how to export data to PDF using Shadcn Table.

  - **Dragging / Ordering Examples**
  - [Column DnD Ordering Example](/docs/examples/column-ordering): An example of Shadcn Table which shows how to enable column to be re-arranged via drag and drop.
  - [Row DnD Ordering Example](/docs/examples/row-ordering): An example of Shadcn Table which shows how to enable column to be re-arranged via drag and drop.
  - [Row Dragging Example](/docs/examples/row-dragging): An example of Shadcn Table which shows how to drag and drop rows for various use cases.

  - **Editing (CRUD) Examples**
  - [Editing CRUD Example](/docs/examples/editing-crud): An example of Shadcn Table which shows how to use editing CRUD features
  - [Editing CRUD Inline Row Example](/docs/examples/editing-crud-inline-row): An example of Shadcn Table which shows how to use editing CRUD Inline Row features
  - [Editing CRUD Inline Cell Example](/docs/examples/editing-crud-inline-cell): An example of Shadcn Table which shows how to use editing CRUD Inline cell features
  - [Editing CRUD Inline Table Example](/docs/examples/editing-crud-inline-table): An example of Shadcn Table which shows how to use editing CRUD Inline table features
  - [Editing CRUD Tree Example](/docs/examples/editing-crud-tree): An example of Shadcn Table which shows how to use editing CRUD features with expanding sub rows

  - **Expanding / Grouping Examples**
  - [Expanding Tree Example](/docs/examples/expanding-tree): A Shadcn Table example demonstrating expandable sub-rows in a tree structure
  - [Expanding Parsed Tree Example](/docs/examples/expanding-tree-flat-parse): A Shadcn Table example demonstrating expandable sub-rows in a tree structure parsed from a flat list of data
  - [Column Grouping Example](/docs/examples/column-grouping): A Shadcn Table example demonstrating different grouping UI modes.
  - [Customized Grouping Example](/docs/examples/customized-grouping): A Shadcn Table example demonstrating various ways to customize the grouping UI.
  - [Aggregation and Grouping Example](/docs/examples/aggregation-and-grouping): A Shadcn Table example demonstrating aggregation and grouping. See how you can group rows by a column and aggregate the values of other columns.
  - [Detail Panel Example](/docs/examples/detail-panel): A Shadcn Table example show how use use expandable rows to show additional information about a row.
  - [Chart Detail Panel Example](/docs/examples/chart-detail-panel): A Shadcn Table example demonstrating how to use Recharts with the Detail Panel feature.

  - **Filtering Examples**
  - [Filter Variants Example](/docs/examples/filter-variants): An example of Shadcn Table which shows all of the powerful built-in filter variants.
  - [Faceted Values Example](/docs/examples/faceted-values): An example of Shadcn Table which shows how to use faceted values to automatically populate filter suggestions.
  - [Filter Switching Example](/docs/examples/filter-switching): An example of Shadcn Table which shows how to let the user switch between multiple filtering modes.
  - [Popover Filters Example](/docs/examples/popover-filters): An example of Shadcn Table which shows an excel-like column filters.
  - [Custom Filter UI Example](/docs/examples/custom-filter-ui): An example of Shadcn Table which shows custom filter ui in a sidebar.

  - **Sticky Pinning Examples**
  - [Sticky Header Example](/docs/examples/sticky-header): An example of Shadcn Table which shows how to make the header and footer sticky while scrolling.
  - [Column Pinning Example](/docs/examples/column-pinning): An example of Shadcn Table which shows how to make the header and footer sticky while scrolling.
  - [Sticky Row Pinning Example](/docs/examples/sticky-row-pinning): An example of Shadcn Table which shows how to pin individual rows and have them be sticky and stay in view while scrolling.
  - [Static Row Pinning Example](/docs/examples/static-row-pinning): An example of Shadcn Table which shows how to pin individual rows to the top or bottom of the table to keep them in view while scrolling.
  - [Sticky Row Selection Example](/docs/examples/sticky-row-selection): An example of Shadcn Table which shows how to pin individual rows as they get selected and have them be sticky and stay in view while scrolling.

  - **Remote Data Fetching Examples**
  - [React Query Example](/docs/examples/react-query): An example of Shadcn Table which shows how to fetch remote data and filter and paginate on a remote server with react-query
  - [Remote Data Fetching Example](/docs/examples/remote): An example of Shadcn Table which shows how to fetch remote data and filter and paginate on a remote server
  - [Dynamic Columns Example](/docs/examples/dynamic-columns): An example of Shadcn Table which shows how to fetch remote data and generate columns dynamically
  - [Lazy Detail Panel Example](/docs/examples/lazy-detail-panel): A Shadcn Table example show how use use expandable rows to show additional information about a row and load the data for the detail panel only after the user expands the row.
  - [Lazy Sub-Rows Example](/docs/examples/lazy-sub-rows): A Shadcn Table example show how use use expandable rows to fetch additional sub-rows data only after the user expands the row.

  - **Virtualized Examples**
  - [Virtualized Example](/docs/examples/virtualized): An example of a Shadcn Table with virtualization enabled to achieve higher performance when rendering large data sets
  - [Row Virtualization Example](/docs/examples/row-virtualization): An example of a Shadcn Table with row virtualization enabled to achieve higher performance when rendering large data sets
  - [Column Virtualization Example](/docs/examples/column-virtualization): An example of a Shadcn Table with column virtualization enabled to achieve higher performance when rendering large data sets
  - [Infinite Scrolling Example](/docs/examples/infinite-scrolling): An example of Shadcn Table which shows how to implement an infinite scrolling table that fetches data from a remote server as the user scrolls down the table with the useInfiniteQuery hook from react-query
- Guides
  - [Guides](/docs/guides): Shadcn Table Guides and Tutorials

  - **Fundamentals**
  - [Building Production-Ready Tables](/docs/guides/production-ready-tables): Fetch data with React Query, translate table state with a custom hook, and wire it into a manual-state table.
  - [Best Practices (TypeScript)](/docs/guides/best-practices): The Best Practices to follow with TypeScript when using Shadcn Table.
  - [Data (Accessor) Columns](/docs/guides/data-columns): How to create data columns in Shadcn Table and use accessKeys and accessorFns the right way
  - [Display (Built-in) Columns](/docs/guides/display-columns): How to create or edit display columns in Shadcn Table
  - [Table Event Listeners Guide](/docs/guides/table-event-listeners): How to add event listeners such as onClicks and onChange events to components in Shadcn Table
  - [Memoization Guide](/docs/guides/memoization): How and what to memoize to improve performance in Shadcn Table.
  - [State Management Guide](/docs/guides/state-management): How to access and manage internal state in Shadcn Table
  - [Accessibility / Keyboard Navigation Guide](/docs/guides/accessibility): How to use and customize the accessibility and keyboard navigation features of Shadcn Table

  - **Customization Guides**
  - [Customize (Style) Components Guide](/docs/guides/customize-components): How to customize and pass props to shadcn/ui components and set up a shadcn/ui Theme in Shadcn Table
  - [Custom Icons Guide](/docs/guides/customize-icons): How to use custom icons such as from Font Awesome in Shadcn Table
  - [Localization/i18n Guide](/docs/guides/localization): How to customize localization and translations (i18n) in Shadcn Table
  - [Toolbar Customization Guide](/docs/guides/toolbar-customization): How to customize the Toolbars, add buttons to toolbars, or customize progress bars and alert banners in Shadcn Table

  - **Size / Width Guides**
  - [Column Size Guide](/docs/guides/column-size): How to column width in Shadcn Table
  - [Column Resizing Guide](/docs/guides/column-resizing): How to use and customize the column resizing features of Shadcn Table
  - [Density Toggle Guide](/docs/guides/density-toggle): How to use, customize, or disable the density toggle button feature of Shadcn Table
  - [Full Screen Toggle Guide](/docs/guides/full-screen-toggle): How to use, customize, or disable the full screen toggle button feature of Shadcn Table

  - **Big Data Guides**
  - [Async Loading UI Guide](/docs/guides/async-loading): How to show loading indicators, skeletons, and progress bars in Shadcn Table
  - [Pagination Guide](/docs/guides/pagination): How to use, customize, or disable pagination features in Shadcn Table
  - [Virtualization Guide](/docs/guides/virtualization): How to virtualize rows and columns in Shadcn Table to improve performance and user experience when there are a lot of rows or a lot of columns in the table.

  - **Data Mutation Guides**
  - [Row Selection Guide](/docs/guides/row-selection): How to add and customize row selection checkboxes in Shadcn Table
  - [Editing Guide](/docs/guides/editing): How to enable data editing features in Shadcn Table

  - **Filtering / Hiding Guides**
  - [Column Filtering Guide](/docs/guides/column-filtering): How to use, customize, or disable filter features, client-side or server side, in Shadcn Table
  - [Global Filtering/Search Guide](/docs/guides/global-filtering): How to use, customize, or disable the global filter and search features in Shadcn Table
  - [Column Hiding Guide](/docs/guides/column-hiding): How to use, customize, or disable column hiding and visibility features of Shadcn Table

  - **Grouping / Expanding Guides**
  - [Detail Panel Expanding Guide](/docs/guides/detail-panel): How to add expanding detail panels to each row in Shadcn Table
  - [Expanding Sub-Rows/Tree Data Guide](/docs/guides/expanding-sub-rows): How to add expanding sub-rows or tree data features in Shadcn Table
  - [Column Grouping Guide](/docs/guides/column-grouping): How to use and customize the column grouping features of Shadcn Table
  - [Aggregation Guide](/docs/guides/aggregation): How to use and customize the aggregation and grouping features of Shadcn Table

  - **Sticky Pinning / Freezing Guides**
  - [Sticky Header/Footer Guide](/docs/guides/sticky-header): How to use and customize the sticky header feature in Shadcn Table
  - [Column Pinning Guide](/docs/guides/column-pinning): How to use and customize the column pinning features of Shadcn Table
  - [Row Pinning Guide](/docs/guides/row-pinning): How to add and customize row selection checkboxes in Shadcn Table

  - **Sort / Order / DnD Guides**
  - [Sorting Guide](/docs/guides/sorting): How to use, customize, or disable sorting features in Shadcn Table
  - [Row Ordering/DnD Guide](/docs/guides/row-ordering-dnd): How to use and customize the row drag and drop and row ordering features of Shadcn Table
  - [Column Ordering/DnD Guide](/docs/guides/column-ordering-dnd): How to use and customize the column ordering and drag and drop features of Shadcn Table
  - [Row Numbers Guide](/docs/guides/row-numbers): How to use and customize automatic row numbers in Shadcn Table

  - **Action Button / Menu Guides**
  - [Column Actions Guide](/docs/guides/column-actions): How to use, customize, or disable column the action button and menu features of Shadcn Table
  - [Cell Actions Guide](/docs/guides/cell-actions): How to add cell action context menus to each cell in Shadcn Table
  - [Row Actions Guide](/docs/guides/row-actions): How to add row action buttons to each row in Shadcn Table
  - [Click to Copy Guide](/docs/guides/click-to-copy): How to use and customize the click to copy features of Shadcn Table