@toolbox-web/grid 0.2.6 → 0.2.8

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.
Files changed (52) hide show
  1. package/all.d.ts +434 -61
  2. package/all.js +844 -541
  3. package/all.js.map +1 -1
  4. package/index-YjW60MHD.js +3235 -0
  5. package/index-YjW60MHD.js.map +1 -0
  6. package/index.d.ts +210 -6
  7. package/index.js +25 -3194
  8. package/index.js.map +1 -1
  9. package/lib/plugins/clipboard/index.js.map +1 -1
  10. package/lib/plugins/column-virtualization/index.js.map +1 -1
  11. package/lib/plugins/context-menu/index.js.map +1 -1
  12. package/lib/plugins/export/index.js.map +1 -1
  13. package/lib/plugins/filtering/index.js +183 -148
  14. package/lib/plugins/filtering/index.js.map +1 -1
  15. package/lib/plugins/grouping-columns/index.js.map +1 -1
  16. package/lib/plugins/grouping-rows/index.js +116 -82
  17. package/lib/plugins/grouping-rows/index.js.map +1 -1
  18. package/lib/plugins/master-detail/index.js +139 -81
  19. package/lib/plugins/master-detail/index.js.map +1 -1
  20. package/lib/plugins/multi-sort/index.js +17 -17
  21. package/lib/plugins/multi-sort/index.js.map +1 -1
  22. package/lib/plugins/pinned-columns/index.js.map +1 -1
  23. package/lib/plugins/pinned-rows/index.js.map +1 -1
  24. package/lib/plugins/pivot/index.js +369 -337
  25. package/lib/plugins/pivot/index.js.map +1 -1
  26. package/lib/plugins/reorder/index.js +264 -91
  27. package/lib/plugins/reorder/index.js.map +1 -1
  28. package/lib/plugins/selection/index.js.map +1 -1
  29. package/lib/plugins/server-side/index.js.map +1 -1
  30. package/lib/plugins/tree/index.js +180 -169
  31. package/lib/plugins/tree/index.js.map +1 -1
  32. package/lib/plugins/undo-redo/index.js.map +1 -1
  33. package/lib/plugins/visibility/index.js.map +1 -1
  34. package/package.json +1 -1
  35. package/umd/grid.all.umd.js +21 -21
  36. package/umd/grid.all.umd.js.map +1 -1
  37. package/umd/grid.umd.js +12 -12
  38. package/umd/grid.umd.js.map +1 -1
  39. package/umd/plugins/filtering.umd.js +1 -1
  40. package/umd/plugins/filtering.umd.js.map +1 -1
  41. package/umd/plugins/grouping-rows.umd.js +1 -1
  42. package/umd/plugins/grouping-rows.umd.js.map +1 -1
  43. package/umd/plugins/master-detail.umd.js +1 -1
  44. package/umd/plugins/master-detail.umd.js.map +1 -1
  45. package/umd/plugins/multi-sort.umd.js +1 -1
  46. package/umd/plugins/multi-sort.umd.js.map +1 -1
  47. package/umd/plugins/pivot.umd.js +1 -1
  48. package/umd/plugins/pivot.umd.js.map +1 -1
  49. package/umd/plugins/reorder.umd.js +1 -1
  50. package/umd/plugins/reorder.umd.js.map +1 -1
  51. package/umd/plugins/tree.umd.js +1 -1
  52. package/umd/plugins/tree.umd.js.map +1 -1
package/all.d.ts CHANGED
@@ -130,6 +130,48 @@ export declare const aggregatorRegistry: {
130
130
  list(): string[];
131
131
  };
132
132
 
