Imperative Targets

Imperative targets are created using setTarget(), allowing a declarative target to initiate one or more dynamic value updates or animations that can execute concurrently each time value() get executed.

Imperative targets are integrated into the lifecycle of the declarative target that initiated them. The onUpdate() callback is invoked as imperative targets update, while onComplete() is called only when the declarative target has finished all its operations, including any imperative targets it started.

Similarly, the $ and $$ postfixes extend this reactivity to subsequent targets. The $ postfix responds to execution updates, while $$ waits for all preceding operations, including imperative executions, to complete.

move$$ 0 undefined
        x+ 1 149
        y+ 1 3
        x+ 2 146
        y+ 2 8
        ...
        x+ 19 103
        y+ 19 93
        x+ 20 101
        y+ 20 99
        x+ 20 100
        y+ 20 100
        Both movements completed
        Starting color transition
        

The move$$ target waits for the initial x animation to complete before initiating two imperative animations using setTarget(). Both animations execute concurrently.

The onUpdate() callback receives the TModel and target name responsible for each execution update, allowing the declarative target to monitor both imperative animations from a single place.

Once both animations have finished, onComplete() is called. This allows declarative targets to coordinate multiple imperative operations through their own lifecycle callbacks.

Finally, changeColor$$ is activated. The $$ postfix ensures that the color transition begins only after all preceding operations, including the imperative animations, have completed.