@genome-spy/core 0.70.0 → 0.71.0

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

@@ -16,7 +16,9 @@ import LayerView from "../layerView.js";
 import UnitView from "../unitView.js";
 import { interactionToZoom } from "../zoom.js";
 import GridChild from "./gridChild.js";
+import KeyboardZoomController from "./keyboardZoomController.js";
 import SeparatorView, { resolveSeparatorProps } from "./separatorView.js";
+import { getZoomableResolutions } from "./zoomNavigationUtils.js";
 
 /**
  * Modeled after: https://vega.github.io/vega/docs/layout/
@@ -33,6 +35,9 @@ import SeparatorView, { resolveSeparatorProps } from "./separatorView.js";
  * - Zoom / pan
  * - Scrollable viewports (with scrollbars)
  * - And later on, brushing, legend(?)
+ *
+ * @template {import("../../spec/view.js").AnyConcatSpec} [TSpec=import("../../spec/view.js").AnyConcatSpec]
+ * @extends {ContainerView<TSpec>}
  */
 export default class GridView extends ContainerView {
     /**
@@ -73,9 +78,12 @@ export default class GridView extends ContainerView {
     /** @type {Partial<Record<"horizontal" | "vertical", SeparatorView>>} */
     #separatorViews = {};
 
+    /** @type {KeyboardZoomController | null} */
+    #keyboardZoomController = null;
+
     /**
      *
-     * @param {import("../../spec/view.js").AnyConcatSpec} spec
+     * @param {TSpec} spec
      * @param {import("../../types/viewContext.js").default} context
      * @param {ContainerView} layoutParent
      * @param {View} dataParent
@@ -115,6 +123,13 @@ export default class GridView extends ContainerView {
                 });
             }
         }
+
+        if (!this.layoutParent) {
+            this.#keyboardZoomController = new KeyboardZoomController({
+                context: this.context,
+                viewRoot: this,
+            });
+        }
     }
 
     /**
@@ -856,6 +871,7 @@ export default class GridView extends ContainerView {
         const pointedChild = this.#visibleChildren.find((gridChild) =>
             gridChild.coords.containsPoint(event.point.x, event.point.y)
         );
+        this.#keyboardZoomController?.handlePointerEvent(pointedChild, event);
 
         for (const scrollbar of Object.values(pointedChild?.scrollbars ?? {})) {
             if (scrollbar.coords.containsPoint(event.point.x, event.point.y)) {
@@ -949,31 +965,6 @@ export default class GridView extends ContainerView {
     }
 }
 
-/**
- *
- * @param {View} view
- * @returns
- */
-function getZoomableResolutions(view) {
-    /** @type {Record<import("../../spec/channel.js").PrimaryPositionalChannel, Set<import("../../scales/scaleResolution.js").default>>} */
-    const resolutions = {
-        x: new Set(),
-        y: new Set(),
-    };
-
-    // Find all resolutions (scales) that are candidates for zooming
-    view.visit((v) => {
-        for (const [channel, resolutionSet] of Object.entries(resolutions)) {
-            const resolution = v.getScaleResolution(channel);
-            if (resolution && resolution.isZoomable()) {
-                resolutionSet.add(resolution);
-            }
-        }
-    });
-
-    return resolutions;
-}
-
 /**
  * @param {View} view
  */

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

@@ -0,0 +1,21 @@
+/**
+ * Handles WASD keyboard navigation for the root grid view.
+ */
+export default class KeyboardZoomController {
+    /**
+     * @param {object} params
+     * @param {import("../../types/viewContext.js").default} params.context
+     * @param {import("../view.js").default} params.viewRoot
+     */
+    constructor({ context, viewRoot }: {
+        context: import("../../types/viewContext.js").default;
+        viewRoot: import("../view.js").default;
+    });
+    /**
+     * @param {import("./gridChild.js").default | undefined} pointedChild
+     * @param {import("../../utils/interactionEvent.js").default} event
+     */
+    handlePointerEvent(pointedChild: import("./gridChild.js").default | undefined, event: import("../../utils/interactionEvent.js").default): void;
+    #private;
+}
+//# sourceMappingURL=keyboardZoomController.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"keyboardZoomController.d.ts","sourceRoot":"","sources":["../../../../src/view/gridView/keyboardZoomController.js"],"names":[],"mappings":"AAIA;;GAEG;AACH;IAuDI;;;;OAIG;IACH,mCAHG;QAA6D,OAAO,EAA5D,OAAO,4BAA4B,EAAE,OAAO;QACP,QAAQ,EAA7C,OAAO,YAAY,EAAE,OAAO;KACtC,EAKA;IAED;;;OAGG;IACH,iCAHW,OAAO,gBAAgB,EAAE,OAAO,GAAG,SAAS,SAC5C,OAAO,iCAAiC,EAAE,OAAO,QA0B3D;;CA4DJ"}

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

@@ -0,0 +1,202 @@
+import KeyboardZoomMotion from "../../utils/keyboardZoomMotion.js";
+import { markZoomActivity } from "../zoom.js";
+import { getKeyboardZoomTarget } from "./zoomNavigationUtils.js";
+
+/**
+ * Handles WASD keyboard navigation for the root grid view.
+ */
+export default class KeyboardZoomController {
+    /** @type {import("../../types/viewContext.js").default} */
+    #context;
+
+    /** @type {import("../view.js").default} */
+    #viewRoot;
+
+    #zoomAnchorX = 0.5;
+
+    #keyboardZoomMotion = new KeyboardZoomMotion();
+
+    #keyboardNavigationActive = false;
+
+    #keyboardNavigationTimestamp = 0;
+
+    #keyboardNavigationStep = (/** @type {number} */ timestamp) => {
+        if (!this.#keyboardNavigationActive) {
+            return;
+        }
+
+        const resolution = getKeyboardZoomTarget(this.#viewRoot);
+        if (!resolution) {
+            this.#keyboardZoomMotion.reset();
+            this.#keyboardNavigationActive = false;
+            this.#keyboardNavigationTimestamp = 0;
+            return;
+        }
+
+        const dtMs = Math.max(0, timestamp - this.#keyboardNavigationTimestamp);
+        this.#keyboardNavigationTimestamp = timestamp;
+
+        const motion = this.#keyboardZoomMotion.step(dtMs);
+
+        if (motion.panDelta !== 0 || motion.zoomDelta !== 0) {
+            const changed = resolution.zoom(
+                2 ** motion.zoomDelta,
+                this.#zoomAnchorX,
+                motion.panDelta
+            );
+            if (changed) {
+                markZoomActivity();
+                this.#context.animator.requestRender();
+            }
+        }
+
+        if (motion.active) {
+            this.#context.animator.requestTransition(
+                this.#keyboardNavigationStep
+            );
+        } else {
+            this.#keyboardNavigationActive = false;
+            this.#keyboardNavigationTimestamp = 0;
+        }
+    };
+
+    /**
+     * @param {object} params
+     * @param {import("../../types/viewContext.js").default} params.context
+     * @param {import("../view.js").default} params.viewRoot
+     */
+    constructor({ context, viewRoot }) {
+        this.#context = context;
+        this.#viewRoot = viewRoot;
+        this.#setupKeyboardNavigation();
+    }
+
+    /**
+     * @param {import("./gridChild.js").default | undefined} pointedChild
+     * @param {import("../../utils/interactionEvent.js").default} event
+     */
+    handlePointerEvent(pointedChild, event) {
+        if (!pointedChild) {
+            return;
+        } else {
+            const viewWithAnchor =
+                /** @type {{getKeyboardZoomAnchorX?: (point: {x: number, y: number}) => number | undefined}} */ (
+                    pointedChild.view
+                );
+
+            if (typeof viewWithAnchor.getKeyboardZoomAnchorX === "function") {
+                const anchor = viewWithAnchor.getKeyboardZoomAnchorX(
+                    event.point
+                );
+                if (Number.isFinite(anchor)) {
+                    this.#zoomAnchorX = Math.max(0, Math.min(1, anchor));
+                }
+            } else {
+                const normalizedPoint = pointedChild.coords.normalizePoint(
+                    event.point.x,
+                    event.point.y
+                );
+                this.#zoomAnchorX = normalizedPoint.x;
+            }
+        }
+    }
+
+    #setupKeyboardNavigation() {
+        const addKeyboardListener = this.#context.addKeyboardListener;
+        if (typeof addKeyboardListener !== "function") {
+            return;
+        }
+
+        addKeyboardListener("keydown", (event) => {
+            if (shouldIgnoreKeyboardNavigation(event)) {
+                return;
+            }
+
+            if (!this.#keyboardZoomMotion.isNavigationKey(event.code)) {
+                return;
+            }
+
+            const resolution = getKeyboardZoomTarget(this.#viewRoot);
+            if (!resolution) {
+                return;
+            }
+
+            const changed = this.#keyboardZoomMotion.handleKeyDown(event.code);
+            if (!changed) {
+                return;
+            }
+
+            event.preventDefault();
+            this.#activateKeyboardNavigation();
+        });
+
+        addKeyboardListener("keyup", (event) => {
+            if (!this.#keyboardZoomMotion.isNavigationKey(event.code)) {
+                return;
+            }
+
+            const changed = this.#keyboardZoomMotion.handleKeyUp(event.code);
+            if (!changed) {
+                return;
+            }
+
+            const resolution = getKeyboardZoomTarget(this.#viewRoot);
+            if (!resolution) {
+                return;
+            }
+
+            event.preventDefault();
+            this.#activateKeyboardNavigation();
+        });
+    }
+
+    #activateKeyboardNavigation() {
+        if (this.#keyboardNavigationActive) {
+            return;
+        }
+
+        this.#keyboardNavigationActive = true;
+        this.#keyboardNavigationTimestamp = performance.now();
+        this.#context.animator.requestTransition(this.#keyboardNavigationStep);
+    }
+}
+
+/**
+ * @param {KeyboardEvent} event
+ */
+function shouldIgnoreKeyboardNavigation(event) {
+    if (event.altKey || event.ctrlKey || event.metaKey) {
+        return true;
+    }
+
+    if (isEditableTarget(event.target)) {
+        return true;
+    }
+
+    return false;
+}
+
+/**
+ * @param {EventTarget | null} target
+ */
+function isEditableTarget(target) {
+    if (!target || typeof target !== "object") {
+        return false;
+    }
+
+    const candidate =
+        /** @type {{isContentEditable?: boolean, nodeName?: string}} */ (
+            target
+        );
+
+    if (candidate.isContentEditable) {
+        return true;
+    }
+
+    if (typeof candidate.nodeName === "string") {
+        const name = candidate.nodeName.toLowerCase();
+        return name === "input" || name === "textarea" || name === "select";
+    }
+
+    return false;
+}

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

@@ -4,7 +4,7 @@
  *
  * @typedef {"horizontal" | "vertical"} ScrollDirection
  */
-export default class Scrollbar extends UnitView {
+export default class Scrollbar extends UnitView<import("../../spec/view.js").UnitSpec> {
     /**
      * @param {import("./gridChild.js").default} gridChild
      * @param {ScrollDirection} scrollDirection

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,EA0H/D;IAzID;;;;;;OAMG;IACH,uBAAmB;IAmDf;;;;MAAoB;IAiFxB,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;;;;;8BApSY,YAAY,GAAG,UAAU;qBAPjB,gBAAgB;sBADf,wBAAwB"}
+{"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,EAyH/D;IAxID;;;;;;OAMG;IACH,uBAAmB;IAkDf;;;;MAAoB;IAiFxB,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;;;;;8BAnSY,YAAY,GAAG,UAAU;qBAPjB,gBAAgB;sBADf,wBAAwB"}

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

@@ -67,7 +67,6 @@ export default class Scrollbar extends UnitView {
                     cornerRadius: 5,
                     clip: false,
                 },
-                configurableVisibility: false,
             },
             gridChild.layoutParent.context,
             gridChild.layoutParent,

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

@@ -1,4 +1,4 @@
-export default class SelectionRect extends LayerView {
+export default class SelectionRect extends LayerView<import("../../spec/view.js").LayerSpec> {
     /**
      * @typedef {import("../../spec/channel.js").PrimaryPositionalChannel} PrimaryPositionalChannel
      * @typedef {import("../../types/selectionTypes.js").IntervalSelection} IntervalSelection

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;IACI;;;OAGG;IAEH;;;;OAIG;IACH,uBAJW,OAAO,gBAAgB,EAAE,OAAO,iBAChC,OAAO,6BAA6B,EAAE,eAAe,gBACrD,OAAO,yBAAyB,EAAE,WAAW,EAgKvD;CACJ;sBA7KqB,iBAAiB"}
+{"version":3,"file":"selectionRect.d.ts","sourceRoot":"","sources":["../../../../src/view/gridView/selectionRect.js"],"names":[],"mappings":"AAIA;IACI;;;OAGG;IAEH;;;;OAIG;IACH,uBAJW,OAAO,gBAAgB,EAAE,OAAO,iBAChC,OAAO,6BAA6B,EAAE,eAAe,gBACrD,OAAO,yBAAyB,EAAE,WAAW,EA+JvD;CACJ;sBA5KqB,iBAAiB"}

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

@@ -28,7 +28,6 @@ export default class SelectionRect extends LayerView {
         /** @type {import("../../spec/view.js").LayerSpec} */
         const layerSpec = {
             name: "selectionRect",
-            configurableVisibility: false,
             domainInert: true,
             resolve: {
                 scale: {

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

@@ -244,7 +244,6 @@ export function resolveSeparatorProps(separator) {
  */
 function createSeparatorSpec(props) {
     return {
-        configurableVisibility: false,
         domainInert: true,
         data: { values: [] },
         resolve: {

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

@@ -0,0 +1,19 @@
+/**
+ * @typedef {import("../view.js").default} View
+ */
+/**
+ * Finds all zoomable positional resolutions in a subtree.
+ *
+ * @param {View} view
+ * @returns {Record<import("../../spec/channel.js").PrimaryPositionalChannel, Set<import("../../scales/scaleResolution.js").default>>}
+ */
+export function getZoomableResolutions(view: View): Record<import("../../spec/channel.js").PrimaryPositionalChannel, Set<import("../../scales/scaleResolution.js").default>>;
+/**
+ * Returns the keyboard zoom target when exactly one zoomable x-resolution is
+ * present in the hierarchy and it is resolved to the root view.
+ *
+ * @param {View} viewRoot
+ */
+export function getKeyboardZoomTarget(viewRoot: View): any;
+export type View = import("../view.js").default;
+//# sourceMappingURL=zoomNavigationUtils.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"zoomNavigationUtils.d.ts","sourceRoot":"","sources":["../../../../src/view/gridView/zoomNavigationUtils.js"],"names":[],"mappings":"AAAA;;GAEG;AAEH;;;;;GAKG;AACH,6CAHW,IAAI,GACF,MAAM,CAAC,OAAO,uBAAuB,EAAE,wBAAwB,EAAE,GAAG,CAAC,OAAO,iCAAiC,EAAE,OAAO,CAAC,CAAC,CAoBpI;AAED;;;;;GAKG;AACH,gDAFW,IAAI,OAgBd;mBAjDY,OAAO,YAAY,EAAE,OAAO"}

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

@@ -0,0 +1,51 @@
+/**
+ * @typedef {import("../view.js").default} View
+ */
+
+/**
+ * Finds all zoomable positional resolutions in a subtree.
+ *
+ * @param {View} view
+ * @returns {Record<import("../../spec/channel.js").PrimaryPositionalChannel, Set<import("../../scales/scaleResolution.js").default>>}
+ */
+export function getZoomableResolutions(view) {
+    /** @type {Record<import("../../spec/channel.js").PrimaryPositionalChannel, Set<import("../../scales/scaleResolution.js").default>>} */
+    const resolutions = {
+        x: new Set(),
+        y: new Set(),
+    };
+
+    // Find all resolutions (scales) that are candidates for zooming
+    view.visit((v) => {
+        for (const [channel, resolutionSet] of Object.entries(resolutions)) {
+            const resolution = v.getScaleResolution(channel);
+            if (resolution && resolution.isZoomable()) {
+                resolutionSet.add(resolution);
+            }
+        }
+    });
+
+    return resolutions;
+}
+
+/**
+ * Returns the keyboard zoom target when exactly one zoomable x-resolution is
+ * present in the hierarchy and it is resolved to the root view.
+ *
+ * @param {View} viewRoot
+ */
+export function getKeyboardZoomTarget(viewRoot) {
+    const xResolutions = getZoomableResolutions(viewRoot).x;
+    if (xResolutions.size !== 1) {
+        return;
+    } else {
+        const target = xResolutions.values().next().value;
+        const rootXResolution = viewRoot.getScaleResolution("x");
+
+        if (!rootXResolution || rootXResolution !== target) {
+            return;
+        } else {
+            return target;
+        }
+    }
+}

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

@@ -1,15 +1,18 @@
-export default class LayerView extends ContainerView {
+/**
+ * @template {import("../spec/view.js").LayerSpec} [TSpec=import("../spec/view.js").LayerSpec]
+ * @extends {ContainerView<TSpec>}
+ */
+export default class LayerView<TSpec extends import("../spec/view.js").LayerSpec = import("../spec/view.js").LayerSpec> extends ContainerView<TSpec> {
     /**
      *
-     * @param {import("../spec/view.js").LayerSpec} spec
+     * @param {TSpec} spec
      * @param {import("../types/viewContext.js").default} context
      * @param {ContainerView} layoutParent
      * @param {import("./view.js").default} dataParent
      * @param {string} name
      * @param {import("./view.js").ViewOptions} [options]
      */
-    constructor(spec: import("../spec/view.js").LayerSpec, context: import("../types/viewContext.js").default, layoutParent: ContainerView, dataParent: import("./view.js").default, name: string, options?: import("./view.js").ViewOptions);
-    spec: import("../spec/view.js").LayerSpec;
+    constructor(spec: TSpec, context: import("../types/viewContext.js").default, layoutParent: ContainerView, dataParent: import("./view.js").default, name: string, options?: import("./view.js").ViewOptions);
     /**
      * Adds a child spec dynamically. Intended for post-initialization updates.
      *
@@ -24,7 +27,7 @@ export default class LayerView extends ContainerView {
      * @param {number} index
      */
     removeChildAt(index: number): Promise<void>;
-    get children(): (import("./unitView.js").default | LayerView)[];
+    get children(): (import("./unitView.js").default<import("../spec/view.js").UnitSpec> | LayerView<import("../spec/view.js").LayerSpec>)[];
     #private;
 }
 import ContainerView from "./containerView.js";

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

@@ -1 +1 @@
-{"version":3,"file":"layerView.d.ts","sourceRoot":"","sources":["../../../src/view/layerView.js"],"names":[],"mappings":"AAMA;IAQI;;;;;;;;OAQG;IACH,kBAPW,OAAO,iBAAiB,EAAE,SAAS,WACnC,OAAO,yBAAyB,EAAE,OAAO,gBACzC,aAAa,cACb,OAAO,WAAW,EAAE,OAAO,QAC3B,MAAM,YACN,OAAO,WAAW,EAAE,WAAW,EAWzC;IAHG,0CAAgB;IAqCpB;;;;;;OAMG;IACH,wBAJW,OAAO,iBAAiB,EAAE,SAAS,GAAG,OAAO,iBAAiB,EAAE,QAAQ,GAAG,OAAO,iBAAiB,EAAE,UAAU,UAC/G,MAAM,GACJ,OAAO,CAAC,SAAS,GAAG,OAAO,eAAe,EAAE,OAAO,CAAC,CAMhE;IAED;;;;OAIG;IACH,qBAFW,MAAM,iBAIhB;IA6CD,gEAEC;;CA6CJ;0BAjLyB,oBAAoB"}
+{"version":3,"file":"layerView.d.ts","sourceRoot":"","sources":["../../../src/view/layerView.js"],"names":[],"mappings":"AAMA;;;GAGG;AACH,+BAHoD,KAAK,SAA5C,OAAQ,iBAAiB,EAAE,SAAU;IAW9C;;;;;;;;OAQG;IACH,kBAPW,KAAK,WACL,OAAO,yBAAyB,EAAE,OAAO,gBACzC,aAAa,cACb,OAAO,WAAW,EAAE,OAAO,QAC3B,MAAM,YACN,OAAO,WAAW,EAAE,WAAW,EAWzC;IAkCD;;;;;;OAMG;IACH,wBAJW,OAAO,iBAAiB,EAAE,SAAS,GAAG,OAAO,iBAAiB,EAAE,QAAQ,GAAG,OAAO,iBAAiB,EAAE,UAAU,UAC/G,MAAM,GACJ,OAAO,CAAC,SAAS,GAAG,OAAO,eAAe,EAAE,OAAO,CAAC,CAMhE;IAED;;;;OAIG;IACH,qBAFW,MAAM,iBAIhB;IA6CD,yIAEC;;CA6CJ;0BAtLyB,oBAAoB"}

package/dist/src/view/layerView.js

@@ -1,9 +1,13 @@
-import { isLayerSpec, isUnitSpec } from "./viewFactory.js";
 import ContainerView from "./containerView.js";
 import ViewError from "./viewError.js";
 import ContainerMutationHelper from "./containerMutationHelper.js";
 import { isMultiscaleSpec } from "./multiscale.js";
+import { isLayerSpec, isUnitSpec } from "./viewSpecGuards.js";
 
+/**
+ * @template {import("../spec/view.js").LayerSpec} [TSpec=import("../spec/view.js").LayerSpec]
+ * @extends {ContainerView<TSpec>}
+ */
 export default class LayerView extends ContainerView {
     /**
      * @typedef {import("./view.js").default} View
@@ -14,7 +18,7 @@ export default class LayerView extends ContainerView {
 
     /**
      *
-     * @param {import("../spec/view.js").LayerSpec} spec
+     * @param {TSpec} spec
      * @param {import("../types/viewContext.js").default} context
      * @param {ContainerView} layoutParent
      * @param {import("./view.js").default} dataParent

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

@@ -1 +1 @@
-{"version":3,"file":"title.d.ts","sourceRoot":"","sources":["../../../src/view/title.js"],"names":[],"mappings":"AAuDA;;;GAGG;AACH,2CAHW,MAAM,GAAG,OAAO,kBAAkB,EAAE,KAAK,GACvC,OAAO,iBAAiB,EAAE,QAAQ,CA2G9C"}
+{"version":3,"file":"title.d.ts","sourceRoot":"","sources":["../../../src/view/title.js"],"names":[],"mappings":"AAuDA;;;GAGG;AACH,2CAHW,MAAM,GAAG,OAAO,kBAAkB,EAAE,KAAK,GACvC,OAAO,iBAAiB,EAAE,QAAQ,CA0G9C"}

package/dist/src/view/title.js

@@ -138,7 +138,6 @@ export default function createTitle(title) {
     }
 
     return {
-        configurableVisibility: false,
         data: { values: [{}] },
         mark: {
             type: "text",

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

@@ -4,18 +4,21 @@
  * TODO: Find a proper place, make extendible
  */
 export const markTypes: Record<import("../spec/mark.js").MarkType, typeof import("../marks/mark.js").default>;
-export default class UnitView extends View {
+/**
+ * @template {import("../spec/view.js").UnitSpec} [TSpec=import("../spec/view.js").UnitSpec]
+ * @extends {View<TSpec>}
+ */
+export default class UnitView<TSpec extends import("../spec/view.js").UnitSpec = import("../spec/view.js").UnitSpec> extends View<TSpec> {
     /**
      *
-     * @param {import("../spec/view.js").UnitSpec} spec
+     * @param {TSpec} spec
      * @param {import("../types/viewContext.js").default} context
      * @param {import("./containerView.js").default} layoutParent
      * @param {import("./view.js").default} dataParent
      * @param {string} name
      * @param {import("./view.js").ViewOptions} [options]
      */
-    constructor(spec: import("../spec/view.js").UnitSpec, context: import("../types/viewContext.js").default, layoutParent: import("./containerView.js").default, dataParent: import("./view.js").default, name: string, options?: import("./view.js").ViewOptions);
-    spec: import("../spec/view.js").UnitSpec;
+    constructor(spec: TSpec, context: import("../types/viewContext.js").default, layoutParent: import("./containerView.js").default, dataParent: import("./view.js").default, name: string, options?: import("./view.js").ViewOptions);
     /** @type {import("../marks/mark.js").default} */
     mark: import("../marks/mark.js").default;
     getMarkType(): "link" | "rect" | "text" | "point" | "rule";

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

@@ -1 +1 @@
-{"version":3,"file":"unitView.d.ts","sourceRoot":"","sources":["../../../src/view/unitView.js"],"names":[],"mappings":"AA+BA;;;;GAIG;AACH,wBAHU,MAAM,CAAC,OAAO,iBAAiB,EAAE,QAAQ,EAAE,cAAc,kBAAkB,EAAE,OAAO,CAAC,CAc7F;AAEF;IAwBI;;;;;;;;OAQG;IACH,kBAPW,OAAO,iBAAiB,EAAE,QAAQ,WAClC,OAAO,yBAAyB,EAAE,OAAO,gBACzC,OAAO,oBAAoB,EAAE,OAAO,cACpC,OAAO,WAAW,EAAE,OAAO,QAC3B,MAAM,YACN,OAAO,WAAW,EAAE,WAAW,EAyCzC;IApCG,yCAAgB;IAIZ,iDAAiD;IACjD,MADW,OAAO,kBAAkB,EAAE,OAAO,CACnB;IAyKlC,2DAIC;IAoBD;;;;;OAKG;IAEH,iEAqJC;IAUD;;;;;OAKG;IACH,4IAMC;IAED;;;;OAIG;IACH,sBAFa,OAAO,WAAW,EAAE,UAAU,EAAE,CAS5C;IAkBD;;OAEG;IACH,uDAEC;IAED;;OAEG;IACH,oCA0EC;IAED,uBAQC;IAgBD;;;;OAIG;IACH,8BAJW,MAAM,+DAEJ,OAAO,iBAAiB,EAAE,kBAAkB,CAKxD;;CACJ;iBAllBgB,WAAW"}
+{"version":3,"file":"unitView.d.ts","sourceRoot":"","sources":["../../../src/view/unitView.js"],"names":[],"mappings":"AA+BA;;;;GAIG;AACH,wBAHU,MAAM,CAAC,OAAO,iBAAiB,EAAE,QAAQ,EAAE,cAAc,kBAAkB,EAAE,OAAO,CAAC,CAc7F;AAEF;;;GAGG;AACH,8BAHmD,KAAK,SAA3C,OAAQ,iBAAiB,EAAE,QAAS;IA2B7C;;;;;;;;OAQG;IACH,kBAPW,KAAK,WACL,OAAO,yBAAyB,EAAE,OAAO,gBACzC,OAAO,oBAAoB,EAAE,OAAO,cACpC,OAAO,WAAW,EAAE,OAAO,QAC3B,MAAM,YACN,OAAO,WAAW,EAAE,WAAW,EAyCzC;IAhCO,iDAAiD;IACjD,MADW,OAAO,kBAAkB,EAAE,OAAO,CACnB;IAyKlC,2DAIC;IAoBD;;;;;OAKG;IAEH,iEAqJC;IAUD;;;;;OAKG;IACH,4IAMC;IAED;;;;OAIG;IACH,sBAFa,OAAO,WAAW,EAAE,UAAU,EAAE,CAS5C;IAkBD;;OAEG;IACH,uDAEC;IAED;;OAEG;IACH,oCA0EC;IAED,uBAQC;IAgBD;;;;OAIG;IACH,8BAJW,MAAM,+DAEJ,OAAO,iBAAiB,EAAE,kBAAkB,CAKxD;;CACJ;iBAtlBgB,WAAW"}

package/dist/src/view/unitView.js

@@ -47,6 +47,10 @@ export const markTypes = {
     text: TextMark,
 };
 
+/**
+ * @template {import("../spec/view.js").UnitSpec} [TSpec=import("../spec/view.js").UnitSpec]
+ * @extends {View<TSpec>}
+ */
 export default class UnitView extends View {
     /**
      * @typedef {import("../spec/channel.js").Channel} Channel
@@ -73,7 +77,7 @@ export default class UnitView extends View {
 
     /**
      *
-     * @param {import("../spec/view.js").UnitSpec} spec
+     * @param {TSpec} spec
      * @param {import("../types/viewContext.js").default} context
      * @param {import("./containerView.js").default} layoutParent
      * @param {import("./view.js").default} dataParent

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

@@ -31,10 +31,13 @@ export const VISIT_STOP: "VISIT_STOP";
  *      View's children are layered on top of each other and they have the same
  *      coordinates as their parent.
  */
-export default class View {
+/**
+ * @template {import("../spec/view.js").ViewSpec} [TSpec=import("../spec/view.js").ViewSpec]
+ */
+export default class View<TSpec extends import("../spec/view.js").ViewSpec = import("../spec/view.js").ViewSpec> {
     /**
      *
-     * @param {import("../spec/view.js").ViewSpec} spec
+     * @param {TSpec} spec
      * @param {import("../types/viewContext.js").default} context
      * @param {import("./containerView.js").default} layoutParent Parent that handles rendering of this view
      * @param {import("./view.js").default} dataParent Parent that provides data, encodings, and is used in scale resolution
@@ -42,7 +45,9 @@ export default class View {
      * @param {ViewOptions} [options]
      *
      */
-    constructor(spec: import("../spec/view.js").ViewSpec, context: import("../types/viewContext.js").default, layoutParent: import("./containerView.js").default, dataParent: import("./view.js").default, name: string, options?: ViewOptions);
+    constructor(spec: TSpec, context: import("../types/viewContext.js").default, layoutParent: import("./containerView.js").default, dataParent: import("./view.js").default, name: string, options?: ViewOptions);
+    /** @type {TSpec} */
+    spec: TSpec;
     /**
      * @type {function(number):number}
      */
@@ -55,9 +60,8 @@ export default class View {
      */
     facetCoords: Map<any, import("./layout/rectangle.js").default>;
     context: import("../types/viewContext.js").default;
-    layoutParent: import("./containerView.js").default;
-    dataParent: View;
-    spec: import("../spec/view.js").ViewSpec;
+    layoutParent: import("./containerView.js").default<import("../spec/view.js").ContainerSpec>;
+    dataParent: View<import("../spec/view.js").ViewSpec>;
     resolutions: {
         /**
          * Channel-specific scale resolutions
@@ -183,11 +187,11 @@ export default class View {
     /**
      * Returns the ancestor views, starting with this view.
      */
-    getLayoutAncestors(): View[];
+    getLayoutAncestors(): View<import("../spec/view.js").ViewSpec>[];
     /**
      * Returns the ancestor views, starting with this view.
      */
-    getDataAncestors(): View[];
+    getDataAncestors(): View<import("../spec/view.js").ViewSpec>[];
     /**
      * Handles a broadcast message that is intended for the whole view hierarchy.
      *
@@ -241,7 +245,7 @@ export default class View {
     /**
      * Get this view and all descendants in depth-first order.
      */
-    getDescendants(): View[];
+    getDescendants(): View<import("../spec/view.js").ViewSpec>[];
     /**
      * Release resources owned by this view.
      */