@ni/nimble-components 21.2.0 → 21.3.0

package/dist/all-components-bundle.js

@@ -16301,7 +16301,7 @@
 
   /**
    * Do not edit directly
-   * Generated on Fri, 02 Feb 2024 21:36:26 GMT
+   * Generated on Wed, 07 Feb 2024 21:32:56 GMT
    */
 
   const Information100DarkUi = "#a46eff";
@@ -61322,6 +61322,10 @@ img.ProseMirror-separator {
     };
   }
 
+  const TableRecordDelayedHierarchyState = {
+      none: undefined,
+      canLoadChildren: 'canLoadChildren'
+  };
   /**
    * The possible directions a table column can be sorted in.
    */
@@ -61804,6 +61808,9 @@ img.ProseMirror-separator {
       getPresentRecordIds(requestedRecordIds) {
           return requestedRecordIds.filter(id => this.recordIds.has(id));
       }
+      getOptionsWithPresentIds(requestedOptions) {
+          return requestedOptions.filter(item => this.recordIds.has(item.recordId));
+      }
       setParentIdConfigurationValidity(valid) {
           this.invalidParentIdConfiguration = !valid;
       }
@@ -64629,8 +64636,8 @@ img.ProseMirror-separator {
    * We must track the expansion state separately from TanStack because:
    *   1. TanStack does not support having a different initial expansion state per row unless explicitly
    *      specified for each row by ID. This causes problems in the nimble-table because we could have
-   *      a different initial expansion state for group rows, parent rows, and parent rows with lazy
-   *      loaded children.
+   *      a different initial expansion state for group rows, parent rows, and parent rows with delay-loaded
+   *      children.
    *   2. TanStack does not remove entries from its expanded state when those rows are no longer present
    *      in the data. This is not ideal because the object maintaining the expansion state can grow unbounded.
    */
@@ -64642,11 +64649,16 @@ img.ProseMirror-separator {
           // potentially be different (e.g. expanded for groups and collapsed for parent rows).
           this.isInDefaultState = true;
           this.collapsedRows = new Set();
+          this.hierarchyOptions = new Map();
+          this.isHierarchyEnabled = false;
       }
       isRowExpanded(row) {
           if (!this.isRowExpandable(row)) {
               return false;
           }
+          if (row.subRows.length === 0) {
+              return false;
+          }
           return this.isInDefaultState || !this.collapsedRows.has(row.id);
       }
       toggleRowExpansion(row) {
@@ -64664,7 +64676,7 @@ img.ProseMirror-separator {
           row.toggleExpanded();
       }
       collapseAll() {
-          this.reset();
+          this.resetExpansionState();
           this.isInDefaultState = false;
           const rows = this.tanStackTable.getRowModel().flatRows;
           for (const row of rows) {
@@ -64674,25 +64686,50 @@ img.ProseMirror-separator {
           }
           this.tanStackTable.toggleAllRowsExpanded(false);
       }
-      reset() {
+      resetExpansionState() {
           this.collapsedRows.clear();
           this.isInDefaultState = true;
       }
+      resetHierarchyOptions() {
+          this.hierarchyOptions.clear();
+      }
       processDataUpdate(rows) {
-          if (this.isInDefaultState) {
+          if (this.collapsedRows.size === 0 && this.hierarchyOptions.size === 0) {
               return;
           }
           const updatedCollapsedRows = new Set();
+          const updatedHierarchyOptions = new Map();
           for (const row of rows) {
               const rowId = row.id;
               if (this.collapsedRows.has(rowId)) {
                   updatedCollapsedRows.add(rowId);
               }
+              const rowHierarchyOptions = this.hierarchyOptions.get(rowId);
+              if (!row.getIsGrouped() && rowHierarchyOptions) {
+                  updatedHierarchyOptions.set(rowId, rowHierarchyOptions);
+              }
           }
           this.collapsedRows = updatedCollapsedRows;
+          this.hierarchyOptions = updatedHierarchyOptions;
+      }
+      setHierarchyOptions(hierarchyOptions) {
+          this.hierarchyOptions.clear();
+          for (const { recordId, options } of hierarchyOptions) {
+              this.hierarchyOptions.set(recordId, options);
+          }
       }
       isRowExpandable(row) {
-          return row.getIsGrouped() || row.subRows.length > 0;
+          return row.subRows.length > 0 || this.canLoadDelayedChildren(row.id);
+      }
+      setHierarchyEnabled(isHierarchyEnabled) {
+          this.isHierarchyEnabled = isHierarchyEnabled;
+      }
+      canLoadDelayedChildren(id) {
+          if (!this.isHierarchyEnabled) {
+              return false;
+          }
+          return (this.hierarchyOptions.get(id)?.delayedHierarchyState
+              === TableRecordDelayedHierarchyState.canLoadChildren ?? false);
       }
   }
 
@@ -64772,6 +64809,9 @@ img.ProseMirror-separator {
                   this.documentShiftKeyDown = false;
               }
           };
+          this.getRowCanExpand = (row) => {
+              return this.expansionManager.isRowExpandable(row);
+          };
           this.getIsRowExpanded = (row) => {
               return this.expansionManager.isRowExpanded(row);
           };
@@ -64804,6 +64844,7 @@ img.ProseMirror-separator {
               getSortedRowModel: getSortedRowModel(),
               getGroupedRowModel: getGroupedRowModel(),
               getExpandedRowModel: getExpandedRowModel(),
+              getRowCanExpand: this.getRowCanExpand,
               getIsRowExpanded: this.getIsRowExpanded,
               getSubRows: r => r.subRows,
               columns: [],
@@ -64858,6 +64899,13 @@ img.ProseMirror-separator {
               }
           });
       }
+      async setRecordHierarchyOptions(hierarchyOptions) {
+          await this.processPendingUpdates();
+          const clonedOptions = structuredClone(hierarchyOptions);
+          const presentOptions = this.tableValidator.getOptionsWithPresentIds(clonedOptions);
+          this.expansionManager.setHierarchyOptions(presentOptions);
+          this.refreshRows();
+      }
       connectedCallback() {
           super.connectedCallback();
           this.initialize();
@@ -65178,6 +65226,10 @@ img.ProseMirror-separator {
               updatedOptions.getRowId = this.calculateTanStackRowIdFunction();
               updatedOptions.state.rowSelection = {};
               this.selectionManager.handleSelectionReset();
+              this.expansionManager.resetHierarchyOptions();
+          }
+          if (this.tableUpdateTracker.updateRowParentIds) {
+              this.expansionManager.setHierarchyEnabled(this.isHierarchyEnabled());
           }
           if (this.tableUpdateTracker.updateSelectionMode) {
               updatedOptions.enableMultiRowSelection = this.selectionMode === TableRowSelectionMode.multiple;
@@ -65208,7 +65260,7 @@ img.ProseMirror-separator {
               || this.tableUpdateTracker.updateRowParentIds
               || this.tableUpdateTracker.updateGroupRows) {
               updatedOptions.state.expanded = true;
-              this.expansionManager.reset();
+              this.expansionManager.resetExpansionState();
           }
           this.updateTableOptions(updatedOptions);
       }
@@ -65270,6 +65322,9 @@ img.ProseMirror-separator {
               this.ignoreSelectionChangeEvents = false;
           }
       }
+      isHierarchyEnabled() {
+          return typeof this.parentIdFieldName === 'string';
+      }
       refreshRows() {
           this.selectionState = this.getTableSelectionState();
           let hasDataHierarchy = false;
@@ -65277,10 +65332,7 @@ img.ProseMirror-separator {
           this.tableData = rows.map(row => {
               const isGroupRow = row.getIsGrouped();
               const hasParentRow = isGroupRow ? false : row.getParentRow();
-              // we check row.original.subRows below because row.subRows is populated for group rows
-              // which we don't want to include
-              const isParent = row.original.subRows !== undefined
-                  && row.original.subRows.length > 0;
+              const isParent = !isGroupRow && this.getRowCanExpand(row);
               const isChildOfGroupRowWithNoHierarchy = !isGroupRow
                   && !isParent
                   && !hasParentRow
@@ -65372,7 +65424,7 @@ img.ProseMirror-separator {
               state: { ...this.options.state, ...updatedOptions.state }
           };
           this.table.setOptions(this.options);
-          if (updatedOptions.data) {
+          if (updatedOptions.data && this.tableValidator.areRecordIdsValid()) {
               const rows = this.table.getRowModel().flatRows;
               this.expansionManager.processDataUpdate(rows);
           }