/**
 * SPDX-FileCopyrightText: (c) 2026 Liferay, Inc. https://liferay.com
 * SPDX-License-Identifier: LGPL-2.1-or-later OR LicenseRef-Liferay-DXP-EULA-2.0.0-2023-06
 */
import React from 'react';
declare type ControlledState = {
    onOpenChange: (open: boolean) => void;
    open: boolean;
};
declare type UncontrolledState = {
    onOpenChange?: (open: boolean) => void;
    open?: boolean;
};
export declare type Props = {
    /**
     * The global `aria-describedby` attribute identifies the element that
     * describes the component.
     */
    'aria-describedby'?: string;
    /**
     * The `aria-label` attribute defines a string value that labels an interactive
     * element.
     */
    'aria-label'?: string;
    /**
     * The `aria-labelledby` attribute identifies the element (or elements) that
     * labels the element it is applied to.
     */
    'aria-labelledby'?: string;
    /**
     * Custom component.
     * `aside` - Secondary menus or filters, complementary information...
     * (e.g product filters in an e-commerce site, related articles in a blog...).
     * `nav` or `section` - If the ontent is essential for navigation, sidebar
     * contains primary actions like important forms or sidebar is the
     * only important content.
     */
    'as'?: 'aside' | 'div' | 'nav' | 'section';
    /**
     * Children content to render a content.
     */
    'children': React.ReactNode;
    /**
     * Sets the CSS className for the component.
     */
    'className'?: string;
    /**
     * Flag to determine whether the SidePanel should close when pressing
     * the Escape key.
     * NOTE: The default behavior is to close on Escape but it will be forced
     * to `true` on mobile devices and can be set to `false` for desktop if
     * needed.
     */
    'closeOnEscape'?: boolean;
    /**
     * Element reference to the container of the SidePanel and primary content.
     * NOTE: The containerRef is needed to properly handle layout and
     * transitions of the SidePanel.
     */
    'containerRef': React.RefObject<HTMLElement>;
    /**
     * Property to set the default value (uncontrolled).
     */
    'defaultOpen'?: boolean;
    /**
     * Direction the panel will render.
     */
    'direction'?: 'left' | 'right';
    /**
     * Flag to determine which style the SidePanel will display.
     */
    'displayType'?: 'light' | 'dark';
    /**
     * External reference for the side panel.
     */
    'externalSidePanelRef'?: React.RefObject<HTMLDivElement>;
    /**
     * Property to determine whether the panel behaves in a fluid manner.
     */
    'fluid'?: boolean;
    /**
     * The id of the component.
     */
    'id'?: string;
    /**
     * Sets a custom width on the sidebar panel. The minimum width is 280px.
     */
    'panelWidth'?: number;
    /**
     * Property to determine how the SidePanel will be positioned.
     */
    'position'?: 'absolute' | 'fixed';
    /**
     * Element reference to open the SidePanel.
     * NOTE: SidePanel automatically identifies the trigger but it may not
     * work in some cases when the element disappears from the DOM.
     */
    'triggerRef'?: React.RefObject<HTMLElement>;
} & (UncontrolledState | ControlledState);
export declare function SidePanel({ 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledby, 'as': As, children, className, 'closeOnEscape': externalCloseOnEscape, containerRef, defaultOpen, direction, displayType, externalSidePanelRef, fluid, onOpenChange, 'open': externalOpen, 'panelWidth': externalPanelWidth, position, triggerRef, ...otherProps }: Props): React.JSX.Element;
export declare namespace SidePanel {
    var Header: typeof import("./Header").Header;
    var Title: typeof import("./Title").Title;
    var Body: typeof import("./Body").Body;
    var Footer: typeof import("./Footer").Footer;
}
export {};