Table

1'use client'
2 
3import { Button } from '@/components/ui/button'
4import { Input } from '@/components/ui/input'
5import {
6  Popover,
7  PopoverContent,
8  PopoverTrigger
9} from '@/components/ui/popover'
10import {
11  Select,
12  SelectContent,
13  SelectItem,
14  SelectTrigger,
15  SelectValue
16} from '@/components/ui/select'
17import { cn } from '@/lib/utils'
18import { demoTableColumns, demoTableRows } from './demo/list'
19import {
20  ArrowDownAZ,
21  ArrowUpAZ,
22  Check,
23  ChevronDown,
24  ChevronLeft,
25  ChevronRight,
26  ChevronUp,
27  Copy,
28  Download,
29  Maximize2,
30  Minus,
31  RefreshCw,
32  Search,
33  Share2,
34  Trash2,
35  Type
36} from 'lucide-react'
37import { useCallback, useMemo, useState } from 'react'
38 
39// Filter types
40interface FilterCondition {
41  id: string
42  field: string
43  operator:
44    | 'contains'
45    | 'equals'
46    | 'startsWith'
47    | 'endsWith'
48    | 'isEmpty'
49    | 'isNotEmpty'
50  value: string
51}
52 
53/**
54 * Configuration for a table column.
55 * @interface TableColumn
56 * @template T - The row data type
57 * @property {string} header - Column header text
58 * @property {keyof T | string} accessor - Key to access row data or dot-notation path
59 * @property {boolean} [sortable] - Whether the column is sortable
60 * @property {string} [width] - CSS width value for the column
61 * @property {"left" | "center" | "right"} [align] - Text alignment
62 * @property {function} [render] - Custom render function for cell content
63 */
64export interface TableColumn<T = Record<string, unknown>> {
65  header?: string
66  accessor?: keyof T | string
67  sortable?: boolean
68  width?: string
69  align?: 'left' | 'center' | 'right'
70  render?: (value: unknown, row: T, index: number) => React.ReactNode
71}
72 
73/**
74 * ═══════════════════════════════════════════════════════════════════════════
75 * TableProps
76 * ═══════════════════════════════════════════════════════════════════════════
77 *
78 * Props for configuring a data table component with sorting, selection,
79 * pagination, and filtering capabilities.
80 *
81 * @template T - The row data type
82 */
83export interface TableProps<T = Record<string, unknown>> {
84  data?: {
85    /** Column definitions specifying headers, accessors, and rendering. */
86    columns?: TableColumn<T>[]
87// … truncated