Reference

MoveVariantsDirective

Stable API — covered by semantic-versioning guarantees.

Overview

Stable API — covered by semantic-versioning guarantees.

Kind: Directive
Stability: stable

Selector

[moveVariants]

Inputs

Input	Type	Default	Required	Description
`moveVariants`	`Record<string, MoveVariant>`		Yes
`moveVariant`	`string \| undefined`	`undefined`		Active variant name. Prefer this over `moveActiveVariant`.
`moveActiveVariant`	`string \| undefined`	`undefined`		Deprecated. Use `moveVariant` instead; kept as a permanent, fully-supported alias for the same input — it will not be removed without a major version.
`moveExitVariant`	`string \| undefined`	`undefined`
`moveDuration`	`unknown`	`undefined`		Transform `optionalTimeAttribute('moveDuration')`; reads as `number \| undefined`.
`moveEasing`	`string \| undefined`	`undefined`
`moveDelay`	`unknown`	`undefined`		Transform `optionalTimeAttribute('moveDelay')`; reads as `number \| undefined`.
`moveDisabled`	`unknown`	`undefined`		Transform `optionalBooleanAttribute`; reads as `boolean \| undefined`.
`moveSpring`	`MoveSpring \| undefined`	`undefined`
`moveTransition`	`MoveTransitionConfig \| undefined`	`undefined`

Properties

Name	Type	Description
`readonly activeVariant`	`Signal<string \| undefined>`

Public methods

registerChild

registerChild(element: HTMLElement): void

Optional so an existing implementation of this interface keeps compiling.

Parameter	Type	Optional	Description
`element`	`HTMLElement`

unregisterChild

unregisterChild(element: HTMLElement): void

Parameter	Type	Optional	Description
`element`	`HTMLElement`

childDelay

childDelay(element: HTMLElement): number

Orchestration delay for one nested [moveVariants] child, from this element's active variant.

beforeChildren offsets the children by the parent's own duration. Children are assumed to share that duration unless they override it — there is no way to know a child's duration from here, and guessing one number is more useful than refusing to orchestrate at all.

Parameter	Type	Optional	Description
`element`	`HTMLElement`

playLeave

playLeave(): Promise<void>

cancelLeave

cancelLeave(): void