Triggers

`animate`

This sets the animate state.

<ArrowRight animate />

// or with AnimateIcon
<AnimateIcon animate>
  <ArrowRight />
</AnimateIcon>

`animateOnHover`

This sets the state to animate on hover.

<ArrowRight animateOnHover />

// or with AnimateIcon
<AnimateIcon animateOnHover>
  <ArrowRight />
</AnimateIcon>

`animateOnTap`

This sets the state to animate on tap.

Note: The state will return to its initial state when the click is released. To ensure that the animation always ends, add the completeOnStop prop.

<ArrowRight animateOnTap />

// or with AnimateIcon
<AnimateIcon animateOnTap>
  <ArrowRight />
</AnimateIcon>

`animateOnView`

This sets the animate state when the icon is in view.

<ArrowRight animateOnView />

// or with AnimateIcon
<AnimateIcon animateOnView>
  <ArrowRight />
</AnimateIcon>

`animateOnViewMargin`

This sets the margin of the in view area.

<ArrowRight animateOnView animateOnViewMargin="10px" />

// or with AnimateIcon
<AnimateIcon animateOnView animateOnViewMargin="10px">
  <ArrowRight />
</AnimateIcon>

`animateOnViewOnce`

This sets the icon to animate only once when it is in view (by default it is true).

<ArrowRight animateOnView animateOnViewOnce={false} />

// or with AnimateIcon
<AnimateIcon animateOnView animateOnViewOnce={false}>
  <ArrowRight />
</AnimateIcon>

API Reference

Prop	Type	Default
`animate?`	`boolean \| string`	`false`
`animateOnHover?`	`boolean \| string`	`false`
`animateOnTap?`	`boolean \| string`	`false`
`animateOnView?`	`boolean \| string`	`false`
`animateOnViewMargin?`	`string`	`0px`
`animateOnViewOnce?`	`boolean`	`true`

Triggers

animate

animateOnHover

animateOnTap

animateOnView

animateOnViewMargin

animateOnViewOnce