# Interface: ShockwaveEffectProps (/pixi-vn/index/interfaces/ShockwaveEffectProps)



Defined in: [src/canvas/interfaces/effect-props.ts:211](https://github.com/DRincs-Productions/pixi-vn/blob/5bb5bb1f92e38998ea2f477b600168d8da3ece19/src/canvas/interfaces/effect-props.ts#L211)

## Extends [#extends]

* `BaseTransitionProps`.`AnimationOptions`

## Properties [#properties]

### aliasToRemoveAfter? [#aliastoremoveafter]

\> `optional` **aliasToRemoveAfter?**: `string` | `string`\[]

Defined in: [src/tickers/types/CommonTickerProps.ts:6](https://github.com/DRincs-Productions/pixi-vn/blob/5bb5bb1f92e38998ea2f477b600168d8da3ece19/src/tickers/types/CommonTickerProps.ts#L6)

An array of strings containing the aliases of the canvas components to remove after the animation completes.

#### Default [#default]

```ts
[]
```

#### Inherited from [#inherited-from]

`AnimationOptions.aliasToRemoveAfter`

***

### amplitude? [#amplitude]

\> `optional` **amplitude?**: `number`

Defined in: [src/canvas/interfaces/effect-props.ts:221](https://github.com/DRincs-Productions/pixi-vn/blob/5bb5bb1f92e38998ea2f477b600168d8da3ece19/src/canvas/interfaces/effect-props.ts#L221)

The amplitude of the ripple.

#### Default [#default-1]

```ts
30
```

***

### autoplay? [#autoplay]

\> `optional` **autoplay?**: `boolean`

Defined in: node_modules/motion-dom/dist/index.d.ts:2239

#### Inherited from [#inherited-from-1]

`AnimationOptions.autoplay`

***

### bounce? [#bounce]

\> `optional` **bounce?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2062

`bounce` determines the "bounciness" of a spring animation.

`0` is no bounce, and `1` is extremely bouncy.

If `duration` is set, this defaults to `0.25`.

Note: `bounce` and `duration` will be overridden if `stiffness`, `damping` or `mass` are set.

#### Inherited from [#inherited-from-2]

`AnimationOptions.bounce`

***

### bounceDamping? [#bouncedamping]

\> `optional` **bounceDamping?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2136

If `min` or `max` is set, this affects the damping of the bounce spring.
If set to `0`, spring will oscillate indefinitely. Set to `10` by
default.

#### Inherited from [#inherited-from-3]

`AnimationOptions.bounceDamping`

***

### bounceStiffness? [#bouncestiffness]

\> `optional` **bounceStiffness?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2128

If `min` or `max` is set, this affects the stiffness of the bounce
spring. Higher values will create more sudden movement. Set to `500` by
default.

#### Inherited from [#inherited-from-4]

`AnimationOptions.bounceStiffness`

***

### brightness? [#brightness]

\> `optional` **brightness?**: `number`

Defined in: [src/canvas/interfaces/effect-props.ts:231](https://github.com/DRincs-Productions/pixi-vn/blob/5bb5bb1f92e38998ea2f477b600168d8da3ece19/src/canvas/interfaces/effect-props.ts#L231)

The brightness of the ripple.

#### Default [#default-2]

```ts
1
```

***

### completeOnContinue? [#completeoncontinue]

\> `optional` **completeOnContinue?**: `boolean`

Defined in: [src/canvas/interfaces/transition-props.ts:11](https://github.com/DRincs-Productions/pixi-vn/blob/5bb5bb1f92e38998ea2f477b600168d8da3ece19/src/canvas/interfaces/transition-props.ts#L11)

If true, the transition will be completed before the next step.
For example, if the transition is a dissolve transition, the "alpha" of the texture will be 1 before the next step.

#### Default [#default-3]

```ts
true
```

#### Inherited from [#inherited-from-5]

`BaseTransitionProps.completeOnContinue`

***

### damping? [#damping]

\> `optional` **damping?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2082

Strength of opposing force. If set to 0, spring will oscillate
indefinitely. Set to `10` by default.

#### Default [#default-4]

```ts
10

@public
```

#### Inherited from [#inherited-from-6]

`AnimationOptions.damping`

***

### delay? [#delay]

\> `optional` **delay?**: `number` | `DynamicOption`\<`number`>

Defined in: node_modules/motion-dom/dist/index.d.ts:2370

#### Inherited from [#inherited-from-7]

`AnimationOptions.delay`

***

### delayChildren? [#delaychildren]

\> `optional` **delayChildren?**: `number` | `DynamicOption`\<`number`>

Defined in: node_modules/motion-dom/dist/index.d.ts:2178

When using variants, children animations will start after this duration
(in seconds). You can add the `transition` property to both the `motion.div` and the
`variant` directly. Adding it to the `variant` generally offers more flexibility,
as it allows you to customize the delay per visual state.

#### Inherited from [#inherited-from-8]

`AnimationOptions.delayChildren`

***

### driver? [#driver]

\> `optional` **driver?**: `Driver`

Defined in: node_modules/motion-dom/dist/index.d.ts:2224

#### Inherited from [#inherited-from-9]

`AnimationOptions.driver`

***

### duration? [#duration]

\> `optional` **duration?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2238

The duration of the tween animation. Set to `0.3` by default, 0r `0.8` if animating a series of keyframes.

#### Inherited from [#inherited-from-10]

`AnimationOptions.duration`

***

### ease? [#ease]

\> `optional` **ease?**: `Easing` | `Easing`\[]

Defined in: node_modules/motion-dom/dist/index.d.ts:2209

#### Inherited from [#inherited-from-11]

`AnimationOptions.ease`

***

### elapsed? [#elapsed]

\> `optional` **elapsed?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2223

The duration of time already elapsed in the animation. Set to `0` by
default.

#### Inherited from [#inherited-from-12]

`AnimationOptions.elapsed`

***

### from? [#from]

\> `optional` **from?**: `any`

Defined in: node_modules/motion-dom/dist/index.d.ts:2241

#### Inherited from [#inherited-from-13]

`AnimationOptions.from`

***

### inherit? [#inherit]

\> `optional` **inherit?**: `boolean`

Defined in: node_modules/motion-dom/dist/index.d.ts:2248

If true, this transition will shallow-merge with its parent transition
instead of replacing it. Inner keys win.

#### Inherited from [#inherited-from-14]

`AnimationOptions.inherit`

***

### isSync? [#issync]

\> `optional` **isSync?**: `boolean`

Defined in: node_modules/motion-dom/dist/index.d.ts:1982

#### Inherited from [#inherited-from-15]

`AnimationOptions.isSync`

***

### mass? [#mass]

\> `optional` **mass?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2091

Mass of the moving object. Higher values will result in more lethargic
movement. Set to `1` by default.

#### Default [#default-5]

```ts
1

@public
```

#### Inherited from [#inherited-from-16]

`AnimationOptions.mass`

***

### max? [#max]

\> `optional` **max?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2148

Maximum constraint. If set, the value will "bump" against this value (or immediately snap to it, if the initial animation value exceeds this value).

#### Inherited from [#inherited-from-17]

`AnimationOptions.max`

***

### min? [#min]

\> `optional` **min?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2142

Minimum constraint. If set, the value will "bump" against this value (or immediately spring to it if the animation starts as less than this value).

#### Inherited from [#inherited-from-18]

`AnimationOptions.min`

***

### modifyTarget? [#modifytarget]

\> `optional` **modifyTarget?**: (`v`) => `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2118

A function that receives the automatically-calculated target and returns a new one. Useful for snapping the target to a grid.

#### Parameters [#parameters]

##### v [#v]

`number`

#### Returns [#returns]

`number`

#### Inherited from [#inherited-from-19]

`AnimationOptions.modifyTarget`

***

### origin? [#origin]

\> `optional` **origin?**: `object`

Defined in: [src/canvas/interfaces/effect-props.ts:216](https://github.com/DRincs-Productions/pixi-vn/blob/5bb5bb1f92e38998ea2f477b600168d8da3ece19/src/canvas/interfaces/effect-props.ts#L216)

The origin of the ripple, normalized (0-1) to the element's own bounds.

#### x [#x]

\> **x**: `number`

#### y [#y]

\> **y**: `number`

#### Default [#default-6]

```ts
{x: 0.5, y: 0.5}
```

***

### path? [#path]

\> `optional` **path?**: `MotionPath` | `MotionPath` & `ValueTransition`

Defined in: node_modules/motion-dom/dist/index.d.ts:2267

The path the element travels between its old and new x/y positions.
Slot in a path factory (e.g. `arc()`) to swap the default
straight-line interpolation for something curved.

Can be used in keyframe animations (`transition.path`) and layout
animations (`transition.layout.path`), including with `useAnimate`.

#### Inherited from [#inherited-from-20]

`AnimationOptions.path`

***

### power? [#power]

\> `optional` **power?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2105

A higher power value equals a further target. Set to `0.8` by default.

#### Inherited from [#inherited-from-21]

`AnimationOptions.power`

***

### radius? [#radius]

\> `optional` **radius?**: `number`

Defined in: [src/canvas/interfaces/effect-props.ts:237](https://github.com/DRincs-Productions/pixi-vn/blob/5bb5bb1f92e38998ea2f477b600168d8da3ece19/src/canvas/interfaces/effect-props.ts#L237)

The maximum radius (in pixels) the ripple travels before fading out. A value `<= 0` means the
ripple travels an infinite distance.

#### Default [#default-7]

```ts
-1
```

***

### reduceMotion? [#reducemotion]

\> `optional` **reduceMotion?**: `boolean`

Defined in: node_modules/motion-dom/dist/index.d.ts:2380

Whether to reduce motion for transform/layout animations.

* `true`: Skip transform/layout animations (instant transition)
* `false`: Always animate transforms/layout
* `undefined`: Use device preference (default behavior)

#### Inherited from [#inherited-from-22]

`AnimationOptions.reduceMotion`

***

### repeat? [#repeat]

\> `optional` **repeat?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:1993

The number of times to repeat the transition. Set to `Infinity` for perpetual repeating.

Without setting `repeatType`, this will loop the animation.

#### Inherited from [#inherited-from-23]

`AnimationOptions.repeat`

***

### repeatDelay? [#repeatdelay]

\> `optional` **repeatDelay?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2012

When repeating an animation, `repeatDelay` will set the
duration of the time to wait, in seconds, between each repetition.

#### Inherited from [#inherited-from-24]

`AnimationOptions.repeatDelay`

***

### repeatType? [#repeattype]

\> `optional` **repeatType?**: `RepeatType`

Defined in: node_modules/motion-dom/dist/index.d.ts:2005

How to repeat the animation. This can be either:

"loop": Repeats the animation from the start

"reverse": Alternates between forward and backwards playback

"mirror": Switches `from` and `to` alternately

#### Inherited from [#inherited-from-25]

`AnimationOptions.repeatType`

***

### restDelta? [#restdelta]

\> `optional` **restDelta?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2030

End animation if distance is below this value and speed is below
`restSpeed`. When animation ends, spring gets "snapped" to. Set to
`0.01` by default.

#### Inherited from [#inherited-from-26]

`AnimationOptions.restDelta`

***

### restSpeed? [#restspeed]

\> `optional` **restSpeed?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2022

End animation if absolute speed (in units per second) drops below this
value and delta is smaller than `restDelta`. Set to `0.01` by default.

#### Inherited from [#inherited-from-27]

`AnimationOptions.restSpeed`

***

### skipAnimations? [#skipanimations]

\> `optional` **skipAnimations?**: `boolean`

Defined in: node_modules/motion-dom/dist/index.d.ts:2256

If true, the animation skips straight to its final value instead of
tweening. Used by `MotionConfig`'s `skipAnimations` to opt entire
subtrees out of animation (e.g. for E2E screenshot stability).

#### Inherited from [#inherited-from-28]

`AnimationOptions.skipAnimations`

***

### speed? [#speed]

\> `optional` **speed?**: `number`

Defined in: [src/canvas/interfaces/effect-props.ts:242](https://github.com/DRincs-Productions/pixi-vn/blob/5bb5bb1f92e38998ea2f477b600168d8da3ece19/src/canvas/interfaces/effect-props.ts#L242)

The speed (in pixels-per-second) the ripple travels outward.

#### Default [#default-8]

```ts
500
```

***

### ~~staggerChildren?~~ [#staggerchildren]

\> `optional` **staggerChildren?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2191

When using variants, animations of child components can be staggered by this
duration (in seconds).

For instance, if `staggerChildren` is `0.01`, the first child will be
delayed by `0` seconds, the second by `0.01`, the third by `0.02` and so
on.

The calculated stagger delay will be added to `delayChildren`.

#### Deprecated [#deprecated]

* Use `delayChildren: stagger(interval)` instead.

#### Inherited from [#inherited-from-29]

`AnimationOptions.staggerChildren`

***

### ~~staggerDirection?~~ [#staggerdirection]

\> `optional` **staggerDirection?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2200

The direction in which to stagger children.

A value of `1` staggers from the first to the last while `-1`
staggers from the last to the first.

#### Deprecated [#deprecated-1]

* Use `delayChildren: stagger(interval, { from: "last" })` instead.

#### Inherited from [#inherited-from-30]

`AnimationOptions.staggerDirection`

***

### startTime? [#starttime]

\> `optional` **startTime?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2240

#### Inherited from [#inherited-from-31]

`AnimationOptions.startTime`

***

### stiffness? [#stiffness]

\> `optional` **stiffness?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2073

Stiffness of the spring. Higher values will create more sudden movement.
Set to `100` by default.

#### Default [#default-9]

```ts
100

@public
```

#### Inherited from [#inherited-from-32]

`AnimationOptions.stiffness`

***

### strength? [#strength]

\> `optional` **strength?**: `number`

Defined in: [src/canvas/interfaces/effect-props.ts:249](https://github.com/DRincs-Productions/pixi-vn/blob/5bb5bb1f92e38998ea2f477b600168d8da3ece19/src/canvas/interfaces/effect-props.ts#L249)

How far the ripple's own internal "time" advances by the end of the animation (the ring's
radius is `time * speed` pixels). By default it's just enough for the ring to fully leave the
component - origin to farthest corner plus half a [wavelength](#wavelength) - or [radius](#radius) when set,
divided by [speed](#speed).

***

### tickerAliasToResume? [#tickeraliastoresume]

\> `optional` **tickerAliasToResume?**: `string` | `string`\[]

Defined in: [src/tickers/types/CommonTickerProps.ts:16](https://github.com/DRincs-Productions/pixi-vn/blob/5bb5bb1f92e38998ea2f477b600168d8da3ece19/src/tickers/types/CommonTickerProps.ts#L16)

If you want to resume tickers that were previously paused, provide the aliases of the canvas components whose tickers should be resumed.

#### Default [#default-10]

```ts
[]
```

#### Inherited from [#inherited-from-33]

`AnimationOptions.tickerAliasToResume`

***

### tickerIdToResume? [#tickeridtoresume]

\> `optional` **tickerIdToResume?**: `string` | `string`\[]

Defined in: [src/tickers/types/CommonTickerProps.ts:21](https://github.com/DRincs-Productions/pixi-vn/blob/5bb5bb1f92e38998ea2f477b600168d8da3ece19/src/tickers/types/CommonTickerProps.ts#L21)

A string containing the ticker ID to resume after the animation completes.

#### Default [#default-11]

```ts
[]
```

#### Inherited from [#inherited-from-34]

`AnimationOptions.tickerIdToResume`

***

### timeConstant? [#timeconstant]

\> `optional` **timeConstant?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2112

Adjusting the time constant will change the duration of the
deceleration, thereby affecting its feel. Set to `700` by default.

#### Inherited from [#inherited-from-35]

`AnimationOptions.timeConstant`

***

### times? [#times]

\> `optional` **times?**: `number`\[]

Defined in: node_modules/motion-dom/dist/index.d.ts:2210

#### Inherited from [#inherited-from-36]

`AnimationOptions.times`

***

### type? [#type]

\> `optional` **type?**: `AnimationGeneratorType`

Defined in: node_modules/motion-dom/dist/index.d.ts:2232

Type of animation to use.

* "tween": Duration-based animation with ease curve
* "spring": Physics or duration-based spring animation
* false: Use an instant animation

#### Inherited from [#inherited-from-37]

`AnimationOptions.type`

***

### velocity? [#velocity]

\> `optional` **velocity?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2015

#### Inherited from [#inherited-from-38]

`AnimationOptions.velocity`

***

### visualDuration? [#visualduration]

\> `optional` **visualDuration?**: `number`

Defined in: node_modules/motion-dom/dist/index.d.ts:2050

If visualDuration is set, this will override duration.

The visual duration is a time, set in seconds, that the animation will take to visually appear to reach its target.

In other words, the bulk of the transition will occur before this time, and the "bouncy bit" will mostly happen after.

This makes it easier to edit a spring, as well as visually coordinate it with other time-based animations.

#### Inherited from [#inherited-from-39]

`AnimationOptions.visualDuration`

***

### wavelength? [#wavelength]

\> `optional` **wavelength?**: `number`

Defined in: [src/canvas/interfaces/effect-props.ts:226](https://github.com/DRincs-Productions/pixi-vn/blob/5bb5bb1f92e38998ea2f477b600168d8da3ece19/src/canvas/interfaces/effect-props.ts#L226)

The wavelength of the ripple.

#### Default [#default-12]

```ts
160
```

***

### when? [#when]

\> `optional` **when?**: `string` | `false`

Defined in: node_modules/motion-dom/dist/index.d.ts:2169

Describes the relationship between the transition and its children. Set
to `false` by default.

#### Remarks [#remarks]

When using variants, the transition can be scheduled in relation to its
children with either `"beforeChildren"` to finish this transition before
starting children transitions, `"afterChildren"` to finish children
transitions before starting this transition.

#### Inherited from [#inherited-from-40]

`AnimationOptions.when`