Canvas and runtime types

Read as Markdown

These contracts describe Pibbl’s Canvas host, root-surface configuration, and the stable values returned by its runtime and state APIs. Import them with type from @pibbl/core.

Canvas

Canvas is the supported host union: HTMLCanvasElement | OffscreenCanvas. Pibbl owns at most one live mount for a host Canvas.

PibblAnimatedValueOptions

PibblAnimatedValueOptions<T> supplies an animation definition or pure factory, optional initial value, equality comparison, and diagnostic label.

PibblAnimationDefinition

PibblAnimationDefinition<T> is an opaque immutable value description without a clock or output binding.

PibblAnimationOptions

PibblAnimationOptions<T> configures defineAnimation with a finite duration, synchronous sampler, and optional debug name.

PibblAnimationProgram

PibblAnimationProgram is an opaque immutable composition of tracks, sequences, parallel work, waits, markers, and repeats.

PibblAnimationRepeatDirection

PibblAnimationRepeatDirection is normal, reverse, alternate, or alternate-reverse.

PibblAnimationRepeatOptions

PibblAnimationRepeatOptions supplies a positive iteration count or infinity and an optional repeat direction.

PibblAnimationSampleInput

PibblAnimationSampleInput<T> gives a custom sampler its activation value, local time, and normalized progress.

PibblAnimationTarget

PibblAnimationTarget<T> provides from, to, and optional committed spring velocity to a custom animation factory.

PibblConfig

PibblConfig selects either the fixed logical viewport configuration or the responsive viewport configuration. The first pibbl() mount owns this choice.

PibblController

PibblController is the stable controller returned by pibbl(). Its dispose() method is idempotent and releases runtime-owned resources for that mount.

PibblEasing

PibblEasing maps normalized progress to interpolation progress.

PibblFit

PibblFit is the fixed-surface fitting mode. Fixed roots use centered contain by default; the logical viewport remains distinct from CSS and backing pixels.

PibblFixedViewportConfig

PibblFixedViewportConfig configures a fixed logical viewport with optional fit, pixelRatio, and signal. Omitting it captures the Canvas’s initial logical dimensions; the signal can abort runtime ownership.

PibblInterpolator

PibblInterpolator<T> produces a typed value between from and to for a normalized progress value.

PibblKeyframesOptions

PibblKeyframesOptions<T> supplies at least two values, duration, optional offsets/easing/interpolator, and a debug name.

PibblPixelRatio

PibblPixelRatio describes the backing-pixel density policy. It keeps logical geometry independent from the Canvas backing-store density.

PibblPlayback

PibblPlayback exposes readonly status and currentTime signals plus stable play, pause, resume, cancel, finish, seek, reverse, and playback-rate controls.

PibblPlaybackEvent

PibblPlaybackEvent describes start, iteration, marker, finish, and cancel milestones delivered after rendering during Complete.

PibblPlaybackOptions

PibblPlaybackOptions configures autoplay, conflict policy, debug name, milestone delivery, and isolated error handling.

PibblPlaybackStatus

PibblPlaybackStatus is idle, scheduled, running, paused, finished, cancelled, or disposed.

PibblReactionOptions

PibblReactionOptions accepts an optional debug name for a component-owned useReaction lifecycle.

PibblRef

PibblRef<T> is the stable mutable { current } object returned by useRef. Writing current does not schedule rendering and its lifetime is one component identity.

PibblRenderLayerComponentProps

PibblRenderLayerComponentProps supplies the style and normal Pibbl event, focus, and participation fields reserved by a render layer.

PibblRenderLayerContext

PibblRenderLayerContext exposes the layer’s owned OffscreenCanvas, current resolved size, and a coalesced invalidation callback.

PibblRenderLayerDefinition

PibblRenderLayerDefinition describes synchronous create, update, resize, render, and optional disposal callbacks for an external raster layer.

PibblRenderLayerFrame

PibblRenderLayerFrame provides Pibbl logical frame time, delta, and next-frame invalidation to one render callback.

PibblRenderLayerHit

PibblRenderLayerHit<Target> reports a layer-local miss, an occluding block, or a registered application target identity.

PibblRenderLayerInput

PibblRenderLayerInput<Target> delivers coordinate input only after the layer wins global reverse-paint arbitration, with layer-local coordinates and winner-owned pointer capture controls.

PibblRenderLayerInteraction

PibblRenderLayerInteraction<Props, Resources, Target> settles the interaction snapshot that commits transactionally with a candidate bitmap.

PibblRenderLayerInteractionSnapshot

PibblRenderLayerInteractionSnapshot<Target> contains one generation’s target declarations, hit test, and optional winner input handler.

PibblRenderLayerProps

PibblRenderLayerProps<Props> combines custom layer props with the reserved Pibbl component fields and rejects reserved custom names.

PibblRenderLayerSize

PibblRenderLayerSize records logical and backing dimensions plus effective pixel ratios for one layer frame.

PibblRenderLayerStyle

PibblRenderLayerStyle is the local box, layout, and filter style accepted by a render layer.

PibblRenderLayerTarget

PibblRenderLayerTarget<Target> associates a stable application identity with Pibbl handlers, cursor participation, and optional focus geometry.

PibblResponsiveViewportConfig

PibblResponsiveViewportConfig is { viewport: "responsive", pixelRatio?, signal? }. Its logical root follows CSS content-box pixels instead of a fixed captured viewport.

PibblSpringOptions

PibblSpringOptions configures a number-only analytic spring and its rest bounds.

PibblStepperOptions

PibblStepperOptions<State, T> supplies the fixed step, state initialization, step/read callbacks, optional completion predicate, elapsed clamp, and debug name.

PibblTweenOptions

PibblTweenOptions<T> supplies to, optional from, duration, easing, interpolator, and debug name.

RenderingContext2D

RenderingContext2D is the 2D-context union for the supported Canvas hosts. useCanvasContext() exposes it only while a Pibbl component is rendering.

Signal

Signal<T> is a nominal readonly value with an explicit get(): T method.

SignalEquals

SignalEquals<T> compares the previous and candidate values. Pibbl uses Object.is when no custom equality function is supplied.

SignalOptions

SignalOptions<T> accepts an optional equality function and debug name.

WritableSignal

WritableSignal<T> adds set(value), update(updater), and cached asReadonly() to Signal<T>. set() treats functions as values.

API details from source

Signal

A readonly reactive value; get records a dependency when called by a tracked consumer.

interface Signal<T>

Related API: Signal.

Properties and methods

get

get: () => T

Reads the current value and records a dependency in the active tracked consumer. See Signal.

Returns

The current value, recording a dependency when called from a tracked consumer.

View source — packages/core/src/lib/signals/types.ts:45

SignalEquals

Compares previous and next values to decide whether a signal change should be published.

type SignalEquals<T> = (previous: T, next: T) => boolean

Related API: SignalEquals.

Parameters

previous — Previously stored value.
next — Proposed replacement value.

Returns

True when the values are equivalent and a change should be suppressed.

SignalOptions

Equality comparison and diagnostic naming options for a signal.

interface SignalOptions<T>

Related API: SignalOptions.

Properties and methods

equals (optional)

equals?: SignalEquals<T> | undefined

Related API: SignalEquals.

Compares old and new values to suppress equivalent updates; defaults to Object.is. See SignalEquals.

View source — packages/core/src/lib/signals/types.ts:26

debugName (optional)

debugName?: string | undefined

Optional label used in diagnostics. See SignalOptions.

View source — packages/core/src/lib/signals/types.ts:28

