import { default as React } from 'react';
import * as DialogPrimitive from '@radix-ui/react-dialog';
/**
 * Dialog component based on Radix UI for creating accessible modal dialogs
 * A dialog is a window overlaid on either the primary window or another dialog window.
 *
 * @returns A Dialog component
 *
 * @example
 * ```tsx
 * // Basic usage: Dialog with header, content, and actions
 * function App() {
 *   return (
 *     <Dialog>
 *       <DialogTrigger asChild>
 *         <Button variant="outline" label="Open Dialog" />
 *       </DialogTrigger>
 *       <DialogContent>
 *         <DialogHeader>
 *           <DialogTitle>Edit profile</DialogTitle>
 *           <DialogDescription>Make changes to your profile here.</DialogDescription>
 *         </DialogHeader>
 *         <Input id="name" label="Name" />
 *         <Input id="username" label="Username" />
 *         <DialogFooter>
 *           <DialogClose asChild>
 *             <Button type="submit" label="Save changes" />
 *           </DialogClose>
 *         </DialogFooter>
 *       </DialogContent>
 *     </Dialog>
 *   );
 * }
 * ```
 *
 * @example
 * ```tsx
 * // Dialog with multiple actions in footer
 * function App() {
 *   return (
 *     <Dialog>
 *       <DialogTrigger asChild>
 *         <Button variant="outline" label="Share Link" />
 *       </DialogTrigger>
 *       <DialogContent>
 *         <DialogHeader>
 *           <DialogTitle>Share link</DialogTitle>
 *           <DialogDescription>Anyone who has this link will be able to view this.</DialogDescription>
 *         </DialogHeader>
 *         <Input id="name" label="Name" placeholder="Placeholder" />
 *         <DialogFooter className="sm:justify-between">
 *           <DialogClose asChild>
 *             <Button variant="outline" label="Close" />
 *           </DialogClose>
 *           <DialogClose asChild>
 *             <Button label="Save changes" />
 *           </DialogClose>
 *         </DialogFooter>
 *       </DialogContent>
 *     </Dialog>
 *   );
 * }
 * ```
 */
declare const Dialog: React.FC<DialogPrimitive.DialogProps>;
/**
 * The button that opens the dialog when clicked
 * Use `asChild` to use your own component as the trigger
 *
 * @example
 * ```tsx
 * <DialogTrigger asChild>
 *   <Button variant="outline" label="Open Dialog" />
 * </DialogTrigger>
 * ```
 */
declare const DialogTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
/**
 * A container component that portals its children into the body
 * Used internally by DialogContent
 */
declare const DialogPortal: React.FC<DialogPrimitive.DialogPortalProps>;
/**
 * The button that closes the dialog
 * Use `asChild` to use your own component as the close button
 *
 * @example
 * ```tsx
 * <DialogClose asChild>
 *   <Button variant="outline" label="Close" />
 * </DialogClose>
 * ```
 */
declare const DialogClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
/**
 * The semi-transparent overlay that covers the page behind the dialog
 * Used internally by DialogContent
 */
declare const DialogOverlay: React.FC<React.ComponentPropsWithRef<typeof DialogPrimitive.Overlay>>;
/**
 * The component that contains the dialog's content
 * Contains the overlay and provides the animated container
 *
 * @param hasCloseButton - Whether to display the X close button in the top-right corner (default: true)
 *
 * @example
 * ```tsx
 * <DialogContent>
 *   <DialogHeader>
 *     <DialogTitle>Dialog Title</DialogTitle>
 *     <DialogDescription>Dialog description goes here.</DialogDescription>
 *   </DialogHeader>
 *   <DialogFooter>
 *     <DialogClose asChild><Button label="Close" /></DialogClose>
 *   </DialogFooter>
 * </DialogContent>
 * ```
 */
declare const DialogContent: React.FC<React.ComponentPropsWithRef<typeof DialogPrimitive.Content> & {
    hasCloseButton?: boolean;
}>;
/**
 * A layout component for the dialog header.
 * Contains the title and description with proper spacing.
 *
 * When used inside a `DialogNavigation` and navigation history exists,
 * a back button is automatically rendered on the left side of the header.
 *
 * @example
 * ```tsx
 * <DialogHeader>
 *   <DialogTitle>Dialog Title</DialogTitle>
 *   <DialogDescription>Dialog description goes here.</DialogDescription>
 * </DialogHeader>
 * ```
 */
declare const DialogHeader: {
    ({ className, children, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
    displayName: string;
};
/**
 * A layout component for the dialog footer
 * Contains action buttons with responsive layout
 * Arranges buttons in a column on mobile and a row on desktop
 *
 * @example
 * ```tsx
 * <DialogFooter>
 *   <DialogClose asChild><Button variant="outline" label="Cancel" /></DialogClose>
 *   <DialogClose asChild><Button label="Confirm" /></DialogClose>
 * </DialogFooter>
 * ```
 */
declare const DialogFooter: {
    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
    displayName: string;
};
/**
 * The title of the dialog
 * Should be concise and descriptive of the dialog's purpose
 *
 * @example
 * ```tsx
 * <DialogTitle>Edit Profile</DialogTitle>
 * ```
 */
declare const DialogTitle: React.FC<React.ComponentPropsWithRef<typeof DialogPrimitive.Title>>;
/**
 * The description of the dialog
 * Provides additional context about the dialog's purpose
 *
 * @example
 * ```tsx
 * <DialogDescription>Make changes to your profile here. Click save when you're done.</DialogDescription>
 * ```
 */
declare const DialogDescription: React.FC<React.ComponentPropsWithRef<typeof DialogPrimitive.Description>>;
export { Dialog, DialogPortal, DialogOverlay, DialogTrigger, DialogClose, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription };