@ni/nimble-components 29.9.0 → 30.0.1

package/dist/all-components-bundle.js

@@ -16333,7 +16333,7 @@
 
   /**
    * Do not edit directly
-   * Generated on Mon, 15 Jul 2024 21:06:17 GMT
+   * Generated on Tue, 16 Jul 2024 23:38:17 GMT
    */
 
   const Information100DarkUi = "#a46eff";
@@ -19043,6 +19043,10 @@
       name: 'arrow_partial_rotate_left_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M8 11.988a3.086 3.086 0 0 0 3.143-3.025 3.08 3.08 0 0 0-3.085-3.02v.088l.826 2.067-5.598-2.796L8.884 2.5l-.742 1.932a4.62 4.62 0 0 1 4.572 4.53A4.63 4.63 0 0 1 8 13.5Z" class="cls-1"/></svg>`,
   };
+  const arrowRightThin16X16 = {
+      name: 'arrow_right_thin_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m7.831 4.386-.706 1.127 3.128 1.837H2v1.3h8.365L7.49 10.528l.768 1.085L13.875 8z" class="cls-1"/></svg>`,
+  };
   const arrowRightToLine16X16 = {
       name: 'arrow_right_to_line_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M12 14h2V2h-2Zm-6.9-3 1.287-2H2V7l4.412.004L5.1 5 11 7.982Z" class="cls-1"/></svg>`,
@@ -19051,8 +19055,16 @@
       name: 'arrow_rotate_right_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M8.9 2.773v1.715a3.366 3.366 0 0 1 3.3 3.428 3.366 3.366 0 0 1-3.3 3.429 3.36 3.36 0 0 1-3.293-3.366h.095l2.255.901-3.05-6.107L1.85 8.88l2.108-.808A5.04 5.04 0 0 0 8.9 13.059a5.05 5.05 0 0 0 4.95-5.143A5.05 5.05 0 0 0 8.9 2.773" class="cls-1"/></svg>`,
   };