WritableSignal

A signal with synchronous replacement and update operations and a readonly view.

interface WritableSignal<T> extends Signal<T>

Related API: WritableSignal, Signal.

Properties and methods

set

set: (value: T) => void

Synchronously replaces the value, publishing only when the equality comparison reports a change. See WritableSignal.

Parameters

value — Replacement value to compare with the currently stored value.

View source — packages/core/src/lib/signals/types.ts:70

update

update: (update: (current: T) => T) => void

Computes a replacement from the current value and applies the signal’s equality policy. See WritableSignal.

Parameters

update — Synchronous function receiving the current value and returning its replacement.

View source — packages/core/src/lib/signals/types.ts:77

asReadonly

asReadonly: () => Signal<T>

Related API: Signal.

Returns a readonly signal view of this same reactive value. See Signal.

Returns

A readonly view of the same signal, without set or update operations. See Signal .

View source — packages/core/src/lib/signals/types.ts:83

get

get: () => T

Reads the current value and records a dependency in the active tracked consumer. See Signal.

Returns

The current value, recording a dependency when called from a tracked consumer.

View source — packages/core/src/lib/signals/types.ts:45

PibblAnimationDefinition

An opaque, immutable description of an animation value.

interface PibblAnimationDefinition<T>

Related API: PibblAnimationDefinition.

PibblAnimationOptions

Duration and sampling callback for a custom seekable animation definition.

interface PibblAnimationOptions<T>

Related API: PibblAnimationOptions.

Properties and methods

duration

readonly duration: number

Duration of the animation or transition in milliseconds. See PibblAnimationOptions.

View source — packages/core/src/lib/animation/types.ts:236

sample

readonly sample: (input: PibblAnimationSampleInput<T>) => T

Related API: PibblAnimationSampleInput.

Samples a value from the captured initial value, local time, and normalized progress. See PibblAnimationSampleInput.

Parameters

input — Logical sample time, progress, and value captured at the start of the run. See PibblAnimationSampleInput .

Returns

The value to publish for this sample.

View source — packages/core/src/lib/animation/types.ts:244

debugName (optional)

readonly debugName?: string | undefined

Optional label used in diagnostics. See PibblAnimationOptions.

View source — packages/core/src/lib/animation/types.ts:246

PibblAnimationProgram

An opaque, immutable composition of animation definitions.

interface PibblAnimationProgram

Related API: PibblAnimationProgram.

PibblAnimationRepeatDirection

Playback direction across iterations, including reversed and alternating runs.

type PibblAnimationRepeatDirection = | 'normal'
  | 'reverse'
  | 'alternate'
  | 'alternate-reverse'

Related API: PibblAnimationRepeatDirection.

PibblAnimationRepeatOptions

Count and direction controls for a repeated animation program.

interface PibblAnimationRepeatOptions

Related API: PibblAnimationRepeatOptions.

Properties and methods

iterations

readonly iterations: number

Number of times the program is repeated. See PibblAnimationRepeatOptions.

View source — packages/core/src/lib/animation/types.ts:75

direction (optional)

readonly direction?: PibblAnimationRepeatDirection | undefined

Related API: PibblAnimationRepeatDirection.

Direction in which this operation proceeds. See PibblAnimationRepeatDirection.

View source — packages/core/src/lib/animation/types.ts:77

PibblAnimationSampleInput

Time and endpoint values supplied when sampling a seekable animation definition.

interface PibblAnimationSampleInput<T>

Related API: PibblAnimationSampleInput.

Properties and methods

initialValue

readonly initialValue: T

Value captured at the start of this animation sample’s run. See PibblAnimationSampleInput.

View source — packages/core/src/lib/animation/types.ts:215

localTime

readonly localTime: number

Elapsed logical time within the sampled animation, in milliseconds. See PibblAnimationSampleInput.

View source — packages/core/src/lib/animation/types.ts:220

progress

readonly progress: number

Normalized progress through the current animation or transition. See PibblAnimationSampleInput.

View source — packages/core/src/lib/animation/types.ts:225

PibblAnimatedValueOptions

Definition-based target animation with mount-owned equality and initial presentation.

interface PibblAnimatedValueOptions<T>

Related API: PibblAnimatedValueOptions.

Properties and methods

animation

readonly animation: PibblAnimationDefinition<T> | ((target: PibblAnimationTarget<T>) => PibblAnimationDefinition<T>)

Immutable definition or pure factory receiving the hook-owned endpoints. Factories run synchronously during render and cannot write signals or call hooks.

Parameters

target — Current endpoints and previous spring velocity. See PibblAnimationTarget.

Returns

A concrete animation definition. See PibblAnimationDefinition.

View source — packages/core/src/lib/animation/types.ts:196

equals (optional)

readonly equals?: SignalEquals<T> | undefined

Related API: SignalEquals.

Comparison used to suppress equal targets. See SignalEquals.

View source — packages/core/src/lib/animation/types.ts:198

initial (optional)

readonly initial?: T | undefined

Initial presented value; omitted initial values present the target without entrance motion. See useAnimatedValue.

View source — packages/core/src/lib/animation/types.ts:200

debugName (optional)

readonly debugName?: string | undefined

Optional playback diagnostic label. See useAnimatedValue.

View source — packages/core/src/lib/animation/types.ts:202

PibblAnimationTarget

Current endpoints and optional committed spring velocity supplied to an animation factory.

interface PibblAnimationTarget<T>

Related API: PibblAnimationTarget.

Properties and methods

from

readonly from: T

Last presented value, or the explicit mount initial value. See useAnimatedValue.

View source — packages/core/src/lib/animation/types.ts:175

readonly to: T

Latest requested target. See useAnimatedValue.

View source — packages/core/src/lib/animation/types.ts:177

velocity (optional)

readonly velocity?: number | undefined

Committed analytic spring velocity, when the previous run is a spring. See spring.

View source — packages/core/src/lib/animation/types.ts:179

PibblPlayback

Mount-owned playback controls and reactive status/time for an animation program.

interface PibblPlayback

Related API: PibblPlayback.

Properties and methods

status

readonly status: Signal<PibblPlaybackStatus>

Related API: Signal, PibblPlaybackStatus.

Reactive lifecycle state of the mounted playback. See PibblPlaybackStatus.

View source — packages/core/src/lib/animation/types.ts:342

currentTime

readonly currentTime: Signal<number>

Related API: Signal.

Reactive logical playback position in milliseconds. See PibblPlayback.

View source — packages/core/src/lib/animation/types.ts:344

play

play: (options?: { readonly conflict?: 'error' | 'replace'; }) => void

Queues playback startup with an optional conflicting-writer replacement policy. See PibblPlayback.

Parameters

options — Writer-conflict policy; replacement must be explicitly requested.

View source — packages/core/src/lib/animation/types.ts:351

pause

pause: () => void

Queues a pause without discarding the current playback position. See PibblPlayback.

View source — packages/core/src/lib/animation/types.ts:356

resume

resume: () => void

Queues resumption from the paused playback position. See PibblPlayback.

View source — packages/core/src/lib/animation/types.ts:358

cancel

cancel: () => void

Queues cancellation and release of the program’s writer leases. See PibblPlayback.

View source — packages/core/src/lib/animation/types.ts:360

finish

finish: () => void

Queues completion at the program’s terminal value when supported. See PibblPlayback.

View source — packages/core/src/lib/animation/types.ts:362

seek

seek: (milliseconds: number) => void

Queues a change to the playback’s logical position in milliseconds. See PibblPlayback.

