Documentation / @ripl/dom / DOMNavigator

Class: DOMNavigator

Defined in: dom/src/navigator.ts:84

DOM-bound Navigator that translates real wheel/pointer/touch gestures into the base navigator's imperative commands — the pan/zoom/brush analogue of how DOMContext adds real event listeners on top of the abstract Context. The base class in @ripl/core owns the view model and stays context-agnostic; this subclass owns input.

The gesture model is intentionally Figma-like so a navigator can roam a scene freely:

• click-and-hold drag (left or middle button, with or without ⌘/Ctrl) pans the view;
• wheel zooms toward the pointer, and a two-finger pinch zooms toward the gesture centre;
• ⇧ shift-drag brushes a rectangular selection when brushing is enabled.

Because the base transform is unbounded, dragging past the viewport edge (the pointer is captured for the duration of the drag) keeps panning, so content outside the current viewport can be reached — then re-framed with the base centerOn/fitBounds helpers.

Extends

• Navigator

Constructors

Constructor

new DOMNavigator(context, options?): DOMNavigator

Defined in: dom/src/navigator.ts:97

Parameters

Parameter	Type
context	Context
options?	DOMNavigatorOptions

Returns

DOMNavigator

Overrides

Navigator.constructor

Properties

Property	Modifier	Type	Default value	Description	Inherited from	Defined in
_brush	protected	NavigatorBrush | null	null	-	Navigator._brush	core/src/core/navigator.ts:141
_scaleExtent	protected	[number, number]	undefined	-	Navigator._scaleExtent	core/src/core/navigator.ts:142
_transform	protected	NavigatorTransform	undefined	-	Navigator._transform	core/src/core/navigator.ts:135
_viewport	protected	NavigatorViewport	undefined	-	Navigator._viewport	core/src/core/navigator.ts:143
parent?	public	EventBus<NavigatorEventMap>	undefined	The parent event bus that emitted events bubble up to, if any.	Navigator.parent	core/src/core/event-bus.ts:89
defaultKey	readonly	typeof defaultKey	undefined	The key under which resources are retained when no explicit key is provided.	Navigator.defaultKey	core/src/core/disposer.ts:11

Accessors

brush

Get Signature

get brush(): NavigatorBrush | null

Defined in: core/src/core/navigator.ts:163

The current brush selection, or null when nothing is selected.

Returns

NavigatorBrush | null

Inherited from

Navigator.brush

---

scaleExtent

Get Signature

get scaleExtent(): [number, number]

Defined in: core/src/core/navigator.ts:170

The minimum/maximum zoom factor the transform is clamped to.

Returns

[number, number]

Inherited from

Navigator.scaleExtent

---

transform

Get Signature

get transform(): NavigatorTransform

Defined in: core/src/core/navigator.ts:156

The current view transform (a copy — mutating it does not affect the navigator).

Returns

NavigatorTransform

Inherited from

Navigator.transform

---

viewport

Get Signature

get viewport(): NavigatorViewport

Defined in: core/src/core/navigator.ts:177

The viewport dimensions used by centerOn/fitBounds.

Returns

NavigatorViewport

Set Signature

set viewport(viewport): void

Defined in: core/src/core/navigator.ts:183

Parameters

Parameter	Type
viewport	NavigatorViewport

Returns

void

Inherited from

Navigator.viewport

Methods

_commit()

protected _commit(event): void

Defined in: core/src/core/navigator.ts:189

Parameters

Parameter	Type
event	"zoom" | "pan"

Returns

void

Inherited from

Navigator._commit

---

applyPoint()

applyPoint(point): Point

Defined in: core/src/core/navigator.ts:197

Applies the transform to a point in content space, returning its on-screen position.

Parameters

Parameter	Type
point	Point

Returns

Point

Inherited from

Navigator.applyPoint

---

centerOn()

centerOn(point, viewport?): void

Defined in: core/src/core/navigator.ts:268

Centres a content-space point within the viewport, keeping the current zoom. Useful for bringing an off-screen element into view without changing scale.

Parameters

Parameter	Type
point	Point
viewport	NavigatorViewport

Returns

void

Inherited from

Navigator.centerOn

---

clearBrush()

clearBrush(): void

Defined in: core/src/core/navigator.ts:336

Clears the brush selection and emits a brushend event with null.

Returns

void

Inherited from

Navigator.clearBrush

---

destroy()

destroy(): void

Defined in: dom/src/navigator.ts:300

Detaches all interaction listeners and disposes the navigator.

Returns

void

Overrides

Navigator.destroy

---

dispose()

protected dispose(key?): void

Defined in: core/src/core/disposer.ts:25

Disposes all resources under the given key, or all resources if no key is provided.

Parameters

Parameter	Type
key?	PropertyKey

Returns

void

Inherited from

Navigator.dispose

---

emit()

Call Signature

emit<TEvent>(event): TEvent

Defined in: core/src/core/event-bus.ts:137

Emits an event, invoking all matching handlers and bubbling to the parent if applicable.

Type Parameters