-  const arrowURotateLeft16X16 = {
-      name: 'arrow_u_rotate_left_16_x_16',
+  const arrowULeft16X16 = {
+      name: 'arrow_u_left_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m9.453 8.857-1.68-2.571h.908a3 3 0 0 1 0 6H3.11V14h5.571a4.714 4.714 0 0 0 0-9.429h-.908L9.453 2 2.604 5.403z" class="cls-1"/></svg>`,
+  };
+  const arrowURight16X16 = {
+      name: 'arrow_u_right_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m6.547 8.857 1.68-2.571H7.32a3 3 0 0 0 0 6h5.571V14H7.319a4.714 4.714 0 0 1 0-9.429h.908L6.547 2l6.849 3.403z" class="cls-1"/></svg>`,
+  };
+  const arrowUUp16X16 = {
+      name: 'arrow_u_up_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8.857 9.453-2.571-1.68v.908a3 3 0 0 0 3 3 3 3 0 0 0 3-3V3.11H14v5.571a4.714 4.714 0 0 1-4.714 4.715A4.714 4.714 0 0 1 4.57 8.68v-.908L2 9.453l3.403-6.849Z" class="cls-1"/></svg>`,
   };
   const arrowUp16X16 = {
@@ -19067,9 +19079,9 @@
       name: 'arrow_up_right_and_arrow_down_left_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m11.023 4.195-2.296-.45L14 2l-1.762 5.256-.458-2.301-6.803 6.85 2.296.45L2 14l1.762-5.256.458 2.301z" class="cls-1"/></svg>`,
   };
-  const arrowUpRightFromSquare = {
-      name: 'arrow_up_right_from_square',
-      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m13.042 2.97-2.063 6.281-.49-2.344-4.117 4.122-1.414-1.414L9.06 5.513 6.736 5.01zM12 9v3H4V4h3V3H3v10h10V9z" class="cls-1"/></svg>`,
+  const arrowUpRightFromSquare16X16 = {
+      name: 'arrow_up_right_from_square_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M10.436 10h1v3h-9V4h3v1h-2v7h7zm-3.42-6.173.298 1.296 2.92-.748L5.068 9.53l.925.926L11.13 5.33l-.52 2.532 1.31.225 1.2-5.839z" class="cls-1"/></svg>`,
   };
   const arrowsMaximize16X16 = {
       name: 'arrows_maximize_16_x_16',
@@ -19115,17 +19127,37 @@
       name: 'book_magnifying_glass_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M6 10c0-.347.058-.678.142-1H5V8h1.556c.22-.378.498-.714.826-1H5V6h5c.732 0 1.41.212 2 .556V2H3v11h4.382A3.98 3.98 0 0 1 6 10M5 4h5v1H5z" class="cls-1"/><path d="m9.99 7.01-.076.002a3 3 0 1 0 1.799 5.452l1.593 1.53.69-.725-1.58-1.516a2.97 2.97 0 0 0 .57-1.816A3 3 0 0 0 9.99 7.01M10 12c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2" class="cls-1"/></svg>`,
   };
-  const calendar16X16 = {
-      name: 'calendar_16_x_16',
-      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M12 3V2h-2v1H6V2H4v1H2v11h12V3zm1 10H3V6h10zM6 9H4V7h2zm3-2H7v2h2zm3 0h-2v2h2zm-6 3H4v2h2zm3 0H7v2h2z" class="cls-1"/></svg>`,
-  };
   const calendarCheckLines16X16 = {
       name: 'calendar_check_lines_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M12 3V2h-2v1H6V2H4v1H2v11h12V3zm1 10H3V6h10z" class="cls-2"/><path d="M5.743 11 4 9.242l.766-.742.97 1.007L8.273 7 9 7.758zM10 8h2v1h-2zM8 10h4v1H8z" class="cls-1"/></svg>`,
   };
+  const calendarClock16X16 = {
+      name: 'calendar_clock_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M14 8.79V3h-2V2h-2v1H6V2H4v1H2v11h7.47c.545.35 1.19.559 1.885.559a3.5 3.5 0 0 0 3.5-3.5c0-.87-.33-1.657-.855-2.269M3 6h10v1.987a3.46 3.46 0 0 0-1.645-.428A3.5 3.5 0 0 0 8.445 13H3zm9.978 7.041a391 391 0 0 1-1.288-1.304.743.743 0 1 1 0-1.338l.908-.908c.081-.081.356-.149.49-.149 0 .09-.06.358-.134.462-.068.095-.791.822-.917.948a.75.75 0 0 1 0 .633l1.386 1.389s.312.327.268.625c-.208 0-.416-.06-.713-.358" class="cls-1"/></svg>`,
+  };
   const calendarDay16X16 = {
       name: 'calendar_day_16_x_16',
-      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M12 3V2h-2v1H6V2H4v1H2v11h12V3zm1 10H3V6h10zM6 9H4V7h2z" class="cls-1"/></svg>`,
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M7 10H4V7h3zm7-7v11H2V3h2V2h2v1h4V2h2v1zm-1 3H3v7h10z" class="cls-1"/></svg>`,
+  };
+  const calendarDayOutline16X16 = {
+      name: 'calendar_day_outline_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M12 3V2h-2v1H6V2H4v1H2v11h12V3zm1 10H3V6h10zM7 7H4v3h3zM6 9H5V8h1z" class="cls-1"/></svg>`,
+  };
+  const calendarDays16X16 = {
+      name: 'calendar_days_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M12 3V2h-2v1H6V2H4v1H2v11h12V3zm1 10H3V6h10zM6 9H4V7h2zm3-2H7v2h2zm3 0h-2v2h2zm-6 3H4v2h2zm3 0H7v2h2z" class="cls-1"/></svg>`,
+  };
+  const calendarLines16X16 = {
+      name: 'calendar_lines_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M12 3V2h-2v1H6V2H4v1H2v11h12V3zm1 10H3V6h10zm-1-5H4V7h8zm0 2H4V9h8zm0 2H4v-1h8z" class="cls-1"/></svg>`,
+  };
+  const calendarRectangle16X16 = {
+      name: 'calendar_rectangle_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M12 3V2h-2v1H6V2H4v1H2v11h12V3zm1 10H3V6h10zm-1-1H4V7h8z" class="cls-1"/></svg>`,
+  };
+  const calendarWeek16X16 = {
+      name: 'calendar_week_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g class="cls-3"><path d="M12 3V2h-2v1H6V2H4v1H2v11h12V3zm1 10H3V6h10zm-1-4H4V7h8z" class="cls-1"/></g></svg>`,
   };
   const chartDiagram16X16 = {
       name: 'chart_diagram_16_x_16',
@@ -21288,6 +21320,8 @@ so this becomes the fallback color for the slot */ ''}
            */
           this.open = false;
           /**
+           * @internal
+           *
            * The collection of currently filtered options.
            */
           this.filteredOptions = [];
@@ -22622,6 +22656,18 @@ so this becomes the fallback color for the slot */ ''}
   }
   registerIcon('icon-arrow-partial-rotate-left', IconArrowPartialRotateLeft);
 
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'arrowRightThin' icon
+   */
+  class IconArrowRightThin extends Icon {
+      constructor() {
+          super(arrowRightThin16X16);
+      }
+  }
+  registerIcon('icon-arrow-right-thin', IconArrowRightThin);
+
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
@@ -22649,14 +22695,38 @@ so this becomes the fallback color for the slot */ ''}
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
-   * The icon component for the 'arrowURotateLeft' icon
+   * The icon component for the 'arrowULeft' icon
+   */
+  class IconArrowULeft extends Icon {
+      constructor() {
+          super(arrowULeft16X16);
+      }
+  }
+  registerIcon('icon-arrow-u-left', IconArrowULeft);
+
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'arrowURight' icon
    */
