import type { MouseEvent, ReactNode, KeyboardEvent } from 'react';
import React from 'react';
type AriaLandmarkRoles = 'none' | 'main' | 'navigation' | 'banner' | 'complementary' | 'contentinfo' | 'form' | 'region' | 'search';
type Html5Tag = 'main' | 'div' | 'section' | 'article' | 'aside' | 'nav' | 'header' | 'footer';
interface BaseProps {
    /**
     * Unique ID for the component
     */
    id?: string;
    /**
     * Content of Overlay
     */
    children?: ReactNode;
    /**
     * On overlay element mouse click
     */
    onClick?: (e: MouseEvent<HTMLElement>) => void;
    /**
     * Callback function for keydown events on the overlay element to be used with prop `onClick`.
     * This can be used to handle keyboard interactions, such as closing the overlay with the Escape key.
     */
    onKeyDown?: (e: KeyboardEvent<HTMLElement>) => void;
    /**
     * Allows to set DOM node to which Overlay component will be appended. The node must already exist.
     * Use `false` to render in place without use of `createPortal`
     *
     * For more information about `createPortal`, see https://react.dev/reference/react-dom/createPortal
     *
     * @default 'body'
     */
    portalContainer?: string | false;
    /**
     * Allows to hide application from assistive screenreaders and other assistive technologies while the Overlay is shown
     *
     * @default '#__next'
     */
    appElement?: string;
    /**
     * Allows to set `overflow: hidden` CSS attribute to body element
     *
     * @default true
     */
    preventBodyScroll?: boolean;
    /**
     * Allows to pass testid string for testing purposes
     */
    'data-testid'?: string;
    /**
     * Allows to pass a custom className
     */
    className?: string;
    /**
     * Specifies the HTML5 tag to be used for the content wrapper.
     * It is recommended to use native semantic HTML elements whenever possible.
     * If a suitable semantic element is not available, a `<div>` with an appropriate ARIA role should be used (role from `role`).
     * ARIA roles from https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Roles
     *
     * @param {Html5Tag} main Uses `<main>` tag for the content wrapper.
     * @param {Html5Tag} div Uses `<div>` tag for the content wrapper.
     * @param {Html5Tag} section Uses `<section>` tag for the content wrapper.
     * @param {Html5Tag} article Uses `<article>` tag for the content wrapper.
     * @param {Html5Tag} aside Uses `<aside>` tag for the content wrapper.
     * @param {Html5Tag} nav Uses `<nav>` tag for the content wrapper.
     * @param {Html5Tag} header Uses `<header>` tag for the content wrapper.
     * @param {Html5Tag} footer Uses `<footer>` tag for the content wrapper.
     *
     * @default 'section'
     */
    as?: Html5Tag;
    /**
     * Specifies the ARIA landmark role for the content wrapper and is used when `as` is a div.
     * It is always recommended to use native semantic HTML elements from `as` whenever possible.
     * ARIA roles from https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Roles
     *
     * @param {AriaLandmarkRoles} main Represents the main content with `role="main"` (acting as <main>).
     * @param {AriaLandmarkRoles} navigation Represents navigation links with `role="navigation"` (acting as <nav>).
     * @param {AriaLandmarkRoles} banner Represents introductory content with `role="banner"` (acting as <header>).
     * @param {AriaLandmarkRoles} complementary Represents related content with `role="complementary"` (acting as <aside>).
     * @param {AriaLandmarkRoles} contentinfo Represents footer information with `role="contentinfo"` (acting as <footer>).
     * @param {AriaLandmarkRoles} form Indicates an interactive form with `role="form"` (acting as <form>).
     * @param {AriaLandmarkRoles} region Represents an important section with `role="region"` (acting as <section>).
     * @param {AriaLandmarkRoles} search Represents a search area with `role="search"` (acting as <search>).
     */
    role?: AriaLandmarkRoles;
    /**
     * If a role from `role` is used more than once on a page, the aria-label attribute should also be used in order to distinguish between the two regions.
     */
    ariaLabel?: string;
    /**
     * Ensures that overlays maintain proper focus management and accessibility.
     * If `isFocusTrapped` is true, an appropriate ARIA role should be used (role from `focusableTrappedWidgetRole`).
     * If `isFocusTrapped` is false, the tabbable element will not have an ARIA role.
     *
     * @default true
     */
    isFocusTrapped?: boolean;
}
type DivProps = BaseProps & {
    as?: 'div';
    role: AriaLandmarkRoles;
};
type NonDivProps = BaseProps & {
    as?: Exclude<Html5Tag, 'div'>;
    role?: undefined;
};
type Props = DivProps | NonDivProps;
/** @visibleName Overlay */
declare const Overlay: ({ portalContainer: portalContainerSelector, appElement: appElementSelector, preventBodyScroll, "data-testid": dataTestId, as, role, isFocusTrapped, ...props }: Props) => React.JSX.Element;
/** @component */
export default Overlay;