@ni/nimble-components 20.5.5 → 20.6.1

package/dist/all-components-bundle.js

@@ -16288,7 +16288,7 @@
 
   /**
    * Do not edit directly
-   * Generated on Thu, 28 Sep 2023 03:20:14 GMT
+   * Generated on Tue, 03 Oct 2023 14:12:03 GMT
    */
 
   const Information100DarkUi = "#a46eff";
@@ -19482,11 +19482,12 @@
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path class="cls-1" d="M8.033 14.026 4.9 10.866 6.277 9.53l1.744 1.81 4.562-4.507 1.307 1.363Zm1.155-10.68-1.321-1.32-2.312 2.311-2.311-2.311-1.321 1.32 2.311 2.312L1.923 7.97l1.32 1.32 2.312-2.31 2.312 2.31 1.32-1.32-2.31-2.312Z"/></svg>`
   };
 
-  const template$t = html `
-    <template>
-        <div class="icon" :innerHTML=${x => x.icon.data}></div>
-    </template
-`;
+  // Avoiding any whitespace in the template because this is an inline element
+  const template$t = html `<div
+    class="icon"
+    aria-hidden="true"
+    :innerHTML=${x => x.icon.data}
+></div>`;
 
   const styles$I = css `
     ${display('inline-flex')}
@@ -19534,30 +19535,10 @@
           super();
           this.icon = icon;
       }
-      connectedCallback() {
-          super.connectedCallback();
-          this.forwardAriaLabelToSvg();
-      }
-      ariaLabelChanged() {
-          this.forwardAriaLabelToSvg();
-      }
-      forwardAriaLabelToSvg() {
-          const svg = this.shadowRoot?.querySelector('svg');
-          if (!svg) {
-              return;
-          }
-          if (this.ariaLabel !== null && this.ariaLabel !== undefined) {
-              svg.setAttribute('aria-label', this.ariaLabel);
-          }
-          else {
-              svg.removeAttribute('aria-label');
-          }
-      }
   }
   __decorate$1([
       attr
   ], Icon.prototype, "severity", void 0);
