@raystack/apsara 0.55.0-rc.1 → 0.55.0

package/dist/components/data-table/components/search.js.map

@@ -1 +1 @@
-{"version":3,"file":"search.js","sources":["../../../../components/data-table/components/search.tsx"],"sourcesContent":["'use client';\n\nimport { forwardRef } from 'react';\nimport { Search } from '../../search';\nimport { SearchProps } from '../../search/search';\nimport { useDataTable } from '../hooks/useDataTable';\n\nexport const TableSearch = forwardRef<HTMLInputElement, SearchProps>(\n  ({ ...props }, ref) => {\n    const { updateTableQuery, tableQuery } = useDataTable();\n\n    const handleSearch = (e: React.ChangeEvent<HTMLInputElement>) => {\n      const value = e.target.value;\n      updateTableQuery(query => {\n        return {\n          ...query,\n          search: value\n        };\n      });\n    };\n\n    const handleClear = () => {\n      updateTableQuery(query => {\n        return {\n          ...query,\n          search: ''\n        };\n      });\n    };\n\n    return (\n      <Search\n        {...props}\n        ref={ref}\n        onChange={handleSearch}\n        value={tableQuery?.search}\n        onClear={handleClear}\n      />\n    );\n  }\n);\n"],"names":[],"mappings":";;;;;;AAOO;;AAIH;AACE;;;AAGI;AACA;;AAEJ;AACF;;;;AAKM;AACA;;AAEJ;AACF;;AAWF;;"}
+{"version":3,"file":"search.js","sources":["../../../../components/data-table/components/search.tsx"],"sourcesContent":["'use client';\n\nimport { forwardRef } from 'react';\nimport { Search } from '../../search';\nimport { SearchProps } from '../../search/search';\nimport { useDataTable } from '../hooks/useDataTable';\n\nexport interface DataTableSearchProps extends SearchProps {\n  /**\n   * Automatically disable search in zero state (when no data and no filters/search applied).\n   * @defaultValue true\n   */\n  autoDisableInZeroState?: boolean;\n}\n\nexport const TableSearch = forwardRef<HTMLInputElement, DataTableSearchProps>(\n  ({ autoDisableInZeroState = true, disabled, ...props }, ref) => {\n    const {\n      updateTableQuery,\n      tableQuery,\n      shouldShowFilters = false\n    } = useDataTable();\n\n    const handleSearch = (e: React.ChangeEvent<HTMLInputElement>) => {\n      const value = e.target.value;\n      updateTableQuery(query => {\n        return {\n          ...query,\n          search: value\n        };\n      });\n    };\n\n    const handleClear = () => {\n      updateTableQuery(query => {\n        return {\n          ...query,\n          search: ''\n        };\n      });\n    };\n\n    // Auto-disable in zero state if enabled, but allow manual override\n    // Once search is applied, keep it enabled (even if shouldShowFilters is false)\n    const hasSearch = Boolean(\n      tableQuery?.search && tableQuery.search.trim() !== ''\n    );\n    const isDisabled =\n      disabled ?? (autoDisableInZeroState && !shouldShowFilters && !hasSearch);\n\n    return (\n      <Search\n        {...props}\n        ref={ref}\n        onChange={handleSearch}\n        value={tableQuery?.search}\n        onClear={handleClear}\n        disabled={isDisabled}\n      />\n    );\n  }\n);\n\nTableSearch.displayName = 'TableSearch';\n"],"names":[],"mappings":";;;;;;;AAiBI;AAMA;AACE;;;AAGI;AACA;;AAEJ;AACF;;;;AAKM;AACA;;AAEJ;AACF;;;AAIA;AAGA;AAGA;AAUF;AAGF;;"}

package/dist/components/data-table/components/toolbar.cjs

