Create a subscription to AnimationFrame.times.

It is throttled based on whether the current animation is running or not.

Render style properties into the style attribute and render other attributes as needed for svg.

Combine "transform" based properties into a single css property.

Combine "filter" based properties into a single css property.

Interrupt any running animations with the following animation.

Add an animation to the queue, execiting once the current animation finishes

Animate to a set of target values, using the default interpolation.

Animate to a set of target values. Use a temporary interpolation instead of the default. The interpolation will revert back to default after this step.

Animate to a set of target values. Use a temporary interpolation for each property instead of the default. The interpolation will revert back to default after this step.

Immediately set properties to a value.

Repeat a number of steps n times.

Repeat a number of steps until interrupted.

Update an animation.

Set an initial style for an animation.

Uses standard defaults for interpolation

Set an initial style for an animation and override the standard default for interpolation.

Set an initial style for an animation and specify the interpolation to be used for each property.

Any property not listed will receive interpolation based on the standard defaults.

Specify a custom Spring to animate with. To be used in conjunction with StyleWith, StyleWithEach, toWith, and toWithEach.

This should be your preferred interpolation to use.

Specify a custom Easing to animate with. To be used in conjunction with StyleWith, StyleWithEach, toWith, and toWithEach.

Specify a speed to animate with. To be used in conjunction with StyleWith, StyleWithEach, toWith, and toWithEach.

Generally be sure you don't want Animation.spring or Animation.easing instead as they are more powerful.

Create a CSS filter-url

Create a CSS blur filter, these stack with other filters.

Create a CSS brightness filter, these stack with other filters.

Create a CSS contrast filter, these stack with other filters.

Create a CSS grayscale filter, these stack with other filters.

Create a CSS grayscale filter, these stack with other filters. This is a spelling adjusment.

Create a CSS hue-rotation filter, these stack with other filters.

Create a CSS invert filter, these stack with other filters.

Create a CSS saturate filter, these stack with other filters.

Create a CSS sepia filter, these stack with other filters.

Used for svg gradients

Used for svg gradients. Accepts a number between 0 and 1.

Used with the svg polygon element

To be used with the svg path element. Renders as the d property.

Close a Path

Create a relative curve with 1 control point and a target point. This is a Quadratic curve in teh svg spec.

Create an absolute curve with 1 control point and a target point. This is a Quadratic curve in teh svg spec.

Create a relative Curve with 2 control points and a target point. This is a Cubic Curve in the svg spec.

Create an absolute Curve with 2 control points and a target point. This is a Cubic Curve in the svg spec.

Animate a custom property by providing it's name, a float value, and the units it should have.

Animate a custom property with two values by providing it's name, and a pair of tuples with (value, unit).

We convert the rgb channels to a float because that allows us to use the motion type without parametricity. When rendering we convert them back to ints because CSS does not recognize rgb as floats.

Set a non-numerical to an exact value. This is generally only used with Animation.set.

For example

Animation.set
    [ Animation.exactly "border-style" "dashed"
    ]