Interface: NumberProps

Defined in: nodes/text/number-node.ts:13

Extends

Omit<TextProps, "text">

Properties

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

currencyCode

currencyCode: string

Defined in: nodes/text/number-node.ts:34

ISO 4217 currency code (e.g. 'USD', 'EUR', 'JPY'). Required by Intl.NumberFormat when NumberProps.format is 'currency'; ignored otherwise.

decimals

decimals: number | undefined

Defined in: nodes/text/number-node.ts:43

Fixed number of decimal places to show. Pins both the minimum and maximum fraction digits, so the display always has exactly this many decimals — which keeps a counting animation from flickering trailing digits as the value crosses integer boundaries. Leave unset to use the locale/format default (currency → 2, percent/number → as needed).

effects

effects: Effect

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

Inherited from

NodeProps.effects

end?

optional end?: number

Defined in: nodes/geometry/shape-node.ts:52

Inherited from

ShapeProps.end

fill?

optional fill?: Fill

Defined in: nodes/geometry/shape-node.ts:31

Fill layer(s). Each item can be:

A plain CSS color string → treated as a solid fill
A fill prop object (SolidFillProp, LinearGradientFillProp, …)
An already-resolved fill object
A FillChain from the Fills builder (e.g. Fills.color('red'))

Inherited from

ShapeProps.fill

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

fontFamily

fontFamily: string

Defined in: nodes/text/text-node.ts:28

Inherited from

TextProps.fontFamily

fontStyle

fontStyle: FontStyle

Defined in: nodes/text/text-node.ts:30

Inherited from

TextProps.fontStyle

fontWeight

fontWeight: number

Defined in: nodes/text/text-node.ts:29

Inherited from

TextProps.fontWeight

format

format: NumberFormat

Defined in: nodes/text/number-node.ts:22

Formatting style passed to Intl.NumberFormat:

'number' — plain decimal (the default)
'currency' — money, using NumberProps.currencyCode
'percent' — multiplies by 100 and appends % (so 0.42 → 42%)

height

height: SizeInput

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

Inherited from

NodeProps.height

letterSpacing

letterSpacing: number

Defined in: nodes/text/text-node.ts:31

Inherited from

TextProps.letterSpacing

lineHeight

lineHeight: number

Defined in: nodes/text/text-node.ts:32

Inherited from

TextProps.lineHeight

locale

locale: string | string[] | undefined

Defined in: nodes/text/number-node.ts:28

BCP 47 locale tag controlling digit grouping, decimal mark, and currency placement (e.g. 'en-US', 'de-DE', 'ja-JP'). Defaults to the host environment's locale.

minFontSize

minFontSize: number

Defined in: nodes/text/text-node.ts:35

Inherited from

TextProps.minFontSize

opacity

opacity: number

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

Inherited from

NodeProps.opacity

overlay?

optional overlay?: Fill

Defined in: nodes/geometry/shape-node.ts:38

Overlay layer(s) — the same loose values as fill, but painted over this node's fill and its children (clipped to the node's silhouette) while still sitting under the stroke. Use for textures laid across the whole subtree, e.g. a VHS-grain image or video.

Inherited from

ShapeProps.overlay

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

path

path: PathData | PathBuilder

Defined in: nodes/text/text-node.ts:49

Wrap the text around a path (text-on-path). Accepts the same value shapes as the Path node's d: an SVG path string, a PathCommand[], or a PathBuilder. When set, wrap and multi-line (\n) are ignored (single line), and text selections are not applied.

Inherited from

TextProps.path

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

shadow?

optional shadow?: Shadow

Defined in: nodes/geometry/shape-node.ts:50

Shadow layer(s): a single ShadowProp, an array of them, or an already-resolved shadow. fill inside each shadow accepts the same loose values as the top-level fill prop.

Inherited from

ShapeProps.shadow

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.

Inherited from

NodeProps.size

start?

optional start?: number

Defined in: nodes/geometry/shape-node.ts:51

Inherited from

ShapeProps.start

stroke?

optional stroke?: Stroke

Defined in: nodes/geometry/shape-node.ts:44

Stroke layer(s): a single StrokeProp, an array of them, or an already-resolved stroke. fill inside each stroke accepts the same loose values as the top-level fill prop.

Inherited from

ShapeProps.stroke

textAlign

textAlign: TextAlign

Defined in: nodes/text/text-node.ts:33

Inherited from

TextProps.textAlign

topCenter

topCenter: Vector2 | (() => Vector2)

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

Inherited from

NodeProps.topCenter

topLeft

topLeft: Vector2 | (() => Vector2)

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

Inherited from

NodeProps.topLeft

topRight

topRight: Vector2 | (() => Vector2)

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

Inherited from

NodeProps.topRight

useGrouping

useGrouping: boolean

Defined in: nodes/text/number-node.ts:45

Group digits with the locale's thousands separator (e.g. 1,000).

value

value: number

Defined in: nodes/text/number-node.ts:15

The numeric value to display. Tweenable — to({ value }) counts.

variant

variant: string

Defined in: nodes/text/text-node.ts:42

Name of a typography preset from theme.typography (e.g. "header"). Supplies any text-style prop (fontSize, fontWeight, …) not set explicitly here. An explicit prop always wins over the preset; the preset wins over an inherited <DefaultTextStyle>.