@toolbox-web/grid 1.21.1 → 1.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (155) hide show
  1. package/README.md +6 -8
  2. package/all.js +2 -6850
  3. package/all.js.map +1 -1
  4. package/index.js +1 -4352
  5. package/index.js.map +1 -1
  6. package/lib/core/grid.d.ts +75 -8
  7. package/lib/core/grid.d.ts.map +1 -1
  8. package/lib/core/internal/rows.d.ts.map +1 -1
  9. package/lib/core/plugin/base-plugin.d.ts +8 -2
  10. package/lib/core/plugin/base-plugin.d.ts.map +1 -1
  11. package/lib/core/styles/index.d.ts.map +1 -1
  12. package/lib/core/types.d.ts +84 -2
  13. package/lib/core/types.d.ts.map +1 -1
  14. package/lib/plugins/clipboard/index.js +1 -733
  15. package/lib/plugins/clipboard/index.js.map +1 -1
  16. package/lib/plugins/clipboard/types.d.ts +5 -0
  17. package/lib/plugins/clipboard/types.d.ts.map +1 -1
  18. package/lib/plugins/column-virtualization/index.js +1 -560
  19. package/lib/plugins/column-virtualization/index.js.map +1 -1
  20. package/lib/plugins/column-virtualization/types.d.ts +5 -0
  21. package/lib/plugins/column-virtualization/types.d.ts.map +1 -1
  22. package/lib/plugins/context-menu/index.js +1 -754
  23. package/lib/plugins/context-menu/index.js.map +1 -1
  24. package/lib/plugins/context-menu/types.d.ts +5 -0
  25. package/lib/plugins/context-menu/types.d.ts.map +1 -1
  26. package/lib/plugins/editing/EditingPlugin.d.ts.map +1 -1
  27. package/lib/plugins/editing/index.d.ts +1 -1
  28. package/lib/plugins/editing/index.d.ts.map +1 -1
  29. package/lib/plugins/editing/index.js +1 -1539
  30. package/lib/plugins/editing/index.js.map +1 -1
  31. package/lib/plugins/editing/types.d.ts +49 -0
  32. package/lib/plugins/editing/types.d.ts.map +1 -1
  33. package/lib/plugins/export/index.js +1 -589
  34. package/lib/plugins/export/index.js.map +1 -1
  35. package/lib/plugins/export/types.d.ts +5 -0
  36. package/lib/plugins/export/types.d.ts.map +1 -1
  37. package/lib/plugins/filtering/FilteringPlugin.d.ts.map +1 -1
  38. package/lib/plugins/filtering/filter-model.d.ts.map +1 -1
  39. package/lib/plugins/filtering/index.js +1 -1283
  40. package/lib/plugins/filtering/index.js.map +1 -1
  41. package/lib/plugins/filtering/types.d.ts +7 -2
  42. package/lib/plugins/filtering/types.d.ts.map +1 -1
  43. package/lib/plugins/grouping-columns/index.js +1 -726
  44. package/lib/plugins/grouping-columns/index.js.map +1 -1
  45. package/lib/plugins/grouping-columns/types.d.ts +3 -0
  46. package/lib/plugins/grouping-columns/types.d.ts.map +1 -1
  47. package/lib/plugins/grouping-rows/index.js +2 -905
  48. package/lib/plugins/grouping-rows/index.js.map +1 -1
  49. package/lib/plugins/grouping-rows/types.d.ts +5 -0
  50. package/lib/plugins/grouping-rows/types.d.ts.map +1 -1
  51. package/lib/plugins/master-detail/index.js +1 -950
  52. package/lib/plugins/master-detail/index.js.map +1 -1
  53. package/lib/plugins/master-detail/types.d.ts +5 -0
  54. package/lib/plugins/master-detail/types.d.ts.map +1 -1
  55. package/lib/plugins/multi-sort/index.js +1 -553
  56. package/lib/plugins/multi-sort/index.js.map +1 -1
  57. package/lib/plugins/multi-sort/types.d.ts +5 -0
  58. package/lib/plugins/multi-sort/types.d.ts.map +1 -1
  59. package/lib/plugins/pinned-columns/index.js +1 -688
  60. package/lib/plugins/pinned-columns/index.js.map +1 -1
  61. package/lib/plugins/pinned-columns/types.d.ts +3 -0
  62. package/lib/plugins/pinned-columns/types.d.ts.map +1 -1
  63. package/lib/plugins/pinned-rows/index.js +1 -704
  64. package/lib/plugins/pinned-rows/index.js.map +1 -1
  65. package/lib/plugins/pinned-rows/types.d.ts +5 -0
  66. package/lib/plugins/pinned-rows/types.d.ts.map +1 -1
  67. package/lib/plugins/pivot/index.js +1 -1191
  68. package/lib/plugins/pivot/index.js.map +1 -1
  69. package/lib/plugins/pivot/types.d.ts +5 -0
  70. package/lib/plugins/pivot/types.d.ts.map +1 -1
  71. package/lib/plugins/print/index.js +1 -691
  72. package/lib/plugins/print/index.js.map +1 -1
  73. package/lib/plugins/print/types.d.ts +3 -0
  74. package/lib/plugins/print/types.d.ts.map +1 -1
  75. package/lib/plugins/reorder/index.js +1 -703
  76. package/lib/plugins/reorder/index.js.map +1 -1
  77. package/lib/plugins/reorder/types.d.ts +5 -0
  78. package/lib/plugins/reorder/types.d.ts.map +1 -1
  79. package/lib/plugins/responsive/index.js +1 -971
  80. package/lib/plugins/responsive/index.js.map +1 -1
  81. package/lib/plugins/responsive/types.d.ts +5 -0
  82. package/lib/plugins/responsive/types.d.ts.map +1 -1
  83. package/lib/plugins/row-reorder/index.js +1 -728
  84. package/lib/plugins/row-reorder/index.js.map +1 -1
  85. package/lib/plugins/row-reorder/types.d.ts +5 -0
  86. package/lib/plugins/row-reorder/types.d.ts.map +1 -1
  87. package/lib/plugins/selection/index.js +1 -1071
  88. package/lib/plugins/selection/index.js.map +1 -1
  89. package/lib/plugins/selection/types.d.ts +3 -0
  90. package/lib/plugins/selection/types.d.ts.map +1 -1
  91. package/lib/plugins/server-side/index.js +1 -521
  92. package/lib/plugins/server-side/index.js.map +1 -1
  93. package/lib/plugins/server-side/types.d.ts +5 -0
  94. package/lib/plugins/server-side/types.d.ts.map +1 -1
  95. package/lib/plugins/tree/index.js +1 -686
  96. package/lib/plugins/tree/index.js.map +1 -1
  97. package/lib/plugins/tree/types.d.ts +5 -0
  98. package/lib/plugins/tree/types.d.ts.map +1 -1
  99. package/lib/plugins/undo-redo/index.js +1 -584
  100. package/lib/plugins/undo-redo/index.js.map +1 -1
  101. package/lib/plugins/undo-redo/types.d.ts +5 -0
  102. package/lib/plugins/undo-redo/types.d.ts.map +1 -1
  103. package/lib/plugins/visibility/index.js +1 -792
  104. package/lib/plugins/visibility/index.js.map +1 -1
  105. package/lib/plugins/visibility/types.d.ts +5 -0
  106. package/lib/plugins/visibility/types.d.ts.map +1 -1
  107. package/package.json +1 -1
  108. package/umd/grid.all.umd.js +1 -186
  109. package/umd/grid.all.umd.js.map +1 -1
  110. package/umd/grid.umd.js +1 -90
  111. package/umd/grid.umd.js.map +1 -1
  112. package/umd/plugins/clipboard.umd.js +1 -6
  113. package/umd/plugins/clipboard.umd.js.map +1 -1
  114. package/umd/plugins/column-virtualization.umd.js +1 -1
  115. package/umd/plugins/column-virtualization.umd.js.map +1 -1
  116. package/umd/plugins/context-menu.umd.js +1 -1
  117. package/umd/plugins/context-menu.umd.js.map +1 -1
  118. package/umd/plugins/editing.umd.js +1 -1
  119. package/umd/plugins/editing.umd.js.map +1 -1
  120. package/umd/plugins/export.umd.js +1 -13
  121. package/umd/plugins/export.umd.js.map +1 -1
  122. package/umd/plugins/filtering.umd.js +1 -1
  123. package/umd/plugins/filtering.umd.js.map +1 -1
  124. package/umd/plugins/grouping-columns.umd.js +1 -1
  125. package/umd/plugins/grouping-columns.umd.js.map +1 -1
  126. package/umd/plugins/grouping-rows.umd.js +1 -4
  127. package/umd/plugins/grouping-rows.umd.js.map +1 -1
  128. package/umd/plugins/master-detail.umd.js +1 -1
  129. package/umd/plugins/master-detail.umd.js.map +1 -1
  130. package/umd/plugins/multi-sort.umd.js +1 -1
  131. package/umd/plugins/multi-sort.umd.js.map +1 -1
  132. package/umd/plugins/pinned-columns.umd.js +1 -1
  133. package/umd/plugins/pinned-columns.umd.js.map +1 -1
  134. package/umd/plugins/pinned-rows.umd.js +1 -1
  135. package/umd/plugins/pinned-rows.umd.js.map +1 -1
  136. package/umd/plugins/pivot.umd.js +1 -1
  137. package/umd/plugins/pivot.umd.js.map +1 -1
  138. package/umd/plugins/print.umd.js +1 -75
  139. package/umd/plugins/print.umd.js.map +1 -1
  140. package/umd/plugins/reorder.umd.js +1 -1
  141. package/umd/plugins/reorder.umd.js.map +1 -1
  142. package/umd/plugins/responsive.umd.js +1 -1
  143. package/umd/plugins/responsive.umd.js.map +1 -1
  144. package/umd/plugins/row-reorder.umd.js +1 -1
  145. package/umd/plugins/row-reorder.umd.js.map +1 -1
  146. package/umd/plugins/selection.umd.js +1 -3
  147. package/umd/plugins/selection.umd.js.map +1 -1
  148. package/umd/plugins/server-side.umd.js +1 -1
  149. package/umd/plugins/server-side.umd.js.map +1 -1
  150. package/umd/plugins/tree.umd.js +1 -1
  151. package/umd/plugins/tree.umd.js.map +1 -1
  152. package/umd/plugins/undo-redo.umd.js +1 -1
  153. package/umd/plugins/undo-redo.umd.js.map +1 -1
  154. package/umd/plugins/visibility.umd.js +1 -1
  155. package/umd/plugins/visibility.umd.js.map +1 -1