Parameters

milliseconds — Logical playback position in milliseconds.

View source — packages/core/src/lib/animation/types.ts:367

reverse

reverse: () => void

Queues reversal of the playback direction. See PibblPlayback.

View source — packages/core/src/lib/animation/types.ts:369

setPlaybackRate

setPlaybackRate: (rate: number) => void

Queues a change to the rate at which logical playback time advances. See PibblPlayback.

Parameters

rate — Playback speed multiplier.

View source — packages/core/src/lib/animation/types.ts:374

PibblPlaybackEvent

Playback milestone information delivered after the scheduler completes the frame.

interface PibblPlaybackEvent

Related API: PibblPlaybackEvent.

Properties and methods

type

readonly type: "cancel" | "finish" | "iteration" | "marker" | "start"

Related API: marker.

Selects "start" , "iteration" , "marker" , "finish" , "cancel" for type. See PibblPlaybackEvent.

View source — packages/core/src/lib/animation/types.ts:318

logicalTime

readonly logicalTime: number

Logical scheduler time in milliseconds. See PibblPlaybackEvent.

View source — packages/core/src/lib/animation/types.ts:320

frameId

readonly frameId: number

Identifier of the shared scheduler frame. See PibblPlaybackEvent.

View source — packages/core/src/lib/animation/types.ts:322

programPath

readonly programPath: readonly number[]

Indices identifying the program node that produced this event. See PibblPlaybackEvent.

View source — packages/core/src/lib/animation/types.ts:326

iteration

readonly iteration: number

Index of the current repetition. See PibblPlaybackEvent.

View source — packages/core/src/lib/animation/types.ts:328

marker (optional)

readonly marker?: string | undefined

Related API: marker.

Name or source marker identifying this milestone. See PibblPlaybackEvent.

View source — packages/core/src/lib/animation/types.ts:330

PibblPlaybackOptions

Playback startup, writer replacement, and lifecycle callback configuration.

interface PibblPlaybackOptions

Related API: PibblPlaybackOptions.

Properties and methods

autoplay (optional)

readonly autoplay?: boolean | undefined

Whether playback is requested automatically when the owner mounts. See PibblPlaybackOptions.

View source — packages/core/src/lib/animation/types.ts:387

conflict (optional)

readonly conflict?: "error" | "replace" | undefined

Selects "error", "replace" for conflict. See PibblPlaybackOptions.

View source — packages/core/src/lib/animation/types.ts:389

debugName (optional)

readonly debugName?: string | undefined

Optional label used in diagnostics. See PibblPlaybackOptions.

View source — packages/core/src/lib/animation/types.ts:391

onEvent (optional)

readonly onEvent?: ((event: PibblPlaybackEvent) => void) | undefined

Related API: PibblPlaybackEvent.

Receives lifecycle and milestone notifications. See PibblPlaybackEvent.

Parameters

event — Playback milestone or lifecycle event delivered during Complete. See PibblPlaybackEvent .

View source — packages/core/src/lib/animation/types.ts:397

onError (optional)

readonly onError?: ((error: unknown) => void) | undefined

Receives failures reported by the owning runtime resource. See PibblPlaybackOptions.

Parameters

error — Failure reported by playback.

View source — packages/core/src/lib/animation/types.ts:402

PibblPlaybackStatus

The current lifecycle state of an animation playback.

type PibblPlaybackStatus = | 'idle'
  | 'scheduled'
  | 'running'
  | 'paused'
  | 'finished'
  | 'cancelled'
  | 'disposed'

Related API: PibblPlaybackStatus.

PibblEasing

Maps normalized animation progress to an interpolation progress.

type PibblEasing = (progress: number) => number

Related API: PibblEasing.

Parameters

progress — Normalized input progress.

Returns

Eased progress used for interpolation.

PibblInterpolator

Produces an in-between value for a normalized interpolation progress.

type PibblInterpolator<T> = (from: T, to: T, progress: number) => T

Related API: PibblInterpolator.

Parameters

from — Value at the start of the interpolation.
to — Value at the end of the interpolation.
progress — Interpolation progress after easing.

Returns

The interpolated value.

PibblKeyframesOptions

Keyframe values, timing, and easing for a seekable animation definition.

interface PibblKeyframesOptions<T>

Related API: PibblKeyframesOptions.

Properties and methods

values

readonly values: readonly [T, T, ...T[]]

Ordered values interpolated by the animation. See PibblKeyframesOptions.

View source — packages/core/src/lib/animation/types.ts:113

duration

readonly duration: number

Duration of the animation or transition in milliseconds. See PibblKeyframesOptions.

View source — packages/core/src/lib/animation/types.ts:115

offsets (optional)

readonly offsets?: readonly number[] | undefined

Normalized positions of the keyframes along the animation duration. See PibblKeyframesOptions.

View source — packages/core/src/lib/animation/types.ts:120

easing (optional)

readonly easing?: PibblEasing | readonly PibblEasing[] | undefined

Related API: easing, PibblEasing.

Maps normalized progress before interpolation. See PibblEasing.

View source — packages/core/src/lib/animation/types.ts:122

interpolate (optional)

readonly interpolate?: PibblInterpolator<T> | undefined

Related API: PibblInterpolator.

Produces a value between two endpoints at the supplied progress. See PibblInterpolator.

View source — packages/core/src/lib/animation/types.ts:126

debugName (optional)

readonly debugName?: string | undefined

Optional label used in diagnostics. See PibblKeyframesOptions.

View source — packages/core/src/lib/animation/types.ts:128

PibblSpringOptions

Physical parameters and completion thresholds for an analytic spring definition.

interface PibblSpringOptions

Related API: PibblSpringOptions.

Properties and methods

from (optional)

readonly from?: number | undefined

Starting endpoint or value. See PibblSpringOptions.

View source — packages/core/src/lib/animation/types.ts:139

to (optional)

readonly to?: number | undefined

Destination endpoint; omit when useAnimatedValue supplies the target. See PibblSpringOptions.

View source — packages/core/src/lib/animation/types.ts:141

mass (optional)

readonly mass?: number | undefined

Mass used by the spring or physics calculation. See PibblSpringOptions.

View source — packages/core/src/lib/animation/types.ts:143

stiffness (optional)

readonly stiffness?: number | undefined

Spring stiffness controlling acceleration toward the target. See PibblSpringOptions.

View source — packages/core/src/lib/animation/types.ts:145

damping (optional)

readonly damping?: number | undefined

Spring damping controlling the loss of velocity. See PibblSpringOptions.

View source — packages/core/src/lib/animation/types.ts:147

initialVelocity (optional)

readonly initialVelocity?: number | undefined

Starting velocity of the spring. See PibblSpringOptions.

View source — packages/core/src/lib/animation/types.ts:149

restSpeed (optional)

readonly restSpeed?: number | undefined

Velocity threshold used to determine when the spring has settled. See PibblSpringOptions .

View source — packages/core/src/lib/animation/types.ts:154

restDelta (optional)

readonly restDelta?: number | undefined

Distance-from-target threshold used to determine when the spring has settled. See PibblSpringOptions.

View source — packages/core/src/lib/animation/types.ts:159

maxDuration (optional)

readonly maxDuration?: number | undefined

Maximum duration allowed before the spring is forced to complete. See PibblSpringOptions .

View source — packages/core/src/lib/animation/types.ts:164

debugName (optional)

readonly debugName?: string | undefined

Optional label used in diagnostics. See PibblSpringOptions.

