@toolbox-web/grid 0.4.0 → 0.4.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/all.js +46 -22
- package/all.js.map +1 -1
- package/index.js +516 -451
- package/index.js.map +1 -1
- package/lib/core/internal/editing.d.ts +76 -0
- package/lib/core/internal/editing.d.ts.map +1 -0
- package/lib/core/internal/validate-config.d.ts +14 -0
- package/lib/core/internal/validate-config.d.ts.map +1 -1
- package/lib/core/plugin/base-plugin.d.ts +48 -0
- package/lib/core/plugin/base-plugin.d.ts.map +1 -1
- package/lib/core/plugin/index.d.ts +1 -0
- package/lib/core/plugin/index.d.ts.map +1 -1
- package/lib/core/plugin/plugin-manager.d.ts +1 -1
- package/lib/core/plugin/plugin-manager.d.ts.map +1 -1
- package/lib/plugins/clipboard/ClipboardPlugin.d.ts +7 -1
- package/lib/plugins/clipboard/ClipboardPlugin.d.ts.map +1 -1
- package/lib/plugins/clipboard/index.js +28 -4
- package/lib/plugins/clipboard/index.js.map +1 -1
- package/lib/plugins/column-virtualization/index.js +20 -4
- package/lib/plugins/column-virtualization/index.js.map +1 -1
- package/lib/plugins/context-menu/index.js +30 -14
- package/lib/plugins/context-menu/index.js.map +1 -1
- package/lib/plugins/editing/index.js +24 -8
- package/lib/plugins/editing/index.js.map +1 -1
- package/lib/plugins/export/index.js +44 -28
- package/lib/plugins/export/index.js.map +1 -1
- package/lib/plugins/filtering/index.js +16 -0
- package/lib/plugins/filtering/index.js.map +1 -1
- package/lib/plugins/grouping-columns/index.js +22 -6
- package/lib/plugins/grouping-columns/index.js.map +1 -1
- package/lib/plugins/grouping-rows/index.js +16 -0
- package/lib/plugins/grouping-rows/index.js.map +1 -1
- package/lib/plugins/master-detail/index.js +16 -0
- package/lib/plugins/master-detail/index.js.map +1 -1
- package/lib/plugins/multi-sort/index.js +16 -0
- package/lib/plugins/multi-sort/index.js.map +1 -1
- package/lib/plugins/pinned-columns/index.js +16 -0
- package/lib/plugins/pinned-columns/index.js.map +1 -1
- package/lib/plugins/pinned-rows/index.js +16 -0
- package/lib/plugins/pinned-rows/index.js.map +1 -1
- package/lib/plugins/pivot/index.js +16 -0
- package/lib/plugins/pivot/index.js.map +1 -1
- package/lib/plugins/reorder/index.js +16 -0
- package/lib/plugins/reorder/index.js.map +1 -1
- package/lib/plugins/selection/index.js +16 -0
- package/lib/plugins/selection/index.js.map +1 -1
- package/lib/plugins/server-side/index.js +20 -4
- package/lib/plugins/server-side/index.js.map +1 -1
- package/lib/plugins/tree/index.js +16 -0
- package/lib/plugins/tree/index.js.map +1 -1
- package/lib/plugins/undo-redo/UndoRedoPlugin.d.ts +7 -1
- package/lib/plugins/undo-redo/UndoRedoPlugin.d.ts.map +1 -1
- package/lib/plugins/undo-redo/index.js +29 -5
- package/lib/plugins/undo-redo/index.js.map +1 -1
- package/lib/plugins/visibility/VisibilityPlugin.d.ts +7 -1
- package/lib/plugins/visibility/VisibilityPlugin.d.ts.map +1 -1
- package/lib/plugins/visibility/index.js +24 -0
- package/lib/plugins/visibility/index.js.map +1 -1
- package/package.json +1 -1
- package/umd/grid.all.umd.js +23 -17
- package/umd/grid.all.umd.js.map +1 -1
- package/umd/grid.umd.js +14 -8
- package/umd/grid.umd.js.map +1 -1
- package/umd/plugins/clipboard.umd.js +1 -1
- package/umd/plugins/clipboard.umd.js.map +1 -1
- package/umd/plugins/editing.umd.js +1 -1
- package/umd/plugins/editing.umd.js.map +1 -1
- package/umd/plugins/undo-redo.umd.js +1 -1
- package/umd/plugins/undo-redo.umd.js.map +1 -1
- package/umd/plugins/visibility.umd.js +1 -1
- package/umd/plugins/visibility.umd.js.map +1 -1
package/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
const ee = ':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-animation-duration: .2s;--tbw-animation-easing: ease-out;--tbw-animation-enabled: 1;--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-editing-row-bg: var(--tbw-editing-bg);--tbw-editing-row-outline-color: var(--tbw-color-accent);--tbw-editing-row-outline-width: 1px;--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;opacity:.6}: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;content-visibility:auto;contain-intrinsic-size:auto var(--tbw-row-height)}:host .data-grid-row:has(.editing){background:var(--tbw-editing-row-bg);outline:var(--tbw-editing-row-outline-width) solid var(--tbw-editing-row-outline-color);outline-offset:calc(-1 * var(--tbw-editing-row-outline-width))}: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;min-height:calc(var(--tbw-row-height) + 2px)}: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%;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 .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: var(--tbw-animation-duration) var(--tbw-animation-easing);--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;overflow-anchor:none}: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 var(--tbw-transition-duration) var(--tbw-transition-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}@media(forced-colors:active){:host{--tbw-color-border: CanvasText;--tbw-color-border-strong: CanvasText;--tbw-color-border-cell: CanvasText;--tbw-color-border-header: CanvasText;--tbw-color-fg: CanvasText;--tbw-color-bg: Canvas;--tbw-color-panel-bg: Canvas;--tbw-color-header-bg: Canvas;--tbw-color-header-fg: CanvasText;--tbw-color-accent: Highlight;--tbw-color-accent-fg: HighlightText;--tbw-color-selection: Highlight;--tbw-color-row-hover: Highlight;--tbw-focus-outline: 2px solid Highlight;--tbw-range-border-color: Highlight}:host .cell:focus,:host .cell.active-cell{outline:2px solid Highlight!important;outline-offset:-2px}:host .data-grid-row[aria-selected=true]{background:Highlight!important;color:HighlightText!important}}@media(prefers-reduced-motion:reduce){:host([data-animation-mode="reduced-motion"]){--tbw-animation-enabled: 0;--tbw-animation-duration: 0ms}}:host([data-animation-mode="off"]){--tbw-animation-enabled: 0;--tbw-animation-duration: 0ms}:host .tbw-expanding{animation:tbw-expand var(--tbw-animation-duration) var(--tbw-animation-easing) forwards;overflow:hidden}:host .tbw-collapsing{animation:tbw-collapse var(--tbw-animation-duration) var(--tbw-animation-easing) forwards;overflow:hidden}@keyframes tbw-expand{0%{opacity:0;max-height:0;transform:translateY(-8px)}to{opacity:1;max-height:500px;transform:translateY(0)}}@keyframes tbw-collapse{0%{opacity:1;max-height:500px;transform:translateY(0)}to{opacity:0;max-height:0;transform:translateY(-8px)}}:host .tbw-fade-in{animation:tbw-fade-in var(--tbw-animation-duration) var(--tbw-animation-easing) forwards}:host .tbw-fade-out{animation:tbw-fade-out var(--tbw-animation-duration) var(--tbw-animation-easing) forwards}@keyframes tbw-fade-in{0%{opacity:0}to{opacity:1}}@keyframes tbw-fade-out{0%{opacity:1}to{opacity:0}}@keyframes tbw-slide-in{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}:host .tbw-slide-in{animation:tbw-slide-in var(--tbw-animation-duration) var(--tbw-animation-easing) forwards}:host .tbw-dragging{opacity:.5;cursor:grabbing}:host .tbw-toggle-btn{cursor:pointer;user-select:none;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:none;padding:0;font:inherit;color:inherit}:host .tbw-floating-panel{position:fixed;background:var(--tbw-color-panel-bg);color:var(--tbw-color-fg);border:1px solid var(--tbw-color-border);border-radius:var(--tbw-border-radius);box-shadow:0 4px 16px var(--tbw-color-shadow);z-index:10000;font-size:13px}:host .tbw-drop-before:before,:host .tbw-drop-after:after{content:"";position:absolute;background:var(--tbw-drop-indicator-color, var(--tbw-color-accent));pointer-events:none}:host .tbw-drop-before-v:before{left:0;top:0;bottom:0;width:2px}:host .tbw-drop-after-v:after{right:0;top:0;bottom:0;width:2px}:host .tbw-drop-before-h:before{left:0;right:0;top:0;height:2px}:host .tbw-drop-after-h:after{left:0;right:0;bottom:0;height:2px}:host .tbw-flip-animating{will-change:transform;z-index:1}:host .tbw-toggle-icon{display:inline-flex;align-items:center;justify-content:center;transition:transform var(--tbw-animation-duration) var(--tbw-animation-easing)}:host .tbw-toggle-icon.tbw-expanded{transform:rotate(90deg)}', q = {
|
|
1
|
+
const te = ':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-animation-duration: .2s;--tbw-animation-easing: ease-out;--tbw-animation-enabled: 1;--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-editing-row-bg: var(--tbw-editing-bg);--tbw-editing-row-outline-color: var(--tbw-color-accent);--tbw-editing-row-outline-width: 1px;--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;opacity:.6}: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;content-visibility:auto;contain-intrinsic-size:auto var(--tbw-row-height)}:host .data-grid-row:has(.editing){background:var(--tbw-editing-row-bg);outline:var(--tbw-editing-row-outline-width) solid var(--tbw-editing-row-outline-color);outline-offset:calc(-1 * var(--tbw-editing-row-outline-width))}: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;min-height:calc(var(--tbw-row-height) + 2px)}: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%;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 .header-row>.cell.resizable{position:relative}:host .tbw-editor-host{display:contents}: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 .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)}: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: var(--tbw-animation-duration) var(--tbw-animation-easing);--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;overflow-anchor:none}: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 var(--tbw-transition-duration) var(--tbw-transition-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}@media(forced-colors:active){:host{--tbw-color-border: CanvasText;--tbw-color-border-strong: CanvasText;--tbw-color-border-cell: CanvasText;--tbw-color-border-header: CanvasText;--tbw-color-fg: CanvasText;--tbw-color-bg: Canvas;--tbw-color-panel-bg: Canvas;--tbw-color-header-bg: Canvas;--tbw-color-header-fg: CanvasText;--tbw-color-accent: Highlight;--tbw-color-accent-fg: HighlightText;--tbw-color-selection: Highlight;--tbw-color-row-hover: Highlight;--tbw-focus-outline: 2px solid Highlight;--tbw-range-border-color: Highlight}:host .cell:focus,:host .cell.active-cell{outline:2px solid Highlight!important;outline-offset:-2px}:host .data-grid-row[aria-selected=true]{background:Highlight!important;color:HighlightText!important}}@media(prefers-reduced-motion:reduce){:host([data-animation-mode="reduced-motion"]){--tbw-animation-enabled: 0;--tbw-animation-duration: 0ms}}:host([data-animation-mode="off"]){--tbw-animation-enabled: 0;--tbw-animation-duration: 0ms}:host .tbw-expanding{animation:tbw-expand var(--tbw-animation-duration) var(--tbw-animation-easing) forwards;overflow:hidden}:host .tbw-collapsing{animation:tbw-collapse var(--tbw-animation-duration) var(--tbw-animation-easing) forwards;overflow:hidden}@keyframes tbw-expand{0%{opacity:0;max-height:0;transform:translateY(-8px)}to{opacity:1;max-height:500px;transform:translateY(0)}}@keyframes tbw-collapse{0%{opacity:1;max-height:500px;transform:translateY(0)}to{opacity:0;max-height:0;transform:translateY(-8px)}}', W = {
|
|
2
2
|
STRETCH: "stretch",
|
|
3
3
|
FIXED: "fixed"
|
|
4
|
-
},
|
|
4
|
+
}, Me = {
|
|
5
5
|
mode: "reduced-motion",
|
|
6
6
|
duration: 200,
|
|
7
7
|
easing: "ease-out"
|
|
@@ -15,44 +15,44 @@ const ee = ':root{color-scheme:light dark}:host{--tbw-color-bg: transparent;--tb
|
|
|
15
15
|
dragHandle: "⋮⋮",
|
|
16
16
|
toolPanel: "☰"
|
|
17
17
|
};
|
|
18
|
-
function
|
|
18
|
+
function ze(t) {
|
|
19
19
|
return Array.from(t.querySelectorAll("tbw-grid-column")).map((o) => {
|
|
20
20
|
const i = o.getAttribute("field") || "";
|
|
21
21
|
if (!i) return null;
|
|
22
|
-
const n = o.getAttribute("type") || void 0, s = n && (/* @__PURE__ */ new Set(["number", "string", "date", "boolean", "select", "typeahead"])).has(n) ? n : void 0, l = o.getAttribute("header") || void 0, a = o.hasAttribute("sortable"), c = o.hasAttribute("editable"),
|
|
22
|
+
const n = o.getAttribute("type") || void 0, s = n && (/* @__PURE__ */ new Set(["number", "string", "date", "boolean", "select", "typeahead"])).has(n) ? n : void 0, l = o.getAttribute("header") || void 0, a = o.hasAttribute("sortable"), c = o.hasAttribute("editable"), h = { field: i, type: s, header: l, sortable: a, editable: c }, d = o.getAttribute("width");
|
|
23
23
|
if (d) {
|
|
24
24
|
const v = parseFloat(d);
|
|
25
|
-
!isNaN(v) && /^\d+(\.\d+)?$/.test(d.trim()) ?
|
|
25
|
+
!isNaN(v) && /^\d+(\.\d+)?$/.test(d.trim()) ? h.width = v : h.width = d;
|
|
26
26
|
}
|
|
27
27
|
const f = o.getAttribute("minWidth") || o.getAttribute("min-width");
|
|
28
28
|
if (f) {
|
|
29
29
|
const v = parseFloat(f);
|
|
30
|
-
isNaN(v) || (
|
|
30
|
+
isNaN(v) || (h.minWidth = v);
|
|
31
31
|
}
|
|
32
|
-
o.hasAttribute("resizable") && (
|
|
33
|
-
const p = o.getAttribute("editor"),
|
|
34
|
-
p && (
|
|
32
|
+
o.hasAttribute("resizable") && (h.resizable = !0), o.hasAttribute("sizable") && (h.resizable = !0);
|
|
33
|
+
const p = o.getAttribute("editor"), u = o.getAttribute("renderer");
|
|
34
|
+
p && (h.__editorName = p), u && (h.__rendererName = u);
|
|
35
35
|
const g = o.getAttribute("options");
|
|
36
|
-
g && (
|
|
37
|
-
const [
|
|
38
|
-
return { value:
|
|
36
|
+
g && (h.options = g.split(",").map((v) => {
|
|
37
|
+
const [Y, De] = v.includes(":") ? v.split(":") : [v.trim(), v.trim()];
|
|
38
|
+
return { value: Y.trim(), label: De?.trim() || Y.trim() };
|
|
39
39
|
}));
|
|
40
40
|
const m = o.querySelector("tbw-grid-column-view"), b = o.querySelector("tbw-grid-column-editor"), _ = o.querySelector("tbw-grid-column-header");
|
|
41
|
-
m && (
|
|
41
|
+
m && (h.__viewTemplate = m), b && (h.__editorTemplate = b), _ && (h.__headerTemplate = _);
|
|
42
42
|
const C = globalThis.DataGridElement?.getAdapters?.() ?? [], y = m ?? o, S = C.find((v) => v.canHandle(y));
|
|
43
43
|
if (S) {
|
|
44
44
|
const v = S.createRenderer(y);
|
|
45
|
-
v && (
|
|
45
|
+
v && (h.viewRenderer = v);
|
|
46
46
|
}
|
|
47
|
-
const
|
|
47
|
+
const U = b ?? o, x = C.find((v) => v.canHandle(U));
|
|
48
48
|
if (x) {
|
|
49
|
-
const v = x.createEditor(
|
|
50
|
-
v && (
|
|
49
|
+
const v = x.createEditor(U);
|
|
50
|
+
v && (h.editor = v);
|
|
51
51
|
}
|
|
52
|
-
return
|
|
52
|
+
return h;
|
|
53
53
|
}).filter((o) => !!o);
|
|
54
54
|
}
|
|
55
|
-
function
|
|
55
|
+
function oe(t, e) {
|
|
56
56
|
if ((!t || !t.length) && (!e || !e.length)) return [];
|
|
57
57
|
if (!t || !t.length) return e || [];
|
|
58
58
|
if (!e || !e.length) return t;
|
|
@@ -76,7 +76,7 @@ function te(t, e) {
|
|
|
76
76
|
});
|
|
77
77
|
return Object.keys(o).forEach((n) => i.push(o[n])), i;
|
|
78
78
|
}
|
|
79
|
-
function
|
|
79
|
+
function ie(t, e) {
|
|
80
80
|
try {
|
|
81
81
|
t.part?.add?.(e);
|
|
82
82
|
} catch {
|
|
@@ -84,9 +84,9 @@ function oe(t, e) {
|
|
|
84
84
|
const o = t.getAttribute("part");
|
|
85
85
|
o ? o.split(/\s+/).includes(e) || t.setAttribute("part", o + " " + e) : t.setAttribute("part", e);
|
|
86
86
|
}
|
|
87
|
-
function
|
|
88
|
-
const e = t.effectiveConfig?.fitMode || t.fitMode ||
|
|
89
|
-
if (e !==
|
|
87
|
+
function ne(t) {
|
|
88
|
+
const e = t.effectiveConfig?.fitMode || t.fitMode || W.STRETCH;
|
|
89
|
+
if (e !== W.STRETCH && e !== W.FIXED || t.__didInitialAutoSize || !t.isConnected) return;
|
|
90
90
|
const o = Array.from(t._headerRowEl?.children || []);
|
|
91
91
|
if (!o.length) return;
|
|
92
92
|
let i = !1;
|
|
@@ -97,37 +97,37 @@ function ie(t) {
|
|
|
97
97
|
for (const a of t._rowPool) {
|
|
98
98
|
const c = a.children[r];
|
|
99
99
|
if (c) {
|
|
100
|
-
const
|
|
101
|
-
|
|
100
|
+
const h = c.scrollWidth;
|
|
101
|
+
h > l && (l = h);
|
|
102
102
|
}
|
|
103
103
|
}
|
|
104
104
|
l > 0 && (n.width = l + 2, n.__autoSized = !0, i = !0);
|
|
105
|
-
}), i &&
|
|
105
|
+
}), i && I(t), t.__didInitialAutoSize = !0;
|
|
106
106
|
}
|
|
107
|
-
function
|
|
108
|
-
(t.effectiveConfig?.fitMode || t.fitMode ||
|
|
107
|
+
function I(t) {
|
|
108
|
+
(t.effectiveConfig?.fitMode || t.fitMode || W.STRETCH) === W.STRETCH ? t._gridTemplate = t._visibleColumns.map((o) => {
|
|
109
109
|
if (o.width) return `${o.width}px`;
|
|
110
110
|
const i = o.minWidth;
|
|
111
111
|
return i != null ? `minmax(${i}px, 1fr)` : "1fr";
|
|
112
112
|
}).join(" ").trim() : t._gridTemplate = t._visibleColumns.map((o) => o.width ? `${o.width}px` : "max-content").join(" "), t.style.setProperty("--tbw-column-template", t._gridTemplate);
|
|
113
113
|
}
|
|
114
|
-
function
|
|
114
|
+
function Ne(t) {
|
|
115
115
|
return t == null ? "string" : typeof t == "number" ? "number" : typeof t == "boolean" ? "boolean" : t instanceof Date || typeof t == "string" && /\d{4}-\d{2}-\d{2}/.test(t) && !isNaN(Date.parse(t)) ? "date" : "string";
|
|
116
116
|
}
|
|
117
|
-
function
|
|
117
|
+
function ke(t, e) {
|
|
118
118
|
const o = t[0] || {}, i = Object.keys(o).map((r) => {
|
|
119
|
-
const s = o[r], l =
|
|
119
|
+
const s = o[r], l = Ne(s);
|
|
120
120
|
return { field: r, header: r.charAt(0).toUpperCase() + r.slice(1), type: l };
|
|
121
121
|
}), n = {};
|
|
122
122
|
return i.forEach((r) => {
|
|
123
123
|
n[r.field] = r.type || "string";
|
|
124
124
|
}), { columns: i, typeMap: n };
|
|
125
125
|
}
|
|
126
|
-
const
|
|
127
|
-
function
|
|
126
|
+
const Ie = /{{\s*([^}]+)\s*}}/g, A = "__DG_EMPTY__", Be = /^[\w$. '?+\-*/%:()!<>=,&|]+$/, qe = /__(proto|defineGetter|defineSetter)|constructor|window|globalThis|global|process|Function|import|eval|Reflect|Proxy|Error|arguments|document|location|cookie|localStorage|sessionStorage|indexedDB|fetch|XMLHttpRequest|WebSocket|Worker|SharedWorker|ServiceWorker|opener|parent|top|frames|self|this\b/;
|
|
127
|
+
function We(t) {
|
|
128
128
|
return !t || typeof t != "string" ? "" : t.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'");
|
|
129
129
|
}
|
|
130
|
-
const
|
|
130
|
+
const Ue = /* @__PURE__ */ new Set([
|
|
131
131
|
"script",
|
|
132
132
|
"iframe",
|
|
133
133
|
"object",
|
|
@@ -152,23 +152,23 @@ const We = /* @__PURE__ */ new Set([
|
|
|
152
152
|
"plaintext",
|
|
153
153
|
"xmp",
|
|
154
154
|
"listing"
|
|
155
|
-
]),
|
|
156
|
-
function
|
|
155
|
+
]), re = /^on\w+$/i, $e = /* @__PURE__ */ new Set(["href", "src", "action", "formaction", "data", "srcdoc", "xlink:href", "poster", "srcset"]), Ge = /^\s*(javascript|vbscript|data|blob):/i;
|
|
156
|
+
function F(t) {
|
|
157
157
|
if (!t || typeof t != "string") return "";
|
|
158
158
|
if (t.indexOf("<") === -1) return t;
|
|
159
159
|
const e = document.createElement("template");
|
|
160
|
-
return e.innerHTML = t,
|
|
160
|
+
return e.innerHTML = t, Ve(e.content), e.innerHTML;
|
|
161
161
|
}
|
|
162
|
-
function
|
|
162
|
+
function Ve(t) {
|
|
163
163
|
const e = [], o = t.querySelectorAll("*");
|
|
164
164
|
for (const i of o) {
|
|
165
165
|
const n = i.tagName.toLowerCase();
|
|
166
|
-
if (
|
|
166
|
+
if (Ue.has(n)) {
|
|
167
167
|
e.push(i);
|
|
168
168
|
continue;
|
|
169
169
|
}
|
|
170
170
|
if ((n === "svg" || i.namespaceURI === "http://www.w3.org/2000/svg") && Array.from(i.attributes).some(
|
|
171
|
-
(l) =>
|
|
171
|
+
(l) => re.test(l.name) || l.name === "href" || l.name === "xlink:href"
|
|
172
172
|
)) {
|
|
173
173
|
e.push(i);
|
|
174
174
|
continue;
|
|
@@ -176,11 +176,11 @@ function Ge(t) {
|
|
|
176
176
|
const r = [];
|
|
177
177
|
for (const s of i.attributes) {
|
|
178
178
|
const l = s.name.toLowerCase();
|
|
179
|
-
if (
|
|
179
|
+
if (re.test(l)) {
|
|
180
180
|
r.push(s.name);
|
|
181
181
|
continue;
|
|
182
182
|
}
|
|
183
|
-
if (
|
|
183
|
+
if ($e.has(l) && Ge.test(s.value)) {
|
|
184
184
|
r.push(s.name);
|
|
185
185
|
continue;
|
|
186
186
|
}
|
|
@@ -193,22 +193,22 @@ function Ge(t) {
|
|
|
193
193
|
}
|
|
194
194
|
e.forEach((i) => i.remove());
|
|
195
195
|
}
|
|
196
|
-
function
|
|
196
|
+
function ve(t, e) {
|
|
197
197
|
if (!t || t.indexOf("{{") === -1) return t;
|
|
198
|
-
const o = [], i = t.replace(
|
|
199
|
-
const c =
|
|
198
|
+
const o = [], i = t.replace(Ie, (l, a) => {
|
|
199
|
+
const c = Fe(a, e);
|
|
200
200
|
return o.push({ expr: a.trim(), result: c }), c;
|
|
201
|
-
}), n =
|
|
201
|
+
}), n = Xe(i), r = o.length && o.every((l) => l.result === "" || l.result === A);
|
|
202
202
|
return /Reflect\.|\bProxy\b|ownKeys\(/.test(t) || r ? "" : n;
|
|
203
203
|
}
|
|
204
|
-
function
|
|
204
|
+
function Fe(t, e) {
|
|
205
205
|
if (t = (t || "").trim(), !t || /\b(Reflect|Proxy|ownKeys)\b/.test(t)) return A;
|
|
206
206
|
if (t === "value") return e.value == null ? A : String(e.value);
|
|
207
207
|
if (t.startsWith("row.") && !/[()?]/.test(t) && !t.includes(":")) {
|
|
208
208
|
const i = t.slice(4), n = e.row ? e.row[i] : void 0;
|
|
209
209
|
return n == null ? A : String(n);
|
|
210
210
|
}
|
|
211
|
-
if (t.length > 80 || !
|
|
211
|
+
if (t.length > 80 || !Be.test(t) || qe.test(t)) return A;
|
|
212
212
|
const o = t.match(/\./g);
|
|
213
213
|
if (o && o.length > 1) return A;
|
|
214
214
|
try {
|
|
@@ -218,10 +218,10 @@ function Ve(t, e) {
|
|
|
218
218
|
return A;
|
|
219
219
|
}
|
|
220
220
|
}
|
|
221
|
-
function
|
|
221
|
+
function Xe(t) {
|
|
222
222
|
return t && t.replace(new RegExp(A, "g"), "").replace(/Reflect\.[^<>{}\s]+/g, "").replace(/\bProxy\b/g, "").replace(/ownKeys\([^)]*\)/g, "");
|
|
223
223
|
}
|
|
224
|
-
function
|
|
224
|
+
function Ye(t) {
|
|
225
225
|
if (/Reflect|Proxy|ownKeys/.test(t.textContent || "")) {
|
|
226
226
|
if (Array.from(t.childNodes).forEach((e) => {
|
|
227
227
|
e.nodeType === Node.TEXT_NODE && /Reflect|Proxy|ownKeys/.test(e.textContent || "") && (e.textContent = "");
|
|
@@ -233,12 +233,12 @@ function Xe(t) {
|
|
|
233
233
|
(t.textContent || "").trim().length === 0 && (t.textContent = "");
|
|
234
234
|
}
|
|
235
235
|
}
|
|
236
|
-
function
|
|
237
|
-
const e = /Reflect\.|\bProxy\b|ownKeys\(/.test(t), o = ((i) => e ? "" :
|
|
236
|
+
function se(t) {
|
|
237
|
+
const e = /Reflect\.|\bProxy\b|ownKeys\(/.test(t), o = ((i) => e ? "" : ve(t, i));
|
|
238
238
|
return o.__blocked = e, o;
|
|
239
239
|
}
|
|
240
|
-
const
|
|
241
|
-
class
|
|
240
|
+
const je = 100;
|
|
241
|
+
class Ke {
|
|
242
242
|
// ============================================================================
|
|
243
243
|
// Sources (raw input from user)
|
|
244
244
|
// ============================================================================
|
|
@@ -449,19 +449,19 @@ class je {
|
|
|
449
449
|
const e = this.#o ? { ...this.#o } : {}, o = Array.isArray(e.columns) ? [...e.columns] : [], i = (this.#r ?? []).map((s) => ({
|
|
450
450
|
...s
|
|
451
451
|
}));
|
|
452
|
-
let n =
|
|
452
|
+
let n = oe(
|
|
453
453
|
o,
|
|
454
454
|
i
|
|
455
455
|
);
|
|
456
|
-
this.#c && this.#c.length && (n =
|
|
456
|
+
this.#c && this.#c.length && (n = oe(
|
|
457
457
|
this.#c,
|
|
458
458
|
i
|
|
459
459
|
));
|
|
460
460
|
const r = this.#s.getRows();
|
|
461
|
-
return n.length === 0 && r.length && (n =
|
|
461
|
+
return n.length === 0 && r.length && (n = ke(r).columns), n.length && (n.forEach((s) => {
|
|
462
462
|
s.sortable === void 0 && (s.sortable = !0), s.resizable === void 0 && (s.resizable = !0), s.__originalWidth === void 0 && typeof s.width == "number" && (s.__originalWidth = s.width);
|
|
463
463
|
}), n.forEach((s) => {
|
|
464
|
-
s.__viewTemplate && !s.__compiledView && (s.__compiledView =
|
|
464
|
+
s.__viewTemplate && !s.__compiledView && (s.__compiledView = se(s.__viewTemplate.innerHTML)), s.__editorTemplate && !s.__compiledEditor && (s.__compiledEditor = se(s.__editorTemplate.innerHTML));
|
|
465
465
|
}), e.columns = n), this.#f && (e.fitMode = this.#f), e.fitMode || (e.fitMode = "stretch"), this.#d && (e.editOn = this.#d), this.#y(e), e.columnState && !this.#b && (this.#b = e.columnState), e;
|
|
466
466
|
}
|
|
467
467
|
/**
|
|
@@ -487,10 +487,10 @@ class je {
|
|
|
487
487
|
const d = Array.from(r.values());
|
|
488
488
|
d.sort((f, p) => (f.order ?? 100) - (p.order ?? 100)), e.shell.headerContents = d;
|
|
489
489
|
}
|
|
490
|
-
const s = this.#s.getShellToolbarButtons(), l = Array.from(s.values()), a = this.#o?.shell?.header?.toolbarButtons ?? [], c = new Set(a.map((d) => d.id)),
|
|
490
|
+
const s = this.#s.getShellToolbarButtons(), l = Array.from(s.values()), a = this.#o?.shell?.header?.toolbarButtons ?? [], c = new Set(a.map((d) => d.id)), h = [...a];
|
|
491
491
|
for (const d of l)
|
|
492
|
-
c.has(d.id) ||
|
|
493
|
-
|
|
492
|
+
c.has(d.id) || h.push(d);
|
|
493
|
+
h.sort((d, f) => (d.order ?? 100) - (f.order ?? 100)), e.shell.header.toolbarButtons = h;
|
|
494
494
|
}
|
|
495
495
|
// ============================================================================
|
|
496
496
|
// State Persistence (Replaces column-state.ts)
|
|
@@ -513,8 +513,8 @@ class je {
|
|
|
513
513
|
a && (s.sort = a);
|
|
514
514
|
for (const c of e)
|
|
515
515
|
if (c.getColumnState) {
|
|
516
|
-
const
|
|
517
|
-
|
|
516
|
+
const h = c.getColumnState(n.field);
|
|
517
|
+
h && Object.assign(s, h);
|
|
518
518
|
}
|
|
519
519
|
return s;
|
|
520
520
|
})
|
|
@@ -532,8 +532,8 @@ class je {
|
|
|
532
532
|
return a.width !== void 0 && (c.width = a.width, c.__renderedWidth = a.width), a.visible !== void 0 && (c.hidden = !a.visible), c;
|
|
533
533
|
});
|
|
534
534
|
r.sort((l, a) => {
|
|
535
|
-
const c = n.get(l.field)?.order ?? 1 / 0,
|
|
536
|
-
return c -
|
|
535
|
+
const c = n.get(l.field)?.order ?? 1 / 0, h = n.get(a.field)?.order ?? 1 / 0;
|
|
536
|
+
return c - h;
|
|
537
537
|
}), this.columns = r;
|
|
538
538
|
const s = e.columns.filter((l) => l.sort !== void 0).sort((l, a) => (l.sort?.priority ?? 0) - (a.sort?.priority ?? 0));
|
|
539
539
|
if (s.length > 0) {
|
|
@@ -586,7 +586,7 @@ class je {
|
|
|
586
586
|
this.#w = void 0;
|
|
587
587
|
const o = this.collectState(e);
|
|
588
588
|
this.#s.emit("column-state-change", o);
|
|
589
|
-
},
|
|
589
|
+
}, je);
|
|
590
590
|
}
|
|
591
591
|
// ============================================================================
|
|
592
592
|
// Column Visibility API
|
|
@@ -664,7 +664,7 @@ class je {
|
|
|
664
664
|
* Parse light DOM columns from host element.
|
|
665
665
|
*/
|
|
666
666
|
parseLightDomColumns(e) {
|
|
667
|
-
this.#r || (this.#n = Array.from(e.querySelectorAll("tbw-grid-column")), this.#r = this.#n.length ?
|
|
667
|
+
this.#r || (this.#n = Array.from(e.querySelectorAll("tbw-grid-column")), this.#r = this.#n.length ? ze(e) : []);
|
|
668
668
|
}
|
|
669
669
|
/**
|
|
670
670
|
* Clear the light DOM columns cache.
|
|
@@ -767,10 +767,10 @@ class je {
|
|
|
767
767
|
this.#v?.disconnect(), this.#l = [], this.#w && clearTimeout(this.#w);
|
|
768
768
|
}
|
|
769
769
|
}
|
|
770
|
-
function
|
|
770
|
+
function Ce(t) {
|
|
771
771
|
return `<span role="checkbox" aria-checked="${t}" aria-label="${t}">${t ? "🗹" : "☐"}</span>`;
|
|
772
772
|
}
|
|
773
|
-
function
|
|
773
|
+
function _e(t) {
|
|
774
774
|
if (t == null || t === "") return "";
|
|
775
775
|
if (t instanceof Date)
|
|
776
776
|
return isNaN(t.getTime()) ? "" : t.toLocaleDateString();
|
|
@@ -780,68 +780,68 @@ function Ce(t) {
|
|
|
780
780
|
}
|
|
781
781
|
return "";
|
|
782
782
|
}
|
|
783
|
-
function
|
|
783
|
+
function ye(t) {
|
|
784
784
|
if (!t) return -1;
|
|
785
785
|
const e = t.getAttribute("data-row");
|
|
786
786
|
return e ? parseInt(e, 10) : -1;
|
|
787
787
|
}
|
|
788
|
-
function
|
|
788
|
+
function Ze(t) {
|
|
789
789
|
if (!t) return -1;
|
|
790
790
|
const e = t.getAttribute("data-col");
|
|
791
791
|
return e ? parseInt(e, 10) : -1;
|
|
792
792
|
}
|
|
793
|
-
function
|
|
793
|
+
function ee(t) {
|
|
794
794
|
t && t.querySelectorAll(".cell-focus").forEach((e) => e.classList.remove("cell-focus"));
|
|
795
795
|
}
|
|
796
|
-
function
|
|
797
|
-
const o =
|
|
798
|
-
o < 0 || i < 0 || (t._focusRow = o, t._focusCol = i,
|
|
796
|
+
function Je(t, e) {
|
|
797
|
+
const o = ye(e), i = Ze(e);
|
|
798
|
+
o < 0 || i < 0 || (t._focusRow = o, t._focusCol = i, ee(t._bodyEl), e.classList.add("cell-focus"), e.setAttribute("aria-selected", "true"));
|
|
799
799
|
}
|
|
800
|
-
function
|
|
800
|
+
function Qe(t, e, o) {
|
|
801
801
|
e.addEventListener(
|
|
802
802
|
"mousedown",
|
|
803
803
|
(i) => {
|
|
804
804
|
const n = i.target.closest(".cell[data-col]");
|
|
805
|
-
n && (n.classList.contains("editing") ||
|
|
805
|
+
n && (n.classList.contains("editing") || Je(t, n));
|
|
806
806
|
},
|
|
807
807
|
{ signal: o }
|
|
808
808
|
);
|
|
809
809
|
}
|
|
810
|
-
function
|
|
810
|
+
function et(t, e) {
|
|
811
811
|
return t == null && e == null ? 0 : t == null ? -1 : e == null || t > e ? 1 : t < e ? -1 : 0;
|
|
812
812
|
}
|
|
813
|
-
function
|
|
814
|
-
const n = o.find((l) => l.field === e.field)?.sortComparator ??
|
|
813
|
+
function tt(t, e, o) {
|
|
814
|
+
const n = o.find((l) => l.field === e.field)?.sortComparator ?? et, { field: r, direction: s } = e;
|
|
815
815
|
return [...t].sort((l, a) => n(l[r], a[r], l, a) * s);
|
|
816
816
|
}
|
|
817
|
-
function
|
|
818
|
-
t._rows = e, t.__rowRenderEpoch++, t._rowPool.forEach((n) => n.__epoch = -1),
|
|
817
|
+
function le(t, e, o, i) {
|
|
818
|
+
t._rows = e, t.__rowRenderEpoch++, t._rowPool.forEach((n) => n.__epoch = -1), X(t), t.refreshVirtualWindow(!0), t.dispatchEvent(
|
|
819
819
|
new CustomEvent("sort-change", { detail: { field: o.field, direction: i } })
|
|
820
820
|
), t.requestStateChange?.();
|
|
821
821
|
}
|
|
822
|
-
function
|
|
823
|
-
!t._sortState || t._sortState.field !== e.field ? (t._sortState || (t.__originalOrder = t._rows.slice()),
|
|
822
|
+
function ae(t, e) {
|
|
823
|
+
!t._sortState || t._sortState.field !== e.field ? (t._sortState || (t.__originalOrder = t._rows.slice()), ce(t, e, 1)) : t._sortState.direction === 1 ? ce(t, e, -1) : (t._sortState = null, t.__rowRenderEpoch++, t._rowPool.forEach((i) => i.__epoch = -1), t._rows = t.__originalOrder.slice(), X(t), t._headerRowEl?.querySelectorAll('[role="columnheader"].sortable')?.forEach((i) => {
|
|
824
824
|
i.getAttribute("aria-sort") ? (i.getAttribute("aria-sort") === "ascending" || i.getAttribute("aria-sort") === "descending") && (t._sortState || i.setAttribute("aria-sort", "none")) : i.setAttribute("aria-sort", "none");
|
|
825
825
|
}), t.refreshVirtualWindow(!0), t.dispatchEvent(
|
|
826
826
|
new CustomEvent("sort-change", { detail: { field: e.field, direction: 0 } })
|
|
827
827
|
), t.requestStateChange?.());
|
|
828
828
|
}
|
|
829
|
-
function
|
|
829
|
+
function ce(t, e, o) {
|
|
830
830
|
t._sortState = { field: e.field, direction: o };
|
|
831
|
-
const i = { field: e.field, direction: o }, n = t._columns, s = (t.effectiveConfig?.sortHandler ??
|
|
831
|
+
const i = { field: e.field, direction: o }, n = t._columns, s = (t.effectiveConfig?.sortHandler ?? tt)(t._rows, i, n);
|
|
832
832
|
s && typeof s.then == "function" ? s.then((l) => {
|
|
833
|
-
|
|
834
|
-
}) :
|
|
833
|
+
le(t, l, e, o);
|
|
834
|
+
}) : le(t, s, e, o);
|
|
835
835
|
}
|
|
836
|
-
function
|
|
836
|
+
function ot(t, e) {
|
|
837
837
|
typeof e == "string" ? t.textContent = e : e instanceof HTMLElement && (t.innerHTML = "", t.appendChild(e.cloneNode(!0)));
|
|
838
838
|
}
|
|
839
|
-
function
|
|
839
|
+
function X(t) {
|
|
840
840
|
t._headerRowEl = t.findHeaderRow();
|
|
841
841
|
const e = t._headerRowEl;
|
|
842
842
|
e.innerHTML = "", t._visibleColumns.forEach((o, i) => {
|
|
843
843
|
const n = document.createElement("div");
|
|
844
|
-
n.className = "cell",
|
|
844
|
+
n.className = "cell", ie(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));
|
|
845
845
|
const r = o.__headerTemplate;
|
|
846
846
|
if (r) Array.from(r.childNodes).forEach((s) => n.appendChild(s.cloneNode(!0)));
|
|
847
847
|
else {
|
|
@@ -851,19 +851,19 @@ function F(t) {
|
|
|
851
851
|
if (o.sortable) {
|
|
852
852
|
n.classList.add("sortable"), n.tabIndex = 0;
|
|
853
853
|
const s = document.createElement("span");
|
|
854
|
-
|
|
854
|
+
ie(s, "sort-indicator");
|
|
855
855
|
const l = t._sortState?.field === o.field ? t._sortState.direction : 0, a = { ...L, ...t.icons }, c = l === 1 ? a.sortAsc : l === -1 ? a.sortDesc : a.sortNone;
|
|
856
|
-
|
|
857
|
-
t._resizeController?.isResizing || t._dispatchHeaderClick?.(
|
|
858
|
-
}), n.addEventListener("keydown", (
|
|
859
|
-
if (
|
|
860
|
-
if (
|
|
861
|
-
|
|
856
|
+
ot(s, c), n.appendChild(s), n.setAttribute("aria-sort", l === 0 ? "none" : l === 1 ? "ascending" : "descending"), n.addEventListener("click", (h) => {
|
|
857
|
+
t._resizeController?.isResizing || t._dispatchHeaderClick?.(h, i, n) || ae(t, o);
|
|
858
|
+
}), n.addEventListener("keydown", (h) => {
|
|
859
|
+
if (h.key === "Enter" || h.key === " ") {
|
|
860
|
+
if (h.preventDefault(), t._dispatchHeaderClick?.(h, i, n)) return;
|
|
861
|
+
ae(t, o);
|
|
862
862
|
}
|
|
863
863
|
});
|
|
864
864
|
}
|
|
865
865
|
if (o.resizable) {
|
|
866
|
-
n.
|
|
866
|
+
n.classList.add("resizable");
|
|
867
867
|
const s = document.createElement("div");
|
|
868
868
|
s.className = "resize-handle", s.setAttribute("aria-hidden", "true"), s.addEventListener("mousedown", (l) => {
|
|
869
869
|
l.stopPropagation(), l.preventDefault(), t._resizeController.start(l, i, n);
|
|
@@ -876,9 +876,9 @@ function F(t) {
|
|
|
876
876
|
o.getAttribute("aria-sort") || o.setAttribute("aria-sort", "none");
|
|
877
877
|
}), e.children.length > 0 ? (e.setAttribute("role", "row"), e.setAttribute("aria-rowindex", "1")) : (e.removeAttribute("role"), e.removeAttribute("aria-rowindex"));
|
|
878
878
|
}
|
|
879
|
-
const
|
|
880
|
-
function
|
|
881
|
-
return
|
|
879
|
+
const Ee = typeof requestIdleCallback == "function";
|
|
880
|
+
function it(t, e) {
|
|
881
|
+
return Ee ? requestIdleCallback(t, e) : window.setTimeout(() => {
|
|
882
882
|
const o = Date.now();
|
|
883
883
|
t({
|
|
884
884
|
didTimeout: !1,
|
|
@@ -886,35 +886,35 @@ function ot(t, e) {
|
|
|
886
886
|
});
|
|
887
887
|
}, 1);
|
|
888
888
|
}
|
|
889
|
-
function
|
|
890
|
-
|
|
889
|
+
function de(t) {
|
|
890
|
+
Ee ? cancelIdleCallback(t) : clearTimeout(t);
|
|
891
891
|
}
|
|
892
|
-
const
|
|
893
|
-
function
|
|
892
|
+
const Se = 'input,select,textarea,[contenteditable="true"],[contenteditable=""],[tabindex]:not([tabindex="-1"])';
|
|
893
|
+
function j(t) {
|
|
894
894
|
return (t.__editingCellCount ?? 0) > 0;
|
|
895
895
|
}
|
|
896
|
-
function
|
|
896
|
+
function K(t) {
|
|
897
897
|
t.__editingCellCount = 0, t.removeAttribute("data-has-editing"), t.querySelectorAll(".cell.editing").forEach((o) => o.classList.remove("editing"));
|
|
898
898
|
}
|
|
899
|
-
const
|
|
900
|
-
|
|
899
|
+
const Re = document.createElement("template");
|
|
900
|
+
Re.innerHTML = '<div class="cell" role="gridcell" part="cell"></div>';
|
|
901
901
|
const Te = document.createElement("template");
|
|
902
902
|
Te.innerHTML = '<div class="data-grid-row" role="row" part="row"></div>';
|
|
903
|
-
function it() {
|
|
904
|
-
return Se.content.firstElementChild.cloneNode(!0);
|
|
905
|
-
}
|
|
906
903
|
function nt() {
|
|
904
|
+
return Re.content.firstElementChild.cloneNode(!0);
|
|
905
|
+
}
|
|
906
|
+
function rt() {
|
|
907
907
|
return Te.content.firstElementChild.cloneNode(!0);
|
|
908
908
|
}
|
|
909
|
-
function
|
|
909
|
+
function $(t) {
|
|
910
910
|
t.__cellDisplayCache = void 0, t.__cellCacheEpoch = void 0, t.__hasSpecialColumns = void 0;
|
|
911
911
|
}
|
|
912
|
-
function
|
|
912
|
+
function st(t, e, o, i, n) {
|
|
913
913
|
const r = Math.max(0, o - e), s = t._bodyEl, l = t._visibleColumns, a = l.length;
|
|
914
914
|
let c = t.__cachedHeaderRowCount;
|
|
915
915
|
for (c === void 0 && (c = t.shadowRoot?.querySelector(".header-group-row") ? 2 : 1, t.__cachedHeaderRowCount = c); t._rowPool.length < r; ) {
|
|
916
|
-
const d =
|
|
917
|
-
d.addEventListener("click", (f) =>
|
|
916
|
+
const d = rt();
|
|
917
|
+
d.addEventListener("click", (f) => he(t, f, d)), d.addEventListener("dblclick", (f) => he(t, f, d)), t._rowPool.push(d);
|
|
918
918
|
}
|
|
919
919
|
if (t._rowPool.length > r) {
|
|
920
920
|
for (let d = r; d < t._rowPool.length; d++) {
|
|
@@ -923,44 +923,44 @@ function rt(t, e, o, i, n) {
|
|
|
923
923
|
}
|
|
924
924
|
t._rowPool.length = r;
|
|
925
925
|
}
|
|
926
|
-
const
|
|
926
|
+
const h = n && t.__hasRenderRowPlugins !== !1;
|
|
927
927
|
for (let d = 0; d < r; d++) {
|
|
928
|
-
const f = e + d, p = t._rows[f],
|
|
929
|
-
if (
|
|
930
|
-
|
|
928
|
+
const f = e + d, p = t._rows[f], u = t._rowPool[d];
|
|
929
|
+
if (u.setAttribute("aria-rowindex", String(f + c + 1)), h && n(p, u, f)) {
|
|
930
|
+
u.__epoch = i, u.__rowDataRef = p, u.parentNode !== s && s.appendChild(u);
|
|
931
931
|
continue;
|
|
932
932
|
}
|
|
933
|
-
const g =
|
|
933
|
+
const g = u.__epoch, m = u.__rowDataRef, b = u.children.length, w = g === i && b === a, C = m !== p;
|
|
934
934
|
let y = !1;
|
|
935
935
|
if (w && C) {
|
|
936
936
|
for (let x = 0; x < a; x++)
|
|
937
|
-
if (l[x].externalView && !
|
|
937
|
+
if (l[x].externalView && !u.querySelector(`.cell[data-col="${x}"] [data-external-view]`)) {
|
|
938
938
|
y = !0;
|
|
939
939
|
break;
|
|
940
940
|
}
|
|
941
941
|
}
|
|
942
942
|
if (!w || y) {
|
|
943
|
-
const x =
|
|
944
|
-
x && !v ? (
|
|
943
|
+
const x = j(u), v = t._activeEditRows === f;
|
|
944
|
+
x && !v ? (u.__isCustomRow && (u.className = "data-grid-row", u.setAttribute("role", "row"), u.__isCustomRow = !1), K(u), B(t, u, p, f), u.__epoch = i, u.__rowDataRef = p) : x && v ? (Z(t, u, p, f), u.__rowDataRef = p) : (u.__isCustomRow && (u.className = "data-grid-row", u.setAttribute("role", "row"), u.__isCustomRow = !1), B(t, u, p, f), u.__epoch = i, u.__rowDataRef = p);
|
|
945
945
|
} else if (C) {
|
|
946
|
-
const x =
|
|
947
|
-
x && !v ? (
|
|
946
|
+
const x = j(u), v = t._activeEditRows === f;
|
|
947
|
+
x && !v ? (K(u), B(t, u, p, f), u.__epoch = i, u.__rowDataRef = p) : (Z(t, u, p, f), u.__rowDataRef = p);
|
|
948
948
|
} else {
|
|
949
|
-
const x =
|
|
950
|
-
x && !v ? (
|
|
949
|
+
const x = j(u), v = t._activeEditRows === f;
|
|
950
|
+
x && !v ? (K(u), B(t, u, p, f), u.__epoch = i, u.__rowDataRef = p) : Z(t, u, p, f);
|
|
951
951
|
}
|
|
952
|
-
const S = t._changedRowIndices?.has(f) ?? !1,
|
|
953
|
-
S !==
|
|
952
|
+
const S = t._changedRowIndices?.has(f) ?? !1, U = u.classList.contains("changed");
|
|
953
|
+
S !== U && u.classList.toggle("changed", S), u.parentNode !== s && s.appendChild(u);
|
|
954
954
|
}
|
|
955
955
|
}
|
|
956
|
-
function
|
|
957
|
-
const n = e.children, r = t._visibleColumns, s = r.length, l = n.length, a = s < l ? s : l, c = t._focusRow,
|
|
956
|
+
function Z(t, e, o, i) {
|
|
957
|
+
const n = e.children, r = t._visibleColumns, s = r.length, l = n.length, a = s < l ? s : l, c = t._focusRow, h = t._focusCol;
|
|
958
958
|
let d = t.__hasSpecialColumns;
|
|
959
959
|
if (d === void 0) {
|
|
960
960
|
d = !1;
|
|
961
961
|
for (let p = 0; p < s; p++) {
|
|
962
|
-
const
|
|
963
|
-
if (
|
|
962
|
+
const u = r[p];
|
|
963
|
+
if (u.__viewTemplate || u.__compiledView || u.renderer || u.viewRenderer || u.externalView || u.format || u.type === "date" || u.type === "boolean") {
|
|
964
964
|
d = !0;
|
|
965
965
|
break;
|
|
966
966
|
}
|
|
@@ -970,49 +970,49 @@ function K(t, e, o, i) {
|
|
|
970
970
|
const f = String(i);
|
|
971
971
|
if (!d) {
|
|
972
972
|
for (let p = 0; p < a; p++) {
|
|
973
|
-
const
|
|
974
|
-
|
|
975
|
-
const m = c === i &&
|
|
976
|
-
m !== b && (
|
|
973
|
+
const u = n[p], g = o[r[p].field];
|
|
974
|
+
u.textContent = g == null ? "" : String(g), u.getAttribute("data-row") !== f && u.setAttribute("data-row", f);
|
|
975
|
+
const m = c === i && h === p, b = u.classList.contains("cell-focus");
|
|
976
|
+
m !== b && (u.classList.toggle("cell-focus", m), u.setAttribute("aria-selected", String(m)));
|
|
977
977
|
}
|
|
978
978
|
return;
|
|
979
979
|
}
|
|
980
980
|
for (let p = 0; p < a; p++)
|
|
981
981
|
if (r[p].externalView && !n[p].querySelector("[data-external-view]")) {
|
|
982
|
-
|
|
982
|
+
B(t, e, o, i);
|
|
983
983
|
return;
|
|
984
984
|
}
|
|
985
985
|
for (let p = 0; p < a; p++) {
|
|
986
|
-
const
|
|
986
|
+
const u = r[p], g = n[p];
|
|
987
987
|
g.getAttribute("data-row") !== f && g.setAttribute("data-row", f);
|
|
988
|
-
const m = c === i &&
|
|
988
|
+
const m = c === i && h === p, b = g.classList.contains("cell-focus");
|
|
989
989
|
if (m !== b && (g.classList.toggle("cell-focus", m), g.setAttribute("aria-selected", String(m))), g.classList.contains("editing")) continue;
|
|
990
|
-
const _ =
|
|
990
|
+
const _ = u.renderer || u.viewRenderer;
|
|
991
991
|
if (_) {
|
|
992
|
-
const y = o[
|
|
993
|
-
typeof S == "string" ? g.innerHTML =
|
|
992
|
+
const y = o[u.field], S = _({ row: o, value: y, field: u.field, column: u, cellEl: g });
|
|
993
|
+
typeof S == "string" ? g.innerHTML = F(S) : S instanceof Node ? S.parentElement !== g && (g.innerHTML = "", g.appendChild(S)) : S == null && (g.textContent = y == null ? "" : String(y));
|
|
994
994
|
continue;
|
|
995
995
|
}
|
|
996
|
-
if (
|
|
996
|
+
if (u.__viewTemplate || u.__compiledView || u.externalView)
|
|
997
997
|
continue;
|
|
998
|
-
const w = o[
|
|
998
|
+
const w = o[u.field];
|
|
999
999
|
let C;
|
|
1000
|
-
if (
|
|
1000
|
+
if (u.format)
|
|
1001
1001
|
try {
|
|
1002
|
-
const y =
|
|
1002
|
+
const y = u.format(w, o);
|
|
1003
1003
|
C = y == null ? "" : String(y);
|
|
1004
1004
|
} catch (y) {
|
|
1005
|
-
console.warn(`[tbw-grid] Format error in column '${
|
|
1005
|
+
console.warn(`[tbw-grid] Format error in column '${u.field}':`, y), C = w == null ? "" : String(w);
|
|
1006
1006
|
}
|
|
1007
|
-
else
|
|
1007
|
+
else u.type === "date" ? (C = _e(w), g.textContent = C) : u.type === "boolean" ? g.innerHTML = Ce(!!w) : (C = w == null ? "" : String(w), g.textContent = C);
|
|
1008
1008
|
}
|
|
1009
1009
|
}
|
|
1010
|
-
function
|
|
1010
|
+
function B(t, e, o, i) {
|
|
1011
1011
|
e.innerHTML = "";
|
|
1012
1012
|
const n = t._visibleColumns, r = n.length, s = t._focusRow, l = t._focusCol, a = t, c = document.createDocumentFragment();
|
|
1013
|
-
for (let
|
|
1014
|
-
const d = n[
|
|
1015
|
-
f.setAttribute("aria-colindex", String(
|
|
1013
|
+
for (let h = 0; h < r; h++) {
|
|
1014
|
+
const d = n[h], f = nt();
|
|
1015
|
+
f.setAttribute("aria-colindex", String(h + 1)), f.setAttribute("data-col", String(h)), f.setAttribute("data-row", String(i)), f.setAttribute("data-field", d.field), d.type && f.setAttribute("data-type", d.type);
|
|
1016
1016
|
let p = o[d.field];
|
|
1017
1017
|
if (d.format)
|
|
1018
1018
|
try {
|
|
@@ -1020,11 +1020,11 @@ function I(t, e, o, i) {
|
|
|
1020
1020
|
} catch (w) {
|
|
1021
1021
|
console.warn(`[tbw-grid] Format error in column '${d.field}':`, w);
|
|
1022
1022
|
}
|
|
1023
|
-
const
|
|
1023
|
+
const u = d.__compiledView, g = d.__viewTemplate, m = d.renderer || d.viewRenderer, b = d.externalView;
|
|
1024
1024
|
let _ = !1;
|
|
1025
1025
|
if (m) {
|
|
1026
1026
|
const w = m({ row: o, value: p, field: d.field, column: d, cellEl: f });
|
|
1027
|
-
typeof w == "string" ? (f.innerHTML =
|
|
1027
|
+
typeof w == "string" ? (f.innerHTML = F(w), _ = !0) : w instanceof Node ? w.parentElement !== f && (f.textContent = "", f.appendChild(w)) : w == null && (f.textContent = p == null ? "" : String(p));
|
|
1028
1028
|
} else if (b) {
|
|
1029
1029
|
const w = b, C = document.createElement("div");
|
|
1030
1030
|
C.setAttribute("data-external-view", ""), C.setAttribute("data-field", d.field), f.appendChild(C);
|
|
@@ -1050,26 +1050,26 @@ function I(t, e, o, i) {
|
|
|
1050
1050
|
}
|
|
1051
1051
|
});
|
|
1052
1052
|
C.setAttribute("data-mounted", "");
|
|
1053
|
-
} else if (
|
|
1054
|
-
const w =
|
|
1055
|
-
f.innerHTML = C ? "" :
|
|
1053
|
+
} else if (u) {
|
|
1054
|
+
const w = u({ row: o, value: p, field: d.field, column: d }), C = u.__blocked;
|
|
1055
|
+
f.innerHTML = C ? "" : F(w), _ = !0, C && (f.textContent = "", f.setAttribute("data-blocked-template", ""));
|
|
1056
1056
|
} else if (g) {
|
|
1057
1057
|
const w = g.innerHTML;
|
|
1058
|
-
/Reflect\.|\bProxy\b|ownKeys\(/.test(w) ? (f.textContent = "", f.setAttribute("data-blocked-template", "")) : (f.innerHTML =
|
|
1058
|
+
/Reflect\.|\bProxy\b|ownKeys\(/.test(w) ? (f.textContent = "", f.setAttribute("data-blocked-template", "")) : (f.innerHTML = F(ve(w, { row: o, value: p })), _ = !0);
|
|
1059
1059
|
} else
|
|
1060
|
-
d.type === "date" ? f.textContent =
|
|
1060
|
+
d.type === "date" ? f.textContent = _e(p) : d.type === "boolean" ? f.innerHTML = Ce(!!p) : f.textContent = p == null ? "" : String(p);
|
|
1061
1061
|
if (_) {
|
|
1062
|
-
|
|
1062
|
+
Ye(f);
|
|
1063
1063
|
const w = f.textContent || "";
|
|
1064
1064
|
/Proxy|Reflect\.ownKeys/.test(w) && (f.textContent = w.replace(/Proxy|Reflect\.ownKeys/g, "").trim(), /Proxy|Reflect\.ownKeys/.test(f.textContent || "") && (f.textContent = ""));
|
|
1065
1065
|
}
|
|
1066
|
-
f.hasAttribute("data-blocked-template") && (f.textContent || "").trim().length && (f.textContent = ""), d.editable ? f.tabIndex = 0 : d.type === "boolean" && (f.hasAttribute("tabindex") || (f.tabIndex = 0)), s === i && l ===
|
|
1066
|
+
f.hasAttribute("data-blocked-template") && (f.textContent || "").trim().length && (f.textContent = ""), d.editable ? f.tabIndex = 0 : d.type === "boolean" && (f.hasAttribute("tabindex") || (f.tabIndex = 0)), s === i && l === h ? (f.classList.add("cell-focus"), f.setAttribute("aria-selected", "true")) : f.setAttribute("aria-selected", "false"), c.appendChild(f);
|
|
1067
1067
|
}
|
|
1068
1068
|
e.appendChild(c);
|
|
1069
1069
|
}
|
|
1070
|
-
function
|
|
1070
|
+
function he(t, e, o, i) {
|
|
1071
1071
|
if (e.target?.closest(".resize-handle")) return;
|
|
1072
|
-
const n = o.querySelector(".cell[data-row]"), r =
|
|
1072
|
+
const n = o.querySelector(".cell[data-row]"), r = ye(n);
|
|
1073
1073
|
if (r < 0) return;
|
|
1074
1074
|
const s = t._rows[r];
|
|
1075
1075
|
if (!s || t._dispatchRowClick?.(e, r, s, o))
|
|
@@ -1082,30 +1082,30 @@ function de(t, e, o, i) {
|
|
|
1082
1082
|
return;
|
|
1083
1083
|
const c = t._focusRow !== r || t._focusCol !== a;
|
|
1084
1084
|
if (t._focusRow = r, t._focusCol = a, l.classList.contains("editing")) {
|
|
1085
|
-
c && (
|
|
1086
|
-
const
|
|
1085
|
+
c && (ee(t.shadowRoot ?? t._bodyEl), l.classList.add("cell-focus"));
|
|
1086
|
+
const h = l.querySelector(Se);
|
|
1087
1087
|
try {
|
|
1088
|
-
|
|
1088
|
+
h?.focus({ preventScroll: !0 });
|
|
1089
1089
|
} catch {
|
|
1090
1090
|
}
|
|
1091
1091
|
return;
|
|
1092
1092
|
}
|
|
1093
|
-
|
|
1093
|
+
q(t);
|
|
1094
1094
|
}
|
|
1095
1095
|
}
|
|
1096
1096
|
}
|
|
1097
|
-
function
|
|
1097
|
+
function lt(t, e) {
|
|
1098
1098
|
if (t._dispatchKeyDown?.(e))
|
|
1099
1099
|
return;
|
|
1100
|
-
const o = t._rows.length - 1, i = t._visibleColumns.length - 1, n = t._activeEditRows !== void 0 && t._activeEditRows !== -1, s = t._visibleColumns[t._focusCol]?.type, l = e.composedPath?.() ?? [], a = l.length ? l[0] : e.target, c = (
|
|
1101
|
-
if (!
|
|
1102
|
-
const d =
|
|
1103
|
-
return !!(d === "INPUT" || d === "SELECT" || d === "TEXTAREA" ||
|
|
1100
|
+
const o = t._rows.length - 1, i = t._visibleColumns.length - 1, n = t._activeEditRows !== void 0 && t._activeEditRows !== -1, s = t._visibleColumns[t._focusCol]?.type, l = e.composedPath?.() ?? [], a = l.length ? l[0] : e.target, c = (h) => {
|
|
1101
|
+
if (!h) return !1;
|
|
1102
|
+
const d = h.tagName;
|
|
1103
|
+
return !!(d === "INPUT" || d === "SELECT" || d === "TEXTAREA" || h.isContentEditable);
|
|
1104
1104
|
};
|
|
1105
1105
|
if (!(c(a) && (e.key === "Home" || e.key === "End")) && !(c(a) && (e.key === "ArrowUp" || e.key === "ArrowDown") && a.tagName === "INPUT" && a.type === "number") && !(c(a) && (e.key === "ArrowLeft" || e.key === "ArrowRight")) && !(c(a) && (e.key === "Enter" || e.key === "Escape")) && !(n && (s === "select" || s === "typeahead") && (e.key === "ArrowDown" || e.key === "ArrowUp"))) {
|
|
1106
1106
|
switch (e.key) {
|
|
1107
1107
|
case "Tab": {
|
|
1108
|
-
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),
|
|
1108
|
+
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), q(t);
|
|
1109
1109
|
return;
|
|
1110
1110
|
}
|
|
1111
1111
|
case "ArrowDown":
|
|
@@ -1121,10 +1121,10 @@ function st(t, e) {
|
|
|
1121
1121
|
t._focusCol = Math.max(0, t._focusCol - 1), e.preventDefault();
|
|
1122
1122
|
break;
|
|
1123
1123
|
case "Home":
|
|
1124
|
-
(e.ctrlKey || e.metaKey) && (n && typeof t.commitActiveRowEdit == "function" && t.commitActiveRowEdit(), t._focusRow = 0), t._focusCol = 0, e.preventDefault(),
|
|
1124
|
+
(e.ctrlKey || e.metaKey) && (n && typeof t.commitActiveRowEdit == "function" && t.commitActiveRowEdit(), t._focusRow = 0), t._focusCol = 0, e.preventDefault(), q(t, { forceScrollLeft: !0 });
|
|
1125
1125
|
return;
|
|
1126
1126
|
case "End":
|
|
1127
|
-
(e.ctrlKey || e.metaKey) && (n && typeof t.commitActiveRowEdit == "function" && t.commitActiveRowEdit(), t._focusRow = o), t._focusCol = i, e.preventDefault(),
|
|
1127
|
+
(e.ctrlKey || e.metaKey) && (n && typeof t.commitActiveRowEdit == "function" && t.commitActiveRowEdit(), t._focusRow = o), t._focusCol = i, e.preventDefault(), q(t, { forceScrollRight: !0 });
|
|
1128
1128
|
return;
|
|
1129
1129
|
case "PageDown":
|
|
1130
1130
|
t._focusRow = Math.min(o, t._focusRow + 20), e.preventDefault();
|
|
@@ -1142,19 +1142,19 @@ function st(t, e) {
|
|
|
1142
1142
|
default:
|
|
1143
1143
|
return;
|
|
1144
1144
|
}
|
|
1145
|
-
|
|
1145
|
+
q(t);
|
|
1146
1146
|
}
|
|
1147
1147
|
}
|
|
1148
|
-
function
|
|
1148
|
+
function q(t, e) {
|
|
1149
1149
|
if (t._virtualization?.enabled) {
|
|
1150
|
-
const { rowHeight: s, container: l, viewportEl: a } = t._virtualization, c = l,
|
|
1151
|
-
if (c &&
|
|
1150
|
+
const { rowHeight: s, container: l, viewportEl: a } = t._virtualization, c = l, h = a?.clientHeight ?? c?.clientHeight ?? 0;
|
|
1151
|
+
if (c && h > 0) {
|
|
1152
1152
|
const d = t._focusRow * s;
|
|
1153
|
-
d < c.scrollTop ? c.scrollTop = d : d + s > c.scrollTop +
|
|
1153
|
+
d < c.scrollTop ? c.scrollTop = d : d + s > c.scrollTop + h && (c.scrollTop = d - h + s);
|
|
1154
1154
|
}
|
|
1155
1155
|
}
|
|
1156
1156
|
const o = t._activeEditRows !== void 0 && t._activeEditRows !== -1;
|
|
1157
|
-
o || t.refreshVirtualWindow(!1),
|
|
1157
|
+
o || t.refreshVirtualWindow(!1), ee(t._bodyEl), Array.from(t._bodyEl.querySelectorAll('[aria-selected="true"]')).forEach((s) => {
|
|
1158
1158
|
s.setAttribute("aria-selected", "false");
|
|
1159
1159
|
});
|
|
1160
1160
|
const i = t._focusRow, n = t._virtualization.start ?? 0, r = t._virtualization.end ?? t._rows.length;
|
|
@@ -1171,12 +1171,12 @@ function B(t, e) {
|
|
|
1171
1171
|
else {
|
|
1172
1172
|
const c = t._getHorizontalScrollOffsets?.(s ?? void 0, l) ?? { left: 0, right: 0 };
|
|
1173
1173
|
if (!c.skipScroll) {
|
|
1174
|
-
const
|
|
1175
|
-
f <
|
|
1174
|
+
const h = l.getBoundingClientRect(), d = a.getBoundingClientRect(), f = h.left - d.left + a.scrollLeft, p = f + h.width, u = a.scrollLeft + c.left, g = a.scrollLeft + a.clientWidth - c.right;
|
|
1175
|
+
f < u ? a.scrollLeft = f - c.left : p > g && (a.scrollLeft = p - a.clientWidth + c.right);
|
|
1176
1176
|
}
|
|
1177
1177
|
}
|
|
1178
1178
|
if (t._activeEditRows !== void 0 && t._activeEditRows !== -1 && l.classList.contains("editing")) {
|
|
1179
|
-
const c = l.querySelector(
|
|
1179
|
+
const c = l.querySelector(Se);
|
|
1180
1180
|
if (c && document.activeElement !== c)
|
|
1181
1181
|
try {
|
|
1182
1182
|
c.focus({ preventScroll: !0 });
|
|
@@ -1192,8 +1192,8 @@ function B(t, e) {
|
|
|
1192
1192
|
}
|
|
1193
1193
|
}
|
|
1194
1194
|
}
|
|
1195
|
-
var
|
|
1196
|
-
class
|
|
1195
|
+
var R = /* @__PURE__ */ ((t) => (t[t.STYLE = 1] = "STYLE", t[t.VIRTUALIZATION = 2] = "VIRTUALIZATION", t[t.HEADER = 3] = "HEADER", t[t.ROWS = 4] = "ROWS", t[t.COLUMNS = 5] = "COLUMNS", t[t.FULL = 6] = "FULL", t))(R || {});
|
|
1196
|
+
class at {
|
|
1197
1197
|
#o;
|
|
1198
1198
|
/** Current pending phase (0 = none pending) */
|
|
1199
1199
|
#c = 0;
|
|
@@ -1272,15 +1272,15 @@ class lt {
|
|
|
1272
1272
|
this.#c = 0, e >= 5 && this.#o.mergeConfig(), e >= 4 && this.#o.processRows(), e >= 5 && (this.#o.processColumns(), this.#o.updateTemplate()), e >= 3 && this.#o.renderHeader(), e >= 2 && this.#o.renderVirtualWindow(), e >= 1 && this.#o.afterRender(), !this.#h && this.#n && (this.#h = !0, this.#n()), this.#r && (this.#r(), this.#r = null, this.#d = null);
|
|
1273
1273
|
}
|
|
1274
1274
|
}
|
|
1275
|
-
function
|
|
1275
|
+
function ct(t) {
|
|
1276
1276
|
let e = null, o = null, i = null, n = null;
|
|
1277
1277
|
const r = (a) => {
|
|
1278
1278
|
if (!e) return;
|
|
1279
|
-
const c = a.clientX - e.startX,
|
|
1280
|
-
d.width =
|
|
1279
|
+
const c = a.clientX - e.startX, h = Math.max(40, e.startWidth + c), d = t._visibleColumns[e.colIndex];
|
|
1280
|
+
d.width = h, d.__userResized = !0, d.__renderedWidth = h, o == null && (o = requestAnimationFrame(() => {
|
|
1281
1281
|
o = null, t.updateTemplate?.();
|
|
1282
1282
|
})), t.dispatchEvent(
|
|
1283
|
-
new CustomEvent("column-resize", { detail: { field: d.field, width:
|
|
1283
|
+
new CustomEvent("column-resize", { detail: { field: d.field, width: h } })
|
|
1284
1284
|
);
|
|
1285
1285
|
};
|
|
1286
1286
|
let s = !1;
|
|
@@ -1294,9 +1294,9 @@ function at(t) {
|
|
|
1294
1294
|
get isResizing() {
|
|
1295
1295
|
return e !== null || s;
|
|
1296
1296
|
},
|
|
1297
|
-
start(a, c,
|
|
1297
|
+
start(a, c, h) {
|
|
1298
1298
|
a.preventDefault();
|
|
1299
|
-
const d =
|
|
1299
|
+
const d = h.getBoundingClientRect();
|
|
1300
1300
|
e = { startX: a.clientX, colIndex: c, startWidth: d.width }, window.addEventListener("mousemove", r), 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";
|
|
1301
1301
|
},
|
|
1302
1302
|
resetColumn(a) {
|
|
@@ -1310,7 +1310,7 @@ function at(t) {
|
|
|
1310
1310
|
}
|
|
1311
1311
|
};
|
|
1312
1312
|
}
|
|
1313
|
-
function
|
|
1313
|
+
function G(t, e, o) {
|
|
1314
1314
|
const i = document.createElement(t);
|
|
1315
1315
|
if (e)
|
|
1316
1316
|
for (const n in e) {
|
|
@@ -1319,7 +1319,7 @@ function $(t, e, o) {
|
|
|
1319
1319
|
}
|
|
1320
1320
|
return i;
|
|
1321
1321
|
}
|
|
1322
|
-
function
|
|
1322
|
+
function T(t, e) {
|
|
1323
1323
|
const o = document.createElement("div");
|
|
1324
1324
|
if (t && (o.className = t), e)
|
|
1325
1325
|
for (const i in e) {
|
|
@@ -1328,7 +1328,7 @@ function R(t, e) {
|
|
|
1328
1328
|
}
|
|
1329
1329
|
return o;
|
|
1330
1330
|
}
|
|
1331
|
-
function
|
|
1331
|
+
function xe(t, e, o) {
|
|
1332
1332
|
const i = document.createElement("button");
|
|
1333
1333
|
if (t && (i.className = t), e)
|
|
1334
1334
|
for (const n in e) {
|
|
@@ -1337,12 +1337,12 @@ function Re(t, e, o) {
|
|
|
1337
1337
|
}
|
|
1338
1338
|
return i;
|
|
1339
1339
|
}
|
|
1340
|
-
function
|
|
1340
|
+
function ue(t) {
|
|
1341
1341
|
const e = document.createElement("slot");
|
|
1342
1342
|
return t && (e.name = t), e;
|
|
1343
1343
|
}
|
|
1344
|
-
const
|
|
1345
|
-
|
|
1344
|
+
const Ae = document.createElement("template");
|
|
1345
|
+
Ae.innerHTML = `
|
|
1346
1346
|
<div class="tbw-scroll-area">
|
|
1347
1347
|
<div class="rows-body-wrapper">
|
|
1348
1348
|
<div class="rows-body" role="grid">
|
|
@@ -1361,34 +1361,34 @@ xe.innerHTML = `
|
|
|
1361
1361
|
<div class="faux-vscroll-spacer"></div>
|
|
1362
1362
|
</div>
|
|
1363
1363
|
`;
|
|
1364
|
-
function
|
|
1365
|
-
return
|
|
1364
|
+
function Pe() {
|
|
1365
|
+
return Ae.content.cloneNode(!0);
|
|
1366
1366
|
}
|
|
1367
|
-
function
|
|
1368
|
-
const e = document.createDocumentFragment(), o =
|
|
1367
|
+
function fe(t) {
|
|
1368
|
+
const e = document.createDocumentFragment(), o = T(t.hasShell ? "tbw-grid-root has-shell" : "tbw-grid-root");
|
|
1369
1369
|
if (t.hasShell && t.shellHeader && t.shellBody)
|
|
1370
1370
|
o.appendChild(t.shellHeader), o.appendChild(t.shellBody);
|
|
1371
1371
|
else {
|
|
1372
|
-
const i =
|
|
1373
|
-
i.appendChild(
|
|
1372
|
+
const i = T("tbw-grid-content");
|
|
1373
|
+
i.appendChild(Pe()), o.appendChild(i);
|
|
1374
1374
|
}
|
|
1375
1375
|
return e.appendChild(o), e;
|
|
1376
1376
|
}
|
|
1377
|
-
function
|
|
1378
|
-
const e =
|
|
1377
|
+
function dt(t) {
|
|
1378
|
+
const e = T("tbw-shell-header", { part: "shell-header", role: "presentation" });
|
|
1379
1379
|
if (t.title) {
|
|
1380
|
-
const r =
|
|
1380
|
+
const r = T("tbw-shell-title");
|
|
1381
1381
|
r.textContent = t.title, e.appendChild(r);
|
|
1382
1382
|
}
|
|
1383
|
-
const o =
|
|
1384
|
-
o.appendChild(
|
|
1385
|
-
const i =
|
|
1383
|
+
const o = T("tbw-shell-content", { part: "shell-content", role: "presentation" });
|
|
1384
|
+
o.appendChild(ue("header-content")), e.appendChild(o);
|
|
1385
|
+
const i = T("tbw-shell-toolbar", { part: "shell-toolbar", role: "presentation" });
|
|
1386
1386
|
for (const r of t.configButtons)
|
|
1387
|
-
(r.hasElement || r.hasRender) && i.appendChild(
|
|
1387
|
+
(r.hasElement || r.hasRender) && i.appendChild(T("tbw-toolbar-btn-slot", { "data-btn-slot": r.id }));
|
|
1388
1388
|
for (const r of t.apiButtons)
|
|
1389
|
-
(r.hasElement || r.hasRender) && i.appendChild(
|
|
1390
|
-
if (i.appendChild(
|
|
1391
|
-
const r =
|
|
1389
|
+
(r.hasElement || r.hasRender) && i.appendChild(T("tbw-toolbar-btn-slot", { "data-btn-slot": r.id }));
|
|
1390
|
+
if (i.appendChild(ue("toolbar")), (t.configButtons.some((r) => r.hasElement || r.hasRender) || t.apiButtons.some((r) => r.hasElement || r.hasRender)) && t.hasPanels && i.appendChild(T("tbw-toolbar-separator")), t.hasPanels) {
|
|
1391
|
+
const r = xe(t.isPanelOpen ? "tbw-toolbar-btn active" : "tbw-toolbar-btn", {
|
|
1392
1392
|
"data-panel-toggle": "",
|
|
1393
1393
|
title: "Settings",
|
|
1394
1394
|
"aria-label": "Toggle settings panel",
|
|
@@ -1399,12 +1399,12 @@ function ct(t) {
|
|
|
1399
1399
|
}
|
|
1400
1400
|
return e.appendChild(i), e;
|
|
1401
1401
|
}
|
|
1402
|
-
function
|
|
1403
|
-
const e =
|
|
1404
|
-
n.appendChild(
|
|
1402
|
+
function ht(t) {
|
|
1403
|
+
const e = T("tbw-shell-body"), o = t.panels.length > 0, i = t.panels.length === 1, n = T("tbw-grid-content");
|
|
1404
|
+
n.appendChild(Pe());
|
|
1405
1405
|
let r = null;
|
|
1406
1406
|
if (o) {
|
|
1407
|
-
r =
|
|
1407
|
+
r = G("aside", {
|
|
1408
1408
|
class: t.isPanelOpen ? "tbw-tool-panel open" : "tbw-tool-panel",
|
|
1409
1409
|
part: "tool-panel",
|
|
1410
1410
|
"data-position": t.position,
|
|
@@ -1413,29 +1413,29 @@ function dt(t) {
|
|
|
1413
1413
|
});
|
|
1414
1414
|
const s = t.position === "left" ? "right" : "left";
|
|
1415
1415
|
r.appendChild(
|
|
1416
|
-
|
|
1416
|
+
T("tbw-tool-panel-resize", {
|
|
1417
1417
|
"data-resize-handle": "",
|
|
1418
1418
|
"data-handle-position": s,
|
|
1419
1419
|
"aria-hidden": "true"
|
|
1420
1420
|
})
|
|
1421
1421
|
);
|
|
1422
|
-
const l =
|
|
1422
|
+
const l = T("tbw-tool-panel-content", { role: "presentation" }), a = T("tbw-accordion");
|
|
1423
1423
|
for (const c of t.panels) {
|
|
1424
|
-
const
|
|
1424
|
+
const h = `tbw-accordion-section${c.isExpanded ? " expanded" : ""}${i ? " single" : ""}`, d = T(h, { "data-section": c.id }), f = xe("tbw-accordion-header", {
|
|
1425
1425
|
"aria-expanded": String(c.isExpanded),
|
|
1426
1426
|
"aria-controls": `tbw-section-${c.id}`
|
|
1427
1427
|
});
|
|
1428
1428
|
if (i && f.setAttribute("aria-disabled", "true"), c.icon) {
|
|
1429
|
-
const
|
|
1430
|
-
|
|
1429
|
+
const u = G("span", { class: "tbw-accordion-icon" });
|
|
1430
|
+
u.innerHTML = c.icon, f.appendChild(u);
|
|
1431
1431
|
}
|
|
1432
|
-
const p =
|
|
1432
|
+
const p = G("span", { class: "tbw-accordion-title" });
|
|
1433
1433
|
if (p.textContent = c.title, f.appendChild(p), !i) {
|
|
1434
|
-
const
|
|
1435
|
-
|
|
1434
|
+
const u = G("span", { class: "tbw-accordion-chevron" });
|
|
1435
|
+
u.innerHTML = c.isExpanded ? t.collapseIcon : t.expandIcon, f.appendChild(u);
|
|
1436
1436
|
}
|
|
1437
1437
|
d.appendChild(f), d.appendChild(
|
|
1438
|
-
|
|
1438
|
+
T("tbw-accordion-content", {
|
|
1439
1439
|
id: `tbw-section-${c.id}`,
|
|
1440
1440
|
role: "presentation"
|
|
1441
1441
|
})
|
|
@@ -1445,10 +1445,10 @@ function dt(t) {
|
|
|
1445
1445
|
}
|
|
1446
1446
|
return t.position === "left" && r ? (e.appendChild(r), e.appendChild(n)) : (e.appendChild(n), r && e.appendChild(r)), e;
|
|
1447
1447
|
}
|
|
1448
|
-
function
|
|
1448
|
+
function O(t) {
|
|
1449
1449
|
return t ? typeof t == "string" ? t : t.outerHTML : "";
|
|
1450
1450
|
}
|
|
1451
|
-
function
|
|
1451
|
+
function ut() {
|
|
1452
1452
|
return {
|
|
1453
1453
|
toolPanels: /* @__PURE__ */ new Map(),
|
|
1454
1454
|
headerContents: /* @__PURE__ */ new Map(),
|
|
@@ -1465,33 +1465,33 @@ function ht() {
|
|
|
1465
1465
|
toolbarButtonCleanups: /* @__PURE__ */ new Map()
|
|
1466
1466
|
};
|
|
1467
1467
|
}
|
|
1468
|
-
function
|
|
1468
|
+
function Le(t) {
|
|
1469
1469
|
return !!(t?.header?.title || t?.header?.toolbarButtons?.length || t?.toolPanels?.length || t?.headerContents?.length || t?.header?.lightDomContent?.length || t?.header?.hasToolButtonsContainer);
|
|
1470
1470
|
}
|
|
1471
|
-
function
|
|
1472
|
-
const i = t?.header?.title ?? e.lightDomTitle ?? "", n = !!i, r =
|
|
1473
|
-
let
|
|
1471
|
+
function pe(t, e, o = "☰") {
|
|
1472
|
+
const i = t?.header?.title ?? e.lightDomTitle ?? "", n = !!i, r = O(o), s = t?.header?.toolbarButtons ?? [], l = s.some((g) => g.element || g.render), a = [...e.toolbarButtons.values()].some((g) => g.element || g.render), c = e.toolPanels.size > 0, d = (l || a) && c, f = [...s].sort((g, m) => (g.order ?? 100) - (m.order ?? 100)), p = [...e.toolbarButtons.values()].sort((g, m) => (g.order ?? 100) - (m.order ?? 100));
|
|
1473
|
+
let u = "";
|
|
1474
1474
|
for (const g of f)
|
|
1475
|
-
(g.element || g.render) && (
|
|
1475
|
+
(g.element || g.render) && (u += `<div class="tbw-toolbar-btn-slot" data-btn-slot="${g.id}"></div>`);
|
|
1476
1476
|
for (const g of p)
|
|
1477
|
-
(g.element || g.render) && (
|
|
1478
|
-
if (
|
|
1477
|
+
(g.element || g.render) && (u += `<div class="tbw-toolbar-btn-slot" data-btn-slot="${g.id}"></div>`);
|
|
1478
|
+
if (u += '<slot name="toolbar"></slot>', d && (u += '<div class="tbw-toolbar-separator"></div>'), c) {
|
|
1479
1479
|
const g = e.isPanelOpen;
|
|
1480
|
-
|
|
1480
|
+
u += `<button class="${g ? "tbw-toolbar-btn active" : "tbw-toolbar-btn"}" data-panel-toggle title="Settings" aria-label="Toggle settings panel" aria-pressed="${g}" aria-controls="tbw-tool-panel">${r}</button>`;
|
|
1481
1481
|
}
|
|
1482
1482
|
return `
|
|
1483
1483
|
<div class="tbw-shell-header" part="shell-header" role="presentation">
|
|
1484
|
-
${n ? `<div class="tbw-shell-title">${
|
|
1484
|
+
${n ? `<div class="tbw-shell-title">${We(i)}</div>` : ""}
|
|
1485
1485
|
<div class="tbw-shell-content" part="shell-content" role="presentation">
|
|
1486
1486
|
<slot name="header-content"></slot>
|
|
1487
1487
|
</div>
|
|
1488
1488
|
<div class="tbw-shell-toolbar" part="shell-toolbar" role="presentation">
|
|
1489
|
-
${
|
|
1489
|
+
${u}
|
|
1490
1490
|
</div>
|
|
1491
1491
|
</div>
|
|
1492
1492
|
`;
|
|
1493
1493
|
}
|
|
1494
|
-
function
|
|
1494
|
+
function M(t, e) {
|
|
1495
1495
|
const o = t.querySelector("tbw-grid-header");
|
|
1496
1496
|
if (!o) return;
|
|
1497
1497
|
if (!e.lightDomTitle) {
|
|
@@ -1503,11 +1503,11 @@ function D(t, e) {
|
|
|
1503
1503
|
n.setAttribute("slot", "header-content");
|
|
1504
1504
|
})), o.style.display = "none";
|
|
1505
1505
|
}
|
|
1506
|
-
function
|
|
1506
|
+
function z(t, e) {
|
|
1507
1507
|
const o = t.querySelector(":scope > tbw-grid-tool-buttons");
|
|
1508
1508
|
o && (e.hasToolButtonsContainer = !0, o.setAttribute("slot", "toolbar"));
|
|
1509
1509
|
}
|
|
1510
|
-
function
|
|
1510
|
+
function N(t, e, o) {
|
|
1511
1511
|
t.querySelectorAll(":scope > tbw-grid-tool-panel").forEach((n) => {
|
|
1512
1512
|
const r = n, s = r.getAttribute("id"), l = r.getAttribute("title");
|
|
1513
1513
|
if (!s || !l) {
|
|
@@ -1516,7 +1516,7 @@ function z(t, e, o) {
|
|
|
1516
1516
|
);
|
|
1517
1517
|
return;
|
|
1518
1518
|
}
|
|
1519
|
-
const a = r.getAttribute("icon") ?? void 0, c = r.getAttribute("tooltip") ?? void 0,
|
|
1519
|
+
const a = r.getAttribute("icon") ?? void 0, c = r.getAttribute("tooltip") ?? void 0, h = parseInt(r.getAttribute("order") ?? "100", 10);
|
|
1520
1520
|
let d;
|
|
1521
1521
|
const f = o?.(r);
|
|
1522
1522
|
if (f)
|
|
@@ -1531,24 +1531,24 @@ function z(t, e, o) {
|
|
|
1531
1531
|
const p = e.toolPanels.get(s);
|
|
1532
1532
|
if (p) {
|
|
1533
1533
|
if (f) {
|
|
1534
|
-
p.render = d, p.order =
|
|
1534
|
+
p.render = d, p.order = h, p.icon = a, p.tooltip = c;
|
|
1535
1535
|
const g = e.panelCleanups.get(s);
|
|
1536
1536
|
g && (g(), e.panelCleanups.delete(s));
|
|
1537
1537
|
}
|
|
1538
1538
|
return;
|
|
1539
1539
|
}
|
|
1540
|
-
const
|
|
1540
|
+
const u = {
|
|
1541
1541
|
id: s,
|
|
1542
1542
|
title: l,
|
|
1543
1543
|
icon: a,
|
|
1544
1544
|
tooltip: c,
|
|
1545
|
-
order:
|
|
1545
|
+
order: h,
|
|
1546
1546
|
render: d
|
|
1547
1547
|
};
|
|
1548
|
-
e.toolPanels.set(s,
|
|
1548
|
+
e.toolPanels.set(s, u), e.lightDomToolPanelIds.add(s), r.style.display = "none";
|
|
1549
1549
|
});
|
|
1550
1550
|
}
|
|
1551
|
-
function
|
|
1551
|
+
function ft(t, e, o, i) {
|
|
1552
1552
|
const n = t.querySelector(".tbw-shell-toolbar");
|
|
1553
1553
|
n && n.addEventListener("click", (s) => {
|
|
1554
1554
|
const l = s.target;
|
|
@@ -1558,44 +1558,44 @@ function ut(t, e, o, i) {
|
|
|
1558
1558
|
}
|
|
1559
1559
|
const c = l.closest("[data-btn]");
|
|
1560
1560
|
if (c) {
|
|
1561
|
-
const
|
|
1562
|
-
|
|
1561
|
+
const h = c.getAttribute("data-btn");
|
|
1562
|
+
h && i.onToolbarButtonClick(h);
|
|
1563
1563
|
}
|
|
1564
1564
|
});
|
|
1565
1565
|
const r = t.querySelector(".tbw-accordion");
|
|
1566
1566
|
r && r.addEventListener("click", (s) => {
|
|
1567
1567
|
const a = s.target.closest(".tbw-accordion-header");
|
|
1568
1568
|
if (a) {
|
|
1569
|
-
const
|
|
1570
|
-
|
|
1569
|
+
const h = a.closest("[data-section]")?.getAttribute("data-section");
|
|
1570
|
+
h && i.onSectionToggle(h);
|
|
1571
1571
|
}
|
|
1572
1572
|
});
|
|
1573
1573
|
}
|
|
1574
|
-
function
|
|
1574
|
+
function pt(t, e, o) {
|
|
1575
1575
|
const i = t.querySelector(".tbw-tool-panel"), n = t.querySelector("[data-resize-handle]"), r = t.querySelector(".tbw-shell-body");
|
|
1576
1576
|
if (!i || !n || !r)
|
|
1577
1577
|
return () => {
|
|
1578
1578
|
};
|
|
1579
1579
|
const s = e?.toolPanel?.position ?? "right", l = 200;
|
|
1580
|
-
let a = 0, c = 0,
|
|
1580
|
+
let a = 0, c = 0, h = 0, d = !1;
|
|
1581
1581
|
const f = (g) => {
|
|
1582
1582
|
if (!d) return;
|
|
1583
1583
|
g.preventDefault();
|
|
1584
|
-
const m = s === "left" ? g.clientX - a : a - g.clientX, b = Math.min(
|
|
1584
|
+
const m = s === "left" ? g.clientX - a : a - g.clientX, b = Math.min(h, Math.max(l, c + m));
|
|
1585
1585
|
i.style.width = `${b}px`;
|
|
1586
1586
|
}, p = () => {
|
|
1587
1587
|
if (!d) return;
|
|
1588
1588
|
d = !1, n.classList.remove("resizing"), i.style.transition = "", document.body.style.cursor = "", document.body.style.userSelect = "";
|
|
1589
1589
|
const g = i.getBoundingClientRect().width;
|
|
1590
1590
|
o(g), document.removeEventListener("mousemove", f), document.removeEventListener("mouseup", p);
|
|
1591
|
-
},
|
|
1592
|
-
g.preventDefault(), d = !0, a = g.clientX, c = i.getBoundingClientRect().width,
|
|
1591
|
+
}, u = (g) => {
|
|
1592
|
+
g.preventDefault(), d = !0, a = g.clientX, c = i.getBoundingClientRect().width, h = r.getBoundingClientRect().width - 20, n.classList.add("resizing"), i.style.transition = "none", document.body.style.cursor = "col-resize", document.body.style.userSelect = "none", document.addEventListener("mousemove", f), document.addEventListener("mouseup", p);
|
|
1593
1593
|
};
|
|
1594
|
-
return n.addEventListener("mousedown",
|
|
1595
|
-
n.removeEventListener("mousedown",
|
|
1594
|
+
return n.addEventListener("mousedown", u), () => {
|
|
1595
|
+
n.removeEventListener("mousedown", u), document.removeEventListener("mousemove", f), document.removeEventListener("mouseup", p);
|
|
1596
1596
|
};
|
|
1597
1597
|
}
|
|
1598
|
-
function
|
|
1598
|
+
function gt(t, e, o) {
|
|
1599
1599
|
const i = [...e?.header?.toolbarButtons ?? [], ...o.toolbarButtons.values()];
|
|
1600
1600
|
for (const n of i) {
|
|
1601
1601
|
const r = t.querySelector(`[data-btn-slot="${n.id}"]`);
|
|
@@ -1609,7 +1609,7 @@ function pt(t, e, o) {
|
|
|
1609
1609
|
}
|
|
1610
1610
|
}
|
|
1611
1611
|
}
|
|
1612
|
-
function
|
|
1612
|
+
function He(t, e) {
|
|
1613
1613
|
const o = t.querySelector(".tbw-shell-content");
|
|
1614
1614
|
if (!o) return;
|
|
1615
1615
|
const i = [...e.headerContents.values()].sort((r, s) => (r.order ?? 100) - (s.order ?? 100)), n = o.querySelector('slot[name="header-content"]');
|
|
@@ -1622,15 +1622,15 @@ function Le(t, e) {
|
|
|
1622
1622
|
a && e.headerContentCleanups.set(r.id, a);
|
|
1623
1623
|
}
|
|
1624
1624
|
}
|
|
1625
|
-
function
|
|
1625
|
+
function wt(t, e, o) {
|
|
1626
1626
|
if (!e.isPanelOpen) return;
|
|
1627
|
-
const i =
|
|
1627
|
+
const i = O(o?.expand ?? L.expand), n = O(o?.collapse ?? L.collapse);
|
|
1628
1628
|
for (const [r, s] of e.toolPanels) {
|
|
1629
1629
|
const l = e.expandedSections.has(r), a = t.querySelector(`[data-section="${r}"]`), c = a?.querySelector(".tbw-accordion-content");
|
|
1630
1630
|
if (!a || !c) continue;
|
|
1631
1631
|
a.classList.toggle("expanded", l);
|
|
1632
|
-
const
|
|
1633
|
-
|
|
1632
|
+
const h = a.querySelector(".tbw-accordion-header");
|
|
1633
|
+
h && h.setAttribute("aria-expanded", String(l));
|
|
1634
1634
|
const d = a.querySelector(".tbw-accordion-chevron");
|
|
1635
1635
|
if (d && (d.innerHTML = l ? n : i), l) {
|
|
1636
1636
|
if (c.children.length === 0) {
|
|
@@ -1643,15 +1643,15 @@ function gt(t, e, o) {
|
|
|
1643
1643
|
}
|
|
1644
1644
|
}
|
|
1645
1645
|
}
|
|
1646
|
-
function
|
|
1646
|
+
function ge(t, e) {
|
|
1647
1647
|
const o = t.querySelector("[data-panel-toggle]");
|
|
1648
1648
|
o && (o.classList.toggle("active", e.isPanelOpen), o.setAttribute("aria-pressed", String(e.isPanelOpen)));
|
|
1649
1649
|
}
|
|
1650
|
-
function
|
|
1650
|
+
function we(t, e) {
|
|
1651
1651
|
const o = t.querySelector(".tbw-tool-panel");
|
|
1652
1652
|
o && (o.classList.toggle("open", e.isPanelOpen), e.isPanelOpen || (o.style.width = ""));
|
|
1653
1653
|
}
|
|
1654
|
-
function
|
|
1654
|
+
function bt(t, e) {
|
|
1655
1655
|
const o = [];
|
|
1656
1656
|
for (const i of t?.header?.toolbarButtons ?? [])
|
|
1657
1657
|
o.push({
|
|
@@ -1674,7 +1674,7 @@ function wt(t, e) {
|
|
|
1674
1674
|
});
|
|
1675
1675
|
return o;
|
|
1676
1676
|
}
|
|
1677
|
-
function
|
|
1677
|
+
function mt(t) {
|
|
1678
1678
|
for (const e of t.headerContentCleanups.values())
|
|
1679
1679
|
e();
|
|
1680
1680
|
t.headerContentCleanups.clear();
|
|
@@ -1688,7 +1688,7 @@ function bt(t) {
|
|
|
1688
1688
|
t.toolPanels.get(e)?.onClose?.();
|
|
1689
1689
|
t.isPanelOpen = !1, t.expandedSections.clear(), t.toolPanels.clear(), t.headerContents.clear(), t.toolbarButtons.clear(), t.lightDomHeaderContent = [];
|
|
1690
1690
|
}
|
|
1691
|
-
function
|
|
1691
|
+
function vt(t, e) {
|
|
1692
1692
|
let o = !1;
|
|
1693
1693
|
const i = {
|
|
1694
1694
|
get isInitialized() {
|
|
@@ -1717,7 +1717,7 @@ function mt(t, e) {
|
|
|
1717
1717
|
s && t.expandedSections.add(s.id);
|
|
1718
1718
|
}
|
|
1719
1719
|
const n = e.getShadow();
|
|
1720
|
-
|
|
1720
|
+
ge(n, t), we(n, t), wt(n, t, e.getAccordionIcons()), e.emit("tool-panel-open", { sections: i.expandedSections });
|
|
1721
1721
|
},
|
|
1722
1722
|
closeToolPanel() {
|
|
1723
1723
|
if (!t.isPanelOpen) return;
|
|
@@ -1728,7 +1728,7 @@ function mt(t, e) {
|
|
|
1728
1728
|
r.onClose?.();
|
|
1729
1729
|
t.isPanelOpen = !1;
|
|
1730
1730
|
const n = e.getShadow();
|
|
1731
|
-
|
|
1731
|
+
ge(n, t), we(n, t), e.emit("tool-panel-close", {});
|
|
1732
1732
|
},
|
|
1733
1733
|
toggleToolPanel() {
|
|
1734
1734
|
t.isPanelOpen ? i.closeToolPanel() : i.openToolPanel();
|
|
@@ -1744,16 +1744,16 @@ function mt(t, e) {
|
|
|
1744
1744
|
const s = e.getShadow(), l = t.expandedSections.has(n);
|
|
1745
1745
|
if (l) {
|
|
1746
1746
|
const a = t.panelCleanups.get(n);
|
|
1747
|
-
a && (a(), t.panelCleanups.delete(n)), r.onClose?.(), t.expandedSections.delete(n),
|
|
1747
|
+
a && (a(), t.panelCleanups.delete(n)), r.onClose?.(), t.expandedSections.delete(n), J(s, n, !1);
|
|
1748
1748
|
} else {
|
|
1749
1749
|
for (const [a, c] of t.toolPanels)
|
|
1750
1750
|
if (a !== n && t.expandedSections.has(a)) {
|
|
1751
|
-
const
|
|
1752
|
-
|
|
1751
|
+
const h = t.panelCleanups.get(a);
|
|
1752
|
+
h && (h(), t.panelCleanups.delete(a)), c.onClose?.(), t.expandedSections.delete(a), J(s, a, !1);
|
|
1753
1753
|
const d = s.querySelector(`[data-section="${a}"] .tbw-accordion-content`);
|
|
1754
1754
|
d && (d.innerHTML = "");
|
|
1755
1755
|
}
|
|
1756
|
-
t.expandedSections.add(n),
|
|
1756
|
+
t.expandedSections.add(n), J(s, n, !0), Ct(s, t, n);
|
|
1757
1757
|
}
|
|
1758
1758
|
e.emit("tool-panel-section-toggle", { id: n, expanded: !l });
|
|
1759
1759
|
},
|
|
@@ -1782,14 +1782,14 @@ function mt(t, e) {
|
|
|
1782
1782
|
console.warn(`[tbw-grid] Header content "${n.id}" already registered`);
|
|
1783
1783
|
return;
|
|
1784
1784
|
}
|
|
1785
|
-
t.headerContents.set(n.id, n), o &&
|
|
1785
|
+
t.headerContents.set(n.id, n), o && He(e.getShadow(), t);
|
|
1786
1786
|
},
|
|
1787
1787
|
unregisterHeaderContent(n) {
|
|
1788
1788
|
const r = t.headerContentCleanups.get(n);
|
|
1789
1789
|
r && (r(), t.headerContentCleanups.delete(n)), t.headerContents.get(n)?.onDestroy?.(), t.headerContents.delete(n), e.getShadow().querySelector(`[data-header-content="${n}"]`)?.remove();
|
|
1790
1790
|
},
|
|
1791
1791
|
getToolbarButtons() {
|
|
1792
|
-
return
|
|
1792
|
+
return bt(e.getShellConfig(), t);
|
|
1793
1793
|
},
|
|
1794
1794
|
registerToolbarButton(n) {
|
|
1795
1795
|
if (t.toolbarButtons.has(n.id)) {
|
|
@@ -1813,11 +1813,11 @@ function mt(t, e) {
|
|
|
1813
1813
|
};
|
|
1814
1814
|
return i;
|
|
1815
1815
|
}
|
|
1816
|
-
function
|
|
1816
|
+
function J(t, e, o) {
|
|
1817
1817
|
const i = t.querySelector(`[data-section="${e}"]`);
|
|
1818
1818
|
i && i.classList.toggle("expanded", o);
|
|
1819
1819
|
}
|
|
1820
|
-
function
|
|
1820
|
+
function Ct(t, e, o) {
|
|
1821
1821
|
const i = e.toolPanels.get(o);
|
|
1822
1822
|
if (!i?.render) return;
|
|
1823
1823
|
const n = t.querySelector(`[data-section="${o}"] .tbw-accordion-content`);
|
|
@@ -1825,10 +1825,10 @@ function vt(t, e, o) {
|
|
|
1825
1825
|
const r = i.render(n);
|
|
1826
1826
|
r && e.panelCleanups.set(o, r);
|
|
1827
1827
|
}
|
|
1828
|
-
function
|
|
1829
|
-
const n =
|
|
1828
|
+
function _t(t, e, o, i) {
|
|
1829
|
+
const n = Le(e);
|
|
1830
1830
|
if (t.replaceChildren(), n) {
|
|
1831
|
-
const r =
|
|
1831
|
+
const r = O(i?.toolPanel ?? L.toolPanel), s = O(i?.expand ?? L.expand), l = O(i?.collapse ?? L.collapse), c = [...e?.header?.toolbarButtons ?? []].sort((b, _) => (b.order ?? 100) - (_.order ?? 100)), d = [...e?.toolPanels ?? []].sort((b, _) => (b.order ?? 100) - (_.order ?? 100)), f = {
|
|
1832
1832
|
title: e?.header?.title ?? void 0,
|
|
1833
1833
|
hasPanels: d.length > 0,
|
|
1834
1834
|
isPanelOpen: o.isPanelOpen,
|
|
@@ -1849,22 +1849,22 @@ function Ct(t, e, o, i) {
|
|
|
1849
1849
|
panels: d.map((b) => ({
|
|
1850
1850
|
id: b.id,
|
|
1851
1851
|
title: b.title,
|
|
1852
|
-
icon:
|
|
1852
|
+
icon: O(b.icon),
|
|
1853
1853
|
isExpanded: o.expandedSections.has(b.id)
|
|
1854
1854
|
}))
|
|
1855
|
-
},
|
|
1855
|
+
}, u = dt(f), g = ht(p), m = fe({
|
|
1856
1856
|
hasShell: !0,
|
|
1857
|
-
shellHeader:
|
|
1857
|
+
shellHeader: u,
|
|
1858
1858
|
shellBody: g
|
|
1859
1859
|
});
|
|
1860
1860
|
t.appendChild(m);
|
|
1861
1861
|
} else {
|
|
1862
|
-
const r =
|
|
1862
|
+
const r = fe({ hasShell: !1 });
|
|
1863
1863
|
t.appendChild(r);
|
|
1864
1864
|
}
|
|
1865
1865
|
return n;
|
|
1866
1866
|
}
|
|
1867
|
-
function
|
|
1867
|
+
function yt() {
|
|
1868
1868
|
return {
|
|
1869
1869
|
startY: null,
|
|
1870
1870
|
startX: null,
|
|
@@ -1878,19 +1878,19 @@ function _t() {
|
|
|
1878
1878
|
momentumRaf: 0
|
|
1879
1879
|
};
|
|
1880
1880
|
}
|
|
1881
|
-
function
|
|
1881
|
+
function Et(t) {
|
|
1882
1882
|
t.startY = null, t.startX = null, t.scrollTop = null, t.scrollLeft = null, t.lastY = null, t.lastX = null, t.lastTime = null;
|
|
1883
1883
|
}
|
|
1884
|
-
function
|
|
1884
|
+
function Oe(t) {
|
|
1885
1885
|
t.momentumRaf && (cancelAnimationFrame(t.momentumRaf), t.momentumRaf = 0);
|
|
1886
1886
|
}
|
|
1887
|
-
function
|
|
1887
|
+
function St(t, e, o) {
|
|
1888
1888
|
if (t.touches.length !== 1) return;
|
|
1889
|
-
|
|
1889
|
+
Oe(e);
|
|
1890
1890
|
const i = t.touches[0];
|
|
1891
1891
|
e.startY = i.clientY, e.startX = i.clientX, e.lastY = i.clientY, e.lastX = i.clientX, e.lastTime = performance.now(), e.scrollTop = o.fauxScrollbar.scrollTop, e.scrollLeft = o.scrollArea?.scrollLeft ?? 0, e.velocityY = 0, e.velocityX = 0;
|
|
1892
1892
|
}
|
|
1893
|
-
function
|
|
1893
|
+
function Rt(t, e, o) {
|
|
1894
1894
|
if (t.touches.length !== 1 || e.startY === null || e.startX === null || e.scrollTop === null || e.scrollLeft === null)
|
|
1895
1895
|
return !1;
|
|
1896
1896
|
const i = t.touches[0], n = i.clientY, r = i.clientX, s = performance.now(), l = e.startY - n, a = e.startX - r;
|
|
@@ -1899,18 +1899,18 @@ function St(t, e, o) {
|
|
|
1899
1899
|
g > 0 && (e.velocityY = (e.lastY - n) / g, e.velocityX = (e.lastX - r) / g);
|
|
1900
1900
|
}
|
|
1901
1901
|
e.lastY = n, e.lastX = r, e.lastTime = s;
|
|
1902
|
-
const { scrollTop: c, scrollHeight:
|
|
1903
|
-
let
|
|
1902
|
+
const { scrollTop: c, scrollHeight: h, clientHeight: d } = o.fauxScrollbar, f = h - d, p = l > 0 && c < f || l < 0 && c > 0;
|
|
1903
|
+
let u = !1;
|
|
1904
1904
|
if (o.scrollArea) {
|
|
1905
1905
|
const { scrollLeft: g, scrollWidth: m, clientWidth: b } = o.scrollArea, _ = m - b;
|
|
1906
|
-
|
|
1906
|
+
u = a > 0 && g < _ || a < 0 && g > 0;
|
|
1907
1907
|
}
|
|
1908
|
-
return p && (o.fauxScrollbar.scrollTop = e.scrollTop + l),
|
|
1908
|
+
return p && (o.fauxScrollbar.scrollTop = e.scrollTop + l), u && o.scrollArea && (o.scrollArea.scrollLeft = e.scrollLeft + a), p || u;
|
|
1909
1909
|
}
|
|
1910
1910
|
function Tt(t, e) {
|
|
1911
|
-
(Math.abs(t.velocityY) > 0.1 || Math.abs(t.velocityX) > 0.1) &&
|
|
1911
|
+
(Math.abs(t.velocityY) > 0.1 || Math.abs(t.velocityX) > 0.1) && xt(t, e), Et(t);
|
|
1912
1912
|
}
|
|
1913
|
-
function
|
|
1913
|
+
function xt(t, e) {
|
|
1914
1914
|
const n = () => {
|
|
1915
1915
|
t.velocityY *= 0.95, t.velocityX *= 0.95;
|
|
1916
1916
|
const r = t.velocityY * 16, s = t.velocityX * 16;
|
|
@@ -1918,19 +1918,19 @@ function Rt(t, e) {
|
|
|
1918
1918
|
};
|
|
1919
1919
|
t.momentumRaf = requestAnimationFrame(n);
|
|
1920
1920
|
}
|
|
1921
|
-
function
|
|
1922
|
-
t.addEventListener("touchstart", (n) =>
|
|
1921
|
+
function At(t, e, o, i) {
|
|
1922
|
+
t.addEventListener("touchstart", (n) => St(n, e, o), {
|
|
1923
1923
|
passive: !0,
|
|
1924
1924
|
signal: i
|
|
1925
1925
|
}), t.addEventListener(
|
|
1926
1926
|
"touchmove",
|
|
1927
1927
|
(n) => {
|
|
1928
|
-
|
|
1928
|
+
Rt(n, e, o) && n.preventDefault();
|
|
1929
1929
|
},
|
|
1930
1930
|
{ passive: !1, signal: i }
|
|
1931
1931
|
), t.addEventListener("touchend", () => Tt(e, o), { passive: !0, signal: i });
|
|
1932
1932
|
}
|
|
1933
|
-
const
|
|
1933
|
+
const Pt = [
|
|
1934
1934
|
// EditingPlugin
|
|
1935
1935
|
{
|
|
1936
1936
|
property: "editable",
|
|
@@ -1960,7 +1960,7 @@ const At = [
|
|
|
1960
1960
|
importHint: "import { PinnedColumnsPlugin } from '@toolbox-web/grid/plugins/pinned-columns';",
|
|
1961
1961
|
isUsed: (t) => t === "left" || t === "right"
|
|
1962
1962
|
}
|
|
1963
|
-
],
|
|
1963
|
+
], Lt = [
|
|
1964
1964
|
// GroupingColumnsPlugin
|
|
1965
1965
|
{
|
|
1966
1966
|
property: "columnGroups",
|
|
@@ -1970,34 +1970,37 @@ const At = [
|
|
|
1970
1970
|
isUsed: (t) => Array.isArray(t) && t.length > 0
|
|
1971
1971
|
}
|
|
1972
1972
|
];
|
|
1973
|
-
function
|
|
1973
|
+
function H(t) {
|
|
1974
|
+
return t.charAt(0).toUpperCase() + t.slice(1);
|
|
1975
|
+
}
|
|
1976
|
+
function be(t, e) {
|
|
1974
1977
|
return t.some((o) => o.name === e);
|
|
1975
1978
|
}
|
|
1976
|
-
function
|
|
1979
|
+
function Ht(t, e) {
|
|
1977
1980
|
const o = /* @__PURE__ */ new Map();
|
|
1978
1981
|
function i(r, s, l, a, c = !1) {
|
|
1979
1982
|
o.has(r) || o.set(r, { description: s, importHint: l, fields: [], isConfigProperty: c });
|
|
1980
|
-
const
|
|
1981
|
-
|
|
1983
|
+
const h = o.get(r);
|
|
1984
|
+
h.fields.includes(a) || h.fields.push(a);
|
|
1982
1985
|
}
|
|
1983
|
-
for (const r of
|
|
1986
|
+
for (const r of Lt) {
|
|
1984
1987
|
const s = t[r.property];
|
|
1985
|
-
(r.isUsed ? r.isUsed(s) : s !== void 0) && !
|
|
1988
|
+
(r.isUsed ? r.isUsed(s) : s !== void 0) && !be(e, r.pluginName) && i(r.pluginName, r.description, r.importHint, r.property, !0);
|
|
1986
1989
|
}
|
|
1987
1990
|
const n = t.columns;
|
|
1988
1991
|
if (n && n.length > 0)
|
|
1989
1992
|
for (const r of n)
|
|
1990
|
-
for (const s of
|
|
1993
|
+
for (const s of Pt) {
|
|
1991
1994
|
const l = r[s.property];
|
|
1992
|
-
if ((s.isUsed ? s.isUsed(l) : l !== void 0) && !
|
|
1995
|
+
if ((s.isUsed ? s.isUsed(l) : l !== void 0) && !be(e, s.pluginName)) {
|
|
1993
1996
|
const c = r.field || "<unknown>";
|
|
1994
1997
|
i(s.pluginName, s.description, s.importHint, c);
|
|
1995
1998
|
}
|
|
1996
1999
|
}
|
|
1997
2000
|
if (o.size > 0) {
|
|
1998
2001
|
const r = [];
|
|
1999
|
-
for (const [s, { description: l, importHint: a, fields: c, isConfigProperty:
|
|
2000
|
-
if (
|
|
2002
|
+
for (const [s, { description: l, importHint: a, fields: c, isConfigProperty: h }] of o)
|
|
2003
|
+
if (h)
|
|
2001
2004
|
r.push(
|
|
2002
2005
|
`Config uses ${l}, but the required plugin is not loaded.
|
|
2003
2006
|
→ Add the plugin to your gridConfig.plugins array:
|
|
@@ -2024,7 +2027,53 @@ This validation helps catch misconfigurations early. The properties listed above
|
|
|
2024
2027
|
);
|
|
2025
2028
|
}
|
|
2026
2029
|
}
|
|
2027
|
-
|
|
2030
|
+
const Ot = {
|
|
2031
|
+
editing: "import { EditingPlugin } from '@toolbox-web/grid/plugins/editing';",
|
|
2032
|
+
selection: "import { SelectionPlugin } from '@toolbox-web/grid/plugins/selection';",
|
|
2033
|
+
reorder: "import { ReorderPlugin } from '@toolbox-web/grid/plugins/reorder';",
|
|
2034
|
+
clipboard: "import { ClipboardPlugin } from '@toolbox-web/grid/plugins/clipboard';",
|
|
2035
|
+
filtering: "import { FilteringPlugin } from '@toolbox-web/grid/plugins/filtering';",
|
|
2036
|
+
multiSort: "import { MultiSortPlugin } from '@toolbox-web/grid/plugins/multi-sort';",
|
|
2037
|
+
groupingRows: "import { GroupingRowsPlugin } from '@toolbox-web/grid/plugins/grouping-rows';",
|
|
2038
|
+
groupingColumns: "import { GroupingColumnsPlugin } from '@toolbox-web/grid/plugins/grouping-columns';",
|
|
2039
|
+
tree: "import { TreePlugin } from '@toolbox-web/grid/plugins/tree';",
|
|
2040
|
+
masterDetail: "import { MasterDetailPlugin } from '@toolbox-web/grid/plugins/master-detail';",
|
|
2041
|
+
pinnedColumns: "import { PinnedColumnsPlugin } from '@toolbox-web/grid/plugins/pinned-columns';",
|
|
2042
|
+
pinnedRows: "import { PinnedRowsPlugin } from '@toolbox-web/grid/plugins/pinned-rows';",
|
|
2043
|
+
visibility: "import { VisibilityPlugin } from '@toolbox-web/grid/plugins/visibility';",
|
|
2044
|
+
undoRedo: "import { UndoRedoPlugin } from '@toolbox-web/grid/plugins/undo-redo';",
|
|
2045
|
+
export: "import { ExportPlugin } from '@toolbox-web/grid/plugins/export';",
|
|
2046
|
+
contextMenu: "import { ContextMenuPlugin } from '@toolbox-web/grid/plugins/context-menu';",
|
|
2047
|
+
pivot: "import { PivotPlugin } from '@toolbox-web/grid/plugins/pivot';",
|
|
2048
|
+
serverSide: "import { ServerSidePlugin } from '@toolbox-web/grid/plugins/server-side';",
|
|
2049
|
+
columnVirtualization: "import { ColumnVirtualizationPlugin } from '@toolbox-web/grid/plugins/column-virtualization';"
|
|
2050
|
+
};
|
|
2051
|
+
function Dt(t) {
|
|
2052
|
+
return Ot[t] ?? `import { ${H(t)}Plugin } from '@toolbox-web/grid/plugins/${t}';`;
|
|
2053
|
+
}
|
|
2054
|
+
function Mt(t, e) {
|
|
2055
|
+
const o = t.name, n = t.constructor.dependencies ?? [];
|
|
2056
|
+
for (const r of n) {
|
|
2057
|
+
const s = r.name, l = r.required ?? !0, a = r.reason;
|
|
2058
|
+
if (!e.some((h) => h.name === s)) {
|
|
2059
|
+
const h = a ?? `${H(o)}Plugin requires ${H(s)}Plugin`, d = Dt(s);
|
|
2060
|
+
if (l)
|
|
2061
|
+
throw new Error(
|
|
2062
|
+
`[tbw-grid] Plugin dependency error:
|
|
2063
|
+
|
|
2064
|
+
${h}.
|
|
2065
|
+
|
|
2066
|
+
→ Add the plugin to your gridConfig.plugins array BEFORE ${H(o)}Plugin:
|
|
2067
|
+
${d}
|
|
2068
|
+
plugins: [new ${H(s)}Plugin(), new ${H(o)}Plugin()]`
|
|
2069
|
+
);
|
|
2070
|
+
console.info(
|
|
2071
|
+
`[tbw-grid] ${H(o)}Plugin: Optional "${s}" plugin not found. Some features may be unavailable.`
|
|
2072
|
+
);
|
|
2073
|
+
}
|
|
2074
|
+
}
|
|
2075
|
+
}
|
|
2076
|
+
class zt {
|
|
2028
2077
|
constructor(e) {
|
|
2029
2078
|
this.grid = e;
|
|
2030
2079
|
}
|
|
@@ -2051,10 +2100,10 @@ class Ht {
|
|
|
2051
2100
|
}
|
|
2052
2101
|
/**
|
|
2053
2102
|
* Attach a plugin to this grid.
|
|
2054
|
-
*
|
|
2103
|
+
* Validates dependencies and notifies other plugins of the new attachment.
|
|
2055
2104
|
*/
|
|
2056
2105
|
attach(e) {
|
|
2057
|
-
if (this.pluginMap.set(e.constructor, e), this.plugins.push(e), e.cellRenderers)
|
|
2106
|
+
if (Mt(e, this.plugins), this.pluginMap.set(e.constructor, e), this.plugins.push(e), e.cellRenderers)
|
|
2058
2107
|
for (const [o, i] of Object.entries(e.cellRenderers))
|
|
2059
2108
|
this.cellRenderers.set(o, i);
|
|
2060
2109
|
if (e.headerRenderers)
|
|
@@ -2358,10 +2407,10 @@ class Ht {
|
|
|
2358
2407
|
}
|
|
2359
2408
|
// #endregion
|
|
2360
2409
|
}
|
|
2361
|
-
class
|
|
2410
|
+
class D extends HTMLElement {
|
|
2362
2411
|
// TODO: Rename to 'data-grid' when migration is complete
|
|
2363
2412
|
static tagName = "tbw-grid";
|
|
2364
|
-
static version = "0.4.
|
|
2413
|
+
static version = "0.4.1";
|
|
2365
2414
|
// ---------------- Framework Adapters ----------------
|
|
2366
2415
|
/**
|
|
2367
2416
|
* Registry of framework adapters that handle converting light DOM elements
|
|
@@ -2439,7 +2488,7 @@ class O extends HTMLElement {
|
|
|
2439
2488
|
#s;
|
|
2440
2489
|
// Cached hook to avoid closures
|
|
2441
2490
|
#m = !1;
|
|
2442
|
-
#A =
|
|
2491
|
+
#A = yt();
|
|
2443
2492
|
#g;
|
|
2444
2493
|
#_;
|
|
2445
2494
|
#y;
|
|
@@ -2469,7 +2518,7 @@ class O extends HTMLElement {
|
|
|
2469
2518
|
// ---------------- Config Manager ----------------
|
|
2470
2519
|
#t;
|
|
2471
2520
|
// ---------------- Shell State ----------------
|
|
2472
|
-
#e =
|
|
2521
|
+
#e = ut();
|
|
2473
2522
|
#a;
|
|
2474
2523
|
#D;
|
|
2475
2524
|
// #endregion
|
|
@@ -2614,20 +2663,20 @@ class O extends HTMLElement {
|
|
|
2614
2663
|
}
|
|
2615
2664
|
// #endregion
|
|
2616
2665
|
constructor() {
|
|
2617
|
-
super(), this.#o = this.attachShadow({ mode: "open" }), this.#J(), this.#f = new Promise((e) => this.#d = e), this.#l = new
|
|
2666
|
+
super(), this.#o = this.attachShadow({ mode: "open" }), this.#J(), this.#f = new Promise((e) => this.#d = e), this.#l = new at({
|
|
2618
2667
|
mergeConfig: () => {
|
|
2619
|
-
this.#t.parseLightDomColumns(this), this.#t.merge(), this.#V(),
|
|
2668
|
+
this.#t.parseLightDomColumns(this), this.#t.merge(), this.#V(), Ht(this.#n, this.#i?.getPlugins() ?? []), this.#z = [...this._columns];
|
|
2620
2669
|
},
|
|
2621
2670
|
processColumns: () => this.#de(),
|
|
2622
2671
|
processRows: () => this.#he(),
|
|
2623
|
-
renderHeader: () =>
|
|
2624
|
-
updateTemplate: () =>
|
|
2672
|
+
renderHeader: () => X(this),
|
|
2673
|
+
updateTemplate: () => I(this),
|
|
2625
2674
|
renderVirtualWindow: () => this.refreshVirtualWindow(!0),
|
|
2626
2675
|
afterRender: () => {
|
|
2627
|
-
this.#i?.afterRender(), this.#n.fitMode === "fixed" && !this.__didInitialAutoSize && (this.__didInitialAutoSize = !0,
|
|
2676
|
+
this.#i?.afterRender(), this.#n.fitMode === "fixed" && !this.__didInitialAutoSize && (this.__didInitialAutoSize = !0, ne(this));
|
|
2628
2677
|
},
|
|
2629
2678
|
isConnected: () => this.isConnected && this.#h
|
|
2630
|
-
}), this.#l.setInitialReadyResolver(() => this.#d?.()), this.#a =
|
|
2679
|
+
}), this.#l.setInitialReadyResolver(() => this.#d?.()), this.#a = vt(this.#e, {
|
|
2631
2680
|
getShadow: () => this.#o,
|
|
2632
2681
|
getShellConfig: () => this.#n?.shell,
|
|
2633
2682
|
getAccordionIcons: () => ({
|
|
@@ -2636,23 +2685,23 @@ class O extends HTMLElement {
|
|
|
2636
2685
|
}),
|
|
2637
2686
|
emit: (e, o) => this.#Y(e, o),
|
|
2638
2687
|
refreshShellHeader: () => this.refreshShellHeader()
|
|
2639
|
-
}), this.#t = new
|
|
2688
|
+
}), this.#t = new Ke({
|
|
2640
2689
|
getRows: () => this.#r,
|
|
2641
2690
|
getSortState: () => this._sortState,
|
|
2642
2691
|
setSortState: (e) => {
|
|
2643
2692
|
this._sortState = e;
|
|
2644
2693
|
},
|
|
2645
2694
|
onConfigChange: () => {
|
|
2646
|
-
this.#l.requestPhase(
|
|
2695
|
+
this.#l.requestPhase(R.FULL, "configChange");
|
|
2647
2696
|
},
|
|
2648
2697
|
emit: (e, o) => this.#Y(e, o),
|
|
2649
2698
|
clearRowPool: () => {
|
|
2650
2699
|
this._rowPool.length = 0, this._bodyEl && (this._bodyEl.innerHTML = ""), this.__rowRenderEpoch++;
|
|
2651
2700
|
},
|
|
2652
|
-
setup: () => this.#
|
|
2653
|
-
renderHeader: () =>
|
|
2654
|
-
updateTemplate: () =>
|
|
2655
|
-
refreshVirtualWindow: () => this.#l.requestPhase(
|
|
2701
|
+
setup: () => this.#T(),
|
|
2702
|
+
renderHeader: () => X(this),
|
|
2703
|
+
updateTemplate: () => I(this),
|
|
2704
|
+
refreshVirtualWindow: () => this.#l.requestPhase(R.VIRTUALIZATION, "configManager"),
|
|
2656
2705
|
getVirtualization: () => this._virtualization,
|
|
2657
2706
|
setRowHeight: (e) => {
|
|
2658
2707
|
this._virtualization.rowHeight = e;
|
|
@@ -2668,8 +2717,8 @@ class O extends HTMLElement {
|
|
|
2668
2717
|
}
|
|
2669
2718
|
async #J() {
|
|
2670
2719
|
const e = new CSSStyleSheet();
|
|
2671
|
-
if (
|
|
2672
|
-
e.replaceSync(
|
|
2720
|
+
if (te.length > 0) {
|
|
2721
|
+
e.replaceSync(te), this.#o.adoptedStyleSheets = [e];
|
|
2673
2722
|
return;
|
|
2674
2723
|
}
|
|
2675
2724
|
await new Promise((o) => setTimeout(o, 50));
|
|
@@ -2719,7 +2768,7 @@ class O extends HTMLElement {
|
|
|
2719
2768
|
* @internal Plugin API
|
|
2720
2769
|
*/
|
|
2721
2770
|
requestRender() {
|
|
2722
|
-
this.#l.requestPhase(
|
|
2771
|
+
this.#l.requestPhase(R.ROWS, "plugin:requestRender");
|
|
2723
2772
|
}
|
|
2724
2773
|
/**
|
|
2725
2774
|
* Update the grid's column template CSS.
|
|
@@ -2727,7 +2776,7 @@ class O extends HTMLElement {
|
|
|
2727
2776
|
* @internal
|
|
2728
2777
|
*/
|
|
2729
2778
|
updateTemplate() {
|
|
2730
|
-
|
|
2779
|
+
I(this);
|
|
2731
2780
|
}
|
|
2732
2781
|
/**
|
|
2733
2782
|
* Request a lightweight style update without rebuilding DOM.
|
|
@@ -2736,14 +2785,14 @@ class O extends HTMLElement {
|
|
|
2736
2785
|
* @internal Plugin API
|
|
2737
2786
|
*/
|
|
2738
2787
|
requestAfterRender() {
|
|
2739
|
-
this.#l.requestPhase(
|
|
2788
|
+
this.#l.requestPhase(R.STYLE, "plugin:requestAfterRender");
|
|
2740
2789
|
}
|
|
2741
2790
|
/**
|
|
2742
2791
|
* Initialize plugin system with instances from config.
|
|
2743
2792
|
* Plugins are class instances passed in gridConfig.plugins[].
|
|
2744
2793
|
*/
|
|
2745
2794
|
#G() {
|
|
2746
|
-
this.#i = new
|
|
2795
|
+
this.#i = new zt(this);
|
|
2747
2796
|
const e = this.#n?.plugins, o = Array.isArray(e) ? e : [];
|
|
2748
2797
|
this.#i.attachAll(o);
|
|
2749
2798
|
}
|
|
@@ -2808,8 +2857,8 @@ class O extends HTMLElement {
|
|
|
2808
2857
|
* Gets a renderer factory for tool panels from registered framework adapters.
|
|
2809
2858
|
* Returns a factory function that tries each adapter in order until one handles the element.
|
|
2810
2859
|
*/
|
|
2811
|
-
#
|
|
2812
|
-
const e =
|
|
2860
|
+
#R() {
|
|
2861
|
+
const e = D.getAdapters();
|
|
2813
2862
|
if (e.length === 0 && !this.__frameworkAdapter) return;
|
|
2814
2863
|
const o = this.__frameworkAdapter;
|
|
2815
2864
|
return (i) => {
|
|
@@ -2826,9 +2875,9 @@ class O extends HTMLElement {
|
|
|
2826
2875
|
}
|
|
2827
2876
|
// ---------------- Lifecycle ----------------
|
|
2828
2877
|
connectedCallback() {
|
|
2829
|
-
this.hasAttribute("tabindex") || (this.tabIndex = 0), this.hasAttribute("version") || this.setAttribute("version",
|
|
2878
|
+
this.hasAttribute("tabindex") || (this.tabIndex = 0), this.hasAttribute("version") || this.setAttribute("version", D.version), this._rows = Array.isArray(this.#r) ? [...this.#r] : [], this.#g && (this.#g.abort(), this.#O = !1), this.#g = new AbortController(), this.#C && (de(this.#C), this.#C = void 0), M(this, this.#e), z(this, this.#e), N(this, this.#e, this.#R()), this.#t.parseLightDomColumns(this), this.#t.merge(), this.#G();
|
|
2830
2879
|
const e = this.#n?.plugins;
|
|
2831
|
-
this.#E = Array.isArray(e) ? e : [], this.#F(), this.#c || (this.#U(), this.#M(), this.#c = !0), this.#N(), this.#C =
|
|
2880
|
+
this.#E = Array.isArray(e) ? e : [], this.#F(), this.#c || (this.#U(), this.#M(), this.#c = !0), this.#N(), this.#C = it(
|
|
2832
2881
|
() => {
|
|
2833
2882
|
this.#me();
|
|
2834
2883
|
},
|
|
@@ -2836,7 +2885,7 @@ class O extends HTMLElement {
|
|
|
2836
2885
|
);
|
|
2837
2886
|
}
|
|
2838
2887
|
disconnectedCallback() {
|
|
2839
|
-
this.#C && (
|
|
2888
|
+
this.#C && (de(this.#C), this.#C = void 0), this.#Q(), mt(this.#e), this.#a.setInitialized(!1), this.#D?.(), this.#D = void 0, Oe(this.#A), this.#g && (this.#g.abort(), this.#g = void 0), this.#P?.abort(), this.#P = void 0, this.#O = !1, this._resizeController && this._resizeController.dispose(), this.#_ && (this.#_.disconnect(), this.#_ = void 0), this.#y && (this.#y.disconnect(), this.#y = void 0, this.#k = !1), $(this), this.#x.clear(), this.#E = void 0;
|
|
2840
2889
|
for (const e of this._rowPool)
|
|
2841
2890
|
e.remove();
|
|
2842
2891
|
this._rowPool.length = 0, this.__rowsBodyEl = null, this.#h = !1;
|
|
@@ -2860,17 +2909,17 @@ class O extends HTMLElement {
|
|
|
2860
2909
|
#N() {
|
|
2861
2910
|
const o = this.#o.querySelector(".tbw-grid-content") ?? this.#o.querySelector(".tbw-grid-root");
|
|
2862
2911
|
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.__rowsBodyEl = o?.querySelector(".rows-body"), this.#a.isInitialized) {
|
|
2863
|
-
|
|
2912
|
+
He(this.#o, this.#e), gt(this.#o, this.#n?.shell, this.#e);
|
|
2864
2913
|
const r = this.#n?.shell?.toolPanel?.defaultOpen;
|
|
2865
2914
|
r && this.#e.toolPanels.has(r) && (this.openToolPanel(), this.#e.expandedSections.add(r));
|
|
2866
2915
|
}
|
|
2867
|
-
if (this.setAttribute("data-upgraded", ""), this.#h = !0, this._resizeController =
|
|
2916
|
+
if (this.setAttribute("data-upgraded", ""), this.#h = !0, this._resizeController = ct(this), this.#T(), this.#ee(o), this.#O)
|
|
2868
2917
|
return;
|
|
2869
2918
|
this.#O = !0;
|
|
2870
2919
|
const i = this.disconnectSignal;
|
|
2871
|
-
this.addEventListener("keydown", (r) =>
|
|
2920
|
+
this.addEventListener("keydown", (r) => lt(this, r), { signal: i }), this.#o.addEventListener("mousedown", (r) => this.#pe(r), { signal: i }), document.addEventListener("mousemove", (r) => this.#ge(r), { signal: i }), document.addEventListener("mouseup", (r) => this.#we(r), { signal: i });
|
|
2872
2921
|
const n = this.#n.rowHeight;
|
|
2873
|
-
n && n > 0 ? this._virtualization.rowHeight = n : requestAnimationFrame(() => this.#X()), queueMicrotask(() => this.#oe()), this.#l.requestPhase(
|
|
2922
|
+
n && n > 0 ? this._virtualization.rowHeight = n : requestAnimationFrame(() => this.#X()), queueMicrotask(() => this.#oe()), this.#l.requestPhase(R.FULL, "afterConnect");
|
|
2874
2923
|
}
|
|
2875
2924
|
/**
|
|
2876
2925
|
* Measure actual row height from DOM.
|
|
@@ -2886,7 +2935,7 @@ class O extends HTMLElement {
|
|
|
2886
2935
|
l > i && (i = l);
|
|
2887
2936
|
});
|
|
2888
2937
|
const n = e.getBoundingClientRect(), r = Math.max(n.height, i);
|
|
2889
|
-
r > 0 && r !== this._virtualization.rowHeight && (this._virtualization.rowHeight = r, this.#l.requestPhase(
|
|
2938
|
+
r > 0 && r !== this._virtualization.rowHeight && (this._virtualization.rowHeight = r, this.#l.requestPhase(R.VIRTUALIZATION, "measureRowHeight"));
|
|
2890
2939
|
}
|
|
2891
2940
|
/**
|
|
2892
2941
|
* Set up scroll-related event listeners on DOM elements.
|
|
@@ -2905,7 +2954,7 @@ class O extends HTMLElement {
|
|
|
2905
2954
|
if (this._rows.length <= this._virtualization.bypassThreshold)
|
|
2906
2955
|
n.style.transform = `translateY(${-l}px)`;
|
|
2907
2956
|
else {
|
|
2908
|
-
const c = Math.floor(l / a),
|
|
2957
|
+
const c = Math.floor(l / a), h = c - c % 2, d = -(l - h * a);
|
|
2909
2958
|
n.style.transform = `translateY(${d}px)`;
|
|
2910
2959
|
}
|
|
2911
2960
|
this.#w = l, this.#v || (this.#v = requestAnimationFrame(() => {
|
|
@@ -2920,19 +2969,19 @@ class O extends HTMLElement {
|
|
|
2920
2969
|
(l) => {
|
|
2921
2970
|
const a = l.shiftKey || Math.abs(l.deltaX) > Math.abs(l.deltaY);
|
|
2922
2971
|
if (a && s) {
|
|
2923
|
-
const c = l.shiftKey ? l.deltaY : l.deltaX, { scrollLeft:
|
|
2924
|
-
(c > 0 &&
|
|
2972
|
+
const c = l.shiftKey ? l.deltaY : l.deltaX, { scrollLeft: h, scrollWidth: d, clientWidth: f } = s;
|
|
2973
|
+
(c > 0 && h < d - f || c < 0 && h > 0) && (l.preventDefault(), s.scrollLeft += c);
|
|
2925
2974
|
} else if (!a) {
|
|
2926
|
-
const { scrollTop: c, scrollHeight:
|
|
2927
|
-
(l.deltaY > 0 && c <
|
|
2975
|
+
const { scrollTop: c, scrollHeight: h, clientHeight: d } = i;
|
|
2976
|
+
(l.deltaY > 0 && c < h - d || l.deltaY < 0 && c > 0) && (l.preventDefault(), i.scrollTop += l.deltaY);
|
|
2928
2977
|
}
|
|
2929
2978
|
},
|
|
2930
2979
|
{ passive: !1, signal: o }
|
|
2931
|
-
),
|
|
2980
|
+
), At(r, this.#A, { fauxScrollbar: i, scrollArea: s }, o));
|
|
2932
2981
|
}
|
|
2933
|
-
this._bodyEl &&
|
|
2934
|
-
this.#l.requestPhase(
|
|
2935
|
-
}), this.#_.observe(this._virtualization.viewportEl)), this._virtualization.enabled && (this.#l.requestPhase(
|
|
2982
|
+
this._bodyEl && Qe(this, this._bodyEl, o), this.#_?.disconnect(), this._virtualization.viewportEl && (this.#_ = new ResizeObserver(() => {
|
|
2983
|
+
this.#l.requestPhase(R.VIRTUALIZATION, "resize-observer");
|
|
2984
|
+
}), this.#_.observe(this._virtualization.viewportEl)), this._virtualization.enabled && (this.#l.requestPhase(R.VIRTUALIZATION, "init-virtualization"), queueMicrotask(() => this.#te()));
|
|
2936
2985
|
}
|
|
2937
2986
|
/**
|
|
2938
2987
|
* Set up ResizeObserver on first row's cells to detect height changes.
|
|
@@ -2998,29 +3047,29 @@ class O extends HTMLElement {
|
|
|
2998
3047
|
}
|
|
2999
3048
|
// Individual update applicators - these do the actual work
|
|
3000
3049
|
#ne() {
|
|
3001
|
-
this._rows = Array.isArray(this.#r) ? [...this.#r] : [], this.#l.requestPhase(
|
|
3050
|
+
this._rows = Array.isArray(this.#r) ? [...this.#r] : [], this.#l.requestPhase(R.ROWS, "applyRowsUpdate");
|
|
3002
3051
|
}
|
|
3003
3052
|
#re() {
|
|
3004
|
-
|
|
3053
|
+
$(this), this.#t.merge(), this.#T();
|
|
3005
3054
|
}
|
|
3006
3055
|
#se() {
|
|
3007
|
-
this.#t.merge(), this.#n.fitMode === "fixed" ? (this.__didInitialAutoSize = !1,
|
|
3056
|
+
this.#t.merge(), this.#n.fitMode === "fixed" ? (this.__didInitialAutoSize = !1, ne(this)) : (this._columns.forEach((o) => {
|
|
3008
3057
|
!o.__userResized && o.__autoSized && delete o.width;
|
|
3009
|
-
}),
|
|
3058
|
+
}), I(this));
|
|
3010
3059
|
}
|
|
3011
3060
|
#le() {
|
|
3012
|
-
this.#t.merge(), this._rowPool.length = 0, this._bodyEl && (this._bodyEl.innerHTML = ""), this.__rowRenderEpoch++, this.#l.requestPhase(
|
|
3061
|
+
this.#t.merge(), this._rowPool.length = 0, this._bodyEl && (this._bodyEl.innerHTML = ""), this.__rowRenderEpoch++, this.#l.requestPhase(R.VIRTUALIZATION, "applyEditModeUpdate");
|
|
3013
3062
|
}
|
|
3014
3063
|
#ae() {
|
|
3015
|
-
|
|
3064
|
+
M(this, this.#e), z(this, this.#e);
|
|
3016
3065
|
const e = !!this.#o.querySelector(".has-shell"), o = !!this.#o.querySelector(".tbw-tool-panel"), i = this.#o.querySelectorAll(".tbw-accordion-section").length;
|
|
3017
|
-
this.#t.parseLightDomColumns(this), this.#t.merge(), this.#V(),
|
|
3018
|
-
const n =
|
|
3066
|
+
this.#t.parseLightDomColumns(this), this.#t.merge(), this.#V(), N(this, this.#e, this.#R()), this.#t.markSourcesChanged(), this.#t.merge();
|
|
3067
|
+
const n = Le(this.#n?.shell), r = (this.#n?.shell?.toolPanels?.length ?? 0) > 0, s = (this.#n?.shell?.toolPanels?.length ?? 0) !== i;
|
|
3019
3068
|
if (e !== n || !e && n || !o && r || o && s) {
|
|
3020
3069
|
this.#U(), this.#M(), this.#N();
|
|
3021
3070
|
return;
|
|
3022
3071
|
}
|
|
3023
|
-
e && this.#ce(), this.#l.requestPhase(
|
|
3072
|
+
e && this.#ce(), this.#l.requestPhase(R.COLUMNS, "applyGridConfigUpdate");
|
|
3024
3073
|
}
|
|
3025
3074
|
/**
|
|
3026
3075
|
* Update the shell header DOM in place without a full re-render.
|
|
@@ -3058,7 +3107,7 @@ class O extends HTMLElement {
|
|
|
3058
3107
|
}
|
|
3059
3108
|
/** Recompute row model via plugin hooks. */
|
|
3060
3109
|
#he() {
|
|
3061
|
-
|
|
3110
|
+
$(this);
|
|
3062
3111
|
const e = Array.isArray(this.#r) ? [...this.#r] : [], o = this.#i?.processRows(e) ?? e;
|
|
3063
3112
|
this._rows = o;
|
|
3064
3113
|
}
|
|
@@ -3069,7 +3118,7 @@ class O extends HTMLElement {
|
|
|
3069
3118
|
*/
|
|
3070
3119
|
#ue(e) {
|
|
3071
3120
|
const o = {
|
|
3072
|
-
...
|
|
3121
|
+
...Me,
|
|
3073
3122
|
...e.animation
|
|
3074
3123
|
}, i = o.mode ?? "reduced-motion";
|
|
3075
3124
|
let n = 1;
|
|
@@ -3077,7 +3126,7 @@ class O extends HTMLElement {
|
|
|
3077
3126
|
}
|
|
3078
3127
|
// ---------------- Delegate Wrappers ----------------
|
|
3079
3128
|
#I(e, o, i = this.__rowRenderEpoch) {
|
|
3080
|
-
this.#s || (this.#s = (n, r, s) => this.#i?.renderRow(n, r, s) ?? !1),
|
|
3129
|
+
this.#s || (this.#s = (n, r, s) => this.#i?.renderRow(n, r, s) ?? !1), st(this, e, o, i, this.#s);
|
|
3081
3130
|
}
|
|
3082
3131
|
// Cache for ARIA counts to avoid redundant DOM writes on scroll (hot path)
|
|
3083
3132
|
#B = -1;
|
|
@@ -3102,7 +3151,7 @@ class O extends HTMLElement {
|
|
|
3102
3151
|
* Previously this method executed rendering synchronously, but that caused race
|
|
3103
3152
|
* conditions with framework adapters that also schedule their own render work.
|
|
3104
3153
|
*/
|
|
3105
|
-
#
|
|
3154
|
+
#T() {
|
|
3106
3155
|
if (this.isConnected && !(!this._headerRowEl || !this._bodyEl)) {
|
|
3107
3156
|
if (this.#t.parseLightDomColumns(this), this.#L) {
|
|
3108
3157
|
const e = this.#L;
|
|
@@ -3110,7 +3159,7 @@ class O extends HTMLElement {
|
|
|
3110
3159
|
const o = this.#i?.getAll() ?? [];
|
|
3111
3160
|
this.#t.applyState(e, o);
|
|
3112
3161
|
}
|
|
3113
|
-
this._bodyEl && (this._bodyEl.style.display = "", this._bodyEl.style.gridTemplateColumns = ""), this.#l.requestPhase(
|
|
3162
|
+
this._bodyEl && (this._bodyEl.style.display = "", this._bodyEl.style.gridTemplateColumns = ""), this.#l.requestPhase(R.FULL, "setup");
|
|
3114
3163
|
}
|
|
3115
3164
|
}
|
|
3116
3165
|
#fe(e) {
|
|
@@ -3224,14 +3273,14 @@ class O extends HTMLElement {
|
|
|
3224
3273
|
let i = null;
|
|
3225
3274
|
const n = e.composedPath?.();
|
|
3226
3275
|
if (n && n.length > 0 ? i = n[0] : i = e.target, i && !this.#o.contains(i)) {
|
|
3227
|
-
const
|
|
3228
|
-
|
|
3276
|
+
const u = this.#o.elementFromPoint(e.clientX, e.clientY);
|
|
3277
|
+
u && (i = u);
|
|
3229
3278
|
}
|
|
3230
3279
|
const r = i?.closest?.("[data-col]"), s = i?.closest?.(".data-grid-row"), l = i?.closest?.(".header-row");
|
|
3231
|
-
let a, c,
|
|
3232
|
-
return r && (a = parseInt(r.getAttribute("data-row") ?? "-1", 10), c = parseInt(r.getAttribute("data-col") ?? "-1", 10), a >= 0 && c >= 0 && (
|
|
3280
|
+
let a, c, h, d, f, p;
|
|
3281
|
+
return r && (a = parseInt(r.getAttribute("data-row") ?? "-1", 10), c = parseInt(r.getAttribute("data-col") ?? "-1", 10), a >= 0 && c >= 0 && (h = this._rows[a], p = this._columns[c], d = p?.field, f = h && d ? h[d] : void 0)), {
|
|
3233
3282
|
type: o,
|
|
3234
|
-
row:
|
|
3283
|
+
row: h,
|
|
3235
3284
|
rowIndex: a !== void 0 && a >= 0 ? a : void 0,
|
|
3236
3285
|
colIndex: c !== void 0 && c >= 0 ? c : void 0,
|
|
3237
3286
|
field: d,
|
|
@@ -3271,7 +3320,7 @@ class O extends HTMLElement {
|
|
|
3271
3320
|
return this.#f;
|
|
3272
3321
|
}
|
|
3273
3322
|
async forceLayout() {
|
|
3274
|
-
return this.#l.requestPhase(
|
|
3323
|
+
return this.#l.requestPhase(R.FULL, "forceLayout"), this.#l.whenReady();
|
|
3275
3324
|
}
|
|
3276
3325
|
/**
|
|
3277
3326
|
* Trim the internal row pool to match the current visible window size.
|
|
@@ -3336,7 +3385,7 @@ class O extends HTMLElement {
|
|
|
3336
3385
|
*/
|
|
3337
3386
|
#be(e) {
|
|
3338
3387
|
const o = this.#i?.getAll() ?? [];
|
|
3339
|
-
this.#t.applyState(e, o), this.#
|
|
3388
|
+
this.#t.applyState(e, o), this.#T();
|
|
3340
3389
|
}
|
|
3341
3390
|
/**
|
|
3342
3391
|
* Request a state change event to be emitted.
|
|
@@ -3356,7 +3405,7 @@ class O extends HTMLElement {
|
|
|
3356
3405
|
resetColumnState() {
|
|
3357
3406
|
this.#L = void 0, this.__originalOrder = [];
|
|
3358
3407
|
const e = this.#i?.getAll() ?? [];
|
|
3359
|
-
this.#t.resetState(e), this.#t.merge(), this.#
|
|
3408
|
+
this.#t.resetState(e), this.#t.merge(), this.#T();
|
|
3360
3409
|
}
|
|
3361
3410
|
// ---------------- Shell / Tool Panel API ----------------
|
|
3362
3411
|
// These methods delegate to ShellController for implementation.
|
|
@@ -3438,7 +3487,7 @@ class O extends HTMLElement {
|
|
|
3438
3487
|
* Call this after dynamically modifying <tbw-grid-header> children.
|
|
3439
3488
|
*/
|
|
3440
3489
|
refreshShellHeader() {
|
|
3441
|
-
|
|
3490
|
+
M(this, this.#e), z(this, this.#e), N(this, this.#e, this.#R()), this.#t.markSourcesChanged(), this.#t.merge(), this.#U(), this.#M(), this.#N();
|
|
3442
3491
|
}
|
|
3443
3492
|
// #region Custom Styles API
|
|
3444
3493
|
/** Map of registered custom stylesheets by ID - uses adoptedStyleSheets which survive DOM rebuilds */
|
|
@@ -3505,24 +3554,24 @@ class O extends HTMLElement {
|
|
|
3505
3554
|
#me() {
|
|
3506
3555
|
const e = () => {
|
|
3507
3556
|
const i = this.#e.lightDomTitle, n = this.#e.hasToolButtonsContainer;
|
|
3508
|
-
|
|
3557
|
+
M(this, this.#e), z(this, this.#e), N(this, this.#e, this.#R());
|
|
3509
3558
|
const r = this.#e.lightDomTitle, s = this.#e.hasToolButtonsContainer;
|
|
3510
3559
|
if (r && !i || s && !n) {
|
|
3511
3560
|
this.#t.markSourcesChanged(), this.#t.merge();
|
|
3512
3561
|
const l = this.#o.querySelector(".tbw-shell-header");
|
|
3513
3562
|
if (l) {
|
|
3514
|
-
const a =
|
|
3563
|
+
const a = pe(
|
|
3515
3564
|
this.#n.shell,
|
|
3516
3565
|
this.#e,
|
|
3517
3566
|
this.#n.icons?.toolPanel
|
|
3518
3567
|
), c = document.createElement("div");
|
|
3519
3568
|
c.innerHTML = a;
|
|
3520
|
-
const
|
|
3521
|
-
|
|
3569
|
+
const h = c.firstElementChild;
|
|
3570
|
+
h && (l.replaceWith(h), this.#$());
|
|
3522
3571
|
}
|
|
3523
3572
|
}
|
|
3524
3573
|
}, o = () => {
|
|
3525
|
-
this.__lightDomColumnsCache = void 0, this.#
|
|
3574
|
+
this.__lightDomColumnsCache = void 0, this.#T();
|
|
3526
3575
|
};
|
|
3527
3576
|
this.#t.registerLightDomHandler("tbw-grid-header", e), this.#t.registerLightDomHandler("tbw-grid-tool-buttons", e), this.#t.registerLightDomHandler("tbw-grid-tool-panel", e), this.#t.registerLightDomHandler("tbw-grid-column", o), this.#t.registerLightDomHandler("tbw-grid-detail", o), this.#t.observeLightDOM(this);
|
|
3528
3577
|
}
|
|
@@ -3533,15 +3582,15 @@ class O extends HTMLElement {
|
|
|
3533
3582
|
* @internal Used by framework integration libraries (Angular, React, Vue)
|
|
3534
3583
|
*/
|
|
3535
3584
|
refreshColumns() {
|
|
3536
|
-
this.__lightDomColumnsCache = void 0,
|
|
3585
|
+
this.__lightDomColumnsCache = void 0, $(this), this.#t.parseLightDomColumns(this);
|
|
3537
3586
|
const e = this.#e.lightDomTitle, o = this.#e.hasToolButtonsContainer;
|
|
3538
|
-
|
|
3587
|
+
M(this, this.#e), z(this, this.#e), N(this, this.#e, this.#R());
|
|
3539
3588
|
const i = this.#e.lightDomTitle, n = this.#e.hasToolButtonsContainer;
|
|
3540
3589
|
if (i && !e || n && !o) {
|
|
3541
3590
|
this.#t.markSourcesChanged(), this.#t.merge();
|
|
3542
3591
|
const s = this.#o.querySelector(".tbw-shell-header");
|
|
3543
3592
|
if (s) {
|
|
3544
|
-
const l =
|
|
3593
|
+
const l = pe(
|
|
3545
3594
|
this.#n.shell,
|
|
3546
3595
|
this.#e,
|
|
3547
3596
|
this.#n.icons?.toolPanel
|
|
@@ -3551,7 +3600,7 @@ class O extends HTMLElement {
|
|
|
3551
3600
|
c && (s.replaceWith(c), this.#$());
|
|
3552
3601
|
}
|
|
3553
3602
|
}
|
|
3554
|
-
this.#l.requestPhase(
|
|
3603
|
+
this.#l.requestPhase(R.COLUMNS, "refreshColumns");
|
|
3555
3604
|
}
|
|
3556
3605
|
// ---------------- Virtual Window ----------------
|
|
3557
3606
|
/**
|
|
@@ -3580,8 +3629,8 @@ class O extends HTMLElement {
|
|
|
3580
3629
|
}
|
|
3581
3630
|
const i = this._virtualization.container ?? this, n = this._virtualization.viewportEl ?? i, r = n.clientHeight, s = this._virtualization.rowHeight, l = i.scrollTop;
|
|
3582
3631
|
let a = Math.floor(l / s), c = 0;
|
|
3583
|
-
const
|
|
3584
|
-
for (; c <
|
|
3632
|
+
const h = 10;
|
|
3633
|
+
for (; c < h; ) {
|
|
3585
3634
|
const _ = this.#i?.getExtraHeightBefore?.(a) ?? 0, w = Math.floor((l - _) / s);
|
|
3586
3635
|
if (w >= a || w < 0) break;
|
|
3587
3636
|
a = w, c++;
|
|
@@ -3592,7 +3641,7 @@ class O extends HTMLElement {
|
|
|
3592
3641
|
const f = Math.ceil(r / s) + 3;
|
|
3593
3642
|
let p = a + f;
|
|
3594
3643
|
if (p > o && (p = o), this._virtualization.start = a, this._virtualization.end = p, i.clientHeight === 0 && r > 0) {
|
|
3595
|
-
this.#l.requestPhase(
|
|
3644
|
+
this.#l.requestPhase(R.VIRTUALIZATION, "stale-refs-retry");
|
|
3596
3645
|
return;
|
|
3597
3646
|
}
|
|
3598
3647
|
const g = this.#W(o);
|
|
@@ -3607,9 +3656,9 @@ class O extends HTMLElement {
|
|
|
3607
3656
|
}
|
|
3608
3657
|
// ---------------- Render ----------------
|
|
3609
3658
|
#U() {
|
|
3610
|
-
|
|
3659
|
+
M(this, this.#e), z(this, this.#e), N(this, this.#e, this.#R()), this.#t.markSourcesChanged(), this.#t.merge();
|
|
3611
3660
|
const e = this.#n?.shell;
|
|
3612
|
-
|
|
3661
|
+
_t(
|
|
3613
3662
|
this.#o,
|
|
3614
3663
|
e,
|
|
3615
3664
|
{ isPanelOpen: this.#e.isPanelOpen, expandedSections: this.#e.expandedSections },
|
|
@@ -3620,11 +3669,11 @@ class O extends HTMLElement {
|
|
|
3620
3669
|
* Set up shell event listeners after render.
|
|
3621
3670
|
*/
|
|
3622
3671
|
#$() {
|
|
3623
|
-
|
|
3672
|
+
ft(this.#o, this.#n?.shell, this.#e, {
|
|
3624
3673
|
onPanelToggle: () => this.toggleToolPanel(),
|
|
3625
3674
|
onSectionToggle: (e) => this.toggleToolPanelSection(e),
|
|
3626
3675
|
onToolbarButtonClick: (e) => this.#ve(e)
|
|
3627
|
-
}), this.#D?.(), this.#D =
|
|
3676
|
+
}), this.#D?.(), this.#D = pt(this.#o, this.#n?.shell, (e) => {
|
|
3628
3677
|
this.style.setProperty("--tbw-tool-panel-width", `${e}px`);
|
|
3629
3678
|
});
|
|
3630
3679
|
}
|
|
@@ -3637,15 +3686,31 @@ class O extends HTMLElement {
|
|
|
3637
3686
|
#ve(e) {
|
|
3638
3687
|
}
|
|
3639
3688
|
}
|
|
3640
|
-
customElements.get(
|
|
3641
|
-
globalThis.DataGridElement =
|
|
3642
|
-
const
|
|
3689
|
+
customElements.get(D.tagName) || customElements.define(D.tagName, D);
|
|
3690
|
+
globalThis.DataGridElement = D;
|
|
3691
|
+
const kt = {
|
|
3643
3692
|
/** Ask if a column can be moved. Context: ColumnConfig. Response: boolean | undefined */
|
|
3644
3693
|
CAN_MOVE_COLUMN: "canMoveColumn",
|
|
3645
3694
|
/** Get context menu items. Context: ContextMenuParams. Response: ContextMenuItem[] */
|
|
3646
3695
|
GET_CONTEXT_MENU_ITEMS: "getContextMenuItems"
|
|
3647
3696
|
};
|
|
3648
|
-
class
|
|
3697
|
+
class It {
|
|
3698
|
+
/**
|
|
3699
|
+
* Plugin dependencies - declare other plugins this one requires.
|
|
3700
|
+
*
|
|
3701
|
+
* Dependencies are validated when the plugin is attached.
|
|
3702
|
+
* Required dependencies throw an error if missing.
|
|
3703
|
+
* Optional dependencies log an info message if missing.
|
|
3704
|
+
*
|
|
3705
|
+
* @example
|
|
3706
|
+
* ```typescript
|
|
3707
|
+
* static readonly dependencies: PluginDependency[] = [
|
|
3708
|
+
* { name: 'editing', required: true, reason: 'Tracks cell edits for undo/redo' },
|
|
3709
|
+
* { name: 'selection', required: false, reason: 'Enables selection-based undo' },
|
|
3710
|
+
* ];
|
|
3711
|
+
* ```
|
|
3712
|
+
*/
|
|
3713
|
+
static dependencies;
|
|
3649
3714
|
/** Plugin version - override in subclass if needed */
|
|
3650
3715
|
version = "1.0.0";
|
|
3651
3716
|
/** CSS styles to inject into the grid's shadow DOM */
|
|
@@ -3884,7 +3949,7 @@ const E = {
|
|
|
3884
3949
|
// Selection (SelectionPlugin applies, core CSS styles)
|
|
3885
3950
|
RANGE_SELECTION: "range-selection",
|
|
3886
3951
|
SELECTION_OVERLAY: "selection-overlay"
|
|
3887
|
-
},
|
|
3952
|
+
}, V = {
|
|
3888
3953
|
// ─── Core Attributes ──────────────────────────────────────────────
|
|
3889
3954
|
ROW_INDEX: "data-row-index",
|
|
3890
3955
|
COL_INDEX: "data-col-index",
|
|
@@ -3896,7 +3961,7 @@ const E = {
|
|
|
3896
3961
|
// TreePlugin
|
|
3897
3962
|
STICKY: "data-sticky"
|
|
3898
3963
|
// PinnedColumnsPlugin
|
|
3899
|
-
},
|
|
3964
|
+
}, Bt = {
|
|
3900
3965
|
ROOT: `.${E.ROOT}`,
|
|
3901
3966
|
HEADER: `.${E.HEADER}`,
|
|
3902
3967
|
HEADER_ROW: `.${E.HEADER_ROW}`,
|
|
@@ -3907,13 +3972,13 @@ const E = {
|
|
|
3907
3972
|
DATA_CELL: `.${E.DATA_CELL}`,
|
|
3908
3973
|
GROUP_ROW: `.${E.GROUP_ROW}`,
|
|
3909
3974
|
// By data attribute
|
|
3910
|
-
ROW_BY_INDEX: (t) => `.${E.DATA_ROW}[${
|
|
3911
|
-
CELL_BY_FIELD: (t) => `.${E.DATA_CELL}[${
|
|
3912
|
-
CELL_AT: (t, e) => `.${E.DATA_ROW}[${
|
|
3975
|
+
ROW_BY_INDEX: (t) => `.${E.DATA_ROW}[${V.ROW_INDEX}="${t}"]`,
|
|
3976
|
+
CELL_BY_FIELD: (t) => `.${E.DATA_CELL}[${V.FIELD}="${t}"]`,
|
|
3977
|
+
CELL_AT: (t, e) => `.${E.DATA_ROW}[${V.ROW_INDEX}="${t}"] .${E.DATA_CELL}[${V.COL_INDEX}="${e}"]`,
|
|
3913
3978
|
// State selectors
|
|
3914
3979
|
SELECTED_ROWS: `.${E.DATA_ROW}.${E.SELECTED}`,
|
|
3915
3980
|
EDITING_CELL: `.${E.DATA_CELL}.${E.EDITING}`
|
|
3916
|
-
},
|
|
3981
|
+
}, qt = {
|
|
3917
3982
|
// Colors
|
|
3918
3983
|
COLOR_BG: "--tbw-color-bg",
|
|
3919
3984
|
COLOR_FG: "--tbw-color-fg",
|
|
@@ -3935,7 +4000,7 @@ const E = {
|
|
|
3935
4000
|
// Borders
|
|
3936
4001
|
BORDER_RADIUS: "--tbw-border-radius",
|
|
3937
4002
|
FOCUS_OUTLINE: "--tbw-focus-outline"
|
|
3938
|
-
},
|
|
4003
|
+
}, Wt = {
|
|
3939
4004
|
CELL_COMMIT: "cell-commit",
|
|
3940
4005
|
ROW_COMMIT: "row-commit",
|
|
3941
4006
|
CHANGED_ROWS_RESET: "changed-rows-reset",
|
|
@@ -3946,7 +4011,7 @@ const E = {
|
|
|
3946
4011
|
ACTIVATE_CELL: "activate-cell",
|
|
3947
4012
|
GROUP_TOGGLE: "group-toggle",
|
|
3948
4013
|
COLUMN_STATE_CHANGE: "column-state-change"
|
|
3949
|
-
},
|
|
4014
|
+
}, Ut = {
|
|
3950
4015
|
// Selection plugin
|
|
3951
4016
|
SELECTION_CHANGE: "selection-change",
|
|
3952
4017
|
// Tree plugin
|
|
@@ -3977,7 +4042,7 @@ const E = {
|
|
|
3977
4042
|
DETAIL_EXPAND: "detail-expand",
|
|
3978
4043
|
// Grouping rows plugin
|
|
3979
4044
|
GROUP_EXPAND: "group-expand"
|
|
3980
|
-
},
|
|
4045
|
+
}, Q = {
|
|
3981
4046
|
sum: (t, e) => t.reduce((o, i) => o + (Number(i[e]) || 0), 0),
|
|
3982
4047
|
avg: (t, e) => {
|
|
3983
4048
|
const o = t.reduce((i, n) => i + (Number(n[e]) || 0), 0);
|
|
@@ -3988,25 +4053,25 @@ const E = {
|
|
|
3988
4053
|
max: (t, e) => Math.max(...t.map((o) => Number(o[e]) || -1 / 0)),
|
|
3989
4054
|
first: (t, e) => t[0]?.[e],
|
|
3990
4055
|
last: (t, e) => t[t.length - 1]?.[e]
|
|
3991
|
-
},
|
|
4056
|
+
}, k = /* @__PURE__ */ new Map(), P = {
|
|
3992
4057
|
/**
|
|
3993
4058
|
* Register a custom aggregator function.
|
|
3994
4059
|
*/
|
|
3995
4060
|
register(t, e) {
|
|
3996
|
-
|
|
4061
|
+
k.set(t, e);
|
|
3997
4062
|
},
|
|
3998
4063
|
/**
|
|
3999
4064
|
* Unregister a custom aggregator function.
|
|
4000
4065
|
*/
|
|
4001
4066
|
unregister(t) {
|
|
4002
|
-
|
|
4067
|
+
k.delete(t);
|
|
4003
4068
|
},
|
|
4004
4069
|
/**
|
|
4005
4070
|
* Get an aggregator function by reference.
|
|
4006
4071
|
*/
|
|
4007
4072
|
get(t) {
|
|
4008
4073
|
if (t !== void 0)
|
|
4009
|
-
return typeof t == "function" ? t :
|
|
4074
|
+
return typeof t == "function" ? t : k.get(t) ?? Q[t];
|
|
4010
4075
|
},
|
|
4011
4076
|
/**
|
|
4012
4077
|
* Run an aggregator on a set of rows.
|
|
@@ -4019,15 +4084,15 @@ const E = {
|
|
|
4019
4084
|
* Check if an aggregator exists.
|
|
4020
4085
|
*/
|
|
4021
4086
|
has(t) {
|
|
4022
|
-
return
|
|
4087
|
+
return k.has(t) || t in Q;
|
|
4023
4088
|
},
|
|
4024
4089
|
/**
|
|
4025
4090
|
* List all available aggregator names.
|
|
4026
4091
|
*/
|
|
4027
4092
|
list() {
|
|
4028
|
-
return [...Object.keys(
|
|
4093
|
+
return [...Object.keys(Q), ...k.keys()];
|
|
4029
4094
|
}
|
|
4030
|
-
},
|
|
4095
|
+
}, me = {
|
|
4031
4096
|
sum: (t) => t.reduce((e, o) => e + o, 0),
|
|
4032
4097
|
avg: (t) => t.length ? t.reduce((e, o) => e + o, 0) / t.length : 0,
|
|
4033
4098
|
count: (t) => t.length,
|
|
@@ -4036,43 +4101,43 @@ const E = {
|
|
|
4036
4101
|
first: (t) => t[0] ?? 0,
|
|
4037
4102
|
last: (t) => t[t.length - 1] ?? 0
|
|
4038
4103
|
};
|
|
4039
|
-
function
|
|
4040
|
-
return
|
|
4104
|
+
function Nt(t) {
|
|
4105
|
+
return me[t] ?? me.sum;
|
|
4041
4106
|
}
|
|
4042
|
-
function
|
|
4043
|
-
return
|
|
4107
|
+
function $t(t, e) {
|
|
4108
|
+
return Nt(t)(e);
|
|
4044
4109
|
}
|
|
4045
|
-
const
|
|
4110
|
+
const Gt = P.register.bind(P), Vt = P.unregister.bind(P), Ft = P.get.bind(P), Xt = P.run.bind(P), Yt = P.list.bind(P);
|
|
4046
4111
|
export {
|
|
4047
|
-
|
|
4048
|
-
|
|
4112
|
+
It as BaseGridPlugin,
|
|
4113
|
+
Me as DEFAULT_ANIMATION_CONFIG,
|
|
4049
4114
|
L as DEFAULT_GRID_ICONS,
|
|
4050
|
-
|
|
4051
|
-
|
|
4052
|
-
|
|
4053
|
-
|
|
4115
|
+
Wt as DGEvents,
|
|
4116
|
+
D as DataGridElement,
|
|
4117
|
+
W as FitModeEnum,
|
|
4118
|
+
qt as GridCSSVars,
|
|
4054
4119
|
E as GridClasses,
|
|
4055
|
-
|
|
4056
|
-
|
|
4057
|
-
|
|
4058
|
-
|
|
4059
|
-
|
|
4060
|
-
|
|
4061
|
-
|
|
4062
|
-
|
|
4120
|
+
V as GridDataAttrs,
|
|
4121
|
+
D as GridElement,
|
|
4122
|
+
Bt as GridSelectors,
|
|
4123
|
+
kt as PLUGIN_QUERIES,
|
|
4124
|
+
Ut as PluginEvents,
|
|
4125
|
+
zt as PluginManager,
|
|
4126
|
+
R as RenderPhase,
|
|
4127
|
+
q as a,
|
|
4063
4128
|
P as aggregatorRegistry,
|
|
4064
|
-
|
|
4065
|
-
|
|
4066
|
-
|
|
4067
|
-
|
|
4068
|
-
|
|
4069
|
-
|
|
4070
|
-
|
|
4071
|
-
|
|
4072
|
-
|
|
4073
|
-
|
|
4074
|
-
|
|
4075
|
-
|
|
4076
|
-
|
|
4129
|
+
tt as builtInSort,
|
|
4130
|
+
ee as c,
|
|
4131
|
+
et as defaultComparator,
|
|
4132
|
+
ve as e,
|
|
4133
|
+
ye as g,
|
|
4134
|
+
Ft as getAggregator,
|
|
4135
|
+
Nt as getValueAggregator,
|
|
4136
|
+
Yt as listAggregators,
|
|
4137
|
+
Gt as registerAggregator,
|
|
4138
|
+
Xt as runAggregator,
|
|
4139
|
+
$t as runValueAggregator,
|
|
4140
|
+
F as s,
|
|
4141
|
+
Vt as unregisterAggregator
|
|
4077
4142
|
};
|
|
4078
4143
|
//# sourceMappingURL=index.js.map
|