@anguless/angulux/motion

motion

2 declarations

import

import { MotionModule } from '@anguless/angulux/motion';

No demos for this module yet. The API reference below is complete: it comes from the corpus, which covers every module the library ships.

API

Generated from the committed corpus, which check:corpus holds to the built library.

Motion

componentagl-motion

Motion component is a container to apply motion effects to its content.

Input	Type	Default	Description
visible	boolean	not documented	Whether the element is visible or not.
mountOnEnter	boolean	not documented	Whether to mount the element on enter.
unmountOnLeave	boolean	not documented	Whether to unmount the element on leave.
name	MotionOptions['name']	not documented	The name of the motion. It can be a predefined motion name or a custom one. phases: [name]-enter [name]-enter-active [name]-enter-to [name]-leave [name]-leave-active [name]-leave-to
type	MotionOptions['type']	not documented	The type of the motion, valid values 'transition' and 'animation'.
safe	MotionOptions['safe']	not documented	Whether the motion is safe.
disabled	MotionOptions['disabled']	not documented	Whether the motion is disabled.
appear	MotionOptions['appear']	not documented	Whether the motion should appear.
enter	MotionOptions['enter']	not documented	Whether the motion should enter.
leave	MotionOptions['leave']	not documented	Whether the motion should leave.
duration	MotionOptions['duration']	not documented	The duration of the motion.
hideStrategy	'display' \| 'visibility'	not documented	The hide strategy of the motion, valid values 'display' and 'visibility'.
enterFromClass	ClassNameOptions['from']	not documented	The enter from class of the motion.
enterToClass	ClassNameOptions['to']	not documented	The enter to class of the motion.
enterActiveClass	ClassNameOptions['active']	not documented	The enter active class of the motion.
leaveFromClass	ClassNameOptions['from']	not documented	The leave from class of the motion.
leaveToClass	ClassNameOptions['to']	not documented	The leave to class of the motion.
leaveActiveClass	ClassNameOptions['active']	not documented	The leave active class of the motion.
options	MotionOptions	not documented	The motion options.

Output	Type	Description
onBeforeEnter	MotionEvent \| undefined	Callback fired before the enter transition/animation starts.
onEnter	MotionEvent \| undefined	Callback fired when the enter transition/animation starts.
onAfterEnter	MotionEvent \| undefined	Callback fired after the enter transition/animation ends.
onEnterCancelled	MotionEvent \| undefined	Callback fired when the enter transition/animation is cancelled.
onBeforeLeave	MotionEvent \| undefined	Callback fired before the leave transition/animation starts.
onLeave	MotionEvent \| undefined	Callback fired when the leave transition/animation starts.
onAfterLeave	MotionEvent \| undefined	Callback fired after the leave transition/animation ends.
onLeaveCancelled	MotionEvent \| undefined	Callback fired when the leave transition/animation is cancelled.

Inherited from BaseComponent

inherited

Input	Type	Default	Description
dt	Object \| undefined	undefined	Defines scoped design tokens of the component.
unstyled	boolean \| undefined	undefined	Indicates whether the component should be rendered without styles.
pt	PT \| undefined	undefined	Used to pass attributes to DOM elements inside the component. TRUSTED INPUT ONLY. Whatever you put here is applied to the DOM as given: keys become attributes, and a key that names a DOM property is assigned to that property directly, with no sanitizer in between. That is what makes the API useful, and it means a value reaching it from a user, a database or a CMS can execute script. Treat it like markup you wrote yourself, not like data you received.
ptOptions	PassThroughOptions \| undefined	undefined	Used to configure passthrough(pt) options of the component.

MotionDirective

directive[aglMotion]

Motion Directive is directive to apply motion effects to elements.

Input	Type	Default	Description
aglMotion property visible	boolean	not documented	Whether the element is visible or not.
aglMotionName property name	MotionOptions['name']	not documented	The name of the motion. It can be a predefined motion name or a custom one. phases: [name]-enter [name]-enter-active [name]-enter-to [name]-leave [name]-leave-active [name]-leave-to
aglMotionType property type	MotionOptions['type']	not documented	The type of the motion, valid values 'transition' and 'animation'.
aglMotionSafe property safe	MotionOptions['safe']	not documented	Whether the motion is safe.
aglMotionDisabled property disabled	MotionOptions['disabled']	not documented	Whether the motion is disabled.
aglMotionAppear property appear	MotionOptions['appear']	not documented	Whether the motion should appear.
aglMotionEnter property enter	MotionOptions['enter']	not documented	Whether the motion should enter.
aglMotionLeave property leave	MotionOptions['leave']	not documented	Whether the motion should leave.
aglMotionDuration property duration	MotionOptions['duration']	not documented	The duration of the motion.
aglMotionHideStrategy property hideStrategy	'display' \| 'visibility'	not documented	The hide strategy of the motion, valid values 'display' and 'visibility'.
aglMotionEnterFromClass property enterFromClass	ClassNameOptions['from']	not documented	The enter from class of the motion.
aglMotionEnterToClass property enterToClass	ClassNameOptions['to']	not documented	The enter to class of the motion.
aglMotionEnterActiveClass property enterActiveClass	ClassNameOptions['active']	not documented	The enter active class of the motion.
aglMotionLeaveFromClass property leaveFromClass	ClassNameOptions['from']	not documented	The leave from class of the motion.
aglMotionLeaveToClass property leaveToClass	ClassNameOptions['to']	not documented	The leave to class of the motion.
aglMotionLeaveActiveClass property leaveActiveClass	ClassNameOptions['active']	not documented	The leave active class of the motion.
aglMotionOptions property options	MotionOptions	not documented	The motion options.

Output	Type	Description
aglMotionOnBeforeEnter property onBeforeEnter	MotionEvent \| undefined	Callback fired before the enter transition/animation starts.
aglMotionOnEnter property onEnter	MotionEvent \| undefined	Callback fired when the enter transition/animation starts.
aglMotionOnAfterEnter property onAfterEnter	MotionEvent \| undefined	Callback fired after the enter transition/animation ends.
aglMotionOnEnterCancelled property onEnterCancelled	MotionEvent \| undefined	Callback fired when the enter transition/animation is cancelled.
aglMotionOnBeforeLeave property onBeforeLeave	MotionEvent \| undefined	Callback fired before the leave transition/animation starts.
aglMotionOnLeave property onLeave	MotionEvent \| undefined	Callback fired when the leave transition/animation starts.
aglMotionOnAfterLeave property onAfterLeave	MotionEvent \| undefined	Callback fired after the leave transition/animation ends.
aglMotionOnLeaveCancelled property onLeaveCancelled	MotionEvent \| undefined	Callback fired when the leave transition/animation is cancelled.

Inherited from BaseComponent

inherited

Input	Type	Default	Description
dt	Object \| undefined	undefined	Defines scoped design tokens of the component.
unstyled	boolean \| undefined	undefined	Indicates whether the component should be rendered without styles.
pt	PT \| undefined	undefined	Used to pass attributes to DOM elements inside the component. TRUSTED INPUT ONLY. Whatever you put here is applied to the DOM as given: keys become attributes, and a key that names a DOM property is assigned to that property directly, with no sanitizer in between. That is what makes the API useful, and it means a value reaching it from a user, a database or a CMS can execute script. Treat it like markup you wrote yourself, not like data you received.
ptOptions	PassThroughOptions \| undefined	undefined	Used to configure passthrough(pt) options of the component.