View source — packages/core/src/lib/animation/types.ts:166

PibblStepperOptions

Fixed-step state-machine configuration; execution state is playback-owned.

interface PibblStepperOptions<State, T>

Related API: PibblStepperOptions.

Properties and methods

stepMilliseconds

readonly stepMilliseconds: number

Fixed integration step in milliseconds. See PibblStepperOptions.

View source — packages/core/src/lib/animation/types.ts:257

maxElapsedMilliseconds (optional)

readonly maxElapsedMilliseconds?: number | undefined

Maximum elapsed time admitted to fixed-step integration per frame. See PibblStepperOptions.

View source — packages/core/src/lib/animation/types.ts:262

initial

readonly initial: (currentValue: T) => State

Creates playback-owned integration state from the current output value. See PibblStepperOptions.

Parameters

currentValue — Output signal value at the start of this run.

Returns

Initial integration state for the run.

View source — packages/core/src/lib/animation/types.ts:269

step

readonly step: (state: State, deltaMilliseconds: number) => State

Advances the integration state by the supplied fixed timestep in milliseconds. See PibblStepperOptions.

Parameters

state — Integration state before this step.
deltaMilliseconds — Fixed step duration in milliseconds.

Returns

Integration state after this step.

View source — packages/core/src/lib/animation/types.ts:277

read

readonly read: (state: State) => T

Extracts the output value from the current integration state. See PibblStepperOptions.

Parameters

state — Current integration state.

Returns

The output value represented by that state.

View source — packages/core/src/lib/animation/types.ts:283

done (optional)

readonly done?: ((state: State) => boolean) | undefined

Reports whether the integration state has reached completion. See PibblStepperOptions.

Parameters

state — Current integration state.

Returns

True when the stepper has completed.

View source — packages/core/src/lib/animation/types.ts:289

debugName (optional)

readonly debugName?: string | undefined

Optional label used in diagnostics. See PibblStepperOptions.

View source — packages/core/src/lib/animation/types.ts:291

PibblTweenOptions

Duration, easing, and optional custom interpolation between animation endpoints.

interface PibblTweenOptions<T>

Related API: PibblTweenOptions.

Properties and methods

from (optional)

readonly from?: T | undefined

Starting endpoint or value. See PibblTweenOptions.

View source — packages/core/src/lib/animation/types.ts:89

to (optional)

readonly to?: T | undefined

Destination endpoint; omit when useAnimatedValue supplies the target. See PibblTweenOptions.

View source — packages/core/src/lib/animation/types.ts:91

duration

readonly duration: number

Duration of the animation or transition in milliseconds. See PibblTweenOptions.

View source — packages/core/src/lib/animation/types.ts:93

easing (optional)

readonly easing?: PibblEasing | undefined

Related API: easing, PibblEasing.

Maps normalized progress before interpolation. See PibblEasing.

View source — packages/core/src/lib/animation/types.ts:95

interpolate (optional)

readonly interpolate?: PibblInterpolator<T> | undefined

Related API: PibblInterpolator.

Produces a value between two endpoints at the supplied progress. See PibblInterpolator.

View source — packages/core/src/lib/animation/types.ts:99

debugName (optional)

readonly debugName?: string | undefined

Optional label used in diagnostics. See PibblTweenOptions.

View source — packages/core/src/lib/animation/types.ts:101

PibblConfig

Canvas surface sizing, pixel density, and viewport configuration for a Pibbl mount.

type PibblConfig = | PibblFixedViewportConfig
  | PibblResponsiveViewportConfig

Properties and methods

htmlOverlay (optional)

htmlOverlay?: HTMLElement | undefined

Opt-in host for application-owned HTML regions associated with this canvas. See PibblFixedViewportConfig. Opt-in host for application-owned HTML regions associated with this canvas. See PibblResponsiveViewportConfig.

View source — packages/core/src/lib/surface/types.ts:34

signal (optional)

signal?: AbortSignal | undefined

Related API: signal.

Abort signal governing the lifetime of this operation or mount. See PibblFixedViewportConfig. Abort signal governing the lifetime of this operation or mount. See PibblResponsiveViewportConfig.

View source — packages/core/src/lib/surface/types.ts:39

viewport (optional)

viewport?: "responsive" | Readonly<{ width: number; height: number; }> | undefined

Logical viewport dimensions and fitting configuration. See PibblFixedViewportConfig. Logical viewport dimensions and fitting configuration. See PibblResponsiveViewportConfig .

View source — packages/core/src/lib/surface/types.ts:41

pixelRatio (optional)

pixelRatio?: PibblPixelRatio | undefined

Related API: PibblPixelRatio.

Requested backing-store pixel density. See PibblPixelRatio.

View source — packages/core/src/lib/surface/types.ts:56

PibblFit

How a fixed logical viewport fits inside its displayed canvas surface.

type PibblFit = | 'contain'
  | 'cover'
  | 'fill'
  | 'none'
  | 'scale-down'

Related API: PibblFit.

PibblFixedViewportConfig

Fixed logical viewport dimensions and fitting policy for a canvas mount.

interface PibblFixedViewportConfig

Related API: PibblFixedViewportConfig.

Properties and methods

htmlOverlay (optional)

htmlOverlay?: HTMLElement | undefined

Opt-in host for application-owned HTML regions associated with this canvas. See PibblFixedViewportConfig.

View source — packages/core/src/lib/surface/types.ts:34

signal (optional)

signal?: AbortSignal | undefined

Related API: signal.

Abort signal governing the lifetime of this operation or mount. See PibblFixedViewportConfig.

View source — packages/core/src/lib/surface/types.ts:39

viewport (optional)

viewport?: Readonly<{ width: number; height: number; }> | undefined

Logical viewport dimensions and fitting configuration. See PibblFixedViewportConfig.

View source — packages/core/src/lib/surface/types.ts:41

fit (optional)

fit?: PibblFit | undefined

Related API: PibblFit.

Policy for fitting content within its available box. See PibblFit.

View source — packages/core/src/lib/surface/types.ts:54

pixelRatio (optional)

pixelRatio?: PibblPixelRatio | undefined

Related API: PibblPixelRatio.

Requested backing-store pixel density. See PibblPixelRatio.

View source — packages/core/src/lib/surface/types.ts:56

PibblPixelRatio

Requested backing-store density, either explicit or derived from the device.

type PibblPixelRatio = 'device' | number

Related API: PibblPixelRatio.

PibblResponsiveViewportConfig

A viewport that follows the displayed canvas dimensions.

interface PibblResponsiveViewportConfig

Related API: PibblResponsiveViewportConfig.

Properties and methods

htmlOverlay (optional)

htmlOverlay?: HTMLElement | undefined

Opt-in host for application-owned HTML regions associated with this canvas. See PibblResponsiveViewportConfig.

View source — packages/core/src/lib/surface/types.ts:70

signal (optional)

signal?: AbortSignal | undefined

Related API: signal.

Abort signal governing the lifetime of this operation or mount. See PibblResponsiveViewportConfig.

View source — packages/core/src/lib/surface/types.ts:75

viewport

viewport: "responsive"

Logical viewport dimensions and fitting configuration. See PibblResponsiveViewportConfig .

View source — packages/core/src/lib/surface/types.ts:80

pixelRatio (optional)

pixelRatio?: PibblPixelRatio | undefined

Related API: PibblPixelRatio.

Requested backing-store pixel density. See PibblPixelRatio.

View source — packages/core/src/lib/surface/types.ts:82

PibblRenderLayerComponentProps

