import React, { CSSProperties } from "react";
type ShouldSkip = boolean;
type Result = [
    originContainer: Element | VisualViewport,
    targetContainer: Element | VisualViewport
];
/**
 * This hook implements the logic for a hero animation between 2 elements sharing the same id
 */
export default function useHero(id: string, options?: Partial<{
    propsToTransition: Exclude<keyof CSSProperties, "width" | "height" | "top" | "left">[];
    /** If set, the default properties (width, height, etc...) will not transition, and propsToTransition will be the only ones that will be transitioned */
    overridePropsToTransition: boolean;
    "data-preffix": string;
    /** This indicates this hero animation will probably be repeated multiple time */
    repeatable: boolean;
}>, events?: {
    /**
     * Should return if the detected element should be "heroed"
     *
     * Usefull for when the hero has 2 possible origins.
     * For example, one could hero only the current hovered element with el.matches(":hover")
     */
    onHeroDetect?: (origin: HTMLDivElement, target: HTMLDivElement) => boolean;
    /**
     * Do something when the hero ends
     *
     * Usefull for triggering secondary animations
     */
    onHeroEnd?: () => void;
    /** Do somethign with the clone before it goes to the html */
    onHeroCloned?: (clone: HTMLDivElement) => void;
    /**
     * Do something when the hero starts the transition
     * Here it's usefull to switch classNames with the target.
     *
     * If done correctly, it will transition from state a to b smoothly
     */
    onHeroStart?: (clone: HTMLDivElement, origin: HTMLDivElement, target: HTMLDivElement) => void;
    /**
     * Is called when the hero is coming/going outside the viewport
     *
     * By default it's set to skip all heroes that have these conditions
     *
     * @returns If the hero should be skipped or not
     */
    onHeroSkip?: (origin: HTMLDivElement, target: HTMLDivElement) => ShouldSkip;
    /**
     * Called when a hero is skipped
     */
    onHeroSkipped?: () => void;
    /**
     * Before transition start, setup the properties that will be used for hero animation
     * @returns The container that will be used to check if the hero is out or in the view
     */
    onBeforeTransition?: (origin: HTMLDivElement, target: HTMLDivElement) => Result | Readonly<Result>;
}): {
    heroRef: React.RefObject<HTMLDivElement | null>;
    getHerosOnScreen: () => HTMLDivElement[];
    trigger: () => void;
    heroComponentRef: (componentId: string) => (elRef: HTMLDivElement | null) => void;
};
type EVENTS_INTERFACE = Parameters<typeof useHero>[2];
type TRANSITION_TYPES = "ACCELERATION";
export declare const TRANSITION_FACTORY: {
    [n in TRANSITION_TYPES]: (events?: EVENTS_INTERFACE) => EVENTS_INTERFACE;
};
export {};
