@toolbox-web/grid 0.2.4 → 0.2.6
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/all.d.ts +61 -23
- package/all.js +841 -809
- package/all.js.map +1 -1
- package/index.d.ts +17 -5
- package/index.js +316 -247
- package/index.js.map +1 -1
- package/lib/plugins/clipboard/index.js +1 -1
- package/lib/plugins/clipboard/index.js.map +1 -1
- package/lib/plugins/column-virtualization/index.js +1 -1
- package/lib/plugins/column-virtualization/index.js.map +1 -1
- package/lib/plugins/context-menu/index.js +1 -1
- package/lib/plugins/context-menu/index.js.map +1 -1
- package/lib/plugins/export/index.js +1 -1
- package/lib/plugins/export/index.js.map +1 -1
- package/lib/plugins/filtering/index.js +1 -1
- package/lib/plugins/filtering/index.js.map +1 -1
- package/lib/plugins/grouping-columns/index.js +46 -45
- package/lib/plugins/grouping-columns/index.js.map +1 -1
- package/lib/plugins/grouping-rows/index.js +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 +1 -1
- package/lib/plugins/multi-sort/index.js.map +1 -1
- package/lib/plugins/pinned-columns/index.js +1 -1
- package/lib/plugins/pinned-columns/index.js.map +1 -1
- package/lib/plugins/pinned-rows/index.js +55 -47
- package/lib/plugins/pinned-rows/index.js.map +1 -1
- package/lib/plugins/pivot/index.js +243 -241
- package/lib/plugins/pivot/index.js.map +1 -1
- package/lib/plugins/reorder/index.js +87 -67
- package/lib/plugins/reorder/index.js.map +1 -1
- package/lib/plugins/selection/index.js +28 -27
- package/lib/plugins/selection/index.js.map +1 -1
- package/lib/plugins/server-side/index.js +2 -2
- package/lib/plugins/server-side/index.js.map +1 -1
- package/lib/plugins/tree/index.js +70 -70
- package/lib/plugins/tree/index.js.map +1 -1
- package/lib/plugins/undo-redo/index.js +1 -1
- package/lib/plugins/undo-redo/index.js.map +1 -1
- package/lib/plugins/visibility/index.js +1 -1
- package/lib/plugins/visibility/index.js.map +1 -1
- package/package.json +1 -1
- package/themes/dg-theme-bootstrap.css +0 -2
- package/themes/dg-theme-contrast.css +0 -1
- package/themes/dg-theme-large.css +0 -1
- package/themes/dg-theme-material.css +0 -2
- package/themes/dg-theme-standard.css +0 -1
- package/themes/dg-theme-vibrant.css +0 -1
- package/umd/grid.all.umd.js +13 -13
- package/umd/grid.all.umd.js.map +1 -1
- package/umd/grid.umd.js +7 -7
- package/umd/grid.umd.js.map +1 -1
- package/umd/plugins/grouping-columns.umd.js +1 -1
- package/umd/plugins/grouping-columns.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/reorder.umd.js +1 -1
- package/umd/plugins/reorder.umd.js.map +1 -1
- package/umd/plugins/selection.umd.js +1 -1
- package/umd/plugins/selection.umd.js.map +1 -1
- package/umd/plugins/server-side.umd.js +1 -1
- package/umd/plugins/server-side.umd.js.map +1 -1
- package/umd/plugins/tree.umd.js +1 -1
- package/umd/plugins/tree.umd.js.map +1 -1
package/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const fe = ":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-cell-white-space: nowrap;--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:block;padding:var(--tbw-cell-padding, 2px 8px);border-bottom:var(--tbw-row-divider);min-height:var(--tbw-row-height);line-height:calc(var(--tbw-row-height) - 5px);border-right:1px solid var(--tbw-color-border-cell);overflow:hidden;min-width:0;white-space:var(--tbw-cell-white-space, nowrap);text-overflow:ellipsis}:host .data-grid-row>.cell>*{overflow:hidden;text-overflow:ellipsis;white-space:inherit;min-width:0}:host .data-grid-row>.cell:last-child{border-right:0}:host .data-grid-row>.cell[data-type=boolean]{text-align:center}:host .data-grid-row>.cell[data-type=boolean] input[type=checkbox]{margin:0;width:var(--tbw-checkbox-size);height:var(--tbw-checkbox-size);vertical-align:middle}:host .data-grid-row>.cell.editing{overflow:hidden;padding:0;display:flex}: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}";
|
|
1
|
+
const fe = ":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-cell-white-space: nowrap;--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: 6px;--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:not(:last-child),:host .header-row>.cell.grouped.group-end:not(:last-child){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:block;padding:var(--tbw-cell-padding, 2px 8px);border-bottom:var(--tbw-row-divider);min-height:var(--tbw-row-height);line-height:calc(var(--tbw-row-height) - 5px);border-right:1px solid var(--tbw-color-border-cell);overflow:hidden;min-width:0;white-space:var(--tbw-cell-white-space, nowrap);text-overflow:ellipsis}:host .data-grid-row>.cell>*{overflow:hidden;text-overflow:ellipsis;white-space:inherit;min-width:0}:host .data-grid-row>.cell:last-child{border-right:0}:host .data-grid-row>.cell[data-type=boolean]{text-align:center}:host .data-grid-row>.cell[data-type=boolean] input[type=checkbox]{margin:0;width:var(--tbw-checkbox-size);height:var(--tbw-checkbox-size);vertical-align:middle}:host .data-grid-row>.cell.editing{overflow:hidden;padding:0;display:flex}: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
2
|
function pe(t) {
|
|
3
3
|
const e = /* @__PURE__ */ new Map();
|
|
4
4
|
return t._sortState && e.set(t._sortState.field, {
|
|
@@ -125,9 +125,9 @@ function F(t) {
|
|
|
125
125
|
if (!t || typeof t != "string") return "";
|
|
126
126
|
if (t.indexOf("<") === -1) return t;
|
|
127
127
|
const e = document.createElement("template");
|
|
128
|
-
return e.innerHTML = t,
|
|
128
|
+
return e.innerHTML = t, Se(e.content), e.innerHTML;
|
|
129
129
|
}
|
|
130
|
-
function
|
|
130
|
+
function Se(t) {
|
|
131
131
|
const e = [], o = t.querySelectorAll("*");
|
|
132
132
|
for (const i of o) {
|
|
133
133
|
const n = i.tagName.toLowerCase();
|
|
@@ -164,12 +164,12 @@ function Re(t) {
|
|
|
164
164
|
function ue(t, e) {
|
|
165
165
|
if (!t || t.indexOf("{{") === -1) return t;
|
|
166
166
|
const o = [], i = t.replace(me, (l, a) => {
|
|
167
|
-
const d =
|
|
167
|
+
const d = Re(a, e);
|
|
168
168
|
return o.push({ expr: a.trim(), result: d }), d;
|
|
169
169
|
}), n = xe(i), s = o.length && o.every((l) => l.result === "" || l.result === L);
|
|
170
170
|
return /Reflect\.|\bProxy\b|ownKeys\(/.test(t) || s ? "" : n;
|
|
171
171
|
}
|
|
172
|
-
function
|
|
172
|
+
function Re(t, e) {
|
|
173
173
|
if (t = (t || "").trim(), !t || /\b(Reflect|Proxy|ownKeys)\b/.test(t)) return L;
|
|
174
174
|
if (t === "value") return e.value == null ? L : String(e.value);
|
|
175
175
|
if (t.startsWith("row.") && !/[()?]/.test(t) && !t.includes(":")) {
|
|
@@ -234,7 +234,7 @@ function Le(t, e) {
|
|
|
234
234
|
});
|
|
235
235
|
return Object.keys(o).forEach((n) => i.push(o[n])), i;
|
|
236
236
|
}
|
|
237
|
-
function
|
|
237
|
+
function Y(t, e) {
|
|
238
238
|
try {
|
|
239
239
|
t.part?.add?.(e);
|
|
240
240
|
} catch {
|
|
@@ -271,9 +271,9 @@ function te(t) {
|
|
|
271
271
|
}
|
|
272
272
|
}
|
|
273
273
|
l > 0 && (n.width = l + 2, n.__autoSized = !0, i = !0);
|
|
274
|
-
}), i &&
|
|
274
|
+
}), i && z(t), t.__didInitialAutoSize = !0;
|
|
275
275
|
}
|
|
276
|
-
function
|
|
276
|
+
function z(t) {
|
|
277
277
|
(t.effectiveConfig?.fitMode || t.fitMode || $.STRETCH) === $.STRETCH ? t._gridTemplate = t._visibleColumns.map((o) => {
|
|
278
278
|
if (o.width) return `${o.width}px`;
|
|
279
279
|
const i = o.minWidth;
|
|
@@ -331,7 +331,7 @@ function He(t) {
|
|
|
331
331
|
};
|
|
332
332
|
}
|
|
333
333
|
}
|
|
334
|
-
function
|
|
334
|
+
function ke(t, e) {
|
|
335
335
|
if (t._dispatchKeyDown?.(e))
|
|
336
336
|
return;
|
|
337
337
|
const o = t._rows.length - 1, i = t._visibleColumns.length - 1, n = 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 = (f) => {
|
|
@@ -342,7 +342,7 @@ function Oe(t, e) {
|
|
|
342
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")) && !(n && (r === "select" || r === "typeahead") && (e.key === "ArrowDown" || e.key === "ArrowUp"))) {
|
|
343
343
|
switch (e.key) {
|
|
344
344
|
case "Tab": {
|
|
345
|
-
e.preventDefault(), !e.shiftKey ? t._focusCol < i ? 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 = i),
|
|
345
|
+
e.preventDefault(), !e.shiftKey ? t._focusCol < i ? 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 = i), M(t);
|
|
346
346
|
return;
|
|
347
347
|
}
|
|
348
348
|
case "ArrowDown":
|
|
@@ -358,10 +358,10 @@ function Oe(t, e) {
|
|
|
358
358
|
t._focusCol = Math.max(0, t._focusCol - 1), e.preventDefault();
|
|
359
359
|
break;
|
|
360
360
|
case "Home":
|
|
361
|
-
(e.ctrlKey || e.metaKey) && (n && typeof t.commitActiveRowEdit == "function" && t.commitActiveRowEdit(), t._focusRow = 0), t._focusCol = 0, e.preventDefault(),
|
|
361
|
+
(e.ctrlKey || e.metaKey) && (n && typeof t.commitActiveRowEdit == "function" && t.commitActiveRowEdit(), t._focusRow = 0), t._focusCol = 0, e.preventDefault(), M(t, { forceScrollLeft: !0 });
|
|
362
362
|
return;
|
|
363
363
|
case "End":
|
|
364
|
-
(e.ctrlKey || e.metaKey) && (n && typeof t.commitActiveRowEdit == "function" && t.commitActiveRowEdit(), t._focusRow = o), t._focusCol = i, e.preventDefault(),
|
|
364
|
+
(e.ctrlKey || e.metaKey) && (n && typeof t.commitActiveRowEdit == "function" && t.commitActiveRowEdit(), t._focusRow = o), t._focusCol = i, e.preventDefault(), M(t, { forceScrollRight: !0 });
|
|
365
365
|
return;
|
|
366
366
|
case "PageDown":
|
|
367
367
|
t._focusRow = Math.min(o, t._focusRow + 20), e.preventDefault();
|
|
@@ -372,14 +372,14 @@ function Oe(t, e) {
|
|
|
372
372
|
case "Enter":
|
|
373
373
|
return typeof t.beginBulkEdit == "function" ? t.beginBulkEdit(t._focusRow) : t.dispatchEvent(
|
|
374
374
|
new CustomEvent("activate-cell", { detail: { row: t._focusRow, col: t._focusCol } })
|
|
375
|
-
),
|
|
375
|
+
), M(t);
|
|
376
376
|
default:
|
|
377
377
|
return;
|
|
378
378
|
}
|
|
379
|
-
|
|
379
|
+
M(t);
|
|
380
380
|
}
|
|
381
381
|
}
|
|
382
|
-
function
|
|
382
|
+
function M(t, e) {
|
|
383
383
|
if (t._virtualization?.enabled) {
|
|
384
384
|
const { rowHeight: r, container: l, viewportEl: a } = t._virtualization, d = l, f = a?.clientHeight ?? d?.clientHeight ?? 0;
|
|
385
385
|
if (d && f > 0) {
|
|
@@ -427,11 +427,11 @@ function z(t, e) {
|
|
|
427
427
|
}
|
|
428
428
|
}
|
|
429
429
|
}
|
|
430
|
-
const
|
|
431
|
-
function
|
|
432
|
-
t[
|
|
430
|
+
const Oe = "__cellDisplayCache", Me = "__cellCacheEpoch";
|
|
431
|
+
function j(t) {
|
|
432
|
+
t[Oe] = void 0, t[Me] = void 0, t.__hasSpecialColumns = void 0;
|
|
433
433
|
}
|
|
434
|
-
function
|
|
434
|
+
function ze(t, e, o, i, n) {
|
|
435
435
|
const s = Math.max(0, o - e), r = t._bodyEl, l = t._visibleColumns, a = l.length;
|
|
436
436
|
let d = t.__cachedHeaderRowCount;
|
|
437
437
|
for (d === void 0 && (d = t.shadowRoot?.querySelector(".header-group-row") ? 2 : 1, t.__cachedHeaderRowCount = d); t._rowPool.length < s; ) {
|
|
@@ -452,48 +452,48 @@ function Me(t, e, o, i, n) {
|
|
|
452
452
|
u.__epoch = i, u.__rowDataRef = c, u.parentNode !== r && r.appendChild(u);
|
|
453
453
|
continue;
|
|
454
454
|
}
|
|
455
|
-
const b = u.__epoch, w = u.__rowDataRef, v = u.children.length,
|
|
455
|
+
const b = u.__epoch, w = u.__rowDataRef, v = u.children.length, R = b === i && v === a, E = w !== c;
|
|
456
456
|
let g = !1;
|
|
457
|
-
if (
|
|
457
|
+
if (R && E) {
|
|
458
458
|
for (let _ = 0; _ < a; _++)
|
|
459
459
|
if (l[_].externalView && !u.querySelector(`.cell[data-col="${_}"] [data-external-view]`)) {
|
|
460
460
|
g = !0;
|
|
461
461
|
break;
|
|
462
462
|
}
|
|
463
463
|
}
|
|
464
|
-
if (!
|
|
465
|
-
const _ = u.querySelector(".cell.editing"),
|
|
466
|
-
if (_ && !
|
|
467
|
-
u.__isCustomRow && (u.className = "data-grid-row", u.setAttribute("role", "row"), u.__isCustomRow = !1),
|
|
468
|
-
else if (_ &&
|
|
464
|
+
if (!R || g) {
|
|
465
|
+
const _ = u.querySelector(".cell.editing"), y = t._activeEditRows === p;
|
|
466
|
+
if (_ && !y)
|
|
467
|
+
u.__isCustomRow && (u.className = "data-grid-row", u.setAttribute("role", "row"), u.__isCustomRow = !1), N(t, u, c, p), u.__epoch = i, u.__rowDataRef = c;
|
|
468
|
+
else if (_ && y)
|
|
469
469
|
U(t, u, c, p), u.__rowDataRef = c;
|
|
470
|
-
else if (u.__isCustomRow && (u.className = "data-grid-row", u.setAttribute("role", "row"), u.__isCustomRow = !1),
|
|
471
|
-
const
|
|
472
|
-
for (let A = 0; A <
|
|
470
|
+
else if (u.__isCustomRow && (u.className = "data-grid-row", u.setAttribute("role", "row"), u.__isCustomRow = !1), N(t, u, c, p), u.__epoch = i, u.__rowDataRef = c, y) {
|
|
471
|
+
const x = u.children;
|
|
472
|
+
for (let A = 0; A < x.length; A++) {
|
|
473
473
|
const P = t._visibleColumns[A];
|
|
474
|
-
P && P.editable &&
|
|
474
|
+
P && P.editable && k(t, c, p, P, x[A]);
|
|
475
475
|
}
|
|
476
476
|
}
|
|
477
|
-
} else if (
|
|
478
|
-
const _ = u.querySelector(".cell.editing"),
|
|
479
|
-
if (_ && !
|
|
480
|
-
|
|
481
|
-
else if (U(t, u, c, p), u.__rowDataRef = c,
|
|
482
|
-
const
|
|
483
|
-
for (let A = 0; A <
|
|
477
|
+
} else if (E) {
|
|
478
|
+
const _ = u.querySelector(".cell.editing"), y = t._activeEditRows === p;
|
|
479
|
+
if (_ && !y)
|
|
480
|
+
N(t, u, c, p), u.__epoch = i, u.__rowDataRef = c;
|
|
481
|
+
else if (U(t, u, c, p), u.__rowDataRef = c, y && !_) {
|
|
482
|
+
const x = u.children;
|
|
483
|
+
for (let A = 0; A < x.length; A++) {
|
|
484
484
|
const P = t._visibleColumns[A];
|
|
485
|
-
P && P.editable &&
|
|
485
|
+
P && P.editable && k(t, c, p, P, x[A]);
|
|
486
486
|
}
|
|
487
487
|
}
|
|
488
488
|
} else {
|
|
489
|
-
const _ = u.querySelector(".cell.editing"),
|
|
490
|
-
if (_ && !
|
|
491
|
-
|
|
492
|
-
else if (U(t, u, c, p),
|
|
493
|
-
const
|
|
494
|
-
for (let A = 0; A <
|
|
489
|
+
const _ = u.querySelector(".cell.editing"), y = t._activeEditRows === p;
|
|
490
|
+
if (_ && !y)
|
|
491
|
+
N(t, u, c, p), u.__epoch = i, u.__rowDataRef = c;
|
|
492
|
+
else if (U(t, u, c, p), y && !_) {
|
|
493
|
+
const x = u.children;
|
|
494
|
+
for (let A = 0; A < x.length; A++) {
|
|
495
495
|
const P = t._visibleColumns[A];
|
|
496
|
-
P && P.editable &&
|
|
496
|
+
P && P.editable && k(t, c, p, P, x[A]);
|
|
497
497
|
}
|
|
498
498
|
}
|
|
499
499
|
}
|
|
@@ -527,7 +527,7 @@ function U(t, e, o, i) {
|
|
|
527
527
|
}
|
|
528
528
|
for (let c = 0; c < a; c++)
|
|
529
529
|
if (s[c].externalView && !n[c].querySelector("[data-external-view]")) {
|
|
530
|
-
|
|
530
|
+
N(t, e, o, i);
|
|
531
531
|
return;
|
|
532
532
|
}
|
|
533
533
|
for (let c = 0; c < a; c++) {
|
|
@@ -536,44 +536,44 @@ function U(t, e, o, i) {
|
|
|
536
536
|
const w = d === i && f === c, v = b.classList.contains("cell-focus");
|
|
537
537
|
if (w !== v && (b.classList.toggle("cell-focus", w), b.setAttribute("aria-selected", String(w))), b.classList.contains("editing")) continue;
|
|
538
538
|
if (u.viewRenderer) {
|
|
539
|
-
const
|
|
540
|
-
typeof g == "string" ? b.innerHTML = F(g) : g ? (b.innerHTML = "", b.appendChild(g)) : b.textContent =
|
|
539
|
+
const E = o[u.field], g = u.viewRenderer({ row: o, value: E, field: u.field, column: u });
|
|
540
|
+
typeof g == "string" ? b.innerHTML = F(g) : g ? (b.innerHTML = "", b.appendChild(g)) : b.textContent = E == null ? "" : String(E);
|
|
541
541
|
continue;
|
|
542
542
|
}
|
|
543
543
|
if (u.__viewTemplate || u.__compiledView || u.externalView)
|
|
544
544
|
continue;
|
|
545
|
-
const
|
|
546
|
-
let
|
|
545
|
+
const S = o[u.field];
|
|
546
|
+
let R;
|
|
547
547
|
if (u.format)
|
|
548
548
|
try {
|
|
549
|
-
const
|
|
550
|
-
|
|
549
|
+
const E = u.format(S, o);
|
|
550
|
+
R = E == null ? "" : String(E);
|
|
551
551
|
} catch {
|
|
552
|
-
|
|
552
|
+
R = S == null ? "" : String(S);
|
|
553
553
|
}
|
|
554
554
|
else if (u.type === "date") {
|
|
555
|
-
if (
|
|
556
|
-
|
|
557
|
-
else if (
|
|
558
|
-
|
|
555
|
+
if (S == null || S === "")
|
|
556
|
+
R = "";
|
|
557
|
+
else if (S instanceof Date)
|
|
558
|
+
R = isNaN(S.getTime()) ? "" : S.toLocaleDateString();
|
|
559
559
|
else {
|
|
560
|
-
const
|
|
561
|
-
|
|
560
|
+
const E = new Date(S);
|
|
561
|
+
R = isNaN(E.getTime()) ? "" : E.toLocaleDateString();
|
|
562
562
|
}
|
|
563
|
-
b.textContent =
|
|
563
|
+
b.textContent = R;
|
|
564
564
|
} else if (u.type === "boolean") {
|
|
565
|
-
const
|
|
566
|
-
b.innerHTML = `<span role="checkbox" aria-checked="${
|
|
565
|
+
const E = !!S;
|
|
566
|
+
b.innerHTML = `<span role="checkbox" aria-checked="${E}" aria-label="${E}">${E ? "🗹" : "☐"}</span>`;
|
|
567
567
|
} else
|
|
568
|
-
|
|
568
|
+
R = S == null ? "" : String(S), b.textContent = R;
|
|
569
569
|
}
|
|
570
570
|
}
|
|
571
|
-
function
|
|
571
|
+
function N(t, e, o, i) {
|
|
572
572
|
e.innerHTML = "";
|
|
573
573
|
const n = t._visibleColumns, s = n.length, r = t._focusRow, l = t._focusCol, a = t.effectiveConfig?.editOn || t.editOn, d = t, f = document.createDocumentFragment();
|
|
574
574
|
for (let h = 0; h < s; h++) {
|
|
575
575
|
const p = n[h], c = document.createElement("div");
|
|
576
|
-
c.className = "cell",
|
|
576
|
+
c.className = "cell", Y(c, "cell"), c.setAttribute("role", "gridcell"), c.setAttribute("aria-colindex", String(h + 1)), c.setAttribute("data-col", String(h)), c.setAttribute("data-row", String(i)), c.setAttribute("data-field", p.field), p.type, p.type && c.setAttribute("data-type", p.type);
|
|
577
577
|
let u = o[p.field];
|
|
578
578
|
const b = p.format;
|
|
579
579
|
if (b)
|
|
@@ -581,13 +581,13 @@ function D(t, e, o, i) {
|
|
|
581
581
|
u = b(u, o);
|
|
582
582
|
} catch {
|
|
583
583
|
}
|
|
584
|
-
const w = p.__compiledView, v = p.__viewTemplate,
|
|
585
|
-
let
|
|
586
|
-
if (
|
|
587
|
-
const g =
|
|
588
|
-
typeof g == "string" ? (c.innerHTML = F(g),
|
|
589
|
-
} else if (
|
|
590
|
-
const g =
|
|
584
|
+
const w = p.__compiledView, v = p.__viewTemplate, S = p.viewRenderer, R = p.externalView;
|
|
585
|
+
let E = !1;
|
|
586
|
+
if (S) {
|
|
587
|
+
const g = S({ row: o, value: u, field: p.field, column: p });
|
|
588
|
+
typeof g == "string" ? (c.innerHTML = F(g), E = !0) : g ? c.appendChild(g) : c.textContent = u == null ? "" : String(u);
|
|
589
|
+
} else if (R) {
|
|
590
|
+
const g = R, m = document.createElement("div");
|
|
591
591
|
m.setAttribute("data-external-view", ""), m.setAttribute("data-field", p.field), c.appendChild(m);
|
|
592
592
|
const C = { row: o, value: u, field: p.field, column: p };
|
|
593
593
|
if (g.mount)
|
|
@@ -611,10 +611,10 @@ function D(t, e, o, i) {
|
|
|
611
611
|
m.setAttribute("data-mounted", "");
|
|
612
612
|
} else if (w) {
|
|
613
613
|
const g = w({ row: o, value: u, field: p.field, column: p }), m = w.__blocked;
|
|
614
|
-
c.innerHTML = m ? "" : F(g),
|
|
614
|
+
c.innerHTML = m ? "" : F(g), E = !0, m && (c.textContent = "", c.setAttribute("data-blocked-template", ""));
|
|
615
615
|
} else if (v) {
|
|
616
616
|
const g = v.innerHTML;
|
|
617
|
-
/Reflect\.|\bProxy\b|ownKeys\(/.test(g) ? (c.textContent = "", c.setAttribute("data-blocked-template", "")) : (c.innerHTML = F(ue(g, { row: o, value: u })),
|
|
617
|
+
/Reflect\.|\bProxy\b|ownKeys\(/.test(g) ? (c.textContent = "", c.setAttribute("data-blocked-template", "")) : (c.innerHTML = F(ue(g, { row: o, value: u })), E = !0);
|
|
618
618
|
} else if (p.type === "date")
|
|
619
619
|
if (u == null || u === "")
|
|
620
620
|
c.textContent = "";
|
|
@@ -632,7 +632,7 @@ function D(t, e, o, i) {
|
|
|
632
632
|
c.innerHTML = `<span role="checkbox" aria-checked="${g}" aria-label="${g}">${g ? "🗹" : "☐"}</span>`;
|
|
633
633
|
} else
|
|
634
634
|
c.textContent = u == null ? "" : String(u);
|
|
635
|
-
if (
|
|
635
|
+
if (E) {
|
|
636
636
|
Ae(c);
|
|
637
637
|
const g = c.textContent || "";
|
|
638
638
|
/Proxy|Reflect\.ownKeys/.test(g) && (c.textContent = g.replace(/Proxy|Reflect\.ownKeys/g, "").trim(), /Proxy|Reflect\.ownKeys/.test(c.textContent || "") && (c.textContent = ""));
|
|
@@ -640,14 +640,14 @@ function D(t, e, o, i) {
|
|
|
640
640
|
c.hasAttribute("data-blocked-template") && (c.textContent || "").trim().length && (c.textContent = ""), p.editable ? (c.tabIndex = 0, c.addEventListener("mousedown", () => {
|
|
641
641
|
if (c.classList.contains("editing")) return;
|
|
642
642
|
const g = Number(c.getAttribute("data-row")), m = Number(c.getAttribute("data-col"));
|
|
643
|
-
isNaN(g) || isNaN(m) || (t._focusRow = g, t._focusCol = m,
|
|
643
|
+
isNaN(g) || isNaN(m) || (t._focusRow = g, t._focusCol = m, M(t));
|
|
644
644
|
}), a === "click" ? c.addEventListener("click", (g) => {
|
|
645
645
|
if (c.classList.contains("editing")) return;
|
|
646
646
|
g.stopPropagation();
|
|
647
647
|
const m = Number(c.getAttribute("data-row")), C = Number(c.getAttribute("data-col"));
|
|
648
648
|
if (isNaN(m) || isNaN(C)) return;
|
|
649
|
-
const _ = t._rows[m],
|
|
650
|
-
!_ || !
|
|
649
|
+
const _ = t._rows[m], y = t._visibleColumns[C];
|
|
650
|
+
!_ || !y || (t._focusRow = m, t._focusCol = C, k(t, _, m, y, c));
|
|
651
651
|
}) : c.addEventListener("dblclick", (g) => {
|
|
652
652
|
g.stopPropagation();
|
|
653
653
|
const m = Number(c.getAttribute("data-row"));
|
|
@@ -657,40 +657,40 @@ function D(t, e, o, i) {
|
|
|
657
657
|
B(t, m, C);
|
|
658
658
|
const _ = t.findRenderedRowElement?.(m);
|
|
659
659
|
if (_) {
|
|
660
|
-
const
|
|
661
|
-
for (let
|
|
662
|
-
const A = t._visibleColumns[
|
|
663
|
-
A && A.editable &&
|
|
660
|
+
const y = _.children;
|
|
661
|
+
for (let x = 0; x < y.length; x++) {
|
|
662
|
+
const A = t._visibleColumns[x];
|
|
663
|
+
A && A.editable && k(t, C, m, A, y[x]);
|
|
664
664
|
}
|
|
665
665
|
}
|
|
666
666
|
}), c.addEventListener("keydown", (g) => {
|
|
667
667
|
const m = Number(c.getAttribute("data-row")), C = Number(c.getAttribute("data-col"));
|
|
668
668
|
if (isNaN(m) || isNaN(C)) return;
|
|
669
|
-
const _ = t._rows[m],
|
|
670
|
-
if (!(!_ || !
|
|
671
|
-
if ((
|
|
672
|
-
g.preventDefault(), t._activeEditRows !== m && B(t, m, _),
|
|
673
|
-
const
|
|
669
|
+
const _ = t._rows[m], y = t._visibleColumns[C];
|
|
670
|
+
if (!(!_ || !y)) {
|
|
671
|
+
if ((y.type === "select" || y.type === "typeahead") && !c.classList.contains("editing") && g.key === "Enter") {
|
|
672
|
+
g.preventDefault(), t._activeEditRows !== m && B(t, m, _), k(t, _, m, y, c), setTimeout(() => {
|
|
673
|
+
const x = c.querySelector("select");
|
|
674
674
|
try {
|
|
675
|
-
|
|
675
|
+
x?.showPicker?.();
|
|
676
676
|
} catch {
|
|
677
677
|
}
|
|
678
|
-
|
|
678
|
+
x?.focus();
|
|
679
679
|
}, 0);
|
|
680
680
|
return;
|
|
681
681
|
}
|
|
682
|
-
if (
|
|
682
|
+
if (y.type === "boolean" && g.key === " " && !c.classList.contains("editing")) {
|
|
683
683
|
g.preventDefault(), t._activeEditRows !== m && B(t, m, _);
|
|
684
|
-
const
|
|
685
|
-
J(t, m,
|
|
684
|
+
const x = !_[y.field];
|
|
685
|
+
J(t, m, y, x, _), c.innerHTML = `<span role="checkbox" aria-checked="${x}" aria-label="${x}">${x ? "🗹" : "☐"}</span>`;
|
|
686
686
|
return;
|
|
687
687
|
}
|
|
688
688
|
if (g.key === "Enter" && !c.classList.contains("editing")) {
|
|
689
|
-
g.preventDefault(), g.stopPropagation(), t._focusRow = m, t._focusCol = C, typeof t.beginBulkEdit == "function" ? t.beginBulkEdit(m) :
|
|
689
|
+
g.preventDefault(), g.stopPropagation(), t._focusRow = m, t._focusCol = C, typeof t.beginBulkEdit == "function" ? t.beginBulkEdit(m) : k(t, _, m, y, c);
|
|
690
690
|
return;
|
|
691
691
|
}
|
|
692
692
|
if (g.key === "F2" && !c.classList.contains("editing")) {
|
|
693
|
-
g.preventDefault(),
|
|
693
|
+
g.preventDefault(), k(t, _, m, y, c);
|
|
694
694
|
return;
|
|
695
695
|
}
|
|
696
696
|
}
|
|
@@ -705,7 +705,8 @@ function oe(t, e, o, i) {
|
|
|
705
705
|
const s = Number(n.getAttribute("data-row"));
|
|
706
706
|
if (isNaN(s)) return;
|
|
707
707
|
const r = t._rows[s];
|
|
708
|
-
if (!r)
|
|
708
|
+
if (!r || t._dispatchRowClick?.(e, s, r, o))
|
|
709
|
+
return;
|
|
709
710
|
const l = e.target?.closest(".cell[data-col]");
|
|
710
711
|
if (l) {
|
|
711
712
|
if (l.classList.contains("editing")) return;
|
|
@@ -713,7 +714,7 @@ function oe(t, e, o, i) {
|
|
|
713
714
|
if (!isNaN(d)) {
|
|
714
715
|
if (t._dispatchCellClick?.(e, s, d, l))
|
|
715
716
|
return;
|
|
716
|
-
t._focusRow = s, t._focusCol = d,
|
|
717
|
+
t._focusRow = s, t._focusCol = d, M(t);
|
|
717
718
|
}
|
|
718
719
|
}
|
|
719
720
|
if (o.querySelector(".cell.editing")) {
|
|
@@ -726,7 +727,7 @@ function oe(t, e, o, i) {
|
|
|
726
727
|
else return;
|
|
727
728
|
Array.from(o.children).forEach((d, f) => {
|
|
728
729
|
const h = t._visibleColumns[f];
|
|
729
|
-
h && h.editable &&
|
|
730
|
+
h && h.editable && k(t, r, s, h, d);
|
|
730
731
|
}), l && queueMicrotask(() => {
|
|
731
732
|
const d = o.querySelector(`.cell[data-col="${t._focusCol}"]`);
|
|
732
733
|
if (d?.classList.contains("editing")) {
|
|
@@ -746,7 +747,7 @@ function Z(t) {
|
|
|
746
747
|
function B(t, e, o) {
|
|
747
748
|
t._activeEditRows !== e && (t._rowEditSnapshots.set(e, { ...o }), t._activeEditRows = e);
|
|
748
749
|
}
|
|
749
|
-
function
|
|
750
|
+
function D(t, e, o) {
|
|
750
751
|
if (t._activeEditRows !== e) return;
|
|
751
752
|
const i = t._rowEditSnapshots.get(e), n = t._rows[e], s = t.findRenderedRowElement?.(e);
|
|
752
753
|
if (!o && s && n && s.querySelectorAll(".cell.editing").forEach((l) => {
|
|
@@ -760,7 +761,7 @@ function M(t, e, o) {
|
|
|
760
761
|
f instanceof HTMLInputElement && f.type === "checkbox" ? h = f.checked : (h = f.value, d.type === "number" && h !== "" && (h = Number(h))), n[d.field] !== h && J(t, e, d, h, n);
|
|
761
762
|
}
|
|
762
763
|
}), o && i && n)
|
|
763
|
-
Object.keys(i).forEach((r) => n[r] = i[r]), t._changedRowIndices.delete(e),
|
|
764
|
+
Object.keys(i).forEach((r) => n[r] = i[r]), t._changedRowIndices.delete(e), j(t);
|
|
764
765
|
else if (!o) {
|
|
765
766
|
const r = t._changedRowIndices.has(e);
|
|
766
767
|
t.dispatchEvent(
|
|
@@ -775,7 +776,7 @@ function M(t, e, o) {
|
|
|
775
776
|
})
|
|
776
777
|
);
|
|
777
778
|
}
|
|
778
|
-
t._rowEditSnapshots.delete(e), t._activeEditRows = -1, s && (
|
|
779
|
+
t._rowEditSnapshots.delete(e), t._activeEditRows = -1, s && (N(t, s, t._rows[e], e), t._changedRowIndices.has(e) ? s.classList.add("changed") : s.classList.remove("changed")), queueMicrotask(() => {
|
|
779
780
|
try {
|
|
780
781
|
const r = t._focusRow, l = t._focusCol, a = t.findRenderedRowElement?.(r);
|
|
781
782
|
if (a) {
|
|
@@ -810,7 +811,7 @@ function J(t, e, o, i, n) {
|
|
|
810
811
|
})
|
|
811
812
|
);
|
|
812
813
|
}
|
|
813
|
-
function
|
|
814
|
+
function k(t, e, o, i, n) {
|
|
814
815
|
if (!i.editable || (t._activeEditRows !== o && B(t, o, e), n.classList.contains("editing"))) return;
|
|
815
816
|
const s = Z(i.field) ? e[i.field] : void 0;
|
|
816
817
|
n.classList.add("editing");
|
|
@@ -823,15 +824,15 @@ function O(t, e, o, i, n) {
|
|
|
823
824
|
c && (typeof HTMLInputElement < "u" && c instanceof HTMLInputElement && c.type === "checkbox" ? c.checked = !!s : "value" in c && (c.value = s ?? ""));
|
|
824
825
|
}, d = document.createElement("div");
|
|
825
826
|
d.style.display = "contents", n.innerHTML = "", n.appendChild(d), d.addEventListener("keydown", (c) => {
|
|
826
|
-
c.key === "Enter" && (c.stopPropagation(), c.preventDefault(), r = !0,
|
|
827
|
+
c.key === "Enter" && (c.stopPropagation(), c.preventDefault(), r = !0, D(t, o, !1)), c.key === "Escape" && (c.stopPropagation(), c.preventDefault(), a(), D(t, o, !0));
|
|
827
828
|
});
|
|
828
829
|
const f = i.__editorTemplate, h = i.editor || (f ? "template" : He(i)), p = s;
|
|
829
830
|
if (h === "template" && f) {
|
|
830
831
|
const c = f.cloneNode(!0), u = i.__compiledEditor;
|
|
831
832
|
u ? c.innerHTML = u({ row: e, value: s, field: i.field, column: i }) : c.querySelectorAll("*").forEach((w) => {
|
|
832
|
-
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,
|
|
833
|
-
const
|
|
834
|
-
return
|
|
833
|
+
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) => {
|
|
834
|
+
const R = e[S];
|
|
835
|
+
return R == null ? "" : String(R);
|
|
835
836
|
}) || "");
|
|
836
837
|
});
|
|
837
838
|
const b = c.querySelector("input,textarea,select");
|
|
@@ -843,10 +844,10 @@ function O(t, e, o, i, n) {
|
|
|
843
844
|
}), b.addEventListener("keydown", (v) => {
|
|
844
845
|
if (v.key === "Enter") {
|
|
845
846
|
v.stopPropagation(), v.preventDefault(), r = !0;
|
|
846
|
-
const
|
|
847
|
-
l(
|
|
847
|
+
const S = w && b instanceof HTMLInputElement && b.type === "checkbox" ? b.checked : b.value;
|
|
848
|
+
l(S), D(t, o, !1);
|
|
848
849
|
}
|
|
849
|
-
v.key === "Escape" && (v.stopPropagation(), v.preventDefault(), a(),
|
|
850
|
+
v.key === "Escape" && (v.stopPropagation(), v.preventDefault(), a(), D(t, o, !0));
|
|
850
851
|
}), w && b instanceof HTMLInputElement && b.type === "checkbox" && b.addEventListener("change", () => {
|
|
851
852
|
const v = b.checked;
|
|
852
853
|
l(v);
|
|
@@ -888,7 +889,7 @@ function ie(t, e, o) {
|
|
|
888
889
|
new CustomEvent("sort-change", { detail: { field: e.field, direction: o } })
|
|
889
890
|
), t.requestStateChange?.();
|
|
890
891
|
}
|
|
891
|
-
function
|
|
892
|
+
function De(t, e) {
|
|
892
893
|
typeof e == "string" ? t.textContent = e : e instanceof HTMLElement && (t.innerHTML = "", t.appendChild(e.cloneNode(!0)));
|
|
893
894
|
}
|
|
894
895
|
function q(t) {
|
|
@@ -896,7 +897,7 @@ function q(t) {
|
|
|
896
897
|
const e = t._headerRowEl;
|
|
897
898
|
e.innerHTML = "", t._visibleColumns.forEach((o, i) => {
|
|
898
899
|
const n = document.createElement("div");
|
|
899
|
-
n.className = "cell",
|
|
900
|
+
n.className = "cell", Y(n, "header-cell"), n.setAttribute("role", "columnheader"), n.setAttribute("aria-colindex", String(i + 1)), n.setAttribute("data-field", o.field), n.setAttribute("data-col", String(i));
|
|
900
901
|
const s = o.__headerTemplate;
|
|
901
902
|
if (s) Array.from(s.childNodes).forEach((r) => n.appendChild(r.cloneNode(!0)));
|
|
902
903
|
else {
|
|
@@ -906,9 +907,9 @@ function q(t) {
|
|
|
906
907
|
if (o.sortable) {
|
|
907
908
|
n.classList.add("sortable"), n.tabIndex = 0;
|
|
908
909
|
const r = document.createElement("span");
|
|
909
|
-
|
|
910
|
+
Y(r, "sort-indicator"), r.style.opacity = "0.6";
|
|
910
911
|
const l = t._sortState?.field === o.field ? t._sortState.direction : 0, a = { ...H, ...t.icons }, d = l === 1 ? a.sortAsc : l === -1 ? a.sortDesc : a.sortNone;
|
|
911
|
-
|
|
912
|
+
De(r, d), n.appendChild(r), n.setAttribute("aria-sort", l === 0 ? "none" : l === 1 ? "ascending" : "descending"), n.addEventListener("click", (f) => {
|
|
912
913
|
t._resizeController?.isResizing || t._dispatchHeaderClick?.(f, i, n) || ne(t, o);
|
|
913
914
|
}), n.addEventListener("keydown", (f) => {
|
|
914
915
|
if (f.key === "Enter" || f.key === " ") {
|
|
@@ -922,6 +923,8 @@ function q(t) {
|
|
|
922
923
|
const r = document.createElement("div");
|
|
923
924
|
r.className = "resize-handle", r.setAttribute("aria-hidden", "true"), r.addEventListener("mousedown", (l) => {
|
|
924
925
|
l.stopPropagation(), l.preventDefault(), t._resizeController.start(l, i, n);
|
|
926
|
+
}), r.addEventListener("dblclick", (l) => {
|
|
927
|
+
l.stopPropagation(), l.preventDefault(), t._resizeController.resetColumn(i);
|
|
925
928
|
}), n.appendChild(r);
|
|
926
929
|
}
|
|
927
930
|
e.appendChild(n);
|
|
@@ -929,7 +932,7 @@ function q(t) {
|
|
|
929
932
|
o.getAttribute("aria-sort") || o.setAttribute("aria-sort", "none");
|
|
930
933
|
}), e.children.length > 0 ? (e.setAttribute("role", "row"), e.setAttribute("aria-rowindex", "1")) : (e.removeAttribute("role"), e.removeAttribute("aria-rowindex"));
|
|
931
934
|
}
|
|
932
|
-
function
|
|
935
|
+
function Ne(t) {
|
|
933
936
|
let e = null, o = null, i = null, n = null;
|
|
934
937
|
const s = (a) => {
|
|
935
938
|
if (!e) return;
|
|
@@ -956,6 +959,12 @@ function De(t) {
|
|
|
956
959
|
const h = f.getBoundingClientRect();
|
|
957
960
|
e = { startX: a.clientX, colIndex: d, startWidth: h.width }, window.addEventListener("mousemove", s), window.addEventListener("mouseup", l), i === null && (i = document.documentElement.style.cursor), document.documentElement.style.cursor = "e-resize", n === null && (n = document.body.style.userSelect), document.body.style.userSelect = "none";
|
|
958
961
|
},
|
|
962
|
+
resetColumn(a) {
|
|
963
|
+
const d = t._visibleColumns[a];
|
|
964
|
+
d && (d.__userResized = !1, d.__renderedWidth = void 0, d.width = d.__originalWidth, t.updateTemplate?.(), t.requestStateChange?.(), t.dispatchEvent(
|
|
965
|
+
new CustomEvent("column-resize-reset", { detail: { field: d.field, width: d.width } })
|
|
966
|
+
));
|
|
967
|
+
},
|
|
959
968
|
dispose() {
|
|
960
969
|
l();
|
|
961
970
|
}
|
|
@@ -1280,7 +1289,7 @@ function Ke(t, e) {
|
|
|
1280
1289
|
const h = r.querySelector(`[data-section="${a}"] .tbw-accordion-content`);
|
|
1281
1290
|
h && (h.innerHTML = "");
|
|
1282
1291
|
}
|
|
1283
|
-
t.expandedSections.add(n), X(r, n, !0),
|
|
1292
|
+
t.expandedSections.add(n), X(r, n, !0), Ye(r, t, n);
|
|
1284
1293
|
}
|
|
1285
1294
|
e.emit("tool-panel-section-toggle", { id: n, expanded: !l });
|
|
1286
1295
|
},
|
|
@@ -1342,7 +1351,7 @@ function X(t, e, o) {
|
|
|
1342
1351
|
const i = t.querySelector(`[data-section="${e}"]`);
|
|
1343
1352
|
i && i.classList.toggle("expanded", o);
|
|
1344
1353
|
}
|
|
1345
|
-
function
|
|
1354
|
+
function Ye(t, e, o) {
|
|
1346
1355
|
const i = e.toolPanels.get(o);
|
|
1347
1356
|
if (!i?.render) return;
|
|
1348
1357
|
const n = t.querySelector(`[data-section="${o}"] .tbw-accordion-content`);
|
|
@@ -1350,7 +1359,7 @@ function je(t, e, o) {
|
|
|
1350
1359
|
const s = i.render(n);
|
|
1351
1360
|
s && e.panelCleanups.set(o, s);
|
|
1352
1361
|
}
|
|
1353
|
-
class
|
|
1362
|
+
class je {
|
|
1354
1363
|
constructor(e) {
|
|
1355
1364
|
this.grid = e;
|
|
1356
1365
|
}
|
|
@@ -1670,60 +1679,66 @@ class Ye {
|
|
|
1670
1679
|
class W extends HTMLElement {
|
|
1671
1680
|
// TODO: Rename to 'data-grid' when migration is complete
|
|
1672
1681
|
static tagName = "tbw-grid";
|
|
1673
|
-
static version = "0.2.
|
|
1682
|
+
static version = "0.2.6";
|
|
1674
1683
|
// ---------------- Observed Attributes ----------------
|
|
1675
1684
|
static get observedAttributes() {
|
|
1676
1685
|
return ["rows", "columns", "grid-config", "fit-mode", "edit-on"];
|
|
1677
1686
|
}
|
|
1678
1687
|
#o;
|
|
1679
|
-
#
|
|
1688
|
+
#O = !1;
|
|
1680
1689
|
// ---------------- Ready Promise ----------------
|
|
1681
|
-
#
|
|
1682
|
-
|
|
1690
|
+
#I;
|
|
1691
|
+
#$;
|
|
1683
1692
|
// #region Input Properties
|
|
1684
1693
|
// These backing fields store raw user input. They are merged into
|
|
1685
1694
|
// #effectiveConfig by #mergeEffectiveConfig(). Never read directly
|
|
1686
1695
|
// for rendering logic - always use effectiveConfig or derived state.
|
|
1687
1696
|
#r = [];
|
|
1688
1697
|
#l;
|
|
1689
|
-
#p;
|
|
1690
|
-
#w;
|
|
1691
1698
|
#g;
|
|
1699
|
+
#C;
|
|
1700
|
+
#y;
|
|
1692
1701
|
// #endregion
|
|
1693
1702
|
// #region Single Source of Truth
|
|
1694
1703
|
// All input sources converge here. This is the canonical config
|
|
1695
1704
|
// that all rendering and logic should read from.
|
|
1696
1705
|
#t = {};
|
|
1697
|
-
#
|
|
1698
|
-
#
|
|
1699
|
-
#
|
|
1700
|
-
#
|
|
1706
|
+
#p = !1;
|
|
1707
|
+
#b = 0;
|
|
1708
|
+
#S = null;
|
|
1709
|
+
#R = !1;
|
|
1701
1710
|
// Cached flag for plugin scroll handlers
|
|
1702
|
-
#
|
|
1711
|
+
#M;
|
|
1703
1712
|
// Cached hook to avoid closures
|
|
1704
|
-
#
|
|
1705
|
-
#
|
|
1706
|
-
#
|
|
1707
|
-
#
|
|
1708
|
-
#
|
|
1713
|
+
#x = !1;
|
|
1714
|
+
#A = null;
|
|
1715
|
+
#T = null;
|
|
1716
|
+
#L = null;
|
|
1717
|
+
#P = null;
|
|
1718
|
+
#m = null;
|
|
1719
|
+
#v = null;
|
|
1720
|
+
#_ = null;
|
|
1721
|
+
#d = 0;
|
|
1722
|
+
#u = 0;
|
|
1723
|
+
#w = 0;
|
|
1709
1724
|
#a;
|
|
1710
|
-
#
|
|
1725
|
+
#E;
|
|
1711
1726
|
// ---------------- Plugin System ----------------
|
|
1712
1727
|
#e;
|
|
1713
1728
|
// ---------------- Column State ----------------
|
|
1714
|
-
#
|
|
1715
|
-
#
|
|
1729
|
+
#z;
|
|
1730
|
+
#h;
|
|
1716
1731
|
// ---------------- Shell State ----------------
|
|
1717
1732
|
#i = qe();
|
|
1718
1733
|
#n;
|
|
1719
|
-
#
|
|
1734
|
+
#H;
|
|
1720
1735
|
// #endregion
|
|
1721
1736
|
// #region Derived State
|
|
1722
1737
|
// _rows: result of applying plugin processRows hooks
|
|
1723
1738
|
_rows = [];
|
|
1724
1739
|
// _baseColumns: columns before plugin transformation (analogous to #rows for row processing)
|
|
1725
1740
|
// This is the source of truth for processColumns - plugins transform these
|
|
1726
|
-
#
|
|
1741
|
+
#D = [];
|
|
1727
1742
|
// _columns is a getter/setter that operates on effectiveConfig.columns
|
|
1728
1743
|
// This ensures effectiveConfig.columns is the single source of truth for columns
|
|
1729
1744
|
// _columns always contains ALL columns (including hidden)
|
|
@@ -1784,7 +1799,7 @@ class W extends HTMLElement {
|
|
|
1784
1799
|
}
|
|
1785
1800
|
set rows(e) {
|
|
1786
1801
|
const o = this.#r;
|
|
1787
|
-
this.#r = e, o !== e && this.#
|
|
1802
|
+
this.#r = e, o !== e && this.#ee();
|
|
1788
1803
|
}
|
|
1789
1804
|
/**
|
|
1790
1805
|
* Get the original unfiltered/unprocessed rows.
|
|
@@ -1798,28 +1813,28 @@ class W extends HTMLElement {
|
|
|
1798
1813
|
}
|
|
1799
1814
|
set columns(e) {
|
|
1800
1815
|
const o = this.#l;
|
|
1801
|
-
this.#l = e, o !== e && this.#
|
|
1816
|
+
this.#l = e, o !== e && this.#te();
|
|
1802
1817
|
}
|
|
1803
1818
|
get gridConfig() {
|
|
1804
1819
|
return this.#t;
|
|
1805
1820
|
}
|
|
1806
1821
|
set gridConfig(e) {
|
|
1807
|
-
const o = this.#
|
|
1808
|
-
this.#
|
|
1822
|
+
const o = this.#g;
|
|
1823
|
+
this.#g = e, o !== e && this.#oe();
|
|
1809
1824
|
}
|
|
1810
1825
|
get fitMode() {
|
|
1811
1826
|
return this.#t.fitMode ?? "stretch";
|
|
1812
1827
|
}
|
|
1813
1828
|
set fitMode(e) {
|
|
1814
|
-
const o = this.#
|
|
1815
|
-
this.#
|
|
1829
|
+
const o = this.#C;
|
|
1830
|
+
this.#C = e, o !== e && this.#J();
|
|
1816
1831
|
}
|
|
1817
1832
|
get editOn() {
|
|
1818
1833
|
return this.#t.editOn;
|
|
1819
1834
|
}
|
|
1820
1835
|
set editOn(e) {
|
|
1821
|
-
const o = this.#
|
|
1822
|
-
this.#
|
|
1836
|
+
const o = this.#y;
|
|
1837
|
+
this.#y = e, o !== e && this.#Q();
|
|
1823
1838
|
}
|
|
1824
1839
|
/**
|
|
1825
1840
|
* Effective config accessor for internal modules and plugins.
|
|
@@ -1842,7 +1857,7 @@ class W extends HTMLElement {
|
|
|
1842
1857
|
return this.#a || (this.#a = new AbortController()), this.#a.signal;
|
|
1843
1858
|
}
|
|
1844
1859
|
constructor() {
|
|
1845
|
-
super(), this.#o = this.attachShadow({ mode: "open" }), this.#
|
|
1860
|
+
super(), this.#o = this.attachShadow({ mode: "open" }), this.#K(), this.#I = new Promise((e) => this.#$ = e), this.#n = Ke(this.#i, {
|
|
1846
1861
|
getShadow: () => this.#o,
|
|
1847
1862
|
getShellConfig: () => this.#t?.shell,
|
|
1848
1863
|
getAccordionIcons: () => ({
|
|
@@ -1853,7 +1868,7 @@ class W extends HTMLElement {
|
|
|
1853
1868
|
refreshShellHeader: () => this.refreshShellHeader()
|
|
1854
1869
|
});
|
|
1855
1870
|
}
|
|
1856
|
-
#
|
|
1871
|
+
#K() {
|
|
1857
1872
|
const e = new CSSStyleSheet();
|
|
1858
1873
|
e.replaceSync(fe), this.#o.adoptedStyleSheets = [e];
|
|
1859
1874
|
}
|
|
@@ -1881,7 +1896,15 @@ class W extends HTMLElement {
|
|
|
1881
1896
|
* @internal Plugin API
|
|
1882
1897
|
*/
|
|
1883
1898
|
requestRender() {
|
|
1884
|
-
this.#
|
|
1899
|
+
this.#k(), this.#N(), q(this), z(this), this.refreshVirtualWindow(!0);
|
|
1900
|
+
}
|
|
1901
|
+
/**
|
|
1902
|
+
* Update the grid's column template CSS.
|
|
1903
|
+
* Called by resize controller during column resize operations.
|
|
1904
|
+
* @internal
|
|
1905
|
+
*/
|
|
1906
|
+
updateTemplate() {
|
|
1907
|
+
z(this);
|
|
1885
1908
|
}
|
|
1886
1909
|
/**
|
|
1887
1910
|
* Request a lightweight style update without rebuilding DOM.
|
|
@@ -1896,8 +1919,8 @@ class W extends HTMLElement {
|
|
|
1896
1919
|
* Initialize plugin system with instances from config.
|
|
1897
1920
|
* Plugins are class instances passed in gridConfig.plugins[].
|
|
1898
1921
|
*/
|
|
1899
|
-
#
|
|
1900
|
-
this.#e = new
|
|
1922
|
+
#W() {
|
|
1923
|
+
this.#e = new je(this);
|
|
1901
1924
|
const e = this.#t?.plugins, o = Array.isArray(e) ? e : [];
|
|
1902
1925
|
this.#e.attachAll(o);
|
|
1903
1926
|
}
|
|
@@ -1905,7 +1928,7 @@ class W extends HTMLElement {
|
|
|
1905
1928
|
* Inject all plugin styles into the shadow DOM.
|
|
1906
1929
|
* Must be called after #render() since innerHTML wipes existing content.
|
|
1907
1930
|
*/
|
|
1908
|
-
#
|
|
1931
|
+
#V() {
|
|
1909
1932
|
const e = this.#e?.getAllStyles() ?? "";
|
|
1910
1933
|
if (e) {
|
|
1911
1934
|
const o = document.createElement("style");
|
|
@@ -1916,20 +1939,20 @@ class W extends HTMLElement {
|
|
|
1916
1939
|
* Update plugins when grid config changes.
|
|
1917
1940
|
* With class-based plugins, we need to detach old and attach new.
|
|
1918
1941
|
*/
|
|
1919
|
-
#
|
|
1920
|
-
this.#e && this.#e.detachAll(), this.#
|
|
1942
|
+
#G() {
|
|
1943
|
+
this.#e && this.#e.detachAll(), this.#W(), this.#V(), this.#R = this.#e?.getAll().some((e) => e.onScroll) ?? !1;
|
|
1921
1944
|
}
|
|
1922
1945
|
/**
|
|
1923
1946
|
* Clean up plugin states when grid disconnects.
|
|
1924
1947
|
*/
|
|
1925
|
-
#
|
|
1948
|
+
#Y() {
|
|
1926
1949
|
this.#e?.detachAll();
|
|
1927
1950
|
}
|
|
1928
1951
|
/**
|
|
1929
1952
|
* Collect tool panels and header content from all plugins.
|
|
1930
1953
|
* Called after plugins are attached but before render.
|
|
1931
1954
|
*/
|
|
1932
|
-
#
|
|
1955
|
+
#j() {
|
|
1933
1956
|
if (!this.#e) return;
|
|
1934
1957
|
const e = this.#e.getToolPanels();
|
|
1935
1958
|
for (const { panel: i } of e)
|
|
@@ -1940,10 +1963,10 @@ class W extends HTMLElement {
|
|
|
1940
1963
|
}
|
|
1941
1964
|
// ---------------- Lifecycle ----------------
|
|
1942
1965
|
connectedCallback() {
|
|
1943
|
-
this.hasAttribute("tabindex") || (this.tabIndex = 0), this.hasAttribute("version") || this.setAttribute("version", W.version), this._rows = Array.isArray(this.#r) ? [...this.#r] : [], this.#a?.abort(), this.#a = new AbortController(), this.#
|
|
1966
|
+
this.hasAttribute("tabindex") || (this.tabIndex = 0), this.hasAttribute("version") || this.setAttribute("version", W.version), this._rows = Array.isArray(this.#r) ? [...this.#r] : [], this.#a?.abort(), this.#a = new AbortController(), this.#f(), this.#W(), this.#j(), this.#O || (this.#X(), this.#V(), this.#O = !0), this.#F();
|
|
1944
1967
|
}
|
|
1945
1968
|
disconnectedCallback() {
|
|
1946
|
-
this.#
|
|
1969
|
+
this.#Y(), Xe(this.#i), this.#n.setInitialized(!1), this.#H?.(), this.#H = void 0, this.#a && (this.#a.abort(), this.#a = void 0), this._resizeController && this._resizeController.dispose(), this.#E && (this.#E.disconnect(), this.#E = void 0), this.#p = !1;
|
|
1947
1970
|
}
|
|
1948
1971
|
/**
|
|
1949
1972
|
* Handle HTML attribute changes.
|
|
@@ -1969,19 +1992,19 @@ class W extends HTMLElement {
|
|
|
1969
1992
|
else
|
|
1970
1993
|
this[s] = i;
|
|
1971
1994
|
}
|
|
1972
|
-
#
|
|
1995
|
+
#F() {
|
|
1973
1996
|
const o = this.#o.querySelector(".tbw-grid-content") ?? this.#o.querySelector(".tbw-grid-root");
|
|
1974
1997
|
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.#n.isInitialized) {
|
|
1975
1998
|
he(this.#o, this.#i), Ge(this.#o, this.#t?.shell, this.#i);
|
|
1976
1999
|
const l = this.#t?.shell?.toolPanel?.defaultOpen;
|
|
1977
2000
|
l && this.#i.toolPanels.has(l) && (this.openToolPanel(), this.#i.expandedSections.add(l));
|
|
1978
2001
|
}
|
|
1979
|
-
this.setAttribute("data-upgraded", ""), this.#
|
|
2002
|
+
this.setAttribute("data-upgraded", ""), this.#p = !0;
|
|
1980
2003
|
const i = this.disconnectSignal;
|
|
1981
|
-
this.#c(), this.addEventListener("keydown", (l) =>
|
|
2004
|
+
this._resizeController = Ne(this), this.#c(), this.addEventListener("keydown", (l) => ke(this, l), { signal: i }), document.addEventListener(
|
|
1982
2005
|
"keydown",
|
|
1983
2006
|
(l) => {
|
|
1984
|
-
l.key === "Escape" && this._activeEditRows !== -1 &&
|
|
2007
|
+
l.key === "Escape" && this._activeEditRows !== -1 && D(this, this._activeEditRows, !0);
|
|
1985
2008
|
},
|
|
1986
2009
|
{ capture: !0, signal: i }
|
|
1987
2010
|
), document.addEventListener(
|
|
@@ -1989,19 +2012,19 @@ class W extends HTMLElement {
|
|
|
1989
2012
|
(l) => {
|
|
1990
2013
|
if (this._activeEditRows === -1) return;
|
|
1991
2014
|
const a = this.findRenderedRowElement(this._activeEditRows);
|
|
1992
|
-
!a || (l.composedPath && l.composedPath() || []).includes(a) ||
|
|
2015
|
+
!a || (l.composedPath && l.composedPath() || []).includes(a) || D(this, this._activeEditRows, !1);
|
|
1993
2016
|
},
|
|
1994
2017
|
{ signal: i }
|
|
1995
2018
|
);
|
|
1996
2019
|
const n = o?.querySelector(".faux-vscroll"), s = o?.querySelector(".rows");
|
|
1997
|
-
if (this._virtualization.container = n ?? this, this.#
|
|
2020
|
+
if (this._virtualization.container = n ?? this, this.#R = this.#e?.getAll().some((l) => l.onScroll) ?? !1, n && s) {
|
|
1998
2021
|
n.addEventListener(
|
|
1999
2022
|
"scroll",
|
|
2000
2023
|
() => {
|
|
2001
|
-
if (!this._virtualization.enabled && !this.#
|
|
2024
|
+
if (!this._virtualization.enabled && !this.#R) return;
|
|
2002
2025
|
const d = n.scrollTop, f = this._virtualization.rowHeight, h = Math.floor(d / f), p = h - h % 2, c = -(d - p * f);
|
|
2003
|
-
s.style.transform = `translateY(${c}px)`, this.#
|
|
2004
|
-
this.#
|
|
2026
|
+
s.style.transform = `translateY(${c}px)`, this.#S = d, this.#b || (this.#b = requestAnimationFrame(() => {
|
|
2027
|
+
this.#b = 0, this.#S !== null && (this.#ne(this.#S), this.#S = null);
|
|
2005
2028
|
}));
|
|
2006
2029
|
},
|
|
2007
2030
|
{ passive: !0, signal: i }
|
|
@@ -2010,33 +2033,51 @@ class W extends HTMLElement {
|
|
|
2010
2033
|
l && (l.addEventListener(
|
|
2011
2034
|
"wheel",
|
|
2012
2035
|
(d) => {
|
|
2013
|
-
|
|
2036
|
+
const f = d.shiftKey || Math.abs(d.deltaX) > Math.abs(d.deltaY);
|
|
2037
|
+
if (f && a) {
|
|
2038
|
+
const h = d.shiftKey ? d.deltaY : d.deltaX, { scrollLeft: p, scrollWidth: c, clientWidth: u } = a;
|
|
2039
|
+
(h > 0 && p < c - u || h < 0 && p > 0) && (d.preventDefault(), a.scrollLeft += h);
|
|
2040
|
+
} else if (!f) {
|
|
2041
|
+
const { scrollTop: h, scrollHeight: p, clientHeight: c } = n;
|
|
2042
|
+
(d.deltaY > 0 && h < p - c || d.deltaY < 0 && h > 0) && (d.preventDefault(), n.scrollTop += d.deltaY);
|
|
2043
|
+
}
|
|
2014
2044
|
},
|
|
2015
2045
|
{ passive: !1, signal: i }
|
|
2016
2046
|
), l.addEventListener(
|
|
2017
2047
|
"touchstart",
|
|
2018
2048
|
(d) => {
|
|
2019
|
-
d.touches.length === 1 && (this.#
|
|
2049
|
+
d.touches.length === 1 && (this.#w && (cancelAnimationFrame(this.#w), this.#w = 0), this.#A = d.touches[0].clientY, this.#T = d.touches[0].clientX, this.#m = d.touches[0].clientY, this.#v = d.touches[0].clientX, this.#_ = performance.now(), this.#L = n.scrollTop, this.#P = a?.scrollLeft ?? 0, this.#d = 0, this.#u = 0);
|
|
2020
2050
|
},
|
|
2021
2051
|
{ passive: !0, signal: i }
|
|
2022
2052
|
), l.addEventListener(
|
|
2023
2053
|
"touchmove",
|
|
2024
2054
|
(d) => {
|
|
2025
|
-
if (d.touches.length === 1 && this.#
|
|
2026
|
-
const f =
|
|
2027
|
-
|
|
2055
|
+
if (d.touches.length === 1 && this.#A !== null && this.#T !== null && this.#L !== null && this.#P !== null) {
|
|
2056
|
+
const f = d.touches[0].clientY, h = d.touches[0].clientX, p = performance.now(), c = this.#A - f, u = this.#T - h;
|
|
2057
|
+
if (this.#_ !== null && this.#m !== null && this.#v !== null) {
|
|
2058
|
+
const g = p - this.#_;
|
|
2059
|
+
g > 0 && (this.#d = (this.#m - f) / g, this.#u = (this.#v - h) / g);
|
|
2060
|
+
}
|
|
2061
|
+
this.#m = f, this.#v = h, this.#_ = p;
|
|
2062
|
+
const { scrollTop: b, scrollHeight: w, clientHeight: v } = n, S = w - v, R = c > 0 && b < S || c < 0 && b > 0;
|
|
2063
|
+
let E = !1;
|
|
2064
|
+
if (a) {
|
|
2065
|
+
const { scrollLeft: g, scrollWidth: m, clientWidth: C } = a, _ = m - C;
|
|
2066
|
+
E = u > 0 && g < _ || u < 0 && g > 0;
|
|
2067
|
+
}
|
|
2068
|
+
R && (n.scrollTop = this.#L + c), E && a && (a.scrollLeft = this.#P + u), (R || E) && d.preventDefault();
|
|
2028
2069
|
}
|
|
2029
2070
|
},
|
|
2030
2071
|
{ passive: !1, signal: i }
|
|
2031
2072
|
), l.addEventListener(
|
|
2032
2073
|
"touchend",
|
|
2033
2074
|
() => {
|
|
2034
|
-
this.#
|
|
2075
|
+
(Math.abs(this.#d) > 0.1 || Math.abs(this.#u) > 0.1) && this.#ie(n, a), this.#A = null, this.#T = null, this.#L = null, this.#P = null, this.#m = null, this.#v = null, this.#_ = null;
|
|
2035
2076
|
},
|
|
2036
2077
|
{ passive: !0, signal: i }
|
|
2037
2078
|
));
|
|
2038
2079
|
}
|
|
2039
|
-
this
|
|
2080
|
+
this.#o.addEventListener("mousedown", (l) => this.#se(l), { signal: i }), document.addEventListener("mousemove", (l) => this.#re(l), { signal: i }), document.addEventListener("mouseup", (l) => this.#le(l), { signal: i }), this._virtualization.enabled && requestAnimationFrame(() => this.refreshVirtualWindow(!0));
|
|
2040
2081
|
const r = this.#t.rowHeight;
|
|
2041
2082
|
r && r > 0 ? this._virtualization.rowHeight = r : requestAnimationFrame(() => {
|
|
2042
2083
|
const l = this._bodyEl?.querySelector(".data-grid-row");
|
|
@@ -2044,11 +2085,11 @@ class W extends HTMLElement {
|
|
|
2044
2085
|
const a = l.getBoundingClientRect().height;
|
|
2045
2086
|
a > 0 && (this._virtualization.rowHeight = a, this.refreshVirtualWindow(!0));
|
|
2046
2087
|
}
|
|
2047
|
-
}), this._virtualization.viewportEl && (this.#
|
|
2048
|
-
this.#
|
|
2049
|
-
this.#
|
|
2088
|
+
}), this._virtualization.viewportEl && (this.#E = new ResizeObserver(() => {
|
|
2089
|
+
this.#b || (this.#b = requestAnimationFrame(() => {
|
|
2090
|
+
this.#b = 0, this.refreshVirtualWindow(!0), M(this);
|
|
2050
2091
|
}));
|
|
2051
|
-
}), this.#
|
|
2092
|
+
}), this.#E.observe(this._virtualization.viewportEl)), queueMicrotask(() => this.#Z()), requestAnimationFrame(() => requestAnimationFrame(() => this.#$?.()));
|
|
2052
2093
|
}
|
|
2053
2094
|
// ---------------- Event Emitters ----------------
|
|
2054
2095
|
#s(e, o) {
|
|
@@ -2070,7 +2111,7 @@ class W extends HTMLElement {
|
|
|
2070
2111
|
this.#s("activate-cell", e);
|
|
2071
2112
|
}
|
|
2072
2113
|
/** Update ARIA selection attributes on rendered rows/cells */
|
|
2073
|
-
#
|
|
2114
|
+
#Z() {
|
|
2074
2115
|
this._bodyEl?.querySelectorAll(".data-grid-row")?.forEach((o, i) => {
|
|
2075
2116
|
const n = i === this._focusRow;
|
|
2076
2117
|
o.setAttribute("aria-selected", String(n)), o.querySelectorAll(".cell").forEach((s, r) => {
|
|
@@ -2079,27 +2120,27 @@ class W extends HTMLElement {
|
|
|
2079
2120
|
});
|
|
2080
2121
|
}
|
|
2081
2122
|
// ---------------- Watch Handlers ----------------
|
|
2082
|
-
#
|
|
2083
|
-
if (!this.#
|
|
2084
|
-
this.#
|
|
2123
|
+
#J() {
|
|
2124
|
+
if (!this.#p) return;
|
|
2125
|
+
this.#f(), this.#t.fitMode === "fixed" ? (this.__didInitialAutoSize = !1, te(this)) : (this._columns.forEach((o) => {
|
|
2085
2126
|
!o.__userResized && o.__autoSized && delete o.width;
|
|
2086
|
-
}),
|
|
2127
|
+
}), z(this));
|
|
2087
2128
|
}
|
|
2088
|
-
#
|
|
2089
|
-
this.#
|
|
2129
|
+
#Q() {
|
|
2130
|
+
this.#p && (this.#f(), this._rowPool.length = 0, this._bodyEl && (this._bodyEl.innerHTML = ""), this.__rowRenderEpoch++, this.refreshVirtualWindow(!0));
|
|
2090
2131
|
}
|
|
2091
|
-
#
|
|
2092
|
-
this._rows = Array.isArray(this.#r) ? [...this.#r] : [], this.#
|
|
2132
|
+
#ee() {
|
|
2133
|
+
this._rows = Array.isArray(this.#r) ? [...this.#r] : [], this.#k(), !this.#l || Array.isArray(this.#l) && this.#l.length === 0 ? this.#c() : this.refreshVirtualWindow(!0);
|
|
2093
2134
|
}
|
|
2094
|
-
#
|
|
2095
|
-
|
|
2135
|
+
#te() {
|
|
2136
|
+
j(this), this.#p && (this.#f(), this.#c());
|
|
2096
2137
|
}
|
|
2097
|
-
#
|
|
2098
|
-
this.#
|
|
2138
|
+
#oe() {
|
|
2139
|
+
this.#p && (this.#f(), this.#G(), this.#k(), this.#N(), q(this), z(this), this.refreshVirtualWindow(!0));
|
|
2099
2140
|
}
|
|
2100
|
-
#
|
|
2141
|
+
#N() {
|
|
2101
2142
|
if (this.#e) {
|
|
2102
|
-
const e = this.#
|
|
2143
|
+
const e = this.#D.length > 0 ? this.#D : this._columns, o = e.filter((s) => !s.hidden), i = e.filter((s) => s.hidden), n = this.#e.processColumns([...o]);
|
|
2103
2144
|
if (n !== o) {
|
|
2104
2145
|
const s = new Map(n.map((l, a) => [l.field, { col: l, order: a }]));
|
|
2105
2146
|
if (!o.some((l) => s.has(l.field)) && n.length > 0)
|
|
@@ -2117,8 +2158,8 @@ class W extends HTMLElement {
|
|
|
2117
2158
|
}
|
|
2118
2159
|
}
|
|
2119
2160
|
/** Recompute row model via plugin hooks (grouping, tree, filtering, etc.). */
|
|
2120
|
-
#
|
|
2121
|
-
|
|
2161
|
+
#k() {
|
|
2162
|
+
j(this);
|
|
2122
2163
|
const e = Array.isArray(this.#r) ? [...this.#r] : [], o = this.#e?.processRows(e) ?? e;
|
|
2123
2164
|
this._rows = o;
|
|
2124
2165
|
}
|
|
@@ -2140,8 +2181,8 @@ class W extends HTMLElement {
|
|
|
2140
2181
|
* - `_columns` is NOT set here (done by #getColumnConfiguration + #processColumns)
|
|
2141
2182
|
* - Plugins receive config via their attach() method
|
|
2142
2183
|
*/
|
|
2143
|
-
#
|
|
2144
|
-
const e = this.#
|
|
2184
|
+
#f() {
|
|
2185
|
+
const e = this.#g ? { ...this.#g } : {};
|
|
2145
2186
|
let o = Array.isArray(e.columns) ? [...e.columns] : [];
|
|
2146
2187
|
const i = (this.__lightDomColumnsCache || []).map((n) => ({
|
|
2147
2188
|
...n
|
|
@@ -2156,6 +2197,8 @@ class W extends HTMLElement {
|
|
|
2156
2197
|
if (this.#l && this.#l.length && (o = [...this.#l]), (!o || o.length === 0) && this._rows.length && (o = de(this._rows).columns), o.length) {
|
|
2157
2198
|
o.forEach((r) => {
|
|
2158
2199
|
r.sortable === void 0 && (r.sortable = !0), r.resizable === void 0 && (r.resizable = !0);
|
|
2200
|
+
const l = r;
|
|
2201
|
+
l.__originalWidth === void 0 && typeof r.width == "number" && (l.__originalWidth = r.width);
|
|
2159
2202
|
});
|
|
2160
2203
|
const n = this.#t.columns;
|
|
2161
2204
|
n?.some((r) => r.__compiledView || r.__compiledEditor) ? e.columns = n : e.columns = o;
|
|
@@ -2163,19 +2206,19 @@ class W extends HTMLElement {
|
|
|
2163
2206
|
const n = this.#t.columns;
|
|
2164
2207
|
n?.some((s) => s.__compiledView || s.__compiledEditor) && (e.columns = n);
|
|
2165
2208
|
}
|
|
2166
|
-
this.#
|
|
2209
|
+
this.#C && (e.fitMode = this.#C), e.fitMode || (e.fitMode = "stretch"), this.#y && (e.editOn = this.#y), e.rowHeight && e.rowHeight > 0 && (this._virtualization.rowHeight = e.rowHeight), e.columnState && !this.#h && (this.#h = e.columnState), this.#t = e, e.fitMode === "fixed" && this._columns.forEach((n) => {
|
|
2167
2210
|
n.width == null && (n.width = 80);
|
|
2168
2211
|
});
|
|
2169
2212
|
}
|
|
2170
2213
|
// ---------------- Delegate Wrappers ----------------
|
|
2171
|
-
#
|
|
2172
|
-
this.#
|
|
2214
|
+
#q(e, o, i = this.__rowRenderEpoch) {
|
|
2215
|
+
this.#M || (this.#M = (n, s, r) => this.#e?.renderRow(n, s, r) ?? !1), ze(this, e, o, i, this.#M);
|
|
2173
2216
|
}
|
|
2174
2217
|
// ---------------- Core Helpers ----------------
|
|
2175
2218
|
#c() {
|
|
2176
2219
|
if (!this.isConnected || !this._headerRowEl || !this._bodyEl)
|
|
2177
2220
|
return;
|
|
2178
|
-
const e = this.#
|
|
2221
|
+
const e = this.#g?.columns || this.#l || [];
|
|
2179
2222
|
if (e.length) {
|
|
2180
2223
|
const i = new Map(this._columns.filter((s) => s.hidden).map((s) => [s.field, !0])), n = e.map((s) => ({
|
|
2181
2224
|
...s,
|
|
@@ -2183,14 +2226,14 @@ class W extends HTMLElement {
|
|
|
2183
2226
|
}));
|
|
2184
2227
|
this._columns = n;
|
|
2185
2228
|
}
|
|
2186
|
-
if (Pe(this), this.#
|
|
2187
|
-
const i = this.#
|
|
2188
|
-
this.#
|
|
2229
|
+
if (Pe(this), this.#f(), this.#G(), this.#D = [...this._columns], this.#k(), this.#N(), this.#h) {
|
|
2230
|
+
const i = this.#h;
|
|
2231
|
+
this.#h = void 0, this.#U(i);
|
|
2189
2232
|
}
|
|
2190
|
-
q(this),
|
|
2233
|
+
q(this), z(this), this.refreshVirtualWindow(!0), this.#t.fitMode === "fixed" && !this.__didInitialAutoSize && requestAnimationFrame(() => te(this)), this._bodyEl && (this._bodyEl.style.display = "", this._bodyEl.style.gridTemplateColumns = ""), queueMicrotask(() => this.#e?.afterRender());
|
|
2191
2234
|
}
|
|
2192
2235
|
/** Internal method to apply column state without triggering setup loop */
|
|
2193
|
-
#
|
|
2236
|
+
#U(e) {
|
|
2194
2237
|
const o = this.#t.columns ?? [], i = this.#e?.getAll() ?? [];
|
|
2195
2238
|
be(this, e, o, i);
|
|
2196
2239
|
for (const n of e.columns) {
|
|
@@ -2198,8 +2241,8 @@ class W extends HTMLElement {
|
|
|
2198
2241
|
s && (s.hidden = !n.visible);
|
|
2199
2242
|
}
|
|
2200
2243
|
}
|
|
2201
|
-
#
|
|
2202
|
-
if (this.refreshVirtualWindow(!1), this.#e?.onScrollRender(), this.#
|
|
2244
|
+
#ne(e) {
|
|
2245
|
+
if (this.refreshVirtualWindow(!1), this.#e?.onScrollRender(), this.#R) {
|
|
2203
2246
|
const o = this._virtualization.container, i = {
|
|
2204
2247
|
scrollTop: e,
|
|
2205
2248
|
scrollLeft: o?.scrollLeft ?? 0,
|
|
@@ -2251,6 +2294,20 @@ class W extends HTMLElement {
|
|
|
2251
2294
|
};
|
|
2252
2295
|
return this.#e?.onCellClick(l) ?? !1;
|
|
2253
2296
|
}
|
|
2297
|
+
/**
|
|
2298
|
+
* Dispatch a row click event to the plugin system.
|
|
2299
|
+
* Returns true if any plugin handled the event.
|
|
2300
|
+
*/
|
|
2301
|
+
_dispatchRowClick(e, o, i, n) {
|
|
2302
|
+
if (!i) return !1;
|
|
2303
|
+
const s = {
|
|
2304
|
+
rowIndex: o,
|
|
2305
|
+
row: i,
|
|
2306
|
+
rowEl: n,
|
|
2307
|
+
originalEvent: e
|
|
2308
|
+
};
|
|
2309
|
+
return this.#e?.onRowClick(s) ?? !1;
|
|
2310
|
+
}
|
|
2254
2311
|
/**
|
|
2255
2312
|
* Dispatch a header click event to the plugin system.
|
|
2256
2313
|
* Returns true if any plugin handled the event.
|
|
@@ -2299,7 +2356,7 @@ class W extends HTMLElement {
|
|
|
2299
2356
|
* Build a CellMouseEvent from a native MouseEvent.
|
|
2300
2357
|
* Extracts cell/row information from the event target.
|
|
2301
2358
|
*/
|
|
2302
|
-
#
|
|
2359
|
+
#B(e, o) {
|
|
2303
2360
|
let i = null;
|
|
2304
2361
|
const n = e.composedPath?.();
|
|
2305
2362
|
if (n && n.length > 0 ? i = n[0] : i = e.target, i && !this.#o.contains(i)) {
|
|
@@ -2323,28 +2380,40 @@ class W extends HTMLElement {
|
|
|
2323
2380
|
cell: a !== void 0 && d !== void 0 && a >= 0 && d >= 0 ? { row: a, col: d } : void 0
|
|
2324
2381
|
};
|
|
2325
2382
|
}
|
|
2383
|
+
/**
|
|
2384
|
+
* Apply momentum scrolling animation after touch release.
|
|
2385
|
+
* Decelerates smoothly until velocity drops below threshold.
|
|
2386
|
+
*/
|
|
2387
|
+
#ie(e, o) {
|
|
2388
|
+
const s = () => {
|
|
2389
|
+
this.#d *= 0.95, this.#u *= 0.95;
|
|
2390
|
+
const r = this.#d * 16, l = this.#u * 16;
|
|
2391
|
+
Math.abs(this.#d) > 0.01 && (e.scrollTop += r), Math.abs(this.#u) > 0.01 && o && (o.scrollLeft += l), Math.abs(this.#d) > 0.01 || Math.abs(this.#u) > 0.01 ? this.#w = requestAnimationFrame(s) : this.#w = 0;
|
|
2392
|
+
};
|
|
2393
|
+
this.#w = requestAnimationFrame(s);
|
|
2394
|
+
}
|
|
2326
2395
|
/**
|
|
2327
2396
|
* Handle mousedown events and dispatch to plugin system.
|
|
2328
2397
|
*/
|
|
2329
|
-
#
|
|
2330
|
-
const o = this.#
|
|
2331
|
-
(this.#e?.onCellMouseDown(o) ?? !1) && (this.#
|
|
2398
|
+
#se(e) {
|
|
2399
|
+
const o = this.#B(e, "mousedown");
|
|
2400
|
+
(this.#e?.onCellMouseDown(o) ?? !1) && (this.#x = !0);
|
|
2332
2401
|
}
|
|
2333
2402
|
/**
|
|
2334
2403
|
* Handle mousemove events (only when dragging).
|
|
2335
2404
|
*/
|
|
2336
|
-
#
|
|
2337
|
-
if (!this.#
|
|
2338
|
-
const o = this.#
|
|
2405
|
+
#re(e) {
|
|
2406
|
+
if (!this.#x) return;
|
|
2407
|
+
const o = this.#B(e, "mousemove");
|
|
2339
2408
|
this.#e?.onCellMouseMove(o);
|
|
2340
2409
|
}
|
|
2341
2410
|
/**
|
|
2342
2411
|
* Handle mouseup events.
|
|
2343
2412
|
*/
|
|
2344
|
-
#
|
|
2345
|
-
if (!this.#
|
|
2346
|
-
const o = this.#
|
|
2347
|
-
this.#e?.onCellMouseUp(o), this.#
|
|
2413
|
+
#le(e) {
|
|
2414
|
+
if (!this.#x) return;
|
|
2415
|
+
const o = this.#B(e, "mouseup");
|
|
2416
|
+
this.#e?.onCellMouseUp(o), this.#x = !1;
|
|
2348
2417
|
}
|
|
2349
2418
|
// API consumed by internal utils (rows.ts)
|
|
2350
2419
|
get changedRows() {
|
|
@@ -2365,7 +2434,7 @@ class W extends HTMLElement {
|
|
|
2365
2434
|
const l = this._visibleColumns[r];
|
|
2366
2435
|
if (l?.editable) {
|
|
2367
2436
|
const a = s;
|
|
2368
|
-
a.classList.contains("editing") ||
|
|
2437
|
+
a.classList.contains("editing") || k(this, i, e, l, a);
|
|
2369
2438
|
}
|
|
2370
2439
|
}), queueMicrotask(() => {
|
|
2371
2440
|
const s = n.querySelector(`.cell[data-col="${this._focusCol}"]`);
|
|
@@ -2381,10 +2450,10 @@ class W extends HTMLElement {
|
|
|
2381
2450
|
}));
|
|
2382
2451
|
}
|
|
2383
2452
|
async commitActiveRowEdit() {
|
|
2384
|
-
this._activeEditRows !== -1 &&
|
|
2453
|
+
this._activeEditRows !== -1 && D(this, this._activeEditRows, !1);
|
|
2385
2454
|
}
|
|
2386
2455
|
async ready() {
|
|
2387
|
-
return this.#
|
|
2456
|
+
return this.#I;
|
|
2388
2457
|
}
|
|
2389
2458
|
async forceLayout() {
|
|
2390
2459
|
this.#c(), await new Promise((e) => requestAnimationFrame(() => requestAnimationFrame(e)));
|
|
@@ -2468,7 +2537,7 @@ class W extends HTMLElement {
|
|
|
2468
2537
|
}
|
|
2469
2538
|
for (const n of o.values())
|
|
2470
2539
|
i.push(n);
|
|
2471
|
-
this._columns = i, q(this),
|
|
2540
|
+
this._columns = i, q(this), z(this), this.refreshVirtualWindow(!0);
|
|
2472
2541
|
}
|
|
2473
2542
|
/**
|
|
2474
2543
|
* Get the current column order as an array of field names.
|
|
@@ -2491,7 +2560,7 @@ class W extends HTMLElement {
|
|
|
2491
2560
|
* Use this to restore previously saved column state.
|
|
2492
2561
|
*/
|
|
2493
2562
|
set columnState(e) {
|
|
2494
|
-
e && (this.#
|
|
2563
|
+
e && (this.#h = e, this.#O && this.#ae(e));
|
|
2495
2564
|
}
|
|
2496
2565
|
/**
|
|
2497
2566
|
* Get the current column state.
|
|
@@ -2502,10 +2571,10 @@ class W extends HTMLElement {
|
|
|
2502
2571
|
/**
|
|
2503
2572
|
* Apply column state internally.
|
|
2504
2573
|
*/
|
|
2505
|
-
#
|
|
2574
|
+
#ae(e) {
|
|
2506
2575
|
(this.#t.columns ?? []).forEach((i) => {
|
|
2507
2576
|
i.hidden = !1;
|
|
2508
|
-
}), this.#
|
|
2577
|
+
}), this.#U(e), this.#c();
|
|
2509
2578
|
}
|
|
2510
2579
|
/**
|
|
2511
2580
|
* Request a state change event to be emitted.
|
|
@@ -2515,20 +2584,20 @@ class W extends HTMLElement {
|
|
|
2515
2584
|
* @internal Plugin API
|
|
2516
2585
|
*/
|
|
2517
2586
|
requestStateChange() {
|
|
2518
|
-
this.#
|
|
2587
|
+
this.#z || (this.#z = we(
|
|
2519
2588
|
this,
|
|
2520
2589
|
() => this.#e?.getAll() ?? [],
|
|
2521
2590
|
(e) => this.#s("column-state-change", e)
|
|
2522
|
-
)), this.#
|
|
2591
|
+
)), this.#z();
|
|
2523
2592
|
}
|
|
2524
2593
|
/**
|
|
2525
2594
|
* Reset column state to initial configuration.
|
|
2526
2595
|
* Clears all user modifications (order, width, visibility, sort).
|
|
2527
2596
|
*/
|
|
2528
2597
|
resetColumnState() {
|
|
2529
|
-
this.#
|
|
2598
|
+
this.#h = void 0, (this.#t.columns ?? []).forEach((i) => {
|
|
2530
2599
|
i.hidden = !1;
|
|
2531
|
-
}), this._sortState = null, this.__originalOrder = [], this.#
|
|
2600
|
+
}), this._sortState = null, this.__originalOrder = [], this.#f(), this.#c();
|
|
2532
2601
|
const o = this.#e?.getAll() ?? [];
|
|
2533
2602
|
for (const i of o)
|
|
2534
2603
|
if (i.applyColumnState)
|
|
@@ -2620,7 +2689,7 @@ class W extends HTMLElement {
|
|
|
2620
2689
|
* Call this after dynamically modifying <tbw-grid-header> children.
|
|
2621
2690
|
*/
|
|
2622
2691
|
refreshShellHeader() {
|
|
2623
|
-
se(this, this.#i), this
|
|
2692
|
+
se(this, this.#i), this.#X(), this.#F();
|
|
2624
2693
|
}
|
|
2625
2694
|
// ---------------- Virtual Window ----------------
|
|
2626
2695
|
/**
|
|
@@ -2632,11 +2701,11 @@ class W extends HTMLElement {
|
|
|
2632
2701
|
if (!this._bodyEl) return;
|
|
2633
2702
|
const o = this._rows.length;
|
|
2634
2703
|
if (!this._virtualization.enabled) {
|
|
2635
|
-
this.#
|
|
2704
|
+
this.#q(0, o), this.#e?.afterRender();
|
|
2636
2705
|
return;
|
|
2637
2706
|
}
|
|
2638
2707
|
if (this._rows.length <= this._virtualization.bypassThreshold) {
|
|
2639
|
-
if (this._virtualization.start = 0, this._virtualization.end = o, this._bodyEl.style.transform = "translateY(0px)", this.#
|
|
2708
|
+
if (this._virtualization.start = 0, this._virtualization.end = o, this._bodyEl.style.transform = "translateY(0px)", this.#q(0, o, this.__rowRenderEpoch), this._virtualization.totalHeightEl) {
|
|
2640
2709
|
const C = this.#o.querySelector(".tbw-scroll-area"), _ = C ? C.offsetHeight - C.clientHeight : 0;
|
|
2641
2710
|
this._virtualization.totalHeightEl.style.height = `${o * this._virtualization.rowHeight + _}px`;
|
|
2642
2711
|
}
|
|
@@ -2658,15 +2727,15 @@ class W extends HTMLElement {
|
|
|
2658
2727
|
const p = Math.ceil(s / r) + 3;
|
|
2659
2728
|
let c = a + p;
|
|
2660
2729
|
c > o && (c = o), this._virtualization.start = a, this._virtualization.end = c;
|
|
2661
|
-
const b = this.#o.querySelector(".tbw-footer")?.offsetHeight ?? 0, w = this.#e?.getExtraHeight() ?? 0, v = this.#o.querySelector(".tbw-scroll-area"),
|
|
2662
|
-
this._virtualization.totalHeightEl && (this._virtualization.totalHeightEl.style.height = `${o * r + r + b + w +
|
|
2663
|
-
const
|
|
2664
|
-
this._bodyEl.style.transform = `translateY(${
|
|
2730
|
+
const b = this.#o.querySelector(".tbw-footer")?.offsetHeight ?? 0, w = this.#e?.getExtraHeight() ?? 0, v = this.#o.querySelector(".tbw-scroll-area"), S = v ? v.offsetHeight - v.clientHeight : 0;
|
|
2731
|
+
this._virtualization.totalHeightEl && (this._virtualization.totalHeightEl.style.height = `${o * r + r + b + w + S}px`);
|
|
2732
|
+
const R = this.#e?.getExtraHeightBefore?.(a) ?? 0, E = -(l - a * r - R);
|
|
2733
|
+
this._bodyEl.style.transform = `translateY(${E}px)`, this.#q(a, c, e ? ++this.__rowRenderEpoch : this.__rowRenderEpoch);
|
|
2665
2734
|
const g = this.#o.querySelector(".rows-body");
|
|
2666
2735
|
g?.setAttribute("aria-rowcount", String(o)), g?.setAttribute("aria-colcount", String(this._visibleColumns.length)), e && this.#e?.afterRender();
|
|
2667
2736
|
}
|
|
2668
2737
|
// ---------------- Render ----------------
|
|
2669
|
-
|
|
2738
|
+
#X() {
|
|
2670
2739
|
se(this, this.#i);
|
|
2671
2740
|
const e = this.#t?.shell, o = Be(e, this.#i), i = `
|
|
2672
2741
|
<div class="tbw-scroll-area">
|
|
@@ -2697,7 +2766,7 @@ class W extends HTMLElement {
|
|
|
2697
2766
|
${r}
|
|
2698
2767
|
${l}
|
|
2699
2768
|
</div>
|
|
2700
|
-
`, this.#
|
|
2769
|
+
`, this.#ce(), this.#n.setInitialized(!0);
|
|
2701
2770
|
} else
|
|
2702
2771
|
this.#o.innerHTML = `
|
|
2703
2772
|
<div class="tbw-grid-root">
|
|
@@ -2710,19 +2779,19 @@ class W extends HTMLElement {
|
|
|
2710
2779
|
/**
|
|
2711
2780
|
* Set up shell event listeners after render.
|
|
2712
2781
|
*/
|
|
2713
|
-
#
|
|
2782
|
+
#ce() {
|
|
2714
2783
|
We(this.#o, this.#t?.shell, this.#i, {
|
|
2715
2784
|
onPanelToggle: () => this.toggleToolPanel(),
|
|
2716
2785
|
onSectionToggle: (e) => this.toggleToolPanelSection(e),
|
|
2717
|
-
onToolbarButtonClick: (e) => this.#
|
|
2718
|
-
}), this.#
|
|
2786
|
+
onToolbarButtonClick: (e) => this.#de(e)
|
|
2787
|
+
}), this.#H?.(), this.#H = Ve(this.#o, this.#t?.shell, (e) => {
|
|
2719
2788
|
this.style.setProperty("--tbw-tool-panel-width", `${e}px`);
|
|
2720
2789
|
});
|
|
2721
2790
|
}
|
|
2722
2791
|
/**
|
|
2723
2792
|
* Handle toolbar button click (for config buttons with action).
|
|
2724
2793
|
*/
|
|
2725
|
-
#
|
|
2794
|
+
#de(e) {
|
|
2726
2795
|
const i = (this.#t?.shell?.header?.toolbarButtons ?? []).find((s) => s.id === e);
|
|
2727
2796
|
if (i?.action) {
|
|
2728
2797
|
i.action();
|
|
@@ -2830,7 +2899,7 @@ class Qe {
|
|
|
2830
2899
|
* Use this for rendering that needs to match the grid template.
|
|
2831
2900
|
*/
|
|
2832
2901
|
get visibleColumns() {
|
|
2833
|
-
return this.grid?.
|
|
2902
|
+
return this.grid?._visibleColumns ?? [];
|
|
2834
2903
|
}
|
|
2835
2904
|
/**
|
|
2836
2905
|
* Get the shadow root of the grid.
|
|
@@ -3047,7 +3116,7 @@ const T = {
|
|
|
3047
3116
|
max: (t, e) => Math.max(...t.map((o) => Number(o[e]) || -1 / 0)),
|
|
3048
3117
|
first: (t, e) => t[0]?.[e],
|
|
3049
3118
|
last: (t, e) => t[t.length - 1]?.[e]
|
|
3050
|
-
}, I = /* @__PURE__ */ new Map(),
|
|
3119
|
+
}, I = /* @__PURE__ */ new Map(), O = {
|
|
3051
3120
|
/**
|
|
3052
3121
|
* Register a custom aggregator function.
|
|
3053
3122
|
*/
|
|
@@ -3101,7 +3170,7 @@ function Ze(t) {
|
|
|
3101
3170
|
function it(t, e) {
|
|
3102
3171
|
return Ze(t)(e);
|
|
3103
3172
|
}
|
|
3104
|
-
const st =
|
|
3173
|
+
const st = O.register.bind(O), rt = O.unregister.bind(O), lt = O.get.bind(O), at = O.run.bind(O), ct = O.list.bind(O);
|
|
3105
3174
|
export {
|
|
3106
3175
|
Qe as BaseGridPlugin,
|
|
3107
3176
|
H as DEFAULT_GRID_ICONS,
|
|
@@ -3115,8 +3184,8 @@ export {
|
|
|
3115
3184
|
et as GridSelectors,
|
|
3116
3185
|
Je as PLUGIN_QUERIES,
|
|
3117
3186
|
nt as PluginEvents,
|
|
3118
|
-
|
|
3119
|
-
|
|
3187
|
+
je as PluginManager,
|
|
3188
|
+
O as aggregatorRegistry,
|
|
3120
3189
|
lt as getAggregator,
|
|
3121
3190
|
Ze as getValueAggregator,
|
|
3122
3191
|
ct as listAggregators,
|