Type Parameter	Default type
TEvent extends Event<undefined>	Event<undefined>

Parameters

Parameter	Type
event	TEvent

Returns

TEvent

Inherited from

Navigator.emit

Call Signature

emit<TEvent>(type, data): Event<NavigatorEventMap[TEvent]>

Defined in: core/src/core/event-bus.ts:138

Emits an event, invoking all matching handlers and bubbling to the parent if applicable.

Type Parameters

Type Parameter
TEvent extends keyof NavigatorEventMap

Parameters

Parameter	Type
type	TEvent
data	NavigatorEventMap[TEvent]

Returns

Event<NavigatorEventMap[TEvent]>

Inherited from

Navigator.emit

---

fitBounds()

fitBounds(bounds, options?): void

Defined in: core/src/core/navigator.ts:285

Zooms and pans so a content-space box fills the viewport (respecting the scale extent and an optional padding). This is the primary way to jump the view to content — including content that currently lies entirely outside the viewport.

Parameters

Parameter	Type
bounds	NavigatorBrush
options?	NavigatorFitOptions

Returns

void

Inherited from

Navigator.fitBounds

---

has()

has(type): boolean

Defined in: core/src/core/event-bus.ts:94

Returns whether there are any listeners registered for the given event type.

Parameters

Parameter	Type
type	keyof NavigatorEventMap

Returns

boolean

Inherited from

Navigator.has

---

invertPoint()

invertPoint(point): Point

Defined in: core/src/core/navigator.ts:205

Inverts a screen-space point back to content space.

Parameters

Parameter	Type
point	Point

Returns

Point

Inherited from

Navigator.invertPoint

---

off()

off<TEvent>(type, handler): void

Defined in: core/src/core/event-bus.ts:112

Removes a previously registered handler for the given event type.

Type Parameters

Type Parameter
TEvent extends keyof NavigatorEventMap

Parameters

Parameter	Type
type	TEvent
handler	EventHandler<NavigatorEventMap[TEvent]>

Returns

void

Inherited from

Navigator.off

---

on()

on<TEvent>(type, handler, options?): Disposable

Defined in: core/src/core/event-bus.ts:99

Subscribes a handler to the given event type and returns a disposable for cleanup.

Type Parameters

Type Parameter
TEvent extends keyof NavigatorEventMap

Parameters

Parameter	Type
type	TEvent
handler	EventHandler<NavigatorEventMap[TEvent]>
options?	EventSubscriptionOptions

Returns

Disposable

Inherited from

Navigator.on

---

once()

once<TEvent>(type, handler, options?): Disposable

Defined in: core/src/core/event-bus.ts:127

Subscribes a handler that is automatically removed after it fires once.

Type Parameters

Type Parameter
TEvent extends keyof NavigatorEventMap

Parameters

Parameter	Type
type	TEvent
handler	EventHandler<NavigatorEventMap[TEvent]>
options?	EventSubscriptionOptions

Returns

Disposable

Inherited from

Navigator.once

---

panBy()

panBy(dx, dy): void

Defined in: core/src/core/navigator.ts:224

Pans the view by a pixel delta.

Parameters

Parameter	Type
dx	number
dy	number

Returns

void

Inherited from

Navigator.panBy

---

panTo()

panTo(x, y): void

Defined in: core/src/core/navigator.ts:235

Pans the view to an absolute translation.

Parameters

Parameter	Type
x	number
y	number

Returns

void

Inherited from

Navigator.panTo

---

reset()

reset(): void

Defined in: core/src/core/navigator.ts:313

Resets the transform to the identity (no zoom, no pan).

Returns

void

Inherited from

Navigator.reset

---

retain()

protected retain(value, key?): void

Defined in: core/src/core/disposer.ts:14

Registers a disposable resource under an optional key for later cleanup.

Parameters

Parameter	Type	Default value
value	Disposable	undefined
key	PropertyKey	Disposer.defaultKey

Returns

void

Inherited from

Navigator.retain

---

setBrush()

setBrush(brush): void

Defined in: core/src/core/navigator.ts:324

Sets the brush selection, normalising the extent, and emits a brush event.

Parameters

Parameter	Type
brush	NavigatorBrush

Returns

void

Inherited from

Navigator.setBrush

---

setTransform()

setTransform(transform): void

Defined in: core/src/core/navigator.ts:213

Replaces the view transform outright (clamping k to the scale extent).

Parameters

Parameter	Type
transform	NavigatorTransform

Returns

void

Inherited from

Navigator.setTransform

---

zoomBy()

zoomBy(factor, center?): void

Defined in: core/src/core/navigator.ts:246

Multiplies the zoom by factor, keeping center (screen pixels, defaults to the origin) fixed.

Parameters

Parameter	Type
factor	number
center	Point

Returns

void

Inherited from

Navigator.zoomBy

---

zoomTo()

zoomTo(k, center?): void

Defined in: core/src/core/navigator.ts:260

Sets the absolute zoom factor, keeping center fixed.

Parameters

Parameter	Type
k	number
center	Point

Returns

void

Inherited from

Navigator.zoomTo