higlass 1.13.5 → 2.0.0

package/app/scripts/Autocomplete.jsx

@@ -1,9 +1,7 @@
 // @ts-nocheck
-/* eslint-disable react/jsx-props-no-spreading */
-import React from 'react';
-import { findDOMNode } from 'react-dom';
-import scrollIntoView from 'dom-scroll-into-view';
+
 import PropTypes from 'prop-types';
+import React from 'react';
 
 const _debugStates = [];
 
@@ -102,14 +100,12 @@ class Autocomplete extends React.Component {
     };
   }
 
-  // eslint-disable-next-line camelcase
   UNSAFE_componentWillMount() {
     this._ignoreBlur = false;
     this._performAutoCompleteOnUpdate = false;
     this._performAutoCompleteOnKeyUp = false;
   }
 
-  // eslint-disable-next-line camelcase
   UNSAFE_componentWillReceiveProps(nextProps) {
     this._performAutoCompleteOnUpdate = true;
     // If `items` has changed we want to reset `highlightedIndex`
@@ -143,15 +139,8 @@ class Autocomplete extends React.Component {
 
   maybeScrollItemIntoView() {
     if (this.state.isOpen === true && this.state.highlightedIndex !== null) {
-      // eslint-disable-next-line react/no-string-refs
       const itemNode = this.refs[`item-${this.state.highlightedIndex}`];
-      // eslint-disable-next-line react/no-string-refs
-      const menuNode = this.refs.menu;
-      if (itemNode) {
-        scrollIntoView(findDOMNode(itemNode), findDOMNode(menuNode), {
-          onlyScrollIfNeeded: true,
-        });
-      }
+      itemNode?.scrollIntoView({ block: 'nearest', behavior: 'smooth' });
     }
   }
 
@@ -217,9 +206,9 @@ class Autocomplete extends React.Component {
     const node = this.inputEl;
     const rect = node.getBoundingClientRect();
     const computedStyle = global.window.getComputedStyle(node);
-    const marginBottom = parseInt(computedStyle.marginBottom, 10) || 0;
-    const marginLeft = parseInt(computedStyle.marginLeft, 10) || 0;
-    const marginRight = parseInt(computedStyle.marginRight, 10) || 0;
+    const marginBottom = Number.parseInt(computedStyle.marginBottom, 10) || 0;
+    const marginLeft = Number.parseInt(computedStyle.marginLeft, 10) || 0;
+    const marginRight = Number.parseInt(computedStyle.marginRight, 10) || 0;
     this.setState({
       menuTop: rect.bottom + marginBottom,
       menuLeft: rect.left + marginLeft,
@@ -354,26 +343,26 @@ class Autocomplete extends React.Component {
           autoComplete="off"
           onBlur={this.composeEventHandlers(
             this.handleInputBlur.bind(this),
-            inputProps.onBlur && inputProps.onBlur.bind(this),
+            inputProps.onBlur?.bind(this),
           )}
           onChange={this.handleChange.bind(this)}
           onClick={this.composeEventHandlers(
             this.handleInputClick.bind(this),
-            inputProps.onClick && inputProps.onClick.bind(this),
+            inputProps.onClick?.bind(this),
           )}
           onFocus={this.composeEventHandlers(
             this.handleInputFocus.bind(this),
-            inputProps.onFocus && inputProps.onFocus.bind(this),
+            inputProps.onFocus?.bind(this),
           )}
           onKeyDown={this.composeEventHandlers(
             this.handleKeyDown.bind(this),
-            inputProps.onKeyDown && inputProps.onKeyDown.bind(this),
+            inputProps.onKeyDown?.bind(this),
           )}
           onKeyUp={this.composeEventHandlers(
             this.handleKeyUp.bind(this),
-            inputProps.onKeyUp && inputProps.onKeyUp.bind(this),
+            inputProps.onKeyUp?.bind(this),
           )}
-          // eslint-disable-next-line jsx-a11y/role-has-required-aria-props
+          // biome-ignore lint/a11y/useAriaPropsForRole:
           role="combobox"
           value={this.props.value}
         />
@@ -403,11 +392,7 @@ Autocomplete.defaultProps = {
   onChange() {},
   onSelect() {},
   renderMenu(items, value, style) {
-    return (
-      /* eslint-disable react/no-this-in-sfc */
-      <div style={{ ...style, ...this.menuStyle }}>{items}</div>
-      /* eslint-enable react/no-this-in-sfc */
-    );
+    return <div style={{ ...style, ...this.menuStyle }}>{items}</div>;
   },
   shouldItemRender() {
     return true;

package/app/scripts/AxisPixi.js

@@ -138,7 +138,7 @@ class AxisPixi {
       graphics.moveTo(-TICK_MARGIN, valueScale(tick));
       graphics.lineTo(-(TICK_MARGIN + TICK_LENGTH), valueScale(tick));
 
-      if (this.track && this.track.flipText) {
+      if (this.track?.flipText) {
         this.axisTexts[i].scale.x = -1;
       }
     }
@@ -180,7 +180,7 @@ class AxisPixi {
       graphics.moveTo(TICK_MARGIN, valueScale(tick));
       graphics.lineTo(TICK_MARGIN + TICK_LENGTH, valueScale(tick));
 
-      if (this.track && this.track.flipText) {
+      if (this.track?.flipText) {
         this.axisTexts[i].scale.x = -1;
       }
     }
@@ -228,7 +228,7 @@ class AxisPixi {
 
     let stroke = 'black';
 
-    if (this.track && this.track.options.lineStrokeColor) {
+    if (this.track?.options.lineStrokeColor) {
       stroke = this.track.options.lineStrokeColor;
     }
     // TODO: On the canvas, there is no vertical line beside the scale,
@@ -254,7 +254,7 @@ class AxisPixi {
     // factor out the styling for axis lines
     let stroke = 'black';
 
-    if (this.track && this.track.options.lineStrokeColor) {
+    if (this.track?.options.lineStrokeColor) {
       stroke = this.track.options.lineStrokeColor;
     }
 
@@ -306,9 +306,7 @@ class AxisPixi {
 
       tickLine.setAttribute(
         'd',
-        `M${+TICK_MARGIN},${valueScale(tick)} L${+(
-          TICK_MARGIN + TICK_LENGTH
-        )},${valueScale(tick)}`,
+        `M${+TICK_MARGIN},${valueScale(tick)} L${+(TICK_MARGIN + TICK_LENGTH)},${valueScale(tick)}`,
       );
 
       const g = document.createElement('g');
@@ -352,9 +350,7 @@ class AxisPixi {
 
       tickLine.setAttribute(
         'd',
-        `M${-TICK_MARGIN},${valueScale(tick)} L${-(
-          TICK_MARGIN + TICK_LENGTH
-        )},${valueScale(tick)}`,
+        `M${-TICK_MARGIN},${valueScale(tick)} L${-(TICK_MARGIN + TICK_LENGTH)},${valueScale(tick)}`,
       );
 
       const g = document.createElement('g');

package/app/scripts/BarTrack.js

@@ -20,7 +20,7 @@ class BarTrack extends HorizontalLine1DPixiTrack {
     this.pMain.addChild(this.zeroLine);
     this.valueScaleTransform = zoomIdentity;
 
-    if (this.options && this.options.colorRange) {
+    if (this.options?.colorRange) {
       if (this.options.colorRangeGradient) {
         this.setColorGradient(this.options.colorRange);
       } else {
@@ -226,7 +226,7 @@ class BarTrack extends HorizontalLine1DPixiTrack {
   }
 
   rerender(options, force) {
-    if (options && options.colorRange) {
+    if (options?.colorRange) {
       if (options.colorRangeGradient) {
         this.setColorGradient(options.colorRange);
       } else {
@@ -430,7 +430,7 @@ class BarTrack extends HorizontalLine1DPixiTrack {
     if (this.options.zeroLine) this.drawZeroLineSvg(output);
 
     this.visibleAndFetchedTiles()
-      .filter((tile) => tile.svgData && tile.svgData.barXValues)
+      .filter((tile) => tile.svgData?.barXValues)
       .forEach((tile) => {
         // const [xScale, xPos] = this.getXScaleAndOffset(tile.drawnAtScale);
         const data = tile.svgData;