@toolbox-web/grid 0.1.0 → 0.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/all.d.ts +13 -0
- package/all.js +1684 -1196
- package/all.js.map +1 -1
- package/index.d.ts +4 -163
- package/index.js +1278 -1702
- package/index.js.map +1 -1
- package/lib/plugins/clipboard/index.js.map +1 -1
- package/lib/plugins/column-virtualization/index.js.map +1 -1
- package/lib/plugins/context-menu/index.js +35 -78
- package/lib/plugins/context-menu/index.js.map +1 -1
- package/lib/plugins/export/index.js.map +1 -1
- package/lib/plugins/filtering/index.js.map +1 -1
- package/lib/plugins/grouping-columns/index.js.map +1 -1
- package/lib/plugins/grouping-rows/index.js.map +1 -1
- package/lib/plugins/master-detail/index.js +1 -1
- package/lib/plugins/master-detail/index.js.map +1 -1
- package/lib/plugins/multi-sort/index.js.map +1 -1
- package/lib/plugins/pinned-columns/index.js.map +1 -1
- package/lib/plugins/pinned-rows/index.js +8 -8
- package/lib/plugins/pinned-rows/index.js.map +1 -1
- package/lib/plugins/pivot/index.js +160 -160
- package/lib/plugins/pivot/index.js.map +1 -1
- package/lib/plugins/reorder/index.js.map +1 -1
- package/lib/plugins/selection/index.js +93 -72
- package/lib/plugins/selection/index.js.map +1 -1
- package/lib/plugins/server-side/index.js.map +1 -1
- package/lib/plugins/tree/index.js.map +1 -1
- package/lib/plugins/undo-redo/index.js.map +1 -1
- package/lib/plugins/visibility/index.js.map +1 -1
- package/package.json +1 -1
- package/umd/grid.all.umd.js +27 -78
- package/umd/grid.all.umd.js.map +1 -1
- package/umd/grid.umd.js +28 -28
- package/umd/grid.umd.js.map +1 -1
- package/umd/plugins/context-menu.umd.js +1 -52
- package/umd/plugins/context-menu.umd.js.map +1 -1
- package/umd/plugins/master-detail.umd.js +1 -1
- package/umd/plugins/master-detail.umd.js.map +1 -1
- package/umd/plugins/pinned-rows.umd.js +1 -1
- package/umd/plugins/pinned-rows.umd.js.map +1 -1
- package/umd/plugins/pivot.umd.js +1 -1
- package/umd/plugins/pivot.umd.js.map +1 -1
- package/umd/plugins/selection.umd.js +1 -1
- package/umd/plugins/selection.umd.js.map +1 -1
- package/custom-elements.json +0 -1934
package/index.js
CHANGED
|
@@ -1,73 +1,73 @@
|
|
|
1
|
-
const me = ":root{color-scheme:light dark}:host{--tbw-color-bg: transparent;--tbw-color-panel-bg: light-dark(#eeeeee, #222222);--tbw-color-fg: light-dark(#222222, #eeeeee);--tbw-color-fg-muted: light-dark(#555555, #aaaaaa);--tbw-color-accent: light-dark(#3b82f6, #3b82f6);--tbw-color-accent-fg: light-dark(#ffffff, #000000);--tbw-color-success: light-dark(hsl(122, 39%, 40%), hsl(122, 39%, 49%));--tbw-color-selection: light-dark(#fff7d6, #333333);--tbw-color-row-alt: var(--tbw-color-bg);--tbw-color-row-hover: light-dark(#f0f6ff, #1c1c1c);--tbw-color-header-bg: color-mix(in hsl, var(--tbw-color-panel-bg) 85%, var(--tbw-color-fg));--tbw-color-header-fg: color-mix(in hsl, var(--tbw-color-fg) 75%, var(--tbw-color-panel-bg));--tbw-color-border: light-dark(#d0d0d4, #454545);--tbw-color-border-strong: light-dark(#777777, #adacac);--tbw-color-border-cell: var(--tbw-color-border);--tbw-color-border-header: var(--tbw-color-border);--tbw-color-shadow: light-dark(rgba(0, 0, 0, .1), rgba(0, 0, 0, .3));--tbw-font-family: inherit;--tbw-font-size: inherit;--tbw-font-size-header: var(--tbw-font-size);--tbw-font-weight-header: bold;--tbw-cell-padding-header: 2px 8px;--tbw-cell-padding: 2px 8px;--tbw-cell-padding-input: 2px 6px;--tbw-row-height: 28px;--tbw-header-height: 30px;--tbw-border-radius: 4px;--tbw-border-input: 1px solid var(--tbw-color-border-strong);--tbw-border-header: 1px solid var(--tbw-color-border-header);--tbw-row-divider: 1px solid var(--tbw-color-border-cell);--tbw-row-hover-outline: 0;--tbw-color-active-row-bg: var(--tbw-color-selection);--tbw-active-row-outline: 0;--tbw-focus-outline: 2px solid var(--tbw-color-accent);--tbw-focus-outline-offset: -2px;--tbw-focus-background: rgba(from var(--tbw-color-accent) r g b / 12%);--tbw-range-border-color: var(--tbw-color-accent);--tbw-range-selection-bg: rgba(from var(--tbw-range-border-color) r g b / 12%);--tbw-resize-handle-width: 4px;--tbw-resize-handle-color: transparent;--tbw-resize-handle-color-hover: var(--tbw-color-accent);--tbw-resize-handle-border-radius: 0;--tbw-scrollbar-thumb: var(--tbw-color-border-strong);--tbw-scrollbar-track: var(--tbw-color-bg);--tbw-transition-duration: .12s;--tbw-transition-ease: ease;--tbw-editing-bg: var(--tbw-color-selection);--tbw-editing-border: var(--tbw-border-input, 1px solid var(--tbw-color-border-strong));--tbw-padding-editing-input: var(--tbw-cell-padding-input, 2px 6px);--tbw-font-size-editor: inherit;--tbw-sort-indicator-color: var(--tbw-color-fg-muted);--tbw-sort-indicator-active-color: var(--tbw-color-accent);--tbw-header-text-transform: none;--tbw-header-letter-spacing: normal;--tbw-color-header-separator: var(--tbw-color-border-cell);--tbw-checkbox-size: 16px;--tbw-density-scale: 1}:host{position:relative;display:block;width:100%;height:100%;min-height:0;contain:content;font-family:var(--tbw-font-family);font-size:var(--tbw-font-size);background:var(--tbw-color-bg);color:var(--tbw-color-fg);border:1px solid var(--tbw-color-border);border-radius:var(--tbw-border-radius);overflow:clip;outline:none}:host,:host *{box-sizing:border-box}:host .header{display:block;flex-shrink:0;z-index:var(--tbw-z-layer-header, 30);background:var(--tbw-color-header-bg);overflow:visible}:host .header-group-row{display:grid;grid-template-columns:var(--tbw-column-template);background:var(--tbw-color-header-bg);z-index:var(--tbw-z-layer-header, 30)}:host .header-group-cell{display:flex;align-items:center;justify-content:flex-start;padding:var(--tbw-cell-padding-header, 2px 8px);color:var(--tbw-color-header-group-fg, var(--tbw-color-header-fg));font-weight:var(--tbw-font-weight-header-group, var(--tbw-font-weight-header));justify-content:var(--tbw-align-header-group, var(--tbw-align-header, flex-start))}:host .header-row{display:grid;grid-template-columns:var(--tbw-column-template);color:var(--tbw-color-header-fg);font-size:var(--tbw-font-size-header);min-height:var(--tbw-header-height);border-bottom:var(--tbw-border-header);z-index:var(--tbw-z-layer-header, 30)}:host .header-row>.cell{display:flex;align-items:center;gap:4px;padding:var(--tbw-cell-padding-header, 2px 8px);background-color:var(--tbw-color-header-bg);font-weight:var(--tbw-font-weight-header);border-right:1px solid var(--tbw-color-border-cell);overflow:hidden;min-width:0}:host .header-row>.cell>span:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .header-row>.cell>span[part~=sort-indicator]{flex-shrink:0}:host .header-row>.cell:last-child{border-right:0}:host .header-group-cell,:host .header-row>.cell.grouped.group-end{border-right:2px solid var(--tbw-color-border)}:host .tbw-grid-root{display:flex;flex-direction:column;height:100%}:host .rows-body-wrapper{flex:1;min-height:0;display:flex;flex-direction:row;width:100%;min-width:fit-content}:host .rows-body{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:visible}:host .rows-container{display:flex;flex-direction:row;flex:1;min-height:0;overflow:visible}:host .rows-viewport{flex:1;min-width:0;position:relative;display:block;overflow:clip}:host .faux-vscroll{position:sticky;inset-inline-end:0;flex-shrink:0;width:auto;overflow-y:auto;overflow-x:hidden;z-index:var(--tbw-z-layer-header, 30)}:host .faux-vscroll-spacer{width:1px}:host .rows-viewport .rows{position:absolute;top:0;left:0;min-width:100%;will-change:transform;z-index:var(--tbw-z-layer-rows, 1)}:host .data-grid-row{display:grid;grid-template-columns:var(--tbw-column-template);contain:layout style}:host .data-grid-row:has(.editing){background:var(--tbw-editing-bg)}:host .selecting .data-grid-row>.cell{user-select:none}:host .data-grid-row>.cell:focus-visible{outline:none}:host .data-grid-row>.cell{display:flex;align-items:center;padding:var(--tbw-cell-padding, 2px 8px);border-bottom:var(--tbw-row-divider);min-height:var(--tbw-row-height);border-right:1px solid var(--tbw-color-border-cell);overflow:hidden;min-width:0}:host .data-grid-row>.cell>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .data-grid-row>.cell:last-child{border-right:0}:host .data-grid-row>.cell[data-type=boolean]{justify-content:center}:host .data-grid-row>.cell[data-type=boolean] input[type=checkbox]{margin:0;width:var(--tbw-checkbox-size);height:var(--tbw-checkbox-size)}:host .data-grid-row>.cell.editing{overflow:hidden;padding:0}:host .data-grid-row>.cell.editing input:not([type=checkbox]),:host .data-grid-row>.cell.editing select,:host .data-grid-row>.cell.editing textarea{width:100%;height:100%;max-width:100%;flex:1 1 auto;min-width:0;border:var(--tbw-editing-border);padding:var(--tbw-padding-editing-input);font-size:var(--tbw-font-size-editor)}:host .data-grid-row:nth-child(2n){background:var(--tbw-color-row-alt)}:host .data-grid-row:hover{background:var(--tbw-color-row-hover)}:host .sortable{cursor:pointer;user-select:none}:host .resize-handle{position:absolute;top:0;right:calc(var(--tbw-resize-handle-width) / -2);width:var(--tbw-resize-handle-width);height:100%;cursor:e-resize;user-select:none;touch-action:none;z-index:20;background:var(--tbw-resize-handle-color);transition:background .12s ease;border-radius:var(--tbw-resize-handle-border-radius)}:host .resize-handle:hover{background:var(--tbw-resize-handle-color-hover)}:host .cell-focus,:host .row-focus{outline:var(--tbw-focus-outline);outline-offset:var(--tbw-focus-outline-offset)}:host .group-row{display:grid;grid-template-columns:var(--tbw-column-template);background:var(--tbw-color-row-alt);font-weight:500;border-bottom:var(--tbw-row-divider);min-height:var(--tbw-row-height)}:host .group-row .cell{display:flex;align-items:center;padding:var(--tbw-cell-padding, 2px 8px)}:host .group-row .group-toggle{background:none;border:0;cursor:pointer;padding:0 4px 0 0;font:inherit}:host .group-row .group-count{margin-left:4px;opacity:.7}:host .sticky-left,:host .sticky-right{position:sticky;z-index:25}:host .header-row>.cell.sticky-left,:host .header-row>.cell.sticky-right{background:var(--tbw-color-header-bg);z-index:35}:host .data-grid-row>.cell.sticky-left,:host .data-grid-row>.cell.sticky-right{background:var(--tbw-color-panel-bg)}:host .sticky-left{box-shadow:1px 0 0 var(--tbw-color-border)}:host .sticky-right{box-shadow:-1px 0 0 var(--tbw-color-border)}.grid-container{position:relative;width:100%;height:100%}.grid-placeholder{padding:2rem;text-align:center;color:var(--tbw-color-fg);opacity:.6}:host{--tbw-shell-header-height: 44px;--tbw-shell-header-bg: var(--tbw-color-panel-bg);--tbw-shell-header-border: var(--tbw-color-border);--tbw-shell-title-font-size: 14px;--tbw-shell-title-font-weight: 600;--tbw-tool-panel-width: 280px;--tbw-tool-panel-bg: var(--tbw-color-panel-bg);--tbw-tool-panel-border: var(--tbw-color-border);--tbw-tool-panel-header-height: 40px;--tbw-tool-panel-transition: .2s ease-out;--tbw-toolbar-button-size: 32px;--tbw-toolbar-button-gap: 4px}:host .tbw-grid-root.has-shell{display:flex;flex-direction:column;height:100%}:host .tbw-shell-header{display:flex;align-items:center;gap:8px;min-height:var(--tbw-shell-header-height);padding:0 8px;background:var(--tbw-shell-header-bg);border-bottom:1px solid var(--tbw-shell-header-border);flex-shrink:0}:host .tbw-shell-title{font-size:var(--tbw-shell-title-font-size);font-weight:var(--tbw-shell-title-font-weight);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .tbw-shell-content{flex:1;display:flex;align-items:center;gap:12px;min-width:0;overflow:hidden}:host .tbw-shell-toolbar{display:flex;align-items:center;gap:var(--tbw-toolbar-button-gap);flex-shrink:0}:host .tbw-toolbar-btn{display:inline-flex;align-items:center;justify-content:center;width:var(--tbw-toolbar-button-size);height:var(--tbw-toolbar-button-size);padding:0;border:1px solid transparent;border-radius:var(--tbw-border-radius);background:transparent;color:var(--tbw-color-fg);cursor:pointer;font-size:16px;transition:background var(--tbw-transition-duration) var(--tbw-transition-ease),border-color var(--tbw-transition-duration) var(--tbw-transition-ease)}:host .tbw-toolbar-btn:hover{background:var(--tbw-color-row-hover)}:host .tbw-toolbar-btn:focus-visible{outline:var(--tbw-focus-outline);outline-offset:var(--tbw-focus-outline-offset)}:host .tbw-toolbar-btn.active{background:var(--tbw-focus-background);border-color:var(--tbw-color-accent)}:host .tbw-toolbar-btn:disabled{opacity:.5;cursor:not-allowed}:host .tbw-toolbar-separator{width:1px;height:20px;background:var(--tbw-color-border);margin:0 4px}:host .tbw-shell-body{position:relative;display:flex;flex:1;min-height:0;overflow:visible}:host .tbw-grid-content{flex:1;min-width:0;min-height:0;display:flex;flex-direction:row;overflow:hidden}:host .tbw-scroll-area{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;overflow-x:auto;overflow-y:hidden}:host .tbw-tool-panel{position:absolute;top:0;bottom:0;right:0;width:0;overflow:hidden;background:var(--tbw-tool-panel-bg);border-left:1px solid var(--tbw-tool-panel-border);transition:width var(--tbw-tool-panel-transition);display:flex;flex-direction:column;z-index:30;box-shadow:-2px 0 8px var(--tbw-color-shadow)}:host .tbw-tool-panel[data-position=left]{right:auto;left:0;border-left:none;border-right:1px solid var(--tbw-tool-panel-border);box-shadow:2px 0 8px var(--tbw-color-shadow)}:host .tbw-tool-panel.open{width:var(--tbw-tool-panel-width)}:host .tbw-tool-panel-resize{position:absolute;top:0;bottom:0;width:6px;cursor:col-resize;background:transparent;z-index:10;transition:background .15s ease}:host .tbw-tool-panel-resize[data-handle-position=left]{left:0}:host .tbw-tool-panel-resize[data-handle-position=right]{right:0}:host .tbw-tool-panel-resize:hover,:host .tbw-tool-panel-resize.resizing{background:var(--tbw-color-accent)}:host .tbw-tool-panel-header{display:flex;align-items:center;justify-content:space-between;min-height:var(--tbw-tool-panel-header-height);padding:0 12px;border-bottom:1px solid var(--tbw-tool-panel-border);flex-shrink:0}:host .tbw-tool-panel-title{font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .tbw-tool-panel-close{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;border-radius:var(--tbw-border-radius);background:transparent;color:var(--tbw-color-fg-muted);cursor:pointer;font-size:14px}:host .tbw-tool-panel-close:hover{background:var(--tbw-color-row-hover);color:var(--tbw-color-fg)}:host .tbw-tool-panel-content{flex:1;overflow:auto}:host .tbw-accordion{display:flex;flex-direction:column;gap:0}:host .tbw-accordion-section{border-bottom:1px solid var(--tbw-tool-panel-border)}:host .tbw-accordion-section:last-child{border-bottom:none}:host .tbw-accordion-header{display:flex;align-items:center;gap:8px;width:100%;padding:10px 12px;border:none;background:transparent;color:var(--tbw-color-fg);font-size:13px;font-weight:600;text-align:left;cursor:pointer;user-select:none}:host .tbw-accordion-header:hover{background:var(--tbw-color-row-hover)}:host .tbw-accordion-section.single .tbw-accordion-header{cursor:default}:host .tbw-accordion-section.single .tbw-accordion-header:hover{background:transparent}:host .tbw-accordion-chevron{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;font-size:10px;color:var(--tbw-color-fg-muted);transition:transform .15s ease;flex-shrink:0}:host .tbw-accordion-section.expanded .tbw-accordion-chevron{transform:rotate(90deg)}:host .tbw-accordion-icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;font-size:14px;flex-shrink:0}:host .tbw-accordion-title{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .tbw-accordion-content{display:none}:host .tbw-accordion-section.expanded .tbw-accordion-content{display:block}:host .tbw-quick-filter-input{flex:1;max-width:300px;height:28px;padding:0 8px;border:1px solid var(--tbw-color-border);border-radius:var(--tbw-border-radius);background:var(--tbw-color-bg);color:var(--tbw-color-fg);font-size:13px}:host .tbw-quick-filter-input:focus{outline:none;border-color:var(--tbw-color-accent)}:host .tbw-selection-summary{font-size:13px;color:var(--tbw-color-fg-muted);white-space:nowrap}";
|
|
2
|
-
function
|
|
1
|
+
const de = ":root{color-scheme:light dark}:host{--tbw-color-bg: transparent;--tbw-color-panel-bg: light-dark(#eeeeee, #222222);--tbw-color-fg: light-dark(#222222, #eeeeee);--tbw-color-fg-muted: light-dark(#555555, #aaaaaa);--tbw-color-accent: light-dark(#3b82f6, #3b82f6);--tbw-color-accent-fg: light-dark(#ffffff, #000000);--tbw-color-success: light-dark(hsl(122, 39%, 40%), hsl(122, 39%, 49%));--tbw-color-selection: light-dark(#fff7d6, #333333);--tbw-color-row-alt: var(--tbw-color-bg);--tbw-color-row-hover: light-dark(#f0f6ff, #1c1c1c);--tbw-color-header-bg: color-mix(in hsl, var(--tbw-color-panel-bg) 85%, var(--tbw-color-fg));--tbw-color-header-fg: color-mix(in hsl, var(--tbw-color-fg) 75%, var(--tbw-color-panel-bg));--tbw-color-border: light-dark(#d0d0d4, #454545);--tbw-color-border-strong: light-dark(#777777, #adacac);--tbw-color-border-cell: var(--tbw-color-border);--tbw-color-border-header: var(--tbw-color-border);--tbw-color-shadow: light-dark(rgba(0, 0, 0, .1), rgba(0, 0, 0, .3));--tbw-font-family: inherit;--tbw-font-size: inherit;--tbw-font-size-header: var(--tbw-font-size);--tbw-font-weight-header: bold;--tbw-cell-padding-header: 2px 8px;--tbw-cell-padding: 2px 8px;--tbw-cell-padding-input: 2px 6px;--tbw-row-height: 28px;--tbw-header-height: 30px;--tbw-border-radius: 4px;--tbw-border-input: 1px solid var(--tbw-color-border-strong);--tbw-border-header: 1px solid var(--tbw-color-border-header);--tbw-row-divider: 1px solid var(--tbw-color-border-cell);--tbw-row-hover-outline: 0;--tbw-color-active-row-bg: var(--tbw-color-selection);--tbw-active-row-outline: 0;--tbw-focus-outline: 2px solid var(--tbw-color-accent);--tbw-focus-outline-offset: -2px;--tbw-focus-background: rgba(from var(--tbw-color-accent) r g b / 12%);--tbw-range-border-color: var(--tbw-color-accent);--tbw-range-selection-bg: rgba(from var(--tbw-range-border-color) r g b / 12%);--tbw-resize-handle-width: 4px;--tbw-resize-handle-color: transparent;--tbw-resize-handle-color-hover: var(--tbw-color-accent);--tbw-resize-handle-border-radius: 0;--tbw-scrollbar-thumb: var(--tbw-color-border-strong);--tbw-scrollbar-track: var(--tbw-color-bg);--tbw-transition-duration: .12s;--tbw-transition-ease: ease;--tbw-editing-bg: var(--tbw-color-selection);--tbw-editing-border: var(--tbw-border-input, 1px solid var(--tbw-color-border-strong));--tbw-padding-editing-input: var(--tbw-cell-padding-input, 2px 6px);--tbw-font-size-editor: inherit;--tbw-sort-indicator-color: var(--tbw-color-fg-muted);--tbw-sort-indicator-active-color: var(--tbw-color-accent);--tbw-header-text-transform: none;--tbw-header-letter-spacing: normal;--tbw-color-header-separator: var(--tbw-color-border-cell);--tbw-checkbox-size: 16px;--tbw-density-scale: 1}:host{position:relative;display:block;width:100%;height:100%;min-height:0;contain:content;font-family:var(--tbw-font-family);font-size:var(--tbw-font-size);background:var(--tbw-color-bg);color:var(--tbw-color-fg);border:1px solid var(--tbw-color-border);border-radius:var(--tbw-border-radius);overflow:clip;outline:none}:host,:host *{box-sizing:border-box}:host .header{display:block;flex-shrink:0;z-index:var(--tbw-z-layer-header, 30);background:var(--tbw-color-header-bg);overflow:visible}:host .header-group-row{display:grid;grid-template-columns:var(--tbw-column-template);background:var(--tbw-color-header-bg);z-index:var(--tbw-z-layer-header, 30)}:host .header-group-cell{display:flex;align-items:center;justify-content:flex-start;padding:var(--tbw-cell-padding-header, 2px 8px);color:var(--tbw-color-header-group-fg, var(--tbw-color-header-fg));font-weight:var(--tbw-font-weight-header-group, var(--tbw-font-weight-header));justify-content:var(--tbw-align-header-group, var(--tbw-align-header, flex-start))}:host .header-row{display:grid;grid-template-columns:var(--tbw-column-template);color:var(--tbw-color-header-fg);font-size:var(--tbw-font-size-header);min-height:var(--tbw-header-height);border-bottom:var(--tbw-border-header);z-index:var(--tbw-z-layer-header, 30)}:host .header-row>.cell{display:flex;align-items:center;gap:4px;padding:var(--tbw-cell-padding-header, 2px 8px);background-color:var(--tbw-color-header-bg);font-weight:var(--tbw-font-weight-header);border-right:1px solid var(--tbw-color-border-cell);overflow:hidden;min-width:0}:host .header-row>.cell>span:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .header-row>.cell>span[part~=sort-indicator]{flex-shrink:0}:host .header-row>.cell:last-child{border-right:0}:host .header-group-cell,:host .header-row>.cell.grouped.group-end{border-right:2px solid var(--tbw-color-border)}:host .tbw-grid-root{display:flex;flex-direction:column;height:100%}:host .rows-body-wrapper{flex:1;min-height:0;display:flex;flex-direction:row;width:100%;min-width:fit-content}:host .rows-body{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:visible}:host .rows-container{display:flex;flex-direction:row;flex:1;min-height:0;overflow:visible}:host .rows-viewport{flex:1;min-width:0;position:relative;display:block;overflow:clip}:host .faux-vscroll{position:sticky;inset-inline-end:0;flex-shrink:0;width:auto;overflow-y:auto;overflow-x:hidden;z-index:var(--tbw-z-layer-header, 30)}:host .faux-vscroll-spacer{width:1px}:host .rows-viewport .rows{position:absolute;top:0;left:0;min-width:100%;will-change:transform;z-index:var(--tbw-z-layer-rows, 1)}:host .data-grid-row{display:grid;grid-template-columns:var(--tbw-column-template);contain:layout style}:host .data-grid-row:has(.editing){background:var(--tbw-editing-bg)}:host .selecting .data-grid-row>.cell{user-select:none}:host .data-grid-row>.cell.selected:focus-visible,:host .data-grid-row>.cell:focus-visible:not(.cell-focus){outline:none}:host .data-grid-row>.cell{display:flex;align-items:center;padding:var(--tbw-cell-padding, 2px 8px);border-bottom:var(--tbw-row-divider);min-height:var(--tbw-row-height);border-right:1px solid var(--tbw-color-border-cell);overflow:hidden;min-width:0}:host .data-grid-row>.cell>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .data-grid-row>.cell:last-child{border-right:0}:host .data-grid-row>.cell[data-type=boolean]{justify-content:center}:host .data-grid-row>.cell[data-type=boolean] input[type=checkbox]{margin:0;width:var(--tbw-checkbox-size);height:var(--tbw-checkbox-size)}:host .data-grid-row>.cell.editing{overflow:hidden;padding:0}:host .data-grid-row>.cell.editing input:not([type=checkbox]),:host .data-grid-row>.cell.editing select,:host .data-grid-row>.cell.editing textarea{width:100%;height:100%;max-width:100%;flex:1 1 auto;min-width:0;border:var(--tbw-editing-border);padding:var(--tbw-padding-editing-input);font-size:var(--tbw-font-size-editor)}:host .data-grid-row:nth-child(2n){background:var(--tbw-color-row-alt)}:host .data-grid-row:hover{background:var(--tbw-color-row-hover)}:host .sortable{cursor:pointer;user-select:none}:host .resize-handle{position:absolute;top:0;right:calc(var(--tbw-resize-handle-width) / -2);width:var(--tbw-resize-handle-width);height:100%;cursor:e-resize;user-select:none;touch-action:none;z-index:20;background:var(--tbw-resize-handle-color);transition:background .12s ease;border-radius:var(--tbw-resize-handle-border-radius)}:host .resize-handle:hover{background:var(--tbw-resize-handle-color-hover)}:host .cell-focus,:host .row-focus{outline:var(--tbw-focus-outline);outline-offset:var(--tbw-focus-outline-offset)}:host .group-row{display:grid;grid-template-columns:var(--tbw-column-template);background:var(--tbw-color-row-alt);font-weight:500;border-bottom:var(--tbw-row-divider);min-height:var(--tbw-row-height)}:host .group-row .cell{display:flex;align-items:center;padding:var(--tbw-cell-padding, 2px 8px)}:host .group-row .group-toggle{background:none;border:0;cursor:pointer;padding:0 4px 0 0;font:inherit}:host .group-row .group-count{margin-left:4px;opacity:.7}:host .sticky-left,:host .sticky-right{position:sticky;z-index:25}:host .header-row>.cell.sticky-left,:host .header-row>.cell.sticky-right{background:var(--tbw-color-header-bg);z-index:35}:host .data-grid-row>.cell.sticky-left,:host .data-grid-row>.cell.sticky-right{background:var(--tbw-color-panel-bg)}:host .sticky-left{box-shadow:1px 0 0 var(--tbw-color-border)}:host .sticky-right{box-shadow:-1px 0 0 var(--tbw-color-border)}.grid-container{position:relative;width:100%;height:100%}.grid-placeholder{padding:2rem;text-align:center;color:var(--tbw-color-fg);opacity:.6}:host{--tbw-shell-header-height: 44px;--tbw-shell-header-bg: var(--tbw-color-panel-bg);--tbw-shell-header-border: var(--tbw-color-border);--tbw-shell-title-font-size: 14px;--tbw-shell-title-font-weight: 600;--tbw-tool-panel-width: 280px;--tbw-tool-panel-bg: var(--tbw-color-panel-bg);--tbw-tool-panel-border: var(--tbw-color-border);--tbw-tool-panel-header-height: 40px;--tbw-tool-panel-transition: .2s ease-out;--tbw-toolbar-button-size: 32px;--tbw-toolbar-button-gap: 4px}:host .tbw-grid-root.has-shell{display:flex;flex-direction:column;height:100%}:host .tbw-shell-header{display:flex;align-items:center;gap:8px;min-height:var(--tbw-shell-header-height);padding:0 8px;background:var(--tbw-shell-header-bg);border-bottom:1px solid var(--tbw-shell-header-border);flex-shrink:0}:host .tbw-shell-title{font-size:var(--tbw-shell-title-font-size);font-weight:var(--tbw-shell-title-font-weight);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .tbw-shell-content{flex:1;display:flex;align-items:center;gap:12px;min-width:0;overflow:hidden}:host .tbw-shell-toolbar{display:flex;align-items:center;gap:var(--tbw-toolbar-button-gap);flex-shrink:0}:host .tbw-toolbar-btn{display:inline-flex;align-items:center;justify-content:center;width:var(--tbw-toolbar-button-size);height:var(--tbw-toolbar-button-size);padding:0;border:1px solid transparent;border-radius:var(--tbw-border-radius);background:transparent;color:var(--tbw-color-fg);cursor:pointer;font-size:16px;transition:background var(--tbw-transition-duration) var(--tbw-transition-ease),border-color var(--tbw-transition-duration) var(--tbw-transition-ease)}:host .tbw-toolbar-btn:hover{background:var(--tbw-color-row-hover)}:host .tbw-toolbar-btn:focus-visible{outline:var(--tbw-focus-outline);outline-offset:var(--tbw-focus-outline-offset)}:host .tbw-toolbar-btn.active{background:var(--tbw-focus-background);border-color:var(--tbw-color-accent)}:host .tbw-toolbar-btn:disabled{opacity:.5;cursor:not-allowed}:host .tbw-toolbar-separator{width:1px;height:20px;background:var(--tbw-color-border);margin:0 4px}:host .tbw-shell-body{position:relative;display:flex;flex:1;min-height:0;overflow:visible}:host .tbw-grid-content{flex:1;min-width:0;min-height:0;display:flex;flex-direction:row;overflow:hidden}:host .tbw-scroll-area{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;overflow-x:auto;overflow-y:hidden}:host .tbw-tool-panel{position:absolute;top:0;bottom:0;right:0;width:0;overflow:hidden;background:var(--tbw-tool-panel-bg);border-left:1px solid var(--tbw-tool-panel-border);transition:width var(--tbw-tool-panel-transition);display:flex;flex-direction:column;z-index:30;box-shadow:-2px 0 8px var(--tbw-color-shadow)}:host .tbw-tool-panel[data-position=left]{right:auto;left:0;border-left:none;border-right:1px solid var(--tbw-tool-panel-border);box-shadow:2px 0 8px var(--tbw-color-shadow)}:host .tbw-tool-panel.open{width:var(--tbw-tool-panel-width)}:host .tbw-tool-panel-resize{position:absolute;top:0;bottom:0;width:6px;cursor:col-resize;background:transparent;z-index:10;transition:background .15s ease}:host .tbw-tool-panel-resize[data-handle-position=left]{left:0}:host .tbw-tool-panel-resize[data-handle-position=right]{right:0}:host .tbw-tool-panel-resize:hover,:host .tbw-tool-panel-resize.resizing{background:var(--tbw-color-accent)}:host .tbw-tool-panel-header{display:flex;align-items:center;justify-content:space-between;min-height:var(--tbw-tool-panel-header-height);padding:0 12px;border-bottom:1px solid var(--tbw-tool-panel-border);flex-shrink:0}:host .tbw-tool-panel-title{font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .tbw-tool-panel-close{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;border-radius:var(--tbw-border-radius);background:transparent;color:var(--tbw-color-fg-muted);cursor:pointer;font-size:14px}:host .tbw-tool-panel-close:hover{background:var(--tbw-color-row-hover);color:var(--tbw-color-fg)}:host .tbw-tool-panel-content{flex:1;overflow:auto}:host .tbw-accordion{display:flex;flex-direction:column;gap:0}:host .tbw-accordion-section{border-bottom:1px solid var(--tbw-tool-panel-border)}:host .tbw-accordion-section:last-child{border-bottom:none}:host .tbw-accordion-header{display:flex;align-items:center;gap:8px;width:100%;padding:10px 12px;border:none;background:transparent;color:var(--tbw-color-fg);font-size:13px;font-weight:600;text-align:left;cursor:pointer;user-select:none}:host .tbw-accordion-header:hover{background:var(--tbw-color-row-hover)}:host .tbw-accordion-section.single .tbw-accordion-header{cursor:default}:host .tbw-accordion-section.single .tbw-accordion-header:hover{background:transparent}:host .tbw-accordion-chevron{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;font-size:10px;color:var(--tbw-color-fg-muted);transition:transform .15s ease;flex-shrink:0}:host .tbw-accordion-section.expanded .tbw-accordion-chevron{transform:rotate(90deg)}:host .tbw-accordion-icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;font-size:14px;flex-shrink:0}:host .tbw-accordion-title{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .tbw-accordion-content{display:none}:host .tbw-accordion-section.expanded .tbw-accordion-content{display:block}:host .tbw-quick-filter-input{flex:1;max-width:300px;height:28px;padding:0 8px;border:1px solid var(--tbw-color-border);border-radius:var(--tbw-border-radius);background:var(--tbw-color-bg);color:var(--tbw-color-fg);font-size:13px}:host .tbw-quick-filter-input:focus{outline:none;border-color:var(--tbw-color-accent)}:host .tbw-selection-summary{font-size:13px;color:var(--tbw-color-fg-muted);white-space:nowrap}";
|
|
2
|
+
function ue(t) {
|
|
3
3
|
const e = /* @__PURE__ */ new Map();
|
|
4
|
-
return
|
|
5
|
-
direction:
|
|
4
|
+
return t.sortState && e.set(t.sortState.field, {
|
|
5
|
+
direction: t.sortState.direction === 1 ? "asc" : "desc",
|
|
6
6
|
priority: 0
|
|
7
7
|
}), e;
|
|
8
8
|
}
|
|
9
|
-
function
|
|
10
|
-
const
|
|
9
|
+
function re(t, e) {
|
|
10
|
+
const o = t._columns, n = ue(t);
|
|
11
11
|
return {
|
|
12
|
-
columns:
|
|
12
|
+
columns: o.map((i, s) => {
|
|
13
13
|
const r = {
|
|
14
|
-
field:
|
|
15
|
-
order:
|
|
14
|
+
field: i.field,
|
|
15
|
+
order: s,
|
|
16
16
|
visible: !0
|
|
17
17
|
// If it's in _columns, it's visible (hidden columns are filtered out)
|
|
18
|
-
},
|
|
19
|
-
|
|
20
|
-
const
|
|
21
|
-
|
|
18
|
+
}, l = i;
|
|
19
|
+
l.__renderedWidth !== void 0 ? r.width = l.__renderedWidth : i.width !== void 0 && (r.width = typeof i.width == "string" ? parseFloat(i.width) : i.width);
|
|
20
|
+
const a = n.get(i.field);
|
|
21
|
+
a && (r.sort = a);
|
|
22
22
|
for (const d of e)
|
|
23
23
|
if (d.getColumnState) {
|
|
24
|
-
const
|
|
25
|
-
|
|
24
|
+
const h = d.getColumnState(i.field);
|
|
25
|
+
h && Object.assign(r, h);
|
|
26
26
|
}
|
|
27
27
|
return r;
|
|
28
28
|
})
|
|
29
29
|
};
|
|
30
30
|
}
|
|
31
|
-
function
|
|
31
|
+
function he(t, e, o, n) {
|
|
32
32
|
if (!e.columns || e.columns.length === 0) return;
|
|
33
|
-
const
|
|
34
|
-
const
|
|
35
|
-
if (!
|
|
36
|
-
const d = { ...
|
|
37
|
-
return
|
|
33
|
+
const i = new Map(e.columns.map((l) => [l.field, l])), s = o.map((l) => {
|
|
34
|
+
const a = i.get(l.field);
|
|
35
|
+
if (!a) return l;
|
|
36
|
+
const d = { ...l };
|
|
37
|
+
return a.width !== void 0 && (d.width = a.width, d.__renderedWidth = a.width), a.visible !== void 0 && (d.hidden = !a.visible), d;
|
|
38
38
|
});
|
|
39
|
-
|
|
40
|
-
const d =
|
|
41
|
-
return d -
|
|
42
|
-
}),
|
|
43
|
-
const r = e.columns.filter((
|
|
39
|
+
s.sort((l, a) => {
|
|
40
|
+
const d = i.get(l.field)?.order ?? 1 / 0, h = i.get(a.field)?.order ?? 1 / 0;
|
|
41
|
+
return d - h;
|
|
42
|
+
}), t._columns = s;
|
|
43
|
+
const r = e.columns.filter((l) => l.sort !== void 0).sort((l, a) => (l.sort?.priority ?? 0) - (a.sort?.priority ?? 0));
|
|
44
44
|
if (r.length > 0) {
|
|
45
|
-
const
|
|
46
|
-
|
|
47
|
-
field:
|
|
48
|
-
direction:
|
|
45
|
+
const l = r[0];
|
|
46
|
+
l.sort && (t.sortState = {
|
|
47
|
+
field: l.field,
|
|
48
|
+
direction: l.sort.direction === "asc" ? 1 : -1
|
|
49
49
|
});
|
|
50
50
|
} else
|
|
51
|
-
|
|
52
|
-
for (const
|
|
53
|
-
if (
|
|
54
|
-
for (const
|
|
55
|
-
|
|
51
|
+
t.sortState = null;
|
|
52
|
+
for (const l of n)
|
|
53
|
+
if (l.applyColumnState)
|
|
54
|
+
for (const a of e.columns)
|
|
55
|
+
l.applyColumnState(a.field, a);
|
|
56
56
|
}
|
|
57
|
-
function
|
|
57
|
+
function fe(t, e, o) {
|
|
58
58
|
let n = null;
|
|
59
59
|
return () => {
|
|
60
60
|
n !== null && clearTimeout(n), n = setTimeout(() => {
|
|
61
61
|
n = null;
|
|
62
|
-
const
|
|
63
|
-
|
|
62
|
+
const i = re(t, e());
|
|
63
|
+
o(i);
|
|
64
64
|
}, 100);
|
|
65
65
|
};
|
|
66
66
|
}
|
|
67
|
-
const
|
|
67
|
+
const q = {
|
|
68
68
|
STRETCH: "stretch",
|
|
69
69
|
FIXED: "fixed"
|
|
70
|
-
},
|
|
70
|
+
}, P = {
|
|
71
71
|
expand: "▶",
|
|
72
72
|
collapse: "▼",
|
|
73
73
|
sortAsc: "▲",
|
|
@@ -77,25 +77,25 @@ const O = {
|
|
|
77
77
|
dragHandle: "⋮⋮",
|
|
78
78
|
toolPanel: "☰"
|
|
79
79
|
};
|
|
80
|
-
function
|
|
81
|
-
return
|
|
80
|
+
function pe(t) {
|
|
81
|
+
return t == null ? "string" : typeof t == "number" ? "number" : typeof t == "boolean" ? "boolean" : t instanceof Date || typeof t == "string" && /\d{4}-\d{2}-\d{2}/.test(t) && !isNaN(Date.parse(t)) ? "date" : "string";
|
|
82
82
|
}
|
|
83
|
-
function
|
|
83
|
+
function le(t, e) {
|
|
84
84
|
if (e && e.length) {
|
|
85
|
-
const
|
|
85
|
+
const s = {};
|
|
86
86
|
return e.forEach((r) => {
|
|
87
|
-
r.type && (
|
|
88
|
-
}), { columns: e, typeMap:
|
|
89
|
-
}
|
|
90
|
-
const
|
|
91
|
-
const r =
|
|
92
|
-
return { field:
|
|
93
|
-
}),
|
|
94
|
-
return n.forEach((
|
|
95
|
-
s
|
|
96
|
-
}), { columns: n, typeMap:
|
|
97
|
-
}
|
|
98
|
-
const
|
|
87
|
+
r.type && (s[r.field] = r.type);
|
|
88
|
+
}), { columns: e, typeMap: s };
|
|
89
|
+
}
|
|
90
|
+
const o = t[0] || {}, n = Object.keys(o).map((s) => {
|
|
91
|
+
const r = o[s], l = pe(r);
|
|
92
|
+
return { field: s, header: s.charAt(0).toUpperCase() + s.slice(1), type: l };
|
|
93
|
+
}), i = {};
|
|
94
|
+
return n.forEach((s) => {
|
|
95
|
+
i[s.field] = s.type || "string";
|
|
96
|
+
}), { columns: n, typeMap: i };
|
|
97
|
+
}
|
|
98
|
+
const be = /{{\s*([^}]+)\s*}}/g, k = "__DG_EMPTY__", we = /^[\w$. '?+\-*/%:()!<>=,&|]+$/, ge = /__(proto|defineGetter|defineSetter)|constructor|window|globalThis|global|process|Function|import|eval|Reflect|Proxy|Error|arguments|document|location|cookie|localStorage|sessionStorage|indexedDB|fetch|XMLHttpRequest|WebSocket|Worker|SharedWorker|ServiceWorker|opener|parent|top|frames|self|this\b/, me = /* @__PURE__ */ new Set([
|
|
99
99
|
"script",
|
|
100
100
|
"iframe",
|
|
101
101
|
"object",
|
|
@@ -120,425 +120,467 @@ const Re = /{{\s*([^}]+)\s*}}/g, x = "__DG_EMPTY__", _e = /^[\w$. '?+\-*/%:()!<>
|
|
|
120
120
|
"plaintext",
|
|
121
121
|
"xmp",
|
|
122
122
|
"listing"
|
|
123
|
-
]),
|
|
124
|
-
function
|
|
125
|
-
if (!
|
|
126
|
-
if (
|
|
123
|
+
]), Y = /^on\w+$/i, ve = /* @__PURE__ */ new Set(["href", "src", "action", "formaction", "data", "srcdoc", "xlink:href", "poster", "srcset"]), Ee = /^\s*(javascript|vbscript|data|blob):/i;
|
|
124
|
+
function V(t) {
|
|
125
|
+
if (!t || typeof t != "string") return "";
|
|
126
|
+
if (t.indexOf("<") === -1) return t;
|
|
127
127
|
const e = document.createElement("template");
|
|
128
|
-
return e.innerHTML =
|
|
128
|
+
return e.innerHTML = t, Ce(e.content), e.innerHTML;
|
|
129
129
|
}
|
|
130
|
-
function
|
|
131
|
-
const e = [],
|
|
132
|
-
for (const n of
|
|
133
|
-
const
|
|
134
|
-
if (
|
|
130
|
+
function Ce(t) {
|
|
131
|
+
const e = [], o = t.querySelectorAll("*");
|
|
132
|
+
for (const n of o) {
|
|
133
|
+
const i = n.tagName.toLowerCase();
|
|
134
|
+
if (me.has(i)) {
|
|
135
135
|
e.push(n);
|
|
136
136
|
continue;
|
|
137
137
|
}
|
|
138
|
-
if ((
|
|
139
|
-
(
|
|
138
|
+
if ((i === "svg" || n.namespaceURI === "http://www.w3.org/2000/svg") && Array.from(n.attributes).some(
|
|
139
|
+
(l) => Y.test(l.name) || l.name === "href" || l.name === "xlink:href"
|
|
140
140
|
)) {
|
|
141
141
|
e.push(n);
|
|
142
142
|
continue;
|
|
143
143
|
}
|
|
144
|
-
const
|
|
144
|
+
const s = [];
|
|
145
145
|
for (const r of n.attributes) {
|
|
146
|
-
const
|
|
147
|
-
if (
|
|
148
|
-
|
|
146
|
+
const l = r.name.toLowerCase();
|
|
147
|
+
if (Y.test(l)) {
|
|
148
|
+
s.push(r.name);
|
|
149
149
|
continue;
|
|
150
150
|
}
|
|
151
|
-
if (
|
|
152
|
-
|
|
151
|
+
if (ve.has(l) && Ee.test(r.value)) {
|
|
152
|
+
s.push(r.name);
|
|
153
153
|
continue;
|
|
154
154
|
}
|
|
155
|
-
if (
|
|
156
|
-
|
|
155
|
+
if (l === "style" && /expression\s*\(|javascript:|behavior\s*:/i.test(r.value)) {
|
|
156
|
+
s.push(r.name);
|
|
157
157
|
continue;
|
|
158
158
|
}
|
|
159
159
|
}
|
|
160
|
-
|
|
160
|
+
s.forEach((r) => n.removeAttribute(r));
|
|
161
161
|
}
|
|
162
162
|
e.forEach((n) => n.remove());
|
|
163
163
|
}
|
|
164
|
-
function
|
|
165
|
-
if (!
|
|
166
|
-
const
|
|
167
|
-
const d =
|
|
168
|
-
return
|
|
169
|
-
}),
|
|
170
|
-
return /Reflect\.|\bProxy\b|ownKeys\(/.test(
|
|
171
|
-
}
|
|
172
|
-
function
|
|
173
|
-
if (
|
|
174
|
-
if (
|
|
175
|
-
if (
|
|
176
|
-
const n =
|
|
177
|
-
return
|
|
178
|
-
}
|
|
179
|
-
if (
|
|
180
|
-
const
|
|
181
|
-
if (
|
|
164
|
+
function ae(t, e) {
|
|
165
|
+
if (!t || t.indexOf("{{") === -1) return t;
|
|
166
|
+
const o = [], n = t.replace(be, (l, a) => {
|
|
167
|
+
const d = ye(a, e);
|
|
168
|
+
return o.push({ expr: a.trim(), result: d }), d;
|
|
169
|
+
}), i = _e(n), s = o.length && o.every((l) => l.result === "" || l.result === k);
|
|
170
|
+
return /Reflect\.|\bProxy\b|ownKeys\(/.test(t) || s ? "" : i;
|
|
171
|
+
}
|
|
172
|
+
function ye(t, e) {
|
|
173
|
+
if (t = (t || "").trim(), !t || /\b(Reflect|Proxy|ownKeys)\b/.test(t)) return k;
|
|
174
|
+
if (t === "value") return e.value == null ? k : String(e.value);
|
|
175
|
+
if (t.startsWith("row.") && !/[()?]/.test(t) && !t.includes(":")) {
|
|
176
|
+
const n = t.slice(4), i = e.row ? e.row[n] : void 0;
|
|
177
|
+
return i == null ? k : String(i);
|
|
178
|
+
}
|
|
179
|
+
if (t.length > 80 || !we.test(t) || ge.test(t)) return k;
|
|
180
|
+
const o = t.match(/\./g);
|
|
181
|
+
if (o && o.length > 1) return k;
|
|
182
182
|
try {
|
|
183
|
-
const
|
|
184
|
-
return /Reflect|Proxy|ownKeys/.test(
|
|
183
|
+
const i = new Function("value", "row", `return (${t});`)(e.value, e.row), s = i == null ? "" : String(i);
|
|
184
|
+
return /Reflect|Proxy|ownKeys/.test(s) ? k : s || k;
|
|
185
185
|
} catch {
|
|
186
|
-
return
|
|
186
|
+
return k;
|
|
187
187
|
}
|
|
188
188
|
}
|
|
189
|
-
function
|
|
190
|
-
return
|
|
189
|
+
function _e(t) {
|
|
190
|
+
return t && t.replace(new RegExp(k, "g"), "").replace(/Reflect\.[^<>{}\s]+/g, "").replace(/\bProxy\b/g, "").replace(/ownKeys\([^)]*\)/g, "");
|
|
191
191
|
}
|
|
192
|
-
function
|
|
193
|
-
if (/Reflect|Proxy|ownKeys/.test(
|
|
194
|
-
if (Array.from(
|
|
192
|
+
function Re(t) {
|
|
193
|
+
if (/Reflect|Proxy|ownKeys/.test(t.textContent || "")) {
|
|
194
|
+
if (Array.from(t.childNodes).forEach((e) => {
|
|
195
195
|
e.nodeType === Node.TEXT_NODE && /Reflect|Proxy|ownKeys/.test(e.textContent || "") && (e.textContent = "");
|
|
196
|
-
}), /Reflect|Proxy|ownKeys/.test(
|
|
197
|
-
if (/Reflect|Proxy|ownKeys/.test(
|
|
198
|
-
for (;
|
|
199
|
-
|
|
196
|
+
}), /Reflect|Proxy|ownKeys/.test(t.textContent || "")) {
|
|
197
|
+
if (/Reflect|Proxy|ownKeys/.test(t.textContent || ""))
|
|
198
|
+
for (; t.firstChild; ) t.removeChild(t.firstChild);
|
|
199
|
+
t.textContent = (t.textContent || "").replace(/Reflect|Proxy|ownKeys/g, "");
|
|
200
200
|
}
|
|
201
|
-
(
|
|
201
|
+
(t.textContent || "").trim().length === 0 && (t.textContent = "");
|
|
202
202
|
}
|
|
203
203
|
}
|
|
204
|
-
function
|
|
205
|
-
const e = /Reflect\.|\bProxy\b|ownKeys\(/.test(
|
|
206
|
-
return
|
|
204
|
+
function Z(t) {
|
|
205
|
+
const e = /Reflect\.|\bProxy\b|ownKeys\(/.test(t), o = (n) => e ? "" : ae(t, n);
|
|
206
|
+
return o.__blocked = e, o;
|
|
207
207
|
}
|
|
208
|
-
function
|
|
209
|
-
return Array.from(
|
|
210
|
-
const n =
|
|
208
|
+
function Se(t) {
|
|
209
|
+
return Array.from(t.querySelectorAll("tbw-grid-column")).map((o) => {
|
|
210
|
+
const n = o.getAttribute("field") || "";
|
|
211
211
|
if (!n) return null;
|
|
212
|
-
const
|
|
213
|
-
|
|
214
|
-
const
|
|
215
|
-
|
|
216
|
-
const [w,
|
|
217
|
-
return { value: w.trim(), label:
|
|
212
|
+
const i = o.getAttribute("type") || void 0, r = i && (/* @__PURE__ */ new Set(["number", "string", "date", "boolean", "select", "typeahead"])).has(i) ? i : void 0, l = o.getAttribute("header") || void 0, a = o.hasAttribute("sortable"), d = o.hasAttribute("editable"), h = { field: n, type: r, header: l, sortable: a, editable: d };
|
|
213
|
+
o.hasAttribute("resizable") && (h.resizable = !0), o.hasAttribute("sizable") && (h.resizable = !0);
|
|
214
|
+
const p = o.getAttribute("options");
|
|
215
|
+
p && (h.options = p.split(",").map((f) => {
|
|
216
|
+
const [w, v] = f.includes(":") ? f.split(":") : [f.trim(), f.trim()];
|
|
217
|
+
return { value: w.trim(), label: v?.trim() || w.trim() };
|
|
218
218
|
}));
|
|
219
|
-
const
|
|
220
|
-
return
|
|
221
|
-
}).filter((
|
|
222
|
-
}
|
|
223
|
-
function
|
|
224
|
-
if ((!
|
|
225
|
-
if (!
|
|
226
|
-
if (!e || !e.length) return
|
|
227
|
-
const
|
|
228
|
-
e.forEach((
|
|
229
|
-
const n =
|
|
230
|
-
const
|
|
231
|
-
if (!
|
|
232
|
-
const r = { ...
|
|
233
|
-
return
|
|
219
|
+
const b = o.querySelector("tbw-grid-column-view"), c = o.querySelector("tbw-grid-column-editor"), u = o.querySelector("tbw-grid-column-header");
|
|
220
|
+
return b && (h.__viewTemplate = b), c && (h.__editorTemplate = c), u && (h.__headerTemplate = u), h;
|
|
221
|
+
}).filter((o) => !!o);
|
|
222
|
+
}
|
|
223
|
+
function xe(t, e) {
|
|
224
|
+
if ((!t || !t.length) && (!e || !e.length)) return [];
|
|
225
|
+
if (!t || !t.length) return e || [];
|
|
226
|
+
if (!e || !e.length) return t;
|
|
227
|
+
const o = {};
|
|
228
|
+
e.forEach((i) => o[i.field] = i);
|
|
229
|
+
const n = t.map((i) => {
|
|
230
|
+
const s = o[i.field];
|
|
231
|
+
if (!s) return i;
|
|
232
|
+
const r = { ...i };
|
|
233
|
+
return s.header && !r.header && (r.header = s.header), s.type && !r.type && (r.type = s.type), r.sortable = i.sortable || s.sortable, (i.resizable === !0 || s.resizable === !0) && (r.resizable = !0), r.editable = i.editable || s.editable, s.__viewTemplate && (r.__viewTemplate = s.__viewTemplate), s.__editorTemplate && (r.__editorTemplate = s.__editorTemplate), s.__headerTemplate && (r.__headerTemplate = s.__headerTemplate), delete o[i.field], r;
|
|
234
234
|
});
|
|
235
|
-
return Object.keys(
|
|
235
|
+
return Object.keys(o).forEach((i) => n.push(o[i])), n;
|
|
236
236
|
}
|
|
237
|
-
function
|
|
237
|
+
function U(t, e) {
|
|
238
238
|
try {
|
|
239
|
-
|
|
239
|
+
t.part?.add?.(e);
|
|
240
240
|
} catch {
|
|
241
241
|
}
|
|
242
|
-
const
|
|
243
|
-
|
|
242
|
+
const o = t.getAttribute("part");
|
|
243
|
+
o ? o.split(/\s+/).includes(e) || t.setAttribute("part", o + " " + e) : t.setAttribute("part", e);
|
|
244
244
|
}
|
|
245
|
-
function
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
),
|
|
249
|
-
const e =
|
|
250
|
-
|
|
251
|
-
|
|
245
|
+
function Ae(t) {
|
|
246
|
+
t.__lightDomColumnsCache || (t.__originalColumnNodes = Array.from(
|
|
247
|
+
t.querySelectorAll("tbw-grid-column")
|
|
248
|
+
), t.__lightDomColumnsCache = t.__originalColumnNodes.length ? Se(t) : []);
|
|
249
|
+
const e = t.__lightDomColumnsCache, o = xe(t._columns, e);
|
|
250
|
+
o.forEach((i) => {
|
|
251
|
+
i.__viewTemplate && !i.__compiledView && (i.__compiledView = Z(i.__viewTemplate.innerHTML)), i.__editorTemplate && !i.__compiledEditor && (i.__compiledEditor = Z(i.__editorTemplate.innerHTML));
|
|
252
252
|
});
|
|
253
|
-
const { columns: n } =
|
|
254
|
-
|
|
255
|
-
}
|
|
256
|
-
function
|
|
257
|
-
const e =
|
|
258
|
-
if (e !==
|
|
259
|
-
const
|
|
260
|
-
if (!
|
|
253
|
+
const { columns: n } = le(t._rows, o);
|
|
254
|
+
t._columns = n;
|
|
255
|
+
}
|
|
256
|
+
function Te(t) {
|
|
257
|
+
const e = t.effectiveConfig?.fitMode || t.fitMode || q.STRETCH;
|
|
258
|
+
if (e !== q.STRETCH && e !== q.FIXED || t.__didInitialAutoSize || !t.isConnected) return;
|
|
259
|
+
const o = t.headerRowEl?.children || [];
|
|
260
|
+
if (!o.length) return;
|
|
261
261
|
let n = !1;
|
|
262
|
-
|
|
263
|
-
if (
|
|
264
|
-
const r =
|
|
265
|
-
let
|
|
266
|
-
for (const
|
|
267
|
-
const d =
|
|
262
|
+
t.visibleColumns.forEach((i, s) => {
|
|
263
|
+
if (i.width) return;
|
|
264
|
+
const r = o[s];
|
|
265
|
+
let l = r ? r.scrollWidth : 0;
|
|
266
|
+
for (const a of t.rowPool) {
|
|
267
|
+
const d = a.children[s];
|
|
268
268
|
if (d) {
|
|
269
|
-
const
|
|
270
|
-
|
|
269
|
+
const h = d.scrollWidth;
|
|
270
|
+
h > l && (l = h);
|
|
271
271
|
}
|
|
272
272
|
}
|
|
273
|
-
|
|
274
|
-
}), n &&
|
|
273
|
+
l > 0 && (i.width = l + 2, i.__autoSized = !0, n = !0);
|
|
274
|
+
}), n && ce(t), t.__didInitialAutoSize = !0;
|
|
275
275
|
}
|
|
276
|
-
function
|
|
277
|
-
(
|
|
278
|
-
if (
|
|
279
|
-
const n =
|
|
276
|
+
function ce(t) {
|
|
277
|
+
(t.effectiveConfig?.fitMode || t.fitMode || q.STRETCH) === q.STRETCH ? t.gridTemplate = t.visibleColumns.map((o) => {
|
|
278
|
+
if (o.width) return `${o.width}px`;
|
|
279
|
+
const n = o.minWidth;
|
|
280
280
|
return n != null ? `minmax(${n}px, 1fr)` : "1fr";
|
|
281
|
-
}).join(" ").trim() :
|
|
281
|
+
}).join(" ").trim() : t.gridTemplate = t.visibleColumns.map((o) => o.width ? `${o.width}px` : "max-content").join(" "), t.style.setProperty("--tbw-column-template", t.gridTemplate);
|
|
282
282
|
}
|
|
283
|
-
function
|
|
284
|
-
switch (
|
|
283
|
+
function Le(t) {
|
|
284
|
+
switch (t.type) {
|
|
285
285
|
case "number":
|
|
286
286
|
return (e) => {
|
|
287
|
-
const
|
|
288
|
-
return
|
|
289
|
-
n.key === "Enter" && e.commit(
|
|
290
|
-
}),
|
|
287
|
+
const o = document.createElement("input");
|
|
288
|
+
return o.type = "number", o.value = e.value ?? "", o.addEventListener("blur", () => e.commit(o.value === "" ? null : Number(o.value))), o.addEventListener("keydown", (n) => {
|
|
289
|
+
n.key === "Enter" && e.commit(o.value === "" ? null : Number(o.value)), n.key === "Escape" && e.cancel();
|
|
290
|
+
}), o.focus(), o;
|
|
291
291
|
};
|
|
292
292
|
case "boolean":
|
|
293
293
|
return (e) => {
|
|
294
|
-
const
|
|
295
|
-
return
|
|
294
|
+
const o = document.createElement("input");
|
|
295
|
+
return o.type = "checkbox", o.checked = !!e.value, o.addEventListener("change", () => e.commit(o.checked)), o.focus(), o;
|
|
296
296
|
};
|
|
297
297
|
case "date":
|
|
298
298
|
return (e) => {
|
|
299
|
-
const
|
|
300
|
-
return
|
|
299
|
+
const o = document.createElement("input");
|
|
300
|
+
return o.type = "date", e.value instanceof Date && (o.valueAsDate = e.value), o.addEventListener("change", () => e.commit(o.valueAsDate)), o.addEventListener("keydown", (n) => {
|
|
301
301
|
n.key === "Escape" && e.cancel();
|
|
302
|
-
}),
|
|
302
|
+
}), o.focus(), o;
|
|
303
303
|
};
|
|
304
304
|
case "select":
|
|
305
305
|
case "typeahead":
|
|
306
306
|
return (e) => {
|
|
307
|
-
const
|
|
308
|
-
e.column.multi && (
|
|
307
|
+
const o = document.createElement("select");
|
|
308
|
+
e.column.multi && (o.multiple = !0), (typeof e.column.options == "function" ? e.column.options() : e.column.options || []).forEach((s) => {
|
|
309
309
|
const r = document.createElement("option");
|
|
310
|
-
r.value = String(
|
|
310
|
+
r.value = String(s.value), r.textContent = s.label, (e.column.multi && Array.isArray(e.value) && e.value.includes(s.value) || !e.column.multi && e.value === s.value) && (r.selected = !0), o.appendChild(r);
|
|
311
311
|
});
|
|
312
|
-
const
|
|
312
|
+
const i = () => {
|
|
313
313
|
if (e.column.multi) {
|
|
314
|
-
const
|
|
315
|
-
Array.from(
|
|
316
|
-
|
|
317
|
-
}), e.commit(
|
|
314
|
+
const s = [];
|
|
315
|
+
Array.from(o.selectedOptions).forEach((r) => {
|
|
316
|
+
s.push(r.value);
|
|
317
|
+
}), e.commit(s);
|
|
318
318
|
} else
|
|
319
|
-
e.commit(
|
|
319
|
+
e.commit(o.value);
|
|
320
320
|
};
|
|
321
|
-
return
|
|
322
|
-
|
|
323
|
-
}),
|
|
321
|
+
return o.addEventListener("change", i), o.addEventListener("blur", i), o.addEventListener("keydown", (s) => {
|
|
322
|
+
s.key === "Escape" && e.cancel();
|
|
323
|
+
}), o.focus(), o;
|
|
324
324
|
};
|
|
325
325
|
default:
|
|
326
326
|
return (e) => {
|
|
327
|
-
const
|
|
328
|
-
return
|
|
329
|
-
n.key === "Enter" && e.commit(
|
|
330
|
-
}),
|
|
327
|
+
const o = document.createElement("input");
|
|
328
|
+
return o.type = "text", o.value = e.value ?? "", o.addEventListener("blur", () => e.commit(o.value)), o.addEventListener("keydown", (n) => {
|
|
329
|
+
n.key === "Enter" && e.commit(o.value), n.key === "Escape" && e.cancel();
|
|
330
|
+
}), o.focus(), o;
|
|
331
331
|
};
|
|
332
332
|
}
|
|
333
333
|
}
|
|
334
|
-
function
|
|
335
|
-
if (
|
|
334
|
+
function ke(t, e) {
|
|
335
|
+
if (t.dispatchKeyDown?.(e))
|
|
336
336
|
return;
|
|
337
|
-
const
|
|
338
|
-
if (!
|
|
339
|
-
const
|
|
340
|
-
return !!(
|
|
337
|
+
const o = t._rows.length - 1, n = t.visibleColumns.length - 1, i = t.activeEditRows !== void 0 && t.activeEditRows !== -1, r = t.visibleColumns[t.focusCol]?.type, l = e.composedPath ? e.composedPath() : [], a = l && l.length ? l[0] : e.target, d = (h) => {
|
|
338
|
+
if (!h) return !1;
|
|
339
|
+
const p = h.tagName;
|
|
340
|
+
return !!(p === "INPUT" || p === "SELECT" || p === "TEXTAREA" || h.isContentEditable);
|
|
341
341
|
};
|
|
342
|
-
if (!(d(
|
|
342
|
+
if (!(d(a) && (e.key === "Home" || e.key === "End")) && !(d(a) && (e.key === "ArrowUp" || e.key === "ArrowDown") && a.tagName === "INPUT" && a.type === "number") && !(d(a) && (e.key === "ArrowLeft" || e.key === "ArrowRight")) && !(d(a) && (e.key === "Enter" || e.key === "Escape")) && !(i && (r === "select" || r === "typeahead") && (e.key === "ArrowDown" || e.key === "ArrowUp"))) {
|
|
343
343
|
switch (e.key) {
|
|
344
344
|
case "Tab": {
|
|
345
|
-
e.preventDefault(), !e.shiftKey ?
|
|
345
|
+
e.preventDefault(), !e.shiftKey ? t.focusCol < n ? t.focusCol += 1 : (typeof t.commitActiveRowEdit == "function" && t.commitActiveRowEdit(), t.focusRow < o && (t.focusRow += 1, t.focusCol = 0)) : t.focusCol > 0 ? t.focusCol -= 1 : t.focusRow > 0 && (typeof t.commitActiveRowEdit == "function" && t.activeEditRows === t.focusRow && t.commitActiveRowEdit(), t.focusRow -= 1, t.focusCol = n), $(t);
|
|
346
346
|
return;
|
|
347
347
|
}
|
|
348
348
|
case "ArrowDown":
|
|
349
|
-
|
|
349
|
+
i && typeof t.commitActiveRowEdit == "function" && t.commitActiveRowEdit(), t.focusRow = Math.min(o, t.focusRow + 1), e.preventDefault();
|
|
350
350
|
break;
|
|
351
351
|
case "ArrowUp":
|
|
352
|
-
|
|
352
|
+
i && typeof t.commitActiveRowEdit == "function" && t.commitActiveRowEdit(), t.focusRow = Math.max(0, t.focusRow - 1), e.preventDefault();
|
|
353
353
|
break;
|
|
354
354
|
case "ArrowRight":
|
|
355
|
-
|
|
355
|
+
t.focusCol = Math.min(n, t.focusCol + 1), e.preventDefault();
|
|
356
356
|
break;
|
|
357
357
|
case "ArrowLeft":
|
|
358
|
-
|
|
358
|
+
t.focusCol = Math.max(0, t.focusCol - 1), e.preventDefault();
|
|
359
359
|
break;
|
|
360
360
|
case "Home":
|
|
361
|
-
|
|
361
|
+
t.focusCol = 0, e.preventDefault();
|
|
362
362
|
break;
|
|
363
363
|
case "End":
|
|
364
|
-
|
|
364
|
+
t.focusCol = n, e.preventDefault();
|
|
365
365
|
break;
|
|
366
366
|
case "PageDown":
|
|
367
|
-
|
|
367
|
+
t.focusRow = Math.min(o, t.focusRow + 20), e.preventDefault();
|
|
368
368
|
break;
|
|
369
369
|
case "PageUp":
|
|
370
|
-
|
|
370
|
+
t.focusRow = Math.max(0, t.focusRow - 20), e.preventDefault();
|
|
371
371
|
break;
|
|
372
372
|
case "Enter":
|
|
373
|
-
return typeof
|
|
374
|
-
new CustomEvent("activate-cell", { detail: { row:
|
|
375
|
-
),
|
|
373
|
+
return typeof t.beginBulkEdit == "function" ? t.beginBulkEdit(t.focusRow) : t.dispatchEvent(
|
|
374
|
+
new CustomEvent("activate-cell", { detail: { row: t.focusRow, col: t.focusCol } })
|
|
375
|
+
), $(t);
|
|
376
376
|
default:
|
|
377
377
|
return;
|
|
378
378
|
}
|
|
379
|
-
|
|
379
|
+
$(t);
|
|
380
380
|
}
|
|
381
381
|
}
|
|
382
|
-
function
|
|
383
|
-
if (
|
|
384
|
-
const { rowHeight: s } =
|
|
385
|
-
|
|
382
|
+
function $(t) {
|
|
383
|
+
if (t.virtualization?.enabled) {
|
|
384
|
+
const { rowHeight: s, container: r, viewportEl: l } = t.virtualization, a = r, d = l?.clientHeight ?? a?.clientHeight ?? 0;
|
|
385
|
+
if (a && d > 0) {
|
|
386
|
+
const h = t.focusRow * s;
|
|
387
|
+
h < a.scrollTop ? a.scrollTop = h : h + s > a.scrollTop + d && (a.scrollTop = h - d + s);
|
|
388
|
+
}
|
|
386
389
|
}
|
|
387
|
-
|
|
390
|
+
t.activeEditRows !== void 0 && t.activeEditRows !== -1 || t.refreshVirtualWindow(!1), Array.from(t.bodyEl.querySelectorAll(".cell-focus")).forEach((s) => s.classList.remove("cell-focus")), Array.from(t.bodyEl.querySelectorAll('[aria-selected="true"]')).forEach((s) => {
|
|
388
391
|
s.setAttribute("aria-selected", "false");
|
|
389
392
|
});
|
|
390
|
-
const
|
|
391
|
-
if (
|
|
392
|
-
const
|
|
393
|
-
if (
|
|
394
|
-
if (
|
|
395
|
-
const
|
|
393
|
+
const o = t.focusRow, n = t.virtualization.start ?? 0, i = t.virtualization.end ?? t._rows.length;
|
|
394
|
+
if (o >= n && o < i) {
|
|
395
|
+
const r = t.bodyEl.querySelectorAll(".data-grid-row")[o - n]?.children[t.focusCol];
|
|
396
|
+
if (r) {
|
|
397
|
+
if (r.classList.add("cell-focus"), r.setAttribute("aria-selected", "true"), t.activeEditRows !== void 0 && t.activeEditRows !== -1 && r.classList.contains("editing")) {
|
|
398
|
+
const l = r.querySelector(
|
|
396
399
|
'input,select,textarea,[contenteditable="true"],[contenteditable=""],[tabindex]:not([tabindex="-1"])'
|
|
397
400
|
);
|
|
398
|
-
if (
|
|
401
|
+
if (l && document.activeElement !== l)
|
|
399
402
|
try {
|
|
400
|
-
|
|
403
|
+
l.focus();
|
|
401
404
|
} catch {
|
|
402
405
|
}
|
|
403
|
-
} else if (!
|
|
404
|
-
|
|
406
|
+
} else if (!r.contains(document.activeElement)) {
|
|
407
|
+
r.hasAttribute("tabindex") || r.setAttribute("tabindex", "-1");
|
|
405
408
|
try {
|
|
406
|
-
|
|
409
|
+
r.focus({ preventScroll: !0 });
|
|
407
410
|
} catch {
|
|
408
411
|
}
|
|
409
412
|
}
|
|
410
413
|
}
|
|
411
414
|
}
|
|
412
415
|
}
|
|
413
|
-
const
|
|
414
|
-
function
|
|
415
|
-
|
|
416
|
+
const Pe = "__cellDisplayCache", Oe = "__cellCacheEpoch";
|
|
417
|
+
function X(t) {
|
|
418
|
+
t[Pe] = void 0, t[Oe] = void 0, t.__hasSpecialColumns = void 0;
|
|
416
419
|
}
|
|
417
|
-
function
|
|
418
|
-
const
|
|
419
|
-
let d =
|
|
420
|
-
for (d === void 0 && (d =
|
|
421
|
-
const
|
|
422
|
-
|
|
423
|
-
}
|
|
424
|
-
if (
|
|
425
|
-
for (let
|
|
426
|
-
const
|
|
427
|
-
|
|
420
|
+
function He(t, e, o, n, i) {
|
|
421
|
+
const s = Math.max(0, o - e), r = t.bodyEl, l = t.visibleColumns, a = l.length;
|
|
422
|
+
let d = t.__cachedHeaderRowCount;
|
|
423
|
+
for (d === void 0 && (d = t.shadowRoot?.querySelector(".header-group-row") ? 2 : 1, t.__cachedHeaderRowCount = d); t.rowPool.length < s; ) {
|
|
424
|
+
const p = document.createElement("div");
|
|
425
|
+
p.className = "data-grid-row", p.setAttribute("role", "row"), p.addEventListener("click", (b) => J(t, b, p, !1)), p.addEventListener("dblclick", (b) => J(t, b, p, !0)), t.rowPool.push(p);
|
|
426
|
+
}
|
|
427
|
+
if (t.rowPool.length > s) {
|
|
428
|
+
for (let p = s; p < t.rowPool.length; p++) {
|
|
429
|
+
const b = t.rowPool[p];
|
|
430
|
+
b.parentNode === r && b.remove();
|
|
428
431
|
}
|
|
429
|
-
|
|
432
|
+
t.rowPool.length = s;
|
|
430
433
|
}
|
|
431
|
-
const
|
|
432
|
-
for (let
|
|
433
|
-
const
|
|
434
|
-
if (
|
|
435
|
-
|
|
434
|
+
const h = i && t.__hasRenderRowPlugins !== !1;
|
|
435
|
+
for (let p = 0; p < s; p++) {
|
|
436
|
+
const b = e + p, c = t._rows[b], u = t.rowPool[p];
|
|
437
|
+
if (u.setAttribute("aria-rowindex", String(b + d + 1)), h && i(c, u, b)) {
|
|
438
|
+
u.__epoch = n, u.__rowDataRef = c, u.parentNode !== r && r.appendChild(u);
|
|
436
439
|
continue;
|
|
437
440
|
}
|
|
438
|
-
const
|
|
439
|
-
let
|
|
440
|
-
if (
|
|
441
|
-
for (let
|
|
442
|
-
if (
|
|
443
|
-
|
|
441
|
+
const f = u.__epoch, w = u.__rowDataRef, v = u.children.length, x = f === n && v === a, R = w !== c;
|
|
442
|
+
let T = !1;
|
|
443
|
+
if (x && R) {
|
|
444
|
+
for (let E = 0; E < a; E++)
|
|
445
|
+
if (l[E].externalView && !u.querySelector(`.cell[data-col="${E}"] [data-external-view]`)) {
|
|
446
|
+
T = !0;
|
|
444
447
|
break;
|
|
445
448
|
}
|
|
446
449
|
}
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
+
if (!x || T) {
|
|
451
|
+
const E = u.querySelector(".cell.editing"), y = t.activeEditRows === b;
|
|
452
|
+
if (E && !y)
|
|
453
|
+
u.__isCustomRow && (u.className = "data-grid-row", u.setAttribute("role", "row"), u.__isCustomRow = !1), M(t, u, c, b), u.__epoch = n, u.__rowDataRef = c;
|
|
454
|
+
else if (E && y)
|
|
455
|
+
W(t, u, c, b), u.__rowDataRef = c;
|
|
456
|
+
else if (u.__isCustomRow && (u.className = "data-grid-row", u.setAttribute("role", "row"), u.__isCustomRow = !1), M(t, u, c, b), u.__epoch = n, u.__rowDataRef = c, y) {
|
|
457
|
+
const _ = u.children;
|
|
458
|
+
for (let C = 0; C < _.length; C++) {
|
|
459
|
+
const L = t.visibleColumns[C];
|
|
460
|
+
L && L.editable && O(t, c, b, L, _[C]);
|
|
461
|
+
}
|
|
462
|
+
}
|
|
463
|
+
} else if (R) {
|
|
464
|
+
const E = u.querySelector(".cell.editing"), y = t.activeEditRows === b;
|
|
465
|
+
if (E && !y)
|
|
466
|
+
M(t, u, c, b), u.__epoch = n, u.__rowDataRef = c;
|
|
467
|
+
else if (W(t, u, c, b), u.__rowDataRef = c, y && !E) {
|
|
468
|
+
const _ = u.children;
|
|
469
|
+
for (let C = 0; C < _.length; C++) {
|
|
470
|
+
const L = t.visibleColumns[C];
|
|
471
|
+
L && L.editable && O(t, c, b, L, _[C]);
|
|
472
|
+
}
|
|
473
|
+
}
|
|
474
|
+
} else {
|
|
475
|
+
const E = u.querySelector(".cell.editing"), y = t.activeEditRows === b;
|
|
476
|
+
if (E && !y)
|
|
477
|
+
M(t, u, c, b), u.__epoch = n, u.__rowDataRef = c;
|
|
478
|
+
else if (W(t, u, c, b), y && !E) {
|
|
479
|
+
const _ = u.children;
|
|
480
|
+
for (let C = 0; C < _.length; C++) {
|
|
481
|
+
const L = t.visibleColumns[C];
|
|
482
|
+
L && L.editable && O(t, c, b, L, _[C]);
|
|
483
|
+
}
|
|
484
|
+
}
|
|
485
|
+
}
|
|
486
|
+
const g = t._changedRowIndices.has(b), m = u.classList.contains("changed");
|
|
487
|
+
g !== m && u.classList.toggle("changed", g), u.parentNode !== r && r.appendChild(u);
|
|
450
488
|
}
|
|
451
489
|
}
|
|
452
|
-
function
|
|
453
|
-
const
|
|
454
|
-
let
|
|
455
|
-
if (
|
|
456
|
-
|
|
490
|
+
function W(t, e, o, n) {
|
|
491
|
+
const i = e.children, s = t.visibleColumns, r = s.length, l = i.length, a = r < l ? r : l, d = t.focusRow, h = t.focusCol;
|
|
492
|
+
let p = t.__hasSpecialColumns;
|
|
493
|
+
if (p === void 0) {
|
|
494
|
+
p = !1;
|
|
457
495
|
for (let c = 0; c < r; c++) {
|
|
458
|
-
const
|
|
459
|
-
if (
|
|
460
|
-
|
|
496
|
+
const u = s[c];
|
|
497
|
+
if (u.__viewTemplate || u.__compiledView || u.viewRenderer || u.externalView || u.format || u.type === "date" || u.type === "boolean") {
|
|
498
|
+
p = !0;
|
|
461
499
|
break;
|
|
462
500
|
}
|
|
463
501
|
}
|
|
464
|
-
|
|
465
|
-
}
|
|
466
|
-
const
|
|
467
|
-
if (!
|
|
468
|
-
for (let c = 0; c <
|
|
469
|
-
const
|
|
470
|
-
|
|
471
|
-
const w = d === n &&
|
|
472
|
-
w !==
|
|
502
|
+
t.__hasSpecialColumns = p;
|
|
503
|
+
}
|
|
504
|
+
const b = String(n);
|
|
505
|
+
if (!p) {
|
|
506
|
+
for (let c = 0; c < a; c++) {
|
|
507
|
+
const u = i[c], f = o[s[c].field];
|
|
508
|
+
u.textContent = f == null ? "" : String(f), u.getAttribute("data-row") !== b && u.setAttribute("data-row", b);
|
|
509
|
+
const w = d === n && h === c, v = u.classList.contains("cell-focus");
|
|
510
|
+
w !== v && (u.classList.toggle("cell-focus", w), u.setAttribute("aria-selected", String(w)));
|
|
473
511
|
}
|
|
474
512
|
return;
|
|
475
513
|
}
|
|
476
|
-
for (let c = 0; c <
|
|
477
|
-
if (
|
|
478
|
-
|
|
514
|
+
for (let c = 0; c < a; c++)
|
|
515
|
+
if (s[c].externalView && !i[c].querySelector("[data-external-view]")) {
|
|
516
|
+
M(t, e, o, n);
|
|
479
517
|
return;
|
|
480
518
|
}
|
|
481
|
-
for (let c = 0; c <
|
|
482
|
-
const
|
|
483
|
-
|
|
484
|
-
const w = d === n &&
|
|
485
|
-
if (w !==
|
|
486
|
-
if (
|
|
487
|
-
const
|
|
488
|
-
typeof
|
|
519
|
+
for (let c = 0; c < a; c++) {
|
|
520
|
+
const u = s[c], f = i[c];
|
|
521
|
+
f.getAttribute("data-row") !== b && f.setAttribute("data-row", b);
|
|
522
|
+
const w = d === n && h === c, v = f.classList.contains("cell-focus");
|
|
523
|
+
if (w !== v && (f.classList.toggle("cell-focus", w), f.setAttribute("aria-selected", String(w))), f.classList.contains("editing")) continue;
|
|
524
|
+
if (u.viewRenderer) {
|
|
525
|
+
const R = o[u.field], T = u.viewRenderer({ row: o, value: R, field: u.field, column: u });
|
|
526
|
+
typeof T == "string" ? f.innerHTML = V(T) : T ? (f.innerHTML = "", f.appendChild(T)) : f.textContent = R == null ? "" : String(R);
|
|
489
527
|
continue;
|
|
490
528
|
}
|
|
491
|
-
if (
|
|
529
|
+
if (u.__viewTemplate || u.__compiledView || u.externalView)
|
|
492
530
|
continue;
|
|
493
|
-
const
|
|
494
|
-
let
|
|
495
|
-
if (
|
|
531
|
+
const S = o[u.field];
|
|
532
|
+
let x;
|
|
533
|
+
if (u.format)
|
|
496
534
|
try {
|
|
497
|
-
const
|
|
498
|
-
|
|
535
|
+
const R = u.format(S, o);
|
|
536
|
+
x = R == null ? "" : String(R);
|
|
499
537
|
} catch {
|
|
500
|
-
|
|
538
|
+
x = S == null ? "" : String(S);
|
|
501
539
|
}
|
|
502
|
-
else if (
|
|
503
|
-
if (
|
|
504
|
-
|
|
505
|
-
else if (
|
|
506
|
-
|
|
540
|
+
else if (u.type === "date") {
|
|
541
|
+
if (S == null || S === "")
|
|
542
|
+
x = "";
|
|
543
|
+
else if (S instanceof Date)
|
|
544
|
+
x = isNaN(S.getTime()) ? "" : S.toLocaleDateString();
|
|
507
545
|
else {
|
|
508
|
-
const
|
|
509
|
-
|
|
546
|
+
const R = new Date(S);
|
|
547
|
+
x = isNaN(R.getTime()) ? "" : R.toLocaleDateString();
|
|
510
548
|
}
|
|
511
|
-
|
|
512
|
-
|
|
549
|
+
f.textContent = x;
|
|
550
|
+
} else if (u.type === "boolean") {
|
|
551
|
+
const R = !!S;
|
|
552
|
+
f.innerHTML = `<span role="checkbox" aria-checked="${R}" aria-label="${R}">${R ? "🗹" : "☐"}</span>`;
|
|
553
|
+
} else
|
|
554
|
+
x = S == null ? "" : String(S), f.textContent = x;
|
|
513
555
|
}
|
|
514
556
|
}
|
|
515
|
-
function
|
|
557
|
+
function M(t, e, o, n) {
|
|
516
558
|
e.innerHTML = "";
|
|
517
|
-
const
|
|
518
|
-
for (let
|
|
519
|
-
const
|
|
520
|
-
c.className = "cell",
|
|
521
|
-
const
|
|
522
|
-
|
|
523
|
-
let
|
|
524
|
-
const w =
|
|
559
|
+
const i = t.visibleColumns, s = i.length, r = t.focusRow, l = t.focusCol, a = t.effectiveConfig?.editOn || t.editOn, d = t, h = document.createDocumentFragment();
|
|
560
|
+
for (let p = 0; p < s; p++) {
|
|
561
|
+
const b = i[p], c = document.createElement("div");
|
|
562
|
+
c.className = "cell", U(c, "cell"), c.setAttribute("role", "gridcell"), c.setAttribute("aria-colindex", String(p + 1)), c.setAttribute("data-col", String(p)), c.setAttribute("data-row", String(n)), b.type, b.type && c.setAttribute("data-type", b.type);
|
|
563
|
+
const u = b.sticky;
|
|
564
|
+
u === "left" ? c.classList.add("sticky-left") : u === "right" && c.classList.add("sticky-right");
|
|
565
|
+
let f = o[b.field];
|
|
566
|
+
const w = b.format;
|
|
525
567
|
if (w)
|
|
526
568
|
try {
|
|
527
|
-
|
|
569
|
+
f = w(f, o);
|
|
528
570
|
} catch {
|
|
529
571
|
}
|
|
530
|
-
const
|
|
531
|
-
let
|
|
532
|
-
if (
|
|
533
|
-
const
|
|
534
|
-
typeof
|
|
535
|
-
} else if (
|
|
536
|
-
const
|
|
537
|
-
|
|
538
|
-
const
|
|
539
|
-
if (
|
|
572
|
+
const v = b.__compiledView, S = b.__viewTemplate, x = b.viewRenderer, R = b.externalView;
|
|
573
|
+
let T = !1;
|
|
574
|
+
if (x) {
|
|
575
|
+
const g = x({ row: o, value: f, field: b.field, column: b });
|
|
576
|
+
typeof g == "string" ? (c.innerHTML = V(g), T = !0) : g ? c.appendChild(g) : c.textContent = f == null ? "" : String(f);
|
|
577
|
+
} else if (R) {
|
|
578
|
+
const g = R, m = document.createElement("div");
|
|
579
|
+
m.setAttribute("data-external-view", ""), m.setAttribute("data-field", b.field), c.appendChild(m);
|
|
580
|
+
const E = { row: o, value: f, field: b.field, column: b };
|
|
581
|
+
if (g.mount)
|
|
540
582
|
try {
|
|
541
|
-
|
|
583
|
+
g.mount({ placeholder: m, context: E, spec: g });
|
|
542
584
|
} catch {
|
|
543
585
|
}
|
|
544
586
|
else
|
|
@@ -548,351 +590,372 @@ function G(o, e, t, n) {
|
|
|
548
590
|
new CustomEvent("mount-external-view", {
|
|
549
591
|
bubbles: !0,
|
|
550
592
|
composed: !0,
|
|
551
|
-
detail: { placeholder:
|
|
593
|
+
detail: { placeholder: m, spec: g, context: E }
|
|
552
594
|
})
|
|
553
595
|
);
|
|
554
596
|
} catch {
|
|
555
597
|
}
|
|
556
598
|
});
|
|
557
|
-
|
|
558
|
-
} else if (
|
|
559
|
-
const
|
|
560
|
-
c.innerHTML =
|
|
561
|
-
} else if (
|
|
562
|
-
const
|
|
563
|
-
/Reflect\.|\bProxy\b|ownKeys\(/.test(
|
|
564
|
-
} else if (
|
|
565
|
-
if (
|
|
599
|
+
m.setAttribute("data-mounted", "");
|
|
600
|
+
} else if (v) {
|
|
601
|
+
const g = v({ row: o, value: f, field: b.field, column: b }), m = v.__blocked;
|
|
602
|
+
c.innerHTML = m ? "" : V(g), T = !0, m && (c.textContent = "", c.setAttribute("data-blocked-template", ""));
|
|
603
|
+
} else if (S) {
|
|
604
|
+
const g = S.innerHTML;
|
|
605
|
+
/Reflect\.|\bProxy\b|ownKeys\(/.test(g) ? (c.textContent = "", c.setAttribute("data-blocked-template", "")) : (c.innerHTML = V(ae(g, { row: o, value: f })), T = !0);
|
|
606
|
+
} else if (b.type === "date")
|
|
607
|
+
if (f == null || f === "")
|
|
566
608
|
c.textContent = "";
|
|
567
609
|
else {
|
|
568
|
-
let
|
|
569
|
-
if (
|
|
570
|
-
else if (typeof
|
|
571
|
-
const
|
|
572
|
-
isNaN(
|
|
610
|
+
let g = null;
|
|
611
|
+
if (f instanceof Date) g = f;
|
|
612
|
+
else if (typeof f == "number" || typeof f == "string") {
|
|
613
|
+
const m = new Date(f);
|
|
614
|
+
isNaN(m.getTime()) || (g = m);
|
|
573
615
|
}
|
|
574
|
-
c.textContent =
|
|
616
|
+
c.textContent = g ? g.toLocaleDateString() : "";
|
|
575
617
|
}
|
|
576
|
-
else if (
|
|
577
|
-
const
|
|
578
|
-
c.innerHTML =
|
|
618
|
+
else if (b.type === "boolean") {
|
|
619
|
+
const g = !!f;
|
|
620
|
+
c.innerHTML = `<span role="checkbox" aria-checked="${g}" aria-label="${g}">${g ? "🗹" : "☐"}</span>`;
|
|
579
621
|
} else
|
|
580
|
-
c.textContent =
|
|
581
|
-
if (
|
|
582
|
-
|
|
583
|
-
const
|
|
584
|
-
/Proxy|Reflect\.ownKeys/.test(
|
|
622
|
+
c.textContent = f == null ? "" : String(f);
|
|
623
|
+
if (T) {
|
|
624
|
+
Re(c);
|
|
625
|
+
const g = c.textContent || "";
|
|
626
|
+
/Proxy|Reflect\.ownKeys/.test(g) && (c.textContent = g.replace(/Proxy|Reflect\.ownKeys/g, "").trim(), /Proxy|Reflect\.ownKeys/.test(c.textContent || "") && (c.textContent = ""));
|
|
585
627
|
}
|
|
586
|
-
c.hasAttribute("data-blocked-template") && (c.textContent || "").trim().length && (c.textContent = ""),
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
})
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
628
|
+
c.hasAttribute("data-blocked-template") && (c.textContent || "").trim().length && (c.textContent = ""), b.editable ? (c.tabIndex = 0, c.addEventListener("mousedown", () => {
|
|
629
|
+
if (c.classList.contains("editing")) return;
|
|
630
|
+
const g = Number(c.getAttribute("data-row")), m = Number(c.getAttribute("data-col"));
|
|
631
|
+
isNaN(g) || isNaN(m) || (t.focusRow = g, t.focusCol = m, $(t));
|
|
632
|
+
}), a === "click" ? c.addEventListener("click", (g) => {
|
|
633
|
+
if (c.classList.contains("editing")) return;
|
|
634
|
+
g.stopPropagation();
|
|
635
|
+
const m = Number(c.getAttribute("data-row")), E = Number(c.getAttribute("data-col"));
|
|
636
|
+
if (isNaN(m) || isNaN(E)) return;
|
|
637
|
+
const y = t._rows[m], _ = t.visibleColumns[E];
|
|
638
|
+
!y || !_ || (t.focusRow = m, t.focusCol = E, O(t, y, m, _, c));
|
|
639
|
+
}) : c.addEventListener("dblclick", (g) => {
|
|
640
|
+
g.stopPropagation();
|
|
641
|
+
const m = Number(c.getAttribute("data-row"));
|
|
642
|
+
if (isNaN(m)) return;
|
|
643
|
+
const E = t._rows[m];
|
|
644
|
+
if (!E) return;
|
|
645
|
+
z(t, m, E);
|
|
646
|
+
const y = t.findRenderedRowElement?.(m);
|
|
647
|
+
if (y) {
|
|
648
|
+
const _ = y.children;
|
|
649
|
+
for (let C = 0; C < _.length; C++) {
|
|
650
|
+
const L = t.visibleColumns[C];
|
|
651
|
+
L && L.editable && O(t, E, m, L, _[C]);
|
|
598
652
|
}
|
|
599
653
|
}
|
|
600
|
-
}), c.addEventListener("keydown", (
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
o.activeEditRows !== n && L(o, n, t), K(o, n, h, v, t), c.innerHTML = v ? "🗹" : "☐", c.setAttribute("role", "checkbox"), c.setAttribute("aria-checked", String(!!v)), c.setAttribute("aria-label", String(!!v));
|
|
654
|
+
}), c.addEventListener("keydown", (g) => {
|
|
655
|
+
const m = Number(c.getAttribute("data-row")), E = Number(c.getAttribute("data-col"));
|
|
656
|
+
if (isNaN(m) || isNaN(E)) return;
|
|
657
|
+
const y = t._rows[m], _ = t.visibleColumns[E];
|
|
658
|
+
if (!(!y || !_)) {
|
|
659
|
+
if ((_.type === "select" || _.type === "typeahead") && !c.classList.contains("editing") && g.key === "Enter") {
|
|
660
|
+
g.preventDefault(), t.activeEditRows !== m && z(t, m, y), O(t, y, m, _, c), setTimeout(() => {
|
|
661
|
+
const C = c.querySelector("select");
|
|
662
|
+
try {
|
|
663
|
+
C?.showPicker?.();
|
|
664
|
+
} catch {
|
|
665
|
+
}
|
|
666
|
+
C?.focus();
|
|
667
|
+
}, 0);
|
|
668
|
+
return;
|
|
669
|
+
}
|
|
670
|
+
if (_.type === "boolean" && g.key === " " && !c.classList.contains("editing")) {
|
|
671
|
+
g.preventDefault(), t.activeEditRows !== m && z(t, m, y);
|
|
672
|
+
const C = !y[_.field];
|
|
673
|
+
j(t, m, _, C, y), c.innerHTML = `<span role="checkbox" aria-checked="${C}" aria-label="${C}">${C ? "🗹" : "☐"}</span>`;
|
|
674
|
+
return;
|
|
675
|
+
}
|
|
676
|
+
if (g.key === "Enter" && !c.classList.contains("editing")) {
|
|
677
|
+
g.preventDefault(), g.stopPropagation(), t.focusRow = m, t.focusCol = E, typeof t.beginBulkEdit == "function" ? t.beginBulkEdit(m) : O(t, y, m, _, c);
|
|
678
|
+
return;
|
|
679
|
+
}
|
|
680
|
+
if (g.key === "F2" && !c.classList.contains("editing")) {
|
|
681
|
+
g.preventDefault(), O(t, y, m, _, c);
|
|
682
|
+
return;
|
|
683
|
+
}
|
|
631
684
|
}
|
|
632
|
-
})), r === n &&
|
|
685
|
+
})) : b.type === "boolean" && (c.hasAttribute("tabindex") || (c.tabIndex = 0)), r === n && l === p ? c.setAttribute("aria-selected", "true") : c.setAttribute("aria-selected", "false"), h.appendChild(c);
|
|
633
686
|
}
|
|
634
|
-
e.appendChild(
|
|
687
|
+
e.appendChild(h);
|
|
635
688
|
}
|
|
636
|
-
function
|
|
689
|
+
function J(t, e, o, n) {
|
|
637
690
|
if (e.target?.closest(".resize-handle")) return;
|
|
638
|
-
const
|
|
639
|
-
if (!
|
|
640
|
-
const
|
|
641
|
-
if (isNaN(
|
|
642
|
-
const r =
|
|
691
|
+
const i = o.querySelector(".cell[data-row]");
|
|
692
|
+
if (!i) return;
|
|
693
|
+
const s = Number(i.getAttribute("data-row"));
|
|
694
|
+
if (isNaN(s)) return;
|
|
695
|
+
const r = t._rows[s];
|
|
643
696
|
if (!r) return;
|
|
644
|
-
const
|
|
645
|
-
if (
|
|
646
|
-
|
|
697
|
+
const l = e.target?.closest(".cell[data-col]");
|
|
698
|
+
if (l) {
|
|
699
|
+
if (l.classList.contains("editing")) return;
|
|
700
|
+
const d = Number(l.getAttribute("data-col"));
|
|
647
701
|
if (!isNaN(d)) {
|
|
648
|
-
if (
|
|
702
|
+
if (t.dispatchCellClick?.(e, s, d, l))
|
|
649
703
|
return;
|
|
650
|
-
|
|
704
|
+
t.focusRow = s, t.focusCol = d, $(t);
|
|
651
705
|
}
|
|
652
706
|
}
|
|
653
|
-
if (
|
|
654
|
-
const d =
|
|
707
|
+
if (o.querySelector(".cell.editing")) {
|
|
708
|
+
const d = o.querySelectorAll(".cell.editing");
|
|
655
709
|
if (!n) return;
|
|
656
|
-
d.forEach((
|
|
710
|
+
d.forEach((h) => h.classList.remove("editing"));
|
|
657
711
|
}
|
|
658
|
-
const
|
|
659
|
-
if (
|
|
712
|
+
const a = t.effectiveConfig?.editOn || t.editOn || "doubleClick";
|
|
713
|
+
if (a === "click" || a === "doubleClick" && n) z(t, s, r);
|
|
660
714
|
else return;
|
|
661
|
-
Array.from(
|
|
662
|
-
const
|
|
663
|
-
|
|
664
|
-
}),
|
|
665
|
-
const d =
|
|
715
|
+
Array.from(o.children).forEach((d, h) => {
|
|
716
|
+
const p = t.visibleColumns[h];
|
|
717
|
+
p && p.editable && O(t, r, s, p, d);
|
|
718
|
+
}), l && queueMicrotask(() => {
|
|
719
|
+
const d = o.querySelector(`.cell[data-col="${t.focusCol}"]`);
|
|
666
720
|
if (d?.classList.contains("editing")) {
|
|
667
|
-
const
|
|
721
|
+
const h = d.querySelector(
|
|
668
722
|
'input,select,textarea,[contenteditable="true"],[contenteditable=""],[tabindex]:not([tabindex="-1"])'
|
|
669
723
|
);
|
|
670
724
|
try {
|
|
671
|
-
|
|
725
|
+
h?.focus();
|
|
672
726
|
} catch {
|
|
673
727
|
}
|
|
674
728
|
}
|
|
675
729
|
});
|
|
676
730
|
}
|
|
677
|
-
function
|
|
678
|
-
|
|
679
|
-
}
|
|
680
|
-
function
|
|
681
|
-
if (
|
|
682
|
-
const n =
|
|
683
|
-
if (
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
const
|
|
687
|
-
|
|
731
|
+
function z(t, e, o) {
|
|
732
|
+
t.activeEditRows !== e && (t.rowEditSnapshots.set(e, { ...o }), t.activeEditRows = e);
|
|
733
|
+
}
|
|
734
|
+
function N(t, e, o) {
|
|
735
|
+
if (t.activeEditRows !== e) return;
|
|
736
|
+
const n = t.rowEditSnapshots.get(e), i = t._rows[e], s = t.findRenderedRowElement?.(e);
|
|
737
|
+
if (!o && s && i && s.querySelectorAll(".cell.editing").forEach((l) => {
|
|
738
|
+
const a = Number(l.getAttribute("data-col"));
|
|
739
|
+
if (isNaN(a)) return;
|
|
740
|
+
const d = t.visibleColumns[a];
|
|
741
|
+
if (!d) return;
|
|
742
|
+
const h = l.querySelector("input,textarea,select");
|
|
743
|
+
if (h) {
|
|
744
|
+
let p;
|
|
745
|
+
h instanceof HTMLInputElement && h.type === "checkbox" ? p = h.checked : (p = h.value, d.type === "number" && p !== "" && (p = Number(p))), i[d.field] !== p && j(t, e, d, p, i);
|
|
746
|
+
}
|
|
747
|
+
}), o && n && i)
|
|
748
|
+
Object.keys(n).forEach((r) => i[r] = n[r]), t._changedRowIndices.delete(e), X(t);
|
|
749
|
+
else if (!o) {
|
|
750
|
+
const r = t._changedRowIndices.has(e);
|
|
751
|
+
t.dispatchEvent(
|
|
688
752
|
new CustomEvent("row-commit", {
|
|
689
753
|
detail: {
|
|
690
754
|
rowIndex: e,
|
|
691
|
-
row:
|
|
755
|
+
row: i,
|
|
692
756
|
changed: r,
|
|
693
|
-
changedRows:
|
|
694
|
-
changedRowIndices:
|
|
757
|
+
changedRows: t.changedRows,
|
|
758
|
+
changedRowIndices: t.changedRowIndices
|
|
695
759
|
}
|
|
696
760
|
})
|
|
697
761
|
);
|
|
698
762
|
}
|
|
699
|
-
|
|
700
|
-
const i = o.findRenderedRowElement?.(e);
|
|
701
|
-
i && (G(o, i, o._rows[e], e), o._changedRowIndices.has(e) ? i.classList.add("changed") : i.classList.remove("changed")), t && queueMicrotask(() => {
|
|
763
|
+
t.rowEditSnapshots.delete(e), t.activeEditRows = -1, s && (M(t, s, t._rows[e], e), t._changedRowIndices.has(e) ? s.classList.add("changed") : s.classList.remove("changed")), queueMicrotask(() => {
|
|
702
764
|
try {
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
);
|
|
709
|
-
const d = l.querySelector(`.cell[data-row="${r}"][data-col="${a}"]`);
|
|
710
|
-
d && d.classList.add("cell-focus");
|
|
765
|
+
const r = t.focusRow, l = t.focusCol, a = t.findRenderedRowElement?.(r);
|
|
766
|
+
if (a) {
|
|
767
|
+
Array.from(t.bodyEl.querySelectorAll(".cell-focus")).forEach((h) => h.classList.remove("cell-focus"));
|
|
768
|
+
const d = a.querySelector(`.cell[data-row="${r}"][data-col="${l}"]`);
|
|
769
|
+
d && (d.classList.add("cell-focus"), d.setAttribute("aria-selected", "true"), d.hasAttribute("tabindex") || d.setAttribute("tabindex", "-1"), d.focus({ preventScroll: !0 }));
|
|
711
770
|
}
|
|
712
771
|
} catch {
|
|
713
772
|
}
|
|
714
773
|
});
|
|
715
774
|
}
|
|
716
|
-
function
|
|
717
|
-
const
|
|
718
|
-
if (s
|
|
719
|
-
s
|
|
720
|
-
const
|
|
721
|
-
|
|
722
|
-
const
|
|
723
|
-
|
|
775
|
+
function j(t, e, o, n, i) {
|
|
776
|
+
const s = o.field;
|
|
777
|
+
if (i[s] === n) return;
|
|
778
|
+
i[s] = n;
|
|
779
|
+
const l = !t._changedRowIndices.has(e);
|
|
780
|
+
t._changedRowIndices.add(e);
|
|
781
|
+
const a = t.findRenderedRowElement?.(e);
|
|
782
|
+
a && a.classList.add("changed"), t.dispatchEvent(
|
|
724
783
|
new CustomEvent("cell-commit", {
|
|
725
784
|
detail: {
|
|
726
|
-
row:
|
|
727
|
-
field:
|
|
785
|
+
row: i,
|
|
786
|
+
field: s,
|
|
728
787
|
value: n,
|
|
729
788
|
rowIndex: e,
|
|
730
|
-
changedRows:
|
|
731
|
-
changedRowIndices:
|
|
732
|
-
firstTimeForRow:
|
|
789
|
+
changedRows: t.changedRows,
|
|
790
|
+
changedRowIndices: t.changedRowIndices,
|
|
791
|
+
firstTimeForRow: l
|
|
733
792
|
}
|
|
734
793
|
})
|
|
735
794
|
);
|
|
736
795
|
}
|
|
737
|
-
function
|
|
738
|
-
if (!n.editable || (
|
|
739
|
-
const
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
796
|
+
function O(t, e, o, n, i) {
|
|
797
|
+
if (!n.editable || (t.activeEditRows !== o && z(t, o, e), i.classList.contains("editing"))) return;
|
|
798
|
+
const s = e[n.field];
|
|
799
|
+
i.classList.add("editing");
|
|
800
|
+
let r = !1;
|
|
801
|
+
const l = (c) => {
|
|
802
|
+
r || t.activeEditRows === -1 || j(t, o, n, c, e);
|
|
743
803
|
}, a = () => {
|
|
744
|
-
e[n.field] =
|
|
745
|
-
const
|
|
746
|
-
|
|
747
|
-
},
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
|
|
752
|
-
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
|
|
804
|
+
r = !0, e[n.field] = s;
|
|
805
|
+
const c = i.querySelector("input,textarea,select");
|
|
806
|
+
c && (typeof HTMLInputElement < "u" && c instanceof HTMLInputElement && c.type === "checkbox" ? c.checked = !!s : "value" in c && (c.value = s ?? ""));
|
|
807
|
+
}, d = document.createElement("div");
|
|
808
|
+
d.style.display = "contents", i.innerHTML = "", i.appendChild(d), d.addEventListener("keydown", (c) => {
|
|
809
|
+
c.key === "Enter" && (c.stopPropagation(), c.preventDefault(), r = !0, N(t, o, !1)), c.key === "Escape" && (c.stopPropagation(), c.preventDefault(), a(), N(t, o, !0));
|
|
810
|
+
});
|
|
811
|
+
const h = n.__editorTemplate, p = n.editor || (h ? "template" : Le(n)), b = s;
|
|
812
|
+
if (p === "template" && h) {
|
|
813
|
+
const c = h.cloneNode(!0), u = n.__compiledEditor;
|
|
814
|
+
u ? c.innerHTML = u({ row: e, value: s, field: n.field, column: n }) : c.querySelectorAll("*").forEach((w) => {
|
|
815
|
+
w.childNodes.length === 1 && w.firstChild?.nodeType === Node.TEXT_NODE && (w.textContent = w.textContent?.replace(/{{\s*value\s*}}/g, s == null ? "" : String(s)).replace(/{{\s*row\.([a-zA-Z0-9_]+)\s*}}/g, (v, S) => {
|
|
816
|
+
const x = e[S];
|
|
817
|
+
return x == null ? "" : String(x);
|
|
756
818
|
}) || "");
|
|
757
819
|
});
|
|
758
|
-
const f =
|
|
820
|
+
const f = c.querySelector("input,textarea,select");
|
|
759
821
|
if (f) {
|
|
760
|
-
const
|
|
761
|
-
|
|
762
|
-
const
|
|
763
|
-
|
|
764
|
-
}), f.addEventListener("keydown", (
|
|
765
|
-
if (
|
|
766
|
-
|
|
767
|
-
|
|
822
|
+
const w = typeof HTMLInputElement < "u";
|
|
823
|
+
w && f instanceof HTMLInputElement && f.type === "checkbox" ? f.checked = !!s : "value" in f && (f.value = s ?? ""), f.addEventListener("blur", () => {
|
|
824
|
+
const v = w && f instanceof HTMLInputElement && f.type === "checkbox" ? f.checked : f.value;
|
|
825
|
+
l(v);
|
|
826
|
+
}), f.addEventListener("keydown", (v) => {
|
|
827
|
+
if (v.key === "Enter") {
|
|
828
|
+
v.stopPropagation(), v.preventDefault(), r = !0;
|
|
829
|
+
const S = w && f instanceof HTMLInputElement && f.type === "checkbox" ? f.checked : f.value;
|
|
830
|
+
l(S), N(t, o, !1);
|
|
768
831
|
}
|
|
769
|
-
|
|
770
|
-
}),
|
|
771
|
-
const
|
|
772
|
-
|
|
832
|
+
v.key === "Escape" && (v.stopPropagation(), v.preventDefault(), a(), N(t, o, !0));
|
|
833
|
+
}), w && f instanceof HTMLInputElement && f.type === "checkbox" && f.addEventListener("change", () => {
|
|
834
|
+
const v = f.checked;
|
|
835
|
+
l(v);
|
|
773
836
|
}), setTimeout(() => f.focus(), 0);
|
|
774
837
|
}
|
|
775
|
-
|
|
776
|
-
} else if (typeof
|
|
777
|
-
const
|
|
778
|
-
|
|
779
|
-
} else if (typeof
|
|
780
|
-
const
|
|
781
|
-
typeof
|
|
782
|
-
} else if (
|
|
783
|
-
const
|
|
784
|
-
|
|
785
|
-
const
|
|
786
|
-
if (
|
|
838
|
+
d.appendChild(c);
|
|
839
|
+
} else if (typeof p == "string") {
|
|
840
|
+
const c = document.createElement(p);
|
|
841
|
+
c.value = b, c.addEventListener("change", () => l(c.value)), d.appendChild(c);
|
|
842
|
+
} else if (typeof p == "function") {
|
|
843
|
+
const c = p({ row: e, value: b, field: n.field, column: n, commit: l, cancel: a });
|
|
844
|
+
typeof c == "string" ? d.innerHTML = c : d.appendChild(c);
|
|
845
|
+
} else if (p && typeof p == "object") {
|
|
846
|
+
const c = document.createElement("div");
|
|
847
|
+
c.setAttribute("data-external-editor", ""), c.setAttribute("data-field", n.field), d.appendChild(c);
|
|
848
|
+
const u = { row: e, value: b, field: n.field, column: n, commit: l, cancel: a };
|
|
849
|
+
if (p.mount)
|
|
787
850
|
try {
|
|
788
|
-
|
|
851
|
+
p.mount({ placeholder: c, context: u, spec: p });
|
|
789
852
|
} catch {
|
|
790
853
|
}
|
|
791
854
|
else
|
|
792
|
-
|
|
793
|
-
new CustomEvent("mount-external-editor", { detail: { placeholder:
|
|
855
|
+
t.dispatchEvent(
|
|
856
|
+
new CustomEvent("mount-external-editor", { detail: { placeholder: c, spec: p, context: u } })
|
|
794
857
|
);
|
|
795
858
|
}
|
|
796
859
|
}
|
|
797
|
-
function
|
|
798
|
-
!
|
|
799
|
-
n.getAttribute("aria-sort") ? (n.getAttribute("aria-sort") === "ascending" || n.getAttribute("aria-sort") === "descending") && (
|
|
800
|
-
}),
|
|
860
|
+
function Q(t, e) {
|
|
861
|
+
!t.sortState || t.sortState.field !== e.field ? (t.sortState || (t.__originalOrder = t._rows.slice()), ee(t, e, 1)) : t.sortState.direction === 1 ? ee(t, e, -1) : (t.sortState = null, t.__rowRenderEpoch++, t.rowPool.forEach((n) => n.__epoch = -1), t._rows = t.__originalOrder.slice(), K(t), t.headerRowEl?.querySelectorAll('[role="columnheader"].sortable')?.forEach((n) => {
|
|
862
|
+
n.getAttribute("aria-sort") ? (n.getAttribute("aria-sort") === "ascending" || n.getAttribute("aria-sort") === "descending") && (t.sortState || n.setAttribute("aria-sort", "none")) : n.setAttribute("aria-sort", "none");
|
|
863
|
+
}), t.refreshVirtualWindow(!0), t.dispatchEvent(
|
|
801
864
|
new CustomEvent("sort-change", { detail: { field: e.field, direction: 0 } })
|
|
802
|
-
),
|
|
803
|
-
}
|
|
804
|
-
function
|
|
805
|
-
|
|
806
|
-
const n = e.sortComparator || ((
|
|
807
|
-
|
|
808
|
-
new CustomEvent("sort-change", { detail: { field: e.field, direction:
|
|
809
|
-
),
|
|
810
|
-
}
|
|
811
|
-
function
|
|
812
|
-
typeof e == "string" ?
|
|
813
|
-
}
|
|
814
|
-
function
|
|
815
|
-
|
|
816
|
-
const e =
|
|
817
|
-
e.innerHTML = "",
|
|
818
|
-
const
|
|
819
|
-
|
|
820
|
-
const
|
|
821
|
-
if (
|
|
865
|
+
), t.requestStateChange?.());
|
|
866
|
+
}
|
|
867
|
+
function ee(t, e, o) {
|
|
868
|
+
t.sortState = { field: e.field, direction: o };
|
|
869
|
+
const n = e.sortComparator || ((i, s) => i == null && s == null ? 0 : i == null ? -1 : s == null || i > s ? 1 : i < s ? -1 : 0);
|
|
870
|
+
t._rows.sort((i, s) => n(i[e.field], s[e.field], i, s) * o), t.__rowRenderEpoch++, t.rowPool.forEach((i) => i.__epoch = -1), K(t), t.refreshVirtualWindow(!0), t.dispatchEvent(
|
|
871
|
+
new CustomEvent("sort-change", { detail: { field: e.field, direction: o } })
|
|
872
|
+
), t.requestStateChange?.();
|
|
873
|
+
}
|
|
874
|
+
function Me(t, e) {
|
|
875
|
+
typeof e == "string" ? t.textContent = e : e instanceof HTMLElement && (t.innerHTML = "", t.appendChild(e.cloneNode(!0)));
|
|
876
|
+
}
|
|
877
|
+
function K(t) {
|
|
878
|
+
t.headerRowEl = t.findHeaderRow();
|
|
879
|
+
const e = t.headerRowEl;
|
|
880
|
+
e.innerHTML = "", t.visibleColumns.forEach((o, n) => {
|
|
881
|
+
const i = document.createElement("div");
|
|
882
|
+
i.className = "cell", U(i, "header-cell"), i.setAttribute("role", "columnheader"), i.setAttribute("aria-colindex", String(n + 1)), i.setAttribute("data-field", o.field), i.setAttribute("data-col", String(n)), o.sticky === "left" ? i.classList.add("sticky-left") : o.sticky === "right" && i.classList.add("sticky-right");
|
|
883
|
+
const s = o.__headerTemplate;
|
|
884
|
+
if (s) Array.from(s.childNodes).forEach((r) => i.appendChild(r.cloneNode(!0)));
|
|
822
885
|
else {
|
|
823
|
-
const r =
|
|
824
|
-
|
|
886
|
+
const r = o.header || o.field, l = document.createElement("span");
|
|
887
|
+
l.textContent = r, i.appendChild(l);
|
|
825
888
|
}
|
|
826
|
-
if (
|
|
827
|
-
|
|
889
|
+
if (o.sortable) {
|
|
890
|
+
i.classList.add("sortable"), i.tabIndex = 0;
|
|
828
891
|
const r = document.createElement("span");
|
|
829
|
-
|
|
830
|
-
const
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
}),
|
|
834
|
-
if (
|
|
835
|
-
if (
|
|
836
|
-
|
|
892
|
+
U(r, "sort-indicator"), r.style.opacity = "0.6";
|
|
893
|
+
const l = t.sortState?.field === o.field ? t.sortState.direction : 0, a = { ...P, ...t.icons }, d = l === 1 ? a.sortAsc : l === -1 ? a.sortDesc : a.sortNone;
|
|
894
|
+
Me(r, d), i.appendChild(r), i.setAttribute("aria-sort", l === 0 ? "none" : l === 1 ? "ascending" : "descending"), i.addEventListener("click", (h) => {
|
|
895
|
+
t.resizeController?.isResizing || t.dispatchHeaderClick?.(h, n, i) || Q(t, o);
|
|
896
|
+
}), i.addEventListener("keydown", (h) => {
|
|
897
|
+
if (h.key === "Enter" || h.key === " ") {
|
|
898
|
+
if (h.preventDefault(), t.dispatchHeaderClick?.(h, n, i)) return;
|
|
899
|
+
Q(t, o);
|
|
837
900
|
}
|
|
838
901
|
});
|
|
839
902
|
}
|
|
840
|
-
if (
|
|
841
|
-
|
|
903
|
+
if (o.resizable) {
|
|
904
|
+
o.sticky || (i.style.position = "relative");
|
|
842
905
|
const r = document.createElement("div");
|
|
843
|
-
r.className = "resize-handle", r.setAttribute("aria-hidden", "true"), r.addEventListener("mousedown", (
|
|
844
|
-
|
|
845
|
-
}),
|
|
906
|
+
r.className = "resize-handle", r.setAttribute("aria-hidden", "true"), r.addEventListener("mousedown", (l) => {
|
|
907
|
+
l.stopPropagation(), l.preventDefault(), t.resizeController.start(l, n, i);
|
|
908
|
+
}), i.appendChild(r);
|
|
846
909
|
}
|
|
847
|
-
e.appendChild(
|
|
910
|
+
e.appendChild(i);
|
|
848
911
|
});
|
|
849
912
|
try {
|
|
850
|
-
const
|
|
851
|
-
|
|
852
|
-
|
|
913
|
+
const o = t.shadowRoot;
|
|
914
|
+
o && o.querySelectorAll(".header-group-row .cell").forEach((i) => {
|
|
915
|
+
i.getAttribute("data-group") && i.classList.add("grouped");
|
|
853
916
|
});
|
|
854
917
|
} catch {
|
|
855
918
|
}
|
|
856
|
-
e.querySelectorAll(".cell.sortable").forEach((
|
|
857
|
-
|
|
858
|
-
});
|
|
919
|
+
e.querySelectorAll(".cell.sortable").forEach((o) => {
|
|
920
|
+
o.getAttribute("aria-sort") || o.setAttribute("aria-sort", "none");
|
|
921
|
+
}), e.children.length > 0 ? (e.setAttribute("role", "row"), e.setAttribute("aria-rowindex", "1")) : (e.removeAttribute("role"), e.removeAttribute("aria-rowindex"));
|
|
859
922
|
}
|
|
860
|
-
function
|
|
861
|
-
let e = null,
|
|
862
|
-
const
|
|
923
|
+
function ze(t) {
|
|
924
|
+
let e = null, o = null, n = null, i = null;
|
|
925
|
+
const s = (a) => {
|
|
863
926
|
if (!e) return;
|
|
864
|
-
const d =
|
|
865
|
-
|
|
866
|
-
|
|
867
|
-
})),
|
|
868
|
-
new CustomEvent("column-resize", { detail: { field:
|
|
927
|
+
const d = a.clientX - e.startX, h = Math.max(40, e.startWidth + d), p = t.visibleColumns[e.colIndex];
|
|
928
|
+
p.width = h, p.__userResized = !0, p.__renderedWidth = h, o == null && (o = requestAnimationFrame(() => {
|
|
929
|
+
o = null, t.updateTemplate?.();
|
|
930
|
+
})), t.dispatchEvent(
|
|
931
|
+
new CustomEvent("column-resize", { detail: { field: p.field, width: h } })
|
|
869
932
|
);
|
|
870
933
|
};
|
|
871
934
|
let r = !1;
|
|
872
|
-
const
|
|
873
|
-
const
|
|
874
|
-
|
|
935
|
+
const l = () => {
|
|
936
|
+
const a = e !== null;
|
|
937
|
+
a && (r = !0, requestAnimationFrame(() => {
|
|
875
938
|
r = !1;
|
|
876
|
-
})), window.removeEventListener("mousemove",
|
|
939
|
+
})), window.removeEventListener("mousemove", s), window.removeEventListener("mouseup", l), n !== null && (document.documentElement.style.cursor = n, n = null), i !== null && (document.body.style.userSelect = i, i = null), e = null, a && t.requestStateChange && t.requestStateChange();
|
|
877
940
|
};
|
|
878
941
|
return {
|
|
879
942
|
get isResizing() {
|
|
880
943
|
return e !== null || r;
|
|
881
944
|
},
|
|
882
|
-
start(
|
|
883
|
-
|
|
884
|
-
const
|
|
885
|
-
e = { startX:
|
|
945
|
+
start(a, d, h) {
|
|
946
|
+
a.preventDefault();
|
|
947
|
+
const p = h.getBoundingClientRect();
|
|
948
|
+
e = { startX: a.clientX, colIndex: d, startWidth: p.width }, window.addEventListener("mousemove", s), window.addEventListener("mouseup", l), n === null && (n = document.documentElement.style.cursor), document.documentElement.style.cursor = "e-resize", i === null && (i = document.body.style.userSelect), document.body.style.userSelect = "none";
|
|
886
949
|
},
|
|
887
950
|
dispose() {
|
|
888
|
-
|
|
951
|
+
l();
|
|
889
952
|
}
|
|
890
953
|
};
|
|
891
954
|
}
|
|
892
|
-
function
|
|
893
|
-
return
|
|
955
|
+
function I(t) {
|
|
956
|
+
return t ? typeof t == "string" ? t : t.outerHTML : "";
|
|
894
957
|
}
|
|
895
|
-
function
|
|
958
|
+
function De() {
|
|
896
959
|
return {
|
|
897
960
|
toolPanels: /* @__PURE__ */ new Map(),
|
|
898
961
|
headerContents: /* @__PURE__ */ new Map(),
|
|
@@ -909,241 +972,241 @@ function Fe() {
|
|
|
909
972
|
activePanelCleanup: null
|
|
910
973
|
};
|
|
911
974
|
}
|
|
912
|
-
function
|
|
913
|
-
return !!(
|
|
975
|
+
function Ne(t, e) {
|
|
976
|
+
return !!(t?.header?.title || t?.header?.toolbarButtons?.length || e.toolPanels.size > 0 || e.headerContents.size > 0 || e.toolbarButtons.size > 0 || e.lightDomButtons.length > 0 || e.lightDomHeaderContent.length > 0);
|
|
914
977
|
}
|
|
915
|
-
function
|
|
916
|
-
const n =
|
|
917
|
-
let
|
|
978
|
+
function qe(t, e, o = "☰") {
|
|
979
|
+
const n = t?.header?.title ?? "", i = !!n, s = I(o), r = t?.header?.toolbarButtons ?? [], l = r.length > 0, a = e.toolbarButtons.size > 0, d = e.lightDomButtons.length > 0, h = e.toolPanels.size > 0, b = (l || a || d) && h, c = [...r].sort((w, v) => (w.order ?? 100) - (v.order ?? 100)), u = [...e.toolbarButtons.values()].sort((w, v) => (w.order ?? 100) - (v.order ?? 100));
|
|
980
|
+
let f = "";
|
|
918
981
|
for (const w of c)
|
|
919
|
-
w.icon && w.action && (
|
|
920
|
-
for (const w of
|
|
921
|
-
w.icon && w.action && (
|
|
982
|
+
w.icon && w.action && (f += `<button class="tbw-toolbar-btn" data-btn="${w.id}" title="${w.label}" aria-label="${w.label}"${w.disabled ? " disabled" : ""}>${w.icon}</button>`);
|
|
983
|
+
for (const w of u)
|
|
984
|
+
w.icon && w.action && (f += `<button class="tbw-toolbar-btn" data-btn="${w.id}" title="${w.label}" aria-label="${w.label}"${w.disabled ? " disabled" : ""}>${w.icon}</button>`);
|
|
922
985
|
for (const w of c)
|
|
923
|
-
(w.element || w.render) && (
|
|
924
|
-
for (const w of
|
|
925
|
-
(w.element || w.render) && (
|
|
926
|
-
if (d && (
|
|
986
|
+
(w.element || w.render) && (f += `<div class="tbw-toolbar-btn-slot" data-btn-slot="${w.id}"></div>`);
|
|
987
|
+
for (const w of u)
|
|
988
|
+
(w.element || w.render) && (f += `<div class="tbw-toolbar-btn-slot" data-btn-slot="${w.id}"></div>`);
|
|
989
|
+
if (d && (f += '<slot name="toolbar"></slot>'), b && (f += '<div class="tbw-toolbar-separator"></div>'), h) {
|
|
927
990
|
const w = e.isPanelOpen;
|
|
928
|
-
|
|
991
|
+
f += `<button class="tbw-toolbar-btn${w ? " active" : ""}" data-panel-toggle title="Settings" aria-label="Toggle settings panel" aria-pressed="${w}" aria-controls="tbw-tool-panel">${s}</button>`;
|
|
929
992
|
}
|
|
930
993
|
return `
|
|
931
|
-
<div class="tbw-shell-header" part="shell-header" role="
|
|
932
|
-
${
|
|
933
|
-
<div class="tbw-shell-content" part="shell-content" role="
|
|
994
|
+
<div class="tbw-shell-header" part="shell-header" role="presentation">
|
|
995
|
+
${i ? `<div class="tbw-shell-title">${n}</div>` : ""}
|
|
996
|
+
<div class="tbw-shell-content" part="shell-content" role="presentation">
|
|
934
997
|
<slot name="header-content"></slot>
|
|
935
998
|
</div>
|
|
936
|
-
<div class="tbw-shell-toolbar" part="shell-toolbar" role="
|
|
937
|
-
${
|
|
999
|
+
<div class="tbw-shell-toolbar" part="shell-toolbar" role="presentation">
|
|
1000
|
+
${f}
|
|
938
1001
|
</div>
|
|
939
1002
|
</div>
|
|
940
1003
|
`;
|
|
941
1004
|
}
|
|
942
|
-
function
|
|
943
|
-
const
|
|
944
|
-
let
|
|
945
|
-
for (const
|
|
946
|
-
const
|
|
947
|
-
|
|
948
|
-
<div class="${`tbw-accordion-section${
|
|
949
|
-
<button class="tbw-accordion-header" aria-expanded="${
|
|
1005
|
+
function $e(t, e, o, n) {
|
|
1006
|
+
const i = t?.toolPanel?.position ?? "right", s = e.toolPanels.size > 0, r = e.isPanelOpen, l = I(n?.expand ?? P.expand), a = I(n?.collapse ?? P.collapse), d = [...e.toolPanels.values()].sort((u, f) => (u.order ?? 100) - (f.order ?? 100)), h = d.length === 1;
|
|
1007
|
+
let p = "";
|
|
1008
|
+
for (const u of d) {
|
|
1009
|
+
const f = e.expandedSections.has(u.id), w = u.icon ? `<span class="tbw-accordion-icon">${u.icon}</span>` : "", v = h ? "" : `<span class="tbw-accordion-chevron">${f ? a : l}</span>`;
|
|
1010
|
+
p += `
|
|
1011
|
+
<div class="${`tbw-accordion-section${f ? " expanded" : ""}${h ? " single" : ""}`}" data-section="${u.id}">
|
|
1012
|
+
<button class="tbw-accordion-header" aria-expanded="${f}" aria-controls="tbw-section-${u.id}"${h ? ' aria-disabled="true"' : ""}>
|
|
950
1013
|
${w}
|
|
951
|
-
<span class="tbw-accordion-title">${
|
|
952
|
-
${
|
|
1014
|
+
<span class="tbw-accordion-title">${u.title}</span>
|
|
1015
|
+
${v}
|
|
953
1016
|
</button>
|
|
954
|
-
<div class="tbw-accordion-content" id="tbw-section-${
|
|
1017
|
+
<div class="tbw-accordion-content" id="tbw-section-${u.id}" role="presentation"></div>
|
|
955
1018
|
</div>
|
|
956
1019
|
`;
|
|
957
1020
|
}
|
|
958
|
-
const c =
|
|
959
|
-
<aside class="tbw-tool-panel${r ? " open" : ""}" part="tool-panel" data-position="${
|
|
960
|
-
<div class="tbw-tool-panel-resize" data-resize-handle data-handle-position="${
|
|
961
|
-
<div class="tbw-tool-panel-content" role="
|
|
1021
|
+
const c = s ? `
|
|
1022
|
+
<aside class="tbw-tool-panel${r ? " open" : ""}" part="tool-panel" data-position="${i}" role="presentation" id="tbw-tool-panel">
|
|
1023
|
+
<div class="tbw-tool-panel-resize" data-resize-handle data-handle-position="${i === "left" ? "right" : "left"}" aria-hidden="true"></div>
|
|
1024
|
+
<div class="tbw-tool-panel-content" role="presentation">
|
|
962
1025
|
<div class="tbw-accordion">
|
|
963
|
-
${
|
|
1026
|
+
${p}
|
|
964
1027
|
</div>
|
|
965
1028
|
</div>
|
|
966
1029
|
</aside>
|
|
967
1030
|
` : "";
|
|
968
|
-
return
|
|
1031
|
+
return i === "left" ? `
|
|
969
1032
|
<div class="tbw-shell-body">
|
|
970
1033
|
${c}
|
|
971
1034
|
<div class="tbw-grid-content">
|
|
972
|
-
${
|
|
1035
|
+
${o}
|
|
973
1036
|
</div>
|
|
974
1037
|
</div>
|
|
975
1038
|
` : `
|
|
976
1039
|
<div class="tbw-shell-body">
|
|
977
1040
|
<div class="tbw-grid-content">
|
|
978
|
-
${
|
|
1041
|
+
${o}
|
|
979
1042
|
</div>
|
|
980
1043
|
${c}
|
|
981
1044
|
</div>
|
|
982
1045
|
`;
|
|
983
1046
|
}
|
|
984
|
-
function
|
|
985
|
-
const
|
|
986
|
-
if (!
|
|
987
|
-
|
|
988
|
-
const n =
|
|
989
|
-
e.lightDomHeaderContent = Array.from(n), e.lightDomHeaderContent.forEach((
|
|
990
|
-
|
|
1047
|
+
function te(t, e) {
|
|
1048
|
+
const o = t.querySelector("tbw-grid-header");
|
|
1049
|
+
if (!o) return;
|
|
1050
|
+
o.style.display = "none";
|
|
1051
|
+
const n = o.querySelectorAll("tbw-grid-header-content");
|
|
1052
|
+
e.lightDomHeaderContent = Array.from(n), e.lightDomHeaderContent.forEach((s) => {
|
|
1053
|
+
s.setAttribute("slot", "header-content");
|
|
991
1054
|
});
|
|
992
|
-
const
|
|
993
|
-
e.lightDomButtons = Array.from(
|
|
994
|
-
const
|
|
995
|
-
return
|
|
996
|
-
}), e.lightDomButtons.forEach((
|
|
997
|
-
|
|
1055
|
+
const i = o.querySelectorAll("tbw-grid-tool-button");
|
|
1056
|
+
e.lightDomButtons = Array.from(i), e.lightDomButtons.sort((s, r) => {
|
|
1057
|
+
const l = parseInt(s.getAttribute("order") ?? "100", 10), a = parseInt(r.getAttribute("order") ?? "100", 10);
|
|
1058
|
+
return l - a;
|
|
1059
|
+
}), e.lightDomButtons.forEach((s) => {
|
|
1060
|
+
s.setAttribute("slot", "toolbar");
|
|
998
1061
|
});
|
|
999
1062
|
}
|
|
1000
|
-
function
|
|
1001
|
-
const
|
|
1002
|
-
|
|
1003
|
-
const
|
|
1004
|
-
if (
|
|
1063
|
+
function Ie(t, e, o, n) {
|
|
1064
|
+
const i = t.querySelector(".tbw-shell-toolbar");
|
|
1065
|
+
i && i.addEventListener("click", (r) => {
|
|
1066
|
+
const l = r.target;
|
|
1067
|
+
if (l.closest("[data-panel-toggle]")) {
|
|
1005
1068
|
n.onPanelToggle();
|
|
1006
1069
|
return;
|
|
1007
1070
|
}
|
|
1008
|
-
const d =
|
|
1071
|
+
const d = l.closest("[data-btn]");
|
|
1009
1072
|
if (d) {
|
|
1010
|
-
const
|
|
1011
|
-
|
|
1073
|
+
const h = d.getAttribute("data-btn");
|
|
1074
|
+
h && n.onToolbarButtonClick(h);
|
|
1012
1075
|
}
|
|
1013
1076
|
});
|
|
1014
|
-
const
|
|
1015
|
-
|
|
1016
|
-
const
|
|
1017
|
-
if (
|
|
1018
|
-
const
|
|
1019
|
-
|
|
1077
|
+
const s = t.querySelector(".tbw-accordion");
|
|
1078
|
+
s && s.addEventListener("click", (r) => {
|
|
1079
|
+
const a = r.target.closest(".tbw-accordion-header");
|
|
1080
|
+
if (a) {
|
|
1081
|
+
const h = a.closest("[data-section]")?.getAttribute("data-section");
|
|
1082
|
+
h && n.onSectionToggle(h);
|
|
1020
1083
|
}
|
|
1021
1084
|
});
|
|
1022
1085
|
}
|
|
1023
|
-
function
|
|
1024
|
-
const n =
|
|
1025
|
-
if (!n || !
|
|
1086
|
+
function Be(t, e, o) {
|
|
1087
|
+
const n = t.querySelector(".tbw-tool-panel"), i = t.querySelector("[data-resize-handle]"), s = t.querySelector(".tbw-shell-body");
|
|
1088
|
+
if (!n || !i || !s)
|
|
1026
1089
|
return () => {
|
|
1027
1090
|
};
|
|
1028
|
-
const r = e?.toolPanel?.position ?? "right",
|
|
1029
|
-
let
|
|
1030
|
-
const
|
|
1031
|
-
if (!
|
|
1032
|
-
|
|
1033
|
-
const w = r === "left" ?
|
|
1034
|
-
n.style.width = `${
|
|
1091
|
+
const r = e?.toolPanel?.position ?? "right", l = 200;
|
|
1092
|
+
let a = 0, d = 0, h = 0, p = !1;
|
|
1093
|
+
const b = (f) => {
|
|
1094
|
+
if (!p) return;
|
|
1095
|
+
f.preventDefault();
|
|
1096
|
+
const w = r === "left" ? f.clientX - a : a - f.clientX, v = Math.min(h, Math.max(l, d + w));
|
|
1097
|
+
n.style.width = `${v}px`;
|
|
1035
1098
|
}, c = () => {
|
|
1036
|
-
if (!
|
|
1037
|
-
|
|
1038
|
-
const
|
|
1039
|
-
|
|
1040
|
-
},
|
|
1041
|
-
|
|
1099
|
+
if (!p) return;
|
|
1100
|
+
p = !1, i.classList.remove("resizing"), n.style.transition = "", document.body.style.cursor = "", document.body.style.userSelect = "";
|
|
1101
|
+
const f = n.getBoundingClientRect().width;
|
|
1102
|
+
o(f), document.removeEventListener("mousemove", b), document.removeEventListener("mouseup", c);
|
|
1103
|
+
}, u = (f) => {
|
|
1104
|
+
f.preventDefault(), p = !0, a = f.clientX, d = n.getBoundingClientRect().width, h = s.getBoundingClientRect().width - 20, i.classList.add("resizing"), n.style.transition = "none", document.body.style.cursor = "col-resize", document.body.style.userSelect = "none", document.addEventListener("mousemove", b), document.addEventListener("mouseup", c);
|
|
1042
1105
|
};
|
|
1043
|
-
return
|
|
1044
|
-
|
|
1106
|
+
return i.addEventListener("mousedown", u), () => {
|
|
1107
|
+
i.removeEventListener("mousedown", u), document.removeEventListener("mousemove", b), document.removeEventListener("mouseup", c);
|
|
1045
1108
|
};
|
|
1046
1109
|
}
|
|
1047
|
-
function
|
|
1048
|
-
const n = [...e?.header?.toolbarButtons ?? [], ...
|
|
1049
|
-
for (const
|
|
1050
|
-
const
|
|
1051
|
-
if (!
|
|
1052
|
-
const r =
|
|
1053
|
-
if (r && (r(),
|
|
1054
|
-
|
|
1055
|
-
else if (
|
|
1056
|
-
const
|
|
1057
|
-
|
|
1110
|
+
function Ve(t, e, o) {
|
|
1111
|
+
const n = [...e?.header?.toolbarButtons ?? [], ...o.toolbarButtons.values()];
|
|
1112
|
+
for (const i of n) {
|
|
1113
|
+
const s = t.querySelector(`[data-btn-slot="${i.id}"]`);
|
|
1114
|
+
if (!s) continue;
|
|
1115
|
+
const r = o.toolbarButtonCleanups.get(i.id);
|
|
1116
|
+
if (r && (r(), o.toolbarButtonCleanups.delete(i.id)), i.element)
|
|
1117
|
+
s.appendChild(i.element);
|
|
1118
|
+
else if (i.render) {
|
|
1119
|
+
const l = i.render(s);
|
|
1120
|
+
l && o.toolbarButtonCleanups.set(i.id, l);
|
|
1058
1121
|
}
|
|
1059
1122
|
}
|
|
1060
1123
|
}
|
|
1061
|
-
function
|
|
1062
|
-
const
|
|
1063
|
-
if (!
|
|
1064
|
-
const n = [...e.headerContents.values()].sort((
|
|
1065
|
-
for (const
|
|
1066
|
-
const r = e.headerContentCleanups.get(
|
|
1067
|
-
r && (r(), e.headerContentCleanups.delete(
|
|
1068
|
-
let
|
|
1069
|
-
|
|
1070
|
-
const
|
|
1071
|
-
|
|
1124
|
+
function oe(t, e) {
|
|
1125
|
+
const o = t.querySelector(".tbw-shell-content");
|
|
1126
|
+
if (!o) return;
|
|
1127
|
+
const n = [...e.headerContents.values()].sort((s, r) => (s.order ?? 100) - (r.order ?? 100)), i = o.querySelector('slot[name="header-content"]');
|
|
1128
|
+
for (const s of n) {
|
|
1129
|
+
const r = e.headerContentCleanups.get(s.id);
|
|
1130
|
+
r && (r(), e.headerContentCleanups.delete(s.id));
|
|
1131
|
+
let l = o.querySelector(`[data-header-content="${s.id}"]`);
|
|
1132
|
+
l || (l = document.createElement("div"), l.setAttribute("data-header-content", s.id), i ? o.insertBefore(l, i) : o.appendChild(l));
|
|
1133
|
+
const a = s.render(l);
|
|
1134
|
+
a && e.headerContentCleanups.set(s.id, a);
|
|
1072
1135
|
}
|
|
1073
1136
|
}
|
|
1074
|
-
function
|
|
1137
|
+
function We(t, e, o) {
|
|
1075
1138
|
if (!e.isPanelOpen) return;
|
|
1076
|
-
const n =
|
|
1077
|
-
for (const [
|
|
1078
|
-
const
|
|
1079
|
-
if (!
|
|
1080
|
-
|
|
1081
|
-
const
|
|
1082
|
-
|
|
1083
|
-
const
|
|
1084
|
-
if (
|
|
1139
|
+
const n = I(o?.expand ?? P.expand), i = I(o?.collapse ?? P.collapse);
|
|
1140
|
+
for (const [s, r] of e.toolPanels) {
|
|
1141
|
+
const l = e.expandedSections.has(s), a = t.querySelector(`[data-section="${s}"]`), d = a?.querySelector(".tbw-accordion-content");
|
|
1142
|
+
if (!a || !d) continue;
|
|
1143
|
+
a.classList.toggle("expanded", l);
|
|
1144
|
+
const h = a.querySelector(".tbw-accordion-header");
|
|
1145
|
+
h && h.setAttribute("aria-expanded", String(l));
|
|
1146
|
+
const p = a.querySelector(".tbw-accordion-chevron");
|
|
1147
|
+
if (p && (p.innerHTML = l ? i : n), l) {
|
|
1085
1148
|
if (d.children.length === 0) {
|
|
1086
|
-
const
|
|
1087
|
-
|
|
1149
|
+
const b = r.render(d);
|
|
1150
|
+
b && e.panelCleanups.set(s, b);
|
|
1088
1151
|
}
|
|
1089
1152
|
} else {
|
|
1090
|
-
const
|
|
1091
|
-
|
|
1153
|
+
const b = e.panelCleanups.get(s);
|
|
1154
|
+
b && (b(), e.panelCleanups.delete(s)), d.innerHTML = "";
|
|
1092
1155
|
}
|
|
1093
1156
|
}
|
|
1094
1157
|
}
|
|
1095
|
-
function
|
|
1096
|
-
const
|
|
1097
|
-
|
|
1158
|
+
function ne(t, e) {
|
|
1159
|
+
const o = t.querySelector("[data-panel-toggle]");
|
|
1160
|
+
o && (o.classList.toggle("active", e.isPanelOpen), o.setAttribute("aria-pressed", String(e.isPanelOpen)));
|
|
1098
1161
|
}
|
|
1099
|
-
function ie(
|
|
1100
|
-
const
|
|
1101
|
-
|
|
1162
|
+
function ie(t, e) {
|
|
1163
|
+
const o = t.querySelector(".tbw-tool-panel");
|
|
1164
|
+
o && (o.classList.toggle("open", e.isPanelOpen), e.isPanelOpen || (o.style.width = ""));
|
|
1102
1165
|
}
|
|
1103
|
-
function
|
|
1104
|
-
const
|
|
1105
|
-
for (const n of
|
|
1106
|
-
|
|
1166
|
+
function Ge(t, e) {
|
|
1167
|
+
const o = [];
|
|
1168
|
+
for (const n of t?.header?.toolbarButtons ?? [])
|
|
1169
|
+
o.push({
|
|
1107
1170
|
id: n.id,
|
|
1108
1171
|
label: n.label,
|
|
1109
1172
|
disabled: n.disabled ?? !1,
|
|
1110
1173
|
source: "config"
|
|
1111
1174
|
});
|
|
1112
1175
|
for (const n of e.toolbarButtons.values())
|
|
1113
|
-
|
|
1176
|
+
o.push({
|
|
1114
1177
|
id: n.id,
|
|
1115
1178
|
label: n.label,
|
|
1116
1179
|
disabled: n.disabled ?? !1,
|
|
1117
1180
|
source: "config"
|
|
1118
1181
|
});
|
|
1119
1182
|
for (let n = 0; n < e.lightDomButtons.length; n++) {
|
|
1120
|
-
const
|
|
1121
|
-
|
|
1183
|
+
const s = e.lightDomButtons[n].querySelector("button");
|
|
1184
|
+
o.push({
|
|
1122
1185
|
id: `light-dom-${n}`,
|
|
1123
|
-
label:
|
|
1124
|
-
disabled:
|
|
1186
|
+
label: s?.getAttribute("title") ?? s?.getAttribute("aria-label") ?? "",
|
|
1187
|
+
disabled: s?.disabled ?? !1,
|
|
1125
1188
|
source: "light-dom"
|
|
1126
1189
|
});
|
|
1127
1190
|
}
|
|
1128
1191
|
for (const n of e.toolPanels.values())
|
|
1129
|
-
|
|
1192
|
+
o.push({
|
|
1130
1193
|
id: `panel-toggle-${n.id}`,
|
|
1131
1194
|
label: n.tooltip ?? n.title,
|
|
1132
1195
|
disabled: !1,
|
|
1133
1196
|
source: "panel-toggle",
|
|
1134
1197
|
panelId: n.id
|
|
1135
1198
|
});
|
|
1136
|
-
return
|
|
1199
|
+
return o;
|
|
1137
1200
|
}
|
|
1138
|
-
function
|
|
1139
|
-
for (const e of
|
|
1201
|
+
function Fe(t) {
|
|
1202
|
+
for (const e of t.headerContentCleanups.values())
|
|
1140
1203
|
e();
|
|
1141
|
-
|
|
1142
|
-
for (const e of
|
|
1204
|
+
t.headerContentCleanups.clear(), t.activePanelCleanup && (t.activePanelCleanup(), t.activePanelCleanup = null);
|
|
1205
|
+
for (const e of t.toolbarButtonCleanups.values())
|
|
1143
1206
|
e();
|
|
1144
|
-
|
|
1207
|
+
t.toolbarButtonCleanups.clear(), t.activePanel && t.toolPanels.get(t.activePanel)?.onClose?.(), t.toolPanels.clear(), t.headerContents.clear(), t.toolbarButtons.clear(), t.lightDomButtons = [], t.lightDomHeaderContent = [], t.activePanel = null;
|
|
1145
1208
|
}
|
|
1146
|
-
class
|
|
1209
|
+
class Ue {
|
|
1147
1210
|
constructor(e) {
|
|
1148
1211
|
this.grid = e;
|
|
1149
1212
|
}
|
|
@@ -1161,22 +1224,22 @@ class tt {
|
|
|
1161
1224
|
* Attach all plugins from the config.
|
|
1162
1225
|
*/
|
|
1163
1226
|
attachAll(e) {
|
|
1164
|
-
for (const
|
|
1165
|
-
this.attach(
|
|
1227
|
+
for (const o of e)
|
|
1228
|
+
this.attach(o);
|
|
1166
1229
|
}
|
|
1167
1230
|
/**
|
|
1168
1231
|
* Attach a plugin to this grid.
|
|
1169
1232
|
*/
|
|
1170
1233
|
attach(e) {
|
|
1171
1234
|
if (this.pluginMap.set(e.constructor, e), this.plugins.push(e), e.cellRenderers)
|
|
1172
|
-
for (const [
|
|
1173
|
-
this.cellRenderers.set(
|
|
1235
|
+
for (const [o, n] of Object.entries(e.cellRenderers))
|
|
1236
|
+
this.cellRenderers.set(o, n);
|
|
1174
1237
|
if (e.headerRenderers)
|
|
1175
|
-
for (const [
|
|
1176
|
-
this.headerRenderers.set(
|
|
1238
|
+
for (const [o, n] of Object.entries(e.headerRenderers))
|
|
1239
|
+
this.headerRenderers.set(o, n);
|
|
1177
1240
|
if (e.cellEditors)
|
|
1178
|
-
for (const [
|
|
1179
|
-
this.cellEditors.set(
|
|
1241
|
+
for (const [o, n] of Object.entries(e.cellEditors))
|
|
1242
|
+
this.cellEditors.set(o, n);
|
|
1180
1243
|
e.attach(this.grid);
|
|
1181
1244
|
}
|
|
1182
1245
|
/**
|
|
@@ -1197,7 +1260,7 @@ class tt {
|
|
|
1197
1260
|
* Get a plugin instance by its name.
|
|
1198
1261
|
*/
|
|
1199
1262
|
getPluginByName(e) {
|
|
1200
|
-
return this.plugins.find((
|
|
1263
|
+
return this.plugins.find((o) => o.name === e);
|
|
1201
1264
|
}
|
|
1202
1265
|
/**
|
|
1203
1266
|
* Check if a plugin is attached.
|
|
@@ -1241,19 +1304,19 @@ class tt {
|
|
|
1241
1304
|
* Execute processRows hook on all plugins.
|
|
1242
1305
|
*/
|
|
1243
1306
|
processRows(e) {
|
|
1244
|
-
let
|
|
1307
|
+
let o = [...e];
|
|
1245
1308
|
for (const n of this.plugins)
|
|
1246
|
-
n.processRows && (
|
|
1247
|
-
return
|
|
1309
|
+
n.processRows && (o = n.processRows(o));
|
|
1310
|
+
return o;
|
|
1248
1311
|
}
|
|
1249
1312
|
/**
|
|
1250
1313
|
* Execute processColumns hook on all plugins.
|
|
1251
1314
|
*/
|
|
1252
1315
|
processColumns(e) {
|
|
1253
|
-
let
|
|
1316
|
+
let o = [...e];
|
|
1254
1317
|
for (const n of this.plugins)
|
|
1255
|
-
n.processColumns && (
|
|
1256
|
-
return
|
|
1318
|
+
n.processColumns && (o = n.processColumns(o));
|
|
1319
|
+
return o;
|
|
1257
1320
|
}
|
|
1258
1321
|
/**
|
|
1259
1322
|
* Execute beforeRender hook on all plugins.
|
|
@@ -1283,8 +1346,8 @@ class tt {
|
|
|
1283
1346
|
*/
|
|
1284
1347
|
getExtraHeight() {
|
|
1285
1348
|
let e = 0;
|
|
1286
|
-
for (const
|
|
1287
|
-
typeof
|
|
1349
|
+
for (const o of this.plugins)
|
|
1350
|
+
typeof o.getExtraHeight == "function" && (e += o.getExtraHeight());
|
|
1288
1351
|
return e;
|
|
1289
1352
|
}
|
|
1290
1353
|
/**
|
|
@@ -1292,31 +1355,31 @@ class tt {
|
|
|
1292
1355
|
* Used by virtualization to correctly position the scroll window.
|
|
1293
1356
|
*/
|
|
1294
1357
|
getExtraHeightBefore(e) {
|
|
1295
|
-
let
|
|
1358
|
+
let o = 0;
|
|
1296
1359
|
for (const n of this.plugins)
|
|
1297
|
-
typeof n.getExtraHeightBefore == "function" && (
|
|
1298
|
-
return
|
|
1360
|
+
typeof n.getExtraHeightBefore == "function" && (o += n.getExtraHeightBefore(e));
|
|
1361
|
+
return o;
|
|
1299
1362
|
}
|
|
1300
1363
|
/**
|
|
1301
1364
|
* Adjust the virtualization start index based on plugin needs.
|
|
1302
1365
|
* Returns the minimum start index from all plugins.
|
|
1303
1366
|
*/
|
|
1304
|
-
adjustVirtualStart(e,
|
|
1305
|
-
let
|
|
1306
|
-
for (const
|
|
1307
|
-
if (typeof
|
|
1308
|
-
const r =
|
|
1309
|
-
r <
|
|
1367
|
+
adjustVirtualStart(e, o, n) {
|
|
1368
|
+
let i = e;
|
|
1369
|
+
for (const s of this.plugins)
|
|
1370
|
+
if (typeof s.adjustVirtualStart == "function") {
|
|
1371
|
+
const r = s.adjustVirtualStart(e, o, n);
|
|
1372
|
+
r < i && (i = r);
|
|
1310
1373
|
}
|
|
1311
|
-
return
|
|
1374
|
+
return i;
|
|
1312
1375
|
}
|
|
1313
1376
|
/**
|
|
1314
1377
|
* Execute renderRow hook on all plugins.
|
|
1315
1378
|
* Returns true if any plugin handled the row.
|
|
1316
1379
|
*/
|
|
1317
|
-
renderRow(e,
|
|
1318
|
-
for (const
|
|
1319
|
-
if (
|
|
1380
|
+
renderRow(e, o, n) {
|
|
1381
|
+
for (const i of this.plugins)
|
|
1382
|
+
if (i.renderRow?.(e, o, n))
|
|
1320
1383
|
return !0;
|
|
1321
1384
|
return !1;
|
|
1322
1385
|
}
|
|
@@ -1325,8 +1388,8 @@ class tt {
|
|
|
1325
1388
|
* Returns true if any plugin handled the event.
|
|
1326
1389
|
*/
|
|
1327
1390
|
onKeyDown(e) {
|
|
1328
|
-
for (const
|
|
1329
|
-
if (
|
|
1391
|
+
for (const o of this.plugins)
|
|
1392
|
+
if (o.onKeyDown?.(e))
|
|
1330
1393
|
return !0;
|
|
1331
1394
|
return !1;
|
|
1332
1395
|
}
|
|
@@ -1335,8 +1398,8 @@ class tt {
|
|
|
1335
1398
|
* Returns true if any plugin handled the event.
|
|
1336
1399
|
*/
|
|
1337
1400
|
onCellClick(e) {
|
|
1338
|
-
for (const
|
|
1339
|
-
if (
|
|
1401
|
+
for (const o of this.plugins)
|
|
1402
|
+
if (o.onCellClick?.(e))
|
|
1340
1403
|
return !0;
|
|
1341
1404
|
return !1;
|
|
1342
1405
|
}
|
|
@@ -1345,8 +1408,8 @@ class tt {
|
|
|
1345
1408
|
* Returns true if any plugin handled the event.
|
|
1346
1409
|
*/
|
|
1347
1410
|
onRowClick(e) {
|
|
1348
|
-
for (const
|
|
1349
|
-
if (
|
|
1411
|
+
for (const o of this.plugins)
|
|
1412
|
+
if (o.onRowClick?.(e))
|
|
1350
1413
|
return !0;
|
|
1351
1414
|
return !1;
|
|
1352
1415
|
}
|
|
@@ -1355,8 +1418,8 @@ class tt {
|
|
|
1355
1418
|
* Returns true if any plugin handled the event.
|
|
1356
1419
|
*/
|
|
1357
1420
|
onHeaderClick(e) {
|
|
1358
|
-
for (const
|
|
1359
|
-
if (
|
|
1421
|
+
for (const o of this.plugins)
|
|
1422
|
+
if (o.onHeaderClick?.(e))
|
|
1360
1423
|
return !0;
|
|
1361
1424
|
return !1;
|
|
1362
1425
|
}
|
|
@@ -1364,16 +1427,16 @@ class tt {
|
|
|
1364
1427
|
* Execute onScroll hook on all plugins.
|
|
1365
1428
|
*/
|
|
1366
1429
|
onScroll(e) {
|
|
1367
|
-
for (const
|
|
1368
|
-
|
|
1430
|
+
for (const o of this.plugins)
|
|
1431
|
+
o.onScroll?.(e);
|
|
1369
1432
|
}
|
|
1370
1433
|
/**
|
|
1371
1434
|
* Execute onCellMouseDown hook on all plugins.
|
|
1372
1435
|
* Returns true if any plugin handled the event.
|
|
1373
1436
|
*/
|
|
1374
1437
|
onCellMouseDown(e) {
|
|
1375
|
-
for (const
|
|
1376
|
-
if (
|
|
1438
|
+
for (const o of this.plugins)
|
|
1439
|
+
if (o.onCellMouseDown?.(e))
|
|
1377
1440
|
return !0;
|
|
1378
1441
|
return !1;
|
|
1379
1442
|
}
|
|
@@ -1382,8 +1445,8 @@ class tt {
|
|
|
1382
1445
|
* Returns true if any plugin handled the event.
|
|
1383
1446
|
*/
|
|
1384
1447
|
onCellMouseMove(e) {
|
|
1385
|
-
for (const
|
|
1386
|
-
if (
|
|
1448
|
+
for (const o of this.plugins)
|
|
1449
|
+
if (o.onCellMouseMove?.(e))
|
|
1387
1450
|
return !0;
|
|
1388
1451
|
return !1;
|
|
1389
1452
|
}
|
|
@@ -1392,8 +1455,8 @@ class tt {
|
|
|
1392
1455
|
* Returns true if any plugin handled the event.
|
|
1393
1456
|
*/
|
|
1394
1457
|
onCellMouseUp(e) {
|
|
1395
|
-
for (const
|
|
1396
|
-
if (
|
|
1458
|
+
for (const o of this.plugins)
|
|
1459
|
+
if (o.onCellMouseUp?.(e))
|
|
1397
1460
|
return !0;
|
|
1398
1461
|
return !1;
|
|
1399
1462
|
}
|
|
@@ -1401,12 +1464,12 @@ class tt {
|
|
|
1401
1464
|
* Collect context menu items from all plugins.
|
|
1402
1465
|
*/
|
|
1403
1466
|
getContextMenuItems(e) {
|
|
1404
|
-
const
|
|
1467
|
+
const o = [];
|
|
1405
1468
|
for (const n of this.plugins) {
|
|
1406
|
-
const
|
|
1407
|
-
|
|
1469
|
+
const i = n.getContextMenuItems?.(e);
|
|
1470
|
+
i && o.push(...i);
|
|
1408
1471
|
}
|
|
1409
|
-
return
|
|
1472
|
+
return o;
|
|
1410
1473
|
}
|
|
1411
1474
|
// ===== Shell Integration Hooks =====
|
|
1412
1475
|
/**
|
|
@@ -1415,11 +1478,11 @@ class tt {
|
|
|
1415
1478
|
*/
|
|
1416
1479
|
getToolPanels() {
|
|
1417
1480
|
const e = [];
|
|
1418
|
-
for (const
|
|
1419
|
-
const n =
|
|
1420
|
-
n && e.push({ plugin:
|
|
1481
|
+
for (const o of this.plugins) {
|
|
1482
|
+
const n = o.getToolPanel?.();
|
|
1483
|
+
n && e.push({ plugin: o, panel: n });
|
|
1421
1484
|
}
|
|
1422
|
-
return e.sort((
|
|
1485
|
+
return e.sort((o, n) => (o.panel.order ?? 0) - (n.panel.order ?? 0));
|
|
1423
1486
|
}
|
|
1424
1487
|
/**
|
|
1425
1488
|
* Collect header contents from all plugins.
|
|
@@ -1427,63 +1490,63 @@ class tt {
|
|
|
1427
1490
|
*/
|
|
1428
1491
|
getHeaderContents() {
|
|
1429
1492
|
const e = [];
|
|
1430
|
-
for (const
|
|
1431
|
-
const n =
|
|
1432
|
-
n && e.push({ plugin:
|
|
1493
|
+
for (const o of this.plugins) {
|
|
1494
|
+
const n = o.getHeaderContent?.();
|
|
1495
|
+
n && e.push({ plugin: o, content: n });
|
|
1433
1496
|
}
|
|
1434
|
-
return e.sort((
|
|
1497
|
+
return e.sort((o, n) => (o.content.order ?? 0) - (n.content.order ?? 0));
|
|
1435
1498
|
}
|
|
1436
1499
|
}
|
|
1437
|
-
class
|
|
1500
|
+
class G extends HTMLElement {
|
|
1438
1501
|
// TODO: Rename to 'data-grid' when migration is complete
|
|
1439
1502
|
static tagName = "tbw-grid";
|
|
1440
1503
|
#n;
|
|
1441
|
-
#
|
|
1504
|
+
#k = !1;
|
|
1442
1505
|
// ---------------- Ready Promise ----------------
|
|
1443
|
-
#I;
|
|
1444
1506
|
#$;
|
|
1507
|
+
#I;
|
|
1445
1508
|
// ================== INPUT PROPERTIES ==================
|
|
1446
1509
|
// These backing fields store raw user input. They are merged into
|
|
1447
1510
|
// #effectiveConfig by #mergeEffectiveConfig(). Never read directly
|
|
1448
1511
|
// for rendering logic - always use effectiveConfig or derived state.
|
|
1449
|
-
#
|
|
1450
|
-
#
|
|
1451
|
-
#
|
|
1512
|
+
#s = [];
|
|
1513
|
+
#r;
|
|
1514
|
+
#p;
|
|
1515
|
+
#m;
|
|
1452
1516
|
#v;
|
|
1453
|
-
#y;
|
|
1454
1517
|
// ================== SINGLE SOURCE OF TRUTH ==================
|
|
1455
1518
|
// All input sources converge here. This is the canonical config
|
|
1456
1519
|
// that all rendering and logic should read from.
|
|
1457
1520
|
#o = {};
|
|
1458
|
-
#
|
|
1459
|
-
#
|
|
1460
|
-
#
|
|
1461
|
-
#
|
|
1521
|
+
#h = !1;
|
|
1522
|
+
#f = 0;
|
|
1523
|
+
#E = null;
|
|
1524
|
+
#C = !1;
|
|
1462
1525
|
// Cached flag for plugin scroll handlers
|
|
1463
1526
|
#P;
|
|
1464
1527
|
// Cached hook to avoid closures
|
|
1465
|
-
#
|
|
1528
|
+
#y = !1;
|
|
1466
1529
|
#_ = null;
|
|
1467
|
-
#
|
|
1530
|
+
#R = null;
|
|
1468
1531
|
#S = null;
|
|
1469
|
-
#
|
|
1470
|
-
#
|
|
1471
|
-
#
|
|
1532
|
+
#x = null;
|
|
1533
|
+
#l;
|
|
1534
|
+
#b;
|
|
1472
1535
|
// ---------------- Plugin System ----------------
|
|
1473
1536
|
#t;
|
|
1474
1537
|
// ---------------- Column State ----------------
|
|
1475
|
-
#
|
|
1476
|
-
#
|
|
1538
|
+
#O;
|
|
1539
|
+
#d;
|
|
1477
1540
|
// ---------------- Shell State ----------------
|
|
1478
|
-
#e =
|
|
1479
|
-
#
|
|
1480
|
-
#
|
|
1541
|
+
#e = De();
|
|
1542
|
+
#a = !1;
|
|
1543
|
+
#A;
|
|
1481
1544
|
// ================== DERIVED STATE ==================
|
|
1482
1545
|
// _rows: result of applying plugin processRows hooks
|
|
1483
1546
|
_rows = [];
|
|
1484
1547
|
// _baseColumns: columns before plugin transformation (analogous to #rows for row processing)
|
|
1485
1548
|
// This is the source of truth for processColumns - plugins transform these
|
|
1486
|
-
#
|
|
1549
|
+
#H = [];
|
|
1487
1550
|
// _columns is a getter/setter that operates on effectiveConfig.columns
|
|
1488
1551
|
// This ensures effectiveConfig.columns is the single source of truth for columns
|
|
1489
1552
|
// _columns always contains ALL columns (including hidden)
|
|
@@ -1540,43 +1603,43 @@ class $ extends HTMLElement {
|
|
|
1540
1603
|
return this._rows;
|
|
1541
1604
|
}
|
|
1542
1605
|
set rows(e) {
|
|
1543
|
-
const
|
|
1544
|
-
this.#
|
|
1606
|
+
const o = this.#s;
|
|
1607
|
+
this.#s = e, o !== e && this.#ee();
|
|
1545
1608
|
}
|
|
1546
1609
|
/**
|
|
1547
1610
|
* Get the original unfiltered/unprocessed rows.
|
|
1548
1611
|
* Use this when you need access to all source data regardless of active filters.
|
|
1549
1612
|
*/
|
|
1550
1613
|
get sourceRows() {
|
|
1551
|
-
return this.#
|
|
1614
|
+
return this.#s;
|
|
1552
1615
|
}
|
|
1553
1616
|
get columns() {
|
|
1554
1617
|
return [...this._columns];
|
|
1555
1618
|
}
|
|
1556
1619
|
set columns(e) {
|
|
1557
|
-
const
|
|
1558
|
-
this.#
|
|
1620
|
+
const o = this.#r;
|
|
1621
|
+
this.#r = e, o !== e && this.#te();
|
|
1559
1622
|
}
|
|
1560
1623
|
get gridConfig() {
|
|
1561
1624
|
return this.#o;
|
|
1562
1625
|
}
|
|
1563
1626
|
set gridConfig(e) {
|
|
1564
|
-
const
|
|
1565
|
-
this.#
|
|
1627
|
+
const o = this.#p;
|
|
1628
|
+
this.#p = e, o !== e && this.#oe();
|
|
1566
1629
|
}
|
|
1567
1630
|
get fitMode() {
|
|
1568
1631
|
return this.#o.fitMode ?? "stretch";
|
|
1569
1632
|
}
|
|
1570
1633
|
set fitMode(e) {
|
|
1571
|
-
const
|
|
1572
|
-
this.#
|
|
1634
|
+
const o = this.#m;
|
|
1635
|
+
this.#m = e, o !== e && this.#J();
|
|
1573
1636
|
}
|
|
1574
1637
|
get editOn() {
|
|
1575
1638
|
return this.#o.editOn;
|
|
1576
1639
|
}
|
|
1577
1640
|
set editOn(e) {
|
|
1578
|
-
const
|
|
1579
|
-
this.#
|
|
1641
|
+
const o = this.#v;
|
|
1642
|
+
this.#v = e, o !== e && this.#Q();
|
|
1580
1643
|
}
|
|
1581
1644
|
// Effective config accessor for internal modules and plugins
|
|
1582
1645
|
// Returns the merged config (single source of truth) before plugin processing
|
|
@@ -1592,14 +1655,14 @@ class $ extends HTMLElement {
|
|
|
1592
1655
|
* element.addEventListener('click', handler, { signal: this.grid.disconnectSignal });
|
|
1593
1656
|
*/
|
|
1594
1657
|
get disconnectSignal() {
|
|
1595
|
-
return this.#
|
|
1658
|
+
return this.#l || (this.#l = new AbortController()), this.#l.signal;
|
|
1596
1659
|
}
|
|
1597
1660
|
constructor() {
|
|
1598
|
-
super(), this.#n = this.attachShadow({ mode: "open" }), this.#
|
|
1661
|
+
super(), this.#n = this.attachShadow({ mode: "open" }), this.#j(), this.#$ = new Promise((e) => this.#I = e);
|
|
1599
1662
|
}
|
|
1600
|
-
#
|
|
1663
|
+
#j() {
|
|
1601
1664
|
const e = new CSSStyleSheet();
|
|
1602
|
-
e.replaceSync(
|
|
1665
|
+
e.replaceSync(de), this.#n.adoptedStyleSheets = [e];
|
|
1603
1666
|
}
|
|
1604
1667
|
// ---------------- Plugin System ----------------
|
|
1605
1668
|
/**
|
|
@@ -1622,7 +1685,7 @@ class $ extends HTMLElement {
|
|
|
1622
1685
|
* Note: This does NOT reset plugin state - just re-processes rows/columns and renders.
|
|
1623
1686
|
*/
|
|
1624
1687
|
requestRender() {
|
|
1625
|
-
this.#
|
|
1688
|
+
this.#L(), this.#M(), this.#T(), this.updateTemplate(), this.refreshVirtualWindow(!0);
|
|
1626
1689
|
}
|
|
1627
1690
|
/**
|
|
1628
1691
|
* Request a lightweight style update without rebuilding DOM.
|
|
@@ -1630,39 +1693,39 @@ class $ extends HTMLElement {
|
|
|
1630
1693
|
* This runs all plugin afterRender hooks without rebuilding row/column DOM.
|
|
1631
1694
|
*/
|
|
1632
1695
|
requestAfterRender() {
|
|
1633
|
-
this.#
|
|
1696
|
+
this.#w();
|
|
1634
1697
|
}
|
|
1635
1698
|
/**
|
|
1636
1699
|
* Initialize plugin system with instances from config.
|
|
1637
1700
|
* Plugins are class instances passed in gridConfig.plugins[].
|
|
1638
1701
|
*/
|
|
1639
1702
|
#B() {
|
|
1640
|
-
this.#t = new
|
|
1641
|
-
const e = this.#o?.plugins,
|
|
1642
|
-
this.#t.attachAll(
|
|
1703
|
+
this.#t = new Ue(this);
|
|
1704
|
+
const e = this.#o?.plugins, o = Array.isArray(e) ? e : [];
|
|
1705
|
+
this.#t.attachAll(o);
|
|
1643
1706
|
}
|
|
1644
1707
|
/**
|
|
1645
1708
|
* Inject all plugin styles into the shadow DOM.
|
|
1646
1709
|
* Must be called after #render() since innerHTML wipes existing content.
|
|
1647
1710
|
*/
|
|
1648
|
-
#
|
|
1711
|
+
#V() {
|
|
1649
1712
|
const e = this.#t?.getAllStyles() ?? "";
|
|
1650
1713
|
if (e) {
|
|
1651
|
-
const
|
|
1652
|
-
|
|
1714
|
+
const o = document.createElement("style");
|
|
1715
|
+
o.setAttribute("data-plugin", "all"), o.textContent = e, this.#n.appendChild(o);
|
|
1653
1716
|
}
|
|
1654
1717
|
}
|
|
1655
1718
|
/**
|
|
1656
1719
|
* Update plugins when grid config changes.
|
|
1657
1720
|
* With class-based plugins, we need to detach old and attach new.
|
|
1658
1721
|
*/
|
|
1659
|
-
#
|
|
1660
|
-
this.#t && this.#t.detachAll(), this.#B(), this.#
|
|
1722
|
+
#W() {
|
|
1723
|
+
this.#t && this.#t.detachAll(), this.#B(), this.#V(), this.#C = this.#t?.getAll().some((e) => e.onScroll) ?? !1;
|
|
1661
1724
|
}
|
|
1662
1725
|
/**
|
|
1663
1726
|
* Clean up plugin states when grid disconnects.
|
|
1664
1727
|
*/
|
|
1665
|
-
#
|
|
1728
|
+
#K() {
|
|
1666
1729
|
this.#t?.detachAll();
|
|
1667
1730
|
}
|
|
1668
1731
|
/**
|
|
@@ -1674,27 +1737,27 @@ class $ extends HTMLElement {
|
|
|
1674
1737
|
const e = this.#t.getToolPanels();
|
|
1675
1738
|
for (const { panel: n } of e)
|
|
1676
1739
|
this.#e.toolPanels.has(n.id) || this.#e.toolPanels.set(n.id, n);
|
|
1677
|
-
const
|
|
1678
|
-
for (const { content: n } of
|
|
1740
|
+
const o = this.#t.getHeaderContents();
|
|
1741
|
+
for (const { content: n } of o)
|
|
1679
1742
|
this.#e.headerContents.has(n.id) || this.#e.headerContents.set(n.id, n);
|
|
1680
1743
|
}
|
|
1681
1744
|
// ---------------- Lifecycle ----------------
|
|
1682
1745
|
connectedCallback() {
|
|
1683
|
-
this.hasAttribute("tabindex") || (this.tabIndex = 0), this._rows = Array.isArray(this.#
|
|
1746
|
+
this.hasAttribute("tabindex") || (this.tabIndex = 0), this._rows = Array.isArray(this.#s) ? [...this.#s] : [], this.#l?.abort(), this.#l = new AbortController(), this.#u(), this.#B(), this.#Y(), this.#k || (this.#X(), this.#V(), this.#k = !0), this.#G();
|
|
1684
1747
|
}
|
|
1685
1748
|
disconnectedCallback() {
|
|
1686
|
-
this.#
|
|
1749
|
+
this.#K(), Fe(this.#e), this.#a = !1, this.#A?.(), this.#A = void 0, this.#l && (this.#l.abort(), this.#l = void 0), this.resizeController && this.resizeController.dispose(), this.#b && (this.#b.disconnect(), this.#b = void 0), this.#h = !1;
|
|
1687
1750
|
}
|
|
1688
|
-
#
|
|
1689
|
-
const
|
|
1690
|
-
if (this.headerRowEl =
|
|
1691
|
-
|
|
1751
|
+
#G() {
|
|
1752
|
+
const o = this.#n.querySelector(".tbw-grid-content") ?? this.#n.querySelector(".tbw-grid-root");
|
|
1753
|
+
if (this.headerRowEl = o?.querySelector(".header-row"), this.virtualization.totalHeightEl = o?.querySelector(".faux-vscroll-spacer"), this.virtualization.viewportEl = o?.querySelector(".rows-viewport"), this.bodyEl = o?.querySelector(".rows"), this.#a) {
|
|
1754
|
+
oe(this.#n, this.#e), Ve(this.#n, this.#o?.shell, this.#e);
|
|
1692
1755
|
const r = this.#o?.shell?.toolPanel?.defaultOpen;
|
|
1693
1756
|
r && this.#e.toolPanels.has(r) && (this.openToolPanel(), this.#e.expandedSections.add(r));
|
|
1694
1757
|
}
|
|
1695
|
-
this.setAttribute("data-upgraded", ""), this
|
|
1758
|
+
this.setAttribute("data-upgraded", ""), this.#h = !0;
|
|
1696
1759
|
const n = this.disconnectSignal;
|
|
1697
|
-
this.#
|
|
1760
|
+
this.#c(), this.addEventListener("keydown", (r) => ke(this, r), { signal: n }), document.addEventListener(
|
|
1698
1761
|
"keydown",
|
|
1699
1762
|
(r) => {
|
|
1700
1763
|
r.key === "Escape" && this.activeEditRows !== -1 && this.#D(this.activeEditRows, !0);
|
|
@@ -1704,154 +1767,154 @@ class $ extends HTMLElement {
|
|
|
1704
1767
|
"mousedown",
|
|
1705
1768
|
(r) => {
|
|
1706
1769
|
if (this.activeEditRows === -1) return;
|
|
1707
|
-
const
|
|
1708
|
-
!
|
|
1770
|
+
const l = this.findRenderedRowElement(this.activeEditRows);
|
|
1771
|
+
!l || (r.composedPath && r.composedPath() || []).includes(l) || this.#D(this.activeEditRows, !1);
|
|
1709
1772
|
},
|
|
1710
1773
|
{ signal: n }
|
|
1711
1774
|
);
|
|
1712
|
-
const
|
|
1713
|
-
if (this.virtualization.container =
|
|
1714
|
-
|
|
1775
|
+
const i = o?.querySelector(".faux-vscroll"), s = o?.querySelector(".rows");
|
|
1776
|
+
if (this.virtualization.container = i ?? this, this.#C = this.#t?.getAll().some((r) => r.onScroll) ?? !1, i && s) {
|
|
1777
|
+
i.addEventListener(
|
|
1715
1778
|
"scroll",
|
|
1716
1779
|
() => {
|
|
1717
|
-
if (!this.virtualization.enabled && !this.#
|
|
1718
|
-
const
|
|
1719
|
-
|
|
1720
|
-
this.#
|
|
1780
|
+
if (!this.virtualization.enabled && !this.#C) return;
|
|
1781
|
+
const a = i.scrollTop, d = this.virtualization.rowHeight, h = Math.floor(a / d), p = h - h % 2, b = -(a - p * d);
|
|
1782
|
+
s.style.transform = `translateY(${b}px)`, this.#E = a, this.#f || (this.#f = requestAnimationFrame(() => {
|
|
1783
|
+
this.#f = 0, this.#E !== null && (this.#re(this.#E), this.#E = null);
|
|
1721
1784
|
}));
|
|
1722
1785
|
},
|
|
1723
1786
|
{ passive: !0, signal: n }
|
|
1724
1787
|
);
|
|
1725
|
-
const r = this.#n.querySelector(".tbw-grid-content"),
|
|
1788
|
+
const r = this.#n.querySelector(".tbw-grid-content"), l = this.#n.querySelector(".tbw-scroll-area");
|
|
1726
1789
|
r && (r.addEventListener(
|
|
1727
1790
|
"wheel",
|
|
1728
|
-
(
|
|
1729
|
-
|
|
1791
|
+
(a) => {
|
|
1792
|
+
a.preventDefault(), a.shiftKey || Math.abs(a.deltaX) > Math.abs(a.deltaY) ? l && (l.scrollLeft += a.shiftKey ? a.deltaY : a.deltaX) : i.scrollTop += a.deltaY;
|
|
1730
1793
|
},
|
|
1731
1794
|
{ passive: !1, signal: n }
|
|
1732
1795
|
), r.addEventListener(
|
|
1733
1796
|
"touchstart",
|
|
1734
|
-
(
|
|
1735
|
-
|
|
1797
|
+
(a) => {
|
|
1798
|
+
a.touches.length === 1 && (this.#_ = a.touches[0].clientY, this.#R = a.touches[0].clientX, this.#S = i.scrollTop, this.#x = l?.scrollLeft ?? 0);
|
|
1736
1799
|
},
|
|
1737
1800
|
{ passive: !0, signal: n }
|
|
1738
1801
|
), r.addEventListener(
|
|
1739
1802
|
"touchmove",
|
|
1740
|
-
(
|
|
1741
|
-
if (
|
|
1742
|
-
const d = this.#_ -
|
|
1743
|
-
|
|
1803
|
+
(a) => {
|
|
1804
|
+
if (a.touches.length === 1 && this.#_ !== null && this.#R !== null && this.#S !== null && this.#x !== null) {
|
|
1805
|
+
const d = this.#_ - a.touches[0].clientY, h = this.#R - a.touches[0].clientX;
|
|
1806
|
+
i.scrollTop = this.#S + d, l && (l.scrollLeft = this.#x + h), a.preventDefault();
|
|
1744
1807
|
}
|
|
1745
1808
|
},
|
|
1746
1809
|
{ passive: !1, signal: n }
|
|
1747
1810
|
), r.addEventListener(
|
|
1748
1811
|
"touchend",
|
|
1749
1812
|
() => {
|
|
1750
|
-
this.#_ = null, this.#
|
|
1813
|
+
this.#_ = null, this.#R = null, this.#S = null, this.#x = null;
|
|
1751
1814
|
},
|
|
1752
1815
|
{ passive: !0, signal: n }
|
|
1753
1816
|
));
|
|
1754
1817
|
}
|
|
1755
|
-
this.resizeController =
|
|
1818
|
+
this.resizeController = ze(this), this.#n.addEventListener("mousedown", (r) => this.#le(r), { signal: n }), document.addEventListener("mousemove", (r) => this.#ae(r), { signal: n }), document.addEventListener("mouseup", (r) => this.#ce(r), { signal: n }), this.virtualization.enabled && requestAnimationFrame(() => this.refreshVirtualWindow(!0)), requestAnimationFrame(() => {
|
|
1756
1819
|
const r = this.bodyEl.querySelector(".data-grid-row");
|
|
1757
1820
|
if (r) {
|
|
1758
|
-
const
|
|
1759
|
-
|
|
1821
|
+
const l = r.getBoundingClientRect().height;
|
|
1822
|
+
l && Math.abs(l - this.virtualization.rowHeight) > 0.1 && (this.virtualization.rowHeight = l, this.refreshVirtualWindow(!0));
|
|
1760
1823
|
}
|
|
1761
|
-
}), this.virtualization.viewportEl && (this.#
|
|
1762
|
-
this.#
|
|
1763
|
-
this.#
|
|
1824
|
+
}), this.virtualization.viewportEl && (this.#b = new ResizeObserver(() => {
|
|
1825
|
+
this.#f || (this.#f = requestAnimationFrame(() => {
|
|
1826
|
+
this.#f = 0, this.refreshVirtualWindow(!0);
|
|
1764
1827
|
}));
|
|
1765
|
-
}), this.#
|
|
1828
|
+
}), this.#b.observe(this.virtualization.viewportEl)), queueMicrotask(() => this.#Z()), requestAnimationFrame(() => requestAnimationFrame(() => this.#I?.()));
|
|
1766
1829
|
}
|
|
1767
1830
|
// ---------------- Event Emitters ----------------
|
|
1768
|
-
#
|
|
1769
|
-
this.dispatchEvent(new CustomEvent(e, { detail:
|
|
1831
|
+
#i(e, o) {
|
|
1832
|
+
this.dispatchEvent(new CustomEvent(e, { detail: o, bubbles: !0, composed: !0 }));
|
|
1770
1833
|
}
|
|
1771
1834
|
emitCellCommit(e) {
|
|
1772
|
-
this.#
|
|
1835
|
+
this.#i("cell-commit", e);
|
|
1773
1836
|
}
|
|
1774
1837
|
emitRowCommit(e) {
|
|
1775
|
-
this.#
|
|
1838
|
+
this.#i("row-commit", e);
|
|
1776
1839
|
}
|
|
1777
1840
|
emitSortChange(e) {
|
|
1778
|
-
this.#
|
|
1841
|
+
this.#i("sort-change", e);
|
|
1779
1842
|
}
|
|
1780
1843
|
emitColumnResize(e) {
|
|
1781
|
-
this.#
|
|
1844
|
+
this.#i("column-resize", e);
|
|
1782
1845
|
}
|
|
1783
1846
|
emitActivateCell(e) {
|
|
1784
|
-
this.#
|
|
1847
|
+
this.#i("activate-cell", e);
|
|
1785
1848
|
}
|
|
1786
1849
|
/** Update ARIA selection attributes on rendered rows/cells */
|
|
1787
1850
|
#Z() {
|
|
1788
|
-
this.bodyEl?.querySelectorAll(".data-grid-row")?.forEach((
|
|
1789
|
-
const
|
|
1790
|
-
|
|
1791
|
-
|
|
1851
|
+
this.bodyEl?.querySelectorAll(".data-grid-row")?.forEach((o, n) => {
|
|
1852
|
+
const i = n === this.focusRow;
|
|
1853
|
+
o.setAttribute("aria-selected", String(i)), o.querySelectorAll(".cell").forEach((s, r) => {
|
|
1854
|
+
s.setAttribute("aria-selected", String(i && r === this.focusCol));
|
|
1792
1855
|
});
|
|
1793
1856
|
});
|
|
1794
1857
|
}
|
|
1795
1858
|
// ---------------- Watch Handlers ----------------
|
|
1796
1859
|
#J() {
|
|
1797
|
-
if (!this.#
|
|
1798
|
-
this.#u(), this.#o.fitMode === "fixed" ? (this.__didInitialAutoSize = !1, this.#F()) : (this._columns.forEach((
|
|
1799
|
-
!
|
|
1860
|
+
if (!this.#h) return;
|
|
1861
|
+
this.#u(), this.#o.fitMode === "fixed" ? (this.__didInitialAutoSize = !1, this.#F()) : (this._columns.forEach((o) => {
|
|
1862
|
+
!o.__userResized && o.__autoSized && delete o.width;
|
|
1800
1863
|
}), this.updateTemplate());
|
|
1801
1864
|
}
|
|
1802
1865
|
#Q() {
|
|
1803
|
-
this.#
|
|
1866
|
+
this.#h && (this.#u(), this.rowPool.length = 0, this.bodyEl && (this.bodyEl.innerHTML = ""), this.__rowRenderEpoch++, this.refreshVirtualWindow(!0));
|
|
1804
1867
|
}
|
|
1805
1868
|
#ee() {
|
|
1806
|
-
this._rows = Array.isArray(this.#
|
|
1869
|
+
this._rows = Array.isArray(this.#s) ? [...this.#s] : [], this.#L(), !this.#r || Array.isArray(this.#r) && this.#r.length === 0 ? this.#c() : this.refreshVirtualWindow(!0);
|
|
1807
1870
|
}
|
|
1808
1871
|
#te() {
|
|
1809
|
-
|
|
1872
|
+
X(this), this.#h && (this.#u(), this.#c());
|
|
1810
1873
|
}
|
|
1811
1874
|
#oe() {
|
|
1812
|
-
this.#
|
|
1875
|
+
this.#h && (this.#u(), this.#W(), this.#L(), this.#M(), this.#T(), this.updateTemplate(), this.refreshVirtualWindow(!0));
|
|
1813
1876
|
}
|
|
1814
1877
|
// ---------------- Helper Wrappers ----------------
|
|
1815
1878
|
#ne() {
|
|
1816
|
-
|
|
1879
|
+
Ae(this);
|
|
1817
1880
|
}
|
|
1818
|
-
#
|
|
1819
|
-
|
|
1881
|
+
#T() {
|
|
1882
|
+
K(this);
|
|
1820
1883
|
}
|
|
1821
1884
|
updateTemplate() {
|
|
1822
|
-
|
|
1885
|
+
ce(this);
|
|
1823
1886
|
}
|
|
1824
1887
|
#F() {
|
|
1825
|
-
|
|
1888
|
+
Te(this);
|
|
1826
1889
|
}
|
|
1827
|
-
#
|
|
1890
|
+
#M() {
|
|
1828
1891
|
if (this.#t) {
|
|
1829
|
-
const e = this.#
|
|
1830
|
-
if (
|
|
1831
|
-
const
|
|
1832
|
-
if (!
|
|
1833
|
-
this._columns = [...
|
|
1892
|
+
const e = this.#H.length > 0 ? this.#H : this._columns, o = e.filter((s) => !s.hidden), n = e.filter((s) => s.hidden), i = this.#t.processColumns([...o]);
|
|
1893
|
+
if (i !== o) {
|
|
1894
|
+
const s = new Map(i.map((l, a) => [l.field, { col: l, order: a }]));
|
|
1895
|
+
if (!o.some((l) => s.has(l.field)) && i.length > 0)
|
|
1896
|
+
this._columns = [...i, ...n];
|
|
1834
1897
|
else {
|
|
1835
|
-
const
|
|
1836
|
-
if (
|
|
1837
|
-
const d =
|
|
1838
|
-
return d ? d.col :
|
|
1898
|
+
const l = e.map((a) => {
|
|
1899
|
+
if (a.hidden) return a;
|
|
1900
|
+
const d = s.get(a.field);
|
|
1901
|
+
return d ? d.col : a;
|
|
1839
1902
|
});
|
|
1840
|
-
this._columns =
|
|
1903
|
+
this._columns = l;
|
|
1841
1904
|
}
|
|
1842
1905
|
} else
|
|
1843
1906
|
this._columns = [...e];
|
|
1844
1907
|
}
|
|
1845
1908
|
}
|
|
1846
1909
|
/** Execute all plugin afterRender hooks */
|
|
1847
|
-
#
|
|
1910
|
+
#w() {
|
|
1848
1911
|
this.#t?.afterRender();
|
|
1849
1912
|
}
|
|
1850
1913
|
/** Recompute row model via plugin hooks (grouping, tree, filtering, etc.). */
|
|
1851
|
-
#
|
|
1852
|
-
|
|
1853
|
-
const e = Array.isArray(this.#
|
|
1854
|
-
this._rows =
|
|
1914
|
+
#L() {
|
|
1915
|
+
X(this);
|
|
1916
|
+
const e = Array.isArray(this.#s) ? [...this.#s] : [], o = this.#t?.processRows(e) ?? e;
|
|
1917
|
+
this._rows = o;
|
|
1855
1918
|
}
|
|
1856
1919
|
/**
|
|
1857
1920
|
* Build the canonical effective configuration by merging all input sources.
|
|
@@ -1872,81 +1935,81 @@ class $ extends HTMLElement {
|
|
|
1872
1935
|
* - Plugins receive config via their attach() method
|
|
1873
1936
|
*/
|
|
1874
1937
|
#u() {
|
|
1875
|
-
const e = this.#
|
|
1876
|
-
let
|
|
1877
|
-
const n = (this.__lightDomColumnsCache || []).map((
|
|
1878
|
-
...
|
|
1938
|
+
const e = this.#p ? { ...this.#p } : {};
|
|
1939
|
+
let o = Array.isArray(e.columns) ? [...e.columns] : [];
|
|
1940
|
+
const n = (this.__lightDomColumnsCache || []).map((i) => ({
|
|
1941
|
+
...i
|
|
1879
1942
|
}));
|
|
1880
1943
|
if (n.length) {
|
|
1881
|
-
const
|
|
1882
|
-
|
|
1883
|
-
const r = s
|
|
1884
|
-
r ? (
|
|
1944
|
+
const i = {};
|
|
1945
|
+
o.forEach((s) => i[s.field] = s), n.forEach((s) => {
|
|
1946
|
+
const r = i[s.field];
|
|
1947
|
+
r ? (s.header && !r.header && (r.header = s.header), s.type && !r.type && (r.type = s.type), r.sortable = r.sortable || s.sortable, s.resizable && (r.resizable = !0), s.editable && (r.editable = !0)) : (o.push(s), i[s.field] = s);
|
|
1885
1948
|
});
|
|
1886
1949
|
}
|
|
1887
|
-
if (this.#
|
|
1888
|
-
|
|
1950
|
+
if (this.#r && this.#r.length && (o = [...this.#r]), (!o || o.length === 0) && this._rows.length && (o = le(this._rows).columns), o.length) {
|
|
1951
|
+
o.forEach((r) => {
|
|
1889
1952
|
r.sortable === void 0 && (r.sortable = !0), r.resizable === void 0 && (r.resizable = !0);
|
|
1890
1953
|
});
|
|
1891
|
-
const
|
|
1892
|
-
|
|
1954
|
+
const i = this.#o.columns;
|
|
1955
|
+
i?.some((r) => r.__compiledView || r.__compiledEditor) ? e.columns = i : e.columns = o;
|
|
1893
1956
|
} else {
|
|
1894
|
-
const
|
|
1895
|
-
|
|
1957
|
+
const i = this.#o.columns;
|
|
1958
|
+
i?.some((s) => s.__compiledView || s.__compiledEditor) && (e.columns = i);
|
|
1896
1959
|
}
|
|
1897
|
-
this.#
|
|
1898
|
-
|
|
1960
|
+
this.#m && (e.fitMode = this.#m), e.fitMode || (e.fitMode = "stretch"), this.#v && (e.editOn = this.#v), e.columnState && !this.#d && (this.#d = e.columnState), this.#o = e, e.fitMode === "fixed" && this._columns.forEach((i) => {
|
|
1961
|
+
i.width == null && (i.width = 80);
|
|
1899
1962
|
});
|
|
1900
1963
|
}
|
|
1901
1964
|
// ---------------- Delegate Wrappers ----------------
|
|
1902
|
-
#z(e,
|
|
1903
|
-
this.#P || (this.#P = (
|
|
1965
|
+
#z(e, o, n = this.__rowRenderEpoch) {
|
|
1966
|
+
this.#P || (this.#P = (i, s, r) => this.#t?.renderRow(i, s, r) ?? !1), He(this, e, o, n, this.#P);
|
|
1904
1967
|
}
|
|
1905
|
-
#
|
|
1906
|
-
|
|
1968
|
+
#ie(e, o) {
|
|
1969
|
+
z(this, e, o);
|
|
1907
1970
|
}
|
|
1908
|
-
#D(e,
|
|
1909
|
-
|
|
1971
|
+
#D(e, o) {
|
|
1972
|
+
N(this, e, o);
|
|
1910
1973
|
}
|
|
1911
1974
|
// ---------------- Core Helpers ----------------
|
|
1912
|
-
#
|
|
1975
|
+
#c() {
|
|
1913
1976
|
if (!this.isConnected || !this.headerRowEl || !this.bodyEl)
|
|
1914
1977
|
return;
|
|
1915
|
-
const e = this.#
|
|
1978
|
+
const e = this.#p?.columns || this.#r || [];
|
|
1916
1979
|
if (e.length) {
|
|
1917
|
-
const n = new Map(this._columns.filter((
|
|
1918
|
-
...
|
|
1919
|
-
hidden: n.get(
|
|
1980
|
+
const n = new Map(this._columns.filter((s) => s.hidden).map((s) => [s.field, !0])), i = e.map((s) => ({
|
|
1981
|
+
...s,
|
|
1982
|
+
hidden: n.get(s.field) ?? s.hidden
|
|
1920
1983
|
}));
|
|
1921
|
-
this._columns =
|
|
1984
|
+
this._columns = i;
|
|
1922
1985
|
}
|
|
1923
|
-
if (this.#ne(), this.#u(), this.#
|
|
1924
|
-
const n = this.#
|
|
1925
|
-
this.#
|
|
1986
|
+
if (this.#ne(), this.#u(), this.#W(), this.#H = [...this._columns], this.#L(), this.#M(), this.#d) {
|
|
1987
|
+
const n = this.#d;
|
|
1988
|
+
this.#d = void 0, this.#U(n);
|
|
1926
1989
|
}
|
|
1927
|
-
this.#
|
|
1990
|
+
this.#T(), this.updateTemplate(), this.refreshVirtualWindow(!0), this.#o.fitMode === "fixed" && !this.__didInitialAutoSize && requestAnimationFrame(() => this.#F()), this.bodyEl && (this.bodyEl.style.display = "", this.bodyEl.style.gridTemplateColumns = ""), queueMicrotask(() => this.#w());
|
|
1928
1991
|
}
|
|
1929
1992
|
/** Internal method to apply column state without triggering setup loop */
|
|
1930
|
-
#
|
|
1931
|
-
const
|
|
1932
|
-
|
|
1933
|
-
for (const
|
|
1934
|
-
const
|
|
1935
|
-
|
|
1993
|
+
#U(e) {
|
|
1994
|
+
const o = this.#o.columns ?? [], n = this.#t?.getAll() ?? [];
|
|
1995
|
+
he(this, e, o, n);
|
|
1996
|
+
for (const i of e.columns) {
|
|
1997
|
+
const s = o.find((r) => r.field === i.field);
|
|
1998
|
+
s && (s.hidden = !i.visible);
|
|
1936
1999
|
}
|
|
1937
2000
|
}
|
|
1938
|
-
#
|
|
2001
|
+
#se() {
|
|
1939
2002
|
return this._rows.length <= this.virtualization.bypassThreshold;
|
|
1940
2003
|
}
|
|
1941
2004
|
#re(e) {
|
|
1942
|
-
if (this.refreshVirtualWindow(!1), this.#t?.onScrollRender(), this.#
|
|
1943
|
-
const
|
|
2005
|
+
if (this.refreshVirtualWindow(!1), this.#t?.onScrollRender(), this.#C) {
|
|
2006
|
+
const o = this.virtualization.container, n = {
|
|
1944
2007
|
scrollTop: e,
|
|
1945
|
-
scrollLeft:
|
|
1946
|
-
scrollHeight:
|
|
1947
|
-
scrollWidth:
|
|
1948
|
-
clientHeight:
|
|
1949
|
-
clientWidth:
|
|
2008
|
+
scrollLeft: o?.scrollLeft ?? 0,
|
|
2009
|
+
scrollHeight: o?.scrollHeight ?? 0,
|
|
2010
|
+
scrollWidth: o?.scrollWidth ?? 0,
|
|
2011
|
+
clientHeight: o?.clientHeight ?? 0,
|
|
2012
|
+
clientWidth: o?.clientWidth ?? 0,
|
|
1950
2013
|
originalEvent: new Event("scroll")
|
|
1951
2014
|
};
|
|
1952
2015
|
this.#t?.onScroll(n);
|
|
@@ -1956,8 +2019,8 @@ class $ extends HTMLElement {
|
|
|
1956
2019
|
return this.#n.querySelector(".header-row");
|
|
1957
2020
|
}
|
|
1958
2021
|
findRenderedRowElement(e) {
|
|
1959
|
-
return Array.from(this.bodyEl.querySelectorAll(".data-grid-row")).find((
|
|
1960
|
-
const n =
|
|
2022
|
+
return Array.from(this.bodyEl.querySelectorAll(".data-grid-row")).find((o) => {
|
|
2023
|
+
const n = o.querySelector(".cell[data-row]");
|
|
1961
2024
|
return n && Number(n.getAttribute("data-row")) === e;
|
|
1962
2025
|
}) || null;
|
|
1963
2026
|
}
|
|
@@ -1965,35 +2028,35 @@ class $ extends HTMLElement {
|
|
|
1965
2028
|
* Dispatch a cell click event to the plugin system.
|
|
1966
2029
|
* Returns true if any plugin handled the event.
|
|
1967
2030
|
*/
|
|
1968
|
-
dispatchCellClick(e,
|
|
1969
|
-
const
|
|
1970
|
-
if (!
|
|
1971
|
-
const
|
|
1972
|
-
row:
|
|
1973
|
-
rowIndex:
|
|
2031
|
+
dispatchCellClick(e, o, n, i) {
|
|
2032
|
+
const s = this._rows[o], r = this._columns[n];
|
|
2033
|
+
if (!s || !r) return !1;
|
|
2034
|
+
const l = {
|
|
2035
|
+
row: s,
|
|
2036
|
+
rowIndex: o,
|
|
1974
2037
|
colIndex: n,
|
|
1975
2038
|
field: r.field,
|
|
1976
|
-
value:
|
|
1977
|
-
cellEl:
|
|
2039
|
+
value: s[r.field],
|
|
2040
|
+
cellEl: i,
|
|
1978
2041
|
originalEvent: e
|
|
1979
2042
|
};
|
|
1980
|
-
return this.#t?.onCellClick(
|
|
2043
|
+
return this.#t?.onCellClick(l) ?? !1;
|
|
1981
2044
|
}
|
|
1982
2045
|
/**
|
|
1983
2046
|
* Dispatch a header click event to the plugin system.
|
|
1984
2047
|
* Returns true if any plugin handled the event.
|
|
1985
2048
|
*/
|
|
1986
|
-
dispatchHeaderClick(e,
|
|
1987
|
-
const
|
|
1988
|
-
if (!
|
|
1989
|
-
const
|
|
1990
|
-
colIndex:
|
|
1991
|
-
field:
|
|
1992
|
-
column:
|
|
2049
|
+
dispatchHeaderClick(e, o, n) {
|
|
2050
|
+
const i = this._columns[o];
|
|
2051
|
+
if (!i) return !1;
|
|
2052
|
+
const s = {
|
|
2053
|
+
colIndex: o,
|
|
2054
|
+
field: i.field,
|
|
2055
|
+
column: i,
|
|
1993
2056
|
headerEl: n,
|
|
1994
2057
|
originalEvent: e
|
|
1995
2058
|
};
|
|
1996
|
-
return this.#t?.onHeaderClick(
|
|
2059
|
+
return this.#t?.onHeaderClick(s) ?? !1;
|
|
1997
2060
|
}
|
|
1998
2061
|
/**
|
|
1999
2062
|
* Dispatch a keyboard event to the plugin system.
|
|
@@ -2006,52 +2069,52 @@ class $ extends HTMLElement {
|
|
|
2006
2069
|
* Build a CellMouseEvent from a native MouseEvent.
|
|
2007
2070
|
* Extracts cell/row information from the event target.
|
|
2008
2071
|
*/
|
|
2009
|
-
#N(e,
|
|
2072
|
+
#N(e, o) {
|
|
2010
2073
|
let n = null;
|
|
2011
|
-
const
|
|
2012
|
-
if (
|
|
2013
|
-
const
|
|
2014
|
-
|
|
2074
|
+
const i = e.composedPath?.();
|
|
2075
|
+
if (i && i.length > 0 ? n = i[0] : n = e.target, n && !this.#n.contains(n)) {
|
|
2076
|
+
const u = this.#n.elementFromPoint(e.clientX, e.clientY);
|
|
2077
|
+
u && (n = u);
|
|
2015
2078
|
}
|
|
2016
|
-
const
|
|
2017
|
-
let
|
|
2018
|
-
return
|
|
2019
|
-
type:
|
|
2020
|
-
row:
|
|
2021
|
-
rowIndex:
|
|
2079
|
+
const s = n?.closest?.("[data-col]"), r = n?.closest?.(".data-grid-row"), l = n?.closest?.(".header-row");
|
|
2080
|
+
let a, d, h, p, b, c;
|
|
2081
|
+
return s && (a = parseInt(s.getAttribute("data-row") ?? "-1", 10), d = parseInt(s.getAttribute("data-col") ?? "-1", 10), a >= 0 && d >= 0 && (h = this._rows[a], c = this._columns[d], p = c?.field, b = h && p ? h[p] : void 0)), {
|
|
2082
|
+
type: o,
|
|
2083
|
+
row: h,
|
|
2084
|
+
rowIndex: a !== void 0 && a >= 0 ? a : void 0,
|
|
2022
2085
|
colIndex: d !== void 0 && d >= 0 ? d : void 0,
|
|
2023
|
-
field:
|
|
2024
|
-
value:
|
|
2086
|
+
field: p,
|
|
2087
|
+
value: b,
|
|
2025
2088
|
column: c,
|
|
2026
2089
|
originalEvent: e,
|
|
2027
|
-
cellElement:
|
|
2090
|
+
cellElement: s ?? void 0,
|
|
2028
2091
|
rowElement: r ?? void 0,
|
|
2029
|
-
isHeader: !!
|
|
2030
|
-
cell:
|
|
2092
|
+
isHeader: !!l,
|
|
2093
|
+
cell: a !== void 0 && d !== void 0 && a >= 0 && d >= 0 ? { row: a, col: d } : void 0
|
|
2031
2094
|
};
|
|
2032
2095
|
}
|
|
2033
2096
|
/**
|
|
2034
2097
|
* Handle mousedown events and dispatch to plugin system.
|
|
2035
2098
|
*/
|
|
2036
2099
|
#le(e) {
|
|
2037
|
-
const
|
|
2038
|
-
(this.#t?.onCellMouseDown(
|
|
2100
|
+
const o = this.#N(e, "mousedown");
|
|
2101
|
+
(this.#t?.onCellMouseDown(o) ?? !1) && (this.#y = !0);
|
|
2039
2102
|
}
|
|
2040
2103
|
/**
|
|
2041
2104
|
* Handle mousemove events (only when dragging).
|
|
2042
2105
|
*/
|
|
2043
2106
|
#ae(e) {
|
|
2044
|
-
if (!this.#
|
|
2045
|
-
const
|
|
2046
|
-
this.#t?.onCellMouseMove(
|
|
2107
|
+
if (!this.#y) return;
|
|
2108
|
+
const o = this.#N(e, "mousemove");
|
|
2109
|
+
this.#t?.onCellMouseMove(o);
|
|
2047
2110
|
}
|
|
2048
2111
|
/**
|
|
2049
2112
|
* Handle mouseup events.
|
|
2050
2113
|
*/
|
|
2051
2114
|
#ce(e) {
|
|
2052
|
-
if (!this.#
|
|
2053
|
-
const
|
|
2054
|
-
this.#t?.onCellMouseUp(
|
|
2115
|
+
if (!this.#y) return;
|
|
2116
|
+
const o = this.#N(e, "mouseup");
|
|
2117
|
+
this.#t?.onCellMouseUp(o), this.#y = !1;
|
|
2055
2118
|
}
|
|
2056
2119
|
// API consumed by internal utils (rows.ts)
|
|
2057
2120
|
get changedRows() {
|
|
@@ -2061,19 +2124,40 @@ class $ extends HTMLElement {
|
|
|
2061
2124
|
return Array.from(this._changedRowIndices);
|
|
2062
2125
|
}
|
|
2063
2126
|
async resetChangedRows(e) {
|
|
2064
|
-
this._changedRowIndices.clear(), e || this.#
|
|
2127
|
+
this._changedRowIndices.clear(), e || this.#i("changed-rows-reset", { rows: this.changedRows, indices: this.changedRowIndices }), this.rowPool.forEach((o) => o.classList.remove("changed"));
|
|
2065
2128
|
}
|
|
2066
2129
|
async beginBulkEdit(e) {
|
|
2067
|
-
this
|
|
2130
|
+
if (!this._columns.some((s) => s.editable)) return;
|
|
2131
|
+
const n = this._rows[e];
|
|
2132
|
+
this.#ie(e, n);
|
|
2133
|
+
const i = this.findRenderedRowElement?.(e);
|
|
2134
|
+
i && (Array.from(i.children).forEach((s, r) => {
|
|
2135
|
+
const l = this.visibleColumns[r];
|
|
2136
|
+
if (l?.editable) {
|
|
2137
|
+
const a = s;
|
|
2138
|
+
a.classList.contains("editing") || O(this, n, e, l, a);
|
|
2139
|
+
}
|
|
2140
|
+
}), queueMicrotask(() => {
|
|
2141
|
+
const s = i.querySelector(`.cell[data-col="${this.focusCol}"]`);
|
|
2142
|
+
if (s?.classList.contains("editing")) {
|
|
2143
|
+
const r = s.querySelector(
|
|
2144
|
+
'input,select,textarea,[contenteditable="true"],[contenteditable=""],[tabindex]:not([tabindex="-1"])'
|
|
2145
|
+
);
|
|
2146
|
+
try {
|
|
2147
|
+
r?.focus();
|
|
2148
|
+
} catch {
|
|
2149
|
+
}
|
|
2150
|
+
}
|
|
2151
|
+
}));
|
|
2068
2152
|
}
|
|
2069
2153
|
async commitActiveRowEdit() {
|
|
2070
2154
|
this.activeEditRows !== -1 && this.#D(this.activeEditRows, !1);
|
|
2071
2155
|
}
|
|
2072
2156
|
async ready() {
|
|
2073
|
-
return this
|
|
2157
|
+
return this.#$;
|
|
2074
2158
|
}
|
|
2075
2159
|
async forceLayout() {
|
|
2076
|
-
this.#
|
|
2160
|
+
this.#c(), await new Promise((e) => requestAnimationFrame(() => requestAnimationFrame(e)));
|
|
2077
2161
|
}
|
|
2078
2162
|
/** Public method: returns a frozen snapshot of the merged effective configuration */
|
|
2079
2163
|
async getConfig() {
|
|
@@ -2086,16 +2170,16 @@ class $ extends HTMLElement {
|
|
|
2086
2170
|
* @param visible - Whether the column should be visible
|
|
2087
2171
|
* @returns True if visibility was changed, false if column not found or locked
|
|
2088
2172
|
*/
|
|
2089
|
-
setColumnVisible(e,
|
|
2090
|
-
const n = this.#o.columns,
|
|
2091
|
-
if (!
|
|
2173
|
+
setColumnVisible(e, o) {
|
|
2174
|
+
const n = this.#o.columns, i = n?.find((l) => l.field === e);
|
|
2175
|
+
if (!i || !o && i.lockVisible || !o && (n ?? []).filter((a) => !a.hidden && a.field !== e).length === 0)
|
|
2092
2176
|
return !1;
|
|
2093
|
-
const
|
|
2094
|
-
return
|
|
2177
|
+
const s = !!i.hidden, r = !o;
|
|
2178
|
+
return s !== r ? (i.hidden = r, this.#i("column-visibility", {
|
|
2095
2179
|
field: e,
|
|
2096
|
-
visible:
|
|
2097
|
-
visibleColumns: (n ?? []).filter((
|
|
2098
|
-
}), this.rowPool.length = 0, this.bodyEl && (this.bodyEl.innerHTML = ""), this.__rowRenderEpoch++, this.#
|
|
2180
|
+
visible: o,
|
|
2181
|
+
visibleColumns: (n ?? []).filter((l) => !l.hidden).map((l) => l.field)
|
|
2182
|
+
}), this.rowPool.length = 0, this.bodyEl && (this.bodyEl.innerHTML = ""), this.__rowRenderEpoch++, this.#c(), this.requestStateChange(), !0) : !1;
|
|
2099
2183
|
}
|
|
2100
2184
|
/**
|
|
2101
2185
|
* Toggle the visibility of a column.
|
|
@@ -2103,8 +2187,8 @@ class $ extends HTMLElement {
|
|
|
2103
2187
|
* @returns True if visibility was toggled, false if column not found or locked
|
|
2104
2188
|
*/
|
|
2105
2189
|
toggleColumnVisibility(e) {
|
|
2106
|
-
const
|
|
2107
|
-
return this.setColumnVisible(e,
|
|
2190
|
+
const i = !!this.#o.columns?.find((s) => s.field === e)?.hidden;
|
|
2191
|
+
return this.setColumnVisible(e, i);
|
|
2108
2192
|
}
|
|
2109
2193
|
/**
|
|
2110
2194
|
* Check if a column is currently visible.
|
|
@@ -2112,7 +2196,7 @@ class $ extends HTMLElement {
|
|
|
2112
2196
|
* @returns True if visible, false if hidden or not found
|
|
2113
2197
|
*/
|
|
2114
2198
|
isColumnVisible(e) {
|
|
2115
|
-
const n = this.#o.columns?.find((
|
|
2199
|
+
const n = this.#o.columns?.find((i) => i.field === e);
|
|
2116
2200
|
return n ? !n.hidden : !1;
|
|
2117
2201
|
}
|
|
2118
2202
|
/**
|
|
@@ -2122,9 +2206,9 @@ class $ extends HTMLElement {
|
|
|
2122
2206
|
const e = this.#o.columns;
|
|
2123
2207
|
e?.some((n) => n.hidden) && (e?.forEach((n) => {
|
|
2124
2208
|
n.hidden = !1;
|
|
2125
|
-
}), this.#
|
|
2209
|
+
}), this.#i("column-visibility", {
|
|
2126
2210
|
visibleColumns: (e ?? []).map((n) => n.field)
|
|
2127
|
-
}), this.rowPool.length = 0, this.bodyEl && (this.bodyEl.innerHTML = ""), this.__rowRenderEpoch++, this.#
|
|
2211
|
+
}), this.rowPool.length = 0, this.bodyEl && (this.bodyEl.innerHTML = ""), this.__rowRenderEpoch++, this.#c(), this.requestStateChange());
|
|
2128
2212
|
}
|
|
2129
2213
|
/**
|
|
2130
2214
|
* Get list of all column fields (including hidden).
|
|
@@ -2133,11 +2217,11 @@ class $ extends HTMLElement {
|
|
|
2133
2217
|
* @returns Array of all field names with their visibility status
|
|
2134
2218
|
*/
|
|
2135
2219
|
getAllColumns() {
|
|
2136
|
-
return (this.#o.columns ?? []).map((
|
|
2137
|
-
field:
|
|
2138
|
-
header:
|
|
2139
|
-
visible: !
|
|
2140
|
-
lockVisible:
|
|
2220
|
+
return (this.#o.columns ?? []).map((o) => ({
|
|
2221
|
+
field: o.field,
|
|
2222
|
+
header: o.header || o.field,
|
|
2223
|
+
visible: !o.hidden,
|
|
2224
|
+
lockVisible: o.lockVisible
|
|
2141
2225
|
}));
|
|
2142
2226
|
}
|
|
2143
2227
|
/**
|
|
@@ -2147,14 +2231,14 @@ class $ extends HTMLElement {
|
|
|
2147
2231
|
*/
|
|
2148
2232
|
setColumnOrder(e) {
|
|
2149
2233
|
if (!e.length) return;
|
|
2150
|
-
const
|
|
2151
|
-
for (const
|
|
2152
|
-
const
|
|
2153
|
-
|
|
2234
|
+
const o = new Map(this._columns.map((i) => [i.field, i])), n = [];
|
|
2235
|
+
for (const i of e) {
|
|
2236
|
+
const s = o.get(i);
|
|
2237
|
+
s && (n.push(s), o.delete(i));
|
|
2154
2238
|
}
|
|
2155
|
-
for (const
|
|
2156
|
-
n.push(
|
|
2157
|
-
this._columns = n, this.#
|
|
2239
|
+
for (const i of o.values())
|
|
2240
|
+
n.push(i);
|
|
2241
|
+
this._columns = n, this.#T(), this.updateTemplate(), this.refreshVirtualWindow(!0);
|
|
2158
2242
|
}
|
|
2159
2243
|
/**
|
|
2160
2244
|
* Get the current column order as an array of field names.
|
|
@@ -2170,14 +2254,14 @@ class $ extends HTMLElement {
|
|
|
2170
2254
|
*/
|
|
2171
2255
|
getColumnState() {
|
|
2172
2256
|
const e = this.#t?.getAll() ?? [];
|
|
2173
|
-
return
|
|
2257
|
+
return re(this, e);
|
|
2174
2258
|
}
|
|
2175
2259
|
/**
|
|
2176
2260
|
* Set the column state, restoring order, width, visibility, sort, and plugin state.
|
|
2177
2261
|
* Use this to restore previously saved column state.
|
|
2178
2262
|
*/
|
|
2179
2263
|
set columnState(e) {
|
|
2180
|
-
e && (this.#
|
|
2264
|
+
e && (this.#d = e, this.#k && this.#de(e));
|
|
2181
2265
|
}
|
|
2182
2266
|
/**
|
|
2183
2267
|
* Get the current column state.
|
|
@@ -2191,7 +2275,7 @@ class $ extends HTMLElement {
|
|
|
2191
2275
|
#de(e) {
|
|
2192
2276
|
(this.#o.columns ?? []).forEach((n) => {
|
|
2193
2277
|
n.hidden = !1;
|
|
2194
|
-
}), this.#
|
|
2278
|
+
}), this.#U(e), this.#c();
|
|
2195
2279
|
}
|
|
2196
2280
|
/**
|
|
2197
2281
|
* Request a state change event to be emitted.
|
|
@@ -2200,26 +2284,26 @@ class $ extends HTMLElement {
|
|
|
2200
2284
|
* The event is debounced to avoid excessive events during drag operations.
|
|
2201
2285
|
*/
|
|
2202
2286
|
requestStateChange() {
|
|
2203
|
-
this.#
|
|
2287
|
+
this.#O || (this.#O = fe(
|
|
2204
2288
|
this,
|
|
2205
2289
|
() => this.#t?.getAll() ?? [],
|
|
2206
|
-
(e) => this.#
|
|
2207
|
-
)), this.#
|
|
2290
|
+
(e) => this.#i("column-state-change", e)
|
|
2291
|
+
)), this.#O();
|
|
2208
2292
|
}
|
|
2209
2293
|
/**
|
|
2210
2294
|
* Reset column state to initial configuration.
|
|
2211
2295
|
* Clears all user modifications (order, width, visibility, sort).
|
|
2212
2296
|
*/
|
|
2213
2297
|
resetColumnState() {
|
|
2214
|
-
this.#
|
|
2298
|
+
this.#d = void 0, (this.#o.columns ?? []).forEach((n) => {
|
|
2215
2299
|
n.hidden = !1;
|
|
2216
|
-
}), this.sortState = null, this.__originalOrder = [], this.#u(), this.#
|
|
2217
|
-
const
|
|
2218
|
-
for (const n of
|
|
2300
|
+
}), this.sortState = null, this.__originalOrder = [], this.#u(), this.#c();
|
|
2301
|
+
const o = this.#t?.getAll() ?? [];
|
|
2302
|
+
for (const n of o)
|
|
2219
2303
|
if (n.applyColumnState)
|
|
2220
|
-
for (const
|
|
2221
|
-
n.applyColumnState(
|
|
2222
|
-
field:
|
|
2304
|
+
for (const i of this._columns)
|
|
2305
|
+
n.applyColumnState(i.field, {
|
|
2306
|
+
field: i.field,
|
|
2223
2307
|
order: 0,
|
|
2224
2308
|
visible: !0
|
|
2225
2309
|
});
|
|
@@ -2252,16 +2336,16 @@ class $ extends HTMLElement {
|
|
|
2252
2336
|
if (this.#e.isPanelOpen) return;
|
|
2253
2337
|
if (this.#e.isPanelOpen = !0, this.#e.expandedSections.size === 0 && this.#e.toolPanels.size > 0) {
|
|
2254
2338
|
const n = [...this.#e.toolPanels.values()].sort(
|
|
2255
|
-
(
|
|
2339
|
+
(i, s) => (i.order ?? 100) - (s.order ?? 100)
|
|
2256
2340
|
)[0];
|
|
2257
2341
|
n && this.#e.expandedSections.add(n.id);
|
|
2258
2342
|
}
|
|
2259
|
-
|
|
2343
|
+
ne(this.#n, this.#e), ie(this.#n, this.#e);
|
|
2260
2344
|
const e = {
|
|
2261
|
-
expand: this.#o?.icons?.expand ??
|
|
2262
|
-
collapse: this.#o?.icons?.collapse ??
|
|
2345
|
+
expand: this.#o?.icons?.expand ?? P.expand,
|
|
2346
|
+
collapse: this.#o?.icons?.collapse ?? P.collapse
|
|
2263
2347
|
};
|
|
2264
|
-
|
|
2348
|
+
We(this.#n, this.#e, e), this.#i("tool-panel-open", { sections: this.expandedToolPanelSections });
|
|
2265
2349
|
}
|
|
2266
2350
|
/**
|
|
2267
2351
|
* Close the tool panel.
|
|
@@ -2273,7 +2357,7 @@ class $ extends HTMLElement {
|
|
|
2273
2357
|
this.#e.panelCleanups.clear(), this.#e.activePanelCleanup && (this.#e.activePanelCleanup(), this.#e.activePanelCleanup = null);
|
|
2274
2358
|
for (const e of this.#e.toolPanels.values())
|
|
2275
2359
|
e.onClose?.();
|
|
2276
|
-
this.#e.isPanelOpen = !1,
|
|
2360
|
+
this.#e.isPanelOpen = !1, ne(this.#n, this.#e), ie(this.#n, this.#e), this.#i("tool-panel-close", {});
|
|
2277
2361
|
}
|
|
2278
2362
|
}
|
|
2279
2363
|
/**
|
|
@@ -2288,8 +2372,8 @@ class $ extends HTMLElement {
|
|
|
2288
2372
|
* When there's only one panel, toggling is disabled (always expanded).
|
|
2289
2373
|
*/
|
|
2290
2374
|
toggleToolPanelSection(e) {
|
|
2291
|
-
const
|
|
2292
|
-
if (!
|
|
2375
|
+
const o = this.#e.toolPanels.get(e);
|
|
2376
|
+
if (!o) {
|
|
2293
2377
|
console.warn(`[tbw-grid] Tool panel section "${e}" not found`);
|
|
2294
2378
|
return;
|
|
2295
2379
|
}
|
|
@@ -2297,37 +2381,37 @@ class $ extends HTMLElement {
|
|
|
2297
2381
|
return;
|
|
2298
2382
|
const n = this.#e.expandedSections.has(e);
|
|
2299
2383
|
if (n) {
|
|
2300
|
-
const
|
|
2301
|
-
|
|
2384
|
+
const i = this.#e.panelCleanups.get(e);
|
|
2385
|
+
i && (i(), this.#e.panelCleanups.delete(e)), o.onClose?.(), this.#e.expandedSections.delete(e), this.#q(e, !1);
|
|
2302
2386
|
} else {
|
|
2303
|
-
for (const [
|
|
2304
|
-
if (
|
|
2305
|
-
const r = this.#e.panelCleanups.get(
|
|
2306
|
-
r && (r(), this.#e.panelCleanups.delete(
|
|
2307
|
-
const
|
|
2308
|
-
|
|
2387
|
+
for (const [i, s] of this.#e.toolPanels)
|
|
2388
|
+
if (i !== e && this.#e.expandedSections.has(i)) {
|
|
2389
|
+
const r = this.#e.panelCleanups.get(i);
|
|
2390
|
+
r && (r(), this.#e.panelCleanups.delete(i)), s.onClose?.(), this.#e.expandedSections.delete(i), this.#q(i, !1);
|
|
2391
|
+
const l = this.#n.querySelector(`[data-section="${i}"] .tbw-accordion-content`);
|
|
2392
|
+
l && (l.innerHTML = "");
|
|
2309
2393
|
}
|
|
2310
|
-
this.#e.expandedSections.add(e), this.#q(e, !0), this.#
|
|
2394
|
+
this.#e.expandedSections.add(e), this.#q(e, !0), this.#ue(e);
|
|
2311
2395
|
}
|
|
2312
|
-
this.#
|
|
2396
|
+
this.#i("tool-panel-section-toggle", { id: e, expanded: !n });
|
|
2313
2397
|
}
|
|
2314
2398
|
/**
|
|
2315
2399
|
* Update accordion section visual state.
|
|
2316
2400
|
*/
|
|
2317
|
-
#q(e,
|
|
2401
|
+
#q(e, o) {
|
|
2318
2402
|
const n = this.#n.querySelector(`[data-section="${e}"]`);
|
|
2319
|
-
n && n.classList.toggle("expanded",
|
|
2403
|
+
n && n.classList.toggle("expanded", o);
|
|
2320
2404
|
}
|
|
2321
2405
|
/**
|
|
2322
2406
|
* Render content for a single accordion section.
|
|
2323
2407
|
*/
|
|
2324
|
-
#
|
|
2325
|
-
const
|
|
2326
|
-
if (!
|
|
2408
|
+
#ue(e) {
|
|
2409
|
+
const o = this.#e.toolPanels.get(e);
|
|
2410
|
+
if (!o?.render) return;
|
|
2327
2411
|
const n = this.#n.querySelector(`[data-section="${e}"] .tbw-accordion-content`);
|
|
2328
2412
|
if (!n) return;
|
|
2329
|
-
const
|
|
2330
|
-
|
|
2413
|
+
const i = o.render(n);
|
|
2414
|
+
i && this.#e.panelCleanups.set(e, i);
|
|
2331
2415
|
}
|
|
2332
2416
|
/**
|
|
2333
2417
|
* Get registered tool panel definitions.
|
|
@@ -2343,13 +2427,13 @@ class $ extends HTMLElement {
|
|
|
2343
2427
|
console.warn(`[tbw-grid] Tool panel "${e.id}" already registered`);
|
|
2344
2428
|
return;
|
|
2345
2429
|
}
|
|
2346
|
-
this.#e.toolPanels.set(e.id, e), this.#
|
|
2430
|
+
this.#e.toolPanels.set(e.id, e), this.#a && this.#g();
|
|
2347
2431
|
}
|
|
2348
2432
|
/**
|
|
2349
2433
|
* Unregister a custom tool panel.
|
|
2350
2434
|
*/
|
|
2351
2435
|
unregisterToolPanel(e) {
|
|
2352
|
-
this.#e.activePanel === e && this.closeToolPanel(), this.#e.toolPanels.delete(e), this.#
|
|
2436
|
+
this.#e.activePanel === e && this.closeToolPanel(), this.#e.toolPanels.delete(e), this.#a && this.#g();
|
|
2353
2437
|
}
|
|
2354
2438
|
/**
|
|
2355
2439
|
* Get registered header content definitions.
|
|
@@ -2365,20 +2449,20 @@ class $ extends HTMLElement {
|
|
|
2365
2449
|
console.warn(`[tbw-grid] Header content "${e.id}" already registered`);
|
|
2366
2450
|
return;
|
|
2367
2451
|
}
|
|
2368
|
-
this.#e.headerContents.set(e.id, e), this.#
|
|
2452
|
+
this.#e.headerContents.set(e.id, e), this.#a && oe(this.#n, this.#e);
|
|
2369
2453
|
}
|
|
2370
2454
|
/**
|
|
2371
2455
|
* Unregister custom header content.
|
|
2372
2456
|
*/
|
|
2373
2457
|
unregisterHeaderContent(e) {
|
|
2374
|
-
const
|
|
2375
|
-
|
|
2458
|
+
const o = this.#e.headerContentCleanups.get(e);
|
|
2459
|
+
o && (o(), this.#e.headerContentCleanups.delete(e)), this.#e.headerContents.get(e)?.onDestroy?.(), this.#e.headerContents.delete(e), this.#n.querySelector(`[data-header-content="${e}"]`)?.remove();
|
|
2376
2460
|
}
|
|
2377
2461
|
/**
|
|
2378
2462
|
* Get all registered toolbar buttons.
|
|
2379
2463
|
*/
|
|
2380
2464
|
getToolbarButtons() {
|
|
2381
|
-
return
|
|
2465
|
+
return Ge(this.#o?.shell, this.#e);
|
|
2382
2466
|
}
|
|
2383
2467
|
/**
|
|
2384
2468
|
* Register a custom toolbar button programmatically.
|
|
@@ -2388,36 +2472,36 @@ class $ extends HTMLElement {
|
|
|
2388
2472
|
console.warn(`[tbw-grid] Toolbar button "${e.id}" already registered`);
|
|
2389
2473
|
return;
|
|
2390
2474
|
}
|
|
2391
|
-
this.#e.toolbarButtons.set(e.id, e), this.#
|
|
2475
|
+
this.#e.toolbarButtons.set(e.id, e), this.#a && this.#g();
|
|
2392
2476
|
}
|
|
2393
2477
|
/**
|
|
2394
2478
|
* Unregister a custom toolbar button.
|
|
2395
2479
|
*/
|
|
2396
2480
|
unregisterToolbarButton(e) {
|
|
2397
|
-
const
|
|
2398
|
-
|
|
2481
|
+
const o = this.#e.toolbarButtonCleanups.get(e);
|
|
2482
|
+
o && (o(), this.#e.toolbarButtonCleanups.delete(e)), this.#e.toolbarButtons.delete(e), this.#a && this.#g();
|
|
2399
2483
|
}
|
|
2400
2484
|
/**
|
|
2401
2485
|
* Enable/disable a toolbar button by ID.
|
|
2402
2486
|
*/
|
|
2403
|
-
setToolbarButtonDisabled(e,
|
|
2487
|
+
setToolbarButtonDisabled(e, o) {
|
|
2404
2488
|
const n = this.#e.toolbarButtons.get(e);
|
|
2405
|
-
n && (n.disabled =
|
|
2406
|
-
const
|
|
2407
|
-
|
|
2489
|
+
n && (n.disabled = o);
|
|
2490
|
+
const i = this.#n.querySelector(`[data-btn="${e}"]`);
|
|
2491
|
+
i && (i.disabled = o);
|
|
2408
2492
|
}
|
|
2409
2493
|
/**
|
|
2410
2494
|
* Re-parse light DOM shell elements and refresh shell header.
|
|
2411
2495
|
* Call this after dynamically modifying <tbw-grid-header> children.
|
|
2412
2496
|
*/
|
|
2413
2497
|
refreshShellHeader() {
|
|
2414
|
-
this.#
|
|
2498
|
+
this.#g();
|
|
2415
2499
|
}
|
|
2416
2500
|
/**
|
|
2417
2501
|
* Internal shell header refresh.
|
|
2418
2502
|
*/
|
|
2419
|
-
#
|
|
2420
|
-
|
|
2503
|
+
#g() {
|
|
2504
|
+
te(this, this.#e), this.#X(), this.#G();
|
|
2421
2505
|
}
|
|
2422
2506
|
// ---------------- Virtual Window ----------------
|
|
2423
2507
|
/**
|
|
@@ -2426,41 +2510,45 @@ class $ extends HTMLElement {
|
|
|
2426
2510
|
*/
|
|
2427
2511
|
refreshVirtualWindow(e = !1) {
|
|
2428
2512
|
if (!this.bodyEl) return;
|
|
2429
|
-
const
|
|
2513
|
+
const o = this._rows.length;
|
|
2430
2514
|
if (!this.virtualization.enabled) {
|
|
2431
|
-
this.#z(0,
|
|
2515
|
+
this.#z(0, o), this.#w();
|
|
2432
2516
|
return;
|
|
2433
2517
|
}
|
|
2434
|
-
if (this.#
|
|
2435
|
-
this.virtualization.start = 0, this.virtualization.end =
|
|
2518
|
+
if (this.#se()) {
|
|
2519
|
+
this.virtualization.start = 0, this.virtualization.end = o, this.bodyEl.style.transform = "translateY(0px)", this.#z(0, o, this.__rowRenderEpoch), this.virtualization.totalHeightEl && (this.virtualization.totalHeightEl.style.height = `${o * this.virtualization.rowHeight}px`);
|
|
2520
|
+
const R = this.#n.querySelector(".rows-body");
|
|
2521
|
+
R?.setAttribute("aria-rowcount", String(o)), R?.setAttribute("aria-colcount", String(this.visibleColumns.length)), this.#w();
|
|
2436
2522
|
return;
|
|
2437
2523
|
}
|
|
2438
|
-
const n = this.virtualization.container ?? this,
|
|
2439
|
-
let
|
|
2440
|
-
const
|
|
2441
|
-
for (; d <
|
|
2442
|
-
const R = this.#t?.getExtraHeightBefore?.(
|
|
2443
|
-
if (
|
|
2444
|
-
|
|
2524
|
+
const n = this.virtualization.container ?? this, s = (this.virtualization.viewportEl ?? n).clientHeight, r = this.virtualization.rowHeight, l = n.scrollTop;
|
|
2525
|
+
let a = Math.floor(l / r), d = 0;
|
|
2526
|
+
const h = 10;
|
|
2527
|
+
for (; d < h; ) {
|
|
2528
|
+
const R = this.#t?.getExtraHeightBefore?.(a) ?? 0, T = Math.floor((l - R) / r);
|
|
2529
|
+
if (T >= a || T < 0) break;
|
|
2530
|
+
a = T, d++;
|
|
2445
2531
|
}
|
|
2446
|
-
|
|
2447
|
-
const
|
|
2448
|
-
|
|
2449
|
-
const
|
|
2450
|
-
let c =
|
|
2451
|
-
c >
|
|
2452
|
-
const
|
|
2453
|
-
this.virtualization.totalHeightEl && (this.virtualization.totalHeightEl.style.height = `${
|
|
2454
|
-
const
|
|
2455
|
-
this.bodyEl.style.transform = `translateY(${
|
|
2532
|
+
a = a - a % 2, a < 0 && (a = 0);
|
|
2533
|
+
const p = this.#t?.adjustVirtualStart(a, l, r);
|
|
2534
|
+
p !== void 0 && p < a && (a = p, a = a - a % 2, a < 0 && (a = 0));
|
|
2535
|
+
const b = Math.ceil(s / r) + 3;
|
|
2536
|
+
let c = a + b;
|
|
2537
|
+
c > o && (c = o), this.virtualization.start = a, this.virtualization.end = c;
|
|
2538
|
+
const f = this.#n.querySelector(".tbw-footer")?.offsetHeight ?? 0, w = this.#t?.getExtraHeight() ?? 0;
|
|
2539
|
+
this.virtualization.totalHeightEl && (this.virtualization.totalHeightEl.style.height = `${o * r + r + f + w}px`);
|
|
2540
|
+
const v = this.#t?.getExtraHeightBefore?.(a) ?? 0, S = -(l - a * r - v);
|
|
2541
|
+
this.bodyEl.style.transform = `translateY(${S}px)`, this.#z(a, c, e ? ++this.__rowRenderEpoch : this.__rowRenderEpoch);
|
|
2542
|
+
const x = this.#n.querySelector(".rows-body");
|
|
2543
|
+
x?.setAttribute("aria-rowcount", String(o)), x?.setAttribute("aria-colcount", String(this.visibleColumns.length)), e && this.#w();
|
|
2456
2544
|
}
|
|
2457
2545
|
// ---------------- Render ----------------
|
|
2458
|
-
#
|
|
2459
|
-
|
|
2460
|
-
const e = this.#o?.shell,
|
|
2546
|
+
#X() {
|
|
2547
|
+
te(this, this.#e);
|
|
2548
|
+
const e = this.#o?.shell, o = Ne(e, this.#e), n = `
|
|
2461
2549
|
<div class="tbw-scroll-area">
|
|
2462
2550
|
<div class="rows-body-wrapper">
|
|
2463
|
-
<div class="rows-body">
|
|
2551
|
+
<div class="rows-body" role="grid">
|
|
2464
2552
|
<div class="header">
|
|
2465
2553
|
<div class="header-row" part="header-row"></div>
|
|
2466
2554
|
</div>
|
|
@@ -2476,17 +2564,17 @@ class $ extends HTMLElement {
|
|
|
2476
2564
|
<div class="faux-vscroll-spacer"></div>
|
|
2477
2565
|
</div>
|
|
2478
2566
|
`;
|
|
2479
|
-
if (
|
|
2480
|
-
const
|
|
2481
|
-
expand: this.#o?.icons?.expand ??
|
|
2482
|
-
collapse: this.#o?.icons?.collapse ??
|
|
2483
|
-
}, r =
|
|
2567
|
+
if (o) {
|
|
2568
|
+
const i = this.#o?.icons?.toolPanel ?? P.toolPanel, s = {
|
|
2569
|
+
expand: this.#o?.icons?.expand ?? P.expand,
|
|
2570
|
+
collapse: this.#o?.icons?.collapse ?? P.collapse
|
|
2571
|
+
}, r = qe(e, this.#e, i), l = $e(e, this.#e, n, s);
|
|
2484
2572
|
this.#n.innerHTML = `
|
|
2485
2573
|
<div class="tbw-grid-root has-shell">
|
|
2486
2574
|
${r}
|
|
2487
|
-
${
|
|
2575
|
+
${l}
|
|
2488
2576
|
</div>
|
|
2489
|
-
`, this.#
|
|
2577
|
+
`, this.#he(), this.#a = !0;
|
|
2490
2578
|
} else
|
|
2491
2579
|
this.#n.innerHTML = `
|
|
2492
2580
|
<div class="tbw-grid-root">
|
|
@@ -2499,12 +2587,12 @@ class $ extends HTMLElement {
|
|
|
2499
2587
|
/**
|
|
2500
2588
|
* Set up shell event listeners after render.
|
|
2501
2589
|
*/
|
|
2502
|
-
#
|
|
2503
|
-
|
|
2590
|
+
#he() {
|
|
2591
|
+
Ie(this.#n, this.#o?.shell, this.#e, {
|
|
2504
2592
|
onPanelToggle: () => this.toggleToolPanel(),
|
|
2505
2593
|
onSectionToggle: (e) => this.toggleToolPanelSection(e),
|
|
2506
2594
|
onToolbarButtonClick: (e) => this.#fe(e)
|
|
2507
|
-
}), this.#
|
|
2595
|
+
}), this.#A?.(), this.#A = Be(this.#n, this.#o?.shell, (e) => {
|
|
2508
2596
|
this.style.setProperty("--tbw-tool-panel-width", `${e}px`);
|
|
2509
2597
|
});
|
|
2510
2598
|
}
|
|
@@ -2512,17 +2600,17 @@ class $ extends HTMLElement {
|
|
|
2512
2600
|
* Handle toolbar button click (for config buttons with action).
|
|
2513
2601
|
*/
|
|
2514
2602
|
#fe(e) {
|
|
2515
|
-
const n = (this.#o?.shell?.header?.toolbarButtons ?? []).find((
|
|
2603
|
+
const n = (this.#o?.shell?.header?.toolbarButtons ?? []).find((s) => s.id === e);
|
|
2516
2604
|
if (n?.action) {
|
|
2517
2605
|
n.action();
|
|
2518
2606
|
return;
|
|
2519
2607
|
}
|
|
2520
|
-
const
|
|
2521
|
-
|
|
2608
|
+
const i = this.#e.toolbarButtons.get(e);
|
|
2609
|
+
i?.action && i.action();
|
|
2522
2610
|
}
|
|
2523
2611
|
}
|
|
2524
|
-
customElements.get(
|
|
2525
|
-
class
|
|
2612
|
+
customElements.get(G.tagName) || customElements.define(G.tagName, G);
|
|
2613
|
+
class je {
|
|
2526
2614
|
/** Plugin version - override in subclass if needed */
|
|
2527
2615
|
version = "1.0.0";
|
|
2528
2616
|
/** CSS styles to inject into the grid's shadow DOM */
|
|
@@ -2573,8 +2661,8 @@ class ge {
|
|
|
2573
2661
|
/**
|
|
2574
2662
|
* Emit a custom event from the grid.
|
|
2575
2663
|
*/
|
|
2576
|
-
emit(e,
|
|
2577
|
-
this.grid?.dispatchEvent?.(new CustomEvent(e, { detail:
|
|
2664
|
+
emit(e, o) {
|
|
2665
|
+
this.grid?.dispatchEvent?.(new CustomEvent(e, { detail: o, bubbles: !0 }));
|
|
2578
2666
|
}
|
|
2579
2667
|
/**
|
|
2580
2668
|
* Request a re-render of the grid.
|
|
@@ -2647,7 +2735,7 @@ class ge {
|
|
|
2647
2735
|
*/
|
|
2648
2736
|
get gridIcons() {
|
|
2649
2737
|
const e = this.grid?.gridConfig?.icons ?? {};
|
|
2650
|
-
return { ...
|
|
2738
|
+
return { ...P, ...e };
|
|
2651
2739
|
}
|
|
2652
2740
|
/**
|
|
2653
2741
|
* Resolve an icon value to string or HTMLElement.
|
|
@@ -2657,8 +2745,8 @@ class ge {
|
|
|
2657
2745
|
* @param pluginOverride - Optional plugin-level override
|
|
2658
2746
|
* @returns The resolved icon value
|
|
2659
2747
|
*/
|
|
2660
|
-
resolveIcon(e,
|
|
2661
|
-
return
|
|
2748
|
+
resolveIcon(e, o) {
|
|
2749
|
+
return o !== void 0 ? o : this.gridIcons[e];
|
|
2662
2750
|
}
|
|
2663
2751
|
/**
|
|
2664
2752
|
* Set an icon value on an element.
|
|
@@ -2667,8 +2755,8 @@ class ge {
|
|
|
2667
2755
|
* @param element - The element to set the icon on
|
|
2668
2756
|
* @param icon - The icon value (string or HTMLElement)
|
|
2669
2757
|
*/
|
|
2670
|
-
setIcon(e,
|
|
2671
|
-
typeof
|
|
2758
|
+
setIcon(e, o) {
|
|
2759
|
+
typeof o == "string" ? e.innerHTML = o : o instanceof HTMLElement && (e.innerHTML = "", e.appendChild(o.cloneNode(!0)));
|
|
2672
2760
|
}
|
|
2673
2761
|
/**
|
|
2674
2762
|
* Log a warning message.
|
|
@@ -2677,517 +2765,7 @@ class ge {
|
|
|
2677
2765
|
console.warn(`[tbw-grid:${this.name}] ${e}`);
|
|
2678
2766
|
}
|
|
2679
2767
|
}
|
|
2680
|
-
|
|
2681
|
-
return {
|
|
2682
|
-
startRow: Math.min(o.startRow, o.endRow),
|
|
2683
|
-
startCol: Math.min(o.startCol, o.endCol),
|
|
2684
|
-
endRow: Math.max(o.startRow, o.endRow),
|
|
2685
|
-
endCol: Math.max(o.startCol, o.endCol)
|
|
2686
|
-
};
|
|
2687
|
-
}
|
|
2688
|
-
function ot(o) {
|
|
2689
|
-
const e = I(o);
|
|
2690
|
-
return {
|
|
2691
|
-
from: { row: e.startRow, col: e.startCol },
|
|
2692
|
-
to: { row: e.endRow, col: e.endCol }
|
|
2693
|
-
};
|
|
2694
|
-
}
|
|
2695
|
-
function V(o) {
|
|
2696
|
-
return o.map(ot);
|
|
2697
|
-
}
|
|
2698
|
-
function nt(o, e, t) {
|
|
2699
|
-
const n = I(t);
|
|
2700
|
-
return o >= n.startRow && o <= n.endRow && e >= n.startCol && e <= n.endCol;
|
|
2701
|
-
}
|
|
2702
|
-
function re(o, e, t) {
|
|
2703
|
-
return t.some((n) => nt(o, e, n));
|
|
2704
|
-
}
|
|
2705
|
-
function st(o) {
|
|
2706
|
-
const e = [], t = I(o);
|
|
2707
|
-
for (let n = t.startRow; n <= t.endRow; n++)
|
|
2708
|
-
for (let s = t.startCol; s <= t.endCol; s++)
|
|
2709
|
-
e.push({ row: n, col: s });
|
|
2710
|
-
return e;
|
|
2711
|
-
}
|
|
2712
|
-
function it(o) {
|
|
2713
|
-
const e = /* @__PURE__ */ new Map();
|
|
2714
|
-
for (const t of o)
|
|
2715
|
-
for (const n of st(t))
|
|
2716
|
-
e.set(`${n.row},${n.col}`, n);
|
|
2717
|
-
return [...e.values()];
|
|
2718
|
-
}
|
|
2719
|
-
function le(o, e) {
|
|
2720
|
-
return {
|
|
2721
|
-
startRow: o.row,
|
|
2722
|
-
startCol: o.col,
|
|
2723
|
-
endRow: e.row,
|
|
2724
|
-
endCol: e.col
|
|
2725
|
-
};
|
|
2726
|
-
}
|
|
2727
|
-
const rt = ':host .selecting .data-grid-row>.cell{user-select:none}:host .data-grid-row.row-focus{background-color:var(--tbw-focus-background, rgba(from var(--tbw-color-accent) r g b / 12%))}:host([data-selection-mode="row"]) .cell-focus{outline:none}:host .data-grid-row>.cell.selected{background-color:var(--tbw-range-selection-bg)}:host .data-grid-row>.cell.selected.top{border-top:2px solid var(--tbw-range-border-color)}:host .data-grid-row>.cell.selected.bottom{border-bottom:2px solid var(--tbw-range-border-color)}:host .data-grid-row>.cell.selected.first{border-left:2px solid var(--tbw-range-border-color)}:host .data-grid-row>.cell.selected.last{border-right:2px solid var(--tbw-range-border-color)}';
|
|
2728
|
-
function lt(o, e, t) {
|
|
2729
|
-
if (o === "cell" && e.selectedCell)
|
|
2730
|
-
return {
|
|
2731
|
-
mode: o,
|
|
2732
|
-
ranges: [
|
|
2733
|
-
{
|
|
2734
|
-
from: { row: e.selectedCell.row, col: e.selectedCell.col },
|
|
2735
|
-
to: { row: e.selectedCell.row, col: e.selectedCell.col }
|
|
2736
|
-
}
|
|
2737
|
-
]
|
|
2738
|
-
};
|
|
2739
|
-
if (o === "row" && e.selected.size > 0) {
|
|
2740
|
-
const n = [...e.selected].map((s) => ({
|
|
2741
|
-
from: { row: s, col: 0 },
|
|
2742
|
-
to: { row: s, col: t - 1 }
|
|
2743
|
-
}));
|
|
2744
|
-
return { mode: o, ranges: n };
|
|
2745
|
-
}
|
|
2746
|
-
return o === "range" && e.ranges.length > 0 ? { mode: o, ranges: V(e.ranges) } : { mode: o, ranges: [] };
|
|
2747
|
-
}
|
|
2748
|
-
class ft extends ge {
|
|
2749
|
-
name = "selection";
|
|
2750
|
-
version = "1.0.0";
|
|
2751
|
-
get defaultConfig() {
|
|
2752
|
-
return {
|
|
2753
|
-
mode: "cell"
|
|
2754
|
-
};
|
|
2755
|
-
}
|
|
2756
|
-
// ===== Internal State =====
|
|
2757
|
-
/** Row selection state (row mode) */
|
|
2758
|
-
selected = /* @__PURE__ */ new Set();
|
|
2759
|
-
lastSelected = null;
|
|
2760
|
-
anchor = null;
|
|
2761
|
-
/** Range selection state (range mode) */
|
|
2762
|
-
ranges = [];
|
|
2763
|
-
activeRange = null;
|
|
2764
|
-
cellAnchor = null;
|
|
2765
|
-
isDragging = !1;
|
|
2766
|
-
/** Cell selection state (cell mode) */
|
|
2767
|
-
selectedCell = null;
|
|
2768
|
-
// ===== Lifecycle =====
|
|
2769
|
-
detach() {
|
|
2770
|
-
this.selected.clear(), this.ranges = [], this.activeRange = null, this.cellAnchor = null, this.isDragging = !1, this.selectedCell = null;
|
|
2771
|
-
}
|
|
2772
|
-
// ===== Event Handlers =====
|
|
2773
|
-
onCellClick(e) {
|
|
2774
|
-
const { rowIndex: t, colIndex: n, originalEvent: s } = e, { mode: i } = this.config;
|
|
2775
|
-
if (i === "cell")
|
|
2776
|
-
return this.selectedCell = { row: t, col: n }, this.emit("selection-change", this.#i()), this.requestAfterRender(), !1;
|
|
2777
|
-
if (i === "row")
|
|
2778
|
-
return this.selected.clear(), this.selected.add(t), this.lastSelected = t, this.emit("selection-change", this.#i()), this.requestAfterRender(), !1;
|
|
2779
|
-
if (i === "range") {
|
|
2780
|
-
const r = s.shiftKey, a = s.ctrlKey || s.metaKey;
|
|
2781
|
-
if (r && this.cellAnchor) {
|
|
2782
|
-
const l = le(this.cellAnchor, { row: t, col: n });
|
|
2783
|
-
a ? this.ranges.length > 0 ? this.ranges[this.ranges.length - 1] = l : this.ranges.push(l) : this.ranges = [l], this.activeRange = l;
|
|
2784
|
-
} else if (a) {
|
|
2785
|
-
const l = {
|
|
2786
|
-
startRow: t,
|
|
2787
|
-
startCol: n,
|
|
2788
|
-
endRow: t,
|
|
2789
|
-
endCol: n
|
|
2790
|
-
};
|
|
2791
|
-
this.ranges.push(l), this.activeRange = l, this.cellAnchor = { row: t, col: n };
|
|
2792
|
-
} else {
|
|
2793
|
-
const l = {
|
|
2794
|
-
startRow: t,
|
|
2795
|
-
startCol: n,
|
|
2796
|
-
endRow: t,
|
|
2797
|
-
endCol: n
|
|
2798
|
-
};
|
|
2799
|
-
this.ranges = [l], this.activeRange = l, this.cellAnchor = { row: t, col: n };
|
|
2800
|
-
}
|
|
2801
|
-
return this.emit("selection-change", this.#i()), this.requestAfterRender(), !1;
|
|
2802
|
-
}
|
|
2803
|
-
return !1;
|
|
2804
|
-
}
|
|
2805
|
-
onKeyDown(e) {
|
|
2806
|
-
const { mode: t } = this.config;
|
|
2807
|
-
if (e.key === "Escape")
|
|
2808
|
-
return t === "cell" ? this.selectedCell = null : t === "row" ? (this.selected.clear(), this.anchor = null) : t === "range" && (this.ranges = [], this.activeRange = null, this.cellAnchor = null), this.emit("selection-change", this.#i()), this.requestAfterRender(), !0;
|
|
2809
|
-
if (t === "range" && e.key === "a" && (e.ctrlKey || e.metaKey)) {
|
|
2810
|
-
const n = this.rows.length, s = this.columns.length;
|
|
2811
|
-
if (n > 0 && s > 0) {
|
|
2812
|
-
const i = {
|
|
2813
|
-
startRow: 0,
|
|
2814
|
-
startCol: 0,
|
|
2815
|
-
endRow: n - 1,
|
|
2816
|
-
endCol: s - 1
|
|
2817
|
-
};
|
|
2818
|
-
return this.ranges = [i], this.activeRange = i, this.emit("selection-change", this.#i()), this.requestAfterRender(), !0;
|
|
2819
|
-
}
|
|
2820
|
-
}
|
|
2821
|
-
return !1;
|
|
2822
|
-
}
|
|
2823
|
-
onCellMouseDown(e) {
|
|
2824
|
-
if (this.config.mode !== "range" || e.rowIndex === void 0 || e.colIndex === void 0 || e.rowIndex < 0 || e.originalEvent.shiftKey && this.cellAnchor)
|
|
2825
|
-
return;
|
|
2826
|
-
this.isDragging = !0;
|
|
2827
|
-
const t = e.rowIndex, n = e.colIndex;
|
|
2828
|
-
this.cellAnchor = { row: t, col: n }, e.originalEvent.ctrlKey || e.originalEvent.metaKey || (this.ranges = []);
|
|
2829
|
-
const i = {
|
|
2830
|
-
startRow: t,
|
|
2831
|
-
startCol: n,
|
|
2832
|
-
endRow: t,
|
|
2833
|
-
endCol: n
|
|
2834
|
-
};
|
|
2835
|
-
return this.ranges.push(i), this.activeRange = i, this.emit("selection-change", this.#i()), this.requestAfterRender(), !0;
|
|
2836
|
-
}
|
|
2837
|
-
onCellMouseMove(e) {
|
|
2838
|
-
if (this.config.mode !== "range" || !this.isDragging || !this.cellAnchor || e.rowIndex === void 0 || e.colIndex === void 0 || e.rowIndex < 0) return;
|
|
2839
|
-
const t = le(this.cellAnchor, { row: e.rowIndex, col: e.colIndex });
|
|
2840
|
-
return this.ranges.length > 0 ? this.ranges[this.ranges.length - 1] = t : this.ranges.push(t), this.activeRange = t, this.emit("selection-change", this.#i()), this.requestAfterRender(), !0;
|
|
2841
|
-
}
|
|
2842
|
-
onCellMouseUp(e) {
|
|
2843
|
-
if (this.config.mode === "range" && this.isDragging)
|
|
2844
|
-
return this.isDragging = !1, !0;
|
|
2845
|
-
}
|
|
2846
|
-
/**
|
|
2847
|
-
* Apply selection classes to visible cells/rows.
|
|
2848
|
-
* Shared by afterRender and onScrollRender.
|
|
2849
|
-
*/
|
|
2850
|
-
#n() {
|
|
2851
|
-
const e = this.shadowRoot;
|
|
2852
|
-
if (!e) return;
|
|
2853
|
-
const { mode: t } = this.config;
|
|
2854
|
-
e.querySelectorAll(".cell").forEach((i) => {
|
|
2855
|
-
i.classList.remove("selected", "top", "bottom", "first", "last");
|
|
2856
|
-
});
|
|
2857
|
-
const s = e.querySelectorAll(".data-grid-row");
|
|
2858
|
-
if (s.forEach((i) => {
|
|
2859
|
-
i.classList.remove("selected", "row-focus");
|
|
2860
|
-
}), t === "row" && s.forEach((i) => {
|
|
2861
|
-
const r = i.querySelector(".cell[data-row]"), a = parseInt(r?.getAttribute("data-row") ?? "-1", 10);
|
|
2862
|
-
a >= 0 && this.selected.has(a) && (i.classList.add("selected", "row-focus"), i.querySelectorAll(".cell-focus").forEach((l) => l.classList.remove("cell-focus")));
|
|
2863
|
-
}), t === "range" && this.ranges.length > 0) {
|
|
2864
|
-
const i = this.activeRange ? I(this.activeRange) : null;
|
|
2865
|
-
e.querySelectorAll(".cell[data-row][data-col]").forEach((a) => {
|
|
2866
|
-
const l = parseInt(a.getAttribute("data-row") ?? "-1", 10), d = parseInt(a.getAttribute("data-col") ?? "-1", 10);
|
|
2867
|
-
l >= 0 && d >= 0 && re(l, d, this.ranges) && (a.classList.add("selected"), a.classList.remove("cell-focus"), i && (l === i.startRow && a.classList.add("top"), l === i.endRow && a.classList.add("bottom"), d === i.startCol && a.classList.add("first"), d === i.endCol && a.classList.add("last")));
|
|
2868
|
-
});
|
|
2869
|
-
}
|
|
2870
|
-
t === "cell" && this.selectedCell && e.querySelectorAll(".cell-focus").forEach((i) => i.classList.remove("cell-focus"));
|
|
2871
|
-
}
|
|
2872
|
-
afterRender() {
|
|
2873
|
-
const e = this.shadowRoot;
|
|
2874
|
-
if (!e) return;
|
|
2875
|
-
const t = e.children[0], { mode: n } = this.config;
|
|
2876
|
-
this.grid.setAttribute("data-selection-mode", n), t && t.classList.toggle("selecting", this.isDragging), this.#n();
|
|
2877
|
-
}
|
|
2878
|
-
/**
|
|
2879
|
-
* Called after scroll-triggered row rendering.
|
|
2880
|
-
* Reapplies selection classes to recycled DOM elements.
|
|
2881
|
-
*/
|
|
2882
|
-
onScrollRender() {
|
|
2883
|
-
this.#n();
|
|
2884
|
-
}
|
|
2885
|
-
// ===== Public API =====
|
|
2886
|
-
/**
|
|
2887
|
-
* Get the selected cell (cell mode only).
|
|
2888
|
-
*/
|
|
2889
|
-
getSelectedCell() {
|
|
2890
|
-
return this.selectedCell;
|
|
2891
|
-
}
|
|
2892
|
-
/**
|
|
2893
|
-
* Get all selected row indices (row mode).
|
|
2894
|
-
*/
|
|
2895
|
-
getSelectedRows() {
|
|
2896
|
-
return [...this.selected];
|
|
2897
|
-
}
|
|
2898
|
-
/**
|
|
2899
|
-
* Get all selected cell ranges in public format.
|
|
2900
|
-
*/
|
|
2901
|
-
getRanges() {
|
|
2902
|
-
return V(this.ranges);
|
|
2903
|
-
}
|
|
2904
|
-
/**
|
|
2905
|
-
* Get all selected cells across all ranges.
|
|
2906
|
-
*/
|
|
2907
|
-
getSelectedCells() {
|
|
2908
|
-
return it(this.ranges);
|
|
2909
|
-
}
|
|
2910
|
-
/**
|
|
2911
|
-
* Check if a specific cell is in range selection.
|
|
2912
|
-
*/
|
|
2913
|
-
isCellSelected(e, t) {
|
|
2914
|
-
return re(e, t, this.ranges);
|
|
2915
|
-
}
|
|
2916
|
-
/**
|
|
2917
|
-
* Clear all selection.
|
|
2918
|
-
*/
|
|
2919
|
-
clearSelection() {
|
|
2920
|
-
this.selectedCell = null, this.selected.clear(), this.anchor = null, this.ranges = [], this.activeRange = null, this.cellAnchor = null, this.emit("selection-change", { mode: this.config.mode, ranges: [] }), this.requestAfterRender();
|
|
2921
|
-
}
|
|
2922
|
-
/**
|
|
2923
|
-
* Set selected ranges programmatically.
|
|
2924
|
-
*/
|
|
2925
|
-
setRanges(e) {
|
|
2926
|
-
this.ranges = e.map((t) => ({
|
|
2927
|
-
startRow: t.from.row,
|
|
2928
|
-
startCol: t.from.col,
|
|
2929
|
-
endRow: t.to.row,
|
|
2930
|
-
endCol: t.to.col
|
|
2931
|
-
})), this.activeRange = this.ranges.length > 0 ? this.ranges[this.ranges.length - 1] : null, this.emit("selection-change", {
|
|
2932
|
-
mode: this.config.mode,
|
|
2933
|
-
ranges: V(this.ranges)
|
|
2934
|
-
}), this.requestAfterRender();
|
|
2935
|
-
}
|
|
2936
|
-
// ===== Private Helpers =====
|
|
2937
|
-
#i() {
|
|
2938
|
-
return lt(
|
|
2939
|
-
this.config.mode,
|
|
2940
|
-
{
|
|
2941
|
-
selectedCell: this.selectedCell,
|
|
2942
|
-
selected: this.selected,
|
|
2943
|
-
ranges: this.ranges
|
|
2944
|
-
},
|
|
2945
|
-
this.columns.length
|
|
2946
|
-
);
|
|
2947
|
-
}
|
|
2948
|
-
// ===== Styles =====
|
|
2949
|
-
styles = rt;
|
|
2950
|
-
}
|
|
2951
|
-
function X(o, e, t) {
|
|
2952
|
-
return o.id !== void 0 ? String(o.id) : t ? `${t}-${e}` : String(e);
|
|
2953
|
-
}
|
|
2954
|
-
function we(o, e, t, n = null, s = 0) {
|
|
2955
|
-
const i = e.childrenField ?? "children", r = [];
|
|
2956
|
-
for (let a = 0; a < o.length; a++) {
|
|
2957
|
-
const l = o[a], d = X(l, a, n), u = l[i], g = Array.isArray(u) && u.length > 0, h = t.has(d);
|
|
2958
|
-
if (r.push({
|
|
2959
|
-
key: d,
|
|
2960
|
-
data: l,
|
|
2961
|
-
depth: s,
|
|
2962
|
-
hasChildren: g,
|
|
2963
|
-
isExpanded: h,
|
|
2964
|
-
parentKey: n
|
|
2965
|
-
}), g && h) {
|
|
2966
|
-
const c = we(u, e, t, d, s + 1);
|
|
2967
|
-
r.push(...c);
|
|
2968
|
-
}
|
|
2969
|
-
}
|
|
2970
|
-
return r;
|
|
2971
|
-
}
|
|
2972
|
-
function ae(o, e) {
|
|
2973
|
-
const t = new Set(o);
|
|
2974
|
-
return t.has(e) ? t.delete(e) : t.add(e), t;
|
|
2975
|
-
}
|
|
2976
|
-
function F(o, e, t = null, n = 0) {
|
|
2977
|
-
const s = e.childrenField ?? "children", i = /* @__PURE__ */ new Set();
|
|
2978
|
-
for (let r = 0; r < o.length; r++) {
|
|
2979
|
-
const a = o[r], l = X(a, r, t), d = a[s];
|
|
2980
|
-
if (Array.isArray(d) && d.length > 0) {
|
|
2981
|
-
i.add(l);
|
|
2982
|
-
const u = F(d, e, l, n + 1);
|
|
2983
|
-
for (const g of u) i.add(g);
|
|
2984
|
-
}
|
|
2985
|
-
}
|
|
2986
|
-
return i;
|
|
2987
|
-
}
|
|
2988
|
-
function at() {
|
|
2989
|
-
return /* @__PURE__ */ new Set();
|
|
2990
|
-
}
|
|
2991
|
-
function be(o, e, t, n = null, s = 0) {
|
|
2992
|
-
const i = t.childrenField ?? "children";
|
|
2993
|
-
for (let r = 0; r < o.length; r++) {
|
|
2994
|
-
const a = o[r], l = X(a, r, n);
|
|
2995
|
-
if (l === e)
|
|
2996
|
-
return [l];
|
|
2997
|
-
const d = a[i];
|
|
2998
|
-
if (Array.isArray(d) && d.length > 0) {
|
|
2999
|
-
const u = be(d, e, t, l, s + 1);
|
|
3000
|
-
if (u)
|
|
3001
|
-
return [l, ...u];
|
|
3002
|
-
}
|
|
3003
|
-
}
|
|
3004
|
-
return null;
|
|
3005
|
-
}
|
|
3006
|
-
function ct(o, e, t, n) {
|
|
3007
|
-
const s = be(o, e, t);
|
|
3008
|
-
if (!s) return n;
|
|
3009
|
-
const i = new Set(n);
|
|
3010
|
-
for (let r = 0; r < s.length - 1; r++)
|
|
3011
|
-
i.add(s[r]);
|
|
3012
|
-
return i;
|
|
3013
|
-
}
|
|
3014
|
-
function ce(o, e = "children") {
|
|
3015
|
-
if (!Array.isArray(o) || o.length === 0) return !1;
|
|
3016
|
-
for (const t of o)
|
|
3017
|
-
if (t && Array.isArray(t[e]) && t[e].length > 0)
|
|
3018
|
-
return !0;
|
|
3019
|
-
return !1;
|
|
3020
|
-
}
|
|
3021
|
-
function dt(o) {
|
|
3022
|
-
if (!Array.isArray(o) || o.length === 0) return null;
|
|
3023
|
-
const e = ["children", "items", "nodes", "subRows", "nested"];
|
|
3024
|
-
for (const t of o)
|
|
3025
|
-
if (!(!t || typeof t != "object")) {
|
|
3026
|
-
for (const n of e)
|
|
3027
|
-
if (Array.isArray(t[n]) && t[n].length > 0)
|
|
3028
|
-
return n;
|
|
3029
|
-
}
|
|
3030
|
-
return null;
|
|
3031
|
-
}
|
|
3032
|
-
const ht = ".tree-toggle{cursor:pointer;user-select:none;transition:transform .2s}.tree-toggle:hover{color:var(--tbw-tree-accent, var(--tbw-color-accent))}";
|
|
3033
|
-
class pt extends ge {
|
|
3034
|
-
name = "tree";
|
|
3035
|
-
version = "1.0.0";
|
|
3036
|
-
get defaultConfig() {
|
|
3037
|
-
return {
|
|
3038
|
-
childrenField: "children",
|
|
3039
|
-
autoDetect: !0,
|
|
3040
|
-
defaultExpanded: !1,
|
|
3041
|
-
indentWidth: 20,
|
|
3042
|
-
showExpandIcons: !0
|
|
3043
|
-
};
|
|
3044
|
-
}
|
|
3045
|
-
// ===== Internal State =====
|
|
3046
|
-
/** Set of expanded row keys */
|
|
3047
|
-
expandedKeys = /* @__PURE__ */ new Set();
|
|
3048
|
-
/** Whether initial expansion (based on defaultExpanded config) has been applied */
|
|
3049
|
-
initialExpansionDone = !1;
|
|
3050
|
-
/** Flattened tree rows for rendering */
|
|
3051
|
-
flattenedRows = [];
|
|
3052
|
-
/** Map from key to flattened row for quick lookup */
|
|
3053
|
-
rowKeyMap = /* @__PURE__ */ new Map();
|
|
3054
|
-
// ===== Lifecycle =====
|
|
3055
|
-
detach() {
|
|
3056
|
-
this.expandedKeys.clear(), this.initialExpansionDone = !1, this.flattenedRows = [], this.rowKeyMap.clear();
|
|
3057
|
-
}
|
|
3058
|
-
// ===== Auto-Detection =====
|
|
3059
|
-
/**
|
|
3060
|
-
* Detects if tree functionality should be enabled based on data structure.
|
|
3061
|
-
* Called by the grid during plugin initialization.
|
|
3062
|
-
*/
|
|
3063
|
-
detect(e) {
|
|
3064
|
-
if (!this.config.autoDetect) return !1;
|
|
3065
|
-
const t = this.config.childrenField ?? dt(e) ?? "children";
|
|
3066
|
-
return ce(e, t);
|
|
3067
|
-
}
|
|
3068
|
-
// ===== Data Processing =====
|
|
3069
|
-
processRows(e) {
|
|
3070
|
-
const t = this.config.childrenField ?? "children";
|
|
3071
|
-
if (!ce(e, t))
|
|
3072
|
-
return this.flattenedRows = [], this.rowKeyMap.clear(), [...e];
|
|
3073
|
-
this.config.defaultExpanded && !this.initialExpansionDone && (this.expandedKeys = F(e, this.config), this.initialExpansionDone = !0), this.flattenedRows = we(e, this.config, this.expandedKeys), this.rowKeyMap.clear();
|
|
3074
|
-
for (const n of this.flattenedRows)
|
|
3075
|
-
this.rowKeyMap.set(n.key, n);
|
|
3076
|
-
return this.flattenedRows.map((n) => ({
|
|
3077
|
-
...n.data,
|
|
3078
|
-
__treeKey: n.key,
|
|
3079
|
-
__treeDepth: n.depth,
|
|
3080
|
-
__treeHasChildren: n.hasChildren,
|
|
3081
|
-
__treeExpanded: n.isExpanded
|
|
3082
|
-
}));
|
|
3083
|
-
}
|
|
3084
|
-
processColumns(e) {
|
|
3085
|
-
if (this.flattenedRows.length === 0) return [...e];
|
|
3086
|
-
const t = this.config.indentWidth ?? 20, n = this.config.showExpandIcons ?? !0, s = [...e];
|
|
3087
|
-
if (s.length > 0) {
|
|
3088
|
-
const i = { ...s[0] }, r = i.viewRenderer;
|
|
3089
|
-
if (r?.__treeWrapped)
|
|
3090
|
-
return s;
|
|
3091
|
-
const a = (l) => {
|
|
3092
|
-
const { value: d, row: u, column: g } = l, h = u.__treeDepth ?? 0, c = u.__treeHasChildren ?? !1, f = u.__treeExpanded ?? !1, p = document.createElement("span");
|
|
3093
|
-
if (p.style.display = "flex", p.style.alignItems = "center", p.style.paddingLeft = `${h * t}px`, c && n) {
|
|
3094
|
-
const m = document.createElement("span");
|
|
3095
|
-
m.className = "tree-toggle", this.setIcon(m, this.resolveIcon(f ? "collapse" : "expand")), m.style.cursor = "pointer", m.style.marginRight = "4px", m.style.fontSize = "10px", m.setAttribute("data-tree-key", u.__treeKey), p.appendChild(m);
|
|
3096
|
-
} else if (n) {
|
|
3097
|
-
const m = document.createElement("span");
|
|
3098
|
-
m.style.width = "14px", m.style.display = "inline-block", p.appendChild(m);
|
|
3099
|
-
}
|
|
3100
|
-
const w = document.createElement("span");
|
|
3101
|
-
if (r) {
|
|
3102
|
-
const m = r(l);
|
|
3103
|
-
m instanceof Node ? w.appendChild(m) : w.textContent = String(m ?? d ?? "");
|
|
3104
|
-
} else
|
|
3105
|
-
w.textContent = String(d ?? "");
|
|
3106
|
-
return p.appendChild(w), p;
|
|
3107
|
-
};
|
|
3108
|
-
a.__treeWrapped = !0, i.viewRenderer = a, s[0] = i;
|
|
3109
|
-
}
|
|
3110
|
-
return s;
|
|
3111
|
-
}
|
|
3112
|
-
// ===== Event Handlers =====
|
|
3113
|
-
onCellClick(e) {
|
|
3114
|
-
const t = e.originalEvent?.target;
|
|
3115
|
-
if (!t?.classList.contains("tree-toggle")) return !1;
|
|
3116
|
-
const n = t.getAttribute("data-tree-key");
|
|
3117
|
-
if (!n) return !1;
|
|
3118
|
-
const s = this.rowKeyMap.get(n);
|
|
3119
|
-
return s ? (this.expandedKeys = ae(this.expandedKeys, n), this.emit("tree-expand", {
|
|
3120
|
-
key: n,
|
|
3121
|
-
row: s.data,
|
|
3122
|
-
expanded: this.expandedKeys.has(n),
|
|
3123
|
-
depth: s.depth
|
|
3124
|
-
}), this.requestRender(), !0) : !1;
|
|
3125
|
-
}
|
|
3126
|
-
// ===== Public API =====
|
|
3127
|
-
/**
|
|
3128
|
-
* Expand a specific node by key.
|
|
3129
|
-
*/
|
|
3130
|
-
expand(e) {
|
|
3131
|
-
this.expandedKeys.add(e), this.requestRender();
|
|
3132
|
-
}
|
|
3133
|
-
/**
|
|
3134
|
-
* Collapse a specific node by key.
|
|
3135
|
-
*/
|
|
3136
|
-
collapse(e) {
|
|
3137
|
-
this.expandedKeys.delete(e), this.requestRender();
|
|
3138
|
-
}
|
|
3139
|
-
/**
|
|
3140
|
-
* Toggle the expansion state of a node.
|
|
3141
|
-
*/
|
|
3142
|
-
toggle(e) {
|
|
3143
|
-
this.expandedKeys = ae(this.expandedKeys, e), this.requestRender();
|
|
3144
|
-
}
|
|
3145
|
-
/**
|
|
3146
|
-
* Expand all nodes in the tree.
|
|
3147
|
-
*/
|
|
3148
|
-
expandAll() {
|
|
3149
|
-
this.expandedKeys = F(this.rows, this.config), this.requestRender();
|
|
3150
|
-
}
|
|
3151
|
-
/**
|
|
3152
|
-
* Collapse all nodes in the tree.
|
|
3153
|
-
*/
|
|
3154
|
-
collapseAll() {
|
|
3155
|
-
this.expandedKeys = at(), this.requestRender();
|
|
3156
|
-
}
|
|
3157
|
-
/**
|
|
3158
|
-
* Check if a node is currently expanded.
|
|
3159
|
-
*/
|
|
3160
|
-
isExpanded(e) {
|
|
3161
|
-
return this.expandedKeys.has(e);
|
|
3162
|
-
}
|
|
3163
|
-
/**
|
|
3164
|
-
* Get all currently expanded keys.
|
|
3165
|
-
*/
|
|
3166
|
-
getExpandedKeys() {
|
|
3167
|
-
return [...this.expandedKeys];
|
|
3168
|
-
}
|
|
3169
|
-
/**
|
|
3170
|
-
* Get the flattened tree rows with metadata.
|
|
3171
|
-
*/
|
|
3172
|
-
getFlattenedRows() {
|
|
3173
|
-
return [...this.flattenedRows];
|
|
3174
|
-
}
|
|
3175
|
-
/**
|
|
3176
|
-
* Get a row's original data by its key.
|
|
3177
|
-
*/
|
|
3178
|
-
getRowByKey(e) {
|
|
3179
|
-
return this.rowKeyMap.get(e)?.data;
|
|
3180
|
-
}
|
|
3181
|
-
/**
|
|
3182
|
-
* Expand all ancestors of a node to make it visible.
|
|
3183
|
-
*/
|
|
3184
|
-
expandToKey(e) {
|
|
3185
|
-
this.expandedKeys = ct(this.rows, e, this.config, this.expandedKeys), this.requestRender();
|
|
3186
|
-
}
|
|
3187
|
-
// ===== Styles =====
|
|
3188
|
-
styles = ht;
|
|
3189
|
-
}
|
|
3190
|
-
const E = {
|
|
2768
|
+
const A = {
|
|
3191
2769
|
// Root structure
|
|
3192
2770
|
ROOT: "tbw-grid-root",
|
|
3193
2771
|
HEADER: "header",
|
|
@@ -3232,31 +2810,31 @@ const E = {
|
|
|
3232
2810
|
// Selection
|
|
3233
2811
|
RANGE_SELECTION: "range-selection",
|
|
3234
2812
|
SELECTION_OVERLAY: "selection-overlay"
|
|
3235
|
-
},
|
|
2813
|
+
}, B = {
|
|
3236
2814
|
ROW_INDEX: "data-row-index",
|
|
3237
2815
|
COL_INDEX: "data-col-index",
|
|
3238
2816
|
FIELD: "data-field",
|
|
3239
2817
|
GROUP_KEY: "data-group-key",
|
|
3240
2818
|
TREE_LEVEL: "data-tree-level",
|
|
3241
2819
|
STICKY: "data-sticky"
|
|
3242
|
-
},
|
|
3243
|
-
ROOT: `.${
|
|
3244
|
-
HEADER: `.${
|
|
3245
|
-
HEADER_ROW: `.${
|
|
3246
|
-
HEADER_CELL: `.${
|
|
3247
|
-
ROWS_VIEWPORT: `.${
|
|
3248
|
-
ROWS_CONTAINER: `.${
|
|
3249
|
-
DATA_ROW: `.${
|
|
3250
|
-
DATA_CELL: `.${
|
|
3251
|
-
GROUP_ROW: `.${
|
|
2820
|
+
}, Ke = {
|
|
2821
|
+
ROOT: `.${A.ROOT}`,
|
|
2822
|
+
HEADER: `.${A.HEADER}`,
|
|
2823
|
+
HEADER_ROW: `.${A.HEADER_ROW}`,
|
|
2824
|
+
HEADER_CELL: `.${A.HEADER_CELL}`,
|
|
2825
|
+
ROWS_VIEWPORT: `.${A.ROWS_VIEWPORT}`,
|
|
2826
|
+
ROWS_CONTAINER: `.${A.ROWS_CONTAINER}`,
|
|
2827
|
+
DATA_ROW: `.${A.DATA_ROW}`,
|
|
2828
|
+
DATA_CELL: `.${A.DATA_CELL}`,
|
|
2829
|
+
GROUP_ROW: `.${A.GROUP_ROW}`,
|
|
3252
2830
|
// By data attribute
|
|
3253
|
-
ROW_BY_INDEX: (
|
|
3254
|
-
CELL_BY_FIELD: (
|
|
3255
|
-
CELL_AT: (
|
|
2831
|
+
ROW_BY_INDEX: (t) => `.${A.DATA_ROW}[${B.ROW_INDEX}="${t}"]`,
|
|
2832
|
+
CELL_BY_FIELD: (t) => `.${A.DATA_CELL}[${B.FIELD}="${t}"]`,
|
|
2833
|
+
CELL_AT: (t, e) => `.${A.DATA_ROW}[${B.ROW_INDEX}="${t}"] .${A.DATA_CELL}[${B.COL_INDEX}="${e}"]`,
|
|
3256
2834
|
// State selectors
|
|
3257
|
-
SELECTED_ROWS: `.${
|
|
3258
|
-
EDITING_CELL: `.${
|
|
3259
|
-
},
|
|
2835
|
+
SELECTED_ROWS: `.${A.DATA_ROW}.${A.SELECTED}`,
|
|
2836
|
+
EDITING_CELL: `.${A.DATA_CELL}.${A.EDITING}`
|
|
2837
|
+
}, Ye = {
|
|
3260
2838
|
// Colors
|
|
3261
2839
|
COLOR_BG: "--tbw-color-bg",
|
|
3262
2840
|
COLOR_FG: "--tbw-color-fg",
|
|
@@ -3278,7 +2856,7 @@ const E = {
|
|
|
3278
2856
|
// Borders
|
|
3279
2857
|
BORDER_RADIUS: "--tbw-border-radius",
|
|
3280
2858
|
FOCUS_OUTLINE: "--tbw-focus-outline"
|
|
3281
|
-
},
|
|
2859
|
+
}, Ze = {
|
|
3282
2860
|
CELL_COMMIT: "cell-commit",
|
|
3283
2861
|
ROW_COMMIT: "row-commit",
|
|
3284
2862
|
CHANGED_ROWS_RESET: "changed-rows-reset",
|
|
@@ -3289,7 +2867,7 @@ const E = {
|
|
|
3289
2867
|
ACTIVATE_CELL: "activate-cell",
|
|
3290
2868
|
GROUP_TOGGLE: "group-toggle",
|
|
3291
2869
|
COLUMN_STATE_CHANGE: "column-state-change"
|
|
3292
|
-
},
|
|
2870
|
+
}, Je = {
|
|
3293
2871
|
// Selection plugin
|
|
3294
2872
|
SELECTION_CHANGE: "selection-change",
|
|
3295
2873
|
// Tree plugin
|
|
@@ -3320,94 +2898,92 @@ const E = {
|
|
|
3320
2898
|
DETAIL_EXPAND: "detail-expand",
|
|
3321
2899
|
// Grouping rows plugin
|
|
3322
2900
|
GROUP_EXPAND: "group-expand"
|
|
3323
|
-
},
|
|
3324
|
-
sum: (
|
|
3325
|
-
avg: (
|
|
3326
|
-
const
|
|
3327
|
-
return
|
|
2901
|
+
}, F = {
|
|
2902
|
+
sum: (t, e) => t.reduce((o, n) => o + (Number(n[e]) || 0), 0),
|
|
2903
|
+
avg: (t, e) => {
|
|
2904
|
+
const o = t.reduce((n, i) => n + (Number(i[e]) || 0), 0);
|
|
2905
|
+
return t.length ? o / t.length : 0;
|
|
3328
2906
|
},
|
|
3329
|
-
count: (
|
|
3330
|
-
min: (
|
|
3331
|
-
max: (
|
|
3332
|
-
first: (
|
|
3333
|
-
last: (
|
|
3334
|
-
},
|
|
2907
|
+
count: (t) => t.length,
|
|
2908
|
+
min: (t, e) => Math.min(...t.map((o) => Number(o[e]) || 1 / 0)),
|
|
2909
|
+
max: (t, e) => Math.max(...t.map((o) => Number(o[e]) || -1 / 0)),
|
|
2910
|
+
first: (t, e) => t[0]?.[e],
|
|
2911
|
+
last: (t, e) => t[t.length - 1]?.[e]
|
|
2912
|
+
}, D = /* @__PURE__ */ new Map(), H = {
|
|
3335
2913
|
/**
|
|
3336
2914
|
* Register a custom aggregator function.
|
|
3337
2915
|
*/
|
|
3338
|
-
register(
|
|
3339
|
-
|
|
2916
|
+
register(t, e) {
|
|
2917
|
+
D.set(t, e);
|
|
3340
2918
|
},
|
|
3341
2919
|
/**
|
|
3342
2920
|
* Unregister a custom aggregator function.
|
|
3343
2921
|
*/
|
|
3344
|
-
unregister(
|
|
3345
|
-
|
|
2922
|
+
unregister(t) {
|
|
2923
|
+
D.delete(t);
|
|
3346
2924
|
},
|
|
3347
2925
|
/**
|
|
3348
2926
|
* Get an aggregator function by reference.
|
|
3349
2927
|
*/
|
|
3350
|
-
get(
|
|
3351
|
-
if (
|
|
3352
|
-
return typeof
|
|
2928
|
+
get(t) {
|
|
2929
|
+
if (t !== void 0)
|
|
2930
|
+
return typeof t == "function" ? t : D.get(t) ?? F[t];
|
|
3353
2931
|
},
|
|
3354
2932
|
/**
|
|
3355
2933
|
* Run an aggregator on a set of rows.
|
|
3356
2934
|
*/
|
|
3357
|
-
run(
|
|
3358
|
-
const
|
|
3359
|
-
return
|
|
2935
|
+
run(t, e, o, n) {
|
|
2936
|
+
const i = this.get(t);
|
|
2937
|
+
return i ? i(e, o, n) : void 0;
|
|
3360
2938
|
},
|
|
3361
2939
|
/**
|
|
3362
2940
|
* Check if an aggregator exists.
|
|
3363
2941
|
*/
|
|
3364
|
-
has(
|
|
3365
|
-
return
|
|
2942
|
+
has(t) {
|
|
2943
|
+
return D.has(t) || t in F;
|
|
3366
2944
|
},
|
|
3367
2945
|
/**
|
|
3368
2946
|
* List all available aggregator names.
|
|
3369
2947
|
*/
|
|
3370
2948
|
list() {
|
|
3371
|
-
return [...Object.keys(
|
|
3372
|
-
}
|
|
3373
|
-
},
|
|
3374
|
-
sum: (
|
|
3375
|
-
avg: (
|
|
3376
|
-
count: (
|
|
3377
|
-
min: (
|
|
3378
|
-
max: (
|
|
3379
|
-
first: (
|
|
3380
|
-
last: (
|
|
2949
|
+
return [...Object.keys(F), ...D.keys()];
|
|
2950
|
+
}
|
|
2951
|
+
}, se = {
|
|
2952
|
+
sum: (t) => t.reduce((e, o) => e + o, 0),
|
|
2953
|
+
avg: (t) => t.length ? t.reduce((e, o) => e + o, 0) / t.length : 0,
|
|
2954
|
+
count: (t) => t.length,
|
|
2955
|
+
min: (t) => t.length ? Math.min(...t) : 0,
|
|
2956
|
+
max: (t) => t.length ? Math.max(...t) : 0,
|
|
2957
|
+
first: (t) => t[0] ?? 0,
|
|
2958
|
+
last: (t) => t[t.length - 1] ?? 0
|
|
3381
2959
|
};
|
|
3382
|
-
function
|
|
3383
|
-
return
|
|
2960
|
+
function Xe(t) {
|
|
2961
|
+
return se[t] ?? se.sum;
|
|
3384
2962
|
}
|
|
3385
|
-
function
|
|
3386
|
-
return
|
|
2963
|
+
function Qe(t, e) {
|
|
2964
|
+
return Xe(t)(e);
|
|
3387
2965
|
}
|
|
3388
|
-
const
|
|
2966
|
+
const et = H.register.bind(H), tt = H.unregister.bind(H), ot = H.get.bind(H), nt = H.run.bind(H), it = H.list.bind(H);
|
|
3389
2967
|
export {
|
|
3390
|
-
|
|
3391
|
-
|
|
3392
|
-
|
|
3393
|
-
|
|
3394
|
-
|
|
3395
|
-
|
|
3396
|
-
|
|
3397
|
-
|
|
3398
|
-
|
|
3399
|
-
|
|
3400
|
-
|
|
3401
|
-
|
|
3402
|
-
|
|
3403
|
-
|
|
3404
|
-
|
|
3405
|
-
|
|
3406
|
-
|
|
3407
|
-
|
|
3408
|
-
|
|
3409
|
-
|
|
3410
|
-
vt as runValueAggregator,
|
|
3411
|
-
Ct as unregisterAggregator
|
|
2968
|
+
je as BaseGridPlugin,
|
|
2969
|
+
P as DEFAULT_GRID_ICONS,
|
|
2970
|
+
Ze as DGEvents,
|
|
2971
|
+
G as DataGridElement,
|
|
2972
|
+
q as FitModeEnum,
|
|
2973
|
+
Ye as GridCSSVars,
|
|
2974
|
+
A as GridClasses,
|
|
2975
|
+
B as GridDataAttrs,
|
|
2976
|
+
G as GridElement,
|
|
2977
|
+
Ke as GridSelectors,
|
|
2978
|
+
Je as PluginEvents,
|
|
2979
|
+
Ue as PluginManager,
|
|
2980
|
+
H as aggregatorRegistry,
|
|
2981
|
+
ot as getAggregator,
|
|
2982
|
+
Xe as getValueAggregator,
|
|
2983
|
+
it as listAggregators,
|
|
2984
|
+
et as registerAggregator,
|
|
2985
|
+
nt as runAggregator,
|
|
2986
|
+
Qe as runValueAggregator,
|
|
2987
|
+
tt as unregisterAggregator
|
|
3412
2988
|
};
|
|
3413
2989
|
//# sourceMappingURL=index.js.map
|