133
+ /**
134
+ * Grid-wide animation configuration.
135
+ * Controls global animation behavior - individual plugins define their own animation styles.
136
+ * Duration and easing values set corresponding CSS variables on the grid element.
137
+ */
138
+ export declare interface AnimationConfig {
139
+ /**
140
+ * Global animation mode.
141
+ * @default 'reduced-motion'
142
+ */
143
+ mode?: AnimationMode;
144
+ /**
145
+ * Default animation duration in milliseconds.
146
+ * Sets `--tbw-animation-duration` CSS variable.
147
+ * @default 200
148
+ */
149
+ duration?: number;
150
+ /**
151
+ * Default easing function.
152
+ * Sets `--tbw-animation-easing` CSS variable.
153
+ * @default 'ease-out'
154
+ */
155
+ easing?: string;
156
+ }
157
+
158
+ /**
159
+ * Animation behavior mode.
160
+ * - `true` or `'on'`: Animations always enabled
161
+ * - `false` or `'off'`: Animations always disabled
162
+ * - `'reduced-motion'`: Respects `prefers-reduced-motion` media query (default)
163
+ */
164
+ export declare type AnimationMode = boolean | 'on' | 'off' | 'reduced-motion';
165
+
166
+ /**
167
+ * Animation style for visual transitions.
168
+ * - `'slide'`: Slide/transform animation (e.g., expand down, slide left/right)
169
+ * - `'fade'`: Opacity fade animation
170
+ * - `'flip'`: FLIP technique for position changes (First, Last, Invert, Play)
171
+ * - `false`: No animation for this specific feature
172
+ */
173
+ export declare type AnimationStyle = 'slide' | 'fade' | 'flip' | false;
174
+
133
175
  /**
134
176
  * Base contract for a column. Public; kept intentionally lean so host apps can extend via intersection types.
135
177
  * Prefer adding optional properties here only when broadly useful to most grids.
@@ -1361,6 +1403,12 @@ declare abstract class BaseGridPlugin_2<TConfig = unknown> implements GridPlugin
1361
1403
  getHeaderContent?(): HeaderContentDefinition_2 | undefined;
1362
1404
  }
1363
1405
 
1406
+ /**
1407
+ * Built-in sort implementation using column comparator or default.
1408
+ * This is the default sortHandler when none is configured.
1409
+ */
1410
+ export declare function builtInSort<T>(rows: T[], sortState: SortState, columns: ColumnConfig<T>[]): T[];
1411
+
1364
1412
  /**
1365
1413
  * Cell click event
1366
1414
  */
@@ -2291,12 +2339,21 @@ declare interface DataRowModelItem {
2291
2339
  rowIndex: number;
2292
2340
  }
2293
2341
 
2342
+ /** Default animation configuration */
2343
+ export declare const DEFAULT_ANIMATION_CONFIG: Required<Omit<AnimationConfig, 'sort'>>;
2344
+
2294
2345
  /** Default icons used when not overridden */
2295
2346
  export declare const DEFAULT_GRID_ICONS: Required<GridIcons>;
2296
2347
 
2297
2348
  /** Default icons used when not overridden */
2298
2349
  declare const DEFAULT_GRID_ICONS_2: Required<GridIcons_2>;
2299
2350
 
2351
+ /**
2352
+ * Default comparator for sorting values.
2353
+ * Handles nulls (pushed to end), numbers, and string fallback.
2354
+ */
2355
+ export declare function defaultComparator(a: unknown, b: unknown): number;
2356
+
2300
2357
  export declare type DGEventName = (typeof DGEvents)[keyof typeof DGEvents];
2301
2358
 
