@ni/nimble-components 20.16.0 → 20.16.2

package/dist/all-components-bundle.js

@@ -16274,7 +16274,7 @@
 
   /**
    * Do not edit directly
-   * Generated on Mon, 11 Dec 2023 17:20:37 GMT
+   * Generated on Wed, 13 Dec 2023 13:12:27 GMT
    */
 
   const Information100DarkUi = "#a46eff";
@@ -17009,6 +17009,10 @@
         font: ${linkFont};
     }
 
+    .top-container {
+        display: contents;
+    }
+
     [part='start'] {
         display: none;
     }
@@ -17084,7 +17088,13 @@
 `;
 
   // prettier-ignore
-  const template$C = (_context, definition) => html `<a
+  const template$C = (_context, definition) => html `${
+/* top-container div is necessary because setting contenteditable directly on the native anchor instead
+   leaves it focusable, unlike the behavior you get when the anchor is _within_ a contenteditable element.
+*/ ''}<div
+        class="top-container"
+        contenteditable="${x => x.contentEditable}"
+    ><a
         class="control"
         part="control"
         download="${x => x.download}"
@@ -17148,7 +17158,7 @@
             @slotchange="${x => x.handleEndContentChange()}">
             ${definition.end || ''}
         </slot
-    ></span></a>`;
+    ></span></a></div>`;
 
   /**
    * A nimble-styled anchor
@@ -17170,6 +17180,9 @@
   __decorate$1([
       attr
   ], Anchor.prototype, "appearance", void 0);
+  __decorate$1([
+      attr({ attribute: 'contenteditable' })
+  ], Anchor.prototype, "contentEditable", void 0);
   // FoundationAnchor already applies the StartEnd mixin, so we don't need to do it here.
   const nimbleAnchor = Anchor.compose({
       baseName: 'anchor',
@@ -76578,31 +76591,23 @@ img.ProseMirror-separator {
       }
       updateDiesRenderInfo() {
           this.d3ColorScale = this.createD3ColorScale(this.wafermap.colorScale, this.wafermap.colorScaleMode);
+          this._diesRenderInfo = this.wafermap.dies
+              .map(die => this.computeDieRenderInfo(die))
+              .filter(info => info !== null);
+      }
+      computeDieRenderInfo(die) {
           const margin = this.dataManager.margin;
-          const horizontalScale = this.dataManager.horizontalScale;
-          const verticalScale = this.dataManager.verticalScale;
-          const colorScaleMode = this.wafermap.colorScaleMode;
-          const highlightedValues = this.wafermap.highlightedValues;
-          const maxCharacters = this.wafermap.maxCharacters;
-          const dieLabelsHidden = this.wafermap.dieLabelsHidden;
-          const dieLabelsSuffix = this.wafermap.dieLabelsSuffix;
-          this._diesRenderInfo = [];
-          for (const die of this.wafermap.dies) {
-              const scaledX = horizontalScale(die.x);
-              if (scaledX === undefined) {
-                  continue;
-              }
-              const scaledY = verticalScale(die.y);
-              if (scaledY === undefined) {
-                  continue;
-              }
-              this._diesRenderInfo.push({
-                  x: scaledX + margin.right,
-                  y: scaledY + margin.top,
-                  fillStyle: this.calculateFillStyle(die.value, colorScaleMode, highlightedValues),
-                  text: this.buildLabel(die.value, maxCharacters, dieLabelsHidden, dieLabelsSuffix)
-              });
+          const scaledX = this.dataManager.horizontalScale(die.x);
+          const scaledY = this.dataManager.verticalScale(die.y);
+          if (scaledX === undefined || scaledY === undefined) {
+              return null;
           }
+          return {
+              x: scaledX + margin.right,
+              y: scaledY + margin.top,
+              fillStyle: this.calculateFillStyle(die.value, this.wafermap.colorScaleMode, this.wafermap.highlightedTags, die.tags),
+              text: this.buildLabel(die.value, this.wafermap.maxCharacters, this.wafermap.dieLabelsHidden, this.wafermap.dieLabelsSuffix)
+          };
       }
       calculateLabelsFontSize(dieDimensions, maxCharacters) {
           return Math.min(dieDimensions.height, (dieDimensions.width / (Math.max(2, maxCharacters) * 0.5))
@@ -76631,11 +76636,15 @@ img.ProseMirror-separator {
           }
           return label;
       }
-      calculateOpacity(selectedValue, highlightedValues) {
-          return highlightedValues.length > 0
-              && !highlightedValues.some(dieValue => dieValue === selectedValue)
-              ? this.nonHighlightedOpacity
-              : 1;
+      calculateOpacity(dieTags, highlightedTags) {
+          if (!highlightedTags || highlightedTags.length === 0) {
+              return 1;
+          }
+          const highlightedSet = new Set(highlightedTags);
+          if (dieTags?.some(dieTag => highlightedSet.has(dieTag))) {
+              return 1;
+          }
+          return this.nonHighlightedOpacity;
       }
       isColorScaleLinear(colorScaleMode) {
           return colorScaleMode === WaferMapColorScaleMode.linear;
@@ -76643,7 +76652,7 @@ img.ProseMirror-separator {
       isColorScaleOrdinal(colorScaleMode) {
           return colorScaleMode === WaferMapColorScaleMode.ordinal;
       }
-      calculateFillStyle(value, colorScaleMode, highlightedValues) {
+      calculateFillStyle(value, colorScaleMode, highlightedTags, dieTags) {
           let colorValue = this.emptyDieColor;
           if (this.dieHasData(value)) {
               if (isNaN(+value)) {
@@ -76663,7 +76672,7 @@ img.ProseMirror-separator {
           if (rgbColor === null) {
               return this.emptyDieColor;
           }
-          rgbColor = new ColorRGBA64(rgbColor.r, rgbColor.g, rgbColor.b, this.calculateOpacity(value, highlightedValues));
+          rgbColor = new ColorRGBA64(rgbColor.r, rgbColor.g, rgbColor.b, this.calculateOpacity(dieTags, highlightedTags));
           return rgbColor.toStringWebRGBA();
       }
   }
@@ -76999,6 +77008,7 @@ img.ProseMirror-separator {
   }
 
   const trackedItems = [
+      'highlightedTags',
       'canvasWidth',
       'canvasHeight',
       'originLocation',
@@ -77010,7 +77020,6 @@ img.ProseMirror-separator {
       'maxCharacters',
       'colorScale',
       'colorScaleMode',
-      'highlightedValues',
       'dieLabelsHidden',
       'dieLabelsSuffix',
       'transform',
@@ -77027,7 +77036,8 @@ img.ProseMirror-separator {
           this.updateQueued = false;
       }
       get requiresEventsUpdate() {
-          return (this.isTracked('canvasWidth')
+          return (this.isTracked('highlightedTags')
+              || this.isTracked('canvasWidth')
               || this.isTracked('canvasHeight')
               || this.isTracked('originLocation')
               || this.isTracked('gridMinX')
@@ -77038,7 +77048,6 @@ img.ProseMirror-separator {
               || this.isTracked('maxCharacters')
               || this.isTracked('colorScale')
               || this.isTracked('colorScaleMode')
-              || this.isTracked('highlightedValues')
               || this.isTracked('dieLabelsHidden')
               || this.isTracked('dieLabelsSuffix')
               || this.isTracked('transform'));
@@ -77058,9 +77067,9 @@ img.ProseMirror-separator {
           return this.isTracked('maxCharacters');
       }
       get requiresDiesRenderInfoUpdate() {
-          return (this.isTracked('colorScale')
+          return (this.isTracked('highlightedTags')
+              || this.isTracked('colorScale')
               || this.isTracked('colorScaleMode')
-              || this.isTracked('highlightedValues')
               || this.isTracked('dieLabelsHidden')
               || this.isTracked('dieLabelsSuffix'));
       }
@@ -77179,7 +77188,7 @@ img.ProseMirror-separator {
            * @internal
            */
           this.hoverHeight = 0;
-          this.highlightedValues = [];
+          this.highlightedTags = [];
           this.dies = [];
           this.colorScale = {
               colors: [],
@@ -77293,8 +77302,8 @@ img.ProseMirror-separator {
           this.waferMapUpdateTracker.track('colorScaleMode');
           this.waferMapUpdateTracker.queueUpdate();
       }
-      highlightedValuesChanged() {
-          this.waferMapUpdateTracker.track('highlightedValues');
+      highlightedTagsChanged() {
+          this.waferMapUpdateTracker.track('highlightedTags');
           this.waferMapUpdateTracker.queueUpdate();
       }
       diesChanged() {
@@ -77379,7 +77388,7 @@ img.ProseMirror-separator {
   ], WaferMap.prototype, "hoverDie", void 0);
   __decorate$1([
       observable
-  ], WaferMap.prototype, "highlightedValues", void 0);
+  ], WaferMap.prototype, "highlightedTags", void 0);
   __decorate$1([
       observable
   ], WaferMap.prototype, "dies", void 0);