-  applyMixins(Icon, ARIAGlobalStatesAndProperties);
   const registerIcon = (baseName, iconClass) => {
       const composedIcon = iconClass.compose({
           baseName,
@@ -19634,7 +19615,10 @@
   const coreLabelDefaults = {
       popupDismissLabel: 'Close',
       numericIncrementLabel: 'Increment',
-      numericDecrementLabel: 'Decrement'
+      numericDecrementLabel: 'Decrement',
+      errorIconLabel: 'Error',
+      warningIconLabel: 'Warning',
+      informationIconLabel: 'Information'
   };
 
   const popupDismissLabel = DesignToken.create({
@@ -19649,6 +19633,18 @@
       name: 'numeric-increment-label',
       cssCustomPropertyName: null
   }).withDefault(coreLabelDefaults.numericIncrementLabel);
+  const errorIconLabel = DesignToken.create({
+      name: 'error-icon-label',
+      cssCustomPropertyName: null
+  }).withDefault(coreLabelDefaults.errorIconLabel);
+  const warningIconLabel = DesignToken.create({
+      name: 'warning-icon-label',
+      cssCustomPropertyName: null
+  }).withDefault(coreLabelDefaults.warningIconLabel);
+  const informationIconLabel = DesignToken.create({
+      name: 'information-icon-label',
+      cssCustomPropertyName: null
+  }).withDefault(coreLabelDefaults.informationIconLabel);
 
   // prettier-ignore
   const template$s = html `
@@ -19677,13 +19673,13 @@
     >
         <div class="icon">
             ${when(x => x.severity === BannerSeverity.error, html `
-                <${iconExclamationMarkTag}></${iconExclamationMarkTag}>
+                <${iconExclamationMarkTag} role="img" aria-label="${x => errorIconLabel.getValueFor(x)}"></${iconExclamationMarkTag}>
             `)}
             ${when(x => x.severity === BannerSeverity.warning, html `
-                <${iconTriangleFilledTag}></${iconTriangleFilledTag}>
+                <${iconTriangleFilledTag} role="img" aria-label="${x => warningIconLabel.getValueFor(x)}"></${iconTriangleFilledTag}>
             `)}
             ${when(x => x.severity === BannerSeverity.information, html `
-                <${iconInfoTag}></${iconInfoTag}>
+                <${iconInfoTag} role="img" aria-label="${x => informationIconLabel.getValueFor(x)}"></${iconInfoTag}>
             `)}
         </div>
         <div class="text">
@@ -23675,7 +23671,10 @@
   const supportedLabels$1 = {
       popupDismiss: popupDismissLabel,
       numericDecrement: numericDecrementLabel,
-      numericIncrement: numericIncrementLabel
+      numericIncrement: numericIncrementLabel,
+      errorIcon: errorIconLabel,
+      warningIcon: warningIconLabel,
+      informationIcon: informationIconLabel
   };
   /**
    * Core label provider for Nimble
@@ -23695,6 +23694,15 @@
   __decorate$1([
       attr({ attribute: 'numeric-increment' })
   ], LabelProviderCore.prototype, "numericIncrement", void 0);
+  __decorate$1([
+      attr({ attribute: 'error-icon' })
+  ], LabelProviderCore.prototype, "errorIcon", void 0);
+  __decorate$1([
+      attr({ attribute: 'warning-icon' })
+  ], LabelProviderCore.prototype, "warningIcon", void 0);
+  __decorate$1([
+      attr({ attribute: 'information-icon' })
+  ], LabelProviderCore.prototype, "informationIcon", void 0);
   const nimbleLabelProviderCore = LabelProviderCore.compose({
       baseName: 'label-provider-core'
   });
@@ -64032,6 +64040,7 @@ img.ProseMirror-separator {
             <${iconTwoSquaresInBracketsTag}
                 class="grouped-indicator"
                 title="${x => tableColumnHeaderGroupedLabel.getValueFor(x)}"
+                role="img"
                 aria-label="${x => tableColumnHeaderGroupedLabel.getValueFor(x)}"
             ></${iconTwoSquaresInBracketsTag}>
         `)}
@@ -65942,18 +65951,19 @@ img.ProseMirror-separator {
           }
       }
       resetGridSizedColumns() {
-          if (!this.gridSizedColumns) {
+          if (!this.gridSizedColumns || this.gridSizedColumns.length === 0) {
               return;
           }
+          const gridSizeColumnTotal = this.gridSizedColumns.reduce((sum, col) => sum + col.columnInternals.currentPixelWidth, 0);
+          const gridSizeColumnAverage = gridSizeColumnTotal / this.gridSizedColumns.length;
           let gridColumnIndex = 0;
           for (let i = 0; i < this.visibleColumns.length
               && gridColumnIndex < this.gridSizedColumns.length; i++) {
               const column = this.visibleColumns[i];
               if (column === this.gridSizedColumns[gridColumnIndex]) {
                   gridColumnIndex += 1;
-                  column.columnInternals.currentFractionalWidth = (column.columnInternals.currentPixelWidth
-                      / this.initialColumnWidths[i].initialPixelWidth)
-                      * this.initialColumnWidths[i].initalColumnFractionalWidth;
+                  column.columnInternals.currentFractionalWidth = column.columnInternals.currentPixelWidth
+                      / gridSizeColumnAverage;
                   column.columnInternals.currentPixelWidth = undefined;
               }
           }
@@ -68728,6 +68738,7 @@ img.ProseMirror-separator {
   const createIconTemplate = (icon) => html `
     <${icon}
         title="${x => x.text}"
+        role="img"
         aria-label="${x => x.text}"
         severity="${x => x.severity}"
         class="no-shrink"