@ni/nimble-components 24.0.0 → 24.1.0

package/dist/all-components-bundle.js

@@ -16301,7 +16301,7 @@
 
   /**
    * Do not edit directly
-   * Generated on Tue, 26 Mar 2024 20:29:30 GMT
+   * Generated on Wed, 27 Mar 2024 18:37:38 GMT
    */
 
   const Information100DarkUi = "#a46eff";
@@ -67023,6 +67023,21 @@ img.ProseMirror-separator {
       return GroupableColumn;
   }
 
+  // As the returned class is internal to the function, we can't write a signature that uses it directly, so rely on inference
+  // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types, @typescript-eslint/explicit-function-return-type
+  function mixinColumnWithPlaceholderAPI(base) {
+      /**
+       * The Mixin that provides a concrete column with the API to allow grouping
+       * by the values in that column.
+       */
+      class ColumnWithPlaceholder extends base {
+      }
+      attr({ attribute: 'placeholder' })(
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+      ColumnWithPlaceholder.prototype, 'placeholder');
+      return ColumnWithPlaceholder;
+  }
+
   const styles$c = css `
     :host {
         width: fit-content;
@@ -67044,6 +67059,11 @@ img.ProseMirror-separator {
         overflow: hidden;
         text-overflow: ellipsis;
     }
+
+    :host(.placeholder) span {
+        font: ${placeholderFont};
+        color: ${placeholderFontColor};
+    }
 `;
 
   /* eslint-disable @typescript-eslint/indent */
@@ -67056,6 +67076,7 @@ img.ProseMirror-separator {
     }
     return true;
 }}"
+        class="${x => (x.isPlaceholder ? 'placeholder' : '')}"
     >
         ${when(x => typeof x.cellRecord?.href === 'string', html `
             <${anchorTag}
@@ -67093,8 +67114,17 @@ img.ProseMirror-separator {
           super(...arguments);
           /** @internal */
           this.hasOverflow = false;
+          /** @internal */
+          this.isPlaceholder = false;
       }
       get text() {
+          const displayedText = this.cellRecord?.label ?? this.cellRecord?.href;
+          if ((displayedText === undefined || displayedText === null)
+              && this.columnConfig?.placeholder) {
+              this.isPlaceholder = true;
+              return this.columnConfig.placeholder;
+          }
+          this.isPlaceholder = false;
           if (typeof this.cellRecord?.label === 'string') {
               return this.cellRecord.label;
           }
@@ -67110,6 +67140,9 @@ img.ProseMirror-separator {
   __decorate$1([
       observable
   ], TableColumnAnchorCellView.prototype, "hasOverflow", void 0);
+  __decorate$1([
+      observable
+  ], TableColumnAnchorCellView.prototype, "isPlaceholder", void 0);
   __decorate$1([
       volatile
   ], TableColumnAnchorCellView.prototype, "text", null);
@@ -67235,11 +67268,14 @@ img.ProseMirror-separator {
   /**
    * A table column for displaying links.
    */
-  class TableColumnAnchor extends mixinGroupableColumnAPI(mixinFractionalWidthColumnAPI((TableColumn))) {
+  class TableColumnAnchor extends mixinGroupableColumnAPI(mixinFractionalWidthColumnAPI(mixinColumnWithPlaceholderAPI((TableColumn)))) {
       constructor() {
           super(...arguments);
           this.underlineHidden = false;
       }
+      placeholderChanged() {
+          this.updateColumnConfig();
+      }
       getColumnInternalsOptions() {
           return {
               cellRecordFieldNames: ['label', 'href'],
@@ -67299,7 +67335,8 @@ img.ProseMirror-separator {
               rel: this.rel,
               target: this.target,
               type: this.type,
-              download: this.download
+              download: this.download,
+              placeholder: this.placeholder
           };
       }
   }
@@ -67348,7 +67385,7 @@ img.ProseMirror-separator {
   /**
    * The base class for table columns that display fields of any type as text.
    */
-  class TableColumnTextBase extends mixinGroupableColumnAPI(mixinFractionalWidthColumnAPI(TableColumn)) {
+  class TableColumnTextBase extends mixinGroupableColumnAPI(mixinFractionalWidthColumnAPI(mixinColumnWithPlaceholderAPI(TableColumn))) {
       fieldNameChanged() {
           this.columnInternals.dataRecordFieldNames = [this.fieldName];
           this.columnInternals.operandDataRecordFieldName = this.fieldName;
@@ -67403,11 +67440,13 @@ img.ProseMirror-separator {
       right: 'right'
   };
 
+  // prettier-ignore
   const template$a = html `
     <template
-        class="${x => (x.alignment === TextCellViewBaseAlignment.right
-    ? 'right-align'
-    : '')}"
+        class="
+            ${x => (x.alignment === TextCellViewBaseAlignment.right ? 'right-align' : '')}
+            ${x => (x.isPlaceholder ? 'placeholder' : '')}
+        "
     >
         <span
             ${overflow('hasOverflow')}
