rumble-charts/types/Animate.d.ts

Truly declarative React charts components

import type { ReactElement, ReactNode } from 'react';
import type { CommonProps } from './types';
import { eases } from './helpers';
export declare type AnimateProps = {
    interpolateProps?: Array<keyof CommonProps>;
    duration?: number;
    logFPS?: boolean;
    ease?: ((num: number) => number) | keyof typeof eases;
    className?: string;
    children: ReactNode;
    tag?: string;
    onStart?: () => void;
    onEnd?: () => void;
    onCancel?: () => void;
} & CommonProps;
/**
 * Animates (actually interpolates) your `series` data. Very useful when you want to have
 * simple and nice transitions between data state.
 *
 * As a wrapper it takes `series` obtained from its parent and gives it to its children.
 *
 * By default, `interpolateProps` list contains all the common props:
 * ['series', 'maxX', 'maxY', 'minX', 'minY', 'layerWidth', 'layerHeight'].
 * Though, sometimes it makes a lot of sense to interpolate only `series`. Especially, when the
 * components wrapped by `<Animate>` are "jumping". Also, you can explicitly define `minY` as a prop
 * to make the limits stable (and therefore prevent the "jumping" effect)
 */
export declare function Animate(props: AnimateProps): ReactElement;