@gtkx/react / AdwTimedAnimationProps

Type Alias: AdwTimedAnimationProps

AdwTimedAnimationProps = AnimationBaseProps & object

Defined in: packages/react/src/jsx.ts:71

Props for a timed (duration-based) animation using Adw.TimedAnimation.

Type Declaration

Name	Type	Description	Defined in
alternate?	boolean	Whether to alternate direction on each repeat	packages/react/src/jsx.ts:83
delay?	number	Delay before starting the animation in milliseconds	packages/react/src/jsx.ts:77
duration?	number	Animation duration in milliseconds (default: 300)	packages/react/src/jsx.ts:73
easing?	Adw.Easing	Easing function for the animation curve (default: EASE_OUT_CUBIC)	packages/react/src/jsx.ts:75
repeat?	number	Number of times to repeat the animation (0 = no repeat, -1 = infinite)	packages/react/src/jsx.ts:79
reverse?	boolean	Whether to play the animation in reverse	packages/react/src/jsx.ts:81

Example

<AdwTimedAnimation
  initial={{ opacity: 0 }}
  animate={{ opacity: 1 }}
  duration={300}
  easing={Adw.Easing.EASE_OUT_CUBIC}
  animateOnMount
>
  <GtkLabel label="Fade in" />
</AdwTimedAnimation>