Component element
Embeds a prebuilt component from the versioned library by exact `name` + `version`. Props are validated against the component version's own schema at render time.
Embeds a prebuilt component from the versioned library by exact name + version. Props are validated against the component version's own schema at render time.
Properties
| Property | Type | Default | Description |
|---|---|---|---|
id * | string (non-empty) | — | Stable identifier, unique across the whole movie. Used by editor selection sync and error paths. |
start | number (≥ 0) | 0 | When the element appears, in seconds relative to its scene (or to the movie for movie-level elements). |
duration | number (> 0) | — | How long the element is active, in seconds. Defaults to the remainder of its scene. |
position | object | "top-left" | "top-center" | "top-right" | "center-left" | "center" | "center-right" | "bottom-left" | "bottom-center" | "bottom-right" | "center" | Where to place the element: absolute {x, y} pixels or a named anchor. |
width | number (> 0) | — | Element box width in output pixels. Defaults to an element-specific intrinsic size. |
height | number (> 0) | — | Element box height in output pixels. Defaults to an element-specific intrinsic size. |
opacity | number (0–1) | 1 | Element opacity from 0 (invisible) to 1 (fully opaque). |
rotation | number | 0 | Rotation around the element's center, in degrees (clockwise). |
animation | object | — | Entrance animation applied when the element appears. |
type * | "component" | — | A prebuilt component from the Automotion library. |
name * | string (non-empty) | — | Name of a prebuilt component from the Automotion component library. |
version * | string (matches ^(0|[1-9]\d*)\.(0|[1-9]\d*)\.(0|[1-9]\d*)(?:-[0-9A-Za-z-]+(?:\.[0-9A-Za-z-]+)*)?(?:\+[0-9A-Za-z-]+(?:\.[0-9A-Za-z-]+)*)?$) | — | Semver version of the component to render. |
props | object | \{} | Props passed to the component. Validated against the component's own schema at render time. |
position object
Absolute pixel position of the element's center.
| Property | Type | Default | Description |
|---|---|---|---|
x * | number | — | Horizontal position of the element's center, in output pixels from the left edge. |
y * | number | — | Vertical position of the element's center, in output pixels from the top edge. |
animation object
Entrance animation applied when the element appears.
| Property | Type | Default | Description |
|---|---|---|---|
preset * | "none" | "fade" | "slide-in-left" | "slide-in-right" | "slide-in-up" | "slide-in-down" | "zoom-in" | "zoom-out" | — | Entrance animation preset applied when the element appears. |
easing | "linear" | "ease" | "ease-in" | "ease-out" | "ease-in-out" | "ease" | Easing curve applied to the animation. |
duration | number (> 0) | 0.5 | Animation duration in seconds. |
Example
Component: prebuilt library components addressed by name@version: