@toolbox-web/grid 0.2.1 → 0.2.3
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.
- package/README.md +96 -59
- package/all.d.ts +328 -225
- package/all.js +522 -525
- package/all.js.map +1 -1
- package/index.d.ts +220 -160
- package/index.js +1197 -1112
- package/index.js.map +1 -1
- package/lib/plugins/clipboard/index.js +11 -5
- package/lib/plugins/clipboard/index.js.map +1 -1
- package/lib/plugins/column-virtualization/index.js +9 -4
- package/lib/plugins/column-virtualization/index.js.map +1 -1
- package/lib/plugins/context-menu/index.js +11 -5
- package/lib/plugins/context-menu/index.js.map +1 -1
- package/lib/plugins/export/index.js +7 -3
- package/lib/plugins/export/index.js.map +1 -1
- package/lib/plugins/filtering/index.js +16 -149
- package/lib/plugins/filtering/index.js.map +1 -1
- package/lib/plugins/grouping-columns/index.js +13 -6
- package/lib/plugins/grouping-columns/index.js.map +1 -1
- package/lib/plugins/grouping-rows/index.js +13 -6
- package/lib/plugins/grouping-rows/index.js.map +1 -1
- package/lib/plugins/master-detail/index.js +11 -5
- package/lib/plugins/master-detail/index.js.map +1 -1
- package/lib/plugins/multi-sort/index.js +13 -6
- package/lib/plugins/multi-sort/index.js.map +1 -1
- package/lib/plugins/pinned-columns/index.js +102 -53
- package/lib/plugins/pinned-columns/index.js.map +1 -1
- package/lib/plugins/pinned-rows/index.js +13 -6
- package/lib/plugins/pinned-rows/index.js.map +1 -1
- package/lib/plugins/pivot/index.js +19 -9
- package/lib/plugins/pivot/index.js.map +1 -1
- package/lib/plugins/reorder/index.js +49 -40
- package/lib/plugins/reorder/index.js.map +1 -1
- package/lib/plugins/selection/index.js +13 -6
- package/lib/plugins/selection/index.js.map +1 -1
- package/lib/plugins/server-side/index.js +11 -5
- package/lib/plugins/server-side/index.js.map +1 -1
- package/lib/plugins/tree/index.js +15 -7
- package/lib/plugins/tree/index.js.map +1 -1
- package/lib/plugins/undo-redo/index.js +3 -1
- package/lib/plugins/undo-redo/index.js.map +1 -1
- package/lib/plugins/visibility/index.js +13 -6
- package/lib/plugins/visibility/index.js.map +1 -1
- package/package.json +1 -1
- package/umd/grid.all.umd.js +19 -160
- package/umd/grid.all.umd.js.map +1 -1
- package/umd/grid.umd.js +16 -16
- package/umd/grid.umd.js.map +1 -1
- package/umd/plugins/clipboard.umd.js.map +1 -1
- package/umd/plugins/column-virtualization.umd.js.map +1 -1
- package/umd/plugins/context-menu.umd.js.map +1 -1
- package/umd/plugins/export.umd.js.map +1 -1
- package/umd/plugins/filtering.umd.js +1 -142
- package/umd/plugins/filtering.umd.js.map +1 -1
- package/umd/plugins/grouping-columns.umd.js.map +1 -1
- package/umd/plugins/grouping-rows.umd.js.map +1 -1
- package/umd/plugins/master-detail.umd.js.map +1 -1
- package/umd/plugins/multi-sort.umd.js.map +1 -1
- package/umd/plugins/pinned-columns.umd.js +1 -1
- package/umd/plugins/pinned-columns.umd.js.map +1 -1
- package/umd/plugins/pinned-rows.umd.js.map +1 -1
- package/umd/plugins/pivot.umd.js.map +1 -1
- package/umd/plugins/reorder.umd.js +1 -1
- package/umd/plugins/reorder.umd.js.map +1 -1
- package/umd/plugins/selection.umd.js.map +1 -1
- package/umd/plugins/server-side.umd.js.map +1 -1
- package/umd/plugins/tree.umd.js.map +1 -1
- package/umd/plugins/undo-redo.umd.js.map +1 -1
- package/umd/plugins/visibility.umd.js.map +1 -1
package/index.d.ts
CHANGED
|
@@ -26,7 +26,7 @@ export declare type AggregatorFn = (rows: any[], field: string, column?: any) =>
|
|
|
26
26
|
/** Map of field names to aggregator references */
|
|
27
27
|
declare type AggregatorMap = Record<string, AggregatorRef_2>;
|
|
28
28
|
|
|
29
|
-
export declare type AggregatorRef = string | ((rows:
|
|
29
|
+
export declare type AggregatorRef = string | ((rows: unknown[], field: string, column?: unknown) => unknown);
|
|
30
30
|
|
|
31
31
|
declare type AggregatorRef_2 = string | AggregatorFn;
|
|
32
32
|
|
|
@@ -89,17 +89,17 @@ export declare interface BaseColumnConfig<TRow = any, TValue = any> {
|
|
|
89
89
|
/** For select/typeahead types - available options */
|
|
90
90
|
options?: Array<{
|
|
91
91
|
label: string;
|
|
92
|
-
value:
|
|
92
|
+
value: unknown;
|
|
93
93
|
}> | (() => Array<{
|
|
94
94
|
label: string;
|
|
95
|
-
value:
|
|
95
|
+
value: unknown;
|
|
96
96
|
}>);
|
|
97
97
|
/** For select/typeahead - allow multi select */
|
|
98
98
|
multi?: boolean;
|
|
99
99
|
/** Optional formatter */
|
|
100
100
|
format?: (value: TValue, row: TRow) => string;
|
|
101
101
|
/** Arbitrary extra metadata */
|
|
102
|
-
meta?: Record<string,
|
|
102
|
+
meta?: Record<string, unknown>;
|
|
103
103
|
}
|
|
104
104
|
|
|
105
105
|
/**
|
|
@@ -107,7 +107,7 @@ export declare interface BaseColumnConfig<TRow = any, TValue = any> {
|
|
|
107
107
|
*
|
|
108
108
|
* @template TConfig - Configuration type for the plugin
|
|
109
109
|
*/
|
|
110
|
-
export declare abstract class BaseGridPlugin<TConfig = unknown> {
|
|
110
|
+
export declare abstract class BaseGridPlugin<TConfig = unknown> implements GridPlugin {
|
|
111
111
|
/** Unique plugin identifier (derived from class name by default) */
|
|
112
112
|
abstract readonly name: string;
|
|
113
113
|
/** Plugin version - override in subclass if needed */
|
|
@@ -403,6 +403,33 @@ export declare abstract class BaseGridPlugin<TConfig = unknown> {
|
|
|
403
403
|
* ```
|
|
404
404
|
*/
|
|
405
405
|
renderRow?(row: any, rowEl: HTMLElement, rowIndex: number): boolean | void;
|
|
406
|
+
/**
|
|
407
|
+
* Handle queries from other plugins.
|
|
408
|
+
* This is the generic mechanism for inter-plugin communication.
|
|
409
|
+
* Plugins can respond to well-known query types or define their own.
|
|
410
|
+
*
|
|
411
|
+
* @param query - The query object with type and context
|
|
412
|
+
* @returns Query-specific response, or undefined if not handling this query
|
|
413
|
+
*
|
|
414
|
+
* @example
|
|
415
|
+
* ```ts
|
|
416
|
+
* onPluginQuery(query: PluginQuery): unknown {
|
|
417
|
+
* switch (query.type) {
|
|
418
|
+
* case PLUGIN_QUERIES.CAN_MOVE_COLUMN:
|
|
419
|
+
* // Prevent moving pinned columns
|
|
420
|
+
* const column = query.context as ColumnConfig;
|
|
421
|
+
* if (column.sticky === 'left' || column.sticky === 'right') {
|
|
422
|
+
* return false;
|
|
423
|
+
* }
|
|
424
|
+
* break;
|
|
425
|
+
* case PLUGIN_QUERIES.GET_CONTEXT_MENU_ITEMS:
|
|
426
|
+
* const params = query.context as ContextMenuParams;
|
|
427
|
+
* return [{ id: 'my-action', label: 'My Action', action: () => {} }];
|
|
428
|
+
* }
|
|
429
|
+
* }
|
|
430
|
+
* ```
|
|
431
|
+
*/
|
|
432
|
+
onPluginQuery?(query: PluginQuery): unknown;
|
|
406
433
|
/**
|
|
407
434
|
* Handle keyboard events on the grid.
|
|
408
435
|
* Called when a key is pressed while the grid or a cell has focus.
|
|
@@ -546,29 +573,6 @@ export declare abstract class BaseGridPlugin<TConfig = unknown> {
|
|
|
546
573
|
* ```
|
|
547
574
|
*/
|
|
548
575
|
onCellMouseUp?(event: CellMouseEvent): boolean | void;
|
|
549
|
-
/**
|
|
550
|
-
* Provide context menu items when right-clicking on the grid.
|
|
551
|
-
* Multiple plugins can contribute items; they are merged into a single menu.
|
|
552
|
-
*
|
|
553
|
-
* @param params - Context about where the menu was triggered (row, column, etc.)
|
|
554
|
-
* @returns Array of menu items to display
|
|
555
|
-
*
|
|
556
|
-
* @example
|
|
557
|
-
* ```ts
|
|
558
|
-
* getContextMenuItems(params: ContextMenuParams): ContextMenuItem[] {
|
|
559
|
-
* if (params.isHeader) {
|
|
560
|
-
* return [
|
|
561
|
-
* { id: 'sort-asc', label: 'Sort Ascending', action: () => this.sortAsc(params.field) },
|
|
562
|
-
* { id: 'sort-desc', label: 'Sort Descending', action: () => this.sortDesc(params.field) },
|
|
563
|
-
* ];
|
|
564
|
-
* }
|
|
565
|
-
* return [
|
|
566
|
-
* { id: 'copy', label: 'Copy Cell', action: () => this.copyCell(params) },
|
|
567
|
-
* ];
|
|
568
|
-
* }
|
|
569
|
-
* ```
|
|
570
|
-
*/
|
|
571
|
-
getContextMenuItems?(params: ContextMenuParams): ContextMenuItem[];
|
|
572
576
|
/**
|
|
573
577
|
* Contribute plugin-specific state for a column.
|
|
574
578
|
* Called by the grid when collecting column state for serialization.
|
|
@@ -611,6 +615,34 @@ export declare abstract class BaseGridPlugin<TConfig = unknown> {
|
|
|
611
615
|
* ```
|
|
612
616
|
*/
|
|
613
617
|
applyColumnState?(field: string, state: ColumnState): void;
|
|
618
|
+
/**
|
|
619
|
+
* Report horizontal scroll boundary offsets for this plugin.
|
|
620
|
+
* Plugins that obscure part of the scroll area (e.g., pinned/sticky columns)
|
|
621
|
+
* should return how much space they occupy on each side.
|
|
622
|
+
* The keyboard navigation uses this to ensure focused cells are fully visible.
|
|
623
|
+
*
|
|
624
|
+
* @param rowEl - The row element (optional, for calculating widths from rendered cells)
|
|
625
|
+
* @param focusedCell - The currently focused cell element (optional, to determine if scrolling should be skipped)
|
|
626
|
+
* @returns Object with left/right pixel offsets and optional skipScroll flag, or undefined if plugin has no offsets
|
|
627
|
+
*
|
|
628
|
+
* @example
|
|
629
|
+
* ```ts
|
|
630
|
+
* getHorizontalScrollOffsets(rowEl?: HTMLElement, focusedCell?: HTMLElement): { left: number; right: number; skipScroll?: boolean } | undefined {
|
|
631
|
+
* // Calculate total width of left-pinned columns
|
|
632
|
+
* const leftCells = rowEl?.querySelectorAll('.sticky-left') ?? [];
|
|
633
|
+
* let left = 0;
|
|
634
|
+
* leftCells.forEach(el => { left += (el as HTMLElement).offsetWidth; });
|
|
635
|
+
* // Skip scroll if focused cell is pinned (always visible)
|
|
636
|
+
* const skipScroll = focusedCell?.classList.contains('sticky-left');
|
|
637
|
+
* return { left, right: 0, skipScroll };
|
|
638
|
+
* }
|
|
639
|
+
* ```
|
|
640
|
+
*/
|
|
641
|
+
getHorizontalScrollOffsets?(rowEl?: HTMLElement, focusedCell?: HTMLElement): {
|
|
642
|
+
left: number;
|
|
643
|
+
right: number;
|
|
644
|
+
skipScroll?: boolean;
|
|
645
|
+
} | undefined;
|
|
614
646
|
/**
|
|
615
647
|
* Register a tool panel for this plugin.
|
|
616
648
|
* Return undefined if plugin has no tool panel.
|
|
@@ -678,13 +710,13 @@ export declare interface CellClickEvent {
|
|
|
678
710
|
originalEvent: MouseEvent;
|
|
679
711
|
}
|
|
680
712
|
|
|
681
|
-
export declare interface CellCommitDetail<TRow =
|
|
713
|
+
export declare interface CellCommitDetail<TRow = unknown> {
|
|
682
714
|
/** The mutated row after commit. */
|
|
683
715
|
row: TRow;
|
|
684
716
|
/** Field name whose value changed. */
|
|
685
717
|
field: string;
|
|
686
718
|
/** New value stored. */
|
|
687
|
-
value:
|
|
719
|
+
value: unknown;
|
|
688
720
|
/** Index of the row in current data set. */
|
|
689
721
|
rowIndex: number;
|
|
690
722
|
/** All rows that have at least one committed change (snapshot list). */
|
|
@@ -700,7 +732,7 @@ export declare interface CellCommitDetail<TRow = any> {
|
|
|
700
732
|
*/
|
|
701
733
|
declare interface CellContext<T = any> {
|
|
702
734
|
row: T;
|
|
703
|
-
value:
|
|
735
|
+
value: unknown;
|
|
704
736
|
field: string;
|
|
705
737
|
column: ColumnInternal<T>;
|
|
706
738
|
}
|
|
@@ -786,7 +818,7 @@ export declare interface CellRenderContext<TRow = any, TValue = any> {
|
|
|
786
818
|
export declare type CellRenderer = (ctx: PluginCellRenderContext) => string | HTMLElement;
|
|
787
819
|
|
|
788
820
|
/** Emitted when the changed rows tracking set is cleared programmatically. */
|
|
789
|
-
export declare interface ChangedRowsResetDetail<TRow =
|
|
821
|
+
export declare interface ChangedRowsResetDetail<TRow = unknown> {
|
|
790
822
|
/** New (empty) changed rows array after reset. */
|
|
791
823
|
rows: TRow[];
|
|
792
824
|
/** Parallel indices (likely empty). */
|
|
@@ -801,12 +833,12 @@ export declare interface ColumnConfig<TRow = any> extends BaseColumnConfig<TRow,
|
|
|
801
833
|
viewRenderer?: ColumnViewRenderer<TRow, any>;
|
|
802
834
|
/** External view spec (lets host app mount any framework component) */
|
|
803
835
|
externalView?: {
|
|
804
|
-
component:
|
|
805
|
-
props?: Record<string,
|
|
836
|
+
component: unknown;
|
|
837
|
+
props?: Record<string, unknown>;
|
|
806
838
|
mount?: (options: {
|
|
807
839
|
placeholder: HTMLElement;
|
|
808
|
-
context: CellRenderContext<TRow,
|
|
809
|
-
spec:
|
|
840
|
+
context: CellRenderContext<TRow, unknown>;
|
|
841
|
+
spec: unknown;
|
|
810
842
|
}) => void | {
|
|
811
843
|
dispose?: () => void;
|
|
812
844
|
};
|
|
@@ -838,16 +870,16 @@ export declare interface ColumnEditorContext<TRow = any, TValue = any> {
|
|
|
838
870
|
}
|
|
839
871
|
|
|
840
872
|
/** External editor spec: tag name, factory function, or external mount spec */
|
|
841
|
-
export declare type ColumnEditorSpec<TRow =
|
|
873
|
+
export declare type ColumnEditorSpec<TRow = unknown, TValue = unknown> = string | ((context: ColumnEditorContext<TRow, TValue>) => HTMLElement | string) | {
|
|
842
874
|
/** Arbitrary component reference (class, function, token) */
|
|
843
|
-
component:
|
|
875
|
+
component: unknown;
|
|
844
876
|
/** Optional static props passed to mount */
|
|
845
|
-
props?: Record<string,
|
|
877
|
+
props?: Record<string, unknown>;
|
|
846
878
|
/** Optional custom mount function; if provided we call it directly instead of emitting an event */
|
|
847
879
|
mount?: (options: {
|
|
848
880
|
placeholder: HTMLElement;
|
|
849
881
|
context: ColumnEditorContext<TRow, TValue>;
|
|
850
|
-
spec:
|
|
882
|
+
spec: unknown;
|
|
851
883
|
}) => void | {
|
|
852
884
|
dispose?: () => void;
|
|
853
885
|
};
|
|
@@ -909,10 +941,10 @@ export declare interface ColumnState {
|
|
|
909
941
|
sort?: ColumnSortState;
|
|
910
942
|
}
|
|
911
943
|
|
|
912
|
-
export declare type ColumnViewRenderer<TRow =
|
|
944
|
+
export declare type ColumnViewRenderer<TRow = unknown, TValue = unknown> = (ctx: CellRenderContext<TRow, TValue>) => Node | string | void;
|
|
913
945
|
|
|
914
946
|
/**
|
|
915
|
-
* Context menu item
|
|
947
|
+
* Context menu item (used by context-menu plugin query)
|
|
916
948
|
*/
|
|
917
949
|
export declare interface ContextMenuItem {
|
|
918
950
|
id: string;
|
|
@@ -939,58 +971,12 @@ export declare interface ContextMenuParams {
|
|
|
939
971
|
isHeader?: boolean;
|
|
940
972
|
}
|
|
941
973
|
|
|
942
|
-
export declare type DataGridCustomEvent<K extends keyof DataGridEventMap<
|
|
974
|
+
export declare type DataGridCustomEvent<K extends keyof DataGridEventMap<unknown>, TRow = unknown> = CustomEvent<DataGridEventMap<TRow>[K]>;
|
|
943
975
|
|
|
944
|
-
/**
|
|
945
|
-
* High-performance data grid web component.
|
|
946
|
-
* During migration, uses tbw-grid tag to avoid conflicts with existing datagrid.
|
|
947
|
-
* Will be renamed back to data-grid when migration is complete.
|
|
948
|
-
*
|
|
949
|
-
* ## Configuration Architecture
|
|
950
|
-
*
|
|
951
|
-
* The grid follows a **single source of truth** pattern where all configuration
|
|
952
|
-
* converges into `#effectiveConfig`. Users can set configuration via multiple inputs:
|
|
953
|
-
*
|
|
954
|
-
* **Input Sources (precedence low → high):**
|
|
955
|
-
* 1. `gridConfig` property - base configuration object
|
|
956
|
-
* 2. Light DOM elements:
|
|
957
|
-
* - `<tbw-grid-column>` → `effectiveConfig.columns`
|
|
958
|
-
* - `<tbw-grid-header title="...">` → `effectiveConfig.shell.header.title`
|
|
959
|
-
* - `<tbw-grid-header-content>` → `effectiveConfig.shell.header.content`
|
|
960
|
-
* 3. `columns` property → merged into `effectiveConfig.columns`
|
|
961
|
-
* 4. `fitMode` property → merged into `effectiveConfig.fitMode`
|
|
962
|
-
* 5. `editOn` property → merged into `effectiveConfig.editOn`
|
|
963
|
-
* 6. Column inference from first row (if no columns defined)
|
|
964
|
-
*
|
|
965
|
-
* **Derived State:**
|
|
966
|
-
* - `_columns` - processed columns from `effectiveConfig.columns` after plugin hooks
|
|
967
|
-
* - `_rows` - processed rows after plugin hooks (grouping, filtering, etc.)
|
|
968
|
-
*
|
|
969
|
-
* The `#mergeEffectiveConfig()` method is the single place where all inputs converge.
|
|
970
|
-
* All rendering and logic should read from `effectiveConfig` or derived state.
|
|
971
|
-
*
|
|
972
|
-
* @element tbw-grid
|
|
973
|
-
*
|
|
974
|
-
* @csspart container - The main grid container
|
|
975
|
-
* @csspart header - The header row container
|
|
976
|
-
* @csspart body - The body/rows container
|
|
977
|
-
*
|
|
978
|
-
* @fires cell-commit - Fired when a cell value is committed
|
|
979
|
-
* @fires row-commit - Fired when a bulk row edit session commits
|
|
980
|
-
* @fires changed-rows-reset - Fired after resetChangedRows() unless silent
|
|
981
|
-
* @fires mount-external-view - Fired to request mounting of an external view renderer
|
|
982
|
-
* @fires mount-external-editor - Fired to request mounting of an external editor renderer
|
|
983
|
-
* @fires sort-change - Fired when sort state changes for a column
|
|
984
|
-
* @fires column-resize - Fired after a column resize drag completes
|
|
985
|
-
* @fires activate-cell - Fired when a cell activation intent occurs
|
|
986
|
-
* @fires group-toggle - Fired when a group row is toggled
|
|
987
|
-
*
|
|
988
|
-
* @cssprop --tbw-color-bg - Background color
|
|
989
|
-
* @cssprop --tbw-color-fg - Foreground/text color
|
|
990
|
-
*/
|
|
991
976
|
export declare class DataGridElement<T = any> extends HTMLElement implements InternalGrid<T> {
|
|
992
977
|
#private;
|
|
993
978
|
static readonly tagName = "tbw-grid";
|
|
979
|
+
static readonly version: string;
|
|
994
980
|
_rows: T[];
|
|
995
981
|
get _columns(): ColumnInternal<T>[];
|
|
996
982
|
set _columns(value: ColumnInternal<T>[]);
|
|
@@ -1069,7 +1055,6 @@ export declare class DataGridElement<T = any> extends HTMLElement implements Int
|
|
|
1069
1055
|
emitSortChange(detail: SortChangeDetail): void;
|
|
1070
1056
|
emitColumnResize(detail: ColumnResizeDetail): void;
|
|
1071
1057
|
emitActivateCell(detail: ActivateCellDetail): void;
|
|
1072
|
-
updateTemplate(): void;
|
|
1073
1058
|
findHeaderRow(): HTMLElement;
|
|
1074
1059
|
findRenderedRowElement(rowIndex: number): HTMLElement | null;
|
|
1075
1060
|
/**
|
|
@@ -1087,6 +1072,26 @@ export declare class DataGridElement<T = any> extends HTMLElement implements Int
|
|
|
1087
1072
|
* Returns true if any plugin handled the event.
|
|
1088
1073
|
*/
|
|
1089
1074
|
dispatchKeyDown(event: KeyboardEvent): boolean;
|
|
1075
|
+
/**
|
|
1076
|
+
* Get horizontal scroll boundary offsets from plugins.
|
|
1077
|
+
* Used by keyboard navigation to ensure focused cells are fully visible
|
|
1078
|
+
* when plugins like pinned columns obscure part of the scroll area.
|
|
1079
|
+
*/
|
|
1080
|
+
getHorizontalScrollOffsets(rowEl?: HTMLElement, focusedCell?: HTMLElement): {
|
|
1081
|
+
left: number;
|
|
1082
|
+
right: number;
|
|
1083
|
+
skipScroll?: boolean;
|
|
1084
|
+
};
|
|
1085
|
+
/**
|
|
1086
|
+
* Query all plugins with a generic query and collect responses.
|
|
1087
|
+
* This enables inter-plugin communication without the core knowing plugin-specific concepts.
|
|
1088
|
+
*
|
|
1089
|
+
* @example
|
|
1090
|
+
* // Check if any plugin vetoes moving a column
|
|
1091
|
+
* const responses = grid.queryPlugins<boolean>({ type: PLUGIN_QUERIES.CAN_MOVE_COLUMN, context: column });
|
|
1092
|
+
* const canMove = !responses.includes(false);
|
|
1093
|
+
*/
|
|
1094
|
+
queryPlugins<T>(query: PluginQuery): T[];
|
|
1090
1095
|
get changedRows(): T[];
|
|
1091
1096
|
get changedRowIndices(): number[];
|
|
1092
1097
|
resetChangedRows(silent?: boolean): Promise<void>;
|
|
@@ -1168,76 +1173,42 @@ export declare class DataGridElement<T = any> extends HTMLElement implements Int
|
|
|
1168
1173
|
* Clears all user modifications (order, width, visibility, sort).
|
|
1169
1174
|
*/
|
|
1170
1175
|
resetColumnState(): void;
|
|
1171
|
-
/**
|
|
1172
|
-
* Check if the tool panel is currently open.
|
|
1173
|
-
*/
|
|
1176
|
+
/** Check if the tool panel is currently open. */
|
|
1174
1177
|
get isToolPanelOpen(): boolean;
|
|
1175
1178
|
/**
|
|
1176
1179
|
* Get the currently active tool panel ID, or null if none is open.
|
|
1177
1180
|
* @deprecated Use isToolPanelOpen and expandedToolPanelSections instead.
|
|
1178
1181
|
*/
|
|
1179
1182
|
get activeToolPanel(): string | null;
|
|
1180
|
-
/**
|
|
1181
|
-
* Get the IDs of expanded accordion sections.
|
|
1182
|
-
*/
|
|
1183
|
+
/** Get the IDs of expanded accordion sections. */
|
|
1183
1184
|
get expandedToolPanelSections(): string[];
|
|
1184
|
-
/**
|
|
1185
|
-
* Open the tool panel (accordion view with all registered panels).
|
|
1186
|
-
*/
|
|
1185
|
+
/** Open the tool panel (accordion view with all registered panels). */
|
|
1187
1186
|
openToolPanel(): void;
|
|
1188
|
-
/**
|
|
1189
|
-
* Close the tool panel.
|
|
1190
|
-
*/
|
|
1187
|
+
/** Close the tool panel. */
|
|
1191
1188
|
closeToolPanel(): void;
|
|
1192
|
-
/**
|
|
1193
|
-
* Toggle the tool panel open/closed.
|
|
1194
|
-
*/
|
|
1189
|
+
/** Toggle the tool panel open/closed. */
|
|
1195
1190
|
toggleToolPanel(): void;
|
|
1196
|
-
/**
|
|
1197
|
-
* Toggle an accordion section expanded/collapsed.
|
|
1198
|
-
* Only one section can be expanded at a time (exclusive accordion).
|
|
1199
|
-
* When there's only one panel, toggling is disabled (always expanded).
|
|
1200
|
-
*/
|
|
1191
|
+
/** Toggle an accordion section expanded/collapsed. */
|
|
1201
1192
|
toggleToolPanelSection(sectionId: string): void;
|
|
1202
|
-
/**
|
|
1203
|
-
* Get registered tool panel definitions.
|
|
1204
|
-
*/
|
|
1193
|
+
/** Get registered tool panel definitions. */
|
|
1205
1194
|
getToolPanels(): ToolPanelDefinition[];
|
|
1206
|
-
/**
|
|
1207
|
-
* Register a custom tool panel (without creating a plugin).
|
|
1208
|
-
*/
|
|
1195
|
+
/** Register a custom tool panel (without creating a plugin). */
|
|
1209
1196
|
registerToolPanel(panel: ToolPanelDefinition): void;
|
|
1210
|
-
/**
|
|
1211
|
-
* Unregister a custom tool panel.
|
|
1212
|
-
*/
|
|
1197
|
+
/** Unregister a custom tool panel. */
|
|
1213
1198
|
unregisterToolPanel(panelId: string): void;
|
|
1214
|
-
/**
|
|
1215
|
-
* Get registered header content definitions.
|
|
1216
|
-
*/
|
|
1199
|
+
/** Get registered header content definitions. */
|
|
1217
1200
|
getHeaderContents(): HeaderContentDefinition[];
|
|
1218
|
-
/**
|
|
1219
|
-
* Register custom header content (without creating a plugin).
|
|
1220
|
-
*/
|
|
1201
|
+
/** Register custom header content (without creating a plugin). */
|
|
1221
1202
|
registerHeaderContent(content: HeaderContentDefinition): void;
|
|
1222
|
-
/**
|
|
1223
|
-
* Unregister custom header content.
|
|
1224
|
-
*/
|
|
1203
|
+
/** Unregister custom header content. */
|
|
1225
1204
|
unregisterHeaderContent(contentId: string): void;
|
|
1226
|
-
/**
|
|
1227
|
-
* Get all registered toolbar buttons.
|
|
1228
|
-
*/
|
|
1205
|
+
/** Get all registered toolbar buttons. */
|
|
1229
1206
|
getToolbarButtons(): ToolbarButtonInfo[];
|
|
1230
|
-
/**
|
|
1231
|
-
* Register a custom toolbar button programmatically.
|
|
1232
|
-
*/
|
|
1207
|
+
/** Register a custom toolbar button programmatically. */
|
|
1233
1208
|
registerToolbarButton(button: ToolbarButtonConfig): void;
|
|
1234
|
-
/**
|
|
1235
|
-
* Unregister a custom toolbar button.
|
|
1236
|
-
*/
|
|
1209
|
+
/** Unregister a custom toolbar button. */
|
|
1237
1210
|
unregisterToolbarButton(buttonId: string): void;
|
|
1238
|
-
/**
|
|
1239
|
-
* Enable/disable a toolbar button by ID.
|
|
1240
|
-
*/
|
|
1211
|
+
/** Enable/disable a toolbar button by ID. */
|
|
1241
1212
|
setToolbarButtonDisabled(buttonId: string, disabled: boolean): void;
|
|
1242
1213
|
/**
|
|
1243
1214
|
* Re-parse light DOM shell elements and refresh shell header.
|
|
@@ -1257,7 +1228,7 @@ export declare class DataGridElement<T = any> extends HTMLElement implements Int
|
|
|
1257
1228
|
export declare interface DataGridElementInterface extends PublicGrid, HTMLElement {
|
|
1258
1229
|
}
|
|
1259
1230
|
|
|
1260
|
-
export declare interface DataGridEventMap<TRow =
|
|
1231
|
+
export declare interface DataGridEventMap<TRow = unknown> {
|
|
1261
1232
|
'cell-commit': CellCommitDetail<TRow>;
|
|
1262
1233
|
'row-commit': RowCommitDetail<TRow>;
|
|
1263
1234
|
'changed-rows-reset': ChangedRowsResetDetail<TRow>;
|
|
@@ -1307,7 +1278,7 @@ export declare interface EditAction {
|
|
|
1307
1278
|
* Internal editor execution context extending the generic cell context with commit helpers.
|
|
1308
1279
|
*/
|
|
1309
1280
|
declare interface EditorExecContext<T = any> extends CellContext<T> {
|
|
1310
|
-
commit: (newValue:
|
|
1281
|
+
commit: (newValue: unknown) => void;
|
|
1311
1282
|
cancel: () => void;
|
|
1312
1283
|
}
|
|
1313
1284
|
|
|
@@ -1337,27 +1308,27 @@ export declare interface ExportParams {
|
|
|
1337
1308
|
processHeader?: (header: string, field: string) => string;
|
|
1338
1309
|
}
|
|
1339
1310
|
|
|
1340
|
-
export declare interface ExternalMountEditorDetail<TRow =
|
|
1311
|
+
export declare interface ExternalMountEditorDetail<TRow = unknown> {
|
|
1341
1312
|
placeholder: HTMLElement;
|
|
1342
|
-
spec:
|
|
1313
|
+
spec: unknown;
|
|
1343
1314
|
context: {
|
|
1344
1315
|
row: TRow;
|
|
1345
|
-
value:
|
|
1316
|
+
value: unknown;
|
|
1346
1317
|
field: string;
|
|
1347
|
-
column:
|
|
1348
|
-
commit: (v:
|
|
1318
|
+
column: unknown;
|
|
1319
|
+
commit: (v: unknown) => void;
|
|
1349
1320
|
cancel: () => void;
|
|
1350
1321
|
};
|
|
1351
1322
|
}
|
|
1352
1323
|
|
|
1353
|
-
export declare interface ExternalMountViewDetail<TRow =
|
|
1324
|
+
export declare interface ExternalMountViewDetail<TRow = unknown> {
|
|
1354
1325
|
placeholder: HTMLElement;
|
|
1355
|
-
spec:
|
|
1326
|
+
spec: unknown;
|
|
1356
1327
|
context: {
|
|
1357
1328
|
row: TRow;
|
|
1358
|
-
value:
|
|
1329
|
+
value: unknown;
|
|
1359
1330
|
field: string;
|
|
1360
|
-
column:
|
|
1331
|
+
column: unknown;
|
|
1361
1332
|
};
|
|
1362
1333
|
}
|
|
1363
1334
|
|
|
@@ -1457,6 +1428,10 @@ export declare function getValueAggregator(aggFunc: string): ValueAggregatorFn;
|
|
|
1457
1428
|
/**
|
|
1458
1429
|
* CSS class names used in the grid's shadow DOM.
|
|
1459
1430
|
* Use these when adding/removing classes or querying elements.
|
|
1431
|
+
*
|
|
1432
|
+
* Classes are organized by:
|
|
1433
|
+
* - Core: Used by the grid core for structure and basic functionality
|
|
1434
|
+
* - Shared: Used by multiple features/plugins, styled by core CSS
|
|
1460
1435
|
*/
|
|
1461
1436
|
export declare const GridClasses: {
|
|
1462
1437
|
readonly ROOT: "tbw-grid-root";
|
|
@@ -1542,6 +1517,27 @@ export declare interface GridConfig<TRow = any> {
|
|
|
1542
1517
|
fitMode?: FitMode;
|
|
1543
1518
|
/** Edit activation mode ('click' | 'dblclick'). Can also be set via `editOn` prop. */
|
|
1544
1519
|
editOn?: string;
|
|
1520
|
+
/**
|
|
1521
|
+
* Row height in pixels for virtualization calculations.
|
|
1522
|
+
* The virtualization system assumes uniform row heights for performance.
|
|
1523
|
+
*
|
|
1524
|
+
* If not specified, the grid measures the first rendered row's height,
|
|
1525
|
+
* which respects the CSS variable `--tbw-row-height` set by themes.
|
|
1526
|
+
*
|
|
1527
|
+
* Set this explicitly when:
|
|
1528
|
+
* - Row content may wrap to multiple lines (also set `--tbw-cell-white-space: normal`)
|
|
1529
|
+
* - Using custom row templates with variable content
|
|
1530
|
+
* - You want to override theme-defined row height
|
|
1531
|
+
*
|
|
1532
|
+
* @default Auto-measured from first row (respects --tbw-row-height CSS variable)
|
|
1533
|
+
*
|
|
1534
|
+
* @example
|
|
1535
|
+
* ```ts
|
|
1536
|
+
* // Fixed height for rows that may wrap to 2 lines
|
|
1537
|
+
* gridConfig = { rowHeight: 56 };
|
|
1538
|
+
* ```
|
|
1539
|
+
*/
|
|
1540
|
+
rowHeight?: number;
|
|
1545
1541
|
/**
|
|
1546
1542
|
* Array of plugin instances.
|
|
1547
1543
|
* Each plugin is instantiated with its configuration and attached to this grid.
|
|
@@ -1555,7 +1551,7 @@ export declare interface GridConfig<TRow = any> {
|
|
|
1555
1551
|
* ]
|
|
1556
1552
|
* ```
|
|
1557
1553
|
*/
|
|
1558
|
-
plugins?:
|
|
1554
|
+
plugins?: GridPlugin[];
|
|
1559
1555
|
/**
|
|
1560
1556
|
* Saved column state to restore on initialization.
|
|
1561
1557
|
* Includes order, width, visibility, sort, and plugin-contributed state.
|
|
@@ -1657,6 +1653,20 @@ export declare interface GridIcons {
|
|
|
1657
1653
|
toolPanel?: IconValue;
|
|
1658
1654
|
}
|
|
1659
1655
|
|
|
1656
|
+
/**
|
|
1657
|
+
* Minimal plugin interface for type-checking.
|
|
1658
|
+
* This interface is defined here to avoid circular imports with BaseGridPlugin.
|
|
1659
|
+
* All plugins must satisfy this shape (BaseGridPlugin implements it).
|
|
1660
|
+
*/
|
|
1661
|
+
export declare interface GridPlugin {
|
|
1662
|
+
/** Unique plugin identifier */
|
|
1663
|
+
readonly name: string;
|
|
1664
|
+
/** Plugin version */
|
|
1665
|
+
readonly version: string;
|
|
1666
|
+
/** CSS styles to inject into grid's shadow DOM */
|
|
1667
|
+
readonly styles?: string;
|
|
1668
|
+
}
|
|
1669
|
+
|
|
1660
1670
|
/**
|
|
1661
1671
|
* Common CSS selectors for querying grid elements.
|
|
1662
1672
|
* Built from the class constants for consistency.
|
|
@@ -1751,7 +1761,7 @@ export declare type HeaderRenderer = (ctx: PluginHeaderRenderContext) => string
|
|
|
1751
1761
|
export declare type IconValue = string | HTMLElement;
|
|
1752
1762
|
|
|
1753
1763
|
/** Result of automatic column inference from sample rows. */
|
|
1754
|
-
export declare interface InferredColumnResult<TRow =
|
|
1764
|
+
export declare interface InferredColumnResult<TRow = unknown> {
|
|
1755
1765
|
columns: ColumnConfigMap<TRow>;
|
|
1756
1766
|
typeMap: Record<string, PrimitiveColumnType>;
|
|
1757
1767
|
}
|
|
@@ -1783,7 +1793,7 @@ declare interface InternalGrid<T = any> extends PublicGrid<T>, GridConfig<T> {
|
|
|
1783
1793
|
focusRow: number;
|
|
1784
1794
|
focusCol: number;
|
|
1785
1795
|
activeEditRows: number;
|
|
1786
|
-
rowEditSnapshots: Map<number,
|
|
1796
|
+
rowEditSnapshots: Map<number, T>;
|
|
1787
1797
|
_changedRowIndices: Set<number>;
|
|
1788
1798
|
changedRows?: T[];
|
|
1789
1799
|
changedRowIndices?: number[];
|
|
@@ -1800,6 +1810,14 @@ declare interface InternalGrid<T = any> extends PublicGrid<T>, GridConfig<T> {
|
|
|
1800
1810
|
dispatchHeaderClick?: (event: MouseEvent, colIndex: number, headerEl: HTMLElement) => boolean;
|
|
1801
1811
|
/** Dispatch keydown to plugin system, returns true if handled */
|
|
1802
1812
|
dispatchKeyDown?: (event: KeyboardEvent) => boolean;
|
|
1813
|
+
/** Get horizontal scroll boundary offsets from plugins (e.g., pinned columns) */
|
|
1814
|
+
getHorizontalScrollOffsets?: (rowEl?: HTMLElement, focusedCell?: HTMLElement) => {
|
|
1815
|
+
left: number;
|
|
1816
|
+
right: number;
|
|
1817
|
+
skipScroll?: boolean;
|
|
1818
|
+
};
|
|
1819
|
+
/** Query all plugins with a generic query and collect responses */
|
|
1820
|
+
queryPlugins?: <T>(query: PluginQuery) => T[];
|
|
1803
1821
|
/** Request emission of column-state-change event (debounced) */
|
|
1804
1822
|
requestStateChange?: () => void;
|
|
1805
1823
|
}
|
|
@@ -1896,6 +1914,17 @@ export declare interface PivotValueField {
|
|
|
1896
1914
|
header?: string;
|
|
1897
1915
|
}
|
|
1898
1916
|
|
|
1917
|
+
/**
|
|
1918
|
+
* Well-known plugin query types.
|
|
1919
|
+
* Plugins can define additional query types beyond these.
|
|
1920
|
+
*/
|
|
1921
|
+
export declare const PLUGIN_QUERIES: {
|
|
1922
|
+
/** Ask if a column can be moved. Context: ColumnConfig. Response: boolean | undefined */
|
|
1923
|
+
readonly CAN_MOVE_COLUMN: "canMoveColumn";
|
|
1924
|
+
/** Get context menu items. Context: ContextMenuParams. Response: ContextMenuItem[] */
|
|
1925
|
+
readonly GET_CONTEXT_MENU_ITEMS: "getContextMenuItems";
|
|
1926
|
+
};
|
|
1927
|
+
|
|
1899
1928
|
/**
|
|
1900
1929
|
* Cell render context for plugin cell renderers.
|
|
1901
1930
|
* Provides full context including position and editing state.
|
|
@@ -2054,6 +2083,16 @@ export declare class PluginManager {
|
|
|
2054
2083
|
* Returns true if any plugin handled the row.
|
|
2055
2084
|
*/
|
|
2056
2085
|
renderRow(row: any, rowEl: HTMLElement, rowIndex: number): boolean;
|
|
2086
|
+
/**
|
|
2087
|
+
* Query all plugins with a generic query and collect responses.
|
|
2088
|
+
* This enables inter-plugin communication without the core knowing plugin-specific concepts.
|
|
2089
|
+
*
|
|
2090
|
+
* Common query types are defined in PLUGIN_QUERIES, but plugins can define their own.
|
|
2091
|
+
*
|
|
2092
|
+
* @param query - The query object containing type and context
|
|
2093
|
+
* @returns Array of non-undefined responses from plugins
|
|
2094
|
+
*/
|
|
2095
|
+
queryPlugins<T>(query: PluginQuery): T[];
|
|
2057
2096
|
/**
|
|
2058
2097
|
* Execute onKeyDown hook on all plugins.
|
|
2059
2098
|
* Returns true if any plugin handled the event.
|
|
@@ -2094,9 +2133,18 @@ export declare class PluginManager {
|
|
|
2094
2133
|
*/
|
|
2095
2134
|
onCellMouseUp(event: CellMouseEvent): boolean;
|
|
2096
2135
|
/**
|
|
2097
|
-
* Collect
|
|
2098
|
-
|
|
2099
|
-
|
|
2136
|
+
* Collect horizontal scroll boundary offsets from all plugins.
|
|
2137
|
+
* Combines offsets from all plugins that report them.
|
|
2138
|
+
*
|
|
2139
|
+
* @param rowEl - The row element (optional, for calculating widths from rendered cells)
|
|
2140
|
+
* @param focusedCell - The currently focused cell element (optional, to determine if scrolling should be skipped)
|
|
2141
|
+
* @returns Combined left and right pixel offsets, plus skipScroll if any plugin requests it
|
|
2142
|
+
*/
|
|
2143
|
+
getHorizontalScrollOffsets(rowEl?: HTMLElement, focusedCell?: HTMLElement): {
|
|
2144
|
+
left: number;
|
|
2145
|
+
right: number;
|
|
2146
|
+
skipScroll?: boolean;
|
|
2147
|
+
};
|
|
2100
2148
|
/**
|
|
2101
2149
|
* Collect tool panels from all plugins.
|
|
2102
2150
|
* Returns panels sorted by order (ascending).
|
|
@@ -2115,6 +2163,18 @@ export declare class PluginManager {
|
|
|
2115
2163
|
}[];
|
|
2116
2164
|
}
|
|
2117
2165
|
|
|
2166
|
+
/**
|
|
2167
|
+
* Generic plugin query for inter-plugin communication.
|
|
2168
|
+
* Plugins can define their own query types as string constants
|
|
2169
|
+
* and respond to queries from other plugins.
|
|
2170
|
+
*/
|
|
2171
|
+
export declare interface PluginQuery<T = unknown> {
|
|
2172
|
+
/** Query type identifier (e.g., 'canMoveColumn', 'getContextMenuItems') */
|
|
2173
|
+
type: string;
|
|
2174
|
+
/** Query-specific context/parameters */
|
|
2175
|
+
context: T;
|
|
2176
|
+
}
|
|
2177
|
+
|
|
2118
2178
|
export declare type PrimitiveColumnType = 'number' | 'string' | 'date' | 'boolean' | 'select' | 'typeahead';
|
|
2119
2179
|
|
|
2120
2180
|
/**
|
|
@@ -2177,7 +2237,7 @@ export declare interface RowClickEvent {
|
|
|
2177
2237
|
}
|
|
2178
2238
|
|
|
2179
2239
|
/** Detail payload for a committed row edit (may or may not include changes). */
|
|
2180
|
-
export declare interface RowCommitDetail<TRow =
|
|
2240
|
+
export declare interface RowCommitDetail<TRow = unknown> {
|
|
2181
2241
|
/** Row index that lost edit focus. */
|
|
2182
2242
|
rowIndex: number;
|
|
2183
2243
|
/** Row object reference. */
|
|
@@ -2198,7 +2258,7 @@ export declare interface RowGroupRenderConfig {
|
|
|
2198
2258
|
/** If true, group rows span all columns (single full-width cell). Default false. */
|
|
2199
2259
|
fullWidth?: boolean;
|
|
2200
2260
|
/** Optional label formatter override. Receives raw group value + depth. */
|
|
2201
|
-
formatLabel?: (value:
|
|
2261
|
+
formatLabel?: (value: unknown, depth: number, key: string) => string;
|
|
2202
2262
|
/** Optional aggregate overrides per field for group summary cells (only when not fullWidth). */
|
|
2203
2263
|
aggregators?: Record<string, AggregatorRef>;
|
|
2204
2264
|
/** Additional CSS class applied to each group row root element. */
|