Skip to main content

Class: AnimationBuilder<P>

Defined in: tween/animation-builder.ts:40

A chainable, replayable animation description for a single node.

Created by calling node.to(props, duration, easing?) on any animatable node. Additional steps are appended with to, and the whole chain can be passed directly to sequence or parallel.

Implements both Iterable<void> (drives steps as chained generators) and Steppable (drives steps as flat TweenSteppers for the parallel fast-path).

Example​

// Animate a node to x=100 then x=0
const anim = node.to({ x: 100 }, 0.5).to({ x: 0 }, 0.5);
yield* sequence(anim);

// Run alongside another animation
yield* parallel(anim, otherNode.to({ opacity: 0 }, 1));

Type Parameters​

P​

P

Implements​

Constructors​

Constructor​

new AnimationBuilder<P>(node, first): AnimationBuilder<P>

Defined in: tween/animation-builder.ts:44

Parameters​

node​

AnimationTarget<P>

first​

ToStep<P>

Returns​

AnimationBuilder<P>

Methods​

_stepper()​

_stepper(): TweenStepper

Defined in: tween/animation-builder.ts:75

Flat driver over this builder's steps — no generators. Steps run in sequence; each is prepared when the previous one finishes (so its from snapshot is taken at the right time, matching the generator's yield* chaining). parallel uses this to drive a batch of tweens in one loop with zero generator resumes per item.

Returns​

TweenStepper

Implementation of​

Steppable._stepper

[iterator]()​

[iterator](): Iterator<void, void, number>

Defined in: tween/animation-builder.ts:112

Iterator path: yields each step as a chained generator.

Used when the builder is passed to yield* directly or given to sequence. parallel prefers _stepper instead.

Returns​

Iterator<void, void, number>

to()​

to(props, duration, easing?): this

Defined in: tween/animation-builder.ts:63

Append another tween step to this animation chain.

The step starts from whatever property values the node has when the previous step finishes — snapshots are taken lazily at step boundaries.

Parameters​

props​

Partial<P>

Target property values for this step.

duration​

number

Duration of this step in seconds.

easing?​

EaseFunction

Optional easing function (identity / linear if omitted).

Returns​

this

this for further chaining.