Pibbl-owned style, event, focus, and miss-handling props shared by external layers.

interface PibblRenderLayerComponentProps extends PibblEventHandlers, PibblEventFocusOptions, PibblEventParticipationOptions

Properties and methods

style (optional)

readonly style?: PibblRenderLayerStyle | undefined

Related API: PibblRenderLayerStyle.

Declared presentation and layout properties. See PibblRenderLayerStyle.

View source — packages/core/src/lib/render-layer/types.ts:268

missBehavior (optional)

readonly missBehavior?: "block" | "pass-through" | "target-layer" | undefined

How a layer miss participates in arbitration with lower painted content. See PibblRenderLayerComponentProps.

View source — packages/core/src/lib/render-layer/types.ts:273

pointerEvents (optional)

readonly pointerEvents?: PibblPointerEvents | undefined

Related API: PibblPointerEvents.

Whether this content participates in pointer targeting. See PibblPointerEvents.

View source — packages/core/src/lib/events/types.ts:126

keyboardFocusable (optional)

readonly keyboardFocusable?: boolean | undefined

Whether the target may receive keyboard focus. See PibblEventFocusOptions.

View source — packages/core/src/lib/events/types.ts:137

keyboardNavigationBounds (optional)

readonly keyboardNavigationBounds?: Readonly<LayoutBox> | undefined

Related API: LayoutBox.

Logical rectangle used for directional keyboard navigation. See LayoutBox.

View source — packages/core/src/lib/events/types.ts:139

PibblRenderLayerDefinition

Resource creation, update, resizing, rendering, disposal, and interaction lifecycle of an external layer.

interface PibblRenderLayerDefinition<Props, Resources, Target extends object = object>

Related API: PibblRenderLayerDefinition.

Properties and methods

create

create: (context: Readonly<PibblRenderLayerContext>, initialProps: Readonly<Props>) => Resources

Related API: PibblRenderLayerContext.

Allocates application resources once for this mounted layer identity. See PibblRenderLayerDefinition.

Parameters

context — Mount-owned canvas, size, and invalidation services. See PibblRenderLayerContext .
initialProps — Props supplied for the first mounted render.

Returns

Persistent application resources retained until dispose.

View source — packages/core/src/lib/render-layer/types.ts:299

update (optional)

update?: ((resources: Resources, props: Readonly<Props>, context: Readonly<PibblRenderLayerContext>) => void) | undefined

Related API: PibblRenderLayerContext.

Applies the latest props to existing resources before rendering. See PibblRenderLayerDefinition.

Parameters

resources — Resources previously returned by create.
props — Latest component props.
context — Mount-owned canvas, size, and invalidation services. See PibblRenderLayerContext .

View source — packages/core/src/lib/render-layer/types.ts:311

resize (optional)

resize?: ((resources: Resources, size: Readonly<PibblRenderLayerSize>, context: Readonly<PibblRenderLayerContext>) => void) | undefined

Adjusts resources to the newly resolved logical and backing-store dimensions. See PibblRenderLayerDefinition.

Parameters

resources — Resources previously returned by create.
size — New logical and backing dimensions. See PibblRenderLayerSize.
context — Mount-owned canvas, size, and invalidation services. See PibblRenderLayerContext .

View source — packages/core/src/lib/render-layer/types.ts:324

render

render: (resources: Resources, frame: Readonly<PibblRenderLayerFrame>, context: Readonly<PibblRenderLayerContext>) => void

Draws this generation using Pibbl’s frame; invalidate only when another frame is needed. See PibblRenderLayerDefinition.

Parameters

resources — Resources previously returned by create.
frame — Shared Pibbl frame timing and invalidation service. See PibblRenderLayerFrame .
context — Mount-owned canvas, size, and invalidation services. See PibblRenderLayerContext .

View source — packages/core/src/lib/render-layer/types.ts:338

dispose (optional)

dispose?: ((resources: Resources, context: Readonly<PibblRenderLayerContext>) => void) | undefined

Related API: PibblRenderLayerContext.

Releases application resources when the mounted layer is torn down. See PibblRenderLayerDefinition.

Parameters

resources — Resources previously returned by create, whose application-owned resources must be released.
context — Mount-owned context for this resource lifetime. See PibblRenderLayerContext .

View source — packages/core/src/lib/render-layer/types.ts:351

interaction (optional)

interaction?: PibblRenderLayerInteraction<Props, Resources, Target> | undefined

Related API: PibblRenderLayerInteraction.

Builds the interaction snapshot committed with the rendered bitmap. See PibblRenderLayerInteraction.

View source — packages/core/src/lib/render-layer/types.ts:356

PibblRenderLayerFrame

Shared scheduler timing and invalidation supplied to an external renderer for one frame.

interface PibblRenderLayerFrame

Related API: PibblRenderLayerFrame.

Properties and methods

frameId

readonly frameId: number

Identifier of the shared scheduler frame. See PibblRenderLayerFrame.

View source — packages/core/src/lib/render-layer/types.ts:55

time

readonly time: number

Current shared logical time in milliseconds. See PibblRenderLayerFrame.

View source — packages/core/src/lib/render-layer/types.ts:57

delta

readonly delta: number

Elapsed frame time in milliseconds. See PibblRenderLayerFrame.

View source — packages/core/src/lib/render-layer/types.ts:59

deltaSeconds

readonly deltaSeconds: number

Elapsed frame time in seconds. See PibblRenderLayerFrame.

View source — packages/core/src/lib/render-layer/types.ts:61

invalidate

invalidate: () => void

Requests another Pibbl render through the shared scheduler. See PibblRenderLayerFrame.

View source — packages/core/src/lib/render-layer/types.ts:63

PibblRenderLayerContext

The Pibbl-owned offscreen canvas, current size, and frame-invalidation capability.

interface PibblRenderLayerContext

Related API: PibblRenderLayerContext.

Properties and methods

canvas

readonly canvas: OffscreenCanvas

Canvas surface associated with this resource or mount. See PibblRenderLayerContext.

View source — packages/core/src/lib/render-layer/types.ts:74

size

readonly size: PibblRenderLayerSize

Related API: PibblRenderLayerSize.

Current logical dimensions, backing-store dimensions, and effective pixel ratios. See PibblRenderLayerSize.

View source — packages/core/src/lib/render-layer/types.ts:76

invalidate

invalidate: () => void

Requests another Pibbl render through the shared scheduler. See PibblRenderLayerContext.

View source — packages/core/src/lib/render-layer/types.ts:80

PibblRenderLayerHit

A hit-test decision: pass through, block lower paint, or select one logical target.

type PibblRenderLayerHit<Target extends object> = | {
      /** Selects the kind of geometry, material, or result. See {@link PibblRenderLayerHit}. */
      readonly kind: "miss";
    }
  | {
      /** Selects the kind of geometry, material, or result. See {@link PibblRenderLayerHit}. */
      readonly kind: "block";
    }
  | {
      /** Selects the kind of geometry, material, or result. See {@link PibblRenderLayerHit}. */
      readonly kind: "target";
      /** The selected logical target or target configuration. See {@link PibblRenderLayerHit}. */
      readonly target: Target;
    }

Related API: PibblRenderLayerHit.

Properties and methods

kind

readonly kind: "block" | "miss" | "target"

Selects the kind of geometry, material, or result. See PibblRenderLayerHit.

View source — packages/core/src/lib/render-layer/types.ts:103

PibblRenderLayerInput

Pibbl-routed pointer input in layer-local coordinates with pointer-capture operations.

