@kcirtaptrick/framer-motion
Version:
A simple and powerful React animation library
31 lines (30 loc) • 918 B
TypeScript
declare type Cycle = (i?: number) => void;
declare type CycleState<T> = [T, Cycle];
/**
* Cycles through a series of visual properties. Can be used to toggle between or cycle through animations. It works similar to `useState` in React. It is provided an initial array of possible states, and returns an array of two arguments.
*
* An index value can be passed to the returned `cycle` function to cycle to a specific index.
*
* ```jsx
* import * as React from "react"
* import { motion, useCycle } from "framer-motion"
*
* export const MyComponent = () => {
* const [x, cycleX] = useCycle(0, 50, 100)
*
* return (
* <motion.div
* animate={{ x: x }}
* onTap={() => cycleX()}
* />
* )
* }
* ```
*
* @param items - items to cycle through
* @returns [currentState, cycleState]
*
* @public
*/
export declare function useCycle<T>(...items: T[]): CycleState<T>;
export {};