@rdna/radiants 0.1.0

package/dist/components/core/index.d.mts

@@ -0,0 +1,911 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React from 'react';
+
+type AccordionType = 'single' | 'multiple';
+interface AccordionProps {
+    /** Allow single or multiple items to be expanded at once */
+    type?: AccordionType;
+    /** Default expanded item(s) - string for single, array for multiple */
+    defaultValue?: string | string[];
+    /** Controlled expanded value(s) */
+    value?: string | string[];
+    /** Callback when expanded items change */
+    onValueChange?: (value: string | string[]) => void;
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function Accordion({ type, defaultValue, value: controlledValue, onValueChange, className, children, }: AccordionProps): react_jsx_runtime.JSX.Element;
+interface AccordionItemProps {
+    /** Unique value for this item */
+    value: string;
+    /** Additional className */
+    className?: string;
+    /** Children (AccordionTrigger and AccordionContent) */
+    children: React.ReactNode;
+}
+declare function AccordionItem({ value, className, children }: AccordionItemProps): react_jsx_runtime.JSX.Element;
+interface AccordionTriggerProps {
+    /** Additional className */
+    className?: string;
+    /** Children (header content) */
+    children: React.ReactNode;
+}
+declare function AccordionTrigger({ className, children }: AccordionTriggerProps): react_jsx_runtime.JSX.Element;
+interface AccordionContentProps {
+    /** Additional className */
+    className?: string;
+    /** Children (content) */
+    children: React.ReactNode;
+}
+declare function AccordionContent({ className, children }: AccordionContentProps): react_jsx_runtime.JSX.Element;
+
+type AlertVariant = 'default' | 'success' | 'warning' | 'error' | 'info';
+interface AlertProps {
+    /** Alert variant */
+    variant?: AlertVariant;
+    /** Alert title */
+    title?: string;
+    /** Alert content */
+    children: React.ReactNode;
+    /** Show close button */
+    closable?: boolean;
+    /** Close handler */
+    onClose?: () => void;
+    /** Icon slot - renders before content */
+    icon?: React.ReactNode;
+    /** Close icon slot - renders for close button */
+    closeIcon?: React.ReactNode;
+    /** Additional className */
+    className?: string;
+}
+/**
+ * Alert component - Static alert banners
+ *
+ * Uses slot-based API for icons to avoid coupling to specific icon systems.
+ * Pass your own icon components via the `icon` and `closeIcon` props.
+ */
+declare function Alert({ variant, title, children, closable, onClose, icon, closeIcon, className, }: AlertProps): react_jsx_runtime.JSX.Element;
+
+type BadgeVariant = 'default' | 'success' | 'warning' | 'error' | 'info';
+type BadgeSize = 'sm' | 'md';
+interface BadgeProps {
+    /** Visual variant */
+    variant?: BadgeVariant;
+    /** Size preset */
+    size?: BadgeSize;
+    /** Badge content */
+    children: React.ReactNode;
+    /** Additional classes */
+    className?: string;
+}
+/**
+ * Badge component for status indicators and labels
+ */
+declare function Badge({ variant, size, children, className, }: BadgeProps): react_jsx_runtime.JSX.Element;
+
+interface BreadcrumbItem {
+    /** Display label */
+    label: string;
+    /** Navigation href (optional for current/last item) */
+    href?: string;
+}
+interface BreadcrumbsProps {
+    /** Breadcrumb items */
+    items: BreadcrumbItem[];
+    /** Separator character */
+    separator?: string;
+    /** Additional className */
+    className?: string;
+}
+/**
+ * Breadcrumbs component - Navigation hierarchy
+ */
+declare function Breadcrumbs({ items, separator, className, }: BreadcrumbsProps): react_jsx_runtime.JSX.Element | null;
+
+type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'ghost';
+type ButtonSize = 'sm' | 'md' | 'lg';
+interface BaseButtonProps {
+    /** Visual variant */
+    variant?: ButtonVariant;
+    /** Size preset */
+    size?: ButtonSize;
+    /** Expand to fill container width */
+    fullWidth?: boolean;
+    /** Square button with icon only (no text) */
+    iconOnly?: boolean;
+    /** Show loading state */
+    loading?: boolean;
+    /** Button content (optional when iconOnly is true) */
+    children?: React.ReactNode;
+    /** Additional className */
+    className?: string;
+    /** Icon slot - render your icon component here */
+    icon?: React.ReactNode;
+    /** Loading indicator slot - render your spinner here */
+    loadingIndicator?: React.ReactNode;
+}
+interface ButtonAsButtonProps extends BaseButtonProps, Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, keyof BaseButtonProps> {
+    /** URL for navigation - when provided, button can act as a link */
+    href?: undefined;
+}
+interface ButtonAsLinkProps extends BaseButtonProps, Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof BaseButtonProps> {
+    /** URL for navigation - renders as anchor element */
+    href: string;
+    /** Whether to render as anchor (true) or use window.open (false) */
+    asLink?: boolean;
+    /** Target for link navigation (e.g., '_blank') */
+    target?: string;
+}
+type ButtonProps = ButtonAsButtonProps | ButtonAsLinkProps;
+/**
+ * Button component with retro lift effect
+ *
+ * Supports both button and link behaviors:
+ * - Without href: renders as <button>
+ * - With href + asLink=true (default): renders as <a>
+ * - With href + asLink=false: renders as <button> that opens URL via window.open
+ *
+ * Icon and loading indicator are provided via slots:
+ * - icon: Pass your icon component (renders on the right)
+ * - loadingIndicator: Pass your spinner component (replaces icon when loading)
+ */
+declare function Button(props: ButtonProps): react_jsx_runtime.JSX.Element;
+
+type CardVariant = 'default' | 'dark' | 'raised';
+interface CardProps {
+    /** Visual variant */
+    variant?: CardVariant;
+    /** Card content */
+    children: React.ReactNode;
+    /** Additional classes */
+    className?: string;
+    /** Optional padding override */
+    noPadding?: boolean;
+}
+interface CardHeaderProps {
+    children: React.ReactNode;
+    className?: string;
+}
+interface CardBodyProps {
+    children: React.ReactNode;
+    className?: string;
+}
+interface CardFooterProps {
+    children: React.ReactNode;
+    className?: string;
+}
+/**
+ * Card container component with consistent styling
+ */
+declare function Card({ variant, children, className, noPadding, }: CardProps): react_jsx_runtime.JSX.Element;
+/**
+ * Card header with bottom border
+ */
+declare function CardHeader({ children, className }: CardHeaderProps): react_jsx_runtime.JSX.Element;
+/**
+ * Card body with standard padding
+ */
+declare function CardBody({ children, className }: CardBodyProps): react_jsx_runtime.JSX.Element;
+/**
+ * Card footer with top border
+ */
+declare function CardFooter({ children, className }: CardFooterProps): react_jsx_runtime.JSX.Element;
+
+interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type'> {
+    /** Label text */
+    label?: string;
+    /** Additional classes for container */
+    className?: string;
+}
+interface RadioProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type'> {
+    /** Label text */
+    label?: string;
+    /** Additional classes for container */
+    className?: string;
+}
+/**
+ * Retro-styled checkbox
+ */
+declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
+/**
+ * Retro-styled radio button
+ */
+declare const Radio: React.ForwardRefExoticComponent<RadioProps & React.RefAttributes<HTMLInputElement>>;
+
+interface ContextMenuProps {
+    /** Content that triggers context menu on right-click */
+    children: React.ReactNode;
+    /** Additional classes for trigger container */
+    className?: string;
+}
+interface ContextMenuContentProps {
+    /** Menu items */
+    children: React.ReactNode;
+    /** Additional classes */
+    className?: string;
+}
+interface ContextMenuItemProps {
+    /** Click handler */
+    onClick?: () => void;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Destructive action (red text) */
+    destructive?: boolean;
+    /** Icon element to display before the label */
+    icon?: React.ReactNode;
+    /** Menu item content */
+    children: React.ReactNode;
+    /** Additional classes */
+    className?: string;
+}
+interface ContextMenuSeparatorProps {
+    className?: string;
+}
+/**
+ * Context menu container - wraps content that should have right-click menu
+ */
+declare function ContextMenu({ children, className }: ContextMenuProps): react_jsx_runtime.JSX.Element;
+/**
+ * Context menu dropdown content
+ */
+declare function ContextMenuContent({ children, className }: ContextMenuContentProps): react_jsx_runtime.JSX.Element | null;
+/**
+ * Context menu item
+ */
+declare function ContextMenuItem({ onClick, disabled, destructive, icon, children, className, }: ContextMenuItemProps): react_jsx_runtime.JSX.Element;
+/**
+ * Context menu separator line
+ */
+declare function ContextMenuSeparator({ className }: ContextMenuSeparatorProps): react_jsx_runtime.JSX.Element;
+
+type DividerOrientation = 'horizontal' | 'vertical';
+type DividerVariant = 'solid' | 'dashed' | 'decorated';
+interface DividerProps {
+    /** Orientation */
+    orientation?: DividerOrientation;
+    /** Visual variant */
+    variant?: DividerVariant;
+    /** Additional classes */
+    className?: string;
+}
+/**
+ * Divider component for separating content
+ */
+declare function Divider({ orientation, variant, className, }: DividerProps): react_jsx_runtime.JSX.Element;
+
+type DropdownPosition = 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end';
+interface DropdownMenuProps {
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state */
+    defaultOpen?: boolean;
+    /** Callback when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Position relative to trigger */
+    position?: DropdownPosition;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function DropdownMenu({ open: controlledOpen, defaultOpen, onOpenChange, position, children, }: DropdownMenuProps): react_jsx_runtime.JSX.Element;
+interface DropdownMenuTriggerProps {
+    /** Trigger element */
+    children: React.ReactElement;
+    /** Pass through as child instead of wrapping */
+    asChild?: boolean;
+}
+declare function DropdownMenuTrigger({ children, asChild }: DropdownMenuTriggerProps): react_jsx_runtime.JSX.Element;
+interface DropdownMenuContentProps {
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function DropdownMenuContent({ className, children }: DropdownMenuContentProps): React.ReactPortal | null;
+interface DropdownMenuItemProps {
+    /** Item content */
+    children: React.ReactNode;
+    /** Click handler */
+    onClick?: () => void;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Destructive styling */
+    destructive?: boolean;
+    /** Additional className */
+    className?: string;
+}
+declare function DropdownMenuItem({ children, onClick, disabled, destructive, className, }: DropdownMenuItemProps): react_jsx_runtime.JSX.Element;
+interface DropdownMenuSeparatorProps {
+    /** Additional className */
+    className?: string;
+}
+declare function DropdownMenuSeparator({ className }: DropdownMenuSeparatorProps): react_jsx_runtime.JSX.Element;
+interface DropdownMenuLabelProps {
+    /** Label content */
+    children: React.ReactNode;
+    /** Additional className */
+    className?: string;
+}
+declare function DropdownMenuLabel({ children, className }: DropdownMenuLabelProps): react_jsx_runtime.JSX.Element;
+
+type InputSize = 'sm' | 'md' | 'lg';
+interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    /** Size preset */
+    size?: InputSize;
+    /** Error state */
+    error?: boolean;
+    /** Full width */
+    fullWidth?: boolean;
+    /** Icon name (filename without .svg extension) - displays on the left */
+    iconName?: string;
+    /** Additional classes */
+    className?: string;
+}
+interface TextAreaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
+    /** Error state */
+    error?: boolean;
+    /** Full width */
+    fullWidth?: boolean;
+    /** Additional classes */
+    className?: string;
+}
+interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
+    children: React.ReactNode;
+    required?: boolean;
+    className?: string;
+}
+/**
+ * Text input with semantic token styling
+ */
+declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
+/**
+ * Textarea with semantic token styling
+ */
+declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;
+/**
+ * Form label with optional required indicator
+ */
+declare function Label({ children, required, className, ...props }: LabelProps): react_jsx_runtime.JSX.Element;
+
+type ProgressVariant = 'default' | 'success' | 'warning' | 'error';
+type ProgressSize = 'sm' | 'md' | 'lg';
+interface ProgressProps {
+    /** Progress value (0-100) */
+    value: number;
+    /** Maximum value */
+    max?: number;
+    /** Visual variant */
+    variant?: ProgressVariant;
+    /** Size preset */
+    size?: ProgressSize;
+    /** Show percentage label */
+    showLabel?: boolean;
+    /** Additional classes */
+    className?: string;
+}
+/**
+ * Progress bar with retro styling
+ */
+declare function Progress({ value, max, variant, size, showLabel, className, }: ProgressProps): react_jsx_runtime.JSX.Element;
+interface SpinnerProps {
+    /** Size in pixels */
+    size?: number;
+    /** Additional classes */
+    className?: string;
+    /** Whether loading is completed - shows checkmark */
+    completed?: boolean;
+}
+/**
+ * PixelCode loader with animated frames that loop through 6 frames
+ * When completed, displays a checkmark (checkmark)
+ */
+declare function Spinner({ size, className, completed }: SpinnerProps): react_jsx_runtime.JSX.Element;
+
+interface SelectOption {
+    value: string;
+    label: string;
+    disabled?: boolean;
+}
+interface SelectProps {
+    /** Available options */
+    options: SelectOption[];
+    /** Currently selected value */
+    value?: string;
+    /** Placeholder text when no value selected */
+    placeholder?: string;
+    /** Change handler */
+    onChange?: (value: string) => void;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Error state */
+    error?: boolean;
+    /** Full width */
+    fullWidth?: boolean;
+    /** Additional classes */
+    className?: string;
+}
+/**
+ * Custom select/dropdown with retro styling
+ */
+declare function Select({ options, value, placeholder, onChange, disabled, error, fullWidth, className, }: SelectProps): react_jsx_runtime.JSX.Element;
+
+type SliderSize = 'sm' | 'md' | 'lg';
+interface SliderProps {
+    /** Current value */
+    value: number;
+    /** Change handler */
+    onChange: (value: number) => void;
+    /** Minimum value */
+    min?: number;
+    /** Maximum value */
+    max?: number;
+    /** Step increment */
+    step?: number;
+    /** Size preset */
+    size?: SliderSize;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Show value label */
+    showValue?: boolean;
+    /** Label text */
+    label?: string;
+    /** Additional className */
+    className?: string;
+}
+/**
+ * Slider component - Numeric range input
+ */
+declare function Slider({ value, onChange, min, max, step, size, disabled, showValue, label, className, }: SliderProps): react_jsx_runtime.JSX.Element;
+
+type SwitchSize = 'sm' | 'md' | 'lg';
+interface SwitchProps {
+    /** Checked state */
+    checked: boolean;
+    /** Change handler */
+    onChange: (checked: boolean) => void;
+    /** Size preset */
+    size?: SwitchSize;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Label text */
+    label?: string;
+    /** Label position */
+    labelPosition?: 'left' | 'right';
+    /** Additional className */
+    className?: string;
+    /** ID for accessibility */
+    id?: string;
+}
+/**
+ * Switch component - On/off toggle
+ */
+declare function Switch({ checked, onChange, size, disabled, label, labelPosition, className, id, }: SwitchProps): react_jsx_runtime.JSX.Element;
+
+type TabsVariant = 'pill' | 'line';
+type TabsLayout = 'default' | 'bottom-tabs';
+interface TabsProps {
+    /** Default active tab ID (uncontrolled mode) */
+    defaultValue?: string;
+    /** Active tab ID (controlled mode) */
+    value?: string;
+    /** Callback when tab changes (controlled mode) */
+    onValueChange?: (value: string) => void;
+    /** Visual variant */
+    variant?: TabsVariant;
+    /** Layout pattern - 'bottom-tabs' (default) for fixed bottom tabs, 'default' for top tabs */
+    layout?: TabsLayout;
+    /** Tab components */
+    children: React.ReactNode;
+    /** Additional classes for container */
+    className?: string;
+}
+interface TabListProps {
+    /** TabTrigger components */
+    children: React.ReactNode;
+    /** Additional classes */
+    className?: string;
+}
+interface TabTriggerProps {
+    /** Unique tab ID */
+    value: string;
+    /** Tab label */
+    children: React.ReactNode;
+    /** Icon as React element (slot pattern for theme components) */
+    icon?: React.ReactNode;
+    /** Additional classes */
+    className?: string;
+}
+interface TabContentProps {
+    /** Tab ID this content belongs to */
+    value: string;
+    /** Content to render when active */
+    children: React.ReactNode;
+    /** Additional classes */
+    className?: string;
+}
+/**
+ * Tabs container - provides context for tab state
+ * Supports both controlled and uncontrolled modes
+ */
+declare function Tabs({ defaultValue, value, onValueChange, variant, layout, children, className, }: TabsProps): react_jsx_runtime.JSX.Element;
+/**
+ * Container for tab triggers - matching PrimaryNavigationFooter styles
+ */
+declare function TabList({ children, className }: TabListProps): react_jsx_runtime.JSX.Element;
+/**
+ * Individual tab trigger button - Webflow-style
+ */
+declare function TabTrigger({ value, children, icon, className, }: TabTriggerProps): react_jsx_runtime.JSX.Element;
+/**
+ * Tab content panel - Webflow-style tab pane
+ */
+declare function TabContent({ value, children, className, }: TabContentProps): react_jsx_runtime.JSX.Element | null;
+
+type TooltipPosition = 'top' | 'bottom' | 'left' | 'right';
+type TooltipSize = 'sm' | 'md' | 'lg';
+interface TooltipProps {
+    /** Tooltip content */
+    content: React.ReactNode;
+    /** Position relative to trigger */
+    position?: TooltipPosition;
+    /** Delay before showing (ms) - set to 0 for instant */
+    delay?: number;
+    /** Size preset - matches Button sizes (sm=12px, md=12px, lg=14px) */
+    size?: TooltipSize;
+    /** Trigger element */
+    children: React.ReactNode;
+    /** Additional classes */
+    className?: string;
+}
+/**
+ * Tooltip component for hover information
+ */
+declare function Tooltip({ content, position, delay, size, children, className, }: TooltipProps): react_jsx_runtime.JSX.Element;
+
+type ToastVariant = 'default' | 'success' | 'warning' | 'error' | 'info';
+interface ToastData {
+    id: string;
+    title: string;
+    description?: string;
+    variant?: ToastVariant;
+    duration?: number;
+    /** Custom icon element - overrides variant default */
+    icon?: React.ReactNode;
+}
+interface ToastContextValue {
+    toasts: ToastData[];
+    addToast: (toast: Omit<ToastData, 'id'>) => string;
+    removeToast: (id: string) => void;
+}
+declare function useToast(): ToastContextValue;
+interface ToastProviderProps {
+    /** Children */
+    children: React.ReactNode;
+    /** Default duration in ms */
+    defaultDuration?: number;
+    /** Optional render function for variant icons */
+    renderIcon?: (variant: ToastVariant) => React.ReactNode;
+    /** Optional render function for close icon */
+    renderCloseIcon?: () => React.ReactNode;
+}
+declare function ToastProvider({ children, defaultDuration, renderIcon, renderCloseIcon, }: ToastProviderProps): react_jsx_runtime.JSX.Element;
+
+interface HelpPanelProps {
+    /** Whether the panel is open */
+    isOpen: boolean;
+    /** Callback when panel should close */
+    onClose: () => void;
+    /** Help content to display */
+    children: React.ReactNode;
+    /** Optional title for the help panel */
+    title?: string;
+    /** Close button slot - renders your own close button/icon */
+    closeButton?: React.ReactNode;
+    /** Additional className */
+    className?: string;
+}
+/**
+ * Slide-in help panel that appears from the right side of the window.
+ * Used to display contextual help content within app windows.
+ *
+ * Uses slot-based API for the close button to avoid coupling to specific
+ * icon systems. Pass your own button component via the `closeButton` prop.
+ */
+declare function HelpPanel({ isOpen, onClose, children, title, closeButton, className, }: HelpPanelProps): react_jsx_runtime.JSX.Element | null;
+
+type PopoverPosition = 'top' | 'bottom' | 'left' | 'right';
+interface PopoverProps {
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state */
+    defaultOpen?: boolean;
+    /** Callback when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Position relative to trigger */
+    position?: PopoverPosition;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function Popover({ open: controlledOpen, defaultOpen, onOpenChange, position, children, }: PopoverProps): react_jsx_runtime.JSX.Element;
+interface PopoverTriggerProps {
+    /** Trigger element */
+    children: React.ReactElement;
+    /** Pass through as child instead of wrapping */
+    asChild?: boolean;
+}
+declare function PopoverTrigger({ children, asChild }: PopoverTriggerProps): react_jsx_runtime.JSX.Element;
+interface PopoverContentProps {
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+    /** Alignment relative to trigger */
+    align?: 'start' | 'center' | 'end';
+}
+declare function PopoverContent({ className, children, align }: PopoverContentProps): React.ReactPortal | null;
+
+type SheetSide = 'left' | 'right' | 'top' | 'bottom';
+interface SheetProps {
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state */
+    defaultOpen?: boolean;
+    /** Callback when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Side to slide in from */
+    side?: SheetSide;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function Sheet({ open: controlledOpen, defaultOpen, onOpenChange, side, children, }: SheetProps): react_jsx_runtime.JSX.Element;
+interface SheetTriggerProps {
+    /** Trigger element */
+    children: React.ReactElement;
+    /** Pass through as child instead of wrapping */
+    asChild?: boolean;
+}
+declare function SheetTrigger({ children, asChild }: SheetTriggerProps): react_jsx_runtime.JSX.Element;
+interface SheetContentProps {
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function SheetContent({ className, children }: SheetContentProps): React.ReactPortal | null;
+interface SheetHeaderProps {
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function SheetHeader({ className, children }: SheetHeaderProps): react_jsx_runtime.JSX.Element;
+interface SheetTitleProps {
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function SheetTitle({ className, children }: SheetTitleProps): react_jsx_runtime.JSX.Element;
+interface SheetDescriptionProps {
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function SheetDescription({ className, children }: SheetDescriptionProps): react_jsx_runtime.JSX.Element;
+interface SheetBodyProps {
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function SheetBody({ className, children }: SheetBodyProps): react_jsx_runtime.JSX.Element;
+interface SheetFooterProps {
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function SheetFooter({ className, children }: SheetFooterProps): react_jsx_runtime.JSX.Element;
+interface SheetCloseProps {
+    /** Close button element */
+    children: React.ReactElement;
+    /** Pass through as child instead of wrapping */
+    asChild?: boolean;
+}
+declare function SheetClose({ children, asChild }: SheetCloseProps): react_jsx_runtime.JSX.Element;
+
+interface MockStateDefinition {
+    /** Unique identifier for this mock state */
+    id: string;
+    /** Display name */
+    name: string;
+    /** Short description */
+    description: string;
+    /** Category for grouping (e.g., 'wallet', 'auction', 'user') */
+    category: string;
+    /** Optional icon (emoji or component) */
+    icon?: React.ReactNode;
+}
+interface MockStateCategory {
+    /** Category identifier */
+    id: string;
+    /** Display label */
+    label: string;
+}
+interface MockStatesPopoverProps {
+    /** Whether the popover is open */
+    isOpen: boolean;
+    /** Callback when the popover should close */
+    onClose: () => void;
+    /** Array of mock state definitions */
+    mockStates: MockStateDefinition[];
+    /** Currently active mock state ID */
+    activeMockState?: string;
+    /** Callback when a mock state is selected */
+    onSelectState: (stateId: string) => void;
+    /** Categories to display (in order). States are grouped by category. */
+    categories?: MockStateCategory[];
+    /** Title shown in the header */
+    title?: string;
+    /** Footer text */
+    footerText?: string;
+    /** Additional className for the popover container */
+    className?: string;
+}
+/**
+ * MockStatesPopover
+ *
+ * A development-only popover for toggling between mock states.
+ * Displays categorized mock state presets that can be applied
+ * to test different UI scenarios.
+ *
+ * This is a generic component - pass your mock state definitions
+ * and handlers as props.
+ */
+declare function MockStatesPopover({ isOpen, onClose, mockStates, activeMockState, onSelectState, categories, title, footerText, className, }: MockStatesPopoverProps): react_jsx_runtime.JSX.Element | null;
+
+type CountdownVariant = 'default' | 'compact' | 'large';
+interface CountdownTimerProps {
+    /** Target timestamp (Unix ms or Date) */
+    endTime: number | Date;
+    /** Optional start time for "upcoming" status */
+    startTime?: number | Date;
+    /** Visual variant */
+    variant?: CountdownVariant;
+    /** Label text shown above timer */
+    label?: string;
+    /** Callback when countdown reaches zero */
+    onComplete?: () => void;
+    /** Custom ended message */
+    endedMessage?: string;
+    /** Custom upcoming message */
+    upcomingMessage?: string;
+    /** Show days segment */
+    showDays?: boolean;
+    /** Additional classes */
+    className?: string;
+}
+/**
+ * CountdownTimer component for auction countdowns
+ *
+ * Features:
+ * - Live countdown with days/hours/mins/secs
+ * - Three size variants (compact, default, large)
+ * - Automatic status detection (active, ended, upcoming)
+ * - Callback on completion
+ */
+declare function CountdownTimer({ endTime, startTime, variant, label, onComplete, endedMessage, upcomingMessage, showDays, className, }: CountdownTimerProps): react_jsx_runtime.JSX.Element;
+
+interface Web3ActionBarProps {
+    /** Whether wallet is connected */
+    isConnected: boolean;
+    /** Wallet address to display when connected */
+    walletAddress?: string | null;
+    /** Callback when connect button is clicked */
+    onConnect: () => void;
+    /** Optional callback when disconnect button is clicked */
+    onDisconnect?: () => void;
+    /** Icon slot for disconnect button (pass your close icon component) */
+    disconnectIcon?: React.ReactNode;
+    /** App-specific action buttons (My Vault, Place Offering, Stake, etc.) */
+    children?: React.ReactNode;
+    /** Additional className */
+    className?: string;
+}
+/**
+ * Universal Web3 Action Bar for all web3 apps in RadOS
+ *
+ * Provides a consistent bottom bar for wallet connection and app-specific
+ * blockchain actions. Used across Auctions, MurderTree, Vault, and future web3 apps.
+ *
+ * Architecture:
+ * - TabList = Navigation tabs (web2 apps)
+ * - Web3ActionBar = Wallet + blockchain actions (web3 apps)
+ *
+ * @example
+ * ```tsx
+ * <Web3ActionBar
+ *   isConnected={isConnected}
+ *   walletAddress={walletAddress}
+ *   onConnect={handleConnect}
+ *   onDisconnect={handleDisconnect}
+ *   disconnectIcon={<CloseIcon />}
+ * >
+ *   <Button variant="outline" onClick={handleShowVault}>My Vault</Button>
+ *   {status === 'live' && <Button>Place Offering</Button>}
+ * </Web3ActionBar>
+ * ```
+ */
+declare function Web3ActionBar({ isConnected, walletAddress, onConnect, onDisconnect, disconnectIcon, children, className, }: Web3ActionBarProps): react_jsx_runtime.JSX.Element;
+
+interface DialogProps {
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state for uncontrolled usage */
+    defaultOpen?: boolean;
+    /** Callback when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function Dialog({ open: controlledOpen, defaultOpen, onOpenChange, children, }: DialogProps): react_jsx_runtime.JSX.Element;
+interface DialogTriggerProps {
+    /** Trigger element */
+    children: React.ReactElement;
+    /** Pass through as child instead of wrapping */
+    asChild?: boolean;
+}
+declare function DialogTrigger({ children, asChild }: DialogTriggerProps): react_jsx_runtime.JSX.Element;
+interface DialogContentProps {
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function DialogContent({ className, children }: DialogContentProps): React.ReactPortal | null;
+interface DialogHeaderProps {
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function DialogHeader({ className, children }: DialogHeaderProps): react_jsx_runtime.JSX.Element;
+interface DialogTitleProps {
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function DialogTitle({ className, children }: DialogTitleProps): react_jsx_runtime.JSX.Element;
+interface DialogDescriptionProps {
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function DialogDescription({ className, children }: DialogDescriptionProps): react_jsx_runtime.JSX.Element;
+interface DialogBodyProps {
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function DialogBody({ className, children }: DialogBodyProps): react_jsx_runtime.JSX.Element;
+interface DialogFooterProps {
+    /** Additional className */
+    className?: string;
+    /** Children */
+    children: React.ReactNode;
+}
+declare function DialogFooter({ className, children }: DialogFooterProps): react_jsx_runtime.JSX.Element;
+interface DialogCloseProps {
+    /** Close button element */
+    children: React.ReactElement;
+    /** Pass through as child instead of wrapping */
+    asChild?: boolean;
+}
+declare function DialogClose({ children, asChild }: DialogCloseProps): react_jsx_runtime.JSX.Element;
+
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, Badge, Breadcrumbs, Button, Card, CardBody, CardFooter, CardHeader, Checkbox, ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuSeparator, CountdownTimer, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, Divider, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, HelpPanel, Input, Label, type MockStateCategory, type MockStateDefinition, MockStatesPopover, type MockStatesPopoverProps, Popover, PopoverContent, PopoverTrigger, Progress, Radio, Select, Sheet, SheetBody, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Slider, Spinner, Switch, TabContent, TabList, TabTrigger, Tabs, TextArea, ToastProvider, Tooltip, Web3ActionBar, useToast };