@@ -67430,6 +67469,11 @@ img.ProseMirror-separator {
         overflow: hidden;
         text-overflow: ellipsis;
     }
+
+    :host(.placeholder) span {
+        font: ${placeholderFont};
+        color: ${placeholderFontColor};
+    }
 `;
 
   /**
@@ -67448,6 +67492,37 @@ img.ProseMirror-separator {
            * The alignment of the text within the cell.
            */
           this.alignment = TextCellViewBaseAlignment.left;
+          /**
+           * Whether or not the text being displayed in the cell view is a placeholder.
+           */
+          this.isPlaceholder = false;
+      }
+      columnConfigChanged() {
+          if (!this.applyPlaceholderTextIfNeeded()) {
+              this.updateText();
+          }
+      }
+      cellRecordChanged() {
+          if (!this.applyPlaceholderTextIfNeeded()) {
+              this.updateText();
+          }
+      }
+      /**
+       * Sets `this.text` to the appropriate placeholder if `cellValue` warrants it.
+       * @returns `true` if `this.text` was set to a placeholder, `false` otherwise.
+       */
+      applyPlaceholderTextIfNeeded() {
+          const cellValue = this.cellRecord?.value;
+          const placeholder = this.columnConfig?.placeholder;
+          if (typeof placeholder === 'string'
+              && (cellValue === null || cellValue === undefined)) {
+              this.text = placeholder;
+              this.isPlaceholder = true;
+          }
+          else {
+              this.isPlaceholder = false;
+          }
+          return this.isPlaceholder;
       }
   }
   __decorate$1([
@@ -67459,17 +67534,14 @@ img.ProseMirror-separator {
   __decorate$1([
       observable
   ], TableColumnTextCellViewBase.prototype, "alignment", void 0);
+  __decorate$1([
+      observable
+  ], TableColumnTextCellViewBase.prototype, "isPlaceholder", void 0);
 
   /**
    * A cell view for displaying date/time fields as text
    */
   class TableColumnDateTextCellView extends TableColumnTextCellViewBase {
-      columnConfigChanged() {
-          this.updateText();
-      }
-      cellRecordChanged() {
-          this.updateText();
-      }
       updateText() {
           if (this.columnConfig) {
               this.text = formatNumericDate(this.columnConfig.formatter, this.cellRecord?.value);
@@ -67594,6 +67666,9 @@ img.ProseMirror-separator {
       get validity() {
           return this.validator.getValidity();
       }
+      placeholderChanged() {
+          this.updateColumnConfig();
+      }
       getColumnInternalsOptions() {
           return {
               cellRecordFieldNames: ['value'],
@@ -67667,7 +67742,8 @@ img.ProseMirror-separator {
           const formatter = this.createFormatter();
           if (formatter) {
               const columnConfig = {
-                  formatter
+                  formatter,
+                  placeholder: this.placeholder
               };
               this.columnInternals.columnConfig = columnConfig;
               this.validator.setCustomOptionsValidity(true);
@@ -67796,12 +67872,6 @@ img.ProseMirror-separator {
    * A cell view for displaying duration fields as text
    */
   class TableColumnDurationTextCellView extends TableColumnTextCellViewBase {
-      columnConfigChanged() {
-          this.updateText();
-      }
-      cellRecordChanged() {
-          this.updateText();
-      }
       updateText() {
           this.text = this.columnConfig?.formatter.format(this.cellRecord?.value) ?? '';
       }
@@ -67939,6 +68009,9 @@ img.ProseMirror-separator {
           super.disconnectedCallback();
           lang.unsubscribe(this.langSubscriber, this);
       }
+      placeholderChanged() {
+          this.updateColumnConfig();
+      }
       getColumnInternalsOptions() {
           return {
               cellRecordFieldNames: ['value'],
@@ -67950,15 +68023,11 @@ img.ProseMirror-separator {
       }
       updateColumnConfig() {
           const formatter = new DurationFormatter(lang.getValueFor(this));
-          if (formatter) {
-              const columnConfig = {
-                  formatter
-              };
-              this.columnInternals.columnConfig = columnConfig;
-          }
-          else {
-              this.columnInternals.columnConfig = undefined;
-          }
+          const columnConfig = {
+              formatter,
+              placeholder: this.placeholder
+          };
+          this.columnInternals.columnConfig = columnConfig;
       }
   }
   const nimbleTableColumnDurationText = TableColumnDurationText.compose({
@@ -68175,12 +68244,6 @@ img.ProseMirror-separator {
    * A cell view for displaying mapped text
    */
   class TableColumnEnumTextCellView extends TableColumnTextCellViewBase {
-      columnConfigChanged() {
-          this.updateText();
-      }
-      cellRecordChanged() {
-          this.updateText();
-      }
       updateText() {
           const value = this.cellRecord?.value;
           if (value === undefined || value === null) {
@@ -68299,12 +68362,9 @@ img.ProseMirror-separator {
    */
   class TableColumnNumberTextCellView extends TableColumnTextCellViewBase {
       columnConfigChanged() {
-          this.updateText();
+          super.columnConfigChanged();
           this.alignment = this.columnConfig?.alignment ?? TextCellViewBaseAlignment.left;
       }
-      cellRecordChanged() {
-          this.updateText();
-      }
       updateText() {
           this.text = this.columnConfig?.formatter?.format(this.cellRecord?.value) ?? '';
       }
@@ -68739,6 +68799,9 @@ img.ProseMirror-separator {
       get validity() {
           return this.validator.getValidity();
       }
+      placeholderChanged() {
+          this.updateColumnConfig();
+      }
       getColumnInternalsOptions() {
           return {
               cellRecordFieldNames: ['value'],
@@ -68793,7 +68856,8 @@ img.ProseMirror-separator {
           if (this.validator.isValid()) {
               const columnConfig = {
                   formatter: this.createFormatter(),
-                  alignment: this.determineCellContentAlignment()
+                  alignment: this.determineCellContentAlignment(),
+                  placeholder: this.placeholder
               };
               this.columnInternals.columnConfig = columnConfig;
           }
@@ -69145,7 +69209,7 @@ img.ProseMirror-separator {
    * A cell view for displaying string fields as text
    */
   class TableColumnTextCellView extends TableColumnTextCellViewBase {
-      cellRecordChanged() {
+      updateText() {
           this.text = typeof this.cellRecord?.value === 'string'
               ? this.cellRecord.value
               : '';
@@ -69163,6 +69227,11 @@ img.ProseMirror-separator {
    * The table column for displaying string fields as text.
    */
   class TableColumnText extends TableColumnTextBase {
+      placeholderChanged() {
+          this.columnInternals.columnConfig = {
+              placeholder: this.placeholder
+          };
+      }
       getColumnInternalsOptions() {
           return {
               cellRecordFieldNames: ['value'],
@@ -75088,7 +75157,7 @@ img.ProseMirror-separator {
   /**
    * Computations calculates and stores different measures which are used in the Wafermap
    */
-  class Computations {
+  let Computations$1 = class Computations {
       get containerDimensions() {
           return this._containerDimensions;
       }
@@ -75265,7 +75334,7 @@ img.ProseMirror-separator {
               left: baseMargin.left + addedMargin.left
           };
       }
-  }
+  };
 
   /**
    * Prerendering prepares render-ready dies data to be used by the rendering module
@@ -75331,7 +75400,7 @@ img.ProseMirror-separator {
               return '';
           }
           const label = `${value}${dieLabelsSuffix}`;
-          if (label.length > maxCharacters) {
+          if (label.length >= maxCharacters) {
               return `${label.substring(0, maxCharacters)}…`;
           }
           return label;
@@ -75380,7 +75449,7 @@ img.ProseMirror-separator {
   /**
    * Data Manager uses Computations and Prerendering modules in order and exposes the results
    */
-  class DataManager {
+  let DataManager$1 = class DataManager {
       get containerDimensions() {
           return this.computations.containerDimensions;
       }
@@ -75414,6 +75483,219 @@ img.ProseMirror-separator {
       get data() {
           return this.dataMap;
       }
+      constructor(wafermap) {
+          this.wafermap = wafermap;
+          this.computations = new Computations$1(wafermap);
+          this.prerendering = new Prerendering(wafermap);
+      }
+      updateContainerDimensions() {
+          this.computations.updateContainerDimensions();
+          this.updateDataMap();
+          this.updateLabelsFontSize();
+      }
+      updateScales() {
+          this.computations.updateScales();
+          this.updateDataMap();
+          this.updateLabelsFontSize();
+      }
+      updateLabelsFontSize() {
+          this.prerendering.updateLabelsFontSize();
+      }
+      updateDiesRenderInfo() {
+          this.prerendering.updateDiesRenderInfo();
+      }
+      getWaferMapDie(point) {
+          return this.dataMap.get(`${point.x}_${point.y}`);
+      }
+      updateDataMap() {
+          this.dataMap = new Map(this.wafermap.dies.map(die => [`${die.x}_${die.y}`, die]));
+      }
+  };
+
+  /**
+   * Computations calculates and stores different measures which are used in the Wafermap
+   */
+  class Computations {
+      get containerDimensions() {
+          return this._containerDimensions;
+      }
+      get dieDimensions() {
+          return this._dieDimensions;
+      }
+      get margin() {
+          return this._margin;
+      }
+      get horizontalScale() {
+          return this._horizontalScale;
+      }
+      get verticalScale() {
+          return this._verticalScale;
+      }
+      constructor(wafermap) {
+          this.wafermap = wafermap;
+          this.defaultPadding = 0;
+          this.baseMarginPercentage = 0.04;
+      }
+      updateContainerDimensions() {
+          const canvasDimensions = {
+              width: this.wafermap.canvasWidth,
+              height: this.wafermap.canvasHeight
+          };
+          const canvasDiameter = Math.min(canvasDimensions.width, canvasDimensions.height);
+          const canvasMargin = {
+              top: (canvasDimensions.height - canvasDiameter) / 2,
+              right: (canvasDimensions.width - canvasDiameter) / 2,
+              bottom: (canvasDimensions.height - canvasDiameter) / 2,
+              left: (canvasDimensions.width - canvasDiameter) / 2
+          };
+          const baseMargin = {
+              top: canvasDiameter * this.baseMarginPercentage,
+              right: canvasDiameter * this.baseMarginPercentage,
+              bottom: canvasDiameter * this.baseMarginPercentage,
+              left: canvasDiameter * this.baseMarginPercentage
+          };
+          this._margin = this.calculateMarginAddition(baseMargin, canvasMargin);
+          this._containerDimensions = this.calculateContainerDimensions(canvasDimensions, this._margin);
+          this.updateScales();
+      }
+      updateScales() {
+          const containerDiameter = Math.min(this._containerDimensions.width, this._containerDimensions.height);
+          const gridDimensions = this.gridDimensionsValidAndDefined()
+              ? this.calculateGridDimensionsFromBoundingBox()
+              : this.calculateGridDimensionsFromDies();
+          // this scale is used for positioning the dies on the canvas
+          const originLocation = this.wafermap.originLocation;
+          this._horizontalScale = this.createHorizontalScale(originLocation, gridDimensions, containerDiameter);
+          // this scale is used for positioning the dies on the canvas
+          this._verticalScale = this.createVerticalScale(originLocation, gridDimensions, containerDiameter);
+          this._dieDimensions = {
+              width: Math.abs(this._horizontalScale(0) - this._horizontalScale(1)),
+              height: Math.abs(this._verticalScale(0) - this._verticalScale(1))
+          };
+      }
+      gridDimensionsValidAndDefined() {
+          return (!this.wafermap.validity.invalidGridDimensions
+              && typeof this.wafermap.gridMinX === 'number'
+              && typeof this.wafermap.gridMinY === 'number'
+              && typeof this.wafermap.gridMaxX === 'number'
+              && typeof this.wafermap.gridMinX === 'number');
+      }
+      calculateGridDimensionsFromBoundingBox() {
+          const gridDimensions = { origin: { x: 0, y: 0 }, rows: 0, cols: 0 };
+          if (typeof this.wafermap.gridMaxY === 'number'
+              && typeof this.wafermap.gridMinY === 'number'
+              && typeof this.wafermap.gridMaxX === 'number'
+              && typeof this.wafermap.gridMinX === 'number') {
+              gridDimensions.origin.x = this.wafermap.gridMinX;
+              gridDimensions.origin.y = this.wafermap.gridMinY;
+              gridDimensions.rows = this.wafermap.gridMaxY - this.wafermap.gridMinY + 1;
+              gridDimensions.cols = this.wafermap.gridMaxX - this.wafermap.gridMinX + 1;
+          }
+          return gridDimensions;
+      }
+      calculateGridDimensionsFromDies() {
+          if (this.wafermap.diesTable === undefined) {
+              return { origin: { x: 0, y: 0 }, rows: 0, cols: 0 };
+          }
+          const colIndex = this.wafermap.diesTable
+              .getChild('colIndex')
+              .toArray();
+          const rowIndex = this.wafermap.diesTable
+              .getChild('rowIndex')
+              .toArray();
+          const minPoint = { x: colIndex[0], y: rowIndex[0] };
+          const maxPoint = { x: colIndex[0], y: rowIndex[0] };
+          // will replace iterating with arquero after fixing issues: https://github.com/uwdata/arquero/pull/346
+          for (let i = 0; i < colIndex.length; i++) {
+              if (colIndex[i] < minPoint.x) {
+                  minPoint.x = colIndex[i];
+              }
+              if (colIndex[i] > maxPoint.x) {
+                  maxPoint.x = colIndex[i];
+              }
+              if (rowIndex[i] < minPoint.y) {
+                  minPoint.y = rowIndex[i];
+              }
+              if (rowIndex[i] > maxPoint.y) {
+                  maxPoint.y = rowIndex[i];
+              }
+          }
+          return {
+              origin: minPoint,
+              rows: maxPoint.y - minPoint.y + 1,
+              cols: maxPoint.x - minPoint.x + 1
+          };
+      }
+      calculateContainerDimensions(canvasDimensions, margin) {
+          return {
+              width: canvasDimensions.width - margin.left - margin.right,
+              height: canvasDimensions.height - margin.top - margin.bottom
+          };
+      }
+      createHorizontalScale(originLocation, grid, containerWidth) {
+          const scale = linear();
+          if (originLocation === WaferMapOriginLocation.bottomLeft
+              || originLocation === WaferMapOriginLocation.topLeft) {
+              return scale
+                  .domain([grid.origin.x, grid.origin.x + grid.cols])
+                  .range([0, containerWidth]);
+          }
+          return scale
+              .domain([grid.origin.x - 1, grid.origin.x + grid.cols - 1])
+              .range([containerWidth, 0]);
+      }
+      createVerticalScale(originLocation, grid, containerHeight) {
+          const scale = linear();
+          // html canvas has top-left origin https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes#the_grid
+          // we need to flip the vertical scale
+          if (originLocation === WaferMapOriginLocation.bottomLeft
+              || originLocation === WaferMapOriginLocation.bottomRight) {
+              return scale
+                  .domain([grid.origin.y - 1, grid.origin.y + grid.rows - 1])
+                  .range([containerHeight, 0]);
+          }
+          return scale
+              .domain([grid.origin.y, grid.origin.y + grid.rows])
+              .range([0, containerHeight]);
+      }
+      calculateMarginAddition(baseMargin, addedMargin) {
+          return {
+              top: baseMargin.top + addedMargin.top,
+              right: baseMargin.right + addedMargin.right,
+              bottom: baseMargin.bottom + addedMargin.bottom,
+              left: baseMargin.left + addedMargin.left
+          };
+      }
+  }
+
+  /**
+   * Data Manager uses Computations and Prerendering modules in order and exposes the results
+   */
+  class DataManager {
+      get containerDimensions() {
+          return this.computations.containerDimensions;
+      }
+      get dieDimensions() {
+          return this.computations.dieDimensions;
+      }
+      get margin() {
+          return this.computations.margin;
+      }
+      get horizontalScale() {
+          return this.computations.horizontalScale;
+      }
+      get verticalScale() {
+          return this.computations.verticalScale;
+      }
+      get labelsFontSize() {
+          return this.prerendering.labelsFontSize;
+      }
+      get diesRenderInfo() {
+          return this.prerendering.diesRenderInfo;
+      }
+      get data() {
+          return this.dataMap;
+      }
       constructor(wafermap) {
           this.wafermap = wafermap;
           this.computations = new Computations(wafermap);
@@ -76385,6 +76667,10 @@ img.ProseMirror-separator {
                   x: invertedPoint[0],
                   y: invertedPoint[1]
               });
+              if (dieCoordinates === undefined) {
+                  this.wafermap.hoverDie = undefined;
+                  return;
+              }
               this.wafermap.hoverDie = this.wafermap.dataManager.getWaferMapDie(dieCoordinates);
           };
           this.onMouseOut = (_event) => {
@@ -76406,19 +76692,23 @@ img.ProseMirror-separator {
           this.wafermap.removeEventListener('mouseout', this.onMouseOut);
       }
       calculateDieCoordinates(mousePosition) {
-          const originLocation = this.wafermap.originLocation;
-          const xRoundFunction = originLocation === WaferMapOriginLocation.bottomLeft
-              || originLocation === WaferMapOriginLocation.topLeft
-              ? Math.floor
-              : Math.ceil;
-          const yRoundFunction = originLocation === WaferMapOriginLocation.bottomLeft
-              || originLocation === WaferMapOriginLocation.bottomRight
-              ? Math.floor
-              : Math.ceil;
-          // go to x and y scale to get the x,y values of the die.
-          const x = xRoundFunction(this.wafermap.dataManager.invertedHorizontalScale(mousePosition.x - this.wafermap.dataManager.margin.left));
-          const y = yRoundFunction(this.wafermap.dataManager.invertedVerticalScale(mousePosition.y - this.wafermap.dataManager.margin.top));
-          return { x, y };
+          if (!this.wafermap.isExperimentalRenderer()
+              && this.wafermap.dataManager instanceof DataManager$1) {
+              const originLocation = this.wafermap.originLocation;
+              const xRoundFunction = originLocation === WaferMapOriginLocation.bottomLeft
+                  || originLocation === WaferMapOriginLocation.topLeft
+                  ? Math.floor
+                  : Math.ceil;
+              const yRoundFunction = originLocation === WaferMapOriginLocation.bottomLeft
+                  || originLocation === WaferMapOriginLocation.bottomRight
+                  ? Math.floor
+                  : Math.ceil;
+              // go to x and y scale to get the x,y values of the die.
+              const x = xRoundFunction(this.wafermap.dataManager.invertedHorizontalScale(mousePosition.x - this.wafermap.dataManager.margin.left));
+              const y = yRoundFunction(this.wafermap.dataManager.invertedVerticalScale(mousePosition.y - this.wafermap.dataManager.margin.top));
+              return { x, y };
+          }
+          return undefined;
       }
       hoversOverDie(mousePosition) {
           const rgba = this.wafermap.canvasContext.getImageData(mousePosition.x, mousePosition.y, 1, 1).data;
@@ -76449,11 +76739,14 @@ img.ProseMirror-separator {
                   event.offsetX,
                   event.offsetY
               ]);
-              // does not work yet until data manager will parse diesTable
               const dieCoordinates = this.calculateDieCoordinates({
                   x: invertedPoint[0],
                   y: invertedPoint[1]
               });
+              if (dieCoordinates === undefined) {
+                  this.wafermap.hoverDie = undefined;
+                  return;
+              }
               const colIndex = this.wafermap
                   .diesTable.getChild('colIndex')
                   .toArray();
@@ -76493,19 +76786,23 @@ img.ProseMirror-separator {
           this.wafermap.removeEventListener('mouseout', this.onMouseOut);
       }
       calculateDieCoordinates(mousePosition) {
-          const originLocation = this.wafermap.originLocation;
-          const xRoundFunction = originLocation === WaferMapOriginLocation.bottomLeft
-              || originLocation === WaferMapOriginLocation.topLeft
-              ? Math.floor
-              : Math.ceil;
-          const yRoundFunction = originLocation === WaferMapOriginLocation.bottomLeft
-              || originLocation === WaferMapOriginLocation.bottomRight
-              ? Math.floor
-              : Math.ceil;
-          // go to x and y scale to get the x,y values of the die.
-          const x = xRoundFunction(this.wafermap.dataManager.invertedHorizontalScale(mousePosition.x - this.wafermap.dataManager.margin.left));
-          const y = yRoundFunction(this.wafermap.dataManager.invertedVerticalScale(mousePosition.y - this.wafermap.dataManager.margin.top));
-          return { x, y };
+          if (this.wafermap.isExperimentalRenderer()
+              && this.wafermap.dataManager instanceof DataManager) {
+              const originLocation = this.wafermap.originLocation;
+              const xRoundFunction = originLocation === WaferMapOriginLocation.bottomLeft
+                  || originLocation === WaferMapOriginLocation.topLeft
+                  ? Math.floor
+                  : Math.ceil;
+              const yRoundFunction = originLocation === WaferMapOriginLocation.bottomLeft
+                  || originLocation === WaferMapOriginLocation.bottomRight
+                  ? Math.ceil
+                  : Math.floor;
+              // go to x and y scale to get the x,y values of the die.
+              const x = xRoundFunction(this.wafermap.dataManager.horizontalScale.invert(mousePosition.x - this.wafermap.dataManager.margin.left));
+              const y = yRoundFunction(this.wafermap.dataManager.verticalScale.invert(mousePosition.y - this.wafermap.dataManager.margin.top));
+              return { x, y };
+          }
+          return undefined;
       }
   }
 
@@ -76576,7 +76873,12 @@ img.ProseMirror-separator {
           /**
            * @internal
            */
-          this.dataManager = new DataManager(this.asRequiredFieldsWaferMap);
+          this.stableDataManager = new DataManager$1(this.asRequiredFieldsWaferMap);
+          /**
+           * @internal
+           */
+          this.experimentalDataManager = new DataManager(this.asRequiredFieldsWaferMap);
+          this.dataManager = this.stableDataManager;
           /**
            * @internal
            */
@@ -76662,6 +76964,9 @@ img.ProseMirror-separator {
           if (this.waferMapUpdateTracker.requiresEventsUpdate) {
               // zoom translateExtent needs to be recalculated when canvas size changes
               this.zoomHandler.disconnect();
+              this.dataManager = this.isExperimentalRenderer()
+                  ? this.experimentalDataManager
+                  : this.stableDataManager;
               if (this.waferMapUpdateTracker.requiresContainerDimensionsUpdate) {
                   this.dataManager.updateContainerDimensions();
                   this.renderer.updateSortedDiesAndDrawWafer();