@rafal.lemieszewski/tide-ui 0.43.0 → 0.44.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,9 +1,8 @@
1
1
  import { VariantProps } from 'class-variance-authority';
2
2
  import * as React from "react";
3
3
  declare const badgeVariants: (props?: ({
4
- variant?: "default" | "destructive" | "secondary" | "outline" | null | undefined;
5
4
  intent?: "success" | "warning" | "destructive" | "magenta" | "violet" | "information" | "neutral" | "brand" | null | undefined;
6
- appearance?: "solid" | "outline" | "subtle" | null | undefined;
5
+ appearance?: "solid" | "subtle" | "outline" | null | undefined;
7
6
  size?: "sm" | "md" | "lg" | null | undefined;
8
7
  } & import('class-variance-authority/types').ClassProp) | undefined) => string;
9
8
  export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
@@ -2,7 +2,7 @@ import { default as React } from 'react';
2
2
  import { VariantProps } from 'class-variance-authority';
3
3
  import { IconType } from './icon';
4
4
  declare const buttonVariants: (props?: ({
5
- variant?: "default" | "success" | "destructive" | "secondary" | "primary" | "ghost" | null | undefined;
5
+ variant?: "default" | "success" | "destructive" | "primary" | "secondary" | "ghost" | null | undefined;
6
6
  size?: "sm" | "md" | "lg" | null | undefined;
7
7
  iconPosition?: "none" | "left" | "right" | "only" | null | undefined;
8
8
  } & import('class-variance-authority/types').ClassProp) | undefined) => string;
@@ -40,9 +40,35 @@ declare module '@tanstack/react-table' {
40
40
  align?: 'left' | 'right';
41
41
  truncate?: boolean;
42
42
  }
43
+ interface ColumnDefBase<TData extends unknown, TValue = unknown> {
44
+ /**
45
+ * Custom cell renderer for section header rows.
46
+ * Similar to aggregatedCell for grouped rows, this allows rendering
47
+ * custom content for rows that act as section headers.
48
+ *
49
+ * When this returns non-null content, the row is treated as a section header:
50
+ * - The cell spans the full table width (colSpan = all columns)
51
+ * - Appropriate section header styling is applied
52
+ * - Other cells in the row are not rendered
53
+ *
54
+ * @example
55
+ * {
56
+ * id: 'broker',
57
+ * accessorKey: 'broker',
58
+ * sectionHeaderCell: ({ row }) => {
59
+ * if (row.original.isSectionHeader) {
60
+ * return <div>Section: {row.original.name}</div>
61
+ * }
62
+ * return null
63
+ * }
64
+ * }
65
+ */
66
+ sectionHeaderCell?: (info: any) => React.ReactNode;
67
+ }
43
68
  }
44
69
  declare const fuzzyFilter: FilterFn<any>;
45
70
  declare const multiSelectFilter: FilterFn<any>;
