import { default as React } from 'react';
import { VariantProps } from 'class-variance-authority';
import * as SheetPrimitive from '@radix-ui/react-dialog';
/**
 * Sheet component based on Radix UI Dialog for creating accessible slide-in panels
 * A sheet is a panel that slides in from the edge of the screen, typically used for secondary content or actions
 *
 * @example
 * ```tsx
 * function App() {
 *   return (
 *     <Sheet>
 *       <SheetTrigger asChild>
 *         <Button label="Open Sheet" />
 *       </SheetTrigger>
 *       <SheetBody>
 *         <SheetHeader>
 *           <div className="flex items-center gap-2">
 *             <SheetTitle>Edit profile</SheetTitle>
 *           </div>
 *           <SheetDescription>Make changes to your profile here.</SheetDescription>
 *         </SheetHeader>
 *         <SheetContent>
 *           <Input id="name" label="Name" />
 *         </SheetContent>
 *         <SheetFooter>
 *           <p className="text-sm">Helper text</p>
 *           <div className="flex gap-2">
 *             <SheetClose asChild><Button variant="outline" label="Cancel" /></SheetClose>
 *             <SheetClose asChild><Button label="Save" /></SheetClose>
 *           </div>
 *         </SheetFooter>
 *       </SheetBody>
 *     </Sheet>
 *   );
 * }
 * ```
 *
 * @example
 * ```tsx
 * function App() {
 *   return (
 *     <Sheet>
 *       <SheetTrigger asChild>
 *         <Button label="Open Left Sheet" />
 *       </SheetTrigger>
 *       <SheetBody side="left">
 *         <SheetHeader>
 *           <SheetTitle>Left Sheet</SheetTitle>
 *           <SheetDescription>This sheet slides in from the left.</SheetDescription>
 *         </SheetHeader>
 *         <SheetFooter>
 *           <span />
 *           <SheetClose asChild>
 *             <Button label="Close" />
 *           </SheetClose>
 *         </SheetFooter>
 *       </SheetBody>
 *     </Sheet>
 *   );
 * }
 * ```
 */
declare const Sheet: React.FC<SheetPrimitive.DialogProps>;
/**
 * SheetTrigger component for triggering the opening of the sheet
 *
 * @example
 * ```tsx
 * <SheetTrigger asChild>
 *   <Button label="Open Sheet" />
 * </SheetTrigger>
 * ```
 */
declare const SheetTrigger: React.ForwardRefExoticComponent<SheetPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
/**
 * SheetClose component for closing the sheet
 *
 * @example
 * ```tsx
 * <SheetClose asChild>
 *   <Button label="Close" />
 * </SheetClose>
 * ```
 */
declare const SheetClose: React.ForwardRefExoticComponent<SheetPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
/**
 * Portal component for rendering sheet content in a portal
 * Used internally by SheetBody
 */
declare const SheetPortal: React.FC<SheetPrimitive.DialogPortalProps>;
/**
 * Semi-transparent overlay that appears behind the sheet
 * Used internally by SheetBody
 */
declare const SheetOverlay: React.FC<React.ComponentPropsWithRef<typeof SheetPrimitive.Overlay>>;
declare const sheetVariants: (props?: ({
    side?: "top" | "right" | "bottom" | "left" | null | undefined;
    size?: "sm" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | null | undefined;
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
interface SheetBodyProps extends React.ComponentPropsWithRef<typeof SheetPrimitive.Content>, VariantProps<typeof sheetVariants> {
}
/**
 * The sliding panel container — renders the visible sheet with the overlay.
 * Place SheetHeader, SheetContent, and SheetFooter as direct children.
 *
 * @param side - The side from which the sheet slides in: 'top', 'right', 'bottom', or 'left' (default: 'right')
 * @param size - Maximum width of the panel (default: 'sm')
 *
 * @example
 * ```tsx
 * <SheetBody side="left">
 *   <SheetHeader>
 *     <SheetTitle>Left Sheet</SheetTitle>
 *   </SheetHeader>
 *   <SheetContent>...</SheetContent>
 *   <SheetFooter>
 *     <span />
 *     <SheetClose asChild><Button label="Close" /></SheetClose>
 *   </SheetFooter>
 * </SheetBody>
 * ```
 */
declare const SheetBody: React.FC<SheetBodyProps>;
/**
 * Layout component for the sheet header.
 * Place SheetTitle, SheetDescription, and any action rows (buttons, badges) inside.
 * Users compose their own icons, badges, and quick-action buttons as children.
 *
 * @example
 * ```tsx
 * <SheetHeader>
 *   <div className="flex items-center gap-2">
 *     <SheetTitle>Sheet Title</SheetTitle>
 *   </div>
 *   <SheetDescription>Sheet description goes here.</SheetDescription>
 * </SheetHeader>
 * ```
 */
declare const SheetHeader: {
    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
    displayName: string;
};
/**
 * Scrollable content area between the header and footer.
 * Grows to fill available space and scrolls vertically when content overflows.
 *
 * @example
 * ```tsx
 * <SheetContent>
 *   <Input id="name" label="Name" />
 *   <Input id="email" label="Email" />
 * </SheetContent>
 * ```
 */
declare const SheetContent: {
    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
    displayName: string;
};
/**
 * Layout component for the sheet footer.
 * Uses justify-between: place helper text on the left and action buttons on the right.
 *
 * @example
 * ```tsx
 * <SheetFooter>
 *   <p className="text-sm">Helper text</p>
 *   <div className="flex gap-2">
 *     <SheetClose asChild><Button variant="outline" label="Cancel" /></SheetClose>
 *     <SheetClose asChild><Button label="Confirm" /></SheetClose>
 *   </div>
 * </SheetFooter>
 * ```
 */
declare const SheetFooter: {
    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
    displayName: string;
};
/**
 * The title of the sheet
 * Should be concise and descriptive of the sheet's purpose
 *
 * @example
 * ```tsx
 * <SheetTitle>Edit Profile</SheetTitle>
 * ```
 */
declare const SheetTitle: React.FC<React.ComponentPropsWithRef<typeof SheetPrimitive.Title>>;
/**
 * The description of the sheet
 * Provides additional context about the sheet's purpose
 *
 * @example
 * ```tsx
 * <SheetDescription>Make changes to your profile here. Click save when you're done.</SheetDescription>
 * ```
 */
declare const SheetDescription: React.FC<React.ComponentPropsWithRef<typeof SheetPrimitive.Description>>;
export { Sheet, SheetPortal, SheetOverlay, SheetTrigger, SheetClose, SheetBody, SheetHeader, SheetContent, SheetFooter, SheetTitle, SheetDescription, };