@@ -1,734 +1,2 @@
1
- const b = '<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>', R = {
2
- expand: "▶",
3
- collapse: "▼",
4
- sortAsc: "▲",
5
- sortDesc: "▼",
6
- sortNone: "⇅",
7
- submenuArrow: "▶",
8
- dragHandle: "⋮⋮",
9
- toolPanel: "☰",
10
- filter: b,
11
- filterActive: b,
12
- print: "🖨️"
13
- };
14
- class v {
15
- /**
16
- * Plugin dependencies - declare other plugins this one requires.
17
- *
18
- * Dependencies are validated when the plugin is attached.
19
- * Required dependencies throw an error if missing.
20
- * Optional dependencies log an info message if missing.
21
- *
22
- * @example
23
- * ```typescript
24
- * static readonly dependencies: PluginDependency[] = [
25
- * { name: 'editing', required: true, reason: 'Tracks cell edits for undo/redo' },
26
- * { name: 'selection', required: false, reason: 'Enables selection-based undo' },
27
- * ];
28
- * ```
29
- */
30
- static dependencies;
31
- /**
32
- * Plugin manifest - declares owned properties, config rules, and hook priorities.
33
- *
34
- * This is read by the configuration validator to:
35
- * - Validate that required plugins are loaded when their properties are used
36
- * - Execute configRules to detect invalid/conflicting settings
37
- * - Order hook execution based on priority
38
- *
39
- * @example
40
- * ```typescript
41
- * static override readonly manifest: PluginManifest<MyConfig> = {
42
- * ownedProperties: [
43
- * { property: 'myProp', level: 'column', description: 'the "myProp" column property' },
44
- * ],
45
- * configRules: [
46
- * { id: 'myPlugin/conflict', severity: 'warn', message: '...', check: (c) => c.a && c.b },
47
- * ],
48
- * };
49
- * ```
50
- */
51
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
52
- static manifest;
53
- /**
54
- * Plugin version - defaults to grid version for built-in plugins.
55
- * Third-party plugins can override with their own semver.
56
- */
57
- version = typeof __GRID_VERSION__ < "u" ? __GRID_VERSION__ : "dev";
58
- /** CSS styles to inject into the grid's shadow DOM */
59
- styles;
60
- /** Custom cell renderers keyed by type name */
61
- cellRenderers;
62
- /** Custom header renderers keyed by type name */
63
- headerRenderers;
64
- /** Custom cell editors keyed by type name */
65
- cellEditors;
66
- /** The grid instance this plugin is attached to */
67
- grid;
68
- /** Plugin configuration - merged with defaults in attach() */
69
- config;
70
- /** User-provided configuration from constructor */
71
- userConfig;
72
- /**
73
- * Plugin-level AbortController for event listener cleanup.
74
- * Created fresh in attach(), aborted in detach().
75
- * This ensures event listeners are properly cleaned up when plugins are re-attached.
76
- */
77
- #e;
78
- /**
79
- * Default configuration - subclasses should override this getter.
80
- * Note: This must be a getter (not property initializer) for proper inheritance
81
- * since property initializers run after parent constructor.
82
- */
83
- get defaultConfig() {
84
- return {};
85
- }
86
- constructor(e = {}) {
87
- this.userConfig = e;
88
- }
89
- /**
90
- * Called when the plugin is attached to a grid.
91
- * Override to set up event listeners, initialize state, etc.
92
- *
93
- * @example
94
- * ```ts
95
- * attach(grid: GridElement): void {
96
- * super.attach(grid);
97
- * // Set up document-level listeners with auto-cleanup
98
- * document.addEventListener('keydown', this.handleEscape, {
99
- * signal: this.disconnectSignal
100
- * });
101
- * }
102
- * ```
103
- */
104
- attach(e) {
105
- this.#e?.abort(), this.#e = new AbortController(), this.grid = e, this.config = { ...this.defaultConfig, ...this.userConfig };
106
- }
107
- /**
108
- * Called when the plugin is detached from a grid.
109
- * Override to clean up event listeners, timers, etc.
110
- *
111
- * @example
112
- * ```ts
113
- * detach(): void {
114
- * // Clean up any state not handled by disconnectSignal
115
- * this.selectedRows.clear();
116
- * this.cache = null;
117
- * }
118
- * ```
119
- */
120
- detach() {
121
- this.#e?.abort(), this.#e = void 0;
122
- }
123
- /**
124
- * Get another plugin instance from the same grid.
125
- * Use for inter-plugin communication.
126
- *
127
- * @example
128
- * ```ts
129
- * const selection = this.getPlugin(SelectionPlugin);
130
- * if (selection) {
131
- * const selectedRows = selection.getSelectedRows();
132
- * }
133
- * ```
134
- */
135
- getPlugin(e) {
136
- return this.grid?.getPlugin(e);
137
- }
138
- /**
139
- * Emit a custom event from the grid.
140
- */
141
- emit(e, t) {
142
- this.grid?.dispatchEvent?.(new CustomEvent(e, { detail: t, bubbles: !0 }));
143
- }
144
- /**
145
- * Emit a cancelable custom event from the grid.
146
- * @returns `true` if the event was cancelled (preventDefault called), `false` otherwise
147
- */
148
- emitCancelable(e, t) {
149
- const n = new CustomEvent(e, { detail: t, bubbles: !0, cancelable: !0 });
150
- return this.grid?.dispatchEvent?.(n), n.defaultPrevented;
151
- }
152
- // =========================================================================
153
- // Event Bus - Plugin-to-Plugin Communication
154
- // =========================================================================
155
- /**
156
- * Subscribe to an event from another plugin.
157
- * The subscription is automatically cleaned up when this plugin is detached.
158
- *
159
- * @category Plugin Development
160
- * @param eventType - The event type to listen for (e.g., 'filter-change')
161
- * @param callback - The callback to invoke when the event is emitted
162
- *
163
- * @example
164
- * ```typescript
165
- * // In attach() or other initialization
166
- * this.on('filter-change', (detail) => {
167
- * console.log('Filter changed:', detail);
168
- * });
169
- * ```
170
- */
171
- on(e, t) {
172
- this.grid?._pluginManager?.subscribe(this, e, t);
173
- }
174
- /**
175
- * Unsubscribe from a plugin event.
176
- *
177
- * @category Plugin Development
178
- * @param eventType - The event type to stop listening for
179
- *
180
- * @example
181
- * ```typescript
182
- * this.off('filter-change');
183
- * ```
184
- */
185
- off(e) {
186
- this.grid?._pluginManager?.unsubscribe(this, e);
187
- }
188
- /**
189
- * Emit an event to other plugins via the Event Bus.
190
- * This is for inter-plugin communication only; it does NOT dispatch DOM events.
191
- * Use `emit()` to dispatch DOM events that external consumers can listen to.
192
- *
193
- * @category Plugin Development
194
- * @param eventType - The event type to emit (should be declared in manifest.events)
195
- * @param detail - The event payload
196
- *
197
- * @example
198
- * ```typescript
199
- * // Emit to other plugins (not DOM)
200
- * this.emitPluginEvent('filter-change', { field: 'name', value: 'Alice' });
201
- *
202
- * // For DOM events that consumers can addEventListener to:
203
- * this.emit('filter-change', { field: 'name', value: 'Alice' });
204
- * ```
205
- */
206
- emitPluginEvent(e, t) {
207
- this.grid?._pluginManager?.emitPluginEvent(e, t);
208
- }
209
- /**
210
- * Request a re-render of the grid.
211
- * Uses ROWS phase - does NOT trigger processColumns hooks.
212
- */
213
- requestRender() {
214
- this.grid?.requestRender?.();
215
- }
216
- /**
217
- * Request a columns re-render of the grid.
218
- * Uses COLUMNS phase - triggers processColumns hooks.
219
- * Use this when your plugin needs to reprocess column configuration.
220
- */
221
- requestColumnsRender() {
222
- this.grid?.requestColumnsRender?.();
223
- }
224
- /**
225
- * Request a re-render and restore focus styling afterward.
226
- * Use this when a plugin action (like expand/collapse) triggers a render
227
- * but needs to maintain keyboard navigation focus.
228
- */
229
- requestRenderWithFocus() {
230
- this.grid?.requestRenderWithFocus?.();
231
- }
232
- /**
233
- * Request a lightweight style update without rebuilding DOM.
234
- * Use this instead of requestRender() when only CSS classes need updating.
235
- */
236
- requestAfterRender() {
237
- this.grid?.requestAfterRender?.();
238
- }
239
- /**
240
- * Get the current rows from the grid.
241
- */
242
- get rows() {
243
- return this.grid?.rows ?? [];
244
- }
245
- /**
246
- * Get the original unfiltered/unprocessed rows from the grid.
247
- * Use this when you need all source data regardless of active filters.
248
- */
249
- get sourceRows() {
250
- return this.grid?.sourceRows ?? [];
251
- }
252
- /**
253
- * Get the current columns from the grid.
254
- */
255
- get columns() {
256
- return this.grid?.columns ?? [];
257
- }
258
- /**
259
- * Get only visible columns from the grid (excludes hidden).
260
- * Use this for rendering that needs to match the grid template.
261
- */
262
- get visibleColumns() {
263
- return this.grid?._visibleColumns ?? [];
264
- }
265
- /**
266
- * Get the grid as an HTMLElement for direct DOM operations.
267
- * Use sparingly - prefer the typed GridElementRef API when possible.
268
- *
269
- * @example
270
- * ```ts
271
- * const width = this.gridElement.clientWidth;
272
- * this.gridElement.classList.add('my-plugin-active');
273
- * ```
274
- */
275
- get gridElement() {
276
- return this.grid;
277
- }
278
- /**
279
- * Get the disconnect signal for event listener cleanup.
280
- * This signal is aborted when the grid disconnects from the DOM.
281
- * Use this when adding event listeners that should be cleaned up automatically.
282
- *
283
- * Best for:
284
- * - Document/window-level listeners added in attach()
285
- * - Listeners on the grid element itself
286
- * - Any listener that should persist across renders
287
- *
288
- * Not needed for:
289
- * - Listeners on elements created in afterRender() (removed with element)
290
- *
291
- * @example
292
- * element.addEventListener('click', handler, { signal: this.disconnectSignal });
293
- * document.addEventListener('keydown', handler, { signal: this.disconnectSignal });
294
- */
295
- get disconnectSignal() {
296
- return this.#e?.signal ?? this.grid?.disconnectSignal;
297
- }
298
- /**
299
- * Get the grid-level icons configuration.
300
- * Returns merged icons (user config + defaults).
301
- */
302
- get gridIcons() {
303
- const e = this.grid?.gridConfig?.icons ?? {};
304
- return { ...R, ...e };
305
- }
306
- // #region Animation Helpers
307
- /**
308
- * Check if animations are enabled at the grid level.
309
- * Respects gridConfig.animation.mode and the CSS variable set by the grid.
310
- *
311
- * Plugins should use this to skip animations when:
312
- * - Animation mode is 'off' or `false`
313
- * - User prefers reduced motion and mode is 'reduced-motion' (default)
314
- *
315
- * @example
316
- * ```ts
317
- * private get animationStyle(): 'slide' | 'fade' | false {
318
- * if (!this.isAnimationEnabled) return false;
319
- * return this.config.animation ?? 'slide';
320
- * }
321
- * ```
322
- */
323
- get isAnimationEnabled() {
324
- const e = this.grid?.effectiveConfig?.animation?.mode ?? "reduced-motion";
325
- if (e === !1 || e === "off") return !1;
326
- if (e === !0 || e === "on") return !0;
327
- const t = this.gridElement;
328
- return t ? getComputedStyle(t).getPropertyValue("--tbw-animation-enabled").trim() !== "0" : !0;
329
- }
330
- /**
331
- * Get the animation duration in milliseconds from CSS variable.
332
- * Falls back to 200ms if not set.
333
- *
334
- * Plugins can use this for their animation timing to stay consistent
335
- * with the grid-level animation.duration setting.
336
- *
337
- * @example
338
- * ```ts
339
- * element.animate(keyframes, { duration: this.animationDuration });
340
- * ```
341
- */
342
- get animationDuration() {
343
- const e = this.gridElement;
344
- if (e) {
345
- const t = getComputedStyle(e).getPropertyValue("--tbw-animation-duration").trim(), n = parseInt(t, 10);
346
- if (!isNaN(n)) return n;
347
- }
348
- return 200;
349
- }
350
- // #endregion
351
- /**
352
- * Resolve an icon value to string or HTMLElement.
353
- * Checks plugin config first, then grid-level icons, then defaults.
354
- *
355
- * @param iconKey - The icon key in GridIcons (e.g., 'expand', 'collapse')
356
- * @param pluginOverride - Optional plugin-level override
357
- * @returns The resolved icon value
358
- */
359
- resolveIcon(e, t) {
360
- return t !== void 0 ? t : this.gridIcons[e];
361
- }
362
- /**
363
- * Set an icon value on an element.
364
- * Handles both string (text/HTML) and HTMLElement values.
365
- *
366
- * @param element - The element to set the icon on
367
- * @param icon - The icon value (string or HTMLElement)
368
- */
369
- setIcon(e, t) {
370
- typeof t == "string" ? e.innerHTML = t : t instanceof HTMLElement && (e.innerHTML = "", e.appendChild(t.cloneNode(!0)));
371
- }
372
- /**
373
- * Log a warning message.
374
- */
375
- warn(e) {
376
- console.warn(`[tbw-grid:${this.name}] ${e}`);
377
- }
378
- // #endregion
379
- }
380
- function w(a, e, t = !0) {
381
- let n = a;
382
- if (t && (n = n.filter((s) => !s.hidden && !s.field.startsWith("__") && s.meta?.utility !== !0)), e?.length) {
383
- const s = new Set(e);
384
- n = n.filter((r) => s.has(r.field));
385
- }
386
- return n;
387
- }
388
- function x(a, e) {
389
- return e?.length ? [...e].sort((t, n) => t - n).map((t) => a[t]).filter((t) => t != null) : a;
390
- }
391
- function E(a) {
392
- return a == null ? "" : a instanceof Date ? a.toISOString() : typeof a == "object" ? JSON.stringify(a) : String(a);
393
- }
394
- async function I(a) {
395
- try {
396
- return await navigator.clipboard.writeText(a), !0;
397
- } catch (e) {
398
- console.warn("[copyToClipboard] Clipboard API failed:", e);
399
- const t = document.createElement("textarea");
400
- t.value = a, t.style.position = "fixed", t.style.opacity = "0", t.style.pointerEvents = "none", document.body.appendChild(t), t.select();
401
- const n = document.execCommand("copy");
402
- return document.body.removeChild(t), n;
403
- }
404
- }
405
- function y(a, e) {
406
- const t = e.delimiter ?? " ", n = e.newline ?? `
407
- `, s = a.replace(/\r\n/g, `
408
- `).replace(/\r/g, `
409
- `), r = [];
410
- let o = [], l = "", c = !1;
411
- for (let i = 0; i < s.length; i++) {
412
- const d = s[i];
413
- d === '"' && !c ? c = !0 : d === '"' && c ? s[i + 1] === '"' ? (l += '"', i++) : c = !1 : d === t && !c ? (o.push(l), l = "") : d === n && !c ? (o.push(l), l = "", (o.length > 1 || o.some((u) => u.trim() !== "")) && r.push(o), o = []) : l += d;
414
- }
415
- return o.push(l), (o.length > 1 || o.some((i) => i.trim() !== "")) && r.push(o), r;
416
- }
417
- async function S() {
418
- try {
419
- return await navigator.clipboard.readText();
420
- } catch {
421
- return "";
422
- }
423
- }
424
- function _(a, e) {
425
- const { rows: t, target: n, fields: s } = a;
426
- if (!n) return;
427
- const r = e.rows, o = e.effectiveConfig.columns ?? [], l = o.map((u) => u.field), c = /* @__PURE__ */ new Map();
428
- o.forEach((u) => {
429
- c.set(u.field, u.editable === !0);
430
- });
431
- const i = [...r], d = n.bounds ? n.bounds.endRow : 1 / 0;
432
- t.forEach((u, g) => {
433
- const f = n.row + g;
434
- if (!(f > d)) {
435
- if (n.bounds) {
436
- if (f >= i.length)
437
- return;
438
- } else for (; f >= i.length; ) {
439
- const m = {};
440
- l.forEach((p) => m[p] = ""), i.push(m);
441
- }
442
- i[f] = { ...i[f] }, u.forEach((m, p) => {
443
- const h = s[p];
444
- h && c.get(h) && (i[f][h] = m);
445
- });
446
- }
447
- }), e.rows = i;
448
- }
449
- class D extends v {
450
- /**
451
- * Plugin dependencies - ClipboardPlugin works best with SelectionPlugin.
452
- *
453
- * Without SelectionPlugin: copies entire grid, pastes at row 0 col 0.
454
- * With SelectionPlugin: copies/pastes based on selection.
455
- */
456
- /** @internal */
457
- static dependencies = [
458
- { name: "selection", required: !1, reason: "Enables copy/paste of selected cells instead of entire grid" }
459
- ];
460
- /** @internal */
461
- name = "clipboard";
462
- /** @internal */
463
- get defaultConfig() {
464
- return {
465
- includeHeaders: !1,
466
- delimiter: " ",
467
- newline: `
468
- `,
469
- quoteStrings: !1
470
- };
471
- }
472
- // #region Internal State
473
- /** The last copied text (for reference/debugging) */
474
- lastCopied = null;
475
- // #endregion
476
- // #region Lifecycle
477
- /** @internal */
478
- attach(e) {
479
- super.attach(e), e.addEventListener("paste", (n) => this.#r(n), {
480
- signal: this.disconnectSignal
481
- });
482
- }
483
- /** @internal */
484
- detach() {
485
- this.lastCopied = null;
486
- }
487
- // #endregion
488
- // #region Event Handlers
489
- /** @internal */
490
- onKeyDown(e) {
491
- return (e.ctrlKey || e.metaKey) && e.key === "c" ? (e.preventDefault(), this.#e(e.target), !0) : !1;
492
- }
493
- // #endregion
494
- // #region Private Methods
495
- /**
496
- * Handle copy operation from keyboard shortcut.
497
- *
498
- * For keyboard-triggered copies, respects the current selection or
499
- * falls back to the focused cell from the DOM.
500
- */
501
- #e(e) {
502
- const t = this.#t();
503
- if (t && t.ranges.length === 0) {
504
- const n = this.#o(e);
505
- if (!n) return;
506
- const s = this.columns[n.col];
507
- if (!s) return;
508
- this.copy({ rowIndices: [n.row], columns: [s.field] });
509
- return;
510
- }
511
- this.copy();
512
- }
513
- /**
514
- * Handle native paste event (preferred method - works in iframes).
515
- * Uses synchronous clipboardData from the native paste event.
516
- *
517
- * Flow:
518
- * 1. Parse clipboard text
519
- * 2. Build target/fields info from selection
520
- * 3. Emit 'paste' event (for listeners)
521
- * 4. Call paste handler (if configured) to apply data to grid
522
- *
523
- * Selection behavior:
524
- * - Single cell: paste starts at cell, expands freely
525
- * - Range/row: paste is clipped to fit within selection bounds
526
- * - No selection: paste starts at row 0, col 0
527
- */
528
- #r(e) {
529
- const t = e.clipboardData?.getData("text/plain");
530
- if (!t) return;
531
- e.preventDefault();
532
- const n = y(t, this.config), s = this.#t(), r = s?.ranges?.[0], o = r?.from.row ?? 0, l = r?.from.col ?? 0, i = r && (s?.mode === "range" || s?.mode === "row") && (r.from.row !== r.to.row || r.from.col !== r.to.col) ? { endRow: r.to.row, endCol: r.to.col } : null, d = i?.endCol ?? this.visibleColumns.length - 1, u = this.visibleColumns[l], g = u ? { row: o, col: l, field: u.field, bounds: i } : null, f = [], m = n[0]?.length ?? 0;
533
- for (let h = 0; h < m && l + h <= d; h++) {
534
- const C = this.visibleColumns[l + h];
535
- C && f.push(C.field);
536
- }
537
- const p = { rows: n, text: t, target: g, fields: f };
538
- this.emit("paste", p), this.#i(p);
539
- }
540
- /**
541
- * Apply the paste handler to update grid data.
542
- *
543
- * Uses the configured `pasteHandler`, or the default handler if not specified.
544
- * Set `pasteHandler: null` in config to disable auto-paste.
545
- */
546
- #i(e) {
547
- if (!this.grid) return;
548
- const { pasteHandler: t } = this.config;
549
- if (t === null) return;
550
- (t ?? _)(e, this.grid);
551
- }
552
- /**
553
- * Get the current selection via Query System.
554
- * Returns undefined if no selection plugin is loaded or nothing is selected.
555
- */
556
- #t() {
557
- return this.grid?.query("getSelection")?.[0];
558
- }
559
- /**
560
- * Resolve columns and rows to include based on options and/or current selection.
561
- *
562
- * Priority for columns:
563
- * 1. `options.columns` (explicit field list)
564
- * 2. Selection range column bounds (range/cell mode only)
565
- * 3. All visible non-utility columns
566
- *
567
- * Priority for rows:
568
- * 1. `options.rowIndices` (explicit indices)
569
- * 2. Selection range row bounds
570
- * 3. All rows
571
- */
572
- #n(e) {
573
- const t = this.#t();
574
- let n;
575
- if (e?.columns)
576
- n = w(this.columns, e.columns);
577
- else if (t?.ranges.length && t.mode !== "row") {
578
- const r = t.ranges[t.ranges.length - 1], o = Math.min(r.from.col, r.to.col), l = Math.max(r.from.col, r.to.col);
579
- n = w(this.visibleColumns.slice(o, l + 1));
580
- } else
581
- n = w(this.columns);
582
- let s;
583
- if (e?.rowIndices)
584
- s = x(this.rows, e.rowIndices);
585
- else if (t?.ranges.length) {
586
- const r = t.ranges[t.ranges.length - 1], o = Math.min(r.from.row, r.to.row), l = Math.max(r.from.row, r.to.row);
587
- s = [];
588
- for (let c = o; c <= l; c++) {
589
- const i = this.rows[c];
590
- i && s.push(i);
591
- }
592
- } else
593
- s = this.rows;
594
- return { columns: n, rows: s };
595
- }
596
- /**
597
- * Build delimited text from resolved columns and rows.
598
- */
599
- #s(e, t, n) {
600
- const s = n?.delimiter ?? this.config.delimiter ?? " ", r = n?.newline ?? this.config.newline ?? `
601
- `, o = n?.includeHeaders ?? this.config.includeHeaders ?? !1, l = n?.processCell ?? this.config.processCell, c = [];
602
- o && c.push(e.map((i) => i.header || i.field).join(s));
603
- for (const i of t) {
604
- const d = e.map((u) => {
605
- const g = i[u.field];
606
- return l ? l(g, u.field, i) : E(g);
607
- });
608
- c.push(d.join(s));
609
- }
610
- return c.join(r);
611
- }
612
- /**
613
- * Get focused cell coordinates from DOM.
614
- * Used as fallback when SelectionPlugin has no selection.
615
- */
616
- #o(e) {
617
- const t = e.closest("[data-field-cache]");
618
- if (!t) return null;
619
- const n = t.dataset.fieldCache, s = t.dataset.row;
620
- if (!n || !s) return null;
621
- const r = parseInt(s, 10);
622
- if (isNaN(r)) return null;
623
- const o = this.columns.findIndex((l) => l.field === n);
624
- return o === -1 ? null : { row: r, col: o };
625
- }
626
- // #endregion
627
- // #region Public API
628
- /**
629
- * Get the text representation of the current selection (or specified data)
630
- * without writing to the system clipboard.
631
- *
632
- * Useful for previewing what would be copied, or for feeding the text into
633
- * a custom UI (e.g., a "copy with column picker" dialog).
634
- *
635
- * @param options - Control which columns/rows to include
636
- * @returns Delimited text, or empty string if nothing to copy
637
- *
638
- * @example Get text for specific columns
639
- * ```ts
640
- * const clipboard = grid.getPlugin(ClipboardPlugin);
641
- * const text = clipboard.getSelectionAsText({
642
- * columns: ['name', 'email'],
643
- * includeHeaders: true,
644
- * });
645
- * console.log(text);
646
- * // "Name\tEmail\nAlice\talice@example.com\n..."
647
- * ```
648
- */
649
- getSelectionAsText(e) {
650
- const { columns: t, rows: n } = this.#n(e);
651
- return t.length === 0 || n.length === 0 ? "" : this.#s(t, n, e);
652
- }
653
- /**
654
- * Copy data to the system clipboard.
655
- *
656
- * Without options, copies the current selection (or entire grid if no selection).
657
- * With options, copies exactly the specified columns and/or rows — ideal for
658
- * "copy with column picker" workflows where the user selects rows first,
659
- * then chooses which columns to include via a dialog.
660
- *
661
- * @param options - Control which columns/rows to include
662
- * @returns The copied text
663
- *
664
- * @example Copy current selection (default)
665
- * ```ts
666
- * const clipboard = grid.getPlugin(ClipboardPlugin);
667
- * await clipboard.copy();
668
- * ```
669
- *
670
- * @example Copy specific columns from specific rows
671
- * ```ts
672
- * // User selected rows in the grid, then picked columns in a dialog
673
- * const selectedRowIndices = [0, 3, 7];
674
- * const chosenColumns = ['name', 'department', 'salary'];
675
- * await clipboard.copy({
676
- * rowIndices: selectedRowIndices,
677
- * columns: chosenColumns,
678
- * includeHeaders: true,
679
- * });
680
- * ```
681
- */
682
- async copy(e) {
683
- const { columns: t, rows: n } = this.#n(e);
684
- if (t.length === 0 || n.length === 0)
685
- return "";
686
- const s = this.#s(t, n, e);
687
- return await I(s), this.lastCopied = { text: s, timestamp: Date.now() }, this.emit("copy", {
688
- text: s,
689
- rowCount: n.length,
690
- columnCount: t.length
691
- }), s;
692
- }
693
- /**
694
- * Copy specific rows by index to clipboard.
695
- *
696
- * Convenience wrapper around {@link copy} for row-based workflows.
697
- * Supports non-contiguous row indices (e.g., `[0, 3, 7]`).
698
- *
699
- * @param indices - Array of row indices to copy
700
- * @param options - Additional copy options (columns, headers, etc.)
701
- * @returns The copied text
702
- *
703
- * @example
704
- * ```ts
705
- * const clipboard = grid.getPlugin(ClipboardPlugin);
706
- * // Copy only rows 0 and 5, including just name and email columns
707
- * await clipboard.copyRows([0, 5], { columns: ['name', 'email'] });
708
- * ```
709
- */
710
- async copyRows(e, t) {
711
- return e.length === 0 ? "" : this.copy({ ...t, rowIndices: e });
712
- }
713
- /**
714
- * Read and parse clipboard content.
715
- * @returns Parsed 2D array of cell values, or null if clipboard is empty
716
- */
717
- async paste() {
718
- const e = await S();
719
- return e ? y(e, this.config) : null;
720
- }
721
- /**
722
- * Get the last copied text and timestamp.
723
- * @returns The last copied info or null
724
- */
725
- getLastCopied() {
726
- return this.lastCopied;
727
- }
728
- // #endregion
729
- }
730
- export {
731
- D as ClipboardPlugin,
732
- _ as defaultPasteHandler
733
- };
1
+ const e='<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>',t={expand:"▶",collapse:"▼",sortAsc:"▲",sortDesc:"▼",sortNone:"⇅",submenuArrow:"▶",dragHandle:"⋮⋮",toolPanel:"☰",filter:e,filterActive:e,print:"🖨️"};class n{static dependencies;static manifest;version="undefined"!=typeof __GRID_VERSION__?__GRID_VERSION__:"dev";styles;cellRenderers;headerRenderers;cellEditors;grid;config;userConfig;#e;get defaultConfig(){return{}}constructor(e={}){this.userConfig=e}attach(e){this.#e?.abort(),this.#e=new AbortController,this.grid=e,this.config={...this.defaultConfig,...this.userConfig}}detach(){this.#e?.abort(),this.#e=void 0}getPlugin(e){return this.grid?.getPlugin(e)}emit(e,t){this.grid?.dispatchEvent?.(new CustomEvent(e,{detail:t,bubbles:!0}))}emitCancelable(e,t){const n=new CustomEvent(e,{detail:t,bubbles:!0,cancelable:!0});return this.grid?.dispatchEvent?.(n),n.defaultPrevented}on(e,t){this.grid?._pluginManager?.subscribe(this,e,t)}off(e){this.grid?._pluginManager?.unsubscribe(this,e)}emitPluginEvent(e,t){this.grid?._pluginManager?.emitPluginEvent(e,t)}requestRender(){this.grid?.requestRender?.()}requestColumnsRender(){this.grid?.requestColumnsRender?.()}requestRenderWithFocus(){this.grid?.requestRenderWithFocus?.()}requestAfterRender(){this.grid?.requestAfterRender?.()}get rows(){return this.grid?.rows??[]}get sourceRows(){return this.grid?.sourceRows??[]}get columns(){return this.grid?.columns??[]}get visibleColumns(){return this.grid?._visibleColumns??[]}get gridElement(){return this.grid}get disconnectSignal(){return this.#e?.signal??this.grid?.disconnectSignal}get gridIcons(){const e=this.grid?.gridConfig?.icons??{};return{...t,...e}}get isAnimationEnabled(){const e=this.grid?.effectiveConfig?.animation?.mode??"reduced-motion";if(!1===e||"off"===e)return!1;if(!0===e||"on"===e)return!0;const t=this.gridElement;if(t){return"0"!==getComputedStyle(t).getPropertyValue("--tbw-animation-enabled").trim()}return!0}get animationDuration(){const e=this.gridElement;if(e){const t=getComputedStyle(e).getPropertyValue("--tbw-animation-duration").trim(),n=parseInt(t,10);if(!isNaN(n))return n}return 200}resolveIcon(e,t){return void 0!==t?t:this.gridIcons[e]}setIcon(e,t){"string"==typeof t?e.innerHTML=t:t instanceof HTMLElement&&(e.innerHTML="",e.appendChild(t.cloneNode(!0)))}warn(e){console.warn(`[tbw-grid:${this.name}] ${e}`)}}function i(e,t,n=!0){let i=e;if(n&&(i=i.filter(e=>!e.hidden&&!e.field.startsWith("__")&&!0!==e.meta?.utility)),t?.length){const e=new Set(t);i=i.filter(t=>e.has(t.field))}return i}function r(e){return null==e?"":e instanceof Date?e.toISOString():"object"==typeof e?JSON.stringify(e):String(e)}function o(e,t){const n=t.delimiter??"\t",i=t.newline??"\n",r=e.replace(/\r\n/g,"\n").replace(/\r/g,"\n"),o=[];let s=[],l="",a=!1;for(let c=0;c<r.length;c++){const e=r[c];'"'!==e||a?'"'===e&&a?'"'===r[c+1]?(l+='"',c++):a=!1:e!==n||a?e!==i||a?l+=e:(s.push(l),l="",(s.length>1||s.some(e=>""!==e.trim()))&&o.push(s),s=[]):(s.push(l),l=""):a=!0}return s.push(l),(s.length>1||s.some(e=>""!==e.trim()))&&o.push(s),o}function s(e,t){const{rows:n,target:i,fields:r}=e;if(!i)return;const o=t.rows,s=t.effectiveConfig.columns??[],l=s.map(e=>e.field),a=/* @__PURE__ */new Map;s.forEach(e=>{a.set(e.field,!0===e.editable)});const c=[...o],d=i.bounds?i.bounds.endRow:1/0;n.forEach((e,t)=>{const n=i.row+t;if(!(n>d)){if(i.bounds){if(n>=c.length)return}else for(;n>=c.length;){const e={};l.forEach(t=>e[t]=""),c.push(e)}c[n]={...c[n]},e.forEach((e,t)=>{const i=r[t];i&&a.get(i)&&(c[n][i]=e)})}}),t.rows=c}class l extends n{static dependencies=[{name:"selection",required:!1,reason:"Enables copy/paste of selected cells instead of entire grid"}];name="clipboard";get defaultConfig(){return{includeHeaders:!1,delimiter:"\t",newline:"\n",quoteStrings:!1}}lastCopied=null;attach(e){super.attach(e);e.addEventListener("paste",e=>this.#t(e),{signal:this.disconnectSignal})}detach(){this.lastCopied=null}onKeyDown(e){return!(!e.ctrlKey&&!e.metaKey||"c"!==e.key)&&(e.preventDefault(),this.#n(e.target),!0)}#n(e){const t=this.#i();if(t&&0===t.ranges.length){const t=this.#r(e);if(!t)return;const n=this.columns[t.col];if(!n)return;return void this.copy({rowIndices:[t.row],columns:[n.field]})}this.copy()}#t(e){const t=e.clipboardData?.getData("text/plain");if(!t)return;e.preventDefault();const n=o(t,this.config),i=this.#i(),r=i?.ranges?.[0],s=r?.from.row??0,l=r?.from.col??0,a=r&&("range"===i?.mode||"row"===i?.mode)&&(r.from.row!==r.to.row||r.from.col!==r.to.col)?{endRow:r.to.row,endCol:r.to.col}:null,c=a?.endCol??this.visibleColumns.length-1,d=this.visibleColumns[l],u=d?{row:s,col:l,field:d.field,bounds:a}:null,h=[],g=n[0]?.length??0;for(let o=0;o<g&&l+o<=c;o++){const e=this.visibleColumns[l+o];e&&h.push(e.field)}const f={rows:n,text:t,target:u,fields:h};this.emit("paste",f),this.#o(f)}#o(e){if(!this.grid)return;const{pasteHandler:t}=this.config;if(null===t)return;(t??s)(e,this.grid)}#i(){const e=this.grid?.query("getSelection");return e?.[0]}#s(e){const t=this.#i();let n,r;if(e?.columns)n=i(this.columns,e.columns);else if(t?.ranges.length&&"row"!==t.mode){const e=t.ranges[t.ranges.length-1],r=Math.min(e.from.col,e.to.col),o=Math.max(e.from.col,e.to.col);n=i(this.visibleColumns.slice(r,o+1))}else n=i(this.columns);if(e?.rowIndices)r=function(e,t){return t?.length?[...t].sort((e,t)=>e-t).map(t=>e[t]).filter(e=>null!=e):e}(this.rows,e.rowIndices);else if(t?.ranges.length){const e=t.ranges[t.ranges.length-1],n=Math.min(e.from.row,e.to.row),i=Math.max(e.from.row,e.to.row);r=[];for(let t=n;t<=i;t++){const e=this.rows[t];e&&r.push(e)}}else r=this.rows;return{columns:n,rows:r}}#l(e,t,n){const i=n?.delimiter??this.config.delimiter??"\t",o=n?.newline??this.config.newline??"\n",s=n?.includeHeaders??this.config.includeHeaders??!1,l=n?.processCell??this.config.processCell,a=[];s&&a.push(e.map(e=>e.header||e.field).join(i));for(const c of t){const t=e.map(e=>{const t=c[e.field];return l?l(t,e.field,c):r(t)});a.push(t.join(i))}return a.join(o)}#r(e){const t=e.closest("[data-field-cache]");if(!t)return null;const n=t.dataset.fieldCache,i=t.dataset.row;if(!n||!i)return null;const r=parseInt(i,10);if(isNaN(r))return null;const o=this.columns.findIndex(e=>e.field===n);return-1===o?null:{row:r,col:o}}getSelectionAsText(e){const{columns:t,rows:n}=this.#s(e);return 0===t.length||0===n.length?"":this.#l(t,n,e)}async copy(e){const{columns:t,rows:n}=this.#s(e);if(0===t.length||0===n.length)return"";const i=this.#l(t,n,e);return await async function(e){try{return await navigator.clipboard.writeText(e),!0}catch(t){console.warn("[copyToClipboard] Clipboard API failed:",t);const n=document.createElement("textarea");n.value=e,n.style.position="fixed",n.style.opacity="0",n.style.pointerEvents="none",document.body.appendChild(n),n.select();const i=document.execCommand("copy");return document.body.removeChild(n),i}}(i),this.lastCopied={text:i,timestamp:Date.now()},this.emit("copy",{text:i,rowCount:n.length,columnCount:t.length}),i}async copyRows(e,t){return 0===e.length?"":this.copy({...t,rowIndices:e})}async paste(){const e=await async function(){try{return await navigator.clipboard.readText()}catch{return""}}();return e?o(e,this.config):null}getLastCopied(){return this.lastCopied}}export{l as ClipboardPlugin,s as defaultPasteHandler};
734
2
  //# sourceMappingURL=index.js.map