71
+ declare const groupPreservingGlobalFilter: FilterFn<any>;
46
72
  interface DataTableSkeletonProps {
47
73
  columns: number;
48
74
  rows: number;
@@ -76,8 +102,9 @@ interface DataTablePaginationProps<_TData = any> {
76
102
  table: any;
77
103
  enableGrouping?: boolean;
78
104
  hideChildrenForSingleItemGroups?: Record<string, boolean>;
105
+ footerLabel?: React.ReactNode;
79
106
  }
80
- declare function DataTablePagination<TData>({ table, enableGrouping, hideChildrenForSingleItemGroups }: DataTablePaginationProps<TData>): import("react/jsx-runtime").JSX.Element;
107
+ declare function DataTablePagination<TData>({ table, enableGrouping, hideChildrenForSingleItemGroups, footerLabel }: DataTablePaginationProps<TData>): import("react/jsx-runtime").JSX.Element;
81
108
  export type BorderStyle = "vertical" | "horizontal" | "both" | "none";
82
109
  export interface DataTableProps<TData, TValue> {
83
110
  columns: ColumnDef<TData, TValue>[];
@@ -104,6 +131,22 @@ export interface DataTableProps<TData, TValue> {
104
131
  globalSearchPlaceholder?: string;
105
132
  enableExpanding?: boolean;
106
133
  getSubRows?: (row: TData) => TData[] | undefined;
134
+ /**
135
+ * Custom color overrides for expanding rows at different depths and states.
136
+ * If not provided, uses smart context-aware defaults that match grouping colors.
137
+ *
138
+ * @example
139
+ * expandingRowColors={{
140
+ * expandedParent: 'var(--blue-50)',
141
+ * collapsedParent: 'var(--color-background-neutral-subtle)',
142
+ * children: 'var(--blue-25)'
143
+ * }}
144
+ */
145
+ expandingRowColors?: {
146
+ expandedParent?: string;
147
+ collapsedParent?: string;
148
+ children?: string;
149
+ };
107
150
  enableGrouping?: boolean;
108
151
  groupedColumnMode?: 'reorder' | 'remove' | false;
109
152
  enableManualGrouping?: boolean;
@@ -162,6 +205,8 @@ export interface DataTableProps<TData, TValue> {
162
205
  enableRowSelection?: boolean;
163
206
  showHeader?: boolean;
164
207
  showPagination?: boolean;
208
+ /** Custom content to display in the table footer, useful for showing filtered item counts or other status information */
209
+ footerLabel?: React.ReactNode;
165
210
  onTableReady?: (table: any) => void;
166
211
  initialState?: {
167
212
  grouping?: GroupingState;
@@ -219,8 +264,14 @@ export interface DataTableProps<TData, TValue> {
219
264
  * Default: applies cursor-pointer and hover background if onRowClick is provided
220
265
  */
221
266
  clickableRowClassName?: string;
267
+ /**
268
+ * When enabled with grouping, preserves entire groups during global search.
269
+ * If any row in a group matches, the entire group is shown and auto-expanded.
270
+ * Also enables highlighting of matched search terms.
271
+ */
272
+ groupPreservingSearch?: boolean;
222
273
  }
223
- export declare function DataTable<TData, TValue>({ columns, data, searchKey, searchPlaceholder, title, className, stickyHeader, stickyFirstColumn, stickyLeftColumns, stickyRightColumns, enableResponsiveWrapper, showScrollIndicators, isLoading, loadingRowCount, borderStyle, enableGlobalSearch, globalSearchPlaceholder, enableGlobalFaceting, enableColumnResizing, columnResizeMode, enableColumnResizePersistence, storageKey, enableExpanding, getSubRows, enableGrouping, groupedColumnMode, enableManualGrouping, groupDisplayColumn, hideChildrenForSingleItemGroups, hideExpanderForSingleItemGroups, enableRowPinning, keepPinnedRows, enableVirtualization, nestedHeaders, enableNestedHeaders, enableColumnOrdering, enableRowSelection, showHeader, showPagination, onTableReady, initialState, sorting: controlledSorting, onSortingChange: onControlledSortingChange, columnVisibility: controlledColumnVisibility, onColumnVisibilityChange: onControlledColumnVisibilityChange, grouping: controlledGrouping, onGroupingChange: onControlledGroupingChange, columnOrder: controlledColumnOrder, onColumnOrderChange: onControlledColumnOrderChange, columnSizing: controlledColumnSizing, onColumnSizingChange: onControlledColumnSizingChange, renderSectionHeaderRow, autoExpandChildren, onRowClick, isRowClickable, clickableRowClassName, }: DataTableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
224
- export { DataTableColumnHeader, DataTableFilter, DataTableToolbar, DataTablePagination, DataTableSkeleton, fuzzyFilter, multiSelectFilter };
274
+ export declare function DataTable<TData, TValue>({ columns, data, searchKey, searchPlaceholder, title, className, stickyHeader, stickyFirstColumn, stickyLeftColumns, stickyRightColumns, enableResponsiveWrapper, showScrollIndicators, isLoading, loadingRowCount, borderStyle, enableGlobalSearch, globalSearchPlaceholder, enableGlobalFaceting, enableColumnResizing, columnResizeMode, enableColumnResizePersistence, storageKey, enableExpanding, getSubRows, expandingRowColors, enableGrouping, groupedColumnMode, enableManualGrouping, groupDisplayColumn, hideChildrenForSingleItemGroups, hideExpanderForSingleItemGroups, enableRowPinning, keepPinnedRows, enableVirtualization, nestedHeaders, enableNestedHeaders, enableColumnOrdering, enableRowSelection, showHeader, showPagination, footerLabel, onTableReady, initialState, sorting: controlledSorting, onSortingChange: onControlledSortingChange, columnVisibility: controlledColumnVisibility, onColumnVisibilityChange: onControlledColumnVisibilityChange, grouping: controlledGrouping, onGroupingChange: onControlledGroupingChange, columnOrder: controlledColumnOrder, onColumnOrderChange: onControlledColumnOrderChange, columnSizing: controlledColumnSizing, onColumnSizingChange: onControlledColumnSizingChange, renderSectionHeaderRow, autoExpandChildren, onRowClick, isRowClickable, clickableRowClassName, groupPreservingSearch, }: DataTableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
275
+ export { DataTableColumnHeader, DataTableFilter, DataTableToolbar, DataTablePagination, DataTableSkeleton, fuzzyFilter, multiSelectFilter, groupPreservingGlobalFilter };
225
276
  export { useReactTable } from '@tanstack/react-table';
226
277
  export type { SortingState, ColumnFiltersState, VisibilityState, ExpandedState, GroupingState, ColumnOrderState, FilterFn, ColumnResizeMode, } from '@tanstack/react-table';
@@ -2,7 +2,7 @@ import { VariantProps } from 'class-variance-authority';
2
2
  import * as React from "react";
3
3
  declare const spinnerVariants: (props?: ({
4
4
  size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | null | undefined;
5
- variant?: "default" | "success" | "warning" | "error" | "secondary" | "primary" | "tertiary" | "disabled" | "inverse" | null | undefined;
5
+ variant?: "default" | "success" | "warning" | "error" | "primary" | "secondary" | "tertiary" | "disabled" | "inverse" | null | undefined;
6
6
  speed?: "normal" | "slow" | "fast" | null | undefined;
7
7
  } & import('class-variance-authority/types').ClassProp) | undefined) => string;
8
8
  export interface SpinnerProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof spinnerVariants> {