@motion-script/core / RootProps

Interface: RootProps

Defined in: nodes/scene/root-node.ts:26

Internal

Extends

NodeProps

Properties

align

align: Anchor

Defined in: nodes/scene/root-node.ts:48

Alignment of children within the content box: a named position ('center', 'topLeft', …) or an explicit per-axis pivot Vector2 (x: -1 left … +1 right, y: -1 bottom … +1 top).

blend

blend: "color" | "multiply" | "screen" | "overlay" | "darken" | "lighten" | "color-dodge" | "color-burn" | "hard-light" | "soft-light" | "difference" | "exclusion" | "hue" | "saturation" | "luminosity" | "normal" | "pass-through"

Defined in: nodes/base/node.ts:168

Layer blend mode. 'pass-through' (default) does not isolate the node — its opacity scales each child/fill while they blend against the backdrop. Any other mode isolates the node and blends its flattened result against the backdrop.

Inherited from

NodeProps.blend

bottomCenter

bottomCenter: Vector2 | (() => Vector2)

Defined in: nodes/base/node.ts:214

Inherited from

NodeProps.bottomCenter

bottomLeft

bottomLeft: Vector2 | (() => Vector2)

Defined in: nodes/base/node.ts:211

Inherited from

NodeProps.bottomLeft

bottomRight

bottomRight: Vector2 | (() => Vector2)

Defined in: nodes/base/node.ts:212

Inherited from

NodeProps.bottomRight

center

center: Vector2 | (() => Vector2)

Defined in: nodes/base/node.ts:208

Inherited from

NodeProps.center

centerLeft

centerLeft: Vector2 | (() => Vector2)

Defined in: nodes/base/node.ts:215

Inherited from

NodeProps.centerLeft

centerRight

centerRight: Vector2 | (() => Vector2)

Defined in: nodes/base/node.ts:216

Inherited from

NodeProps.centerRight

childPositioning

childPositioning: ChildPositioning

Defined in: nodes/base/node.ts:181

Frame of reference this node lays its children out in. 'relative' (default) positions them inside this node's own content box; 'absolute' pins them to the stage instead, so their x/y are scene-root coordinates and this node's flow/gap/padding no longer place them. Overridden per child by relativeToParent.

Inherited from

NodeProps.childPositioning

children

children: NodeChildren

Defined in: nodes/base/node.ts:193

Child nodes. A single Node, or an arbitrarily-nested array of them — the constructor flattens nesting (.flat(Infinity)), so .map() results can be dropped in directly as a child without spreading, like React.

Inherited from

NodeProps.children

clip

clip: boolean

Defined in: nodes/base/node.ts:173

When true, content drawn outside this node's outline is clipped away (see Node.clipSelf).

Inherited from

NodeProps.clip

colSpan

colSpan: number

Defined in: nodes/base/node.ts:234

How many grid columns this child spans. Default 1.

Inherited from

NodeProps.colSpan

column

column: number

Defined in: nodes/base/node.ts:230

1-based column index for explicit grid placement. Undefined = auto-placed.

Inherited from

NodeProps.column

effects

effects: Effect

Defined in: nodes/base/node.ts:169

Inherited from

NodeProps.effects

fill

fill: Fill

Defined in: nodes/scene/root-node.ts:32

Background fill layer(s). Each item can be a CSS color string, a fill prop object, an already-resolved fill, or a FillChain from the Fills builder. Painted behind the scene's children.

flex

flex: number

Defined in: nodes/base/node.ts:226

Proportional share of the free space along the parent's main axis, relative to sibling fill children (like Flutter's Expanded(flex:)). Only meaningful when this node fills the main axis — in a row that's width:'fill', in a column height:'fill'. Two siblings with flex 2 and 1 split the free space 2:1. Defaults to 1. Specifying flex without an explicit width/height defaults both to 'fill'.

Inherited from

NodeProps.flex

flow

flow: FlowMode

Defined in: nodes/scene/root-node.ts:40

Layout mode for children: flex horizontal / vertical, or overlapping freeform.

gap

gap: GapSize

Defined in: nodes/scene/root-node.ts:42

Spacing between children along the layout's main axis.

heading

heading: number

Defined in: nodes/scene/root-node.ts:54

Rotation of the camera view in degrees (clockwise).

height

height: SizeInput

Defined in: nodes/base/node.ts:152

Inherited from

NodeProps.height

lookAt

lookAt: Vector2

Defined in: nodes/scene/root-node.ts:52

World-space point that maps to the centre of the viewport.

opacity

opacity: number

Defined in: nodes/base/node.ts:166

Inherited from

NodeProps.opacity

overlay

overlay: Fill

Defined in: nodes/scene/root-node.ts:38

Overlay layer(s) — same loose values as fill, but painted over the fill and the children (clipped to the viewport). Use for textures laid across the whole scene, e.g. a VHS-grain image or video.

padding

padding: Insets

Defined in: nodes/base/node.ts:171

Inner spacing between this node's edges and its content/children.

Inherited from

NodeProps.padding

pivot

pivot: Anchor

Defined in: nodes/base/node.ts:201

Pivot point for rotation and scale. Either a named anchor ('center', 'topRight', 'bottomLeft', … — the node align vocabulary) or an explicit Vector2: (0,0)=center, (-1,1)=top-left, (1,-1)=bottom-right. Set automatically when an anchor positioning prop is used.

Inherited from

NodeProps.pivot

relativeToParent

relativeToParent: RelativeToParent

Defined in: nodes/base/node.ts:187

This node's own override of its parent's childPositioning. 'inherit' (default) takes whatever the parent declared; 'relative' and 'absolute' opt this one node in or out regardless.

Inherited from

NodeProps.relativeToParent

rotation

rotation: number

Defined in: nodes/base/node.ts:165

Inherited from

NodeProps.rotation

row

row: number

Defined in: nodes/base/node.ts:232

1-based row index for explicit grid placement. Undefined = auto-placed.

Inherited from

NodeProps.row

rowSpan

rowSpan: number

Defined in: nodes/base/node.ts:236

How many grid rows this child spans. Default 1.

Inherited from

NodeProps.rowSpan

scale

scale: number

Defined in: nodes/base/node.ts:164

Inherited from

NodeProps.scale

seed

seed: string | number

Defined in: nodes/base/node.ts:245

Origin seed for this node's Node.random source. Defaults to 0. Set it to give the node a reproducible-but-distinct random stream without re-seeding by hand. The constructor adopts it as random's origin, and the runtime rebuilds the node each playback pass, so draws stay reproducible across scrub/precomp/HMR.

Inherited from

NodeProps.seed

size

size: SizeInput

Defined in: nodes/base/node.ts:163

Sets width and height to the same value in one go. Pure sugar: at construction time, an author-facing size is expanded into width/ height before either is applied. Explicit width or height takes precedence over size (mirroring padding's side-vs-shorthand rule), so { size: 200, width: 100 } yields width: 100, height: 200. Reactive bindings and to()/set() targets both work the same as width/height — size: 'fill', size: () => ..., or node.to({ size: 300 }, 0.5) are all valid.