DataTable Date Filter

1"use client"
2 
3/**
4 * niko-table — created by Semir N. (Semkoo, https://github.com/Semkoo) with AI assistance.
5 *
6 * Before reporting anything: please check the changelog first.
7 *  - In-repo: ./CHANGELOG.md
8 *  - Docs site: https://niko-table.com/changelog
9 *
10 * Found a bug or have a fix? Open an issue or PR on GitHub so other
11 * users (and future LLMs reading this code) benefit:
12 * https://github.com/Semkoo/niko-table-registry
13 */
14import { useDataTable } from "../core/data-table-context"
15import type { TableDateFilterProps } from "../filters/table-date-filter"
16import { TableDateFilter } from "../filters/table-date-filter"
17import { useDerivedColumnTitle } from "../hooks/use-derived-column-title"
18import { FILTER_VARIANTS } from "../lib/constants"
19 
20type DataTableDateFilterProps<TData> = Omit<
21  TableDateFilterProps<TData>,
22  "column" | "title"
23> & {
24  /**
25   * The accessor key of the column to filter (matches column definition)
26   */
27  accessorKey: keyof TData & string
28  /**
29   * Optional title override (if not provided, will use column.meta.label)
30   */
31  title?: string
32}
33 
34/**
35 * A date filter component that automatically connects to the DataTable context
36 * and derives the title from column metadata.
37 *
38 * @example - Auto-detect everything from column metadata
39 * const columns: DataTableColumnDef[] = [{ accessorKey: "releaseDate",..., meta: { label: "Release Date" } },...]
40 * <DataTableDateFilter accessorKey="releaseDate" />
41 *
42 * @example - Date range filter
43 * <DataTableDateFilter
44 *   accessorKey="releaseDate"
45 *   multiple
46 * />
47 *
48 * @example - Custom title
49 * <DataTableDateFilter
50 *   accessorKey="createdAt"
51 *   title="Created Date"
52 * />
53 *
54 * @example - Single date selection
55 * <DataTableDateFilter
56 *   accessorKey="dueDate"
57 *   title="Due Date"
58 *   multiple={false}
59 * />
60 */
61 
62export function DataTableDateFilter<TData>({
63  accessorKey,
64  title,
65  multiple,
66  trigger,
67  ...props
68}: DataTableDateFilterProps<TData>) {
69  const { table } = useDataTable<TData>()
70  const column = table.getColumn(String(accessorKey))
71 
72  const derivedTitle = useDerivedColumnTitle(column, String(accessorKey), title)
73 
74  // Auto-set variant in column meta if not already set
75  // This allows the auto-filterFn to be applied based on variant
76  // Runs synchronously during render (not in an effect) so the variant is set
77  // before TableDateFilter receives the column — avoids a deferred render cycle.
78  if (column && !column.columnDef.meta?.variant) {
79// … truncated