interface PibblRenderLayerInput<Target extends object>

Related API: PibblRenderLayerInput.

Properties and methods

type

readonly type: "click" | "contextmenu" | "pointercancel" | "pointerdown" | "pointermove" | "pointerup" | "wheel"

Selects "pointerdown" , "pointermove" , "pointerup" , "pointercancel" , "wheel" , "contextmenu" , "click" for type. See PibblRenderLayerInput.

View source — packages/core/src/lib/render-layer/types.ts:150

point

readonly point: Readonly<{ x: number; y: number; }>

Pointer position in the external layer’s logical local coordinates. See PibblRenderLayerInput.

View source — packages/core/src/lib/render-layer/types.ts:162

hit

readonly hit: PibblRenderLayerHit<Target>

Related API: PibblRenderLayerHit.

Target, block, or miss decision associated with the input. See PibblRenderLayerHit.

View source — packages/core/src/lib/render-layer/types.ts:175

originalEvent

readonly originalEvent: MouseEvent | PointerEvent | WheelEvent

The originating browser event. See PibblRenderLayerInput.

View source — packages/core/src/lib/render-layer/types.ts:177

setPointerCapture

setPointerCapture: (pointerId: number) => void

Captures the pointer for this logical target until release or cancellation. See PibblRenderLayerInput.

Parameters

pointerId — Pointer identifier from the routed pointer event.

View source — packages/core/src/lib/render-layer/types.ts:183

releasePointerCapture

releasePointerCapture: (pointerId: number) => void

Releases this target’s capture of the identified pointer. See PibblRenderLayerInput.

Parameters

pointerId — Pointer identifier from the routed pointer event.

View source — packages/core/src/lib/render-layer/types.ts:188

PibblRenderLayerInteraction

Settles renderer resources into the interaction snapshot for a committed generation.

interface PibblRenderLayerInteraction<Props, Resources, Target extends object>

Related API: PibblRenderLayerInteraction.

Properties and methods

settle

settle: (resources: Resources, props: Readonly<Props>, size: Readonly<PibblRenderLayerSize>) => PibblRenderLayerInteractionSnapshot<Target>

Captures interaction state corresponding to the generation being committed. See PibblRenderLayerInteractionSnapshot.

Parameters

resources — Resources representing the rendered scene.
props — Props used for the committed render.
size — Logical and backing dimensions for this generation. See PibblRenderLayerSize .

Returns

The interaction snapshot to commit together with the rendered bitmap. See PibblRenderLayerInteractionSnapshot .

View source — packages/core/src/lib/render-layer/types.ts:250

PibblRenderLayerInteractionSnapshot

Targets and hit testing committed atomically with one rendered bitmap generation.

interface PibblRenderLayerInteractionSnapshot<Target extends object>

Properties and methods

targets

readonly targets: Iterable<PibblRenderLayerTarget<Target>>

Related API: PibblRenderLayerTarget.

Logical targets exposed by this committed generation. See PibblRenderLayerTarget.

View source — packages/core/src/lib/render-layer/types.ts:201

hitTest

hitTest: (point: Readonly<{ x: number; y: number; }>) => PibblRenderLayerHit<Target>

Related API: PibblRenderLayerHit.

Resolves a layer-local point to a target, block, or miss decision. See PibblRenderLayerHit.

Parameters

point — Pointer position in layer-local logical coordinates.

Returns

A target hit, a blocking hit, or a miss for this interaction generation. See PibblRenderLayerHit .

View source — packages/core/src/lib/render-layer/types.ts:209

onInput (optional)

onInput?: ((input: Readonly<PibblRenderLayerInput<Target>>) => void) | undefined

Related API: PibblRenderLayerInput.

Receives Pibbl-routed input for this committed interaction generation. See PibblRenderLayerInteractionSnapshot.

Parameters

input — Pibbl-routed input for the committed interaction generation. See PibblRenderLayerInput .

View source — packages/core/src/lib/render-layer/types.ts:229

PibblRenderLayerProps

Application props combined with layer props; reserved Pibbl prop collisions are rejected.

type PibblRenderLayerProps<Props> = Extract<keyof Props, PibblRenderLayerReservedProp> extends never
    ? Props & PibblRenderLayerComponentProps
    : never

Properties and methods

style (optional)

readonly style?: PibblRenderLayerStyle | undefined

Related API: PibblRenderLayerStyle.

Declared presentation and layout properties. See PibblRenderLayerStyle.

View source — packages/core/src/lib/render-layer/types.ts:268

missBehavior (optional)

readonly missBehavior?: "block" | "pass-through" | "target-layer" | undefined

How a layer miss participates in arbitration with lower painted content. See PibblRenderLayerComponentProps.

View source — packages/core/src/lib/render-layer/types.ts:273

pointerEvents (optional)

readonly pointerEvents?: PibblPointerEvents | undefined

Related API: PibblPointerEvents.

Whether this content participates in pointer targeting. See PibblPointerEvents.

View source — packages/core/src/lib/events/types.ts:126

keyboardFocusable (optional)

readonly keyboardFocusable?: boolean | undefined

Whether the target may receive keyboard focus. See PibblEventFocusOptions.

View source — packages/core/src/lib/events/types.ts:137

keyboardNavigationBounds (optional)

readonly keyboardNavigationBounds?: Readonly<LayoutBox> | undefined

Related API: LayoutBox.

Logical rectangle used for directional keyboard navigation. See LayoutBox.

View source — packages/core/src/lib/events/types.ts:139

PibblRenderLayerSize

Logical surface size, backing-store dimensions, and effective pixel ratios of an external render layer.

interface PibblRenderLayerSize

Related API: PibblRenderLayerSize.

Properties and methods

width

readonly width: number

Horizontal extent in the units of the containing geometry or surface. See PibblRenderLayerSize.

View source — packages/core/src/lib/render-layer/types.ts:26

height

readonly height: number

Vertical extent in the units of the containing geometry or surface. See PibblRenderLayerSize.

View source — packages/core/src/lib/render-layer/types.ts:31

backingWidth

readonly backingWidth: number

Width of the backing raster in physical pixels. See PibblRenderLayerSize.

View source — packages/core/src/lib/render-layer/types.ts:33

backingHeight

readonly backingHeight: number

Height of the backing raster in physical pixels. See PibblRenderLayerSize.

View source — packages/core/src/lib/render-layer/types.ts:35

pixelRatioX

readonly pixelRatioX: number

Effective ratio of backing pixels to logical units on the x axis. See PibblRenderLayerSize.

View source — packages/core/src/lib/render-layer/types.ts:40

pixelRatioY

readonly pixelRatioY: number

Effective ratio of backing pixels to logical units on the y axis. See PibblRenderLayerSize.

View source — packages/core/src/lib/render-layer/types.ts:45

PibblRenderLayerStyle

Layout and outer Canvas composition style for an external render layer.

interface PibblRenderLayerStyle extends SystemStyle, BoxStyle, LayoutItemStyle

Properties and methods

maxHeight (optional)

maxHeight?: number | `${number}%` | undefined

Maximum permitted height. See Length.

View source — packages/core/src/lib/style/types.ts:91

padding (optional)

padding?: EdgeValues | undefined

Related API: EdgeValues.

Insets between the border box and content box. See EdgeValues.

View source — packages/core/src/lib/style/types.ts:93

filter (optional)

filter?: PibblFilter | readonly PibblFilter[] | undefined

Related API: PibblFilter.

Ordered pixel-only filters applied to the receiving primitive and its descendants. See PibblFilter.

