higlass 2.2.0 → 2.2.2

package/app/missing-types.d.ts

@@ -22,3 +22,9 @@ declare module 'pub-sub-es' {
   export function createPubSub(): PubSub;
   export const globalPubSub: PubSub;
 }
+
+// see ../scripts/virtual-stylesheet-plugin.mjs
+declare module 'virtual:stylesheet' {
+  const styles: string;
+  export default styles;
+}

package/app/scripts/HiGlassComponent.jsx

@@ -491,7 +491,7 @@ class HiGlassComponent extends React.Component {
 
     const thisElement = this.topDivRef.current;
 
-    if (thisElement && document.body.contains(thisElement)) {
+    if (thisElement?.getRootNode().contains(thisElement)) {
       callback();
     } else {
       requestAnimationFrame(() => this.waitForDOMAttachment(callback));

package/app/scripts/LeftAxisTrack.js

@@ -1,5 +1,6 @@
 // @ts-nocheck
 import { axisLeft } from 'd3-axis';
+import { format } from 'd3-format';
 
 import SVGTrack from './SVGTrack';
 
@@ -25,6 +26,17 @@ class LeftAxisTrack extends SVGTrack {
 
   draw() {
     this.axis.scale(this._yScale);
+
+    if (
+      this.options.reverseAxis === 'yes' ||
+      this.options.reverseAxis === true
+    ) {
+      const defaultFormat = format(',');
+      this.axis.tickFormat((d) => defaultFormat(-d));
+    } else {
+      this.axis.tickFormat(null);
+    }
+
     this.gAxis.call(this.axis);
 
     return this;

package/app/scripts/TiledPixiTrack.js

@@ -101,7 +101,7 @@ export function getValueScale(
  * @typedef TiledPixiTrackContextBase
  * @property {DataFetcher} dataFetcher
  * @property {t.DataConfig} dataConfig
- * @property {function} animate A function to redraw this track. Typically called when an
+ * @property {Function} animate A function to redraw this track. Typically called when an
  *  asynchronous event occurs (i.e. tiles loaded)
  * @property {() => void} onValueScaleChanged The range of values has changed so we need to inform
  *  the higher ups that the value scale has changed. Only occurs on tracks with ``dense`` data.
@@ -174,7 +174,7 @@ class TiledPixiTrack extends PixiTrack {
     this.fetchedTiles = {};
 
     // the graphics that have already been drawn for this track
-    /** @type {Object.<string, import('pixi.js').DisplayObject>} */
+    /** @type {Record<string, import('pixi.js').DisplayObject>} */
     this.tileGraphics = {};
 
     /** @type {number} */
@@ -359,7 +359,7 @@ class TiledPixiTrack extends PixiTrack {
    * event is ``dataChanged``.
    *
    * @param {string} event The event to listen for
-   * @param {function} callback The callback to call when the event occurs. The
+   * @param {Function} callback The callback to call when the event occurs. The
    *  parameters for the event depend on the event called.
    *
    * @example
@@ -378,7 +378,7 @@ class TiledPixiTrack extends PixiTrack {
 
   /**
    * @param {string} event The event to listen for
-   * @param {function} callback The callback to call when the event occurs. The
+   * @param {Function} callback The callback to call when the event occurs. The
    *  parameters for the event depend on the event called.
    */
   off(event, callback) {

package/app/scripts/TiledPlot.jsx

@@ -188,7 +188,7 @@ export class TiledPlot extends React.Component {
 
     const thisElement = this.divTiledPlot;
 
-    if (document.body.contains(thisElement)) {
+    if (thisElement?.getRootNode().contains(thisElement)) {
       callback();
     } else {
       requestAnimationFrame(() => this.waitForDOMAttachment(callback));

package/app/scripts/configs/tracks-info.js

@@ -108,9 +108,10 @@ export const TRACKS_INFO = [
     orientation: '1d-vertical',
     name: 'Left Axis',
     thumbnail: svgVertical1DAxisIcon,
-    availableOptions: ['minWidth'],
+    availableOptions: ['minWidth', 'reverseAxis'],
     defaultOptions: {
       minWidth: 100,
+      reverseAxis: false,
     },
   },
   {

package/app/scripts/hglib.jsx

@@ -7,6 +7,23 @@ import HorizontalGeneAnnotationsTrack from './HorizontalGeneAnnotationsTrack';
 import SVGTrack from './SVGTrack';
 import TiledPixiTrack from './TiledPixiTrack';
 
+import CSS from 'virtual:stylesheet';
+
+// Auto-inject styles into document.head for backwards compatibility.
+// Uses a data attribute to prevent duplicate injection.
+if (
+  CSS &&
+  typeof document !== 'undefined' &&
+  !document.querySelector('[data-higlass-styles]')
+) {
+  const style = document.createElement('style');
+  style.setAttribute('data-higlass-styles', '');
+  style.textContent = CSS;
+  document.head.appendChild(style);
+}
+
+export { CSS };
+
 export { default as ChromosomeInfo } from './ChromosomeInfo';
 export { default as HiGlassComponent } from './HiGlassComponent';
 export {

package/app/scripts/options-info.js

@@ -521,6 +521,11 @@ export const OPTIONS_INFO = {
     inlineOptions: sizesInPx([0, 10, 20, 30, 40, 50, 100, 200, 400], 'px'),
   },
 
+  reverseAxis: {
+    name: 'Reverse Axis',
+    inlineOptions: YES_NO,
+  },
+
   colorbarPosition: {
     name: 'Colorbar Position',
     inlineOptions: {

package/app/scripts/utils/tile-to-canvas.js

@@ -1,6 +1,6 @@
 /**
  * Convert a 1D numerical array into a canvas image
- * @param {Uint8ClampedArray} pixData - 1D data array
+ * @param {Uint8ClampedArray<ArrayBuffer>} pixData - 1D data array
  * @param {number} w - Width
  * @param {number} h - Height
  * @return {object} Canvas object

package/dist/app/scripts/TiledPixiTrack.d.ts

@@ -115,7 +115,7 @@ export type ExtendedTiledPixiTrackOptions<T> = T & TiledPixiTrackOptions;
  * @typedef TiledPixiTrackContextBase
  * @property {DataFetcher} dataFetcher
  * @property {t.DataConfig} dataConfig
- * @property {function} animate A function to redraw this track. Typically called when an
+ * @property {Function} animate A function to redraw this track. Typically called when an
  *  asynchronous event occurs (i.e. tiles loaded)
  * @property {() => void} onValueScaleChanged The range of values has changed so we need to inform
  *  the higher ups that the value scale has changed. Only occurs on tracks with ``dense`` data.
@@ -165,10 +165,8 @@ declare class TiledPixiTrack<Options extends ExtendedTiledPixiTrackOptions<{
     fetchedTiles: {
         [id: string]: Tile;
     };
-    /** @type {Object.<string, import('pixi.js').DisplayObject>} */
-    tileGraphics: {
-        [x: string]: import("pixi.js").DisplayObject;
-    };
+    /** @type {Record<string, import('pixi.js').DisplayObject>} */
+    tileGraphics: Record<string, import("pixi.js").DisplayObject>;
     /** @type {number} */
     maxZoom: number;
     medianVisibleValue: number | null | undefined;
@@ -229,7 +227,7 @@ declare class TiledPixiTrack<Options extends ExtendedTiledPixiTrackOptions<{
      * event is ``dataChanged``.
      *
      * @param {string} event The event to listen for
-     * @param {function} callback The callback to call when the event occurs. The
+     * @param {Function} callback The callback to call when the event occurs. The
      *  parameters for the event depend on the event called.
      *
      * @example
@@ -241,7 +239,7 @@ declare class TiledPixiTrack<Options extends ExtendedTiledPixiTrackOptions<{
     on(event: string, callback: Function): void;
     /**
      * @param {string} event The event to listen for
-     * @param {function} callback The callback to call when the event occurs. The
+     * @param {Function} callback The callback to call when the event occurs. The
      *  parameters for the event depend on the event called.
      */
     off(event: string, callback: Function): void;

package/dist/app/scripts/data-fetchers/DataFetcher.d.ts

@@ -147,5 +147,4 @@ import type { HandleTilesetInfoFinished } from '../types';
 import type { DataConfig } from '../types';
 import DenseDataExtrema1D from '../utils/DenseDataExtrema1D';
 import DenseDataExtrema2D from '../utils/DenseDataExtrema2D';
-import type { DataConfig as DataConfig_1 } from '../types';
 import type { TilesetInfo } from '../types';

package/dist/app/scripts/hglib.d.ts

@@ -1,3 +1,4 @@
+export { CSS };
 export { default as ChromosomeInfo } from "./ChromosomeInfo";
 export { default as HiGlassComponent } from "./HiGlassComponent";
 export namespace tracks {
@@ -14,6 +15,7 @@ export * as hggos from "./gosling-exports";
 export type HiGlassApi = api.HiGlassApi["public"];
 export type HiGlassOptions = types.HiGlassOptions;
 export type HiGlassViewConfig = types.HiGlassViewConfig;
+import CSS from 'virtual:stylesheet';
 import SVGTrack from './SVGTrack';
 import TiledPixiTrack from './TiledPixiTrack';
 import HorizontalGeneAnnotationsTrack from './HorizontalGeneAnnotationsTrack';