-  class IconArrowURotateLeft extends Icon {
+  class IconArrowURight extends Icon {
       constructor() {
-          super(arrowURotateLeft16X16);
+          super(arrowURight16X16);
       }
   }
-  registerIcon('icon-arrow-u-rotate-left', IconArrowURotateLeft);
+  registerIcon('icon-arrow-u-right', IconArrowURight);
+
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'arrowUUp' icon
+   */
+  class IconArrowUUp extends Icon {
+      constructor() {
+          super(arrowUUp16X16);
+      }
+  }
+  registerIcon('icon-arrow-u-up', IconArrowUUp);
 
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
@@ -22702,7 +22772,7 @@ so this becomes the fallback color for the slot */ ''}
    */
   class IconArrowUpRightFromSquare extends Icon {
       constructor() {
-          super(arrowUpRightFromSquare);
+          super(arrowUpRightFromSquare16X16);
       }
   }
   registerIcon('icon-arrow-up-right-from-square', IconArrowUpRightFromSquare);
@@ -22843,26 +22913,26 @@ so this becomes the fallback color for the slot */ ''}
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
-   * The icon component for the 'calendar' icon
+   * The icon component for the 'calendarCheckLines' icon
    */
-  class IconCalendar extends Icon {
+  class IconCalendarCheckLines extends Icon {
       constructor() {
-          super(calendar16X16);
+          super(calendarCheckLines16X16);
       }
   }
-  registerIcon('icon-calendar', IconCalendar);
+  registerIcon('icon-calendar-check-lines', IconCalendarCheckLines);
 
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
-   * The icon component for the 'calendarCheckLines' icon
+   * The icon component for the 'calendarClock' icon
    */
-  class IconCalendarCheckLines extends Icon {
+  class IconCalendarClock extends Icon {
       constructor() {
-          super(calendarCheckLines16X16);
+          super(calendarClock16X16);
       }
   }
-  registerIcon('icon-calendar-check-lines', IconCalendarCheckLines);
+  registerIcon('icon-calendar-clock', IconCalendarClock);
 
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
@@ -22876,6 +22946,66 @@ so this becomes the fallback color for the slot */ ''}
   }
   registerIcon('icon-calendar-day', IconCalendarDay);
 
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'calendarDayOutline' icon
+   */
+  class IconCalendarDayOutline extends Icon {
+      constructor() {
+          super(calendarDayOutline16X16);
+      }
+  }
+  registerIcon('icon-calendar-day-outline', IconCalendarDayOutline);
+
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'calendarDays' icon
+   */
+  class IconCalendarDays extends Icon {
+      constructor() {
+          super(calendarDays16X16);
+      }
+  }
+  registerIcon('icon-calendar-days', IconCalendarDays);
+
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'calendarLines' icon
+   */
+  class IconCalendarLines extends Icon {
+      constructor() {
+          super(calendarLines16X16);
+      }
+  }
+  registerIcon('icon-calendar-lines', IconCalendarLines);
+
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'calendarRectangle' icon
+   */
+  class IconCalendarRectangle extends Icon {
+      constructor() {
+          super(calendarRectangle16X16);
+      }
+  }
+  registerIcon('icon-calendar-rectangle', IconCalendarRectangle);
+
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'calendarWeek' icon
+   */
+  class IconCalendarWeek extends Icon {
+      constructor() {
+          super(calendarWeek16X16);
+      }
+  }
+  registerIcon('icon-calendar-week', IconCalendarWeek);
+
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
@@ -64686,12 +64816,6 @@ img.ProseMirror-separator {
       get tabbableChildren() {
           return [];
       }
-      /**
-       * Called if an element inside this cell view has focus, and this row/cell is being recycled.
-       * Expected implementation is to commit changes as needed, and blur the focusable element (or close
-       * the menu/popup/etc).
-       */
-      focusedRecycleCallback() { }
       columnChanged() {
           for (const eventName of this.delegatedEvents) {
               this.removeEventListener(eventName, this.delegatedEventHandler);
@@ -65937,14 +66061,6 @@ focus outline in that case.
           this.menuOpen = event.detail.newState;
           this.emitActionMenuToggleEvent('row-action-menu-toggle', event.detail, column);
       }
-      closeOpenActionMenus() {
-          if (this.menuOpen) {
-              const cellWithMenuOpen = Array.from(this.cellContainer.children).find(c => c instanceof TableCell && c.menuOpen);
-              if (cellWithMenuOpen?.actionMenuButton?.open) {
-                  cellWithMenuOpen.actionMenuButton.toggleButton.control.click();
-              }
-          }
-      }
       /** @internal */
       handleChange(source, args) {
           if (source instanceof ColumnInternals
@@ -67383,7 +67499,6 @@ focus outline in that case.
           };
       }
       handleVirtualizerChange() {
-          this.table.handleFocusedCellRecycling();
           const virtualizer = this.virtualizer;
           this.visibleItems = virtualizer.getVirtualItems();
           this.scrollHeight = virtualizer.getTotalSize();
@@ -68701,9 +68816,10 @@ focus outline in that case.
               }
           }
           if (focusRowAndCell) {
-              // Focusable elements in cells, and action menus, are both blurred on scroll. To maintain our row/cell focus state,
-              // we focus the cell instead here. (We also don't want to refocus the cell content when the focusedRecycleCallback just
-              // blurred it.)
+              // We want open action menus to be closed, and focused interactive cell content blurred, on scroll. We also don't want to
+              // refocus the interactive cell content after the scroll, as the element no longer represents the same table data at that
+              // point. So in both those cases, we focus the cell here. This also lets us maintain what row/ cell the user had focused
+              // previously.
               if (this.focusType === TableFocusType.cellActionMenu
                   || this.focusType === TableFocusType.cellContent) {
                   this.setCellFocusState(this.columnIndex, this.rowIndex, false);
@@ -68730,11 +68846,6 @@ focus outline in that case.
               }
           }
       }
