@mikestools/usetable 0.0.1 → 0.0.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 +586 -519
- package/dist/index.d.ts +760 -89
- package/dist/usetable.js +1263 -1078
- package/dist/usetable.umd.cjs +7 -7
- package/package.json +20 -20
- package/showcase/examples/BasicExample.vue +474 -0
package/dist/index.d.ts
CHANGED
|
@@ -1,173 +1,424 @@
|
|
|
1
1
|
import { Ref } from 'vue';
|
|
2
2
|
|
|
3
|
-
/**
|
|
3
|
+
/**
|
|
4
|
+
* Configuration for custom aggregation.
|
|
5
|
+
*/
|
|
6
|
+
export declare interface AggregateConfig<T> {
|
|
7
|
+
/** Initial accumulator value */
|
|
8
|
+
readonly initial: T;
|
|
9
|
+
/** Reducer function */
|
|
10
|
+
readonly reducer: (accumulator: T, value: unknown, rowIndex: number) => T;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
/**
|
|
14
|
+
* Base record interface - all records must have an id.
|
|
15
|
+
* This is the foundation for the shared reactive data schema.
|
|
16
|
+
*/
|
|
17
|
+
export declare interface BaseRecord {
|
|
18
|
+
/** Unique identifier - required on all records */
|
|
19
|
+
readonly id: string;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
/**
|
|
23
|
+
* Cell change record for dirty tracking.
|
|
24
|
+
*/
|
|
4
25
|
export declare interface CellChange {
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
26
|
+
/** Row index */
|
|
27
|
+
readonly row: number;
|
|
28
|
+
/** Column index */
|
|
29
|
+
readonly column: number;
|
|
30
|
+
/** Previous value */
|
|
31
|
+
readonly oldValue: unknown;
|
|
32
|
+
/** New value */
|
|
33
|
+
readonly newValue: unknown;
|
|
9
34
|
}
|
|
10
35
|
|
|
11
|
-
/**
|
|
36
|
+
/**
|
|
37
|
+
* Configuration for a table cell with content and attributes.
|
|
38
|
+
*/
|
|
12
39
|
export declare interface CellConfig {
|
|
13
|
-
value
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
40
|
+
/** The cell value - can be any type including HTML elements */
|
|
41
|
+
readonly value: unknown;
|
|
42
|
+
/** Optional HTML attributes to apply to the cell */
|
|
43
|
+
readonly attributes?: ElementAttributes;
|
|
44
|
+
/** Column span (colspan attribute) */
|
|
45
|
+
readonly columnSpan?: number;
|
|
46
|
+
/** Row span (rowspan attribute) */
|
|
47
|
+
readonly rowSpan?: number;
|
|
17
48
|
}
|
|
18
49
|
|
|
19
|
-
/**
|
|
50
|
+
/**
|
|
51
|
+
* Cell position for focus/navigation.
|
|
52
|
+
*/
|
|
20
53
|
export declare interface CellPosition {
|
|
21
|
-
|
|
22
|
-
|
|
54
|
+
/** Row index */
|
|
55
|
+
readonly row: number;
|
|
56
|
+
/** Column index */
|
|
57
|
+
readonly column: number;
|
|
23
58
|
}
|
|
24
59
|
|
|
60
|
+
/**
|
|
61
|
+
* Validator function for a single cell.
|
|
62
|
+
* Returns true if valid, or a string error message if invalid.
|
|
63
|
+
*/
|
|
25
64
|
export declare type CellValidator = (value: unknown) => boolean | string;
|
|
26
65
|
|
|
27
|
-
/**
|
|
66
|
+
/**
|
|
67
|
+
* Configuration for a table column.
|
|
68
|
+
*/
|
|
28
69
|
export declare interface ColumnConfig {
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
70
|
+
/** Header content - string or CellConfig */
|
|
71
|
+
readonly header: string | CellConfig;
|
|
72
|
+
/** Default value for new cells in this column */
|
|
73
|
+
readonly defaultValue?: unknown;
|
|
74
|
+
/** Default attributes for cells in this column */
|
|
75
|
+
readonly defaultAttributes?: ElementAttributes;
|
|
32
76
|
}
|
|
33
77
|
|
|
34
|
-
/**
|
|
78
|
+
/**
|
|
79
|
+
* Column definition for type parsing/formatting.
|
|
80
|
+
*/
|
|
35
81
|
export declare interface ColumnDefinition {
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
82
|
+
/** Data type of the column */
|
|
83
|
+
readonly type: 'string' | 'number' | 'date' | 'boolean';
|
|
84
|
+
/** Custom parser function */
|
|
85
|
+
readonly parser?: (value: unknown) => unknown;
|
|
86
|
+
/** Custom formatter function */
|
|
87
|
+
readonly formatter?: (value: unknown) => string;
|
|
88
|
+
/** Default value when cell is empty */
|
|
89
|
+
readonly defaultValue?: unknown;
|
|
90
|
+
/** Whether null/undefined values are allowed */
|
|
91
|
+
readonly nullable?: boolean;
|
|
41
92
|
}
|
|
42
93
|
|
|
43
|
-
/**
|
|
94
|
+
/**
|
|
95
|
+
* Configuration for computed columns.
|
|
96
|
+
*/
|
|
44
97
|
export declare interface ComputedColumnConfig {
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
98
|
+
/** Function to compute the column value from row data */
|
|
99
|
+
readonly computeFunction: (row: unknown[]) => unknown;
|
|
100
|
+
/** Column header label */
|
|
101
|
+
readonly label: string;
|
|
102
|
+
/** Position to insert the column */
|
|
103
|
+
readonly index?: number;
|
|
48
104
|
}
|
|
49
105
|
|
|
50
|
-
/**
|
|
106
|
+
/**
|
|
107
|
+
* Configuration for editable cells.
|
|
108
|
+
*/
|
|
51
109
|
export declare interface EditableConfig {
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
110
|
+
/** Enable cell editing */
|
|
111
|
+
readonly cells?: boolean;
|
|
112
|
+
/** Enable header editing */
|
|
113
|
+
readonly headers?: boolean;
|
|
114
|
+
/** Enable footer editing */
|
|
115
|
+
readonly footers?: boolean;
|
|
116
|
+
/** Specific columns that are editable */
|
|
117
|
+
readonly editableColumns?: readonly number[];
|
|
118
|
+
/** Specific rows that are editable */
|
|
119
|
+
readonly editableRows?: readonly number[];
|
|
120
|
+
/** Validator function */
|
|
121
|
+
readonly validator?: (value: string, row: number, column: number) => boolean | string;
|
|
122
|
+
/** Parser function to convert string input to stored value */
|
|
123
|
+
readonly parser?: (value: string, row: number, column: number) => unknown;
|
|
124
|
+
/** Callback when a cell is edited */
|
|
125
|
+
readonly onEdit?: (value: unknown, row: number, column: number) => void;
|
|
60
126
|
}
|
|
61
127
|
|
|
62
128
|
/**
|
|
63
129
|
* Comprehensive HTML element attributes for table elements.
|
|
64
|
-
*
|
|
130
|
+
* Supports class, style, data attributes, ARIA attributes, and event handlers.
|
|
65
131
|
*/
|
|
66
132
|
export declare interface ElementAttributes extends Partial<Omit<HTMLElement, 'style' | 'className' | 'classList' | 'children' | 'childNodes' | 'parentNode' | 'parentElement' | 'attributes' | 'tagName' | 'namespaceURI' | 'shadowRoot' | 'assignedSlot' | 'offsetParent' | 'offsetTop' | 'offsetLeft' | 'offsetWidth' | 'offsetHeight' | 'clientTop' | 'clientLeft' | 'clientWidth' | 'clientHeight' | 'scrollTop' | 'scrollLeft' | 'scrollWidth' | 'scrollHeight' | 'innerHTML' | 'outerHTML' | 'innerText' | 'outerText' | 'textContent' | 'addEventListener' | 'removeEventListener' | 'dispatchEvent' | 'getAttribute' | 'setAttribute' | 'removeAttribute' | 'hasAttribute' | 'appendChild' | 'removeChild' | 'replaceChild' | 'insertBefore' | 'querySelector' | 'querySelectorAll' | 'getElementsByTagName' | 'getElementsByClassName' | 'getElementById' | 'animate' | 'getAnimations' | 'attachShadow' | 'closest' | 'matches' | 'webkitMatchesSelector' | 'getBoundingClientRect' | 'getClientRects' | 'scrollIntoView' | 'scroll' | 'scrollBy' | 'scrollTo' | 'focus' | 'blur' | 'click'>>, Partial<GlobalEventHandlers>, Partial<ARIAMixin> {
|
|
133
|
+
/** CSS class - string, array of strings, or object with boolean values */
|
|
67
134
|
class?: string | string[] | Record<string, boolean>;
|
|
135
|
+
/** Inline styles - string or object */
|
|
68
136
|
style?: string | Partial<CSSStyleDeclaration> | Record<string, string | number>;
|
|
137
|
+
/** Data attributes as object */
|
|
69
138
|
dataset?: Record<string, string>;
|
|
70
|
-
|
|
71
|
-
[key: `
|
|
139
|
+
/** Data attributes with prefix */
|
|
140
|
+
[key: `data-${string}`]: string | undefined;
|
|
141
|
+
/** ARIA attributes with prefix */
|
|
142
|
+
[key: `aria-${string}`]: string | undefined;
|
|
143
|
+
/** Allow any other attributes */
|
|
72
144
|
[key: string]: unknown;
|
|
73
145
|
}
|
|
74
146
|
|
|
75
|
-
/**
|
|
147
|
+
/**
|
|
148
|
+
* Ensure a record has an ID, generating one if missing.
|
|
149
|
+
*/
|
|
150
|
+
export declare function ensureId<T extends Record<string, unknown>>(record: T, generator?: IdGenerator): T & {
|
|
151
|
+
id: string;
|
|
152
|
+
};
|
|
153
|
+
|
|
154
|
+
/**
|
|
155
|
+
* Filter state for tracking row filtering.
|
|
156
|
+
*/
|
|
76
157
|
export declare interface FilterState {
|
|
158
|
+
/** Whether any filter is active */
|
|
77
159
|
readonly isFiltered: Readonly<Ref<boolean>>;
|
|
160
|
+
/** Number of visible rows after filtering */
|
|
78
161
|
readonly filteredRowCount: Readonly<Ref<number>>;
|
|
162
|
+
/** Indices of visible rows */
|
|
79
163
|
readonly filteredIndices: Readonly<Ref<readonly number[]>>;
|
|
80
164
|
}
|
|
81
165
|
|
|
82
|
-
|
|
166
|
+
/**
|
|
167
|
+
* Find record by ID in array.
|
|
168
|
+
*/
|
|
169
|
+
export declare function findById<T extends BaseRecord>(records: readonly T[], id: string): T | undefined;
|
|
170
|
+
|
|
171
|
+
/**
|
|
172
|
+
* Validator function for all cells.
|
|
173
|
+
* Returns null if valid, or a string error message if invalid.
|
|
174
|
+
*/
|
|
175
|
+
export declare type FullValidator = (value: unknown, row: number, column: number) => string | null;
|
|
176
|
+
|
|
177
|
+
/**
|
|
178
|
+
* Default ID generator using crypto.randomUUID.
|
|
179
|
+
*/
|
|
180
|
+
export declare function generateId(): string;
|
|
83
181
|
|
|
182
|
+
/**
|
|
183
|
+
* Symbol for tracking auto-generated IDs.
|
|
184
|
+
* Internal use only - invisible to JSON.stringify, Object.keys, for...in.
|
|
185
|
+
*/
|
|
186
|
+
export declare const ID_GENERATED: unique symbol;
|
|
187
|
+
|
|
188
|
+
/**
|
|
189
|
+
* ID generator function type.
|
|
190
|
+
*/
|
|
191
|
+
export declare type IdGenerator = () => string;
|
|
192
|
+
|
|
193
|
+
/**
|
|
194
|
+
* Find record index by ID.
|
|
195
|
+
*/
|
|
196
|
+
export declare function indexById<T extends BaseRecord>(records: readonly T[], id: string): number;
|
|
197
|
+
|
|
198
|
+
/**
|
|
199
|
+
* Type guard for CellConfig.
|
|
200
|
+
*/
|
|
84
201
|
export declare function isCellConfig(value: unknown): value is CellConfig;
|
|
85
202
|
|
|
203
|
+
/**
|
|
204
|
+
* Type guard for ValidationError.
|
|
205
|
+
*/
|
|
86
206
|
export declare function isValidationError(value: unknown): value is ValidationError;
|
|
87
207
|
|
|
208
|
+
/**
|
|
209
|
+
* Type guard for ValidationError array.
|
|
210
|
+
*/
|
|
88
211
|
export declare function isValidationErrorArray(value: unknown): value is ValidationError[];
|
|
89
212
|
|
|
213
|
+
/**
|
|
214
|
+
* Type guard for ValidationResult.
|
|
215
|
+
*/
|
|
90
216
|
export declare function isValidationResult(value: unknown): value is ValidationResult;
|
|
91
217
|
|
|
92
|
-
/**
|
|
218
|
+
/**
|
|
219
|
+
* Check if a value is a valid ID.
|
|
220
|
+
*/
|
|
221
|
+
export declare function isValidId(value: unknown): value is string;
|
|
222
|
+
|
|
223
|
+
/**
|
|
224
|
+
* Pagination configuration.
|
|
225
|
+
*/
|
|
93
226
|
export declare interface PaginationConfig {
|
|
94
|
-
|
|
95
|
-
|
|
227
|
+
/** Number of rows per page */
|
|
228
|
+
readonly pageSize: number;
|
|
229
|
+
/** Initial page (1-based) */
|
|
230
|
+
readonly currentPage?: number;
|
|
96
231
|
}
|
|
97
232
|
|
|
98
|
-
/**
|
|
233
|
+
/**
|
|
234
|
+
* Pagination state.
|
|
235
|
+
*/
|
|
99
236
|
export declare interface PaginationState {
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
237
|
+
/** Total number of pages */
|
|
238
|
+
readonly totalPages: Readonly<Ref<number>>;
|
|
239
|
+
/** Current page (1-based) */
|
|
240
|
+
readonly currentPage: Ref<number>;
|
|
241
|
+
/** Number of rows per page */
|
|
242
|
+
readonly pageSize: Ref<number>;
|
|
243
|
+
/** Indices of visible rows on current page */
|
|
244
|
+
readonly visibleRows: Ref<number[]>;
|
|
104
245
|
}
|
|
105
246
|
|
|
106
|
-
/**
|
|
247
|
+
/**
|
|
248
|
+
* Reactive wrapper for table cells.
|
|
249
|
+
*/
|
|
107
250
|
export declare interface ReactiveCellCollection {
|
|
251
|
+
/** All cell elements */
|
|
108
252
|
readonly cells: Readonly<Ref<readonly HTMLTableCellElement[]>>;
|
|
253
|
+
/** Number of cells */
|
|
109
254
|
readonly cellCount: Readonly<Ref<number>>;
|
|
110
255
|
}
|
|
111
256
|
|
|
112
|
-
/**
|
|
257
|
+
/**
|
|
258
|
+
* Reactive wrapper for table rows.
|
|
259
|
+
*/
|
|
113
260
|
export declare interface ReactiveRowCollection {
|
|
261
|
+
/** All row elements */
|
|
114
262
|
readonly rows: Readonly<Ref<readonly HTMLTableRowElement[]>>;
|
|
263
|
+
/** Number of rows */
|
|
115
264
|
readonly rowCount: Readonly<Ref<number>>;
|
|
116
265
|
}
|
|
117
266
|
|
|
118
|
-
/**
|
|
267
|
+
/**
|
|
268
|
+
* Reactive wrapper for tbody elements.
|
|
269
|
+
*/
|
|
119
270
|
export declare interface ReactiveTBodyCollection {
|
|
271
|
+
/** All tbody elements */
|
|
120
272
|
readonly tBodies: Readonly<Ref<readonly HTMLTableSectionElement[]>>;
|
|
273
|
+
/** Number of tbody elements */
|
|
121
274
|
readonly tBodyCount: Readonly<Ref<number>>;
|
|
122
275
|
}
|
|
123
276
|
|
|
277
|
+
/**
|
|
278
|
+
* Column definition for record-based tables.
|
|
279
|
+
* Maps record fields to table columns.
|
|
280
|
+
*/
|
|
281
|
+
export declare interface RecordColumnDef<T extends BaseRecord = BaseRecord> {
|
|
282
|
+
/** Field name (string) or accessor function */
|
|
283
|
+
readonly field: string | ((record: T) => unknown);
|
|
284
|
+
/** Column header text */
|
|
285
|
+
readonly header: string;
|
|
286
|
+
/** Format value for display */
|
|
287
|
+
readonly format?: (value: unknown, record: T) => string;
|
|
288
|
+
/** Parse display value back to data value */
|
|
289
|
+
readonly parse?: (value: string, record: T) => unknown;
|
|
290
|
+
/** Whether column is editable (default: true for fields, false for functions) */
|
|
291
|
+
readonly editable?: boolean;
|
|
292
|
+
/** Column width */
|
|
293
|
+
readonly width?: string | number;
|
|
294
|
+
/** Default value for new records */
|
|
295
|
+
readonly defaultValue?: unknown;
|
|
296
|
+
}
|
|
297
|
+
|
|
298
|
+
/**
|
|
299
|
+
* Options for record-based table configuration.
|
|
300
|
+
*/
|
|
301
|
+
export declare interface RecordTableOptions<T extends BaseRecord = BaseRecord> {
|
|
302
|
+
/** Column definitions mapping fields to columns */
|
|
303
|
+
readonly columns: readonly RecordColumnDef<T>[];
|
|
304
|
+
/** ID generator for new records */
|
|
305
|
+
readonly idGenerator?: IdGenerator;
|
|
306
|
+
/** Callback when a cell is edited */
|
|
307
|
+
readonly onCellEdit?: (recordId: string, field: keyof T | string, value: unknown) => void;
|
|
308
|
+
/** Callback when a row is inserted */
|
|
309
|
+
readonly onRowInsert?: (values: Omit<T, 'id'>) => void;
|
|
310
|
+
/** Callback when a row is deleted */
|
|
311
|
+
readonly onRowDelete?: (recordId: string) => void;
|
|
312
|
+
/** Callback when row selection changes */
|
|
313
|
+
readonly onRowSelect?: (recordId: string | null) => void;
|
|
314
|
+
}
|
|
315
|
+
|
|
316
|
+
/**
|
|
317
|
+
* Record-based table state.
|
|
318
|
+
*/
|
|
319
|
+
export declare interface RecordTableState<T extends BaseRecord = BaseRecord> {
|
|
320
|
+
/** All records in the table */
|
|
321
|
+
readonly records: readonly T[];
|
|
322
|
+
/** Currently selected record ID */
|
|
323
|
+
readonly selectedRecordId: string | null;
|
|
324
|
+
/** Record IDs in display order */
|
|
325
|
+
readonly displayOrder: readonly string[];
|
|
326
|
+
}
|
|
327
|
+
|
|
328
|
+
/**
|
|
329
|
+
* Validator function for a row.
|
|
330
|
+
* Returns true if valid, or a string error message if invalid.
|
|
331
|
+
*/
|
|
124
332
|
export declare type RowValidator = (rowData: unknown[]) => boolean | string;
|
|
125
333
|
|
|
126
|
-
/**
|
|
334
|
+
/**
|
|
335
|
+
* Options for search operations.
|
|
336
|
+
*/
|
|
127
337
|
export declare interface SearchOptions {
|
|
128
|
-
|
|
338
|
+
/** Whether search is case-sensitive */
|
|
339
|
+
readonly caseSensitive?: boolean;
|
|
129
340
|
}
|
|
130
341
|
|
|
131
|
-
/**
|
|
342
|
+
/**
|
|
343
|
+
* Search result for a found cell.
|
|
344
|
+
*/
|
|
132
345
|
export declare interface SearchResult {
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
346
|
+
/** Row index */
|
|
347
|
+
readonly row: number;
|
|
348
|
+
/** Column index */
|
|
349
|
+
readonly column: number;
|
|
350
|
+
/** The found value */
|
|
351
|
+
readonly value: unknown;
|
|
136
352
|
}
|
|
137
353
|
|
|
138
|
-
/**
|
|
354
|
+
/**
|
|
355
|
+
* Sort state for tracking column sorting.
|
|
356
|
+
*/
|
|
139
357
|
export declare interface SortState {
|
|
358
|
+
/** Currently sorted column index */
|
|
140
359
|
readonly columnIndex: Readonly<Ref<number | null>>;
|
|
360
|
+
/** Whether sorted ascending */
|
|
141
361
|
readonly ascending: Readonly<Ref<boolean>>;
|
|
362
|
+
/** Whether sorted descending */
|
|
142
363
|
readonly descending: Readonly<Ref<boolean>>;
|
|
143
364
|
}
|
|
144
365
|
|
|
145
|
-
/**
|
|
366
|
+
/**
|
|
367
|
+
* Strip generated ID from record (for export).
|
|
368
|
+
*/
|
|
369
|
+
export declare function stripGeneratedId<T extends {
|
|
370
|
+
id: string;
|
|
371
|
+
}>(record: T): Omit<T, 'id'> | T;
|
|
372
|
+
|
|
373
|
+
/**
|
|
374
|
+
* Table cell composable.
|
|
375
|
+
*/
|
|
146
376
|
export declare interface TableCell {
|
|
377
|
+
/** The cell element */
|
|
147
378
|
readonly element: Readonly<Ref<HTMLTableCellElement>>;
|
|
379
|
+
/** Cell index within row */
|
|
148
380
|
readonly cellIndex: Readonly<Ref<number>>;
|
|
381
|
+
/** Column span */
|
|
149
382
|
readonly columnSpan: Ref<number>;
|
|
383
|
+
/** Row span */
|
|
150
384
|
readonly rowSpan: Ref<number>;
|
|
385
|
+
/** Header IDs */
|
|
151
386
|
readonly headers: Ref<string>;
|
|
387
|
+
/** Abbreviated text */
|
|
152
388
|
readonly abbr: Ref<string>;
|
|
389
|
+
/** Scope (for th elements) */
|
|
153
390
|
readonly scope: Ref<string>;
|
|
154
391
|
}
|
|
155
392
|
|
|
156
|
-
/**
|
|
393
|
+
/**
|
|
394
|
+
* Table row composable.
|
|
395
|
+
*/
|
|
157
396
|
export declare interface TableRow extends ReactiveCellCollection {
|
|
397
|
+
/** The row element */
|
|
158
398
|
readonly element: Readonly<Ref<HTMLTableRowElement>>;
|
|
399
|
+
/** Row index in table */
|
|
159
400
|
readonly rowIndex: Readonly<Ref<number>>;
|
|
401
|
+
/** Row index in parent section */
|
|
160
402
|
readonly sectionRowIndex: Readonly<Ref<number>>;
|
|
403
|
+
/** Insert a cell at index */
|
|
161
404
|
insertCell(index?: number): HTMLTableCellElement;
|
|
405
|
+
/** Delete a cell at index */
|
|
162
406
|
deleteCell(index: number): void;
|
|
407
|
+
/** Get TableCell composable for cell at index */
|
|
163
408
|
getCell(index: number): TableCell | undefined;
|
|
164
409
|
}
|
|
165
410
|
|
|
166
|
-
/**
|
|
411
|
+
/**
|
|
412
|
+
* Table section composable.
|
|
413
|
+
*/
|
|
167
414
|
export declare interface TableSection extends ReactiveRowCollection {
|
|
415
|
+
/** The section element */
|
|
168
416
|
readonly element: Readonly<Ref<HTMLTableSectionElement>>;
|
|
417
|
+
/** Insert a row at index */
|
|
169
418
|
insertRow(index?: number): HTMLTableRowElement;
|
|
419
|
+
/** Delete a row at index */
|
|
170
420
|
deleteRow(index: number): void;
|
|
421
|
+
/** Get TableRow composable for row at index */
|
|
171
422
|
getRow(index: number): TableRow | undefined;
|
|
172
423
|
}
|
|
173
424
|
|
|
@@ -178,327 +429,747 @@ export declare interface TableSection extends ReactiveRowCollection {
|
|
|
178
429
|
*/
|
|
179
430
|
export declare function useTable(element: Ref<HTMLTableElement>): UseTableReturn;
|
|
180
431
|
|
|
181
|
-
/**
|
|
432
|
+
/**
|
|
433
|
+
* Main table composable return type.
|
|
434
|
+
*
|
|
435
|
+
* Provides comprehensive table manipulation capabilities including:
|
|
436
|
+
* - DOM structure methods
|
|
437
|
+
* - Data layer methods
|
|
438
|
+
* - Sorting, filtering, and searching
|
|
439
|
+
* - Selection and focus management
|
|
440
|
+
* - Validation and transformation
|
|
441
|
+
* - Import/export functionality
|
|
442
|
+
* - Undo/redo support
|
|
443
|
+
* - Pagination and virtual scrolling
|
|
444
|
+
*/
|
|
182
445
|
export declare interface UseTableReturn extends ReactiveRowCollection, ReactiveTBodyCollection {
|
|
446
|
+
/** The table element */
|
|
183
447
|
readonly element: Readonly<Ref<HTMLTableElement>>;
|
|
448
|
+
/** Caption element */
|
|
184
449
|
readonly caption: Ref<HTMLTableCaptionElement | null>;
|
|
450
|
+
/** Thead element */
|
|
185
451
|
readonly tHead: Ref<HTMLTableSectionElement | null>;
|
|
452
|
+
/** Tfoot element */
|
|
186
453
|
readonly tFoot: Ref<HTMLTableSectionElement | null>;
|
|
454
|
+
/** Table body data as 2D array */
|
|
187
455
|
readonly data: Ref<unknown[][]>;
|
|
456
|
+
/** Header texts */
|
|
188
457
|
readonly headers: Ref<string[]>;
|
|
458
|
+
/** Number of columns */
|
|
189
459
|
readonly columnCount: Readonly<Ref<number>>;
|
|
460
|
+
/** Create or get existing caption */
|
|
190
461
|
createCaption(): HTMLTableCaptionElement;
|
|
462
|
+
/** Delete caption */
|
|
191
463
|
deleteCaption(): void;
|
|
464
|
+
/** Create or get existing thead */
|
|
192
465
|
createTHead(): HTMLTableSectionElement;
|
|
466
|
+
/** Delete thead */
|
|
193
467
|
deleteTHead(): void;
|
|
468
|
+
/** Create or get existing tfoot */
|
|
194
469
|
createTFoot(): HTMLTableSectionElement;
|
|
470
|
+
/** Delete tfoot */
|
|
195
471
|
deleteTFoot(): void;
|
|
472
|
+
/** Create new tbody */
|
|
196
473
|
createTBody(): HTMLTableSectionElement;
|
|
474
|
+
/** Insert row at index */
|
|
197
475
|
insertRow(index?: number): HTMLTableRowElement;
|
|
476
|
+
/** Delete row at index */
|
|
198
477
|
deleteRow(index: number): void;
|
|
478
|
+
/** Get thead as TableSection */
|
|
199
479
|
getTHead(): TableSection | undefined;
|
|
480
|
+
/** Get tfoot as TableSection */
|
|
200
481
|
getTFoot(): TableSection | undefined;
|
|
482
|
+
/** Get tbody at index as TableSection */
|
|
201
483
|
getTBody(index: number): TableSection | undefined;
|
|
484
|
+
/** Get row at index as TableRow */
|
|
202
485
|
getRow(index: number): TableRow | undefined;
|
|
486
|
+
/** Add a row with data */
|
|
203
487
|
addRow(rowData: readonly unknown[], index?: number): HTMLTableRowElement;
|
|
488
|
+
/** Remove row at index */
|
|
204
489
|
removeRow(index: number): void;
|
|
490
|
+
/** Add a column */
|
|
205
491
|
addColumn(headerText?: string, defaultValue?: unknown, index?: number): void;
|
|
492
|
+
/** Remove column at index */
|
|
206
493
|
removeColumn(index: number): void;
|
|
494
|
+
/** Set cell value */
|
|
207
495
|
setCell(rowIndex: number, columnIndex: number, value: unknown): void;
|
|
496
|
+
/** Get cell value */
|
|
208
497
|
getCell(rowIndex: number, columnIndex: number): unknown;
|
|
498
|
+
/** Set caption text */
|
|
209
499
|
setCaption(text: string): void;
|
|
500
|
+
/** Set all headers */
|
|
210
501
|
setHeaders(headerTexts: readonly string[]): void;
|
|
502
|
+
/** Set footer row */
|
|
211
503
|
setFooter(footerData: readonly unknown[]): void;
|
|
504
|
+
/** Set all data */
|
|
212
505
|
setData(newData: readonly (readonly unknown[])[]): void;
|
|
506
|
+
/** Clear body data (keep headers) */
|
|
213
507
|
clearData(): void;
|
|
508
|
+
/** Reset entire table */
|
|
214
509
|
reset(): void;
|
|
510
|
+
/** Sync reactive state with DOM */
|
|
215
511
|
sync(): void;
|
|
512
|
+
/** Add row with cell configs */
|
|
216
513
|
addRowWithAttributes(rowData: readonly (unknown | CellConfig)[], attributes?: ElementAttributes, index?: number): HTMLTableRowElement;
|
|
514
|
+
/** Add column with config */
|
|
217
515
|
addColumnWithAttributes(config: ColumnConfig, index?: number): void;
|
|
516
|
+
/** Set headers with configs */
|
|
218
517
|
setHeadersWithAttributes(headerConfigs: readonly (string | CellConfig)[]): void;
|
|
518
|
+
/** Set cell with attributes */
|
|
219
519
|
setCellWithAttributes(rowIndex: number, columnIndex: number, value: unknown, attributes?: ElementAttributes): void;
|
|
520
|
+
/** Get row data copy */
|
|
220
521
|
getRowData(index: number): unknown[] | undefined;
|
|
522
|
+
/** Set row data */
|
|
221
523
|
setRowData(index: number, rowData: readonly unknown[]): void;
|
|
524
|
+
/** Get all row data as copy */
|
|
222
525
|
getAllRowData(): unknown[][];
|
|
526
|
+
/** Get column data */
|
|
223
527
|
getColumnData(index: number): unknown[];
|
|
528
|
+
/** Set column data */
|
|
224
529
|
setColumnData(index: number, columnData: readonly unknown[]): void;
|
|
530
|
+
/** Get cell range */
|
|
225
531
|
getCellRange(rowStart: number, rowEnd: number, columnStart: number, columnEnd: number): unknown[][];
|
|
532
|
+
/** Set cell range */
|
|
226
533
|
setCellRange(rowStart: number, columnStart: number, rangeData: readonly (readonly unknown[])[]): void;
|
|
534
|
+
/** Get header data copy */
|
|
227
535
|
getHeaderData(): string[];
|
|
536
|
+
/** Get footer data */
|
|
228
537
|
getFooterData(): unknown[] | undefined;
|
|
538
|
+
/** Set footer cell */
|
|
229
539
|
setFooterCell(columnIndex: number, value: unknown): void;
|
|
540
|
+
/** Get footer cell */
|
|
230
541
|
getFooterCell(columnIndex: number): unknown;
|
|
542
|
+
/** Update cell with config */
|
|
231
543
|
updateCell(rowIndex: number, columnIndex: number, config: CellConfig): void;
|
|
544
|
+
/** Update row data */
|
|
232
545
|
updateRow(index: number, rowData: readonly (unknown | CellConfig)[]): void;
|
|
546
|
+
/** Get cell DOM element */
|
|
233
547
|
getCellElement(rowIndex: number, columnIndex: number): HTMLTableCellElement | undefined;
|
|
548
|
+
/** Get row DOM element */
|
|
234
549
|
getRowElement(index: number): HTMLTableRowElement | undefined;
|
|
550
|
+
/** Select multiple rows */
|
|
235
551
|
selectRows(indices: readonly number[]): unknown[][];
|
|
552
|
+
/** Select multiple columns */
|
|
236
553
|
selectColumns(indices: readonly number[]): unknown[][];
|
|
554
|
+
/** Update multiple rows */
|
|
237
555
|
updateRows(updates: ReadonlyMap<number, readonly (unknown | CellConfig)[]>): void;
|
|
556
|
+
/** Update multiple cells */
|
|
238
557
|
updateCells(updates: ReadonlyMap<readonly [number, number], unknown | CellConfig>): void;
|
|
558
|
+
/** Get all row elements */
|
|
239
559
|
getRowElements(): readonly HTMLTableRowElement[];
|
|
560
|
+
/** Get cells for a row */
|
|
240
561
|
getRowCellElements(rowIndex: number): readonly HTMLTableCellElement[];
|
|
562
|
+
/** Set multiple rows */
|
|
241
563
|
setRows(startIndex: number, rows: readonly (readonly (unknown | CellConfig)[])[]): void;
|
|
564
|
+
/** Validate single cell */
|
|
242
565
|
validateCell(rowIndex: number, columnIndex: number, validator: CellValidator): true | ValidationError;
|
|
566
|
+
/** Validate single row */
|
|
243
567
|
validateRow(index: number, validator: RowValidator): true | ValidationError[];
|
|
568
|
+
/** Validate single column */
|
|
244
569
|
validateColumn(index: number, validator: CellValidator): true | ValidationError[];
|
|
570
|
+
/** Validate all cells */
|
|
245
571
|
validateAll(validator: FullValidator): ValidationResult;
|
|
572
|
+
/** Sum of column values */
|
|
246
573
|
sum(columnIndex: number): number;
|
|
574
|
+
/** Average of column values */
|
|
247
575
|
average(columnIndex: number): number;
|
|
576
|
+
/** Minimum value in column */
|
|
248
577
|
min(columnIndex: number): unknown;
|
|
578
|
+
/** Maximum value in column */
|
|
249
579
|
max(columnIndex: number): unknown;
|
|
580
|
+
/** Count values in column */
|
|
250
581
|
count(columnIndex: number, predicate?: (value: unknown) => boolean): number;
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
}): T;
|
|
582
|
+
/** Custom aggregation */
|
|
583
|
+
aggregate<T>(columnIndex: number, options: AggregateConfig<T>): T;
|
|
584
|
+
/** Transform all cells in column */
|
|
255
585
|
transformColumn(columnIndex: number, transformer: (value: unknown, rowIndex: number) => unknown): void;
|
|
586
|
+
/** Transform all cells in row */
|
|
256
587
|
transformRow(rowIndex: number, transformer: (value: unknown, colIndex: number) => unknown): void;
|
|
588
|
+
/** Transform all cells */
|
|
257
589
|
transformCells(transformer: (value: unknown, rowIndex: number, colIndex: number) => unknown): void;
|
|
590
|
+
/** Export to CSV string */
|
|
258
591
|
exportToCSV(): string;
|
|
592
|
+
/** Export to JSON string */
|
|
259
593
|
exportToJSON(): string;
|
|
594
|
+
/** Import from 2D array */
|
|
260
595
|
importFromArray(data: readonly (readonly unknown[])[]): void;
|
|
596
|
+
/** Import from CSV string */
|
|
261
597
|
importFromCSV(csv: string): void;
|
|
598
|
+
/** Import from JSON string */
|
|
262
599
|
importFromJSON(json: string): void;
|
|
600
|
+
/** Search all cells */
|
|
263
601
|
search(query: string, options?: SearchOptions): SearchResult[];
|
|
602
|
+
/** Search single column */
|
|
264
603
|
searchColumn(columnIndex: number, query: string, options?: SearchOptions): SearchResult[];
|
|
604
|
+
/** Selected row indices */
|
|
265
605
|
readonly selectedRows: Readonly<Ref<Set<number>>>;
|
|
606
|
+
/** Selected cell keys (row,column format) */
|
|
266
607
|
readonly selectedCells: Readonly<Ref<Set<string>>>;
|
|
608
|
+
/** Select a row */
|
|
267
609
|
selectRow(index: number): void;
|
|
610
|
+
/** Deselect a row */
|
|
268
611
|
deselectRow(index: number): void;
|
|
612
|
+
/** Toggle row selection */
|
|
269
613
|
toggleRowSelection(index: number): void;
|
|
614
|
+
/** Check if row is selected */
|
|
270
615
|
isRowSelected(index: number): boolean;
|
|
616
|
+
/** Select a cell */
|
|
271
617
|
selectCell(rowIndex: number, columnIndex: number): void;
|
|
618
|
+
/** Clear all selection */
|
|
272
619
|
clearSelection(): void;
|
|
620
|
+
/** Enable cell editing */
|
|
273
621
|
enableCellEditing(config?: EditableConfig): void;
|
|
622
|
+
/** Disable cell editing */
|
|
274
623
|
disableCellEditing(): void;
|
|
624
|
+
/** Enable header editing */
|
|
275
625
|
enableHeaderEditing(config?: Omit<EditableConfig, 'cells'>): void;
|
|
626
|
+
/** Disable header editing */
|
|
276
627
|
disableHeaderEditing(): void;
|
|
628
|
+
/** Enable editing for specific column */
|
|
277
629
|
enableColumnEditing(columnIndex: number, config?: EditableConfig): void;
|
|
630
|
+
/** Disable editing for specific column */
|
|
278
631
|
disableColumnEditing(columnIndex: number): void;
|
|
632
|
+
/** Enable editing for specific row */
|
|
279
633
|
enableRowEditing(rowIndex: number, config?: EditableConfig): void;
|
|
634
|
+
/** Disable editing for specific row */
|
|
280
635
|
disableRowEditing(rowIndex: number): void;
|
|
636
|
+
/** Enable double-click to edit (returns cleanup) */
|
|
281
637
|
enableEditing(): () => void;
|
|
638
|
+
/** Group rows by key function */
|
|
282
639
|
groupBy(keyFunction: (row: unknown[]) => string | number): Map<string | number, number[]>;
|
|
640
|
+
/** Add computed column */
|
|
283
641
|
addComputedColumn(config: ComputedColumnConfig): number;
|
|
642
|
+
/** Remove computed column */
|
|
284
643
|
removeComputedColumn(index: number): void;
|
|
285
|
-
pagination
|
|
644
|
+
/** Current pagination state */
|
|
645
|
+
readonly pagination: PaginationState | null;
|
|
646
|
+
/** Enable pagination */
|
|
286
647
|
paginate(config: PaginationConfig): void;
|
|
648
|
+
/** Go to next page */
|
|
287
649
|
nextPage(): void;
|
|
650
|
+
/** Go to previous page */
|
|
288
651
|
previousPage(): void;
|
|
652
|
+
/** Go to specific page */
|
|
289
653
|
goToPage(page: number): void;
|
|
290
|
-
|
|
654
|
+
/** Current virtual scroll state */
|
|
655
|
+
readonly virtualScroll: VirtualScrollState | null;
|
|
656
|
+
/** Enable virtual scrolling */
|
|
291
657
|
enableVirtualScrolling(config: VirtualScrollConfig): void;
|
|
658
|
+
/** Disable virtual scrolling */
|
|
292
659
|
disableVirtualScrolling(): void;
|
|
660
|
+
/** Execute operations with rollback on error */
|
|
293
661
|
transaction<T>(callback: () => T | Promise<T>): T | Promise<T>;
|
|
662
|
+
/** Subscribe to data changes (returns unsubscribe) */
|
|
294
663
|
onDataChange(callback: (data: unknown[][]) => void): () => void;
|
|
664
|
+
/** Current sort state */
|
|
295
665
|
readonly sortState: SortState;
|
|
666
|
+
/** Sort column ascending */
|
|
296
667
|
sortColumnAscending(columnIndex: number): void;
|
|
668
|
+
/** Sort column descending */
|
|
297
669
|
sortColumnDescending(columnIndex: number): void;
|
|
670
|
+
/** Sort column ascending with custom comparator */
|
|
298
671
|
sortColumnAscendingWith(columnIndex: number, comparator: (a: unknown, b: unknown) => number): void;
|
|
672
|
+
/** Sort column descending with custom comparator */
|
|
299
673
|
sortColumnDescendingWith(columnIndex: number, comparator: (a: unknown, b: unknown) => number): void;
|
|
674
|
+
/** Clear sorting */
|
|
300
675
|
clearColumnSort(): void;
|
|
676
|
+
/** Get sorted column index */
|
|
301
677
|
getSortedColumnIndex(): number | null;
|
|
678
|
+
/** Check if sorted ascending */
|
|
302
679
|
isSortedAscending(): boolean;
|
|
680
|
+
/** Check if sorted descending */
|
|
303
681
|
isSortedDescending(): boolean;
|
|
682
|
+
/** Check if any sort is active */
|
|
304
683
|
isSorted(): boolean;
|
|
684
|
+
/** Current filter state */
|
|
305
685
|
readonly filterState: FilterState;
|
|
686
|
+
/** Filter rows by predicate */
|
|
306
687
|
filterRows(predicate: (rowData: unknown[], rowIndex: number) => boolean): void;
|
|
688
|
+
/** Filter by column predicate */
|
|
307
689
|
filterColumn(columnIndex: number, predicate: (value: unknown) => boolean): void;
|
|
690
|
+
/** Filter by exact value */
|
|
308
691
|
filterColumnByValue(columnIndex: number, value: unknown): void;
|
|
692
|
+
/** Filter by multiple values */
|
|
309
693
|
filterColumnByValues(columnIndex: number, values: readonly unknown[]): void;
|
|
694
|
+
/** Clear all filters */
|
|
310
695
|
clearFilters(): void;
|
|
696
|
+
/** Get visible row indices */
|
|
311
697
|
getFilteredRowIndices(): readonly number[];
|
|
698
|
+
/** Set function to generate row keys */
|
|
312
699
|
setRowKeyFunction(keyFunction: (rowData: unknown[], rowIndex: number) => string | number): void;
|
|
700
|
+
/** Clear row key function */
|
|
313
701
|
clearRowKeyFunction(): void;
|
|
702
|
+
/** Check if row key function is set */
|
|
314
703
|
hasRowKeyFunction(): boolean;
|
|
704
|
+
/** Get row data by key */
|
|
315
705
|
getRowByKey(key: string | number): unknown[] | undefined;
|
|
706
|
+
/** Get row index by key */
|
|
316
707
|
getRowIndexByKey(key: string | number): number | undefined;
|
|
708
|
+
/** Update row by key */
|
|
317
709
|
updateRowByKey(key: string | number, rowData: readonly unknown[]): boolean;
|
|
710
|
+
/** Remove row by key */
|
|
318
711
|
removeRowByKey(key: string | number): boolean;
|
|
712
|
+
/** Check if row with key exists */
|
|
319
713
|
hasRowWithKey(key: string | number): boolean;
|
|
714
|
+
/** Get key for row */
|
|
320
715
|
getRowKey(rowIndex: number): string | number | undefined;
|
|
716
|
+
/** Get all row keys */
|
|
321
717
|
getAllRowKeys(): readonly (string | number)[];
|
|
718
|
+
/** Set column definition */
|
|
322
719
|
setColumnDefinition(columnIndex: number, definition: ColumnDefinition): void;
|
|
720
|
+
/** Set all column definitions */
|
|
323
721
|
setColumnDefinitions(definitions: readonly (ColumnDefinition | undefined)[]): void;
|
|
722
|
+
/** Clear column definition */
|
|
324
723
|
clearColumnDefinition(columnIndex: number): void;
|
|
724
|
+
/** Clear all column definitions */
|
|
325
725
|
clearColumnDefinitions(): void;
|
|
726
|
+
/** Get column definition */
|
|
326
727
|
getColumnDefinition(columnIndex: number): ColumnDefinition | undefined;
|
|
728
|
+
/** Check if column has definition */
|
|
327
729
|
hasColumnDefinition(columnIndex: number): boolean;
|
|
730
|
+
/** Get parsed cell value */
|
|
328
731
|
getParsedCell(rowIndex: number, columnIndex: number): unknown;
|
|
732
|
+
/** Get parsed row data */
|
|
329
733
|
getParsedRowData(rowIndex: number): unknown[];
|
|
734
|
+
/** Get parsed column data */
|
|
330
735
|
getParsedColumnData(columnIndex: number): unknown[];
|
|
736
|
+
/** Get all parsed data */
|
|
331
737
|
getParsedData(): unknown[][];
|
|
738
|
+
/** Whether table has unsaved changes */
|
|
332
739
|
readonly dirtyState: Readonly<Ref<boolean>>;
|
|
740
|
+
/** Mark as clean (save point) */
|
|
333
741
|
markClean(): void;
|
|
742
|
+
/** Mark as dirty */
|
|
334
743
|
markDirty(): void;
|
|
744
|
+
/** Check if dirty */
|
|
335
745
|
isDirty(): boolean;
|
|
746
|
+
/** Check if has changes */
|
|
336
747
|
hasChanges(): boolean;
|
|
748
|
+
/** Get all cell changes */
|
|
337
749
|
getChangedCells(): readonly CellChange[];
|
|
750
|
+
/** Get changed row indices */
|
|
338
751
|
getChangedRowIndices(): readonly number[];
|
|
752
|
+
/** Get changed column indices */
|
|
339
753
|
getChangedColumnIndices(): readonly number[];
|
|
754
|
+
/** Undo last change */
|
|
340
755
|
undo(): boolean;
|
|
756
|
+
/** Redo last undone change */
|
|
341
757
|
redo(): boolean;
|
|
758
|
+
/** Clear history */
|
|
342
759
|
clearHistory(): void;
|
|
760
|
+
/** Check if can undo */
|
|
343
761
|
canUndo(): boolean;
|
|
762
|
+
/** Check if can redo */
|
|
344
763
|
canRedo(): boolean;
|
|
764
|
+
/** Get undo stack size */
|
|
345
765
|
getUndoStackSize(): number;
|
|
766
|
+
/** Get redo stack size */
|
|
346
767
|
getRedoStackSize(): number;
|
|
768
|
+
/** Set history limit */
|
|
347
769
|
setHistoryLimit(limit: number): void;
|
|
770
|
+
/** Get history limit */
|
|
348
771
|
getHistoryLimit(): number;
|
|
772
|
+
/** Select all rows */
|
|
349
773
|
selectAllRows(): void;
|
|
774
|
+
/** Deselect all rows */
|
|
350
775
|
deselectAllRows(): void;
|
|
776
|
+
/** Select range of rows */
|
|
351
777
|
selectRowRange(startIndex: number, endIndex: number): void;
|
|
778
|
+
/** Invert row selection */
|
|
352
779
|
invertRowSelection(): void;
|
|
780
|
+
/** Get data for selected rows */
|
|
353
781
|
getSelectedRowData(): readonly unknown[][];
|
|
782
|
+
/** Get selected row indices */
|
|
354
783
|
getSelectedRowIndices(): readonly number[];
|
|
784
|
+
/** Get selected cell positions */
|
|
355
785
|
getSelectedCellIndices(): readonly CellPosition[];
|
|
786
|
+
/** Currently focused cell */
|
|
356
787
|
readonly focusedCell: Readonly<Ref<CellPosition | null>>;
|
|
788
|
+
/** Focus a cell */
|
|
357
789
|
focusCell(rowIndex: number, columnIndex: number): void;
|
|
790
|
+
/** Clear cell focus */
|
|
358
791
|
clearCellFocus(): void;
|
|
792
|
+
/** Get focused cell position */
|
|
359
793
|
getFocusedCell(): CellPosition | null;
|
|
794
|
+
/** Check if cell is focused */
|
|
360
795
|
isCellFocused(rowIndex: number, columnIndex: number): boolean;
|
|
796
|
+
/** Move focus up */
|
|
361
797
|
moveFocusUp(): boolean;
|
|
798
|
+
/** Move focus down */
|
|
362
799
|
moveFocusDown(): boolean;
|
|
800
|
+
/** Move focus left */
|
|
363
801
|
moveFocusLeft(): boolean;
|
|
802
|
+
/** Move focus right */
|
|
364
803
|
moveFocusRight(): boolean;
|
|
804
|
+
/** Move focus to first cell */
|
|
365
805
|
moveFocusToFirstCell(): void;
|
|
806
|
+
/** Move focus to last cell */
|
|
366
807
|
moveFocusToLastCell(): void;
|
|
808
|
+
/** Move focus to row start */
|
|
367
809
|
moveFocusToRowStart(): void;
|
|
810
|
+
/** Move focus to row end */
|
|
368
811
|
moveFocusToRowEnd(): void;
|
|
812
|
+
/** Enable keyboard navigation (returns cleanup) */
|
|
369
813
|
enableKeyboardNavigation(): () => void;
|
|
814
|
+
/** Count of visible columns */
|
|
370
815
|
readonly visibleColumnCount: Readonly<Ref<number>>;
|
|
816
|
+
/** Hide a column */
|
|
371
817
|
hideColumn(columnIndex: number): void;
|
|
818
|
+
/** Show a column */
|
|
372
819
|
showColumn(columnIndex: number): void;
|
|
820
|
+
/** Toggle column visibility */
|
|
373
821
|
toggleColumnVisibility(columnIndex: number): void;
|
|
822
|
+
/** Check if column is visible */
|
|
374
823
|
isColumnVisible(columnIndex: number): boolean;
|
|
824
|
+
/** Get visible column indices */
|
|
375
825
|
getVisibleColumnIndices(): readonly number[];
|
|
826
|
+
/** Get hidden column indices */
|
|
376
827
|
getHiddenColumnIndices(): readonly number[];
|
|
828
|
+
/** Move row from one position to another */
|
|
377
829
|
moveRow(fromIndex: number, toIndex: number): void;
|
|
830
|
+
/** Move row up */
|
|
378
831
|
moveRowUp(rowIndex: number): boolean;
|
|
832
|
+
/** Move row down */
|
|
379
833
|
moveRowDown(rowIndex: number): boolean;
|
|
834
|
+
/** Move row to top */
|
|
380
835
|
moveRowToTop(rowIndex: number): void;
|
|
836
|
+
/** Move row to bottom */
|
|
381
837
|
moveRowToBottom(rowIndex: number): void;
|
|
838
|
+
/** Swap two rows */
|
|
382
839
|
swapRows(indexA: number, indexB: number): void;
|
|
840
|
+
/** Move column from one position to another */
|
|
383
841
|
moveColumn(fromIndex: number, toIndex: number): void;
|
|
842
|
+
/** Move column left */
|
|
384
843
|
moveColumnLeft(columnIndex: number): boolean;
|
|
844
|
+
/** Move column right */
|
|
385
845
|
moveColumnRight(columnIndex: number): boolean;
|
|
846
|
+
/** Move column to start */
|
|
386
847
|
moveColumnToStart(columnIndex: number): void;
|
|
848
|
+
/** Move column to end */
|
|
387
849
|
moveColumnToEnd(columnIndex: number): void;
|
|
850
|
+
/** Swap two columns */
|
|
388
851
|
swapColumns(indexA: number, indexB: number): void;
|
|
852
|
+
/** Copy selected cells to string */
|
|
389
853
|
copySelectedCells(): string;
|
|
854
|
+
/** Copy selected rows to string */
|
|
390
855
|
copySelectedRows(): string;
|
|
856
|
+
/** Copy row to string */
|
|
391
857
|
copyRow(rowIndex: number): string;
|
|
858
|
+
/** Copy column to string */
|
|
392
859
|
copyColumn(columnIndex: number): string;
|
|
860
|
+
/** Copy cell to string */
|
|
393
861
|
copyCell(rowIndex: number, columnIndex: number): string;
|
|
862
|
+
/** Copy cell range to string */
|
|
394
863
|
copyCellRange(rowStart: number, columnStart: number, rowEnd: number, columnEnd: number): string;
|
|
864
|
+
/** Paste data at cell */
|
|
395
865
|
pasteAtCell(rowIndex: number, columnIndex: number, data: string): void;
|
|
866
|
+
/** Expanded row indices */
|
|
396
867
|
readonly expandedRows: Readonly<Ref<ReadonlySet<number>>>;
|
|
868
|
+
/** Rows pinned to top */
|
|
397
869
|
readonly pinnedTopRows: Readonly<Ref<readonly number[]>>;
|
|
870
|
+
/** Rows pinned to bottom */
|
|
398
871
|
readonly pinnedBottomRows: Readonly<Ref<readonly number[]>>;
|
|
872
|
+
/** Expand a row */
|
|
399
873
|
expandRow(rowIndex: number): void;
|
|
874
|
+
/** Collapse a row */
|
|
400
875
|
collapseRow(rowIndex: number): void;
|
|
876
|
+
/** Toggle row expansion */
|
|
401
877
|
toggleRowExpansion(rowIndex: number): void;
|
|
878
|
+
/** Expand all rows */
|
|
402
879
|
expandAllRows(): void;
|
|
880
|
+
/** Collapse all rows */
|
|
403
881
|
collapseAllRows(): void;
|
|
882
|
+
/** Check if row is expanded */
|
|
404
883
|
isRowExpanded(rowIndex: number): boolean;
|
|
884
|
+
/** Get expanded row indices */
|
|
405
885
|
getExpandedRowIndices(): readonly number[];
|
|
886
|
+
/** Pin row to top */
|
|
406
887
|
pinRowTop(rowIndex: number): void;
|
|
888
|
+
/** Pin row to bottom */
|
|
407
889
|
pinRowBottom(rowIndex: number): void;
|
|
890
|
+
/** Unpin a row */
|
|
408
891
|
unpinRow(rowIndex: number): void;
|
|
892
|
+
/** Unpin all rows */
|
|
409
893
|
unpinAllRows(): void;
|
|
894
|
+
/** Check if row is pinned to top */
|
|
410
895
|
isRowPinnedTop(rowIndex: number): boolean;
|
|
896
|
+
/** Check if row is pinned to bottom */
|
|
411
897
|
isRowPinnedBottom(rowIndex: number): boolean;
|
|
898
|
+
/** Get indices of rows pinned to top */
|
|
412
899
|
getPinnedTopRowIndices(): readonly number[];
|
|
900
|
+
/** Get indices of rows pinned to bottom */
|
|
413
901
|
getPinnedBottomRowIndices(): readonly number[];
|
|
902
|
+
/** Set cell metadata */
|
|
414
903
|
setCellMeta<T>(rowIndex: number, columnIndex: number, key: string, value: T): void;
|
|
904
|
+
/** Get cell metadata */
|
|
415
905
|
getCellMeta<T>(rowIndex: number, columnIndex: number, key: string): T | undefined;
|
|
906
|
+
/** Check if cell has metadata */
|
|
416
907
|
hasCellMeta(rowIndex: number, columnIndex: number, key: string): boolean;
|
|
908
|
+
/** Clear all cell metadata */
|
|
417
909
|
clearCellMeta(rowIndex: number, columnIndex: number): void;
|
|
910
|
+
/** Clear specific cell metadata key */
|
|
418
911
|
clearCellMetaKey(rowIndex: number, columnIndex: number, key: string): void;
|
|
912
|
+
/** Set row metadata */
|
|
419
913
|
setRowMeta<T>(rowIndex: number, key: string, value: T): void;
|
|
914
|
+
/** Get row metadata */
|
|
420
915
|
getRowMeta<T>(rowIndex: number, key: string): T | undefined;
|
|
916
|
+
/** Check if row has metadata */
|
|
421
917
|
hasRowMeta(rowIndex: number, key: string): boolean;
|
|
918
|
+
/** Clear all row metadata */
|
|
422
919
|
clearRowMeta(rowIndex: number): void;
|
|
920
|
+
/** Clear specific row metadata key */
|
|
423
921
|
clearRowMetaKey(rowIndex: number, key: string): void;
|
|
922
|
+
/** Set column metadata */
|
|
424
923
|
setColumnMeta<T>(columnIndex: number, key: string, value: T): void;
|
|
924
|
+
/** Get column metadata */
|
|
425
925
|
getColumnMeta<T>(columnIndex: number, key: string): T | undefined;
|
|
926
|
+
/** Check if column has metadata */
|
|
426
927
|
hasColumnMeta(columnIndex: number, key: string): boolean;
|
|
928
|
+
/** Clear all column metadata */
|
|
427
929
|
clearColumnMeta(columnIndex: number): void;
|
|
930
|
+
/** Clear specific column metadata key */
|
|
428
931
|
clearColumnMetaKey(columnIndex: number, key: string): void;
|
|
932
|
+
/** Subscribe to row add events */
|
|
429
933
|
onRowAdd(callback: (rowData: unknown[], rowIndex: number) => void): () => void;
|
|
934
|
+
/** Subscribe to row remove events */
|
|
430
935
|
onRowRemove(callback: (rowData: unknown[], rowIndex: number) => void): () => void;
|
|
936
|
+
/** Subscribe to row update events */
|
|
431
937
|
onRowUpdate(callback: (rowIndex: number, oldRowData: unknown[], newRowData: unknown[]) => void): () => void;
|
|
938
|
+
/** Subscribe to cell change events */
|
|
432
939
|
onCellChange(callback: (rowIndex: number, columnIndex: number, oldValue: unknown, newValue: unknown) => void): () => void;
|
|
940
|
+
/** Subscribe to row selection change events */
|
|
433
941
|
onRowSelectionChange(callback: (selectedIndices: ReadonlySet<number>) => void): () => void;
|
|
942
|
+
/** Subscribe to cell selection change events */
|
|
434
943
|
onCellSelectionChange(callback: (selectedCells: ReadonlySet<string>) => void): () => void;
|
|
944
|
+
/** Subscribe to sort change events */
|
|
435
945
|
onSortChange(callback: (columnIndex: number | null, ascending: boolean) => void): () => void;
|
|
946
|
+
/** Subscribe to filter change events */
|
|
436
947
|
onFilterChange(callback: (filteredIndices: readonly number[]) => void): () => void;
|
|
948
|
+
/** Subscribe to cell focus change events */
|
|
437
949
|
onCellFocusChange(callback: (cell: CellPosition | null) => void): () => void;
|
|
950
|
+
/** Subscribe to column visibility change events */
|
|
438
951
|
onColumnVisibilityChange(callback: (columnIndex: number, visible: boolean) => void): () => void;
|
|
952
|
+
/** Begin batch update (defer reactivity) */
|
|
439
953
|
beginBatchUpdate(): void;
|
|
954
|
+
/** End batch update (commit changes) */
|
|
440
955
|
endBatchUpdate(): void;
|
|
956
|
+
/** Cancel batch update (rollback) */
|
|
441
957
|
cancelBatchUpdate(): void;
|
|
958
|
+
/** Check if batch updating */
|
|
442
959
|
isBatchUpdating(): boolean;
|
|
960
|
+
/** Execute callback as batch */
|
|
443
961
|
batchUpdate(callback: () => void): void;
|
|
962
|
+
/** Whether table is loading */
|
|
444
963
|
readonly tableLoading: Readonly<Ref<boolean>>;
|
|
964
|
+
/** Set table loading state */
|
|
445
965
|
setTableLoading(loading: boolean): void;
|
|
966
|
+
/** Set cell loading state */
|
|
446
967
|
setCellLoading(rowIndex: number, columnIndex: number, loading: boolean): void;
|
|
968
|
+
/** Set row loading state */
|
|
447
969
|
setRowLoading(rowIndex: number, loading: boolean): void;
|
|
970
|
+
/** Set column loading state */
|
|
448
971
|
setColumnLoading(columnIndex: number, loading: boolean): void;
|
|
972
|
+
/** Check if table is loading */
|
|
449
973
|
isTableLoading(): boolean;
|
|
974
|
+
/** Check if cell is loading */
|
|
450
975
|
isCellLoading(rowIndex: number, columnIndex: number): boolean;
|
|
976
|
+
/** Check if row is loading */
|
|
451
977
|
isRowLoading(rowIndex: number): boolean;
|
|
978
|
+
/** Check if column is loading */
|
|
452
979
|
isColumnLoading(columnIndex: number): boolean;
|
|
980
|
+
/** Load data with fetcher */
|
|
453
981
|
loadData(fetcher: () => Promise<readonly (readonly unknown[])[]>): Promise<void>;
|
|
982
|
+
/** Append rows asynchronously */
|
|
454
983
|
appendRowsAsync(fetcher: () => Promise<readonly (readonly unknown[])[]>): Promise<void>;
|
|
984
|
+
/** Prepend rows asynchronously */
|
|
455
985
|
prependRowsAsync(fetcher: () => Promise<readonly (readonly unknown[])[]>): Promise<void>;
|
|
986
|
+
/** Number of columns frozen on left */
|
|
456
987
|
readonly frozenLeftColumnCount: Readonly<Ref<number>>;
|
|
988
|
+
/** Number of columns frozen on right */
|
|
457
989
|
readonly frozenRightColumnCount: Readonly<Ref<number>>;
|
|
990
|
+
/** Freeze columns on left */
|
|
458
991
|
freezeColumnsLeft(count: number): void;
|
|
992
|
+
/** Freeze columns on right */
|
|
459
993
|
freezeColumnsRight(count: number): void;
|
|
994
|
+
/** Unfreeze columns on left */
|
|
460
995
|
unfreezeColumnsLeft(): void;
|
|
996
|
+
/** Unfreeze columns on right */
|
|
461
997
|
unfreezeColumnsRight(): void;
|
|
998
|
+
/** Unfreeze all columns */
|
|
462
999
|
unfreezeAllColumns(): void;
|
|
1000
|
+
/** Get frozen left column count */
|
|
463
1001
|
getFrozenLeftColumnCount(): number;
|
|
1002
|
+
/** Get frozen right column count */
|
|
464
1003
|
getFrozenRightColumnCount(): number;
|
|
1004
|
+
/** Check if column is frozen on left */
|
|
465
1005
|
isColumnFrozenLeft(columnIndex: number): boolean;
|
|
1006
|
+
/** Check if column is frozen on right */
|
|
466
1007
|
isColumnFrozenRight(columnIndex: number): boolean;
|
|
1008
|
+
/** Check if any columns are frozen */
|
|
467
1009
|
hasFrozenColumns(): boolean;
|
|
1010
|
+
/**
|
|
1011
|
+
* Configure table for record-based data.
|
|
1012
|
+
* This enables integration with useDatabase and other composables.
|
|
1013
|
+
*/
|
|
1014
|
+
setRecordColumns<T extends BaseRecord>(columns: readonly RecordColumnDef<T>[]): void;
|
|
1015
|
+
/**
|
|
1016
|
+
* Clear record column configuration.
|
|
1017
|
+
*/
|
|
1018
|
+
clearRecordColumns(): void;
|
|
1019
|
+
/**
|
|
1020
|
+
* Check if record columns are configured.
|
|
1021
|
+
*/
|
|
1022
|
+
hasRecordColumns(): boolean;
|
|
1023
|
+
/**
|
|
1024
|
+
* Get the configured record columns.
|
|
1025
|
+
*/
|
|
1026
|
+
getRecordColumns<T extends BaseRecord>(): readonly RecordColumnDef<T>[] | undefined;
|
|
1027
|
+
/**
|
|
1028
|
+
* Set table data from an array of records.
|
|
1029
|
+
* Records must have an `id` field.
|
|
1030
|
+
*/
|
|
1031
|
+
setRecords<T extends BaseRecord>(records: readonly T[]): void;
|
|
1032
|
+
/**
|
|
1033
|
+
* Get all records from the table.
|
|
1034
|
+
* Returns records reconstructed from table data using column definitions.
|
|
1035
|
+
*/
|
|
1036
|
+
getRecords<T extends BaseRecord>(): readonly T[];
|
|
1037
|
+
/**
|
|
1038
|
+
* Get a single record by ID.
|
|
1039
|
+
*/
|
|
1040
|
+
getRecordById<T extends BaseRecord>(id: string): T | undefined;
|
|
1041
|
+
/**
|
|
1042
|
+
* Get record ID for a row index.
|
|
1043
|
+
*/
|
|
1044
|
+
getRecordId(rowIndex: number): string | undefined;
|
|
1045
|
+
/**
|
|
1046
|
+
* Get row index for a record ID.
|
|
1047
|
+
*/
|
|
1048
|
+
getRowIndexForRecord(recordId: string): number | undefined;
|
|
1049
|
+
/**
|
|
1050
|
+
* Update a record by ID.
|
|
1051
|
+
* Only updates the specified fields.
|
|
1052
|
+
*/
|
|
1053
|
+
updateRecord<T extends BaseRecord>(id: string, updates: Partial<Omit<T, 'id'>>): boolean;
|
|
1054
|
+
/**
|
|
1055
|
+
* Add a new record to the table.
|
|
1056
|
+
* If no ID is provided, one will be generated.
|
|
1057
|
+
*/
|
|
1058
|
+
addRecord<T extends BaseRecord>(record: T | Omit<T, 'id'>, index?: number): string;
|
|
1059
|
+
/**
|
|
1060
|
+
* Remove a record by ID.
|
|
1061
|
+
*/
|
|
1062
|
+
removeRecord(id: string): boolean;
|
|
1063
|
+
/**
|
|
1064
|
+
* Check if a record with the given ID exists.
|
|
1065
|
+
*/
|
|
1066
|
+
hasRecord(id: string): boolean;
|
|
1067
|
+
/**
|
|
1068
|
+
* Get record IDs for selected rows.
|
|
1069
|
+
*/
|
|
1070
|
+
getSelectedRecordIds(): readonly string[];
|
|
1071
|
+
/**
|
|
1072
|
+
* Select rows by record IDs.
|
|
1073
|
+
*/
|
|
1074
|
+
selectRecords(ids: readonly string[]): void;
|
|
1075
|
+
/**
|
|
1076
|
+
* Deselect rows by record IDs.
|
|
1077
|
+
*/
|
|
1078
|
+
deselectRecords(ids: readonly string[]): void;
|
|
1079
|
+
/**
|
|
1080
|
+
* Get the selected records.
|
|
1081
|
+
*/
|
|
1082
|
+
getSelectedRecords<T extends BaseRecord>(): readonly T[];
|
|
1083
|
+
/**
|
|
1084
|
+
* Subscribe to record changes.
|
|
1085
|
+
* Callback receives the record ID and the updated record.
|
|
1086
|
+
*/
|
|
1087
|
+
onRecordChange<T extends BaseRecord>(callback: (recordId: string, record: T, changeType: 'add' | 'update' | 'remove') => void): () => void;
|
|
1088
|
+
/**
|
|
1089
|
+
* Set the ID generator for new records.
|
|
1090
|
+
*/
|
|
1091
|
+
setIdGenerator(generator: IdGenerator): void;
|
|
1092
|
+
/**
|
|
1093
|
+
* Convert array row data to a record object using column definitions.
|
|
1094
|
+
*/
|
|
1095
|
+
rowToRecord<T extends BaseRecord>(rowIndex: number): T | undefined;
|
|
1096
|
+
/**
|
|
1097
|
+
* Convert a record to array row data using column definitions.
|
|
1098
|
+
*/
|
|
1099
|
+
recordToRow<T extends BaseRecord>(record: T): unknown[];
|
|
1100
|
+
/**
|
|
1101
|
+
* Export records to JSON (uses column definitions).
|
|
1102
|
+
*/
|
|
1103
|
+
exportRecordsToJSON(): string;
|
|
1104
|
+
/**
|
|
1105
|
+
* Import records from JSON.
|
|
1106
|
+
*/
|
|
1107
|
+
importRecordsFromJSON(json: string): void;
|
|
468
1108
|
}
|
|
469
1109
|
|
|
470
|
-
/**
|
|
1110
|
+
/**
|
|
1111
|
+
* Validation error for a specific cell.
|
|
1112
|
+
*/
|
|
471
1113
|
export declare interface ValidationError {
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
1114
|
+
/** Row index */
|
|
1115
|
+
readonly row: number;
|
|
1116
|
+
/** Column index */
|
|
1117
|
+
readonly column: number;
|
|
1118
|
+
/** The invalid value */
|
|
1119
|
+
readonly value: unknown;
|
|
1120
|
+
/** Error message */
|
|
1121
|
+
readonly message: string;
|
|
476
1122
|
}
|
|
477
1123
|
|
|
478
|
-
/**
|
|
1124
|
+
/**
|
|
1125
|
+
* Result of validation operations.
|
|
1126
|
+
*/
|
|
479
1127
|
export declare interface ValidationResult {
|
|
480
|
-
|
|
481
|
-
|
|
1128
|
+
/** Whether validation passed */
|
|
1129
|
+
readonly valid: boolean;
|
|
1130
|
+
/** Array of validation errors */
|
|
1131
|
+
readonly errors: readonly ValidationError[];
|
|
482
1132
|
}
|
|
483
1133
|
|
|
484
|
-
/**
|
|
1134
|
+
/**
|
|
1135
|
+
* Virtual scrolling configuration.
|
|
1136
|
+
*/
|
|
485
1137
|
export declare interface VirtualScrollConfig {
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
1138
|
+
/** Height of each row in pixels */
|
|
1139
|
+
readonly rowHeight: number;
|
|
1140
|
+
/** Number of extra rows to render above/below viewport */
|
|
1141
|
+
readonly overscan: number;
|
|
1142
|
+
/** Height of the scroll container in pixels */
|
|
1143
|
+
readonly containerHeight: number;
|
|
489
1144
|
}
|
|
490
1145
|
|
|
491
|
-
/**
|
|
1146
|
+
/**
|
|
1147
|
+
* Virtual scrolling state.
|
|
1148
|
+
*/
|
|
492
1149
|
export declare interface VirtualScrollState {
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
1150
|
+
/** Current scroll position */
|
|
1151
|
+
readonly scrollTop: Ref<number>;
|
|
1152
|
+
/** Height of each row */
|
|
1153
|
+
readonly rowHeight: number;
|
|
1154
|
+
/** Overscan count */
|
|
1155
|
+
readonly overscan: number;
|
|
1156
|
+
/** Container height */
|
|
1157
|
+
readonly containerHeight: number;
|
|
1158
|
+
/** Indices of currently visible rows */
|
|
1159
|
+
readonly visibleRows: Ref<number[]>;
|
|
1160
|
+
/** Start index of visible range */
|
|
1161
|
+
readonly startIndex: Ref<number>;
|
|
1162
|
+
/** End index of visible range */
|
|
1163
|
+
readonly endIndex: Ref<number>;
|
|
1164
|
+
/** Scroll event handler (internal) */
|
|
500
1165
|
scrollHandler?: () => void;
|
|
1166
|
+
/** Container element (internal) */
|
|
501
1167
|
container?: HTMLElement;
|
|
502
1168
|
}
|
|
503
1169
|
|
|
1170
|
+
/**
|
|
1171
|
+
* Check if a record's ID was auto-generated.
|
|
1172
|
+
*/
|
|
1173
|
+
export declare function wasIdGenerated(record: object): boolean;
|
|
1174
|
+
|
|
504
1175
|
export { }
|