2302
2359
  export declare const DGEvents: {
@@ -2352,6 +2409,42 @@ declare interface EditorExecContext<T = any> extends CellContext<T> {
2352
2409
  cancel: () => void;
2353
2410
  }
2354
2411
 
2412
+ /** Animation style for expand/collapse */
2413
+ declare type ExpandCollapseAnimation = false | 'slide' | 'fade';
2414
+
2415
+ /**
2416
+ * Master/Detail Plugin Types
2417
+ *
2418
+ * Type definitions for expandable detail rows showing additional content.
2419
+ */
2420
+ /** Animation style for expand/collapse */
2421
+ declare type ExpandCollapseAnimation_2 = false | 'slide' | 'fade';
2422
+
2423
+ /** Animation style for expand/collapse */
2424
+ declare type ExpandCollapseAnimation_2_2 = false | 'slide' | 'fade';
2425
+
2426
+ /** Animation style for expand/collapse */
2427
+ declare type ExpandCollapseAnimation_3 = false | 'slide' | 'fade';
2428
+
2429
+ /** Animation style for expand/collapse */
2430
+ declare type ExpandCollapseAnimation_3_2 = false | 'slide' | 'fade';
2431
+
2432
+ /**
2433
+ * Tree Data Plugin Types
2434
+ *
2435
+ * Type definitions for hierarchical tree data with expand/collapse functionality.
2436
+ */
2437
+ /** Animation style for expand/collapse */
2438
+ declare type ExpandCollapseAnimation_4 = false | 'slide' | 'fade';
2439
+
2440
+ /**
2441
+ * Tree Data Plugin Types
2442
+ *
2443
+ * Type definitions for hierarchical tree data with expand/collapse functionality.
2444
+ */
2445
+ /** Animation style for expand/collapse */
2446
+ declare type ExpandCollapseAnimation_5 = false | 'slide' | 'fade';
2447
+
2355
2448
  /** Configuration options for the export plugin */
2356
2449
  declare interface ExportConfig {
2357
2450
  /** Default file name for exports (default: 'export') */
@@ -2492,7 +2585,7 @@ export declare interface ExternalMountViewDetail<TRow = unknown> {
2492
2585
  }
2493
2586
 
2494
2587
  /** Configuration options for the filtering plugin */
2495
- export declare interface FilterConfig {
2588
+ export declare interface FilterConfig<TRow = unknown> {
2496
2589
  /** Debounce delay in ms for filter input (default: 300) */
2497
2590
  debounceMs?: number;
2498
2591
  /** Whether text filtering is case sensitive (default: false) */
@@ -2503,10 +2596,25 @@ export declare interface FilterConfig {
2503
2596
  useWorker?: boolean;
2504
2597
  /** Custom filter panel renderer (replaces default panel content) */
2505
2598
  filterPanelRenderer?: FilterPanelRenderer_2;
2599
+ /**
2600
+ * Async handler for fetching unique values from a server.
2601
+ * When provided, this is called instead of extracting values from local rows.
2602
+ * Useful for server-side datasets where not all data is loaded.
2603
+ */
2604
+ valuesHandler?: FilterValuesHandler;
2605
+ /**
2606
+ * Async handler for applying filters on a server.
2607
+ * When provided, filtering is delegated to the server instead of local filtering.
2608
+ * Should return the filtered rows from the server.
2609
+ *
2610
+ * Note: When using filterHandler, processRows() becomes a passthrough
2611
+ * and the returned rows replace the grid's data.
2612
+ */
2613
+ filterHandler?: FilterHandler<TRow>;
2506
2614
  }
2507
2615
 
2508
2616
  /** Configuration options for the filtering plugin */
2509
- declare interface FilterConfig_2 {
2617
+ declare interface FilterConfig_2<TRow = unknown> {
2510
2618
  /** Debounce delay in ms for filter input (default: 300) */
2511
2619
  debounceMs?: number;
2512
2620
  /** Whether text filtering is case sensitive (default: false) */
@@ -2517,8 +2625,69 @@ declare interface FilterConfig_2 {
2517
2625
  useWorker?: boolean;
2518
2626
  /** Custom filter panel renderer (replaces default panel content) */
2519
2627
  filterPanelRenderer?: FilterPanelRenderer;
2628
+ /**
2629
+ * Async handler for fetching unique values from a server.
2630
+ * When provided, this is called instead of extracting values from local rows.
2631
+ * Useful for server-side datasets where not all data is loaded.
2632
+ */
2633
+ valuesHandler?: FilterValuesHandler_2;
2634
+ /**
2635
+ * Async handler for applying filters on a server.
2636
+ * When provided, filtering is delegated to the server instead of local filtering.
2637
+ * Should return the filtered rows from the server.
2638
+ *
2639
+ * Note: When using filterHandler, processRows() becomes a passthrough
2640
+ * and the returned rows replace the grid's data.
2641
+ */
2642
+ filterHandler?: FilterHandler_2<TRow>;
2520
2643
  }
2521
2644
 
2645
+ /**
2646
+ * Async handler for applying filters on a server.
2647
+ *
2648
+ * For server-side filtering, this handler is called when filters change.
2649
+ * It should fetch filtered data from the server and return the new rows.
2650
+ * The plugin will replace the grid's rows with the returned data.
2651
+ *
2652
+ * @param filters - Current active filter models
2653
+ * @param currentRows - Current row array (for reference/optimistic updates)
2654
+ * @returns Promise resolving to filtered rows
2655
+ *
2656
+ * @example
2657
+ * ```ts
2658
+ * filterHandler: async (filters) => {
2659
+ * const params = new URLSearchParams();
2660
+ * filters.forEach(f => params.append(f.field, `${f.operator}:${f.value}`));
2661
+ * const response = await fetch(`/api/data?${params}`);
2662
+ * return response.json();
2663
+ * }
2664
+ * ```
2665
+ */
2666
+ export declare type FilterHandler<TRow = unknown> = (filters: FilterModel[], currentRows: TRow[]) => TRow[] | Promise<TRow[]>;
2667
+
2668
+ /**
2669
+ * Async handler for applying filters on a server.
2670
+ *
2671
+ * For server-side filtering, this handler is called when filters change.
2672
+ * It should fetch filtered data from the server and return the new rows.
2673
+ * The plugin will replace the grid's rows with the returned data.
2674
+ *
2675
+ * @param filters - Current active filter models
2676
+ * @param currentRows - Current row array (for reference/optimistic updates)
2677
+ * @returns Promise resolving to filtered rows
2678
+ *
2679
+ * @example
2680
+ * ```ts
2681
+ * filterHandler: async (filters) => {
2682
+ * const params = new URLSearchParams();
2683
+ * filters.forEach(f => params.append(f.field, `${f.operator}:${f.value}`));
2684
+ * const response = await fetch(`/api/data?${params}`);
2685
+ * return response.json();
2686
+ * }
2687
+ * ```
2688
+ */
2689
+ declare type FilterHandler_2<TRow = unknown> = (filters: FilterModel_2[], currentRows: TRow[]) => TRow[] | Promise<TRow[]>;
2690
+
2522
2691
  /**
2523
2692
  * Filtering Plugin for tbw-grid
2524
2693
  *
@@ -2601,6 +2770,14 @@ export declare class FilteringPlugin extends BaseGridPlugin_2<FilterConfig_2> {
2601
2770
  * Toggle the filter panel for a field
2602
2771
  */
2603
2772
  private toggleFilterPanel;
2773
+ /**
2774
+ * Render filter panel content with given values
2775
+ */
2776
+ private renderPanelContent;
2777
+ /**
2778
+ * Setup click-outside handler to close the panel
2779
+ */
2780
+ private setupPanelCloseHandler;
2604
2781
  /**
2605
2782
  * Close the filter panel
2606
2783
  */
@@ -2621,6 +2798,10 @@ export declare class FilteringPlugin extends BaseGridPlugin_2<FilterConfig_2> {
2621
2798
  * Apply a text filter
2622
2799
  */
2623
2800
  private applyTextFilter;
2801
+ /**
2802
+ * Internal method to apply filters (sync or async based on config)
2803
+ */
2804
+ private applyFiltersInternal;
2624
2805
  /**
2625
2806
  * Return filter state for a column if it has an active filter.
2626
2807
  */
@@ -2722,6 +2903,48 @@ export declare type FilterType = 'text' | 'number' | 'date' | 'set' | 'boolean';
2722
2903
  /** Supported filter types */
2723
2904
  declare type FilterType_2 = 'text' | 'number' | 'date' | 'set' | 'boolean';
2724
2905
 
2906
+ /**
2907
+ * Async handler for fetching unique filter values from a server.
2908
+ *
2909
+ * For server-side datasets where not all values are available locally,
2910
+ * this handler is called when the filter panel opens to fetch all
2911
+ * possible values for the column.
2912
+ *
2913
+ * @param field - The field/column name
2914
+ * @param column - The column configuration
2915
+ * @returns Promise resolving to array of unique values
2916
+ *
2917
+ * @example
2918
+ * ```ts
2919
+ * valuesHandler: async (field, column) => {
2920
+ * const response = await fetch(`/api/distinct/${field}`);
2921
+ * return response.json(); // ['Engineering', 'Marketing', 'Sales', ...]
2922
+ * }
2923
+ * ```
2924
+ */
2925
+ export declare type FilterValuesHandler = (field: string, column: ColumnConfig) => Promise<unknown[]>;
2926
+
2927
+ /**
2928
+ * Async handler for fetching unique filter values from a server.
2929
+ *
2930
+ * For server-side datasets where not all values are available locally,
2931
+ * this handler is called when the filter panel opens to fetch all
2932
+ * possible values for the column.
2933
+ *
2934
+ * @param field - The field/column name
2935
+ * @param column - The column configuration
2936
+ * @returns Promise resolving to array of unique values
2937
+ *
2938
+ * @example
2939
+ * ```ts
2940
+ * valuesHandler: async (field, column) => {
2941
+ * const response = await fetch(`/api/distinct/${field}`);
2942
+ * return response.json(); // ['Engineering', 'Marketing', 'Sales', ...]
2943
+ * }
2944
+ * ```
2945
+ */
2946
+ declare type FilterValuesHandler_2 = (field: string, column: ColumnConfig_2) => Promise<unknown[]>;
2947
+
2725
2948
  export declare type FitMode = (typeof FitModeEnum)[keyof typeof FitModeEnum];
2726
2949
 
2727
2950
  export declare const FitModeEnum: {
@@ -2931,6 +3154,41 @@ export declare interface GridConfig<TRow = any> {
2931
3154
  * Plugins will use these by default but can override with their own config.
2932
3155
  */
2933
3156
  icons?: GridIcons;
3157
+ /**
3158
+ * Grid-wide animation configuration.
3159
+ * Controls animations for expand/collapse, reordering, and other visual transitions.
3160
+ * Individual plugins can override these defaults in their own config.
3161
+ */
3162
+ animation?: AnimationConfig;
3163
+ /**
3164
+ * Custom sort handler for full control over sorting behavior.
3165
+ *
3166
+ * When provided, this handler is called instead of the built-in sorting logic.
3167
+ * Enables custom sorting algorithms, server-side sorting, or plugin-specific sorting.
3168
+ *
3169
+ * The handler receives:
3170
+ * - `rows`: Current row array to sort
3171
+ * - `sortState`: Sort field and direction (1 = asc, -1 = desc)
3172
+ * - `columns`: Column configurations (for accessing sortComparator)
3173
+ *
3174
+ * Return the sorted array (sync) or a Promise that resolves to the sorted array (async).
3175
+ * For server-side sorting, return a Promise that resolves when data is fetched.
3176
+ *
3177
+ * @example
3178
+ * ```ts
3179
+ * // Custom stable sort
3180
+ * sortHandler: (rows, state, cols) => {
3181
+ * return stableSort(rows, (a, b) => compare(a[state.field], b[state.field]) * state.direction);
3182
+ * }
3183
+ *
3184
+ * // Server-side sorting
3185
+ * sortHandler: async (rows, state) => {
3186
+ * const response = await fetch(`/api/data?sort=${state.field}&dir=${state.direction}`);
3187
+ * return response.json();
3188
+ * }
3189
+ * ```
3190
+ */
3191
+ sortHandler?: SortHandler<TRow>;
2934
3192
  }
2935
3193
 
2936
3194
  export declare type GridCSSVar = (typeof GridCSSVars)[keyof typeof GridCSSVars];
@@ -3193,6 +3451,14 @@ export declare interface GroupingRowsConfig {
3193
3451
  formatLabel?: (value: any, depth: number, key: string) => string;
3194
3452
  /** Whether to render group row as full-width spanning cell (default: true) */
3195
3453
  fullWidth?: boolean;
3454
+ /**
3455
+ * Animation style for expanding/collapsing groups.
3456
+ * - `false`: No animation
3457
+ * - `'slide'`: Slide animation (default)
3458
+ * - `'fade'`: Fade animation
3459
+ * @default 'slide'
3460
+ */
3461
+ animation?: ExpandCollapseAnimation_3_2;
3196
3462
  }
3197
3463
 
3198
3464
  /** Configuration options for the row grouping plugin */
@@ -3216,6 +3482,14 @@ declare interface GroupingRowsConfig_2 {
3216
3482
  formatLabel?: (value: any, depth: number, key: string) => string;
3217
3483
  /** Whether to render group row as full-width spanning cell (default: true) */
3218
3484
  fullWidth?: boolean;
3485
+ /**
3486
+ * Animation style for expanding/collapsing groups.
3487
+ * - `false`: No animation
3488
+ * - `'slide'`: Slide animation (default)
3489
+ * - `'fade'`: Fade animation
3490
+ * @default 'slide'
3491
+ */
3492
+ animation?: ExpandCollapseAnimation;
3219
3493
  }
3220
3494
 
3221
3495
  /**
@@ -3238,6 +3512,9 @@ export declare class GroupingRowsPlugin extends BaseGridPlugin_2<GroupingRowsCon
3238
3512
  private expandedKeys;
3239
3513
  private flattenedRows;
3240
3514
  private isActive;
3515
+ private previousVisibleKeys;
3516
+ private keysToAnimate;
3517
+ private get animationStyle();
3241
3518
  detach(): void;
3242
3519
  /**
3243
3520
  * Auto-detect grouping configuration from grid config.
@@ -3518,11 +3795,6 @@ export declare interface KeyboardModifiers {
3518
3795
 
3519
3796
  export declare const listAggregators: () => string[];
3520
3797
 
3521
- /**
3522
- * Master/Detail Plugin Types
3523
- *
3524
- * Type definitions for expandable detail rows showing additional content.
3525
- */
3526
3798
  /** Configuration options for the master-detail plugin */
3527
3799
  declare interface MasterDetailConfig {
3528
3800
  /** Renderer function that returns detail content for a row */
@@ -3535,6 +3807,14 @@ declare interface MasterDetailConfig {
3535
3807
  collapseOnClickOutside?: boolean;
3536
3808
  /** Show expand/collapse column (default: true) */
3537
3809
  showExpandColumn?: boolean;
3810
+ /**
3811
+ * Animation style for expanding/collapsing detail rows.
3812
+ * - `false`: No animation
3813
+ * - `'slide'`: Slide down/up animation (default)
3814
+ * - `'fade'`: Fade in/out animation
3815
+ * @default 'slide'
3816
+ */
3817
+ animation?: ExpandCollapseAnimation_2;
3538
3818
  }
3539
3819
 
3540
3820
  /**
@@ -3554,6 +3834,27 @@ export declare class MasterDetailPlugin extends BaseGridPlugin_2<MasterDetailCon
3554
3834
  readonly name = "masterDetail";
3555
3835
  readonly version = "1.0.0";
3556
3836
  protected get defaultConfig(): Partial<MasterDetailConfig>;
3837
+ /**
3838
+ * Check if animations are enabled at the grid level.
3839
+ * Respects gridConfig.animation.mode and CSS variable.
3840
+ */
3841
+ private get isAnimationEnabled();
3842
+ /**
3843
+ * Get expand/collapse animation style from plugin config.
3844
+ */
3845
+ private get animationStyle();
3846
+ /**
3847
+ * Get animation duration from CSS variable (set by grid).
3848
+ */
3849
+ private get animationDuration();
3850
+ /**
3851
+ * Apply expand animation to a detail element.
3852
+ */
3853
+ private animateExpand;
3854
+ /**
3855
+ * Apply collapse animation to a detail element and remove after animation.
3856
+ */
3857
+ private animateCollapse;
3557
3858
  private expandedRows;
3558
3859
  private detailElements;
3559
3860
  detach(): void;
@@ -3906,6 +4207,14 @@ export declare interface PivotConfig {
3906
4207
  indentWidth?: number;
3907
4208
  /** Whether to show the pivot configuration tool panel (default: true) */
3908
4209
  showToolPanel?: boolean;
4210
+ /**
4211
+ * Animation style for expanding/collapsing groups.
4212
+ * - `false`: No animation
4213
+ * - `'slide'`: Slide animation (default)
4214
+ * - `'fade'`: Fade animation
4215
+ * @default 'slide'
4216
+ */
4217
+ animation?: ExpandCollapseAnimation_2_2;
3909
4218
  }
3910
4219
 
3911
4220
  declare interface PivotConfig_2 {
@@ -3922,6 +4231,14 @@ declare interface PivotConfig_2 {
3922
4231
  indentWidth?: number;
3923
4232
  /** Whether to show the pivot configuration tool panel (default: true) */
3924
4233
  showToolPanel?: boolean;
4234
+ /**
4235
+ * Animation style for expanding/collapsing groups.
4236
+ * - `false`: No animation
4237
+ * - `'slide'`: Slide animation (default)
4238
+ * - `'fade'`: Fade animation
4239
+ * @default 'slide'
4240
+ */
4241
+ animation?: ExpandCollapseAnimation_3;
3925
4242
  }
3926
4243
 
3927
4244
  declare type PivotDataRow = Record<string, unknown>;
@@ -3953,10 +4270,16 @@ export declare class PivotPlugin extends BaseGridPlugin_2<PivotConfig_2> {
3953
4270
  private originalColumns;
3954
4271
  private panelContainer;
3955
4272
  private grandTotalFooter;
4273
+ private previousVisibleKeys;
4274
+ private keysToAnimate;
3956
4275
  /**
3957
4276
  * Check if the plugin has valid pivot configuration (at least value fields).
3958
4277
  */
3959
4278
  private hasValidPivotConfig;
4279
+ /**
4280
+ * Get animation style respecting grid-level animation mode.
4281
+ */
4282
+ private get animationStyle();
3960
4283
  detach(): void;
3961
4284
  getToolPanel(): ToolPanelDefinition_2 | undefined;
3962
4285
  processRows(rows: readonly unknown[]): PivotDataRow[];
@@ -4433,9 +4756,29 @@ declare type RenderRow = GroupRowModelItem | DataRowModelItem;
4433
4756
  *
4434
4757
  * Type definitions for the column reordering feature.
4435
4758
  */
4759
+ /** Animation type for column reordering */
4760
+ declare type ReorderAnimation = false | 'flip' | 'fade';
4761
+
4436
4762
  /** Configuration options for the reorder plugin */
4437
4763
  declare interface ReorderConfig {
4438
- /** Use View Transitions API for smooth column movement (default: true) */
4764
+ /**
4765
+ * Animation type for column movement.
4766
+ * - `false`: No animation, instant reorder
4767
+ * - `'flip'`: FLIP animation (slides columns smoothly)
4768
+ * - `'fade'`: View Transitions API (cross-fade effect)
4769
+ * @default 'flip'
4770
+ */
4771
+ animation?: ReorderAnimation;
4772
+ /**
4773
+ * Animation duration in milliseconds.
4774
+ * Applies to FLIP animation. View Transitions use browser defaults.
4775
+ * @default 200
4776
+ */
4777
+ animationDuration?: number;
4778
+ /**
4779
+ * @deprecated Use `animation` instead. Will be removed in next major version.
4780
+ * Use View Transitions API for smooth column movement.
4781
+ */
4439
4782
  viewTransition?: boolean;
4440
4783
  }
4441
4784
 
@@ -4451,6 +4794,20 @@ export declare class ReorderPlugin extends BaseGridPlugin_2<ReorderConfig> {
4451
4794
  readonly name = "reorder";
4452
4795
  readonly version = "1.0.0";
4453
4796
  protected get defaultConfig(): Partial<ReorderConfig>;
4797
+ /**
4798
+ * Resolve animation type from plugin config.
4799
+ * Respects grid-level animation.mode (disabled = no animation).
4800
+ */
4801
+ private get animationType();
4802
+ /**
4803
+ * Check if animations are enabled at the grid level.
4804
+ * Respects gridConfig.animation.mode and CSS variable.
4805
+ */
4806
+ private get isAnimationEnabled();
4807
+ /**
4808
+ * Get animation duration from CSS variable (set by grid config).
4809
+ */
4810
+ private get animationDuration();
4454
4811
  private isDragging;
4455
4812
  private draggedField;
4456
4813
  private draggedIndex;
@@ -4458,6 +4815,10 @@ export declare class ReorderPlugin extends BaseGridPlugin_2<ReorderConfig> {
4458
4815
  attach(grid: GridElement_2): void;
4459
4816
  detach(): void;
4460
4817
  afterRender(): void;
4818
+ /**
4819
+ * Handle Alt+Arrow keyboard shortcuts for column reordering.
4820
+ */
4821
+ onKeyDown(event: KeyboardEvent): boolean | void;
4461
4822
  /**
4462
4823
  * Get the current column order from the grid.
4463
4824
  * @returns Array of field names in display order
@@ -4479,8 +4840,22 @@ export declare class ReorderPlugin extends BaseGridPlugin_2<ReorderConfig> {
4479
4840
  */
4480
4841
  resetColumnOrder(): void;
4481
4842
  /**
4482
- * Update column order with optional view transition animation.
4483
- * Falls back to instant update if View Transitions API is not supported.
4843
+ * Capture header cell positions before reorder.
4844
+ */
4845
+ private captureHeaderPositions;
4846
+ /**
4847
+ * Apply FLIP animation for column reorder.
4848
+ * Uses CSS transitions - JS sets initial transform and toggles class.
4849
+ * @param oldPositions - Header positions captured before DOM change
4850
+ */
4851
+ private animateFLIP;
4852
+ /**
4853
+ * Apply crossfade animation for moved columns.
4854
+ * Uses CSS keyframes - JS just toggles classes.
4855
+ */
4856
+ private animateFade;
4857
+ /**
4858
+ * Update column order with configured animation.
4484
4859
  */
4485
4860
  private updateColumnOrder;
4486
4861
  readonly styles: string;
@@ -4803,6 +5178,16 @@ export declare interface SortChangeDetail {
4803
5178
  direction: 1 | -1 | 0;
4804
5179
  }
4805
5180
 
5181
+ /**
5182
+ * Custom sort handler function signature.
5183
+ *
5184
+ * @param rows - Current row array to sort
5185
+ * @param sortState - Sort field and direction
5186
+ * @param columns - Column configurations (for accessing sortComparator)
5187
+ * @returns Sorted array (sync) or Promise resolving to sorted array (async)
5188
+ */
5189
+ export declare type SortHandler<TRow = any> = (rows: TRow[], sortState: SortState, columns: ColumnConfig<TRow>[]) => TRow[] | Promise<TRow[]>;
5190
+
4806
5191
  /**
4807
5192
  * Multi-Sort Plugin Types
4808
5193
  *
@@ -4829,6 +5214,16 @@ declare interface SortModel_2 {
4829
5214
  direction: 'asc' | 'desc';
4830
5215
  }
4831
5216
 
5217
+ /**
5218
+ * Sort state passed to custom sort handlers.
5219
+ */
5220
+ export declare interface SortState {
5221
+ /** Field to sort by */
5222
+ field: string;
5223
+ /** Sort direction: 1 = ascending, -1 = descending */
5224
+ direction: 1 | -1;
5225
+ }
5226
+
4832
5227
  /**
4833
5228
  * Toolbar button defined via config (programmatic approach).
4834
5229
  * Supports three modes:
@@ -4929,11 +5324,6 @@ declare interface ToolPanelDefinition_2 {
4929
5324
  order?: number;
4930
5325
  }
4931
5326
 
4932
- /**
4933
- * Tree Data Plugin Types
4934
- *
4935
- * Type definitions for hierarchical tree data with expand/collapse functionality.
4936
- */
4937
5327
  /** Configuration options for the tree plugin */
4938
5328
  export declare interface TreeConfig {
4939
5329
  /** Field name containing child rows (default: 'children') */
@@ -4946,13 +5336,16 @@ export declare interface TreeConfig {
4946
5336
  indentWidth?: number;
4947
5337
  /** Show expand/collapse icons (default: true) */
4948
5338
  showExpandIcons?: boolean;
5339
+ /**
5340
+ * Animation style for expanding/collapsing tree nodes.
5341
+ * - `false`: No animation
5342
+ * - `'slide'`: Slide animation (default)
5343
+ * - `'fade'`: Fade animation
5344
+ * @default 'slide'
5345
+ */
5346
+ animation?: ExpandCollapseAnimation_5;
4949
5347
  }
4950
5348
 
4951
- /**
4952
- * Tree Data Plugin Types
4953
- *
4954
- * Type definitions for hierarchical tree data with expand/collapse functionality.
4955
- */
4956
5349
  /** Configuration options for the tree plugin */
4957
5350
  declare interface TreeConfig_2 {
4958
5351
  /** Field name containing child rows (default: 'children') */
@@ -4965,6 +5358,14 @@ declare interface TreeConfig_2 {
4965
5358
  indentWidth?: number;
4966
5359
  /** Show expand/collapse icons (default: true) */
4967
5360
  showExpandIcons?: boolean;
5361
+ /**
5362
+ * Animation style for expanding/collapsing tree nodes.
5363
+ * - `false`: No animation
5364
+ * - `'slide'`: Slide animation (default)
5365
+ * - `'fade'`: Fade animation
5366
+ * @default 'slide'
5367
+ */
5368
+ animation?: ExpandCollapseAnimation_4;
4968
5369
  }
4969
5370
 
4970
5371
  /** Event detail emitted when a tree node is expanded or collapsed */
@@ -4982,8 +5383,6 @@ export declare interface TreeExpandDetail {
4982
5383
  /**
4983
5384
  * Tree Data Plugin for tbw-grid
4984
5385
  *
4985
- * Provides hierarchical tree data display with expand/collapse functionality.
4986
- *
4987
5386
  * @example
4988
5387
  * ```ts
4989
5388
  * new TreePlugin({ defaultExpanded: true, indentWidth: 24 })
@@ -4992,65 +5391,39 @@ export declare interface TreeExpandDetail {
4992
5391
  export declare class TreePlugin extends BaseGridPlugin_2<TreeConfig_2> {
4993
5392
  readonly name = "tree";
4994
5393
  readonly version = "1.0.0";
5394
+ readonly styles: string;
4995
5395
  protected get defaultConfig(): Partial<TreeConfig_2>;
4996
- /** Set of expanded row keys */
4997
5396
  private expandedKeys;
4998
- /** Whether initial expansion (based on defaultExpanded config) has been applied */
4999
5397
  private initialExpansionDone;
5000
- /** Flattened tree rows for rendering */
5001
5398
  private flattenedRows;
5002
- /** Map from key to flattened row for quick lookup */
5003
5399
  private rowKeyMap;
5400
+ private previousVisibleKeys;
5401
+ private keysToAnimate;
5402
+ private sortState;
5004
5403
  detach(): void;
5005
- /**
5006
- * Detects if tree functionality should be enabled based on data structure.
5007
- * Called by the grid during plugin initialization.
5008
- */
5404
+ private get animationStyle();
5009
5405
  detect(rows: readonly unknown[]): boolean;
5010
5406
  processRows(rows: readonly unknown[]): any[];
5407
+ /** Assign stable keys to rows (preserves key across sort operations) */
5408
+ private withStableKeys;
5409
+ /** Flatten tree using stable keys */
5410
+ private flattenTree;
5411
+ /** Sort tree recursively, keeping children with parents */
5412
+ private sortTree;
5011
5413
  processColumns(columns: readonly ColumnConfig_2[]): ColumnConfig_2[];
5012
5414
  onCellClick(event: CellClickEvent_2): boolean;
5013
- /**
5014
- * Expand a specific node by key.
5015
- */
5415
+ onHeaderClick(event: HeaderClickEvent_2): boolean;
5416
+ afterRender(): void;
5016
5417
  expand(key: string): void;
5017
- /**
5018
- * Collapse a specific node by key.
5019
- */
5020
5418
  collapse(key: string): void;
5021
- /**
5022
- * Toggle the expansion state of a node.
5023
- */
5024
5419
  toggle(key: string): void;
5025
- /**
5026
- * Expand all nodes in the tree.
5027
- */
5028
5420
  expandAll(): void;
5029
- /**
5030
- * Collapse all nodes in the tree.
5031
- */
5032
5421
  collapseAll(): void;
5033
- /**
5034
- * Check if a node is currently expanded.
5035
- */
5036
5422
  isExpanded(key: string): boolean;
5037
- /**
5038
- * Get all currently expanded keys.
5039
- */
5040
5423
  getExpandedKeys(): string[];
5041
- /**
5042
- * Get the flattened tree rows with metadata.
5043
- */
5044
5424
  getFlattenedRows(): FlattenedTreeRow[];
5045
- /**
5046
- * Get a row's original data by its key.
5047
- */
5048
5425
  getRowByKey(key: string): any | undefined;
5049
- /**
5050
- * Expand all ancestors of a node to make it visible.
5051
- */
5052
5426
  expandToKey(key: string): void;
5053
- readonly styles: string;
5054
5427
  }
5055
5428
 
5056
5429
  /**