@genome-spy/core 0.74.0 → 0.76.0

package/dist/src/view/facetView.js

@@ -12,7 +12,7 @@ import coalesce from "../utils/coalesce.js";
 import { field as vegaField } from "vega-util";
 import DecoratorView from "./decoratorView.js";
 import Padding from "./layout/padding.js";
-import { markViewAsNonAddressable } from "./viewSelectors.js";
+import { markViewAsChrome, markViewAsNonAddressable } from "./viewSelectors.js";
 
 const DEFAULT_SPACING = 20;
 
@@ -104,6 +104,7 @@ export default class FacetView extends ContainerView {
                     `facetLabel-${channel}`
                 );
                 markViewAsNonAddressable(labelView, { skipSubtree: true });
+                markViewAsChrome(labelView, { skipSubtree: true });
                 return [channel, labelView];
             })
         );

package/dist/src/view/flowBuilder.d.ts

@@ -15,7 +15,7 @@ export function buildDataFlow(root: import("./view.js").default<import("../spec/
  */
 export function linearizeLocusAccess(view: import("./unitView.js").default): {
     transforms: import("../data/flowNode.js").default[];
-    rewrittenEncoding: import("../spec/channel.js").Encoding;
+    rewrittenEncoding: Record<string, any>;
     /**
      * Should be called after the whole flow has been created in order to
      * not disrupt inheritance of encodings

package/dist/src/view/flowBuilder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"flowBuilder.d.ts","sourceRoot":"","sources":["../../../src/view/flowBuilder.js"],"names":[],"mappings":"AAyBA;;;;;;GAMG;AACH,oHALW,QAAQ,eAER,CAAC,IAAI,iEAAM,KAAK,OAAO,gCACvB,CAAC,IAAI,iEAAM,KAAK,OAAO,YAoPjC;AAuBD;;;;;;GAMG;AACH,2CAFW,OAAO,eAAe,EAAE,OAAO;;;IAoH5B;;;OAGG;;EAYhB;AAgCD;;;;;;GAMG;AACH,4BAFwB,CAAC,SAAZ,qCAAU,cAFZ,CAAC,iBACA,uCAAW;;;0BAwBG,OAAO,CAAC,QAAQ,CAAC,OAAO,qBAAqB,EAAE,KAAK,CAAC,CAAC;EAkB/E;qBAxfoB,qBAAqB;sBAPpB,sBAAsB"}
+{"version":3,"file":"flowBuilder.d.ts","sourceRoot":"","sources":["../../../src/view/flowBuilder.js"],"names":[],"mappings":"AAyBA;;;;;;GAMG;AACH,oHALW,QAAQ,eAER,CAAC,IAAI,iEAAM,KAAK,OAAO,gCACvB,CAAC,IAAI,iEAAM,KAAK,OAAO,YAoPjC;AAuBD;;;;;;GAMG;AACH,2CAFW,OAAO,eAAe,EAAE,OAAO;;;IAwH5B;;;OAGG;;EAYhB;AAgCD;;;;;;GAMG;AACH,4BAFwB,CAAC,SAAZ,qCAAU,cAFZ,CAAC,iBACA,uCAAW;;;0BAwBG,OAAO,CAAC,QAAQ,CAAC,OAAO,qBAAqB,EAAE,KAAK,CAAC,CAAC;EAkB/E;qBA5foB,qBAAqB;sBAPpB,sBAAsB"}

package/dist/src/view/flowBuilder.js

@@ -312,7 +312,7 @@ export function linearizeLocusAccess(view) {
     /** @type {FlowNode[]} */
     const transforms = [];
 
-    /** @type {Encoding} */
+    /** @type {Record<string, any>} */
     const rewrittenEncoding = {};
 
     // Use mark.encoding so we see the same channel defs that encoders consume,
@@ -374,12 +374,16 @@ export function linearizeLocusAccess(view) {
 
                 // Prefer using the spec directly because getEncoding() returns inherited props too.
                 // TODO: I think this is not robust enough. Needs more work...
-                /** @type {any} */
+                /** @type {Record<string, any>} */
+                const currentEncoding =
+                    view.spec.encoding?.[channel] ??
+                    configuredEncoding[channel] ??
+                    encoding[channel] ??
+                    {};
+
+                /** @type {Record<string, any>} */
                 const newFieldDef = {
-                    ...(view.spec.encoding?.[channel] ??
-                        configuredEncoding[channel] ??
-                        encoding[channel] ??
-                        {}),
+                    ...currentEncoding,
                     field: linearizedField,
                 };
                 delete newFieldDef.chrom;
@@ -435,7 +439,7 @@ export function linearizeLocusAccess(view) {
 
 /**
  * @param {import("./unitView.js").default} view
- * @param {import("../spec/channel.js").Encoding} [encoding]
+ * @param {Record<string, any>} [encoding]
  * @returns {import("../spec/transform.js").CompareParams}
  */
 function getCompareParamsForView(view, encoding) {

package/dist/src/view/gridView/gridChild.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"gridChild.d.ts","sourceRoot":"","sources":["../../../../src/view/gridView/gridChild.js"],"names":[],"mappings":"AAo2BA;;;;;GAKG;AACH,qDALW,OAAO,yBAAyB,EAAE,uBAAuB,CAAC,MAAM,CAAC,sBACjE,OAAO,aACP,MAAM,GACJ,OAAO,yBAAyB,EAAE,WAAW,GAAG,SAAS,CAyBrE;AAcD;;;GAGG;AACH,iDAHW,OAAO,oBAAoB,EAAE,cAAc,GACzC,OAAO,oBAAoB,EAAE,QAAQ,CA6BjD;AAED;;;GAGG;AACH,uDAHW,OAAO,oBAAoB,EAAE,cAAc,GACzC,OAAO,oBAAoB,EAAE,QAAQ,CA4CjD;AAn8BD;IACI;;;;;;OAMG;IAEH;;;;OAIG;IACH,kBAJW,OAAO,YAAY,EAAE,OAAO,gBAC5B,OAAO,qBAAqB,EAAE,OAAO,UACrC,MAAM,EAmHhB;IAhHG,gGAAgC;IAChC,0EAAgB;IAChB,eAAoB;IAEpB,uBAAuB;IACvB,YADW,QAAQ,CACQ;IAE3B,uBAAuB;IACvB,kBADW,QAAQ,CACc;IAEjC,sFAAsF;IACtF,MADW,OAAO,CAAC,MAAM,CAAC,OAAO,oBAAoB,EAAE,UAAU,EAAE,QAAQ,CAAC,CAAC,CAC/D;IAEd,+FAA+F;IAC/F,WADW,OAAO,CAAC,MAAM,CAAC,OAAO,oBAAoB,EAAE,UAAU,EAAE,YAAY,CAAC,CAAC,CAC9D;IAEnB,mFAAmF;IACnF,YADW,OAAO,CAAC,MAAM,CAAC,OAAO,gBAAgB,EAAE,eAAe,EAAE,SAAS,CAAC,CAAC,CAC3D;IAEpB,4BAA4B;IAC5B,eADW,aAAa,CACM;IAE9B,uBAAuB;IACvB,OADW,QAAQ,CACG;IAEtB,qBAAqB;IACrB,kBADW,MAAM,CACQ;IAEzB,iCAAiC;IACjC,wBADW,MAAM,GAAG,SAAS,CACU;IAEvC,qBAAqB;IACrB,aADW,MAAM,CACG;IAEpB,wBAAwB;IACxB,QADW,SAAS,CACQ;IAwhBhC,6GAiBC;IAED;;OAEG;IACH,4BA2LC;IAED;;OAEG;IACH,yBAWC;IAED,uBAqBC;IAED,iCAEC;;CACJ;qBAj1BoB,gBAAgB;qBANK,gBAAgB;yBADjC,oBAAoB;sBASvB,gBAAgB;0BACoB,oBAAoB;sBALxD,wBAAwB;oBAF1B,sBAAsB"}
+{"version":3,"file":"gridChild.d.ts","sourceRoot":"","sources":["../../../../src/view/gridView/gridChild.js"],"names":[],"mappings":"AA42BA;;;;;GAKG;AACH,qDALW,OAAO,yBAAyB,EAAE,uBAAuB,CAAC,MAAM,CAAC,sBACjE,OAAO,aACP,MAAM,GACJ,OAAO,yBAAyB,EAAE,WAAW,GAAG,SAAS,CAyBrE;AAcD;;;GAGG;AACH,iDAHW,OAAO,oBAAoB,EAAE,cAAc,GACzC,OAAO,oBAAoB,EAAE,QAAQ,CA6BjD;AAED;;;GAGG;AACH,uDAHW,OAAO,oBAAoB,EAAE,cAAc,GACzC,OAAO,oBAAoB,EAAE,QAAQ,CA4CjD;AAx8BD;IACI;;;;;;OAMG;IAEH;;;;OAIG;IACH,kBAJW,OAAO,YAAY,EAAE,OAAO,gBAC5B,OAAO,qBAAqB,EAAE,OAAO,UACrC,MAAM,EAwHhB;IArHG,gGAAgC;IAChC,0EAAgB;IAChB,eAAoB;IAEpB,uBAAuB;IACvB,YADW,QAAQ,CACQ;IAE3B,uBAAuB;IACvB,kBADW,QAAQ,CACc;IAEjC,sFAAsF;IACtF,MADW,OAAO,CAAC,MAAM,CAAC,OAAO,oBAAoB,EAAE,UAAU,EAAE,QAAQ,CAAC,CAAC,CAC/D;IAEd,+FAA+F;IAC/F,WADW,OAAO,CAAC,MAAM,CAAC,OAAO,oBAAoB,EAAE,UAAU,EAAE,YAAY,CAAC,CAAC,CAC9D;IAEnB,mFAAmF;IACnF,YADW,OAAO,CAAC,MAAM,CAAC,OAAO,gBAAgB,EAAE,eAAe,EAAE,SAAS,CAAC,CAAC,CAC3D;IAEpB,4BAA4B;IAC5B,eADW,aAAa,CACM;IAE9B,uBAAuB;IACvB,OADW,QAAQ,CACG;IAEtB,qBAAqB;IACrB,kBADW,MAAM,CACQ;IAEzB,iCAAiC;IACjC,wBADW,MAAM,GAAG,SAAS,CACU;IAEvC,qBAAqB;IACrB,aADW,MAAM,CACG;IAEpB,wBAAwB;IACxB,QADW,SAAS,CACQ;IA6hBhC,6GAiBC;IAED;;OAEG;IACH,4BA2LC;IAED;;OAEG;IACH,yBAWC;IAED,uBAqBC;IAED,iCAEC;;CACJ;qBAz1BoB,gBAAgB;qBANK,gBAAgB;yBADjC,oBAAoB;sBAYvB,gBAAgB;0BACoB,oBAAoB;sBARxD,wBAAwB;oBAF1B,sBAAsB"}

package/dist/src/view/gridView/gridChild.js

@@ -16,7 +16,10 @@ import Point from "../layout/point.js";
 import Rectangle from "../layout/rectangle.js";
 import createTitle, { resolveTitleSpec } from "../title.js";
 import UnitView from "../unitView.js";
-import { markViewAsNonAddressable } from "../viewSelectors.js";
+import {
+    markViewAsChrome,
+    markViewAsNonAddressable,
+} from "../viewSelectors.js";
 import Scrollbar from "./scrollbar.js";
 import SelectionRect, { INTERVAL_DRAG_ACTIVE_PARAM } from "./selectionRect.js";
 import { normalizeIntervalForSelection } from "../../scales/selectionDomainUtils.js";
@@ -101,6 +104,7 @@ export default class GridChild {
                 markViewAsNonAddressable(this.background, {
                     skipSubtree: true,
                 });
+                markViewAsChrome(this.background, { skipSubtree: true });
             }
 
             const backgroundStrokeSpec = createBackgroundStroke(viewBackground);
@@ -118,6 +122,9 @@ export default class GridChild {
                 markViewAsNonAddressable(this.backgroundStroke, {
                     skipSubtree: true,
                 });
+                markViewAsChrome(this.backgroundStroke, {
+                    skipSubtree: true,
+                });
             }
 
             const titleSpec = resolveTitleSpec(
@@ -139,6 +146,7 @@ export default class GridChild {
                 );
                 this.title = unitView;
                 markViewAsNonAddressable(this.title, { skipSubtree: true });
+                markViewAsChrome(this.title, { skipSubtree: true });
             }
         }
 

package/dist/src/view/gridView/gridView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"gridView.d.ts","sourceRoot":"","sources":["../../../../src/view/gridView/gridView.js"],"names":[],"mappings":"AAmmCA;;GAEG;AACH,sHAUC;AA4DD;;;;;GAKG;AACH,4CAJW,OAAO,wBAAwB,EAAE,OAAO,UACxC,OAAO,oBAAoB,EAAE,UAAU,YACvC,QAAQ,aAmBlB;AAtpCD;;;;;;;;;;;;;;;;;;GAkBG;AACH,8BAH2D,KAAK,SAAnD,OAAQ,oBAAoB,EAAE,aAAc;IA6CrD;;;;;;;;;OASG;IACH,kBARW,KAAK,WACL,OAAO,4BAA4B,EAAE,OAAO,gBAC5C,aAAa,yFAEb,MAAM,WACN,MAAM,YACN,OAAO,YAAY,EAAE,WAAW,EAyC1C;IAtBG,uBAA0B;IAwB9B;;OAEG;IACH,6FAEC;IAED;;;;;;OAMG;IACH,4FAFa,SAAS,CAIrB;IAED;;;;;;;OAOG;IACH,oGAHW,MAAM,GACJ,SAAS,CASrB;IAED;;;;;OAKG;IACH,iGAQC;IAED;;;;;OAKG;IACH,qBAFW,MAAM,QAUhB;IAeD;;OAEG;IACH,mBAFW,qEAAM,QAWhB;IAYD;;OAEG;IACH,sFAEC;IAED,yBAEC;IAED;;OAEG;IACH,sCAKC;IAED;;;;OAIG;IACH,gCAqCC;;CA6xBJ;qBAtlC0D,gBAAgB;sBADrD,wBAAwB;0BAEpB,qBAAqB;sBAQzB,gBAAgB"}
+{"version":3,"file":"gridView.d.ts","sourceRoot":"","sources":["../../../../src/view/gridView/gridView.js"],"names":[],"mappings":"AAywCA;;GAEG;AACH,sHAUC;AA4DD;;;;;GAKG;AACH,4CAJW,OAAO,wBAAwB,EAAE,OAAO,UACxC,OAAO,oBAAoB,EAAE,UAAU,YACvC,QAAQ,aAmBlB;AA3zCD;;;;;;;;;;;;;;;;;;GAkBG;AACH,8BAH2D,KAAK,SAAnD,OAAQ,oBAAoB,EAAE,aAAc;IA6CrD;;;;;;;;;OASG;IACH,kBARW,KAAK,WACL,OAAO,4BAA4B,EAAE,OAAO,gBAC5C,aAAa,yFAEb,MAAM,WACN,MAAM,YACN,OAAO,YAAY,EAAE,WAAW,EAyC1C;IAtBG,uBAA0B;IAwB9B;;OAEG;IACH,6FAEC;IAED;;;;;;OAMG;IACH,4FAFa,SAAS,CAIrB;IAED;;;;;;;OAOG;IACH,oGAHW,MAAM,GACJ,SAAS,CASrB;IAED;;;;;OAKG;IACH,iGAQC;IAED;;;;;OAKG;IACH,qBAFW,MAAM,QAUhB;IAeD;;OAEG;IACH,mBAFW,qEAAM,QAWhB;IAYD;;OAEG;IACH,sFAEC;IAED,yBAEC;IAED;;OAEG;IACH,sCAKC;IAED;;;;OAIG;IACH,gCAqCC;;CAu4BJ;qBAjsC0D,gBAAgB;sBADrD,wBAAwB;0BAEpB,qBAAqB;sBAQzB,gBAAgB"}

package/dist/src/view/gridView/gridView.js

@@ -22,6 +22,7 @@ import GridChild from "./gridChild.js";
 import KeyboardZoomController from "./keyboardZoomController.js";
 import SeparatorView, { resolveSeparatorProps } from "./separatorView.js";
 import { getZoomableResolutions } from "./zoomNavigationUtils.js";
+import { isHConcatSpec, isVConcatSpec } from "../viewSpecGuards.js";
 
 // Secondary ordering within a z-index bucket for GridView-owned decorations.
 // These are not z-indices themselves: actual layering is decided first by the
@@ -995,12 +996,18 @@ export default class GridView extends ContainerView {
                 gridChild.coords.containsPoint(event.point.x, event.point.y)
             );
             const pointedView = pointedChild?.view;
+            const gapZoomTarget = !pointedChild
+                ? this.#getGapZoomTarget(event.point)
+                : undefined;
 
             if (event.type === "wheelclaimprobe") {
                 // Probe path: claim wheel ownership without executing regular wheel
                 // behavior. InteractionController uses this to decide whether native
                 // wheel should be preventDefault()'ed before inertia kicks in.
                 if (!pointedView) {
+                    if (gapZoomTarget) {
+                        event.claimWheel();
+                    }
                     return;
                 }
 
@@ -1038,6 +1045,9 @@ export default class GridView extends ContainerView {
             }
 
             if (!pointedView) {
+                if (gapZoomTarget) {
+                    this.#propagateGapZoomInteraction(event, gapZoomTarget);
+                }
                 return;
             }
 
@@ -1065,50 +1075,147 @@ export default class GridView extends ContainerView {
     }
 
     /**
-     *
-     * @param {import("../layout/rectangle.js").default} coords Coordinates
-     * @param {View} view
-     * @param {import("../zoom.js").ZoomEvent} zoomEvent
-     * @returns {boolean} `true` when there was at least one zoomable resolution
+     * @param {import("../layout/point.js").default} point
+     * @returns {{ coords: Rectangle, zoomableResolutions: ReturnType<typeof getZoomableResolutionSet> } | undefined}
      */
-    #handleZoom(coords, view, zoomEvent) {
-        let zoomable = false;
-        let changed = false;
+    #getGapZoomTarget(point) {
+        const channel = this.#getGapZoomChannel();
+        if (!channel) {
+            return;
+        }
 
-        const p = coords.normalizePoint(zoomEvent.x, zoomEvent.y);
-        const tp = coords.normalizePoint(
-            zoomEvent.x + zoomEvent.xDelta,
-            zoomEvent.y + zoomEvent.yDelta
-        );
-        const delta = {
-            x: tp.x - p.x,
-            y: tp.y - p.y,
+        const resolution = this.getScaleResolution(channel);
+        if (!resolution || !resolution.isZoomable()) {
+            return;
+        }
+
+        const coords = this.#getGapZoomCoords(channel);
+        if (!coords) {
+            return;
+        }
+
+        if (!coords.containsPoint(point.x, point.y)) {
+            return;
+        }
+
+        return {
+            coords,
+            zoomableResolutions: getZoomableResolutionSet(channel, resolution),
         };
+    }
 
-        for (const [channel, resolutionSet] of Object.entries(
-            getZoomableResolutions(view)
-        )) {
-            if (resolutionSet.size <= 0) {
-                continue;
+    /**
+     * @returns {import("../../spec/channel.js").PrimaryPositionalChannel | undefined}
+     */
+    #getGapZoomChannel() {
+        if (isVConcatSpec(this.spec)) {
+            return "x";
+        } else if (isHConcatSpec(this.spec)) {
+            return "y";
+        }
+    }
+
+    /**
+     * @param {import("../../spec/channel.js").PrimaryPositionalChannel} channel
+     * @returns {Rectangle | undefined}
+     */
+    #getGapZoomCoords(channel) {
+        const firstChild = this.#visibleChildren[0];
+        if (!firstChild) {
+            return;
+        }
+
+        const firstViewportCoords = firstChild.coords;
+        const firstExpandedCoords = firstChild.coords.expand(
+            firstChild.getOverhang()
+        );
+
+        let minX = firstViewportCoords.x;
+        let minY = firstExpandedCoords.y;
+        let maxX = firstViewportCoords.x2;
+        let maxY = firstExpandedCoords.y2;
+
+        for (const gridChild of this.#visibleChildren.slice(1)) {
+            const viewportCoords = gridChild.coords;
+            const expandedCoords = gridChild.coords.expand(
+                gridChild.getOverhang()
+            );
+
+            if (channel == "x") {
+                minX = Math.max(minX, viewportCoords.x);
+                maxX = Math.min(maxX, viewportCoords.x2);
+                minY = Math.min(minY, expandedCoords.y);
+                maxY = Math.max(maxY, expandedCoords.y2);
+            } else {
+                minX = Math.min(minX, expandedCoords.x);
+                maxX = Math.max(maxX, expandedCoords.x2);
+                minY = Math.max(minY, viewportCoords.y);
+                maxY = Math.min(maxY, viewportCoords.y2);
             }
+        }
 
-            zoomable = true;
+        for (const axisView of Object.values(this.#sharedAxes)) {
+            const axisCoords = axisView.coords;
+            if (!axisCoords) {
+                continue;
+            }
 
-            for (const resolution of resolutionSet) {
-                const resolutionChanged = resolution.zoom(
-                    2 ** zoomEvent.zDelta,
-                    channel == "y" ? 1 - p[channel] : p[channel],
-                    channel == "x" ? delta.x : -delta.y
-                );
-                changed = resolutionChanged || changed;
+            const orient = axisView.axisProps.orient;
+            if (channel == "x" && (orient == "top" || orient == "bottom")) {
+                minY = Math.min(minY, axisCoords.y);
+                maxY = Math.max(maxY, axisCoords.y2);
+            } else if (
+                channel == "y" &&
+                (orient == "left" || orient == "right")
+            ) {
+                minX = Math.min(minX, axisCoords.x);
+                maxX = Math.max(maxX, axisCoords.x2);
             }
         }
 
-        if (changed) {
-            this.context.animator.requestRender();
+        if (minX >= maxX || minY >= maxY) {
+            return;
         }
 
-        return zoomable;
+        return Rectangle.create(minX, minY, maxX - minX, maxY - minY);
+    }
+
+    /**
+     * @param {import("../../utils/interaction.js").default} event
+     * @param {{ coords: Rectangle, zoomableResolutions: ReturnType<typeof getZoomableResolutionSet> }} gapZoomTarget
+     */
+    #propagateGapZoomInteraction(event, gapZoomTarget) {
+        event.target = this;
+
+        interactionToZoom(
+            event,
+            gapZoomTarget.coords,
+            (zoomEvent) =>
+                zoomResolutions(
+                    gapZoomTarget.coords,
+                    zoomEvent,
+                    gapZoomTarget.zoomableResolutions,
+                    this.context.animator
+                ),
+            this.context.getCurrentHover(),
+            this.context.animator
+        );
+    }
+
+    /**
+     *
+     * @param {import("../layout/rectangle.js").default} coords Coordinates
+     * @param {View} view
+     * @param {import("../zoom.js").ZoomEvent} zoomEvent
+     * @returns {boolean} `true` when there was at least one zoomable resolution
+     */
+    #handleZoom(coords, view, zoomEvent) {
+        return zoomResolutions(
+            coords,
+            zoomEvent,
+            getZoomableResolutions(view),
+            this.context.animator
+        );
     }
 
     /**
@@ -1121,6 +1228,65 @@ export default class GridView extends ContainerView {
     }
 }
 
+/**
+ * @param {import("../../spec/channel.js").PrimaryPositionalChannel} channel
+ * @param {import("../../scales/scaleResolution.js").default} resolution
+ */
+function getZoomableResolutionSet(channel, resolution) {
+    const zoomableResolutions = {
+        x: new Set(),
+        y: new Set(),
+    };
+    zoomableResolutions[channel].add(resolution);
+    return zoomableResolutions;
+}
+
+/**
+ * @param {Rectangle} coords
+ * @param {import("../zoom.js").ZoomEvent} zoomEvent
+ * @param {ReturnType<typeof getZoomableResolutions>} zoomableResolutions
+ * @param {import("../../utils/animator.js").default} animator
+ */
+function zoomResolutions(coords, zoomEvent, zoomableResolutions, animator) {
+    let zoomable = false;
+    let changed = false;
+
+    const p = coords.normalizePoint(zoomEvent.x, zoomEvent.y);
+    const tp = coords.normalizePoint(
+        zoomEvent.x + zoomEvent.xDelta,
+        zoomEvent.y + zoomEvent.yDelta
+    );
+    const delta = {
+        x: tp.x - p.x,
+        y: tp.y - p.y,
+    };
+
+    for (const [channel, resolutionSet] of Object.entries(
+        zoomableResolutions
+    )) {
+        if (resolutionSet.size <= 0) {
+            continue;
+        }
+
+        zoomable = true;
+
+        for (const resolution of resolutionSet) {
+            const resolutionChanged = resolution.zoom(
+                2 ** zoomEvent.zDelta,
+                channel == "y" ? 1 - p[channel] : p[channel],
+                channel == "x" ? delta.x : -delta.y
+            );
+            changed = resolutionChanged || changed;
+        }
+    }
+
+    if (changed) {
+        animator.requestRender();
+    }
+
+    return zoomable;
+}
+
 /**
  * @param {View} view
  */

package/dist/src/view/gridView/scrollbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"scrollbar.d.ts","sourceRoot":"","sources":["../../../../src/view/gridView/scrollbar.js"],"names":[],"mappings":"AAMA;;;;;GAKG;AACH;IAwBI;;;;OAIG;IACH,uBAJW,OAAO,gBAAgB,EAAE,OAAO,mBAChC,eAAe,YACf;QAAE,sBAAsB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;KAAE,EA2H/D;IA1ID;;;;;;OAMG;IACH,uBAAmB;IAkDf;;;;MAAoB;IAmFxB,2BAEC;IAED;;;OAGG;IACH,yBAHW,MAAM,6BACN;QAAE,MAAM,CAAC,EAAE,OAAO,CAAC;QAAC,YAAY,CAAC,EAAE,OAAO,CAAA;KAAE,QAYtD;IAqFD;;;;;;;;;OASG;IACH,gCAHW,SAAS,iBACT,SAAS,QASnB;IAMG;;;;MAWC;;CAER;;;;;8BArSY,YAAY,GAAG,UAAU;qBAPjB,gBAAgB;sBADf,wBAAwB"}
+{"version":3,"file":"scrollbar.d.ts","sourceRoot":"","sources":["../../../../src/view/gridView/scrollbar.js"],"names":[],"mappings":"AASA;;;;;GAKG;AACH;IAwBI;;;;OAIG;IACH,uBAJW,OAAO,gBAAgB,EAAE,OAAO,mBAChC,eAAe,YACf;QAAE,sBAAsB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;KAAE,EA4H/D;IA3ID;;;;;;OAMG;IACH,uBAAmB;IAmDf;;;;MAAoB;IAmFxB,2BAEC;IAED;;;OAGG;IACH,yBAHW,MAAM,6BACN;QAAE,MAAM,CAAC,EAAE,OAAO,CAAC;QAAC,YAAY,CAAC,EAAE,OAAO,CAAA;KAAE,QAYtD;IAqFD;;;;;;;;;OASG;IACH,gCAHW,SAAS,iBACT,SAAS,QASnB;IAMG;;;;MAWC;;CAER;;;;;8BAtSY,YAAY,GAAG,UAAU;qBAVjB,gBAAgB;sBADf,wBAAwB"}

package/dist/src/view/gridView/scrollbar.js

@@ -2,7 +2,10 @@ import clamp from "../../utils/clamp.js";
 import { makeLerpSmoother } from "../../utils/animator.js";
 import Rectangle from "../layout/rectangle.js";
 import UnitView from "../unitView.js";
-import { markViewAsNonAddressable } from "../viewSelectors.js";
+import {
+    markViewAsChrome,
+    markViewAsNonAddressable,
+} from "../viewSelectors.js";
 
 /**
  * This class represents a scrollbar thumb that can be used within a grid view
@@ -78,6 +81,7 @@ export default class Scrollbar extends UnitView {
         );
 
         markViewAsNonAddressable(this, { skipSubtree: true });
+        markViewAsChrome(this, { skipSubtree: true });
 
         this.config = config;
         this.#scrollDirection = scrollDirection;

package/dist/src/view/gridView/selectionRect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"selectionRect.d.ts","sourceRoot":"","sources":["../../../../src/view/gridView/selectionRect.js"],"names":[],"mappings":"AAIA,yCAA0C,oBAAoB,CAAC;AAE/D;IACI;;;OAGG;IAEH;;;;OAIG;IACH,uBAJW,OAAO,gBAAgB,EAAE,OAAO,iBAChC,OAAO,6BAA6B,EAAE,eAAe,gBACrD,OAAO,yBAAyB,EAAE,WAAW,EA4KvD;IA1BG,qBAAqB;IACrB,SADW,MAAM,CACI;IA2BzB,oBAEC;CACJ;sBA/LqB,iBAAiB"}
+{"version":3,"file":"selectionRect.d.ts","sourceRoot":"","sources":["../../../../src/view/gridView/selectionRect.js"],"names":[],"mappings":"AAOA,yCAA0C,oBAAoB,CAAC;AAE/D;IACI;;;OAGG;IAEH;;;;OAIG;IACH,uBAJW,OAAO,gBAAgB,EAAE,OAAO,iBAChC,OAAO,6BAA6B,EAAE,eAAe,gBACrD,OAAO,yBAAyB,EAAE,WAAW,EA6KvD;IA3BG,qBAAqB;IACrB,SADW,MAAM,CACI;IA4BzB,oBAEC;CACJ;sBAnMqB,iBAAiB"}

package/dist/src/view/gridView/selectionRect.js

@@ -1,6 +1,9 @@
 import { primaryPositionalChannels } from "../../encoder/encoder.js";
 import LayerView from "../layerView.js";
-import { markViewAsNonAddressable } from "../viewSelectors.js";
+import {
+    markViewAsChrome,
+    markViewAsNonAddressable,
+} from "../viewSelectors.js";
 
 export const INTERVAL_DRAG_ACTIVE_PARAM = "intervalDragActive";
 
@@ -163,6 +166,7 @@ export default class SelectionRect extends LayerView {
         this._zindex = zindex;
 
         markViewAsNonAddressable(this, { skipSubtree: true });
+        markViewAsChrome(this, { skipSubtree: true });
 
         const selectionListener = () => {
             const selection =

package/dist/src/view/gridView/separatorView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"separatorView.d.ts","sourceRoot":"","sources":["../../../../src/view/gridView/separatorView.js"],"names":[],"mappings":"AAoOA;;;GAGG;AACH,iDAHW,OAAO,oBAAoB,EAAE,cAAc,GAAG,OAAO,GAAG,SAAS,GAC/D,OAAO,oBAAoB,EAAE,cAAc,GAAG,IAAI,CAiB9D;AAxOD;;GAEG;AACH;IAyBI;;;;;;;;;OASG;IACH,+EATW;QACN,SAAS,EAAE,kBAAkB,CAAC;QAC9B,KAAK,EAAE,OAAO,oBAAoB,EAAE,cAAc,CAAC;QACnD,OAAO,EAAE,OAAO,4BAA4B,EAAE,OAAO,CAAC;QACtD,YAAY,EAAE,OAAO,qBAAqB,EAAE,OAAO,CAAC;QACpD,UAAU,EAAE,OAAO,YAAY,EAAE,OAAO,CAAC;QACzC,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,CAAA;KACpC,EAuBH;IAED;;OAEG;IACH,YAFa,QAAQ,CAIpB;IAED,oBAEC;IAED;;;;;;;OAOG;IACH,mBAPW,OAAO,yBAAyB,EAAE,OAAO,EAAE,SAC3C,MAAM,UACN,OAAO,wBAAwB,EAAE,OAAO,eACxC,CAAC,SAAS,EAAE,KAAK,GAAG,QAAQ,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,iBACtD,OAAO,YACP,OAAO,sBAAsB,EAAE,OAAO,QAKhD;IAED;;;;OAIG;IACH,gBAJW,OAAO,6CAA6C,EAAE,OAAO,UAC7D,OAAO,wBAAwB,EAAE,OAAO,WACxC,OAAO,0BAA0B,EAAE,gBAAgB,QAI7D;;CAuHJ;iCA9NY,YAAY,GAAG,UAAU;qBAJjB,gBAAgB"}
+{"version":3,"file":"separatorView.d.ts","sourceRoot":"","sources":["../../../../src/view/gridView/separatorView.js"],"names":[],"mappings":"AAwOA;;;GAGG;AACH,iDAHW,OAAO,oBAAoB,EAAE,cAAc,GAAG,OAAO,GAAG,SAAS,GAC/D,OAAO,oBAAoB,EAAE,cAAc,GAAG,IAAI,CAiB9D;AAzOD;;GAEG;AACH;IAyBI;;;;;;;;;OASG;IACH,+EATW;QACN,SAAS,EAAE,kBAAkB,CAAC;QAC9B,KAAK,EAAE,OAAO,oBAAoB,EAAE,cAAc,CAAC;QACnD,OAAO,EAAE,OAAO,4BAA4B,EAAE,OAAO,CAAC;QACtD,YAAY,EAAE,OAAO,qBAAqB,EAAE,OAAO,CAAC;QACpD,UAAU,EAAE,OAAO,YAAY,EAAE,OAAO,CAAC;QACzC,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,CAAA;KACpC,EAuBH;IAED;;OAEG;IACH,YAFa,QAAQ,CAIpB;IAED,oBAEC;IAED;;;;;;;OAOG;IACH,mBAPW,OAAO,yBAAyB,EAAE,OAAO,EAAE,SAC3C,MAAM,UACN,OAAO,wBAAwB,EAAE,OAAO,eACxC,CAAC,SAAS,EAAE,KAAK,GAAG,QAAQ,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,iBACtD,OAAO,YACP,OAAO,sBAAsB,EAAE,OAAO,QAKhD;IAED;;;;OAIG;IACH,gBAJW,OAAO,6CAA6C,EAAE,OAAO,UAC7D,OAAO,wBAAwB,EAAE,OAAO,WACxC,OAAO,0BAA0B,EAAE,gBAAgB,QAI7D;;CAwHJ;iCA/NY,YAAY,GAAG,UAAU;qBAPjB,gBAAgB"}

package/dist/src/view/gridView/separatorView.js

@@ -1,5 +1,8 @@
 import UnitView from "../unitView.js";
-import { markViewAsNonAddressable } from "../viewSelectors.js";
+import {
+    markViewAsChrome,
+    markViewAsNonAddressable,
+} from "../viewSelectors.js";
 
 /**
  * @typedef {"horizontal" | "vertical"} SeparatorDirection
@@ -221,6 +224,7 @@ export default class SeparatorView {
         );
 
         markViewAsNonAddressable(view, { skipSubtree: true });
+        markViewAsChrome(view, { skipSubtree: true });
 
         return view;
     }

package/dist/src/view/resolutionPlanner.d.ts

@@ -0,0 +1,9 @@
+export function resolveViewResolutions(view: import("./unitView.js").default, type?: import("../spec/view.js").ResolutionTarget): void;
+export type ResolutionMember = {
+    view: import("./unitView.js").default;
+    channel: import("../spec/channel.js").Channel;
+    channelDef: import("../spec/channel.js").ChannelDefWithScale;
+    targetChannel: import("../spec/channel.js").ChannelWithScale;
+};
+export type ScaleResolutionMemberMap = Map<import("../scales/scaleResolution.js").default, ResolutionMember[]>;
+//# sourceMappingURL=resolutionPlanner.d.ts.map

package/dist/src/view/resolutionPlanner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolutionPlanner.d.ts","sourceRoot":"","sources":["../../../src/view/resolutionPlanner.js"],"names":[],"mappings":"AA8RO,6CAHI,OAAO,eAAe,EAAE,OAAO,SAC/B,OAAO,iBAAiB,EAAE,gBAAgB,QAiBpD;;UAhSS,OAAO,eAAe,EAAE,OAAO;aAC/B,OAAO,oBAAoB,EAAE,OAAO;gBACpC,OAAO,oBAAoB,EAAE,mBAAmB;mBAChD,OAAO,oBAAoB,EAAE,gBAAgB;;uCAI1C,GAAG,CAAC,OAAO,8BAA8B,EAAE,OAAO,EAAE,gBAAgB,EAAE,CAAC"}