Skip to content

API Reference / @gtkx/animated / useChain

Function: useChain()

useChain(refs, timeSteps?, timeFrame?): void

Defined in: node_modules/.pnpm/@react-spring+core@10.1.2_react@19.2.8/node_modules/@react-spring/core/dist/react-spring_core.modern.d.mts:1059

Used to orchestrate animation hooks in sequence with one another. This is best used when you specifically want to orchestrate different types of animation hook e.g. useSpring & useTransition in sequence as opposed to multiple useSpring hooks.

jsx
export const MyComponent = () => {
 //...
 useChain([springRef, transitionRef])
 //...
}

Parameters

refs

readonly SpringRef<Lookup<any>>[]

– An array of SpringRefs.

timeSteps?

number[]

– Optional array of numbers that define the delay between each animation from 0-1. The length should correlate to the length of refs.

timeFrame?

number

– Optional number that defines the total duration

Returns

void

Released under the MPL-2.0 License.