@jbrowse/display-ui 5.0.0-beta.2 → 5.0.0-beta.4

package/esm/PointerLayer.d.ts

@@ -1,26 +1,20 @@
 import type { MouseState, MouseTracker } from '@jbrowse/core/ui/useMouseTracking';
 import type { ReactNode } from 'react';
 /**
- * The part of a display that follows the pointer — guides, a tooltip, a
- * highlighted column — rendered off the chrome's `mouseTracker` in a leaf of
- * its own, so a mousemove re-renders this and nothing else. Read in the
- * component that mounts `DisplayChrome` instead, the position would re-render
- * the chrome, its status container and every overlay under it on each move
- * (see `useMouseTracking`).
+ * The part of a display that follows the pointer, in a leaf of its own so a
+ * mousemove re-renders this and not the chrome, its status container and every
+ * overlay under it (see `useMouseTracking`). An observer, so a model read in
+ * `children` is tracked here too rather than freezing under a stationary
+ * cursor.
  *
- * `rowsTopOffset` answers whether the pointer is over the rows rather than a
- * band stacked above them, for a display that gates its crosshair to the rows:
- * a guide drawn while the pointer is over a variant lane or a connector zone
- * names a row the pointer is not on. The tooltip is usually not gated with it,
- * which is why the child decides. `children` is also handed an absent state, so
- * a layer that has to render while nothing is hovered — the matrix display's
- * connector lines, with no column highlighted — can.
- *
- * Four displays used to write this component out, with the same paragraph over
- * each.
+ * `inRows` is whether the pointer is past `rowsTopOffset`, the bands a display
+ * stacks above its rows — a crosshair drawn over one names a row the pointer is
+ * not on, and `>=` because the rows begin AT the offset. A tooltip usually
+ * wants it ungated, which is why the child decides, and `children` is handed an
+ * absent state so a layer that draws with nothing hovered still can.
  */
-export declare function PointerLayer({ mouseTracker, rowsTopOffset, children, }: {
+export declare const PointerLayer: ({ mouseTracker, rowsTopOffset, children, }: {
     mouseTracker: MouseTracker;
     rowsTopOffset?: number;
     children: (state: MouseState | undefined, inRows: boolean) => ReactNode;
-}): import("react").JSX.Element;
+}) => ReactNode;

package/esm/PointerLayer.js

@@ -1,30 +1,21 @@
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
 // deep subpath, never the `@jbrowse/core/ui` barrel: this package reaches no
 // UI toolkit, and the barrel pulls MUI in
 import { useMouseState } from '@jbrowse/core/ui/useMouseTracking';
+import { observer } from 'mobx-react';
 /**
- * The part of a display that follows the pointer — guides, a tooltip, a
- * highlighted column — rendered off the chrome's `mouseTracker` in a leaf of
- * its own, so a mousemove re-renders this and nothing else. Read in the
- * component that mounts `DisplayChrome` instead, the position would re-render
- * the chrome, its status container and every overlay under it on each move
- * (see `useMouseTracking`).
+ * The part of a display that follows the pointer, in a leaf of its own so a
+ * mousemove re-renders this and not the chrome, its status container and every
+ * overlay under it (see `useMouseTracking`). An observer, so a model read in
+ * `children` is tracked here too rather than freezing under a stationary
+ * cursor.
  *
- * `rowsTopOffset` answers whether the pointer is over the rows rather than a
- * band stacked above them, for a display that gates its crosshair to the rows:
- * a guide drawn while the pointer is over a variant lane or a connector zone
- * names a row the pointer is not on. The tooltip is usually not gated with it,
- * which is why the child decides. `children` is also handed an absent state, so
- * a layer that has to render while nothing is hovered — the matrix display's
- * connector lines, with no column highlighted — can.
- *
- * Four displays used to write this component out, with the same paragraph over
- * each.
+ * `inRows` is whether the pointer is past `rowsTopOffset`, the bands a display
+ * stacks above its rows — a crosshair drawn over one names a row the pointer is
+ * not on, and `>=` because the rows begin AT the offset. A tooltip usually
+ * wants it ungated, which is why the child decides, and `children` is handed an
+ * absent state so a layer that draws with nothing hovered still can.
  */
-export function PointerLayer({ mouseTracker, rowsTopOffset = 0, children, }) {
-    // >=: the rows begin AT the offset (their container sits at
-    // `top: rowsTopOffset`), so the boundary pixel is row 0's top edge — and with
-    // no band above, y=0 is the display's own top edge, not a dead line.
+export const PointerLayer = observer(function PointerLayer({ mouseTracker, rowsTopOffset = 0, children, }) {
     const state = useMouseState(mouseTracker);
-    return _jsx(_Fragment, { children: children(state, !!state && state.y >= rowsTopOffset) });
-}
+    return children(state, !!state && state.y >= rowsTopOffset);
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jbrowse/display-ui",
-  "version": "5.0.0-beta.2",
+  "version": "5.0.0-beta.4",
   "type": "module",
   "description": "The UI a display draws that is not data: the swappable chrome contract, its toolkit-free implementations, and the track overlay layer",
   "keywords": [
@@ -24,7 +24,7 @@
   "dependencies": {
     "@jbrowse/mobx-state-tree": "^6.5.1",
     "mobx-react": "^10.0.2",
-    "@jbrowse/core": "^5.0.0-beta.2"
+    "@jbrowse/core": "^5.0.0-beta.4"
   },
   "peerDependencies": {
     "react": ">=19.0.0",