aura-glass/dist/animations/physics/chartAnimations.d.ts

A comprehensive glassmorphism design system for React applications with 142+ production-ready components

import { ChartDataPoint, ChartSeries, ChartAnimation } from '../../components/charts/types';
export interface ChartAnimationConfig extends ChartAnimation {
    stagger?: number;
    direction?: 'up' | 'down' | 'left' | 'right' | 'center';
    easing?: keyof typeof easingFunctions;
    delay?: number;
}
export interface ChartTransition {
    from: ChartSeries[];
    to: ChartSeries[];
    duration: number;
    easing: keyof typeof easingFunctions;
    stagger: number;
}
declare const easingFunctions: {
    linear: (t: number) => number;
    easeInQuad: (t: number) => number;
    easeOutQuad: (t: number) => number;
    easeInOutQuad: (t: number) => number;
    easeInCubic: (t: number) => number;
    easeOutCubic: (t: number) => number;
    easeInOutCubic: (t: number) => number;
    easeInQuart: (t: number) => number;
    easeOutQuart: (t: number) => number;
    easeInOutQuart: (t: number) => number;
    easeInSine: (t: number) => number;
    easeOutSine: (t: number) => number;
    easeInOutSine: (t: number) => number;
    easeInExpo: (t: number) => number;
    easeOutExpo: (t: number) => number;
    easeInOutExpo: (t: number) => number;
    easeInBack: (t: number) => number;
    easeOutBack: (t: number) => number;
    easeInOutBack: (t: number) => number;
    easeOutElastic: (t: number) => number;
};
export declare class ChartAnimationUtils {
    /**
     * Animate chart data points with various effects
     */
    static animateDataPoints(dataPoints: ChartDataPoint[], config: ChartAnimationConfig, onUpdate?: (points: ChartDataPoint[], progress: number) => void, onComplete?: (points: ChartDataPoint[]) => void): () => void;
    /**
     * Animate entire chart series
     */
    static animateSeries(series: ChartSeries[], config: ChartAnimationConfig, onUpdate?: (series: ChartSeries[], progress: number) => void, onComplete?: (series: ChartSeries[]) => void): () => void;
    /**
     * Create morphing animation between two data sets
     */
    static createMorphingAnimation(fromSeries: ChartSeries[], toSeries: ChartSeries[], config: ChartAnimationConfig, onUpdate?: (series: ChartSeries[], progress: number) => void, onComplete?: (series: ChartSeries[]) => void): () => void;
    /**
     * Create entrance animation for chart elements
     */
    static createEntranceAnimation(series: ChartSeries[], effect: 'fadeIn' | 'slideIn' | 'scaleIn' | 'bounceIn' | 'elasticIn', config: ChartAnimationConfig, onUpdate?: (series: ChartSeries[], progress: number) => void, onComplete?: (series: ChartSeries[]) => void): () => void;
    /**
     * Create exit animation for chart elements
     */
    static createExitAnimation(series: ChartSeries[], effect: 'fadeOut' | 'slideOut' | 'scaleOut' | 'bounceOut', config: ChartAnimationConfig, onUpdate?: (series: ChartSeries[], progress: number) => void, onComplete?: (series: ChartSeries[]) => void): () => void;
    private static applyDirectionalAnimation;
    private static getDirectionalTransform;
    private static interpolatePointProperties;
    /**
     * Create a smooth transition between chart states
     */
    static createChartTransition(transition: ChartTransition, onUpdate?: (series: ChartSeries[], progress: number) => void, onComplete?: (series: ChartSeries[]) => void): () => void;
}
export declare const chartAnimationPresets: {
    gentleFadeIn: {
        duration: number;
        easing: "easeOutQuad";
        stagger: number;
        direction: "up";
    };
    dramaticEntrance: {
        duration: number;
        easing: "easeOutBack";
        stagger: number;
        direction: "center";
    };
    smoothSlideIn: {
        duration: number;
        easing: "easeOutCubic";
        stagger: number;
        direction: "left";
    };
    bouncyScale: {
        duration: number;
        easing: "easeOutElastic";
        stagger: number;
        direction: "center";
    };
    subtleMorph: {
        duration: number;
        easing: "easeInOutQuad";
        stagger: number;
        direction: "up";
    };
};
export declare const animateChart: {
    fadeIn: (series: ChartSeries[], config?: Partial<ChartAnimationConfig>, callbacks?: {
        onUpdate?: (series: ChartSeries[], progress: number) => void;
        onComplete?: (series: ChartSeries[]) => void;
    }) => () => void;
    slideIn: (series: ChartSeries[], direction?: "up" | "down" | "left" | "right", config?: Partial<ChartAnimationConfig>, callbacks?: {
        onUpdate?: (series: ChartSeries[], progress: number) => void;
        onComplete?: (series: ChartSeries[]) => void;
    }) => () => void;
    scaleIn: (series: ChartSeries[], config?: Partial<ChartAnimationConfig>, callbacks?: {
        onUpdate?: (series: ChartSeries[], progress: number) => void;
        onComplete?: (series: ChartSeries[]) => void;
    }) => () => void;
    morph: (from: ChartSeries[], to: ChartSeries[], config?: Partial<ChartAnimationConfig>, callbacks?: {
        onUpdate?: (series: ChartSeries[], progress: number) => void;
        onComplete?: (series: ChartSeries[]) => void;
    }) => () => void;
    transition: (transition: ChartTransition, callbacks?: {
        onUpdate?: (series: ChartSeries[], progress: number) => void;
        onComplete?: (series: ChartSeries[]) => void;
    }) => () => void;
};
export {};
//# sourceMappingURL=chartAnimations.d.ts.map