View source — packages/core/src/lib/types.ts:76

left (optional)

left?: number | `${number}%` | undefined

Left edge coordinate or inset. See Length.

View source — packages/core/src/lib/style/positioning.ts:127

top (optional)

top?: number | `${number}%` | undefined

Top edge value or top envelope guide. See Length.

View source — packages/core/src/lib/style/positioning.ts:129

width (optional)

width?: Length | undefined

Related API: Length.

Horizontal extent in the units of the containing geometry or surface. See Length.

View source — packages/core/src/lib/style/types.ts:81

height (optional)

height?: Length | undefined

Related API: Length.

Vertical extent in the units of the containing geometry or surface. See Length.

View source — packages/core/src/lib/style/types.ts:83

minWidth (optional)

minWidth?: number | `${number}%` | undefined

Minimum permitted width. See Length.

View source — packages/core/src/lib/style/types.ts:85

maxWidth (optional)

maxWidth?: number | `${number}%` | undefined

Maximum permitted width. See Length.

View source — packages/core/src/lib/style/types.ts:87

minHeight (optional)

minHeight?: number | `${number}%` | undefined

Minimum permitted height. See Length.

View source — packages/core/src/lib/style/types.ts:89

overflow (optional)

overflow?: "clip" | "visible" | undefined

Selects "visible", "clip" for overflow. See BoxStyle.

View source — packages/core/src/lib/style/types.ts:95

alignSelf (optional)

alignSelf?: "auto" | "center" | "end" | "flex-end" | "flex-start" | "start" | "stretch" | undefined

This child’s cross-axis or block-axis alignment override. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:121

justifySelf (optional)

justifySelf?: "auto" | "center" | "end" | "start" | "stretch" | undefined

This child’s inline-axis alignment override. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:123

flexBasis (optional)

flexBasis?: Length | undefined

Related API: Length.

Initial main-axis size before flex growth or shrinkage. See Length.

View source — packages/core/src/lib/style/types.ts:125

flexGrow (optional)

flexGrow?: number | undefined

Relative share of positive free space assigned to this child. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:127

flexShrink (optional)

flexShrink?: number | undefined

Relative factor used when reducing main-axis size. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:129

gridColumnStart (optional)

gridColumnStart?: number | undefined

Explicit starting grid column. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:131

gridColumnSpan (optional)

gridColumnSpan?: number | undefined

Number of columns occupied by this child. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:133

gridRowStart (optional)

gridRowStart?: number | undefined

Explicit starting grid row. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:135

gridRowSpan (optional)

gridRowSpan?: number | undefined

Number of rows occupied by this child. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:137

transition (optional)

transition?: PibblTransitionBinding | undefined

Related API: PibblTransitionBinding.

Visibility-transition binding applied to this primitive and its captured descendants. See SystemStyle.

View source — packages/core/src/lib/types.ts:69

custom (optional)

custom?: unknown

Application-defined style payload passed through the runtime. See SystemStyle.

View source — packages/core/src/lib/types.ts:71

PibblRenderLayerTarget

Stable target identity with event, cursor, and keyboard-focus metadata.

interface PibblRenderLayerTarget<Target extends object>

Related API: PibblRenderLayerTarget.

Properties and methods

target

readonly target: Target

The selected logical target or target configuration. See PibblRenderLayerTarget.

View source — packages/core/src/lib/render-layer/types.ts:126

handlers (optional)

Full type declaration

readonly handlers?: Partial<{ onAuxClick: PibblEventHandler<"auxclick">; onBeforeInput: PibblEventHandler<"beforeinput">; onBlur: PibblEventHandler<"blur">; onChange: PibblEventHandler<"change">; onClick: PibblEventHandler<"click">; onCompositionEnd: PibblEventHandler<"compositionend">; onCompositionStart: PibblEventHandler<"compositionstart">; onCompositionUpdate: PibblEventHandler<"compositionupdate">; onContextMenu: PibblEventHandler<"contextmenu">; onCopy: PibblEventHandler<"copy">; onCut: PibblEventHandler<"cut">; onDblClick: PibblEventHandler<"dblclick">; onDrag: PibblEventHandler<"drag">; onDragEnd: PibblEventHandler<"dragend">; onDragEnter: PibblEventHandler<"dragenter">; onDragLeave: PibblEventHandler<"dragleave">; onDragOver: PibblEventHandler<"dragover">; onDragStart: PibblEventHandler<"dragstart">; onDrop: PibblEventHandler<"drop">; onFocus: PibblEventHandler<"focus">; onFocusIn: PibblEventHandler<"focusin">; onFocusOut: PibblEventHandler<"focusout">; onGotPointerCapture: PibblEventHandler<"gotpointercapture">; onInput: PibblEventHandler<"input">; onKeyDown: PibblEventHandler<"keydown">; onKeyUp: PibblEventHandler<"keyup">; onLostPointerCapture: PibblEventHandler<"lostpointercapture">; onMouseDown: PibblEventHandler<"mousedown">; onMouseEnter: PibblEventHandler<"mouseenter">; onMouseLeave: PibblEventHandler<"mouseleave">; onMouseMove: PibblEventHandler<"mousemove">; onMouseOut: PibblEventHandler<"mouseout">; onMouseOver: PibblEventHandler<"mouseover">; onMouseUp: PibblEventHandler<"mouseup">; onPaste: PibblEventHandler<"paste">; onPointerCancel: PibblEventHandler<"pointercancel">; onPointerDown: PibblEventHandler<"pointerdown">; onPointerEnter: PibblEventHandler<"pointerenter">; onPointerLeave: PibblEventHandler<"pointerleave">; onPointerMove: PibblEventHandler<"pointermove">; onPointerOut: PibblEventHandler<"pointerout">; onPointerOver: PibblEventHandler<"pointerover">; onPointerRawUpdate: PibblEventHandler<"pointerrawupdate">; onPointerUp: PibblEventHandler<"pointerup">; onSelect: PibblEventHandler<"select">; onSelectionChange: PibblEventHandler<"selectionchange">; onTouchCancel: PibblEventHandler<"touchcancel">; onTouchEnd: PibblEventHandler<"touchend">; onTouchMove: PibblEventHandler<"touchmove">; onTouchStart: PibblEventHandler<"touchstart">; onWheel: PibblEventHandler<"wheel">; } & { onAuxClickCapture: PibblEventHandler<"auxclick">; onBeforeInputCapture: PibblEventHandler<"beforeinput">; onBlurCapture: PibblEventHandler<"blur">; onChangeCapture: PibblEventHandler<"change">; onClickCapture: PibblEventHandler<"click">; onCompositionEndCapture: PibblEventHandler<"compositionend">; onCompositionStartCapture: PibblEventHandler<"compositionstart">; onCompositionUpdateCapture: PibblEventHandler<"compositionupdate">; onContextMenuCapture: PibblEventHandler<"contextmenu">; onCopyCapture: PibblEventHandler<"copy">; onCutCapture: PibblEventHandler<"cut">; onDblClickCapture: PibblEventHandler<"dblclick">; onDragCapture: PibblEventHandler<"drag">; onDragEndCapture: PibblEventHandler<"dragend">; onDragEnterCapture: PibblEventHandler<"dragenter">; onDragLeaveCapture: PibblEventHandler<"dragleave">; onDragOverCapture: PibblEventHandler<"dragover">; onDragStartCapture: PibblEventHandler<"dragstart">; onDropCapture: PibblEventHandler<"drop">; onFocusCapture: PibblEventHandler<"focus">; onFocusInCapture: PibblEventHandler<"focusin">; onFocusOutCapture: PibblEventHandler<"focusout">; onGotPointerCaptureCapture: PibblEventHandler<"gotpointercapture">; onInputCapture: PibblEventHandler<"input">; onKeyDownCapture: PibblEventHandler<"keydown">; onKeyUpCapture: PibblEventHandler<"keyup">; onLostPointerCaptureCapture: PibblEventHandler<"lostpointercapture">; onMouseDownCapture: PibblEventHandler<"mousedown">; onMouseEnterCapture: PibblEventHandler<"mouseenter">; onMouseLeaveCapture: PibblEventHandler<"mouseleave">; onMouseMoveCapture: PibblEventHandler<"mousemove">; onMouseOutCapture: PibblEventHandler<"mouseout">; onMouseOverCapture: PibblEventHandler<"mouseover">; onMouseUpCapture: PibblEventHandler<"mouseup">; onPasteCapture: PibblEventHandler<"paste">; onPointerCancelCapture: PibblEventHandler<"pointercancel">; onPointerDownCapture: PibblEventHandler<"pointerdown">; onPointerEnterCapture: PibblEventHandler<"pointerenter">; onPointerLeaveCapture: PibblEventHandler<"pointerleave">; onPointerMoveCapture: PibblEventHandler<"pointermove">; onPointerOutCapture: PibblEventHandler<"pointerout">; onPointerOverCapture: PibblEventHandler<"pointerover">; onPointerRawUpdateCapture: PibblEventHandler<"pointerrawupdate">; onPointerUpCapture: PibblEventHandler<"pointerup">; onSelectCapture: PibblEventHandler<"select">; onSelectionChangeCapture: PibblEventHandler<"selectionchange">; onTouchCancelCapture: PibblEventHandler<"touchcancel">; onTouchEndCapture: PibblEventHandler<"touchend">; onTouchMoveCapture: PibblEventHandler<"touchmove">; onTouchStartCapture: PibblEventHandler<"touchstart">; onWheelCapture: PibblEventHandler<"wheel">; }> | undefined