-      handleFocusedCellRecycling(hadRowOrCellFocus) {
-          if (hadRowOrCellFocus && !this.focusWithinTable) {
-              this.focusCurrentRow(false);
-          }
-      }
       onRowFocusIn(event) {
           if (this.isCurrentlyFocusingElement) {
               return;
@@ -69907,29 +70018,6 @@ focus outline in that case.
           }
           return tanStackUpdates;
       }
-      /** @internal */
-      handleFocusedCellRecycling() {
-          const hadActiveRowOrCellFocus = this.keyboardNavigationManager.hasActiveRowOrCellFocus;
-          let tableFocusedElement = this.shadowRoot.activeElement;
-          while (tableFocusedElement !== null
-              && !(tableFocusedElement instanceof TableCellView)) {
-              if (tableFocusedElement.shadowRoot) {
-                  tableFocusedElement = tableFocusedElement.shadowRoot.activeElement;
-              }
-              else {
-                  break;
-              }
-          }
-          if (tableFocusedElement instanceof TableCellView) {
-              tableFocusedElement.focusedRecycleCallback();
-          }
-          if (this.openActionMenuRecordId !== undefined) {
-              const activeRow = this.rowElements.find(row => row instanceof TableRow
-                  && row.recordId === this.openActionMenuRecordId);
-              activeRow?.closeOpenActionMenus();
-          }
-          this.keyboardNavigationManager.handleFocusedCellRecycling(hadActiveRowOrCellFocus);
-      }
       selectionModeChanged(_prev, _next) {
           if (!this.$fastController.isConnected) {
               return;
@@ -70584,9 +70672,6 @@ focus outline in that case.
       get showAnchor() {
           return typeof this.cellRecord?.href === 'string';
       }
-      focusedRecycleCallback() {
-          this.anchor?.blur();
-      }
       get tabbableChildren() {
           if (this.showAnchor) {
               return [this.anchor];