@ni/nimble-components 32.1.1 → 32.1.2

package/dist/all-components-bundle.min.js

@@ -10653,7 +10653,7 @@ const uF="nimble-table-header",pF=Mt`
         position: absolute;
     }
 
-    :host([selectable]:not([selected]):hover)::before {
+    :host([selectable]:not([selected])[allow-hover]:hover)::before {
         background-color: ${yl};
     }
 
@@ -10661,7 +10661,7 @@ const uF="nimble-table-header",pF=Mt`
         background-color: ${gl};
     }
 
-    :host([selected]:hover)::before {
+    :host([selected][allow-hover]:hover)::before {
         background-color: ${bl};
     }
 
@@ -10776,7 +10776,7 @@ const uF="nimble-table-header",pF=Mt`
         height: ${Bl};
     }
 
-    :host(:hover) nimble-table-cell {
+    :host([allow-hover]:hover) nimble-table-cell {
         --ni-private-table-cell-action-menu-display: block;
     }
 
@@ -10788,7 +10788,7 @@ const uF="nimble-table-header",pF=Mt`
         --ni-private-table-cell-action-menu-display: block;
     }
 `.withBehaviors(Qh(No.color,Mt`
-            :host([selectable]:not([selected]):hover)::before {
+            :host([selectable]:not([selected])[allow-hover]:hover)::before {
                 background-color: ${pl(co,.05)};
             }
 
@@ -10796,7 +10796,7 @@ const uF="nimble-table-header",pF=Mt`
                 background-color: ${pl(co,.25)};
             }
 
-            :host([selected]:hover)::before {
+            :host([selected][allow-hover]:hover)::before {
                 background-color: ${pl(co,.2)};
             }
         `)),mF=Mt`
@@ -10962,7 +10962,7 @@ const yF="nimble-table-cell",wF=Q`
         </span>
     </template>
 `
-class xF extends We{constructor(){super(...arguments),this.selectable=!1,this.selected=!1,this.hideSelection=!1,this.expanded=!1,this.reserveCollapseSpace=!1,this.columnNotifiers=[],this.columns=[],this.nestingLevel=0,this.isParentRow=!1,this.menuOpen=!1,this.rowOperationGridCellHidden=!1,this.loading=!1,this.cellIndentLevels=[],this.cellStates=[],this.animationClass="",this.ignoreSelectionChangeEvents=!1,this.removeAnimatingClass=()=>{this.animationClass="",this.expandIcon?.removeEventListener("transitionend",this.removeAnimatingClass)}}get isTopLevelParentRow(){return this.isParentRow&&0===this.nestingLevel}get isNestedParent(){return this.isParentRow&&this.nestingLevel>0}get showSelectionCheckbox(){return this.selectable&&!this.hideSelection}get ariaSelected(){return this.selectable?this.selected?"true":"false":null}onSelectionCheckboxChange(t){if(this.ignoreSelectionChangeEvents)return
+class xF extends We{constructor(){super(...arguments),this.selectable=!1,this.selected=!1,this.hideSelection=!1,this.expanded=!1,this.reserveCollapseSpace=!1,this.columnNotifiers=[],this.columns=[],this.nestingLevel=0,this.isParentRow=!1,this.menuOpen=!1,this.rowOperationGridCellHidden=!1,this.loading=!1,this.cellIndentLevels=[],this.cellStates=[],this.animationClass="",this.allowHover=!1,this.ignoreSelectionChangeEvents=!1,this.removeAnimatingClass=()=>{this.animationClass="",this.expandIcon?.removeEventListener("transitionend",this.removeAnimatingClass)}}get isTopLevelParentRow(){return this.isParentRow&&0===this.nestingLevel}get isNestedParent(){return this.isParentRow&&this.nestingLevel>0}get showSelectionCheckbox(){return this.selectable&&!this.hideSelection}get ariaSelected(){return this.selectable?this.selected?"true":"false":null}onSelectionCheckboxChange(t){if(this.ignoreSelectionChangeEvents)return
 const e=t.target.checked
 this.onSelectionChange(!e,e)}onSelectionChange(t,e){this.selected=e
 const n={oldState:t,newState:e}
@@ -10974,7 +10974,7 @@ this.$emit(t,i)}columnsChanged(){this.updateCellIndentLevels(),this.updateCellSt
 return e.subscribe(this),e}))}updateCellStates(){this.cellStates=this.columns.map((t=>{const e=t.columnInternals.dataRecordFieldNames
 let n
 if(this.hasValidFieldNames(e)&&this.dataRecord){const i=e.map((t=>this.dataRecord[t]))
-n={cellRecord:Object.fromEntries(t.columnInternals.cellRecordFieldNames.map(((t,e)=>[t,i[e]]))),columnConfig:t.columnInternals.columnConfig}}return n}))}hasValidFieldNames(t){return t.every((t=>void 0!==t))}selectedChanged(){this.setSelectionCheckboxState()}selectionCheckboxChanged(){this.setSelectionCheckboxState()}setSelectionCheckboxState(){this.selectionCheckbox&&(this.ignoreSelectionChangeEvents=!0,this.selectionCheckbox.checked=this.selected,this.ignoreSelectionChangeEvents=!1)}}t([ft({attribute:"record-id"})],xF.prototype,"recordId",void 0),t([ft({mode:"boolean"})],xF.prototype,"selectable",void 0),t([ft({mode:"boolean"})],xF.prototype,"selected",void 0),t([ft({attribute:"hide-selection",mode:"boolean"})],xF.prototype,"hideSelection",void 0),t([ft({mode:"boolean"})],xF.prototype,"expanded",void 0),t([ft({attribute:"reserve-collapse-space",mode:"boolean"})],xF.prototype,"reserveCollapseSpace",void 0),t([C],xF.prototype,"dataRecord",void 0),t([C],xF.prototype,"columns",void 0),t([C],xF.prototype,"currentActionMenuColumn",void 0),t([C],xF.prototype,"nestingLevel",void 0),t([C],xF.prototype,"resolvedRowIndex",void 0),t([ft({attribute:"is-parent-row",mode:"boolean"})],xF.prototype,"isParentRow",void 0),t([ft({attribute:"menu-open",mode:"boolean"})],xF.prototype,"menuOpen",void 0),t([ft({attribute:"row-operation-grid-cell-hidden",mode:"boolean"})],xF.prototype,"rowOperationGridCellHidden",void 0),t([ft({mode:"boolean"})],xF.prototype,"loading",void 0),t([C],xF.prototype,"cellIndentLevels",void 0),t([C],xF.prototype,"cellStates",void 0),t([C],xF.prototype,"selectionCheckbox",void 0),t([C],xF.prototype,"animationClass",void 0),t([k],xF.prototype,"isTopLevelParentRow",null),t([k],xF.prototype,"isNestedParent",null),t([k],xF.prototype,"showSelectionCheckbox",null),t([k],xF.prototype,"ariaSelected",null)
+n={cellRecord:Object.fromEntries(t.columnInternals.cellRecordFieldNames.map(((t,e)=>[t,i[e]]))),columnConfig:t.columnInternals.columnConfig}}return n}))}hasValidFieldNames(t){return t.every((t=>void 0!==t))}selectedChanged(){this.setSelectionCheckboxState()}selectionCheckboxChanged(){this.setSelectionCheckboxState()}setSelectionCheckboxState(){this.selectionCheckbox&&(this.ignoreSelectionChangeEvents=!0,this.selectionCheckbox.checked=this.selected,this.ignoreSelectionChangeEvents=!1)}}t([ft({attribute:"record-id"})],xF.prototype,"recordId",void 0),t([ft({mode:"boolean"})],xF.prototype,"selectable",void 0),t([ft({mode:"boolean"})],xF.prototype,"selected",void 0),t([ft({attribute:"hide-selection",mode:"boolean"})],xF.prototype,"hideSelection",void 0),t([ft({mode:"boolean"})],xF.prototype,"expanded",void 0),t([ft({attribute:"reserve-collapse-space",mode:"boolean"})],xF.prototype,"reserveCollapseSpace",void 0),t([C],xF.prototype,"dataRecord",void 0),t([C],xF.prototype,"columns",void 0),t([C],xF.prototype,"currentActionMenuColumn",void 0),t([C],xF.prototype,"nestingLevel",void 0),t([C],xF.prototype,"resolvedRowIndex",void 0),t([ft({attribute:"is-parent-row",mode:"boolean"})],xF.prototype,"isParentRow",void 0),t([ft({attribute:"menu-open",mode:"boolean"})],xF.prototype,"menuOpen",void 0),t([ft({attribute:"row-operation-grid-cell-hidden",mode:"boolean"})],xF.prototype,"rowOperationGridCellHidden",void 0),t([ft({mode:"boolean"})],xF.prototype,"loading",void 0),t([C],xF.prototype,"cellIndentLevels",void 0),t([C],xF.prototype,"cellStates",void 0),t([C],xF.prototype,"selectionCheckbox",void 0),t([C],xF.prototype,"animationClass",void 0),t([ft({attribute:"allow-hover",mode:"boolean"})],xF.prototype,"allowHover",void 0),t([k],xF.prototype,"isTopLevelParentRow",null),t([k],xF.prototype,"isNestedParent",null),t([k],xF.prototype,"showSelectionCheckbox",null),t([k],xF.prototype,"ariaSelected",null)
 const CF=xF.compose({baseName:"table-row",template:wF,styles:fF})
 _i.getOrCreate().withPrefix("nimble").register(CF())
 const kF="nimble-table-row",SF=Mt`