@@ -2,14 +2,19 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var classVarianceAuthority = require('class-variance-authority');
+var index = require('../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
 var flex = require('../../flex/flex.cjs');
 var dataTable_module = require('../data-table.module.css.cjs');
+var useDataTable = require('../hooks/useDataTable.cjs');
 var displaySettings = require('./display-settings.cjs');
 var filters = require('./filters.cjs');
 
 function Toolbar({ className }) {
-    return (jsxRuntime.jsxs(flex.Flex, { className: classVarianceAuthority.cx(dataTable_module.default['toolbar'], className), justify: 'between', align: 'center', children: [jsxRuntime.jsx(filters.Filters, {}), jsxRuntime.jsx(displaySettings.DisplaySettings, {})] }));
+    const { shouldShowFilters = false } = useDataTable.useDataTable();
+    if (!shouldShowFilters) {
+        return null;
+    }
+    return (jsxRuntime.jsxs(flex.Flex, { className: index.cx(dataTable_module.default['toolbar'], className), justify: 'between', align: 'center', children: [jsxRuntime.jsx(filters.Filters, {}), jsxRuntime.jsx(displaySettings.DisplaySettings, {})] }));
 }
 
 exports.Toolbar = Toolbar;

package/dist/components/data-table/components/toolbar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"toolbar.cjs","sources":["../../../../components/data-table/components/toolbar.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'class-variance-authority';\nimport { Flex } from '../../flex';\nimport styles from '../data-table.module.css';\nimport { DisplaySettings } from './display-settings';\nimport { Filters } from './filters';\n\nexport function Toolbar<TData, TValue>({ className }: { className?: string }) {\n  return (\n    <Flex\n      className={cx(styles['toolbar'], className)}\n      justify='between'\n      align='center'\n    >\n      <Filters<TData, TValue> />\n      <DisplaySettings />\n    </Flex>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;AAQgB;AACd;AAUF;;"}
+{"version":3,"file":"toolbar.cjs","sources":["../../../../components/data-table/components/toolbar.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'class-variance-authority';\nimport { Flex } from '../../flex';\nimport styles from '../data-table.module.css';\nimport { useDataTable } from '../hooks/useDataTable';\nimport { DisplaySettings } from './display-settings';\nimport { Filters } from './filters';\n\nexport function Toolbar<TData, TValue>({ className }: { className?: string }) {\n  const { shouldShowFilters = false } = useDataTable();\n\n  if (!shouldShowFilters) {\n    return null;\n  }\n\n  return (\n    <Flex\n      className={cx(styles['toolbar'], className)}\n      justify='between'\n      align='center'\n    >\n      <Filters<TData, TValue> />\n      <DisplaySettings />\n    </Flex>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;AASgB;;;AAIZ;;AAGF;AAUF;;"}

package/dist/components/data-table/components/toolbar.d.ts

@@ -1,4 +1,4 @@
 export declare function Toolbar<TData, TValue>({ className }: {
     className?: string;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react/jsx-runtime").JSX.Element | null;
 //# sourceMappingURL=toolbar.d.ts.map

package/dist/components/data-table/components/toolbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toolbar.d.ts","sourceRoot":"","sources":["../../../../components/data-table/components/toolbar.tsx"],"names":[],"mappings":"AAQA,wBAAgB,OAAO,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,2CAW3E"}
+{"version":3,"file":"toolbar.d.ts","sourceRoot":"","sources":["../../../../components/data-table/components/toolbar.tsx"],"names":[],"mappings":"AASA,wBAAgB,OAAO,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,kDAiB3E"}

package/dist/components/data-table/components/toolbar.js

@@ -1,12 +1,17 @@
 "use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { cx } from 'class-variance-authority';
+import { cx } from '../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
 import { Flex } from '../../flex/flex.js';
 import styles from '../data-table.module.css.js';
+import { useDataTable } from '../hooks/useDataTable.js';
 import { DisplaySettings } from './display-settings.js';
 import { Filters } from './filters.js';
 
 function Toolbar({ className }) {
+    const { shouldShowFilters = false } = useDataTable();
+    if (!shouldShowFilters) {
+        return null;
+    }
     return (jsxs(Flex, { className: cx(styles['toolbar'], className), justify: 'between', align: 'center', children: [jsx(Filters, {}), jsx(DisplaySettings, {})] }));
 }
 

package/dist/components/data-table/components/toolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"toolbar.js","sources":["../../../../components/data-table/components/toolbar.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'class-variance-authority';\nimport { Flex } from '../../flex';\nimport styles from '../data-table.module.css';\nimport { DisplaySettings } from './display-settings';\nimport { Filters } from './filters';\n\nexport function Toolbar<TData, TValue>({ className }: { className?: string }) {\n  return (\n    <Flex\n      className={cx(styles['toolbar'], className)}\n      justify='between'\n      align='center'\n    >\n      <Filters<TData, TValue> />\n      <DisplaySettings />\n    </Flex>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;AAQgB;AACd;AAUF;;"}
+{"version":3,"file":"toolbar.js","sources":["../../../../components/data-table/components/toolbar.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'class-variance-authority';\nimport { Flex } from '../../flex';\nimport styles from '../data-table.module.css';\nimport { useDataTable } from '../hooks/useDataTable';\nimport { DisplaySettings } from './display-settings';\nimport { Filters } from './filters';\n\nexport function Toolbar<TData, TValue>({ className }: { className?: string }) {\n  const { shouldShowFilters = false } = useDataTable();\n\n  if (!shouldShowFilters) {\n    return null;\n  }\n\n  return (\n    <Flex\n      className={cx(styles['toolbar'], className)}\n      justify='between'\n      align='center'\n    >\n      <Filters<TData, TValue> />\n      <DisplaySettings />\n    </Flex>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;AASgB;;;AAIZ;;AAGF;AAUF;;"}

package/dist/components/data-table/data-table.cjs

@@ -2,27 +2,40 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var reactTable = require('@tanstack/react-table');
+var index$1 = require('../../node_modules/.pnpm/@tanstack_react-table@8.9.2_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@tanstack/react-table/build/lib/index.cjs');
 var React = require('react');
 var content = require('./components/content.cjs');
+var displaySettings = require('./components/display-settings.cjs');
 var filters = require('./components/filters.cjs');
 var search = require('./components/search.cjs');
 var toolbar = require('./components/toolbar.cjs');
 var context = require('./context.cjs');
 var dataTable_types = require('./data-table.types.cjs');
 var index = require('./utils/index.cjs');
+var index$2 = require('../../node_modules/.pnpm/@tanstack_table-core@8.9.2/node_modules/@tanstack/table-core/build/lib/index.cjs');
 
-function DataTableRoot({ data = [], columns, query, mode = 'client', isLoading = false, loadingRowCount = 3, defaultSort, children, onTableQueryChange, onLoadMore, onRowClick }) {
+function DataTableRoot({ data = [], columns, query, mode = 'client', isLoading = false, loadingRowCount = 3, defaultSort, children, onTableQueryChange, onLoadMore, onRowClick, onColumnVisibilityChange }) {
     const defaultTableQuery = index.getDefaultTableQuery(defaultSort, query);
     const initialColumnVisibility = index.getInitialColumnVisibility(columns);
     const [columnVisibility, setColumnVisibility] = React.useState(initialColumnVisibility);
+    const handleColumnVisibilityChange = React.useCallback((value) => {
+        setColumnVisibility(prev => {
+            const newValue = typeof value === 'function' ? value(prev) : value;
+            onColumnVisibilityChange?.(newValue);
+            return newValue;
+        });
+    }, [onColumnVisibilityChange]);
     const [tableQuery, setTableQuery] = React.useState(defaultTableQuery);
     const oldQueryRef = React.useRef(null);
     const reactTableState = React.useMemo(() => index.queryToTableState(tableQuery), [tableQuery]);
     const onDisplaySettingsReset = React.useCallback(() => {
         setTableQuery(prev => ({ ...prev, ...defaultTableQuery }));
-        setColumnVisibility(initialColumnVisibility);
-    }, [defaultTableQuery, initialColumnVisibility]);
+        handleColumnVisibilityChange(initialColumnVisibility);
+    }, [
+        defaultTableQuery,
+        initialColumnVisibility,
+        handleColumnVisibilityChange
+    ]);
     const group_by = tableQuery.group_by?.[0];
     const columnsWithFilters = React.useMemo(() => index.getColumnsWithFilterFn(columns, tableQuery.filters), [columns, tableQuery.filters]);
     const groupedData = React.useMemo(() => index.groupData(data, group_by, columns), [data, group_by, columns]);
@@ -35,17 +48,17 @@ function DataTableRoot({ data = [], columns, query, mode = 'client', isLoading =
             oldQueryRef.current = tableQuery;
         }
     }, [tableQuery, onTableQueryChange]);
-    const table = reactTable.useReactTable({
+    const table = index$1.useReactTable({
         data: groupedData,
         columns: columnsWithFilters,
-        getCoreRowModel: reactTable.getCoreRowModel(),
-        getExpandedRowModel: reactTable.getExpandedRowModel(),
+        getCoreRowModel: index$2.getCoreRowModel(),
+        getExpandedRowModel: index$2.getExpandedRowModel(),
         getSubRows: row => row?.subRows || [],
-        getSortedRowModel: mode === 'server' ? undefined : reactTable.getSortedRowModel(),
-        getFilteredRowModel: mode === 'server' ? undefined : reactTable.getFilteredRowModel(),
+        getSortedRowModel: mode === 'server' ? undefined : index$2.getSortedRowModel(),
+        getFilteredRowModel: mode === 'server' ? undefined : index$2.getFilteredRowModel(),
         manualSorting: mode === 'server',
         manualFiltering: mode === 'server',
-        onColumnVisibilityChange: setColumnVisibility,
+        onColumnVisibilityChange: handleColumnVisibilityChange,
         globalFilterFn: mode === 'server' ? undefined : 'auto',
         initialState: {
             columnVisibility: initialColumnVisibility
@@ -74,6 +87,23 @@ function DataTableRoot({ data = [], columns, query, mode = 'client', isLoading =
             }));
         }
     }, [searchQuery]);
+    // Determine if filters should be visible
+    // Filters should be visible if there is data OR if filters are applied (empty state)
+    // Filters should NOT be visible if no data AND no filters (zero state)
+    // Note: Search alone does not show the filter bar
+    const shouldShowFilters = React.useMemo(() => {
+        const hasFilters = tableQuery?.filters && tableQuery.filters.length > 0;
+        try {
+            const rowModel = table.getRowModel();
+            const hasData = (rowModel?.rows?.length ?? 0) > 0;
+            return hasData || hasFilters;
+        }
+        catch {
+            // If table is not ready yet, check if we have initial data
+            // If no filters and no data, don't show filters
+            return hasFilters || data.length > 0;
+        }
+    }, [table, tableQuery, data.length]);
     const contextValue = React.useMemo(() => {
         return {
             table,
@@ -86,7 +116,8 @@ function DataTableRoot({ data = [], columns, query, mode = 'client', isLoading =
             onDisplaySettingsReset,
             defaultSort,
             loadingRowCount,
-            onRowClick
+            onRowClick,
+            shouldShowFilters
         };
     }, [
         table,
@@ -99,7 +130,8 @@ function DataTableRoot({ data = [], columns, query, mode = 'client', isLoading =
         onDisplaySettingsReset,
         defaultSort,
         loadingRowCount,
-        onRowClick
+        onRowClick,
+        shouldShowFilters
     ]);
     return (jsxRuntime.jsx(context.TableContext.Provider, { value: contextValue, children: children }));
 }
@@ -107,7 +139,8 @@ const DataTable = Object.assign(DataTableRoot, {
     Content: content.Content,
     Toolbar: toolbar.Toolbar,
     Search: search.TableSearch,
-    Filters: filters.Filters
+    Filters: filters.Filters,
+    DisplayControls: displaySettings.DisplaySettings
 });
 
 exports.DataTable = DataTable;

package/dist/components/data-table/data-table.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.cjs","sources":["../../../components/data-table/data-table.tsx"],"sourcesContent":["'use client';\n\nimport {\n  VisibilityState,\n  getCoreRowModel,\n  getExpandedRowModel,\n  getFilteredRowModel,\n  getSortedRowModel,\n  useReactTable\n} from '@tanstack/react-table';\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { Content } from './components/content';\nimport { Filters } from './components/filters';\nimport { TableSearch } from './components/search';\nimport { Toolbar } from './components/toolbar';\nimport { TableContext } from './context';\nimport {\n  DataTableProps,\n  GroupedData,\n  InternalQuery,\n  TableContextType,\n  TableQueryUpdateFn,\n  defaultGroupOption\n} from './data-table.types';\nimport {\n  getColumnsWithFilterFn,\n  getDefaultTableQuery,\n  getInitialColumnVisibility,\n  groupData,\n  hasQueryChanged,\n  queryToTableState,\n  transformToDataTableQuery\n} from './utils';\n\nfunction DataTableRoot<TData, TValue>({\n  data = [],\n  columns,\n  query,\n  mode = 'client',\n  isLoading = false,\n  loadingRowCount = 3,\n  defaultSort,\n  children,\n  onTableQueryChange,\n  onLoadMore,\n  onRowClick\n}: React.PropsWithChildren<DataTableProps<TData, TValue>>) {\n  const defaultTableQuery = getDefaultTableQuery(defaultSort, query);\n  const initialColumnVisibility = getInitialColumnVisibility(columns);\n\n  const [columnVisibility, setColumnVisibility] = useState<VisibilityState>(\n    initialColumnVisibility\n  );\n  const [tableQuery, setTableQuery] =\n    useState<InternalQuery>(defaultTableQuery);\n\n  const oldQueryRef = useRef<InternalQuery | null>(null);\n\n  const reactTableState = useMemo(\n    () => queryToTableState(tableQuery),\n    [tableQuery]\n  );\n\n  const onDisplaySettingsReset = useCallback(() => {\n    setTableQuery(prev => ({ ...prev, ...defaultTableQuery }));\n    setColumnVisibility(initialColumnVisibility);\n  }, [defaultTableQuery, initialColumnVisibility]);\n\n  const group_by = tableQuery.group_by?.[0];\n\n  const columnsWithFilters = useMemo(\n    () => getColumnsWithFilterFn<TData, TValue>(columns, tableQuery.filters),\n    [columns, tableQuery.filters]\n  );\n\n  const groupedData = useMemo(\n    () => groupData(data, group_by, columns),\n    [data, group_by, columns]\n  );\n\n  useEffect(() => {\n    if (\n      tableQuery &&\n      onTableQueryChange &&\n      hasQueryChanged(oldQueryRef.current, tableQuery) &&\n      mode === 'server'\n    ) {\n      onTableQueryChange(transformToDataTableQuery(tableQuery));\n      oldQueryRef.current = tableQuery;\n    }\n  }, [tableQuery, onTableQueryChange]);\n\n  const table = useReactTable({\n    data: groupedData as unknown as TData[],\n    columns: columnsWithFilters,\n    getCoreRowModel: getCoreRowModel(),\n    getExpandedRowModel: getExpandedRowModel(),\n    getSubRows: row => (row as unknown as GroupedData<TData>)?.subRows || [],\n    getSortedRowModel: mode === 'server' ? undefined : getSortedRowModel(),\n    getFilteredRowModel: mode === 'server' ? undefined : getFilteredRowModel(),\n    manualSorting: mode === 'server',\n    manualFiltering: mode === 'server',\n    onColumnVisibilityChange: setColumnVisibility,\n    globalFilterFn: mode === 'server' ? undefined : 'auto',\n    initialState: {\n      columnVisibility: initialColumnVisibility\n    },\n    filterFromLeafRows: true,\n    state: {\n      ...reactTableState,\n      columnVisibility: columnVisibility,\n      expanded:\n        group_by && group_by !== defaultGroupOption.id ? true : undefined\n    }\n  });\n\n  function updateTableQuery(fn: TableQueryUpdateFn) {\n    setTableQuery(prev => fn(prev));\n  }\n\n  const loadMoreData = useCallback(() => {\n    if (mode === 'server' && onLoadMore) {\n      onLoadMore();\n    }\n  }, [mode, onLoadMore]);\n\n  const searchQuery = query?.search;\n  useEffect(() => {\n    if (searchQuery) {\n      updateTableQuery(prev => ({\n        ...prev,\n        search: searchQuery\n      }));\n    }\n  }, [searchQuery]);\n\n  const contextValue: TableContextType<TData, TValue> = useMemo(() => {\n    return {\n      table,\n      columns,\n      mode,\n      isLoading,\n      loadMoreData,\n      tableQuery,\n      updateTableQuery,\n      onDisplaySettingsReset,\n      defaultSort,\n      loadingRowCount,\n      onRowClick\n    };\n  }, [\n    table,\n    columns,\n    mode,\n    isLoading,\n    loadMoreData,\n    tableQuery,\n    updateTableQuery,\n    onDisplaySettingsReset,\n    defaultSort,\n    loadingRowCount,\n    onRowClick\n  ]);\n\n  return (\n    <TableContext.Provider value={contextValue}>\n      {children}\n    </TableContext.Provider>\n  );\n}\n\nexport const DataTable = Object.assign(DataTableRoot, {\n  Content: Content,\n  Toolbar: Toolbar,\n  Search: TableSearch,\n  Filters: Filters\n});\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAkCA;;AAcE;;;AAQA;AAEA;AAKA;AACE;;AAEF;;;;;AAeE;;AAGE;;AAGA;AACA;;AAEJ;;AAGE;AACA;;;;AAIA;AACA;;;AAGA;;AAEA;AACE;AACD;AACD;AACA;AACE;AACA;AACA;AAED;AACF;;;;AAMD;AACE;AACE;;AAEJ;AAEA;;;AAGI;AACE;AACA;AACD;;AAEL;AAEA;;;;;;;;;;;;;;AAcA;;;;;;;;;;;;AAYC;AAED;AAKF;;AAGE;AACA;AACA;AACA;AACD;;"}
+{"version":3,"file":"data-table.cjs","sources":["../../../components/data-table/data-table.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Updater,\n  VisibilityState,\n  getCoreRowModel,\n  getExpandedRowModel,\n  getFilteredRowModel,\n  getSortedRowModel,\n  useReactTable\n} from '@tanstack/react-table';\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { Content } from './components/content';\nimport { DisplaySettings } from './components/display-settings';\nimport { Filters } from './components/filters';\nimport { TableSearch } from './components/search';\nimport { Toolbar } from './components/toolbar';\nimport { TableContext } from './context';\nimport {\n  DataTableProps,\n  GroupedData,\n  InternalQuery,\n  TableContextType,\n  TableQueryUpdateFn,\n  defaultGroupOption\n} from './data-table.types';\nimport {\n  getColumnsWithFilterFn,\n  getDefaultTableQuery,\n  getInitialColumnVisibility,\n  groupData,\n  hasQueryChanged,\n  queryToTableState,\n  transformToDataTableQuery\n} from './utils';\n\nfunction DataTableRoot<TData, TValue>({\n  data = [],\n  columns,\n  query,\n  mode = 'client',\n  isLoading = false,\n  loadingRowCount = 3,\n  defaultSort,\n  children,\n  onTableQueryChange,\n  onLoadMore,\n  onRowClick,\n  onColumnVisibilityChange\n}: React.PropsWithChildren<DataTableProps<TData, TValue>>) {\n  const defaultTableQuery = getDefaultTableQuery(defaultSort, query);\n  const initialColumnVisibility = getInitialColumnVisibility(columns);\n\n  const [columnVisibility, setColumnVisibility] = useState<VisibilityState>(\n    initialColumnVisibility\n  );\n  const handleColumnVisibilityChange = useCallback(\n    (value: Updater<VisibilityState>) => {\n      setColumnVisibility(prev => {\n        const newValue = typeof value === 'function' ? value(prev) : value;\n        onColumnVisibilityChange?.(newValue);\n        return newValue;\n      });\n    },\n    [onColumnVisibilityChange]\n  );\n\n  const [tableQuery, setTableQuery] =\n    useState<InternalQuery>(defaultTableQuery);\n\n  const oldQueryRef = useRef<InternalQuery | null>(null);\n\n  const reactTableState = useMemo(\n    () => queryToTableState(tableQuery),\n    [tableQuery]\n  );\n\n  const onDisplaySettingsReset = useCallback(() => {\n    setTableQuery(prev => ({ ...prev, ...defaultTableQuery }));\n    handleColumnVisibilityChange(initialColumnVisibility);\n  }, [\n    defaultTableQuery,\n    initialColumnVisibility,\n    handleColumnVisibilityChange\n  ]);\n\n  const group_by = tableQuery.group_by?.[0];\n\n  const columnsWithFilters = useMemo(\n    () => getColumnsWithFilterFn<TData, TValue>(columns, tableQuery.filters),\n    [columns, tableQuery.filters]\n  );\n\n  const groupedData = useMemo(\n    () => groupData(data, group_by, columns),\n    [data, group_by, columns]\n  );\n\n  useEffect(() => {\n    if (\n      tableQuery &&\n      onTableQueryChange &&\n      hasQueryChanged(oldQueryRef.current, tableQuery) &&\n      mode === 'server'\n    ) {\n      onTableQueryChange(transformToDataTableQuery(tableQuery));\n      oldQueryRef.current = tableQuery;\n    }\n  }, [tableQuery, onTableQueryChange]);\n\n  const table = useReactTable({\n    data: groupedData as unknown as TData[],\n    columns: columnsWithFilters,\n    getCoreRowModel: getCoreRowModel(),\n    getExpandedRowModel: getExpandedRowModel(),\n    getSubRows: row => (row as unknown as GroupedData<TData>)?.subRows || [],\n    getSortedRowModel: mode === 'server' ? undefined : getSortedRowModel(),\n    getFilteredRowModel: mode === 'server' ? undefined : getFilteredRowModel(),\n    manualSorting: mode === 'server',\n    manualFiltering: mode === 'server',\n    onColumnVisibilityChange: handleColumnVisibilityChange,\n    globalFilterFn: mode === 'server' ? undefined : 'auto',\n    initialState: {\n      columnVisibility: initialColumnVisibility\n    },\n    filterFromLeafRows: true,\n    state: {\n      ...reactTableState,\n      columnVisibility: columnVisibility,\n      expanded:\n        group_by && group_by !== defaultGroupOption.id ? true : undefined\n    }\n  });\n\n  function updateTableQuery(fn: TableQueryUpdateFn) {\n    setTableQuery(prev => fn(prev));\n  }\n\n  const loadMoreData = useCallback(() => {\n    if (mode === 'server' && onLoadMore) {\n      onLoadMore();\n    }\n  }, [mode, onLoadMore]);\n\n  const searchQuery = query?.search;\n  useEffect(() => {\n    if (searchQuery) {\n      updateTableQuery(prev => ({\n        ...prev,\n        search: searchQuery\n      }));\n    }\n  }, [searchQuery]);\n\n  // Determine if filters should be visible\n  // Filters should be visible if there is data OR if filters are applied (empty state)\n  // Filters should NOT be visible if no data AND no filters (zero state)\n  // Note: Search alone does not show the filter bar\n  const shouldShowFilters = useMemo(() => {\n    const hasFilters = tableQuery?.filters && tableQuery.filters.length > 0;\n\n    try {\n      const rowModel = table.getRowModel();\n      const hasData = (rowModel?.rows?.length ?? 0) > 0;\n      return hasData || hasFilters;\n    } catch {\n      // If table is not ready yet, check if we have initial data\n      // If no filters and no data, don't show filters\n      return hasFilters || data.length > 0;\n    }\n  }, [table, tableQuery, data.length]);\n\n  const contextValue: TableContextType<TData, TValue> = useMemo(() => {\n    return {\n      table,\n      columns,\n      mode,\n      isLoading,\n      loadMoreData,\n      tableQuery,\n      updateTableQuery,\n      onDisplaySettingsReset,\n      defaultSort,\n      loadingRowCount,\n      onRowClick,\n      shouldShowFilters\n    };\n  }, [\n    table,\n    columns,\n    mode,\n    isLoading,\n    loadMoreData,\n    tableQuery,\n    updateTableQuery,\n    onDisplaySettingsReset,\n    defaultSort,\n    loadingRowCount,\n    onRowClick,\n    shouldShowFilters\n  ]);\n\n  return (\n    <TableContext.Provider value={contextValue}>\n      {children}\n    </TableContext.Provider>\n  );\n}\n\nexport const DataTable = Object.assign(DataTableRoot, {\n  Content: Content,\n  Toolbar: Toolbar,\n  Search: TableSearch,\n  Filters: Filters,\n  DisplayControls: DisplaySettings\n});\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAoCA;;AAeE;;AAKA;;AAGM;AACA;AACA;AACF;AACF;;AAOF;AAEA;AAKA;AACE;;AAEF;;;;AAIC;;;;;AAeC;;AAGE;;AAGA;AACA;;AAEJ;;AAGE;AACA;;;;AAIA;AACA;;;AAGA;;AAEA;AACE;AACD;AACD;AACA;AACE;AACA;AACA;AAED;AACF;;;;AAMD;AACE;AACE;;AAEJ;AAEA;;;AAGI;AACE;AACA;AACD;;AAEL;;;;;AAMA;AACE;AAEA;AACE;AACA;;;AAEA;;;AAGA;;;AAIJ;;;;;;;;;;;;;;;AAeA;;;;;;;;;;;;;AAaC;AAED;AAKF;;AAGE;AACA;AACA;AACA;AACA;AACD;;"}

package/dist/components/data-table/data-table.d.ts

@@ -1,13 +1,15 @@
 import { Content } from './components/content';
+import { DisplaySettings } from './components/display-settings';
 import { Filters } from './components/filters';
 import { Toolbar } from './components/toolbar';
 import { DataTableProps } from './data-table.types';
-declare function DataTableRoot<TData, TValue>({ data, columns, query, mode, isLoading, loadingRowCount, defaultSort, children, onTableQueryChange, onLoadMore, onRowClick }: React.PropsWithChildren<DataTableProps<TData, TValue>>): import("react/jsx-runtime").JSX.Element;
+declare function DataTableRoot<TData, TValue>({ data, columns, query, mode, isLoading, loadingRowCount, defaultSort, children, onTableQueryChange, onLoadMore, onRowClick, onColumnVisibilityChange }: React.PropsWithChildren<DataTableProps<TData, TValue>>): import("react/jsx-runtime").JSX.Element;
 export declare const DataTable: typeof DataTableRoot & {
     Content: typeof Content;
     Toolbar: typeof Toolbar;
-    Search: import("react").ForwardRefExoticComponent<import("../search/search").SearchProps & import("react").RefAttributes<HTMLInputElement>>;
+    Search: import("react").ForwardRefExoticComponent<import("./components/search").DataTableSearchProps & import("react").RefAttributes<HTMLInputElement>>;
     Filters: typeof Filters;
+    DisplayControls: typeof DisplaySettings;
 };
 export {};
 //# sourceMappingURL=data-table.d.ts.map

package/dist/components/data-table/data-table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../../components/data-table/data-table.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAE/C,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAE/C,OAAO,EACL,cAAc,EAMf,MAAM,oBAAoB,CAAC;AAW5B,iBAAS,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,EACpC,IAAS,EACT,OAAO,EACP,KAAK,EACL,IAAe,EACf,SAAiB,EACjB,eAAmB,EACnB,WAAW,EACX,QAAQ,EACR,kBAAkB,EAClB,UAAU,EACV,UAAU,EACX,EAAE,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,2CA2HxD;AAED,eAAO,MAAM,SAAS;;;;;CAKpB,CAAC"}
+{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../../components/data-table/data-table.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AAChE,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAE/C,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAE/C,OAAO,EACL,cAAc,EAMf,MAAM,oBAAoB,CAAC;AAW5B,iBAAS,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,EACpC,IAAS,EACT,OAAO,EACP,KAAK,EACL,IAAe,EACf,SAAiB,EACjB,eAAmB,EACnB,WAAW,EACX,QAAQ,EACR,kBAAkB,EAClB,UAAU,EACV,UAAU,EACV,wBAAwB,EACzB,EAAE,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,2CA8JxD;AAED,eAAO,MAAM,SAAS;;;;;;CAMpB,CAAC"}

package/dist/components/data-table/data-table.js

@@ -1,26 +1,39 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
-import { useReactTable, getCoreRowModel, getExpandedRowModel, getSortedRowModel, getFilteredRowModel } from '@tanstack/react-table';
-import { useState, useRef, useMemo, useCallback, useEffect } from 'react';
+import { useReactTable } from '../../node_modules/.pnpm/@tanstack_react-table@8.9.2_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@tanstack/react-table/build/lib/index.js';
+import { useState, useCallback, useRef, useMemo, useEffect } from 'react';
 import { Content } from './components/content.js';
+import { DisplaySettings } from './components/display-settings.js';
 import { Filters } from './components/filters.js';
 import { TableSearch } from './components/search.js';
 import { Toolbar } from './components/toolbar.js';
 import { TableContext } from './context.js';
 import { defaultGroupOption } from './data-table.types.js';
 import { getDefaultTableQuery, getInitialColumnVisibility, queryToTableState, getColumnsWithFilterFn, groupData, hasQueryChanged, transformToDataTableQuery } from './utils/index.js';
+import { getCoreRowModel, getExpandedRowModel, getSortedRowModel, getFilteredRowModel } from '../../node_modules/.pnpm/@tanstack_table-core@8.9.2/node_modules/@tanstack/table-core/build/lib/index.js';
 
-function DataTableRoot({ data = [], columns, query, mode = 'client', isLoading = false, loadingRowCount = 3, defaultSort, children, onTableQueryChange, onLoadMore, onRowClick }) {
+function DataTableRoot({ data = [], columns, query, mode = 'client', isLoading = false, loadingRowCount = 3, defaultSort, children, onTableQueryChange, onLoadMore, onRowClick, onColumnVisibilityChange }) {
     const defaultTableQuery = getDefaultTableQuery(defaultSort, query);
     const initialColumnVisibility = getInitialColumnVisibility(columns);
     const [columnVisibility, setColumnVisibility] = useState(initialColumnVisibility);
+    const handleColumnVisibilityChange = useCallback((value) => {
+        setColumnVisibility(prev => {
+            const newValue = typeof value === 'function' ? value(prev) : value;
+            onColumnVisibilityChange?.(newValue);
+            return newValue;
+        });
+    }, [onColumnVisibilityChange]);
     const [tableQuery, setTableQuery] = useState(defaultTableQuery);
     const oldQueryRef = useRef(null);
     const reactTableState = useMemo(() => queryToTableState(tableQuery), [tableQuery]);
     const onDisplaySettingsReset = useCallback(() => {
         setTableQuery(prev => ({ ...prev, ...defaultTableQuery }));
-        setColumnVisibility(initialColumnVisibility);
-    }, [defaultTableQuery, initialColumnVisibility]);
+        handleColumnVisibilityChange(initialColumnVisibility);
+    }, [
+        defaultTableQuery,
+        initialColumnVisibility,
+        handleColumnVisibilityChange
+    ]);
     const group_by = tableQuery.group_by?.[0];
     const columnsWithFilters = useMemo(() => getColumnsWithFilterFn(columns, tableQuery.filters), [columns, tableQuery.filters]);
     const groupedData = useMemo(() => groupData(data, group_by, columns), [data, group_by, columns]);
@@ -43,7 +56,7 @@ function DataTableRoot({ data = [], columns, query, mode = 'client', isLoading =
         getFilteredRowModel: mode === 'server' ? undefined : getFilteredRowModel(),
         manualSorting: mode === 'server',
         manualFiltering: mode === 'server',
-        onColumnVisibilityChange: setColumnVisibility,
+        onColumnVisibilityChange: handleColumnVisibilityChange,
         globalFilterFn: mode === 'server' ? undefined : 'auto',
         initialState: {
             columnVisibility: initialColumnVisibility
@@ -72,6 +85,23 @@ function DataTableRoot({ data = [], columns, query, mode = 'client', isLoading =
             }));
         }
     }, [searchQuery]);
+    // Determine if filters should be visible
+    // Filters should be visible if there is data OR if filters are applied (empty state)
+    // Filters should NOT be visible if no data AND no filters (zero state)
+    // Note: Search alone does not show the filter bar
+    const shouldShowFilters = useMemo(() => {
+        const hasFilters = tableQuery?.filters && tableQuery.filters.length > 0;
+        try {
+            const rowModel = table.getRowModel();
+            const hasData = (rowModel?.rows?.length ?? 0) > 0;
+            return hasData || hasFilters;
+        }
+        catch {
+            // If table is not ready yet, check if we have initial data
+            // If no filters and no data, don't show filters
+            return hasFilters || data.length > 0;
+        }
+    }, [table, tableQuery, data.length]);
     const contextValue = useMemo(() => {
         return {
             table,
@@ -84,7 +114,8 @@ function DataTableRoot({ data = [], columns, query, mode = 'client', isLoading =
             onDisplaySettingsReset,
             defaultSort,
             loadingRowCount,
-            onRowClick
+            onRowClick,
+            shouldShowFilters
         };
     }, [
         table,
@@ -97,7 +128,8 @@ function DataTableRoot({ data = [], columns, query, mode = 'client', isLoading =
         onDisplaySettingsReset,
         defaultSort,
         loadingRowCount,
-        onRowClick
+        onRowClick,
+        shouldShowFilters
     ]);
     return (jsx(TableContext.Provider, { value: contextValue, children: children }));
 }
@@ -105,7 +137,8 @@ const DataTable = Object.assign(DataTableRoot, {
     Content: Content,
     Toolbar: Toolbar,
     Search: TableSearch,
-    Filters: Filters
+    Filters: Filters,
+    DisplayControls: DisplaySettings
 });
 
 export { DataTable };

package/dist/components/data-table/data-table.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.js","sources":["../../../components/data-table/data-table.tsx"],"sourcesContent":["'use client';\n\nimport {\n  VisibilityState,\n  getCoreRowModel,\n  getExpandedRowModel,\n  getFilteredRowModel,\n  getSortedRowModel,\n  useReactTable\n} from '@tanstack/react-table';\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { Content } from './components/content';\nimport { Filters } from './components/filters';\nimport { TableSearch } from './components/search';\nimport { Toolbar } from './components/toolbar';\nimport { TableContext } from './context';\nimport {\n  DataTableProps,\n  GroupedData,\n  InternalQuery,\n  TableContextType,\n  TableQueryUpdateFn,\n  defaultGroupOption\n} from './data-table.types';\nimport {\n  getColumnsWithFilterFn,\n  getDefaultTableQuery,\n  getInitialColumnVisibility,\n  groupData,\n  hasQueryChanged,\n  queryToTableState,\n  transformToDataTableQuery\n} from './utils';\n\nfunction DataTableRoot<TData, TValue>({\n  data = [],\n  columns,\n  query,\n  mode = 'client',\n  isLoading = false,\n  loadingRowCount = 3,\n  defaultSort,\n  children,\n  onTableQueryChange,\n  onLoadMore,\n  onRowClick\n}: React.PropsWithChildren<DataTableProps<TData, TValue>>) {\n  const defaultTableQuery = getDefaultTableQuery(defaultSort, query);\n  const initialColumnVisibility = getInitialColumnVisibility(columns);\n\n  const [columnVisibility, setColumnVisibility] = useState<VisibilityState>(\n    initialColumnVisibility\n  );\n  const [tableQuery, setTableQuery] =\n    useState<InternalQuery>(defaultTableQuery);\n\n  const oldQueryRef = useRef<InternalQuery | null>(null);\n\n  const reactTableState = useMemo(\n    () => queryToTableState(tableQuery),\n    [tableQuery]\n  );\n\n  const onDisplaySettingsReset = useCallback(() => {\n    setTableQuery(prev => ({ ...prev, ...defaultTableQuery }));\n    setColumnVisibility(initialColumnVisibility);\n  }, [defaultTableQuery, initialColumnVisibility]);\n\n  const group_by = tableQuery.group_by?.[0];\n\n  const columnsWithFilters = useMemo(\n    () => getColumnsWithFilterFn<TData, TValue>(columns, tableQuery.filters),\n    [columns, tableQuery.filters]\n  );\n\n  const groupedData = useMemo(\n    () => groupData(data, group_by, columns),\n    [data, group_by, columns]\n  );\n\n  useEffect(() => {\n    if (\n      tableQuery &&\n      onTableQueryChange &&\n      hasQueryChanged(oldQueryRef.current, tableQuery) &&\n      mode === 'server'\n    ) {\n      onTableQueryChange(transformToDataTableQuery(tableQuery));\n      oldQueryRef.current = tableQuery;\n    }\n  }, [tableQuery, onTableQueryChange]);\n\n  const table = useReactTable({\n    data: groupedData as unknown as TData[],\n    columns: columnsWithFilters,\n    getCoreRowModel: getCoreRowModel(),\n    getExpandedRowModel: getExpandedRowModel(),\n    getSubRows: row => (row as unknown as GroupedData<TData>)?.subRows || [],\n    getSortedRowModel: mode === 'server' ? undefined : getSortedRowModel(),\n    getFilteredRowModel: mode === 'server' ? undefined : getFilteredRowModel(),\n    manualSorting: mode === 'server',\n    manualFiltering: mode === 'server',\n    onColumnVisibilityChange: setColumnVisibility,\n    globalFilterFn: mode === 'server' ? undefined : 'auto',\n    initialState: {\n      columnVisibility: initialColumnVisibility\n    },\n    filterFromLeafRows: true,\n    state: {\n      ...reactTableState,\n      columnVisibility: columnVisibility,\n      expanded:\n        group_by && group_by !== defaultGroupOption.id ? true : undefined\n    }\n  });\n\n  function updateTableQuery(fn: TableQueryUpdateFn) {\n    setTableQuery(prev => fn(prev));\n  }\n\n  const loadMoreData = useCallback(() => {\n    if (mode === 'server' && onLoadMore) {\n      onLoadMore();\n    }\n  }, [mode, onLoadMore]);\n\n  const searchQuery = query?.search;\n  useEffect(() => {\n    if (searchQuery) {\n      updateTableQuery(prev => ({\n        ...prev,\n        search: searchQuery\n      }));\n    }\n  }, [searchQuery]);\n\n  const contextValue: TableContextType<TData, TValue> = useMemo(() => {\n    return {\n      table,\n      columns,\n      mode,\n      isLoading,\n      loadMoreData,\n      tableQuery,\n      updateTableQuery,\n      onDisplaySettingsReset,\n      defaultSort,\n      loadingRowCount,\n      onRowClick\n    };\n  }, [\n    table,\n    columns,\n    mode,\n    isLoading,\n    loadMoreData,\n    tableQuery,\n    updateTableQuery,\n    onDisplaySettingsReset,\n    defaultSort,\n    loadingRowCount,\n    onRowClick\n  ]);\n\n  return (\n    <TableContext.Provider value={contextValue}>\n      {children}\n    </TableContext.Provider>\n  );\n}\n\nexport const DataTable = Object.assign(DataTableRoot, {\n  Content: Content,\n  Toolbar: Toolbar,\n  Search: TableSearch,\n  Filters: Filters\n});\n"],"names":[],"mappings":";;;;;;;;;;;;AAkCA;;AAcE;;;AAQA;AAEA;AAKA;AACE;;AAEF;;;;;AAeE;;AAGE;;AAGA;AACA;;AAEJ;;AAGE;AACA;;;;AAIA;AACA;;;AAGA;;AAEA;AACE;AACD;AACD;AACA;AACE;AACA;AACA;AAED;AACF;;;;AAMD;AACE;AACE;;AAEJ;AAEA;;;AAGI;AACE;AACA;AACD;;AAEL;AAEA;;;;;;;;;;;;;;AAcA;;;;;;;;;;;;AAYC;AAED;AAKF;;AAGE;AACA;AACA;AACA;AACD;;"}
+{"version":3,"file":"data-table.js","sources":["../../../components/data-table/data-table.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Updater,\n  VisibilityState,\n  getCoreRowModel,\n  getExpandedRowModel,\n  getFilteredRowModel,\n  getSortedRowModel,\n  useReactTable\n} from '@tanstack/react-table';\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { Content } from './components/content';\nimport { DisplaySettings } from './components/display-settings';\nimport { Filters } from './components/filters';\nimport { TableSearch } from './components/search';\nimport { Toolbar } from './components/toolbar';\nimport { TableContext } from './context';\nimport {\n  DataTableProps,\n  GroupedData,\n  InternalQuery,\n  TableContextType,\n  TableQueryUpdateFn,\n  defaultGroupOption\n} from './data-table.types';\nimport {\n  getColumnsWithFilterFn,\n  getDefaultTableQuery,\n  getInitialColumnVisibility,\n  groupData,\n  hasQueryChanged,\n  queryToTableState,\n  transformToDataTableQuery\n} from './utils';\n\nfunction DataTableRoot<TData, TValue>({\n  data = [],\n  columns,\n  query,\n  mode = 'client',\n  isLoading = false,\n  loadingRowCount = 3,\n  defaultSort,\n  children,\n  onTableQueryChange,\n  onLoadMore,\n  onRowClick,\n  onColumnVisibilityChange\n}: React.PropsWithChildren<DataTableProps<TData, TValue>>) {\n  const defaultTableQuery = getDefaultTableQuery(defaultSort, query);\n  const initialColumnVisibility = getInitialColumnVisibility(columns);\n\n  const [columnVisibility, setColumnVisibility] = useState<VisibilityState>(\n    initialColumnVisibility\n  );\n  const handleColumnVisibilityChange = useCallback(\n    (value: Updater<VisibilityState>) => {\n      setColumnVisibility(prev => {\n        const newValue = typeof value === 'function' ? value(prev) : value;\n        onColumnVisibilityChange?.(newValue);\n        return newValue;\n      });\n    },\n    [onColumnVisibilityChange]\n  );\n\n  const [tableQuery, setTableQuery] =\n    useState<InternalQuery>(defaultTableQuery);\n\n  const oldQueryRef = useRef<InternalQuery | null>(null);\n\n  const reactTableState = useMemo(\n    () => queryToTableState(tableQuery),\n    [tableQuery]\n  );\n\n  const onDisplaySettingsReset = useCallback(() => {\n    setTableQuery(prev => ({ ...prev, ...defaultTableQuery }));\n    handleColumnVisibilityChange(initialColumnVisibility);\n  }, [\n    defaultTableQuery,\n    initialColumnVisibility,\n    handleColumnVisibilityChange\n  ]);\n\n  const group_by = tableQuery.group_by?.[0];\n\n  const columnsWithFilters = useMemo(\n    () => getColumnsWithFilterFn<TData, TValue>(columns, tableQuery.filters),\n    [columns, tableQuery.filters]\n  );\n\n  const groupedData = useMemo(\n    () => groupData(data, group_by, columns),\n    [data, group_by, columns]\n  );\n\n  useEffect(() => {\n    if (\n      tableQuery &&\n      onTableQueryChange &&\n      hasQueryChanged(oldQueryRef.current, tableQuery) &&\n      mode === 'server'\n    ) {\n      onTableQueryChange(transformToDataTableQuery(tableQuery));\n      oldQueryRef.current = tableQuery;\n    }\n  }, [tableQuery, onTableQueryChange]);\n\n  const table = useReactTable({\n    data: groupedData as unknown as TData[],\n    columns: columnsWithFilters,\n    getCoreRowModel: getCoreRowModel(),\n    getExpandedRowModel: getExpandedRowModel(),\n    getSubRows: row => (row as unknown as GroupedData<TData>)?.subRows || [],\n    getSortedRowModel: mode === 'server' ? undefined : getSortedRowModel(),\n    getFilteredRowModel: mode === 'server' ? undefined : getFilteredRowModel(),\n    manualSorting: mode === 'server',\n    manualFiltering: mode === 'server',\n    onColumnVisibilityChange: handleColumnVisibilityChange,\n    globalFilterFn: mode === 'server' ? undefined : 'auto',\n    initialState: {\n      columnVisibility: initialColumnVisibility\n    },\n    filterFromLeafRows: true,\n    state: {\n      ...reactTableState,\n      columnVisibility: columnVisibility,\n      expanded:\n        group_by && group_by !== defaultGroupOption.id ? true : undefined\n    }\n  });\n\n  function updateTableQuery(fn: TableQueryUpdateFn) {\n    setTableQuery(prev => fn(prev));\n  }\n\n  const loadMoreData = useCallback(() => {\n    if (mode === 'server' && onLoadMore) {\n      onLoadMore();\n    }\n  }, [mode, onLoadMore]);\n\n  const searchQuery = query?.search;\n  useEffect(() => {\n    if (searchQuery) {\n      updateTableQuery(prev => ({\n        ...prev,\n        search: searchQuery\n      }));\n    }\n  }, [searchQuery]);\n\n  // Determine if filters should be visible\n  // Filters should be visible if there is data OR if filters are applied (empty state)\n  // Filters should NOT be visible if no data AND no filters (zero state)\n  // Note: Search alone does not show the filter bar\n  const shouldShowFilters = useMemo(() => {\n    const hasFilters = tableQuery?.filters && tableQuery.filters.length > 0;\n\n    try {\n      const rowModel = table.getRowModel();\n      const hasData = (rowModel?.rows?.length ?? 0) > 0;\n      return hasData || hasFilters;\n    } catch {\n      // If table is not ready yet, check if we have initial data\n      // If no filters and no data, don't show filters\n      return hasFilters || data.length > 0;\n    }\n  }, [table, tableQuery, data.length]);\n\n  const contextValue: TableContextType<TData, TValue> = useMemo(() => {\n    return {\n      table,\n      columns,\n      mode,\n      isLoading,\n      loadMoreData,\n      tableQuery,\n      updateTableQuery,\n      onDisplaySettingsReset,\n      defaultSort,\n      loadingRowCount,\n      onRowClick,\n      shouldShowFilters\n    };\n  }, [\n    table,\n    columns,\n    mode,\n    isLoading,\n    loadMoreData,\n    tableQuery,\n    updateTableQuery,\n    onDisplaySettingsReset,\n    defaultSort,\n    loadingRowCount,\n    onRowClick,\n    shouldShowFilters\n  ]);\n\n  return (\n    <TableContext.Provider value={contextValue}>\n      {children}\n    </TableContext.Provider>\n  );\n}\n\nexport const DataTable = Object.assign(DataTableRoot, {\n  Content: Content,\n  Toolbar: Toolbar,\n  Search: TableSearch,\n  Filters: Filters,\n  DisplayControls: DisplaySettings\n});\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAoCA;;AAeE;;AAKA;;AAGM;AACA;AACA;AACF;AACF;;AAOF;AAEA;AAKA;AACE;;AAEF;;;;AAIC;;;;;AAeC;;AAGE;;AAGA;AACA;;AAEJ;;AAGE;AACA;;;;AAIA;AACA;;;AAGA;;AAEA;AACE;AACD;AACD;AACA;AACE;AACA;AACA;AAED;AACF;;;;AAMD;AACE;AACE;;AAEJ;AAEA;;;AAGI;AACE;AACA;AACD;;AAEL;;;;;AAMA;AACE;AAEA;AACE;AACA;;;AAEA;;;AAGA;;;AAIJ;;;;;;;;;;;;;;;AAeA;;;;;;;;;;;;;AAaC;AAED;AAKF;;AAGE;AACA;AACA;AACA;AACA;AACD;;"}

package/dist/components/data-table/data-table.types.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.types.cjs","sources":["../../../components/data-table/data-table.types.tsx"],"sourcesContent":["import type { Column, ColumnDef, Table } from '@tanstack/table-core';\nimport type {\n  DataTableFilterOperatorTypes,\n  FilterOperatorTypes,\n  FilterSelectOption,\n  FilterTypes,\n  FilterValueType\n} from '~/types/filters';\n\nexport type DataTableMode = 'client' | 'server';\n\nexport const SortOrders = {\n  ASC: 'asc',\n  DESC: 'desc'\n} as const;\n\nexport interface DataTableFilterValues {\n  value: any;\n  // Only one of these value fields should be present at a time\n  boolValue?: boolean;\n  stringValue?: string;\n  numberValue?: number;\n}\n// Internal filter with UI operators and metadata\nexport interface InternalFilter extends DataTableFilterValues {\n  _type?: FilterTypes;\n  _dataType?: FilterValueType;\n  name: string;\n  operator: FilterOperatorTypes;\n}\n\n// Data table filter for backend API (no internal fields)\nexport interface DataTableFilter extends DataTableFilterValues {\n  name: string;\n  operator: DataTableFilterOperatorTypes;\n}\n\ntype SortOrdersKeys = keyof typeof SortOrders;\nexport type SortOrdersValues = (typeof SortOrders)[SortOrdersKeys];\n\nexport interface DataTableSort {\n  name: string;\n  order: SortOrdersValues;\n}\n\n// Internal query with UI operators and metadata\nexport interface InternalQuery {\n  filters?: InternalFilter[];\n  sort?: DataTableSort[];\n  group_by?: string[];\n  offset?: number;\n  limit?: number;\n  search?: string;\n}\n\n// Data table query for backend API (clean, no internal fields)\nexport interface DataTableQuery extends Omit<InternalQuery, 'filters'> {\n  filters?: DataTableFilter[];\n}\n\nexport type DataTableColumn<TData, TValue> = Omit<\n  Column<TData, TValue>,\n  'columnDef'\n> & {\n  columnDef: DataTableColumnDef<TData, TValue>;\n};\n\nexport type DataTableColumnDef<TData, TValue> = ColumnDef<TData, TValue> & {\n  accessorKey: string;\n  header: string;\n  filterType?: FilterTypes;\n  dataType?: FilterValueType;\n  enableColumnFilter?: boolean;\n  enableSorting?: boolean;\n  enableHiding?: boolean;\n  defaultHidden?: boolean;\n  filterOptions?: FilterSelectOption[];\n  classNames?: {\n    cell?: string;\n    header?: string;\n  };\n  styles?: {\n    cell?: React.CSSProperties;\n    header?: React.CSSProperties;\n  };\n  enableGrouping?: boolean;\n  showGroupCount?: boolean;\n  groupCountMap?: Record<string, number>;\n  groupLabelsMap?: Record<string, string>;\n  // TODO: implement these\n  icon?: React.ReactNode;\n};\n\nexport interface DataTableProps<TData, TValue> {\n  columns: DataTableColumnDef<TData, TValue>[];\n  data: TData[];\n  query?: DataTableQuery; // Initial query (will be transformed to internal format)\n  mode?: DataTableMode;\n  isLoading?: boolean;\n  loadingRowCount?: number;\n  tableQuery?: DataTableQuery;\n  onTableQueryChange?: (query: DataTableQuery) => void;\n  defaultSort: DataTableSort;\n  onLoadMore?: () => Promise<void>;\n  onRowClick?: (row: TData) => void;\n}\n\nexport type DataTableContentProps = {\n  emptyState?: React.ReactNode;\n  classNames?: {\n    root?: string;\n    table?: string;\n    header?: string;\n    body?: string;\n    row?: string;\n  };\n};\n\nexport type TableQueryUpdateFn = (query: InternalQuery) => InternalQuery;\n\nexport type TableContextType<TData, TValue> = {\n  table: Table<TData>;\n  columns: DataTableColumnDef<TData, TValue>[];\n  isLoading?: boolean;\n  loadMoreData: () => void;\n  mode: DataTableMode;\n  defaultSort: DataTableSort;\n  tableQuery?: InternalQuery;\n  loadingRowCount?: number;\n  onDisplaySettingsReset: () => void;\n  updateTableQuery: (fn: TableQueryUpdateFn) => void;\n  onRowClick?: (row: TData) => void;\n};\n\nexport interface ColumnData {\n  label: string;\n  id: string;\n  isVisible?: boolean;\n}\n\ninterface SubRows<_T> {}\n\nexport interface GroupedData<T> extends SubRows<T> {\n  label: string;\n  group_key: string;\n  subRows: T[];\n  count?: number;\n  showGroupCount?: boolean;\n}\n\nexport const defaultGroupOption = {\n  id: '--',\n  label: 'No grouping'\n};\n"],"names":[],"mappings":";;AAWa,MAAA,UAAU,GAAG;AACxB,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,MAAM;EACH;AAwIE,MAAA,kBAAkB,GAAG;AAChC,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,KAAK,EAAE,aAAa;;;;;;"}
+{"version":3,"file":"data-table.types.cjs","sources":["../../../components/data-table/data-table.types.tsx"],"sourcesContent":["import type {\n  Column,\n  ColumnDef,\n  Table,\n  VisibilityState\n} from '@tanstack/table-core';\nimport type {\n  DataTableFilterOperatorTypes,\n  FilterOperatorTypes,\n  FilterSelectOption,\n  FilterTypes,\n  FilterValueType\n} from '~/types/filters';\n\nexport type DataTableMode = 'client' | 'server';\n\nexport const SortOrders = {\n  ASC: 'asc',\n  DESC: 'desc'\n} as const;\n\nexport interface DataTableFilterValues {\n  value: any;\n  // Only one of these value fields should be present at a time\n  boolValue?: boolean;\n  stringValue?: string;\n  numberValue?: number;\n}\n// Internal filter with UI operators and metadata\nexport interface InternalFilter extends DataTableFilterValues {\n  _type?: FilterTypes;\n  _dataType?: FilterValueType;\n  name: string;\n  operator: FilterOperatorTypes;\n}\n\n// Data table filter for backend API (no internal fields)\nexport interface DataTableFilter extends DataTableFilterValues {\n  name: string;\n  operator: DataTableFilterOperatorTypes;\n}\n\ntype SortOrdersKeys = keyof typeof SortOrders;\nexport type SortOrdersValues = (typeof SortOrders)[SortOrdersKeys];\n\nexport interface DataTableSort {\n  name: string;\n  order: SortOrdersValues;\n}\n\n// Internal query with UI operators and metadata\nexport interface InternalQuery {\n  filters?: InternalFilter[];\n  sort?: DataTableSort[];\n  group_by?: string[];\n  offset?: number;\n  limit?: number;\n  search?: string;\n}\n\n// Data table query for backend API (clean, no internal fields)\nexport interface DataTableQuery extends Omit<InternalQuery, 'filters'> {\n  filters?: DataTableFilter[];\n}\n\nexport type DataTableColumn<TData, TValue> = Omit<\n  Column<TData, TValue>,\n  'columnDef'\n> & {\n  columnDef: DataTableColumnDef<TData, TValue>;\n};\n\nexport type DataTableColumnDef<TData, TValue> = ColumnDef<TData, TValue> & {\n  accessorKey: string;\n  header: string;\n  filterType?: FilterTypes;\n  dataType?: FilterValueType;\n  enableColumnFilter?: boolean;\n  enableSorting?: boolean;\n  enableHiding?: boolean;\n  defaultHidden?: boolean;\n  filterOptions?: FilterSelectOption[];\n  classNames?: {\n    cell?: string;\n    header?: string;\n  };\n  styles?: {\n    cell?: React.CSSProperties;\n    header?: React.CSSProperties;\n  };\n  enableGrouping?: boolean;\n  showGroupCount?: boolean;\n  groupCountMap?: Record<string, number>;\n  groupLabelsMap?: Record<string, string>;\n  // TODO: implement these\n  icon?: React.ReactNode;\n};\n\nexport interface DataTableProps<TData, TValue> {\n  columns: DataTableColumnDef<TData, TValue>[];\n  data: TData[];\n  query?: DataTableQuery; // Initial query (will be transformed to internal format)\n  mode?: DataTableMode;\n  isLoading?: boolean;\n  loadingRowCount?: number;\n  tableQuery?: DataTableQuery;\n  onTableQueryChange?: (query: DataTableQuery) => void;\n  defaultSort: DataTableSort;\n  onLoadMore?: () => Promise<void>;\n  onRowClick?: (row: TData) => void;\n  onColumnVisibilityChange?: (columnVisibility: VisibilityState) => void;\n}\n\nexport type DataTableContentProps = {\n  emptyState?: React.ReactNode;\n  zeroState?: React.ReactNode;\n  classNames?: {\n    root?: string;\n    table?: string;\n    header?: string;\n    body?: string;\n    row?: string;\n  };\n};\n\nexport type TableQueryUpdateFn = (query: InternalQuery) => InternalQuery;\n\nexport type TableContextType<TData, TValue> = {\n  table: Table<TData>;\n  columns: DataTableColumnDef<TData, TValue>[];\n  isLoading?: boolean;\n  loadMoreData: () => void;\n  mode: DataTableMode;\n  defaultSort: DataTableSort;\n  tableQuery?: InternalQuery;\n  loadingRowCount?: number;\n  onDisplaySettingsReset: () => void;\n  updateTableQuery: (fn: TableQueryUpdateFn) => void;\n  onRowClick?: (row: TData) => void;\n  shouldShowFilters?: boolean;\n};\n\nexport interface ColumnData {\n  label: string;\n  id: string;\n  isVisible?: boolean;\n}\n\ninterface SubRows<_T> {}\n\nexport interface GroupedData<T> extends SubRows<T> {\n  label: string;\n  group_key: string;\n  subRows: T[];\n  count?: number;\n  showGroupCount?: boolean;\n}\n\nexport const defaultGroupOption = {\n  id: '--',\n  label: 'No grouping'\n};\n"],"names":[],"mappings":";;AAgBa,MAAA,UAAU,GAAG;AACxB,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,MAAM;EACH;AA2IE,MAAA,kBAAkB,GAAG;AAChC,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,KAAK,EAAE,aAAa;;;;;;"}

package/dist/components/data-table/data-table.types.d.ts

@@ -1,4 +1,4 @@
-import type { Column, ColumnDef, Table } from '@tanstack/table-core';
+import type { Column, ColumnDef, Table, VisibilityState } from '@tanstack/table-core';
 import type { DataTableFilterOperatorTypes, FilterOperatorTypes, FilterSelectOption, FilterTypes, FilterValueType } from '~/types/filters';
 export type DataTableMode = 'client' | 'server';
 export declare const SortOrders: {
@@ -77,9 +77,11 @@ export interface DataTableProps<TData, TValue> {
     defaultSort: DataTableSort;
     onLoadMore?: () => Promise<void>;
     onRowClick?: (row: TData) => void;
+    onColumnVisibilityChange?: (columnVisibility: VisibilityState) => void;
 }
 export type DataTableContentProps = {
     emptyState?: React.ReactNode;
+    zeroState?: React.ReactNode;
     classNames?: {
         root?: string;
         table?: string;
@@ -101,6 +103,7 @@ export type TableContextType<TData, TValue> = {
     onDisplaySettingsReset: () => void;
     updateTableQuery: (fn: TableQueryUpdateFn) => void;
     onRowClick?: (row: TData) => void;
+    shouldShowFilters?: boolean;
 };
 export interface ColumnData {
     label: string;

package/dist/components/data-table/data-table.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.types.d.ts","sourceRoot":"","sources":["../../../components/data-table/data-table.types.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"data-table.types.d.ts","sourceRoot":"","sources":["../../../components/data-table/data-table.types.tsx"],"names":[],"mappings":"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"}

package/dist/components/data-table/data-table.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.types.js","sources":["../../../components/data-table/data-table.types.tsx"],"sourcesContent":["import type { Column, ColumnDef, Table } from '@tanstack/table-core';\nimport type {\n  DataTableFilterOperatorTypes,\n  FilterOperatorTypes,\n  FilterSelectOption,\n  FilterTypes,\n  FilterValueType\n} from '~/types/filters';\n\nexport type DataTableMode = 'client' | 'server';\n\nexport const SortOrders = {\n  ASC: 'asc',\n  DESC: 'desc'\n} as const;\n\nexport interface DataTableFilterValues {\n  value: any;\n  // Only one of these value fields should be present at a time\n  boolValue?: boolean;\n  stringValue?: string;\n  numberValue?: number;\n}\n// Internal filter with UI operators and metadata\nexport interface InternalFilter extends DataTableFilterValues {\n  _type?: FilterTypes;\n  _dataType?: FilterValueType;\n  name: string;\n  operator: FilterOperatorTypes;\n}\n\n// Data table filter for backend API (no internal fields)\nexport interface DataTableFilter extends DataTableFilterValues {\n  name: string;\n  operator: DataTableFilterOperatorTypes;\n}\n\ntype SortOrdersKeys = keyof typeof SortOrders;\nexport type SortOrdersValues = (typeof SortOrders)[SortOrdersKeys];\n\nexport interface DataTableSort {\n  name: string;\n  order: SortOrdersValues;\n}\n\n// Internal query with UI operators and metadata\nexport interface InternalQuery {\n  filters?: InternalFilter[];\n  sort?: DataTableSort[];\n  group_by?: string[];\n  offset?: number;\n  limit?: number;\n  search?: string;\n}\n\n// Data table query for backend API (clean, no internal fields)\nexport interface DataTableQuery extends Omit<InternalQuery, 'filters'> {\n  filters?: DataTableFilter[];\n}\n\nexport type DataTableColumn<TData, TValue> = Omit<\n  Column<TData, TValue>,\n  'columnDef'\n> & {\n  columnDef: DataTableColumnDef<TData, TValue>;\n};\n\nexport type DataTableColumnDef<TData, TValue> = ColumnDef<TData, TValue> & {\n  accessorKey: string;\n  header: string;\n  filterType?: FilterTypes;\n  dataType?: FilterValueType;\n  enableColumnFilter?: boolean;\n  enableSorting?: boolean;\n  enableHiding?: boolean;\n  defaultHidden?: boolean;\n  filterOptions?: FilterSelectOption[];\n  classNames?: {\n    cell?: string;\n    header?: string;\n  };\n  styles?: {\n    cell?: React.CSSProperties;\n    header?: React.CSSProperties;\n  };\n  enableGrouping?: boolean;\n  showGroupCount?: boolean;\n  groupCountMap?: Record<string, number>;\n  groupLabelsMap?: Record<string, string>;\n  // TODO: implement these\n  icon?: React.ReactNode;\n};\n\nexport interface DataTableProps<TData, TValue> {\n  columns: DataTableColumnDef<TData, TValue>[];\n  data: TData[];\n  query?: DataTableQuery; // Initial query (will be transformed to internal format)\n  mode?: DataTableMode;\n  isLoading?: boolean;\n  loadingRowCount?: number;\n  tableQuery?: DataTableQuery;\n  onTableQueryChange?: (query: DataTableQuery) => void;\n  defaultSort: DataTableSort;\n  onLoadMore?: () => Promise<void>;\n  onRowClick?: (row: TData) => void;\n}\n\nexport type DataTableContentProps = {\n  emptyState?: React.ReactNode;\n  classNames?: {\n    root?: string;\n    table?: string;\n    header?: string;\n    body?: string;\n    row?: string;\n  };\n};\n\nexport type TableQueryUpdateFn = (query: InternalQuery) => InternalQuery;\n\nexport type TableContextType<TData, TValue> = {\n  table: Table<TData>;\n  columns: DataTableColumnDef<TData, TValue>[];\n  isLoading?: boolean;\n  loadMoreData: () => void;\n  mode: DataTableMode;\n  defaultSort: DataTableSort;\n  tableQuery?: InternalQuery;\n  loadingRowCount?: number;\n  onDisplaySettingsReset: () => void;\n  updateTableQuery: (fn: TableQueryUpdateFn) => void;\n  onRowClick?: (row: TData) => void;\n};\n\nexport interface ColumnData {\n  label: string;\n  id: string;\n  isVisible?: boolean;\n}\n\ninterface SubRows<_T> {}\n\nexport interface GroupedData<T> extends SubRows<T> {\n  label: string;\n  group_key: string;\n  subRows: T[];\n  count?: number;\n  showGroupCount?: boolean;\n}\n\nexport const defaultGroupOption = {\n  id: '--',\n  label: 'No grouping'\n};\n"],"names":[],"mappings":"AAWa,MAAA,UAAU,GAAG;AACxB,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,MAAM;EACH;AAwIE,MAAA,kBAAkB,GAAG;AAChC,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,KAAK,EAAE,aAAa;;;;;"}
+{"version":3,"file":"data-table.types.js","sources":["../../../components/data-table/data-table.types.tsx"],"sourcesContent":["import type {\n  Column,\n  ColumnDef,\n  Table,\n  VisibilityState\n} from '@tanstack/table-core';\nimport type {\n  DataTableFilterOperatorTypes,\n  FilterOperatorTypes,\n  FilterSelectOption,\n  FilterTypes,\n  FilterValueType\n} from '~/types/filters';\n\nexport type DataTableMode = 'client' | 'server';\n\nexport const SortOrders = {\n  ASC: 'asc',\n  DESC: 'desc'\n} as const;\n\nexport interface DataTableFilterValues {\n  value: any;\n  // Only one of these value fields should be present at a time\n  boolValue?: boolean;\n  stringValue?: string;\n  numberValue?: number;\n}\n// Internal filter with UI operators and metadata\nexport interface InternalFilter extends DataTableFilterValues {\n  _type?: FilterTypes;\n  _dataType?: FilterValueType;\n  name: string;\n  operator: FilterOperatorTypes;\n}\n\n// Data table filter for backend API (no internal fields)\nexport interface DataTableFilter extends DataTableFilterValues {\n  name: string;\n  operator: DataTableFilterOperatorTypes;\n}\n\ntype SortOrdersKeys = keyof typeof SortOrders;\nexport type SortOrdersValues = (typeof SortOrders)[SortOrdersKeys];\n\nexport interface DataTableSort {\n  name: string;\n  order: SortOrdersValues;\n}\n\n// Internal query with UI operators and metadata\nexport interface InternalQuery {\n  filters?: InternalFilter[];\n  sort?: DataTableSort[];\n  group_by?: string[];\n  offset?: number;\n  limit?: number;\n  search?: string;\n}\n\n// Data table query for backend API (clean, no internal fields)\nexport interface DataTableQuery extends Omit<InternalQuery, 'filters'> {\n  filters?: DataTableFilter[];\n}\n\nexport type DataTableColumn<TData, TValue> = Omit<\n  Column<TData, TValue>,\n  'columnDef'\n> & {\n  columnDef: DataTableColumnDef<TData, TValue>;\n};\n\nexport type DataTableColumnDef<TData, TValue> = ColumnDef<TData, TValue> & {\n  accessorKey: string;\n  header: string;\n  filterType?: FilterTypes;\n  dataType?: FilterValueType;\n  enableColumnFilter?: boolean;\n  enableSorting?: boolean;\n  enableHiding?: boolean;\n  defaultHidden?: boolean;\n  filterOptions?: FilterSelectOption[];\n  classNames?: {\n    cell?: string;\n    header?: string;\n  };\n  styles?: {\n    cell?: React.CSSProperties;\n    header?: React.CSSProperties;\n  };\n  enableGrouping?: boolean;\n  showGroupCount?: boolean;\n  groupCountMap?: Record<string, number>;\n  groupLabelsMap?: Record<string, string>;\n  // TODO: implement these\n  icon?: React.ReactNode;\n};\n\nexport interface DataTableProps<TData, TValue> {\n  columns: DataTableColumnDef<TData, TValue>[];\n  data: TData[];\n  query?: DataTableQuery; // Initial query (will be transformed to internal format)\n  mode?: DataTableMode;\n  isLoading?: boolean;\n  loadingRowCount?: number;\n  tableQuery?: DataTableQuery;\n  onTableQueryChange?: (query: DataTableQuery) => void;\n  defaultSort: DataTableSort;\n  onLoadMore?: () => Promise<void>;\n  onRowClick?: (row: TData) => void;\n  onColumnVisibilityChange?: (columnVisibility: VisibilityState) => void;\n}\n\nexport type DataTableContentProps = {\n  emptyState?: React.ReactNode;\n  zeroState?: React.ReactNode;\n  classNames?: {\n    root?: string;\n    table?: string;\n    header?: string;\n    body?: string;\n    row?: string;\n  };\n};\n\nexport type TableQueryUpdateFn = (query: InternalQuery) => InternalQuery;\n\nexport type TableContextType<TData, TValue> = {\n  table: Table<TData>;\n  columns: DataTableColumnDef<TData, TValue>[];\n  isLoading?: boolean;\n  loadMoreData: () => void;\n  mode: DataTableMode;\n  defaultSort: DataTableSort;\n  tableQuery?: InternalQuery;\n  loadingRowCount?: number;\n  onDisplaySettingsReset: () => void;\n  updateTableQuery: (fn: TableQueryUpdateFn) => void;\n  onRowClick?: (row: TData) => void;\n  shouldShowFilters?: boolean;\n};\n\nexport interface ColumnData {\n  label: string;\n  id: string;\n  isVisible?: boolean;\n}\n\ninterface SubRows<_T> {}\n\nexport interface GroupedData<T> extends SubRows<T> {\n  label: string;\n  group_key: string;\n  subRows: T[];\n  count?: number;\n  showGroupCount?: boolean;\n}\n\nexport const defaultGroupOption = {\n  id: '--',\n  label: 'No grouping'\n};\n"],"names":[],"mappings":"AAgBa,MAAA,UAAU,GAAG;AACxB,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,MAAM;EACH;AA2IE,MAAA,kBAAkB,GAAG;AAChC,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,KAAK,EAAE,aAAa;;;;;"}

package/dist/components/data-table/hooks/useFilters.cjs

@@ -1,8 +1,8 @@
 'use strict';
 
-var useDataTable = require('./useDataTable.cjs');
 var filters = require('../../../types/filters.cjs');
 var filterOperations = require('../utils/filter-operations.cjs');
+var useDataTable = require('./useDataTable.cjs');
 
 function useFilters() {
     const { updateTableQuery } = useDataTable.useDataTable();
@@ -17,8 +17,8 @@ function useFilters() {
             ? new Date()
             : filterType === filters.FilterType.select
                 ? options[0].value
-                : "";
-        updateTableQuery((query) => {
+                : '';
+        updateTableQuery(query => {
             return {
                 ...query,
                 filters: [
@@ -29,43 +29,43 @@ function useFilters() {
                         _type: filterType,
                         name: id,
                         value: defaultValue,
-                        operator: defaultFilter.value,
-                    },
-                ],
+                        operator: defaultFilter.value
+                    }
+                ]
             };
         });
     }
     function handleRemoveFilter(columnId) {
-        updateTableQuery((query) => {
+        updateTableQuery(query => {
             return {
                 ...query,
-                filters: query.filters?.filter((filter) => filter.name !== columnId),
+                filters: query.filters?.filter(filter => filter.name !== columnId)
             };
         });
     }
     function handleFilterValueChange(columnId, value) {
-        updateTableQuery((query) => {
+        updateTableQuery(query => {
             return {
                 ...query,
-                filters: query.filters?.map((filter) => {
+                filters: query.filters?.map(filter => {
                     if (filter.name === columnId) {
                         return { ...filter, value };
                     }
                     return filter;
-                }),
+                })
             };
         });
     }
     function handleFilterOperationChange(columnId, operator) {
-        updateTableQuery((query) => {
+        updateTableQuery(query => {
             return {
                 ...query,
-                filters: query.filters?.map((filter) => {
+                filters: query.filters?.map(filter => {
                     if (filter.name === columnId) {
                         return { ...filter, operator };
                     }
                     return filter;
-                }),
+                })
             };
         });
     }
@@ -73,7 +73,7 @@ function useFilters() {
         onAddFilter,
         handleRemoveFilter,
         handleFilterValueChange,
-        handleFilterOperationChange,
+        handleFilterOperationChange
     };
 }
 

package/dist/components/data-table/hooks/useFilters.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useFilters.cjs","sources":["../../../../components/data-table/hooks/useFilters.tsx"],"sourcesContent":["import { useDataTable } from \"./useDataTable\";\nimport {\n  filterOperators,\n  FilterOperatorTypes,\n  FilterType,\n} from \"~/types/filters\";\nimport { DataTableColumn } from \"../data-table.types\";\nimport { getDataType } from \"../utils/filter-operations\";\n\nexport function useFilters<TData, TValue>() {\n  const { updateTableQuery } = useDataTable();\n\n  function onAddFilter(column: DataTableColumn<TData, TValue>) {\n    const columnDef = column.columnDef;\n    const id = columnDef.accessorKey || column.id;\n    const options = columnDef.filterOptions || [];\n    const filterType = columnDef.filterType || FilterType.string;\n    const dataType = getDataType({ filterType, dataType: columnDef.dataType });\n    const defaultFilter = filterOperators[filterType][0];\n    const defaultValue =\n      filterType === FilterType.date\n        ? new Date()\n        : filterType === FilterType.select\n        ? options[0].value\n        : \"\";\n\n    updateTableQuery((query) => {\n      return {\n        ...query,\n        filters: [\n          ...(query.filters || []),\n          // TODO: Add default filter value in column definition\n          {\n            _dataType: dataType,\n            _type: filterType,\n            name: id,\n            value: defaultValue,\n            operator: defaultFilter.value,\n          },\n        ],\n      };\n    });\n  }\n\n  function handleRemoveFilter(columnId: string) {\n    updateTableQuery((query) => {\n      return {\n        ...query,\n        filters: query.filters?.filter((filter) => filter.name !== columnId),\n      };\n    });\n  }\n\n  function handleFilterValueChange(columnId: string, value: any) {\n    updateTableQuery((query) => {\n      return {\n        ...query,\n        filters: query.filters?.map((filter) => {\n          if (filter.name === columnId) {\n            return { ...filter, value };\n          }\n          return filter;\n        }),\n      };\n    });\n  }\n\n  function handleFilterOperationChange(\n    columnId: string,\n    operator: FilterOperatorTypes\n  ) {\n    updateTableQuery((query) => {\n      return {\n        ...query,\n        filters: query.filters?.map((filter) => {\n          if (filter.name === columnId) {\n            return { ...filter, operator };\n          }\n          return filter;\n        }),\n      };\n    });\n  }\n\n  return {\n    onAddFilter,\n    handleRemoveFilter,\n    handleFilterValueChange,\n    handleFilterOperationChange,\n  };\n}\n"],"names":["useDataTable","FilterType","getDataType","filterOperators"],"mappings":"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"}
+{"version":3,"file":"useFilters.cjs","sources":["../../../../components/data-table/hooks/useFilters.tsx"],"sourcesContent":["import {\n  FilterOperatorTypes,\n  FilterType,\n  filterOperators\n} from '~/types/filters';\nimport { DataTableColumn } from '../data-table.types';\nimport { getDataType } from '../utils/filter-operations';\nimport { useDataTable } from './useDataTable';\n\nexport function useFilters<TData, TValue>() {\n  const { updateTableQuery } = useDataTable();\n\n  function onAddFilter(column: DataTableColumn<TData, TValue>) {\n    const columnDef = column.columnDef;\n    const id = columnDef.accessorKey || column.id;\n    const options = columnDef.filterOptions || [];\n    const filterType = columnDef.filterType || FilterType.string;\n    const dataType = getDataType({ filterType, dataType: columnDef.dataType });\n    const defaultFilter = filterOperators[filterType][0];\n    const defaultValue =\n      filterType === FilterType.date\n        ? new Date()\n        : filterType === FilterType.select\n          ? options[0].value\n          : '';\n\n    updateTableQuery(query => {\n      return {\n        ...query,\n        filters: [\n          ...(query.filters || []),\n          // TODO: Add default filter value in column definition\n          {\n            _dataType: dataType,\n            _type: filterType,\n            name: id,\n            value: defaultValue,\n            operator: defaultFilter.value\n          }\n        ]\n      };\n    });\n  }\n\n  function handleRemoveFilter(columnId: string) {\n    updateTableQuery(query => {\n      return {\n        ...query,\n        filters: query.filters?.filter(filter => filter.name !== columnId)\n      };\n    });\n  }\n\n  function handleFilterValueChange(columnId: string, value: any) {\n    updateTableQuery(query => {\n      return {\n        ...query,\n        filters: query.filters?.map(filter => {\n          if (filter.name === columnId) {\n            return { ...filter, value };\n          }\n          return filter;\n        })\n      };\n    });\n  }\n\n  function handleFilterOperationChange(\n    columnId: string,\n    operator: FilterOperatorTypes\n  ) {\n    updateTableQuery(query => {\n      return {\n        ...query,\n        filters: query.filters?.map(filter => {\n          if (filter.name === columnId) {\n            return { ...filter, operator };\n          }\n          return filter;\n        })\n      };\n    });\n  }\n\n  return {\n    onAddFilter,\n    handleRemoveFilter,\n    handleFilterValueChange,\n    handleFilterOperationChange\n  };\n}\n"],"names":["useDataTable","FilterType","getDataType","filterOperators"],"mappings":";;;;;;SASgB,UAAU,GAAA;AACxB,IAAA,MAAM,EAAE,gBAAgB,EAAE,GAAGA,yBAAY,EAAE,CAAC;IAE5C,SAAS,WAAW,CAAC,MAAsC,EAAA;AACzD,QAAA,MAAM,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC;QACnC,MAAM,EAAE,GAAG,SAAS,CAAC,WAAW,IAAI,MAAM,CAAC,EAAE,CAAC;AAC9C,QAAA,MAAM,OAAO,GAAG,SAAS,CAAC,aAAa,IAAI,EAAE,CAAC;QAC9C,MAAM,UAAU,GAAG,SAAS,CAAC,UAAU,IAAIC,kBAAU,CAAC,MAAM,CAAC;AAC7D,QAAA,MAAM,QAAQ,GAAGC,4BAAW,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,CAAC,QAAQ,EAAE,CAAC,CAAC;QAC3E,MAAM,aAAa,GAAGC,uBAAe,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;AACrD,QAAA,MAAM,YAAY,GAChB,UAAU,KAAKF,kBAAU,CAAC,IAAI;cAC1B,IAAI,IAAI,EAAE;AACZ,cAAE,UAAU,KAAKA,kBAAU,CAAC,MAAM;AAChC,kBAAE,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK;kBAChB,EAAE,CAAC;QAEX,gBAAgB,CAAC,KAAK,IAAG;YACvB,OAAO;AACL,gBAAA,GAAG,KAAK;AACR,gBAAA,OAAO,EAAE;AACP,oBAAA,IAAI,KAAK,CAAC,OAAO,IAAI,EAAE,CAAC;;AAExB,oBAAA;AACE,wBAAA,SAAS,EAAE,QAAQ;AACnB,wBAAA,KAAK,EAAE,UAAU;AACjB,wBAAA,IAAI,EAAE,EAAE;AACR,wBAAA,KAAK,EAAE,YAAY;wBACnB,QAAQ,EAAE,aAAa,CAAC,KAAK;AAC9B,qBAAA;AACF,iBAAA;aACF,CAAC;AACJ,SAAC,CAAC,CAAC;KACJ;IAED,SAAS,kBAAkB,CAAC,QAAgB,EAAA;QAC1C,gBAAgB,CAAC,KAAK,IAAG;YACvB,OAAO;AACL,gBAAA,GAAG,KAAK;AACR,gBAAA,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,MAAM,CAAC,MAAM,IAAI,MAAM,CAAC,IAAI,KAAK,QAAQ,CAAC;aACnE,CAAC;AACJ,SAAC,CAAC,CAAC;KACJ;AAED,IAAA,SAAS,uBAAuB,CAAC,QAAgB,EAAE,KAAU,EAAA;QAC3D,gBAAgB,CAAC,KAAK,IAAG;YACvB,OAAO;AACL,gBAAA,GAAG,KAAK;gBACR,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,IAAG;AACnC,oBAAA,IAAI,MAAM,CAAC,IAAI,KAAK,QAAQ,EAAE;AAC5B,wBAAA,OAAO,EAAE,GAAG,MAAM,EAAE,KAAK,EAAE,CAAC;qBAC7B;AACD,oBAAA,OAAO,MAAM,CAAC;AAChB,iBAAC,CAAC;aACH,CAAC;AACJ,SAAC,CAAC,CAAC;KACJ;AAED,IAAA,SAAS,2BAA2B,CAClC,QAAgB,EAChB,QAA6B,EAAA;QAE7B,gBAAgB,CAAC,KAAK,IAAG;YACvB,OAAO;AACL,gBAAA,GAAG,KAAK;gBACR,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,IAAG;AACnC,oBAAA,IAAI,MAAM,CAAC,IAAI,KAAK,QAAQ,EAAE;AAC5B,wBAAA,OAAO,EAAE,GAAG,MAAM,EAAE,QAAQ,EAAE,CAAC;qBAChC;AACD,oBAAA,OAAO,MAAM,CAAC;AAChB,iBAAC,CAAC;aACH,CAAC;AACJ,SAAC,CAAC,CAAC;KACJ;IAED,OAAO;QACL,WAAW;QACX,kBAAkB;QAClB,uBAAuB;QACvB,2BAA2B;KAC5B,CAAC;AACJ;;;;"}