import * as React from 'react';
export type SideModalSize = 'small' | 'large';
export interface SideModalProps {
    /** Controlled open state. Omit for an uncontrolled panel driven by `trigger`. */
    isOpen?: boolean;
    /**
     * Allow dismissal by Escape and backdrop click.
     * @default true
     */
    dismissible?: boolean;
    /**
     * Render the decorative accent splash behind the content.
     * @default false
     */
    showModalAccent?: boolean;
    className?: string;
    contentClassName?: string;
    backdropClassName?: string;
    onOpenChange?: (open: boolean) => void;
    onClose?: () => void;
    onBackdropClick?: () => void;
    children?: React.ReactNode;
    trigger?: React.ReactElement | null;
    portalContainer?: HTMLElement | React.RefObject<HTMLElement | null> | null;
    /**
     * Accessible name for the panel.
     * @default 'Side modal'
     */
    ariaLabel?: string;
    /**
     * `small` caps at 456px; `large` takes most of the viewport width.
     * @default 'large'
     */
    size?: SideModalSize;
    closeIcon?: React.ReactNode;
    /**
     * @default 'Close side modal'
     */
    closeAriaLabel?: string;
}
declare const panelStyles: (props?: ({
    size?: "large" | "small" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
/**
 * A panel that slides in from the right edge, for a task that needs room but should
 * keep the page behind it visible.
 *
 * Modal: focus moves inside, the rest of the page is marked `aria-hidden`, and Escape
 * closes unless `dismissible` is false. Choose this over a {@link Dialog} when the
 * context behind matters — reviewing a record while its list stays on screen — and a
 * `Dialog` when it does not.
 *
 * **Portalled.** Stamps the active theme, since the panel renders into
 * `document.body`, outside the element carrying `data-theme`.
 *
 * @example
 * <SideModal trigger={<Button>Details</Button>} ariaLabel="Order details">
 *   <OrderDetails id={id} />
 * </SideModal>
 */
export declare const SideModal: React.ForwardRefExoticComponent<SideModalProps & React.RefAttributes<HTMLDivElement>>;
export { panelStyles as sideModalPanelStyles };
export declare const Sheet: React.ForwardRefExoticComponent<SideModalProps & React.RefAttributes<HTMLDivElement>>;
export declare const SheetContent: React.ForwardRefExoticComponent<SideModalProps & React.RefAttributes<HTMLDivElement>>;
export declare const SheetTrigger: React.ForwardRefExoticComponent<import("../dialog").DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
export declare const SheetTitle: React.ForwardRefExoticComponent<import("../dialog").DialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;
export declare const SheetDescription: React.ForwardRefExoticComponent<import("../dialog").DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
export declare const SheetHeader: React.ForwardRefExoticComponent<import("../dialog").DialogHeaderProps & React.RefAttributes<HTMLDivElement>>;
export declare const SheetFooter: React.ForwardRefExoticComponent<import("../dialog").DialogFooterProps & React.RefAttributes<HTMLDivElement>>;
export declare const SheetClose: React.ForwardRefExoticComponent<import("../dialog").DialogCloseButtonProps & React.RefAttributes<HTMLButtonElement>>;
//# sourceMappingURL=side-modal.d.ts.map