@ni/nimble-components 32.2.0 → 32.2.2
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/dist/all-components-bundle.js +42 -7
- package/dist/all-components-bundle.js.map +1 -1
- package/dist/all-components-bundle.min.js +9 -8
- package/dist/all-components-bundle.min.js.map +1 -1
- package/dist/esm/drawer/styles.js +6 -1
- package/dist/esm/drawer/styles.js.map +1 -1
- package/dist/esm/table/index.d.ts +8 -0
- package/dist/esm/table/index.js +28 -0
- package/dist/esm/table/index.js.map +1 -1
- package/dist/esm/table/models/virtualizer.d.ts +1 -1
- package/dist/esm/table/models/virtualizer.js +9 -7
- package/dist/esm/table/models/virtualizer.js.map +1 -1
- package/package.json +1 -1
|
@@ -3735,7 +3735,8 @@ const ov=Mt`
|
|
|
3735
3735
|
|
|
3736
3736
|
@keyframes ni-private-drawer-slide-in-right-keyframes {
|
|
3737
3737
|
0% {
|
|
3738
|
-
|
|
3738
|
+
${""}
|
|
3739
|
+
transform: translate(95%);
|
|
3739
3740
|
}
|
|
3740
3741
|
100% {
|
|
3741
3742
|
transform: translate(0%);
|
|
@@ -11380,17 +11381,17 @@ const qF=(t,e,n,i)=>{for(;t<=e;){const s=(t+e)/2|0,o=n(s)
|
|
|
11380
11381
|
if(o<i)t=s+1
|
|
11381
11382
|
else{if(!(o>i))return s
|
|
11382
11383
|
e=s-1}}return t>0?t-1:0}
|
|
11383
|
-
class jF{get pageSize(){return this._pageSize}
|
|
11384
|
+
class jF{get pageSize(){return this._pageSize}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]
|
|
11384
11385
|
if(e){this.updatePageSize()
|
|
11385
11386
|
const t=e.inlineSize
|
|
11386
11387
|
this.headerContainerMarginRight=t-this.table.viewport.clientWidth}}))}connect(){this.viewportResizeObserver.observe(this.table.viewport),this.updateVirtualizer()
|
|
11387
11388
|
const t=this.virtualizer.scrollOffset
|
|
11388
|
-
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()
|
|
11389
|
-
this.virtualizer?this.virtualizer.setOptions(t):this.virtualizer=new UF(t),this.virtualizer._willUpdate(),this.handleVirtualizerChange()}createVirtualizerOptions(){const t=this.rowHeight
|
|
11389
|
+
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)}updateRowHeight(){this.updatePageSize(),this.virtualizer&&(this.updateVirtualizer(),this.virtualizer.measure())}updateVirtualizer(){const t=this.createVirtualizerOptions()
|
|
11390
|
+
this.virtualizer?this.virtualizer.setOptions(t):this.virtualizer=new UF(t),this.virtualizer._willUpdate(),this.handleVirtualizerChange()}createVirtualizerOptions(){const t=this.table.rowHeight
|
|
11390
11391
|
return{count:this.tanStackTable.getRowModel().rows.length,getScrollElement:()=>this.table.viewport,estimateSize:e=>t,enableSmoothScroll:!0,overscan:3,isScrollingResetDelay:250,scrollToFn:HF,observeElementOffset:zF,observeElementRect:LF,onChange:()=>this.handleVirtualizerChange()}}handleVirtualizerChange(){const t=this.virtualizer
|
|
11391
11392
|
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))
|
|
11392
11393
|
let e=0
|
|
11393
|
-
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 WF(t){switch(t){case KR:return ZF
|
|
11394
|
+
if(this.visibleItems.length>0){e=this.visibleItems[0].start}this.rowContainerYOffset=e}updatePageSize(){this._pageSize=Math.round(this.table.viewport.clientHeight/this.table.rowHeight)}}function WF(t){switch(t){case KR:return ZF
|
|
11394
11395
|
case YR:return GF
|
|
11395
11396
|
default:return ZF}}function GF(t,e,n){const i=t.getValue(n),s=e.getValue(n)
|
|
11396
11397
|
return"string"==typeof i&&"string"==typeof s?i.localeCompare(s):i===s?0:void 0===i||null===i&&void 0!==s?-1:1}function ZF(t,e,n){const i=t.getValue(n),s=e.getValue(n)
|
|
@@ -11618,7 +11619,7 @@ const i=e??this.columnIndex,s=n??this.rowIndex
|
|
|
11618
11619
|
return i>=0&&i<t.cells.length&&(this.focusType=WR,this.setRowCellFocusState(i,s,!0),!0)}trySetCellContentFocus(t,e,n,i){if(!t)return!1
|
|
11619
11620
|
const s=n??this.columnIndex,o=i??this.rowIndex
|
|
11620
11621
|
return s>=0&&s<t.cells.length&&e>=0&&e<t.cells[s].cell.cellView.tabbableChildren.length&&(this.setCellContentFocusState(e,o,s,!0),!0)}trySetCellActionMenuFocus(t,e,n){const i=e??this.columnIndex,s=n??this.rowIndex
|
|
11621
|
-
return!!(i>=0&&i<t.cells.length&&t.cells[i].actionMenuButton)&&(this.setCellActionMenuFocusState(s,i,!0),!0)}setCellActionMenuFocusState(t,e,n){this.focusType=GR,this.setRowCellFocusState(e,t,n)}setCellContentFocusState(t,e,n,i){this.focusType=ZR,this.cellContentIndex=t,this.setRowCellFocusState(n,e,i)}setRowFocusState(t){this.focusType=qR,void 0!==t&&(this.rowIndex=t)}setCellFocusState(t,e,n){this.focusType=WR,this.setRowCellFocusState(t,e,n)}setRowCellFocusState(t,e,n){this.rowIndex=e,this.columnIndex=t,n&&this.focusCurrentRow(!0)}isResolvedRowType(t){return t instanceof kF||t instanceof $F}}let hN=class extends We{get validity(){return this.tableValidator.getValidity()}get showRowOperationColumn(){return this.selectionMode===FR.multiple||this.showCollapseAll}get collapseButtonVisibility(){return this.canHaveCollapsibleRows?this.showCollapseAll?"visible":"":"hidden-size-reduced"}constructor(){super(),this.selectionMode=FR.none,this.tableData=[],this.columns=[],this.childItems=[],this.rowElements=[],this.canRenderRows=!0,this.scrollX=0,this.selectionState=NR,this.showCollapseAll=!1,this.canHaveCollapsibleRows=!1,this.visibleColumns=[],this.tableScrollableMinWidth=0,this.windowShiftKeyDown=!1,this.tableValidator=new lF,this.tableUpdateTracker=new JF(this),this.columnNotifiers=[],this.isInitialized=!1,this.ignoreSelectionChangeEvents=!1,this.requestedSlots=new Map,this.actionMenuSlots=[],this.onViewPortScroll=t=>{this.scrollX=t.target.scrollLeft},this.onKeyDown=t=>{this.windowShiftKeyDown=t.shiftKey},this.onKeyUp=t=>{this.windowShiftKeyDown=t.shiftKey},this.onBlur=()=>{this.windowShiftKeyDown=!1},this.getRowCanExpand=t=>this.expansionManager.isRowExpandable(t),this.getIsRowExpanded=t=>this.expansionManager.isRowExpanded(t),this.handleRowSelectionChange=t=>{const e=t instanceof Function?t(this.table.getState().rowSelection):t
|
|
11622
|
+
return!!(i>=0&&i<t.cells.length&&t.cells[i].actionMenuButton)&&(this.setCellActionMenuFocusState(s,i,!0),!0)}setCellActionMenuFocusState(t,e,n){this.focusType=GR,this.setRowCellFocusState(e,t,n)}setCellContentFocusState(t,e,n,i){this.focusType=ZR,this.cellContentIndex=t,this.setRowCellFocusState(n,e,i)}setRowFocusState(t){this.focusType=qR,void 0!==t&&(this.rowIndex=t)}setCellFocusState(t,e,n){this.focusType=WR,this.setRowCellFocusState(t,e,n)}setRowCellFocusState(t,e,n){this.rowIndex=e,this.columnIndex=t,n&&this.focusCurrentRow(!0)}isResolvedRowType(t){return t instanceof kF||t instanceof $F}}let hN=class extends We{get validity(){return this.tableValidator.getValidity()}get showRowOperationColumn(){return this.selectionMode===FR.multiple||this.showCollapseAll}get collapseButtonVisibility(){return this.canHaveCollapsibleRows?this.showCollapseAll?"visible":"":"hidden-size-reduced"}get rowHeight(){return this._rowHeight}constructor(){super(),this.selectionMode=FR.none,this.tableData=[],this.columns=[],this.childItems=[],this.rowElements=[],this.canRenderRows=!0,this.scrollX=0,this.selectionState=NR,this.showCollapseAll=!1,this.canHaveCollapsibleRows=!1,this.visibleColumns=[],this.tableScrollableMinWidth=0,this.windowShiftKeyDown=!1,this.tableValidator=new lF,this.tableUpdateTracker=new JF(this),this.columnNotifiers=[],this._rowHeight=0,this.isInitialized=!1,this.ignoreSelectionChangeEvents=!1,this.requestedSlots=new Map,this.borderWidthSubscriber={handleChange:()=>{this.updateRowHeight()}},this.controlHeightSubscriber={handleChange:()=>{this.updateRowHeight()}},this.actionMenuSlots=[],this.onViewPortScroll=t=>{this.scrollX=t.target.scrollLeft},this.onKeyDown=t=>{this.windowShiftKeyDown=t.shiftKey},this.onKeyUp=t=>{this.windowShiftKeyDown=t.shiftKey},this.onBlur=()=>{this.windowShiftKeyDown=!1},this.getRowCanExpand=t=>this.expansionManager.isRowExpandable(t),this.getIsRowExpanded=t=>this.expansionManager.isRowExpanded(t),this.handleRowSelectionChange=t=>{const e=t instanceof Function?t(this.table.getState().rowSelection):t
|
|
11622
11623
|
this.updateTableOptions({state:{rowSelection:e}})},this.handleExpandedChange=t=>{const e=t instanceof Function?t(this.table.getState().expanded):t
|
|
11623
11624
|
this.updateTableOptions({state:{expanded:e}})},this.options={data:[],onStateChange:t=>{},onRowSelectionChange:this.handleRowSelectionChange,onExpandedChange:this.handleExpandedChange,getCoreRowModel:t=>FO((()=>[t.options.data]),(e=>{const n={rows:[],flatRows:[],rowsById:{}},i=function(e,s,o){void 0===s&&(s=0)
|
|
11624
11625
|
const r=[]
|
|
@@ -11645,7 +11646,7 @@ return t.rows.forEach(n),{rows:e,flatRows:t.flatRows,rowsById:t.rowsById}}(e):e)
|
|
|
11645
11646
|
const e=t.map((t=>({...t}))),n=this.calculateTanStackData(e)
|
|
11646
11647
|
this.updateTableOptions(n)}async getSelectedRecordIds(){return await this.processPendingUpdates(),this.selectionManager.getCurrentSelectedRecordIds()}async setSelectedRecordIds(t){await this.processPendingUpdates(),this.selectionMode!==FR.none&&this.updateTableOptions({state:{rowSelection:this.calculateTanStackSelectionState(t)}})}async setRecordHierarchyOptions(t){await this.processPendingUpdates()
|
|
11647
11648
|
const e=structuredClone(t),n=this.tableValidator.getOptionsWithPresentIds(e)
|
|
11648
|
-
this.expansionManager.setHierarchyOptions(n),this.refreshRows()}connectedCallback(){super.connectedCallback(),this.initialize(),this.virtualizer.connect(),this.viewport.addEventListener("scroll",this.onViewPortScroll,{passive:!0}),this.keyboardNavigationManager.connect(),window.addEventListener("keydown",this.onKeyDown),window.addEventListener("keyup",this.onKeyUp),window.addEventListener("blur",this.onBlur)}disconnectedCallback(){super.disconnectedCallback(),this.virtualizer.disconnect(),this.keyboardNavigationManager.disconnect(),this.viewport.removeEventListener("scroll",this.onViewPortScroll),window.removeEventListener("keydown",this.onKeyDown),window.removeEventListener("keyup",this.onKeyUp),window.removeEventListener("blur",this.onBlur)}checkValidity(){return this.tableValidator.isValid()}handleChange(t,e){(t instanceof aF||t instanceof oF)&&"string"==typeof e?this.tableUpdateTracker.trackColumnPropertyChanged(e):t instanceof cN&&"isColumnValid"===e?this.tableValidator.validateColumnConfigurations(this.columns):t instanceof KF&&"isColumnBeingSized"===e&&!this.layoutManager.isColumnBeingSized&&this.emitColumnConfigurationChangeEvent()}onRowSelectionToggle(t,e){e.stopImmediatePropagation()
|
|
11649
|
+
this.expansionManager.setHierarchyOptions(n),this.refreshRows()}connectedCallback(){super.connectedCallback(),this.initialize(),this.updateRowHeight(),this.virtualizer.connect(),this.viewport.addEventListener("scroll",this.onViewPortScroll,{passive:!0}),this.keyboardNavigationManager.connect(),window.addEventListener("keydown",this.onKeyDown),window.addEventListener("keyup",this.onKeyUp),window.addEventListener("blur",this.onBlur),ql.subscribe(this.borderWidthSubscriber,this),Bl.subscribe(this.controlHeightSubscriber,this)}disconnectedCallback(){super.disconnectedCallback(),this.virtualizer.disconnect(),this.keyboardNavigationManager.disconnect(),this.viewport.removeEventListener("scroll",this.onViewPortScroll),window.removeEventListener("keydown",this.onKeyDown),window.removeEventListener("keyup",this.onKeyUp),window.removeEventListener("blur",this.onBlur),ql.unsubscribe(this.borderWidthSubscriber),Bl.unsubscribe(this.controlHeightSubscriber)}checkValidity(){return this.tableValidator.isValid()}handleChange(t,e){(t instanceof aF||t instanceof oF)&&"string"==typeof e?this.tableUpdateTracker.trackColumnPropertyChanged(e):t instanceof cN&&"isColumnValid"===e?this.tableValidator.validateColumnConfigurations(this.columns):t instanceof KF&&"isColumnBeingSized"===e&&!this.layoutManager.isColumnBeingSized&&this.emitColumnConfigurationChangeEvent()}onRowSelectionToggle(t,e){e.stopImmediatePropagation()
|
|
11649
11650
|
this.selectionManager.handleRowSelectionToggle(this.tableData[t],e.detail.newState,this.windowShiftKeyDown)&&this.emitSelectionChangeEvent()}onRowClick(t,e){return this.selectionManager.handleRowClick(this.tableData[t],e.shiftKey,e.ctrlKey||e.metaKey)&&this.emitSelectionChangeEvent(),!0}onRowFocusIn(t){this.keyboardNavigationManager.onRowFocusIn(t)}onRowBlur(t){this.keyboardNavigationManager.onRowBlur(t)}onAllRowsSelectionChange(t){t.stopPropagation(),this.ignoreSelectionChangeEvents||(this.table.toggleAllRowsSelected(this.selectionCheckbox.checked),this.emitSelectionChangeEvent())}onRowActionMenuBeforeToggle(t,e){e.stopImmediatePropagation(),this.handleActionMenuBeforeToggleEvent(t,e)}onRowActionMenuToggle(t){t.stopImmediatePropagation(),this.handleRowActionMenuToggleEvent(t)}onRowSlotsRequest(t){t.stopImmediatePropagation()
|
|
11650
11651
|
for(const e of t.detail.slots){const n=nF(t.detail.columnInternalId,e.slot)
|
|
11651
11652
|
this.requestedSlots.set(e.name,{recordId:t.detail.recordId,uniqueSlot:n})}this.refreshRows()}handleCollapseAllRows(){this.expansionManager.collapseAll()}onRightDividerMouseDown(t,e){0===t.button&&this.layoutManager.beginColumnInteractiveSize(t.clientX,this.getRightDividerIndex(e))}onLeftDividerMouseDown(t,e){0===t.button&&this.layoutManager.beginColumnInteractiveSize(t.clientX,this.getLeftDividerIndex(e))}getLeftDividerIndex(t){return 2*t-1}getRightDividerIndex(t){return 2*t}handleGroupRowExpanded(t,e){this.toggleRowExpanded(t),e.stopPropagation()}handleRowExpanded(t){this.toggleRowExpanded(t)}toggleColumnSort(t,e){if(t.columnInternals.sortingDisabled)return
|
|
@@ -11699,7 +11700,7 @@ return this.firstSortedColumn=t.length?t[0]:void 0,t.map((t=>({id:t.columnIntern
|
|
|
11699
11700
|
if("string"==typeof n)return e.clientRecord[n]},sortingFn:WF(t.columnInternals.sortOperation),sortUndefined:!1})))}calculateTanStackSelectionState(t){if(this.selectionMode===FR.none)return{}
|
|
11700
11701
|
const e={},n=this.tableValidator.getPresentRecordIds(t)
|
|
11701
11702
|
for(const t of n)if(e[t]=!0,this.selectionMode===FR.single)break
|
|
11702
|
-
return e}}
|
|
11703
|
+
return e}updateRowHeight(){this._rowHeight=parseFloat(Bl.getValueFor(this))+2*parseFloat(ql.getValueFor(this)),this.virtualizer?.updateRowHeight()}}
|
|
11703
11704
|
t([ft({attribute:"id-field-name"})],hN.prototype,"idFieldName",void 0),t([ft({attribute:"parent-id-field-name"})],hN.prototype,"parentIdFieldName",void 0),t([ft({attribute:"selection-mode"})],hN.prototype,"selectionMode",void 0),t([C],hN.prototype,"tableData",void 0),t([C],hN.prototype,"columns",void 0),t([C],hN.prototype,"childItems",void 0),t([C],hN.prototype,"rowElements",void 0),t([C],hN.prototype,"openActionMenuRecordId",void 0),t([C],hN.prototype,"canRenderRows",void 0),t([C],hN.prototype,"scrollX",void 0),t([C],hN.prototype,"rowGridColumns",void 0),t([C],hN.prototype,"selectionState",void 0),t([C],hN.prototype,"selectionCheckbox",void 0),t([C],hN.prototype,"collapseAllButton",void 0),t([C],hN.prototype,"showCollapseAll",void 0),t([C],hN.prototype,"canHaveCollapsibleRows",void 0),t([k],hN.prototype,"collapseButtonVisibility",null),t([C],hN.prototype,"firstSortedColumn",void 0),t([C],hN.prototype,"visibleColumns",void 0),t([C],hN.prototype,"tableScrollableMinWidth",void 0),t([C],hN.prototype,"windowShiftKeyDown",void 0)
|
|
11704
11705
|
const uN=hN.compose({baseName:"table",template:AF,styles:cF})
|
|
11705
11706
|
_i.getOrCreate().withPrefix("nimble").register(uN())
|