Related API: PibblEventHandler, blur.

Event handlers dispatched for this logical target. See PibblEventHandlers.

View source — packages/core/src/lib/render-layer/types.ts:128

pointerEvents (optional)

readonly pointerEvents?: PibblPointerEvents | undefined

Related API: PibblPointerEvents.

Whether this content participates in pointer targeting. See PibblPointerEvents.

View source — packages/core/src/lib/render-layer/types.ts:130

cursor (optional)

readonly cursor?: string | undefined

Cursor shown while this target owns pointer presentation. See PibblRenderLayerTarget.

View source — packages/core/src/lib/render-layer/types.ts:132

keyboardFocusable (optional)

readonly keyboardFocusable?: boolean | undefined

Whether the target may receive keyboard focus. See PibblRenderLayerTarget.

View source — packages/core/src/lib/render-layer/types.ts:134

keyboardNavigationBounds (optional)

readonly keyboardNavigationBounds?: Readonly<LayoutBox> | undefined

Related API: LayoutBox.

Logical rectangle used for directional keyboard navigation. See LayoutBox.

View source — packages/core/src/lib/render-layer/types.ts:136

PibblRef

A stable mutable container whose current value does not itself schedule rendering.

interface PibblRef<T>

Related API: PibblRef.

Properties and methods

current

current: T | undefined

Mutable value retained by the ref container. See PibblRef.

View source — packages/core/src/lib/hooks/use-ref.ts:10

PibblReactionOptions

Options controlling when a signal reaction runs and how it is named for diagnostics.

interface PibblReactionOptions

Related API: PibblReactionOptions.

Properties and methods

debugName (optional)

readonly debugName?: string | undefined

Optional label used in diagnostics. See PibblReactionOptions.

View source — packages/core/src/lib/hooks/use-reaction.ts:39

Canvas

A supported HTML or offscreen Canvas drawing surface.

type Canvas = HTMLCanvasElement | OffscreenCanvas

Related API: Canvas.

PibblController

The stable controller of one canvas mount, including explicit idempotent disposal.

interface PibblController

Related API: PibblController.

Properties and methods

dispose

dispose: () => void

Releases every resource owned by this Pibbl mount. Safe to call repeatedly.

View source — packages/core/src/lib/types.ts:629

RenderingContext2D

A supported HTML or offscreen Canvas 2D rendering context.

type RenderingContext2D = CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D

Related API: RenderingContext2D.

Implementation guidance for agents

Read the Authoring, signals, and lifecycle companion for ownership, adaptation, failure modes, and verification. Agent start provides the version-selection workflow.

Complete minimal examples

Mount, update, and dispose: Own one Pibbl root for a canvas and replace its content without creating another controller. Plain source
Animate changing targets: Compare a tween and spring as the same target changes. Plain source
Tween playback controls: Animate a signal and control the mounted playback with native buttons. Plain source
Custom sampling and fixed steps: Combine a time-sampled sine wave with a fixed-step state machine. Plain source
Compose keyframes and springs: Run two independent tracks together, then mark, wait, and repeat. Plain source
Configure viewport and pixel density: Compare a fixed logical viewport with one that follows a resizable host. Plain source
Component-owned state and reactions: Click to update a signal, derive a value, and publish an imperative effect after commit. Plain source
Interactive bitmap layer: Draw a dot into an OffscreenCanvas and route clicks through Pibbl’s event boundary. Plain source
Define a Canvas primitive: Supply synchronous drawing, style normalization, resolution, and opt-in measurement. Plain source
Read and update signals: Use writable, readonly, and computed values with synchronous batching. Plain source

Documentation version

Documentation built with @pibbl/core 0.0.2, revision 2dccb19. ALPHA — NOT FOR PRODUCTION USE.

Canvas and runtime types

Canvas

PibblAnimatedValueOptions

PibblAnimationDefinition

PibblAnimationOptions

PibblAnimationProgram

PibblAnimationRepeatDirection

PibblAnimationRepeatOptions

PibblAnimationSampleInput

PibblAnimationTarget

PibblConfig

PibblController

PibblEasing

PibblFit

PibblFixedViewportConfig

PibblInterpolator

PibblKeyframesOptions

PibblPixelRatio

PibblPlayback

PibblPlaybackEvent

PibblPlaybackOptions

PibblPlaybackStatus

PibblReactionOptions

PibblRef

PibblRenderLayerComponentProps

PibblRenderLayerContext

PibblRenderLayerDefinition

PibblRenderLayerFrame

PibblRenderLayerHit

PibblRenderLayerInput

PibblRenderLayerInteraction

PibblRenderLayerInteractionSnapshot

PibblRenderLayerProps

PibblRenderLayerSize

PibblRenderLayerStyle

PibblRenderLayerTarget

PibblResponsiveViewportConfig

PibblSpringOptions

PibblStepperOptions

PibblTweenOptions

RenderingContext2D

Signal

SignalEquals

SignalOptions

WritableSignal

API details from source

Signal

See also

Properties and methods

Returns

SignalEquals

Parameters

Returns

See also

SignalOptions

See also

Properties and methods

WritableSignal

See also

Properties and methods

Parameters

Parameters

Returns

Returns

PibblAnimationDefinition

See also

PibblAnimationOptions

See also

Properties and methods

Parameters

Returns

PibblAnimationProgram

See also

PibblAnimationRepeatDirection

See also

PibblAnimationRepeatOptions

See also

Properties and methods

PibblAnimationSampleInput

See also