docs: add docs for virtualized datatable

Author: rsbh

apps/www/src/content/docs/components/datatable/index.mdx

@@ -44,6 +44,48 @@ import {
 
 <auto-type-table path="./props.ts" name="DataTableContentProps" />
 
+## DataTable.VirtualizedContent Props
+
+<auto-type-table path="./props.ts" name="VirtualizedContentProps" />
+
+### Virtualized Content
+
+For large datasets, use `DataTable.VirtualizedContent` for better performance. Parent container must have a fixed height.
+
+```tsx
+<div style={{ height: 400 }}>
+  <DataTable
+    data={data}
+    columns={columns}
+    defaultSort={{ name: "name", order: "asc" }}>
+    <DataTable.Toolbar />
+    <DataTable.VirtualizedContent rowHeight={44} />
+  </DataTable>
+</div>
+```
+
+#### Fixed Width Columns
+
+By default, columns share equal width. For fixed width columns, use `flex: 'none'` with `width`:
+
+```tsx
+const columns = [
+  {
+    accessorKey: "select",
+    header: "",
+    styles: {
+      header: { width: 50, flex: "none" },
+      cell: { width: 50, flex: "none" }
+    }
+  },
+  {
+    accessorKey: "name",
+    header: "Name"
+    // Uses flex: 1 1 0 by default (equal width)
+  }
+];
+```
+
 ## Examples
 
 ### Basic Usage

apps/www/src/content/docs/components/datatable/props.ts

@@ -118,3 +118,49 @@ export interface DataTableContentProps {
     row?: string;
   };
 }
+
+export interface VirtualizedContentProps {
+  /**
+   * Height of the virtualized container.
+   * Parent must have a fixed height for percentage values to work.
+   * @defaultValue "100%"
+   */
+  height?: number | string;
+
+  /**
+   * Height of each row in pixels.
+   * @defaultValue 40
+   */
+  rowHeight?: number;
+
+  /**
+   * Height of group header rows in pixels.
+   * Falls back to rowHeight if not specified.
+   */
+  groupHeaderHeight?: number;
+
+  /**
+   * Number of rows to render outside the visible area.
+   * @defaultValue 5
+   */
+  overscan?: number;
+
+  /**
+   * Custom empty state shown when no results match after filters/search.
+   */
+  emptyState?: React.ReactNode;
+
+  /**
+   * Custom zero state shown when no data exists initially.
+   */
+  zeroState?: React.ReactNode;
+
+  /** Custom class names for styling */
+  classNames?: {
+    root?: string;
+    table?: string;
+    header?: string;
+    body?: string;
+    row?: string;
+  };
+}