lumir-design-system-shared/dist/types/src/hooks/useTransition.d.ts

Lumir Design System - Shared Components & Tokens

export type TransitionDuration = 'instant' | 'fast' | 'normal' | 'slow' | 'slower';
export type TransitionEasing = 'default' | 'enter' | 'exit' | 'emphasis';
interface UseTransitionOptions {
    /**
     * 지속시간 타입 - 시멘틱 토큰 활용
     */
    duration?: TransitionDuration;
    /**
     * 이징 타입 - 시멘틱 토큰 활용
     */
    easing?: TransitionEasing;
    /**
     * 트랜지션 완료 콜백
     */
    onTransitionEnd?: () => void;
}
/**
 * 애니메이션 트랜지션을 관리하는 커스텀 훅
 * 시멘틱 토큰을 활용하여 일관된 애니메이션 경험을 제공합니다.
 */
export declare const useTransition: (show: boolean, options?: UseTransitionOptions) => {
    isVisible: boolean;
    shouldRender: boolean;
    transitionStyles: import("react").CSSProperties;
    durationValue: string;
    easingValue: string;
};
export {};