import React from "react";
import Animated from "react-native-reanimated";
import type { RectProps } from "react-native-svg";
export declare type OverlayStyle = {
    /**
     * The color of the overlay. Should not include alpha in the color, use `opacity` prop for that.
     *
     * @default "black"
     * @since 1.3
     */
    color?: string;
    /**
     * The opacity of the overlay color.
     *
     * @default 0.7
     * @since 1.3
     */
    opacity?: number;
};
export declare type EnteringAnimation = Animated.AnimateProps<RectProps>["entering"];
export declare type HighlightOverlayProps = {
    /**
     * The id of the highlighted element. If `undefined`, `null`, or if the id does not exist,
     * the overlay is hidden.
     *
     * @since 1.0
     */
    highlightedElementId?: string | null;
    /**
     * Called when the highlight is requesting to be dismissed. This is usually when the overlay
     * (non-highlighted) part of the screen is pressed. The exact behavior is decided by each
     * HighlightableElement.
     *
     * @since 1.0
     */
    onDismiss: () => void;
    /**
     * The style of the overlay.
     *
     * @default { color: "black", opacity: 0.7 }
     * @since 1.3
     */
    overlayStyle?: OverlayStyle;
    /**
     * The animation when the overlay is entering the screen. Defaults to `FadeIn`.
     * Set to `null` (not `undefined`!) to disable animation.
     *
     * @default FadeIn
     * @example
     * import { FadeIn } from "react-native-reanimated";
     * <HighlightOverlay entering={FadeIn} />
     * @since 1.3
     */
    entering?: EnteringAnimation | null;
    /**
     * The animation when the overlay is exiting the screen. Defaults to `FadeOut`.
     * Set to `null` (not `undefined`!) to disable animation.
     *
     * @default undefined
     * @example
     * import { FadeOut } from "react-native-reanimated";
     * <HighlightOverlay exiting={FadeOut} />
     * @since 1.3
     */
    exiting?: EnteringAnimation | null;
};
/**
 * An overlay that optionally takes the id of a `HighlightableElement` to highlight
 * (exclude from the overlay). This is not a modal, so it should be placed on top of all elements
 * you want it to cover.
 *
 * **NOTE:** If the highlighted element is inside of a `ScrollView`, the `HighlightOverlay` should also
 * be inside of that scroll view to ensure that the highlight is correctly placed.
 *
 * @since 1.0
 */
declare const HighlightOverlay: React.MemoExoticComponent<({ highlightedElementId, onDismiss, overlayStyle, entering, exiting, }: HighlightOverlayProps) => JSX.Element>;
export default HighlightOverlay;