@@ -11012,7 +11012,7 @@ const kF="nimble-table-row",SF=Mt`
         position: absolute;
     }
 
-    :host(:hover)::before {
+    :host([allow-hover]:hover)::before {
         background-color: ${yl};
     }
 
@@ -11058,11 +11058,11 @@ const kF="nimble-table-row",SF=Mt`
         padding-left: 0px;
     }
 `.withBehaviors(Qh(No.color,Mt`
-            :host(:hover)::before {
+            :host([allow-hover]:hover)::before {
                 background-color: ${pl(co,.05)};
             }
         `),Qh(No.dark,Mt`
-            :host(:hover)::before {
+            :host([allow-hover]:hover)::before {
                 background-color: ${pl(co,.1)};
             }
         `)),_F=Q`
@@ -11105,11 +11105,11 @@ const kF="nimble-table-row",SF=Mt`
         </div>
     </template>
 `
-class IF extends We{constructor(){super(...arguments),this.nestingLevel=0,this.expanded=!1,this.selectable=!1,this.selectionState=RR,this.animationClass="",this.ignoreSelectionChangeEvents=!1,this.removeAnimatingClass=()=>{this.animationClass="",this.expandIcon.removeEventListener("transitionend",this.removeAnimatingClass)}}onGroupExpandToggle(){this.$emit("group-expand-toggle"),this.animationClass="animating",this.expandIcon.addEventListener("transitionend",this.removeAnimatingClass)}onSelectionCheckboxChange(t){if(this.ignoreSelectionChangeEvents)return
+class IF extends We{constructor(){super(...arguments),this.nestingLevel=0,this.expanded=!1,this.selectable=!1,this.selectionState=RR,this.animationClass="",this.allowHover=!1,this.ignoreSelectionChangeEvents=!1,this.removeAnimatingClass=()=>{this.animationClass="",this.expandIcon.removeEventListener("transitionend",this.removeAnimatingClass)}}onGroupExpandToggle(){this.$emit("group-expand-toggle"),this.animationClass="animating",this.expandIcon.addEventListener("transitionend",this.removeAnimatingClass)}onSelectionCheckboxChange(t){if(this.ignoreSelectionChangeEvents)return
 const e=t.target.checked
 this.selectionState=e?FR:RR
 const n={oldState:!e,newState:e}
-this.$emit("group-selection-toggle",n)}getFocusableElements(){return{selectionCheckbox:this.selectable?this.selectionCheckbox:void 0,cells:[]}}selectionStateChanged(){this.setSelectionCheckboxState()}selectionCheckboxChanged(){this.setSelectionCheckboxState()}setSelectionCheckboxState(){this.selectionCheckbox&&(this.ignoreSelectionChangeEvents=!0,this.selectionCheckbox.checked=this.selectionState===FR,this.selectionCheckbox.indeterminate=this.selectionState===NR,this.ignoreSelectionChangeEvents=!1)}}t([C],IF.prototype,"groupRowValue",void 0),t([C],IF.prototype,"nestingLevel",void 0),t([C],IF.prototype,"resolvedRowIndex",void 0),t([C],IF.prototype,"immediateChildCount",void 0),t([C],IF.prototype,"groupColumn",void 0),t([ft({mode:"boolean"})],IF.prototype,"expanded",void 0),t([ft({mode:"boolean"})],IF.prototype,"selectable",void 0),t([ft({attribute:"selection-state"})],IF.prototype,"selectionState",void 0),t([C],IF.prototype,"selectionCheckbox",void 0),t([C],IF.prototype,"animationClass",void 0)
+this.$emit("group-selection-toggle",n)}getFocusableElements(){return{selectionCheckbox:this.selectable?this.selectionCheckbox:void 0,cells:[]}}selectionStateChanged(){this.setSelectionCheckboxState()}selectionCheckboxChanged(){this.setSelectionCheckboxState()}setSelectionCheckboxState(){this.selectionCheckbox&&(this.ignoreSelectionChangeEvents=!0,this.selectionCheckbox.checked=this.selectionState===FR,this.selectionCheckbox.indeterminate=this.selectionState===NR,this.ignoreSelectionChangeEvents=!1)}}t([C],IF.prototype,"groupRowValue",void 0),t([C],IF.prototype,"nestingLevel",void 0),t([C],IF.prototype,"resolvedRowIndex",void 0),t([C],IF.prototype,"immediateChildCount",void 0),t([C],IF.prototype,"groupColumn",void 0),t([ft({mode:"boolean"})],IF.prototype,"expanded",void 0),t([ft({mode:"boolean"})],IF.prototype,"selectable",void 0),t([ft({attribute:"selection-state"})],IF.prototype,"selectionState",void 0),t([C],IF.prototype,"selectionCheckbox",void 0),t([C],IF.prototype,"animationClass",void 0),t([ft({attribute:"allow-hover",mode:"boolean"})],IF.prototype,"allowHover",void 0)
 const MF=IF.compose({baseName:"table-group-row",template:_F,styles:SF})
 _i.getOrCreate().withPrefix("nimble").register(MF())
 const $F="nimble-table-group-row",EF=Q`
@@ -11235,6 +11235,7 @@ const $F="nimble-table-group-row",EF=Q`
                                         ?selectable="${(t,e)=>e.parent.selectionMode===OR.multiple}"
                                         selection-state="${(t,e)=>e.parent.tableData[t.index]?.selectionState}"
                                         :resolvedRowIndex="${t=>t.index}"
+                                        ?allow-hover="${(t,e)=>!e.parent.virtualizer.isScrolling}"
                                         @focusin="${(t,e)=>e.parent.onRowFocusIn(e.event)}"
                                         @blur="${(t,e)=>e.parent.onRowBlur(e.event)}"
                                         @group-selection-toggle="${(t,e)=>e.parent.onRowSelectionToggle(t.index,e.event)}"
@@ -11260,6 +11261,7 @@ const $F="nimble-table-group-row",EF=Q`
                                         ?row-operation-grid-cell-hidden="${(t,e)=>!e.parent.showRowOperationColumn}"
                                         ?loading="${(t,e)=>e.parent.tableData[t.index]?.isLoadingChildren}"
                                         :resolvedRowIndex="${t=>t.index}"
+                                        ?allow-hover="${(t,e)=>!e.parent.virtualizer.isScrolling}"
                                         @click="${(t,e)=>e.parent.onRowClick(t.index,e.event)}"
                                         @focusin="${(t,e)=>e.parent.onRowFocusIn(e.event)}"
                                         @blur="${(t,e)=>e.parent.onRowBlur(e.event)}"
@@ -11376,21 +11378,21 @@ const HF=(t,e,n,i)=>{for(;t<=e;){const s=(t+e)/2|0,o=n(s)
 if(o<i)t=s+1
 else{if(!(o>i))return s
 e=s-1}}return t>0?t-1:0}
-class UF{get pageSize(){return this._pageSize}get rowHeight(){return parseFloat(Bl.getValueFor(this.table))+2*parseFloat(ql.getValueFor(this.table))}constructor(t,e){this.visibleItems=[],this.scrollHeight=0,this.headerContainerMarginRight=0,this.rowContainerYOffset=0,this._pageSize=0,this.table=t,this.tanStackTable=e,this.viewportResizeObserver=new ResizeObserver((t=>{const e=t[0]?.borderBoxSize[0]
+class UF{get pageSize(){return this._pageSize}get rowHeight(){return parseFloat(Bl.getValueFor(this.table))+2*parseFloat(ql.getValueFor(this.table))}constructor(t,e){this.visibleItems=[],this.scrollHeight=0,this.isScrolling=!1,this.headerContainerMarginRight=0,this.rowContainerYOffset=0,this._pageSize=0,this.isScrollingTimer=0,this.table=t,this.tanStackTable=e,this.viewportResizeObserver=new ResizeObserver((t=>{const e=t[0]?.borderBoxSize[0]
 if(e){this.updatePageSize()
 const t=e.inlineSize
 this.headerContainerMarginRight=t-this.table.viewport.clientWidth}}))}connect(){this.viewportResizeObserver.observe(this.table.viewport),this.updateVirtualizer()
 const t=this.virtualizer.scrollOffset
 null!==t&&this.table.viewport.scrollTo({top:t})}disconnect(){this.viewportResizeObserver.disconnect()}dataChanged(){this.table.$fastController.isConnected&&this.updateVirtualizer()}scrollToIndex(t,e){this.virtualizer?.scrollToIndex(t,e)}updateVirtualizer(){const t=this.createVirtualizerOptions()
 this.virtualizer?this.virtualizer.setOptions(t):this.virtualizer=new VF(t),this.virtualizer._willUpdate(),this.handleVirtualizerChange()}createVirtualizerOptions(){const t=this.rowHeight
-return{count:this.tanStackTable.getRowModel().rows.length,getScrollElement:()=>this.table.viewport,estimateSize:e=>t,enableSmoothScroll:!0,overscan:3,scrollingDelay:5,scrollToFn:zF,observeElementOffset:BF,observeElementRect:FF,onChange:()=>this.handleVirtualizerChange()}}handleVirtualizerChange(){const t=this.virtualizer
-this.visibleItems=t.getVirtualItems(),this.scrollHeight=t.getTotalSize()
+return{count:this.tanStackTable.getRowModel().rows.length,getScrollElement:()=>this.table.viewport,estimateSize:e=>t,enableSmoothScroll:!0,overscan:3,isScrollingResetDelay:250,scrollToFn:zF,observeElementOffset:BF,observeElementRect:FF,onChange:()=>this.handleVirtualizerChange()}}handleVirtualizerChange(){const t=this.virtualizer
+this.visibleItems=t.getVirtualItems(),this.scrollHeight=t.getTotalSize(),this.isScrolling=t.isScrolling,window.clearTimeout(this.isScrollingTimer),this.isScrolling&&(this.isScrollingTimer=window.setTimeout((()=>{this.isScrolling=!1}),300))
 let e=0
 if(this.visibleItems.length>0){e=this.visibleItems[0].start}this.rowContainerYOffset=e}updatePageSize(){this._pageSize=Math.round(this.table.viewport.clientHeight/this.rowHeight)}}function qF(t){switch(t){case GR:return WF
 case ZR:return jF
 default:return WF}}function jF(t,e,n){const i=t.getValue(n),s=e.getValue(n)
 return"string"==typeof i&&"string"==typeof s?i.localeCompare(s):i===s?0:void 0===i||null===i&&void 0!==s?-1:1}function WF(t,e,n){const i=t.getValue(n),s=e.getValue(n)
-return Object.is(i,s)?0:void 0===i?-1:void 0===s?1:null===i?-1:null===s?1:Number.isNaN(i)?-1:Number.isNaN(s)?1:0===i&&0===s?Object.is(i,-0)?-1:1:i>s?1:-1}t([C],UF.prototype,"visibleItems",void 0),t([C],UF.prototype,"scrollHeight",void 0),t([C],UF.prototype,"headerContainerMarginRight",void 0),t([C],UF.prototype,"rowContainerYOffset",void 0)
+return Object.is(i,s)?0:void 0===i?-1:void 0===s?1:null===i?-1:null===s?1:Number.isNaN(i)?-1:Number.isNaN(s)?1:0===i&&0===s?Object.is(i,-0)?-1:1:i>s?1:-1}t([C],UF.prototype,"visibleItems",void 0),t([C],UF.prototype,"scrollHeight",void 0),t([C],UF.prototype,"isScrolling",void 0),t([C],UF.prototype,"headerContainerMarginRight",void 0),t([C],UF.prototype,"rowContainerYOffset",void 0)
 class GF{constructor(t){this.table=t,this.isColumnBeingSized=!1,this.visibleColumns=[],this.currentTotalDelta=0,this.dragStart=0,this.initialColumnWidths=[],this.onDividerMouseMove=t=>{const e=t
 for(let t=0;t<this.visibleColumns.length;t++)this.visibleColumns[t].columnInternals.currentPixelWidth=this.initialColumnWidths[t]?.initialPixelWidth
 this.currentTotalDelta=this.getAllowedSizeDelta(e.clientX-this.dragStart),this.performCascadeSizeLeft(this.leftColumnIndex,this.currentTotalDelta),this.performCascadeSizeRight(this.rightColumnIndex,this.currentTotalDelta)