import { default as React } from 'react';
import * as PopoverPrimitive from '@radix-ui/react-popover';
/**
 * A popover component that displays floating content when a trigger element is activated.
 * Based on Radix UI's Popover primitive for accessibility and composability.
 *
 * @example
 * ```tsx
 * // Basic popover with button trigger
 * <Popover>
 *   <PopoverTrigger asChild>
 *     <Button variant="outline" label="Open popover" />
 *   </PopoverTrigger>
 *   <PopoverContent>
 *     <div className="grid gap-4">
 *       <div className="space-y-2">
 *         <h4 className="font-medium leading-none">Dimensions</h4>
 *         <p className="text-sm text-muted-foreground">Set the dimensions for the layer.</p>
 *       </div>
 *       <div className="grid gap-2">
 *         <Input id="width" label="Width" placeholder="Width" />
 *         <Input id="height" label="Height" placeholder="Height" />
 *       </div>
 *     </div>
 *   </PopoverContent>
 * </Popover>
 * ```
 *
 * @example
 * ```tsx
 * // With custom anchor element
 * <Popover>
 *   <PopoverAnchor asChild>
 *     <OctagonAlert className="mr-4" />
 *   </PopoverAnchor>
 *   <PopoverTrigger asChild>
 *     <Button variant="outline" label="Show details" />
 *   </PopoverTrigger>
 *   <PopoverContent>
 *     <Text>This popover is anchored to the circle element, not the button.</Text>
 *   </PopoverContent>
 * </Popover>
 * ```
 */
declare const Popover: React.FC<PopoverPrimitive.PopoverProps>;
/**
 * The trigger element for the popover.
 * Usually used with the `asChild` prop to use a custom element as the trigger.
 *
 * @example
 * ```tsx
 * <PopoverTrigger asChild>
 *   <Button variant="outline" label="Open popover" />
 * </PopoverTrigger>
 * ```
 */
declare const PopoverTrigger: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & React.RefAttributes<HTMLButtonElement>>;
/**
 * Optional anchor element for the popover.
 * When used, the popover will be positioned relative to this element instead of the trigger.
 *
 * @example
 * ```tsx
 * <PopoverAnchor asChild>
 *   <OctagonAlert className="mr-4" />
 * </PopoverAnchor>
 * ```
 */
declare const PopoverAnchor: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverAnchorProps & React.RefAttributes<HTMLDivElement>>;
/**
 * The content of the popover.
 * This is the component that contains all the content displayed when the popover is open.
 *
 * @param {"start" | "center" | "end"} align - The alignment of the popover relative to the trigger (default: 'center')
 * @param {number} sideOffset - The distance in pixels between the popover and the trigger (default: 4)
 * @param {"top" | "right" | "bottom" | "left"} side - The preferred side to render the popover (default: 'bottom')
 * @param {string} className - Additional CSS classes
 *
 * @example
 * ```tsx
 * <PopoverContent className="w-80" align="start" sideOffset={8}>
 *   <Text weight="semibold">Popover Title</Text>
 *   <div className="grid gap-4">
 *     <Input id="name" label="Name" />
 *     <Input id="email" label="Email" />
 *   </div>
 * </PopoverContent>
 * ```
 *
 * @example
 * ```tsx
 * // With different alignment
 * <PopoverContent align="end">
 *   <Text>This popover is aligned to the end of the trigger.</Text>
 * </PopoverContent>
 * ```
 */
declare const PopoverContent: React.FC<React.ComponentPropsWithRef<typeof PopoverPrimitive.Content>>;
export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };
