import * as React from 'react';
export type SelectionColor = 'primary' | 'secondary' | 'success' | 'warning' | 'info' | 'destructive';
export type SelectionSize = 'sm' | 'md' | 'lg';
export type SelectionVariant = 'default' | 'card' | 'pill' | 'stacked' | 'icon-simple' | 'icon-card' | 'avatar' | 'payment' | 'simple' | 'chip';
export interface SelectionItem {
    /** Unique value for the option */
    value: string;
    /** Display label */
    label: string;
    /** Whether this option is disabled */
    disabled?: boolean;
    /** Secondary text (e.g., "$10/month") */
    subtext?: string;
    /** Supporting description text */
    description?: string;
    /** Leading icon component */
    icon?: React.ReactNode;
    /** Avatar element */
    avatar?: React.ReactNode;
    /** Image URL */
    image?: string;
    /** Alt text for the image (defaults to "" if omitted) */
    imageAlt?: string;
    /** Position of the image */
    imagePosition?: 'top' | 'left' | 'trailing';
    /** Badge element */
    badge?: React.ReactNode;
    /** Dot color for chip variant (named color or hex) */
    dotColor?: string;
    /** Price display (e.g., "$10") */
    price?: string;
    /** Price period (e.g., "per month") */
    pricePeriod?: string;
    /** Payment icon element */
    paymentIcon?: React.ReactNode;
    /** Action buttons */
    actions?: React.ReactNode;
}
interface UseSelectionStateOptions {
    /** Controlled value */
    value?: string;
    /** Default value for uncontrolled mode */
    defaultValue?: string;
    /** Callback when value changes */
    onValueChange?: (value: string) => void;
}
/**
 * Hook for managing single selection state (radio behavior).
 * Supports both controlled and uncontrolled modes.
 */
export declare function useSelectionState(options?: UseSelectionStateOptions): [string | undefined, (value: string) => void];
interface UseMultiSelectionStateOptions {
    /** Controlled value */
    value?: string[];
    /** Default value for uncontrolled mode */
    defaultValue?: string[];
    /** Callback when value changes */
    onValueChange?: (value: string[]) => void;
}
/**
 * Hook for managing multi selection state (checkbox behavior).
 * Supports both controlled and uncontrolled modes.
 */
export declare function useMultiSelectionState(options?: UseMultiSelectionStateOptions): [string[], (value: string, checked: boolean) => void];
export declare const selectionColorClasses: Record<SelectionColor, {
    indicator: string;
    indicatorChecked: string;
    border: string;
    bg: string;
    text: string;
}>;
/**
 * Selection group container variants.
 * Used for the outer wrapper of a group of selection items.
 */
export declare const selectionGroupVariants: (props?: ({
    orientation?: "horizontal" | "vertical" | null | undefined;
    gap?: "sm" | "md" | "lg" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
/**
 * Selection indicator variants (for both radio and checkbox).
 * Renders as a rounded indicator with border.
 */
export declare const selectionIndicatorVariants: (props?: ({
    size?: "sm" | "md" | "lg" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
/**
 * Checkbox indicator variants (square with rounded corners).
 */
export declare const checkboxIndicatorVariants: (props?: ({
    size?: "sm" | "md" | "lg" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
/**
 * Inner dot sizes for radio indicators when checked.
 */
export declare const innerDotSizes: Record<SelectionSize, string>;
/**
 * Text size classes for selection labels.
 */
export declare const textSizeClasses: Record<SelectionSize, string>;
/**
 * Icon size classes for checkbox indicators.
 */
export declare const iconSizeClasses: Record<SelectionSize, string>;
export declare const CHECKMARK_PATH = "M4 12l5 5L20 6";
export declare function DrawCheck({ className }: {
    className?: string;
}): import("react/jsx-runtime").JSX.Element;
export interface SelectionIndicatorProps {
    /** Type of indicator to render */
    type: 'checkbox' | 'radio';
    /** Whether the indicator is checked */
    checked?: boolean;
    /** Whether the indicator is disabled */
    disabled?: boolean;
    /** Size of the indicator */
    size?: SelectionSize;
    /** Color of the indicator */
    color?: SelectionColor;
    /** Additional CSS classes */
    className?: string;
    /** Whether the checkbox is in indeterminate state (checkbox only) */
    indeterminate?: boolean;
}
/**
 * SelectionIndicator renders either a checkbox or radio indicator based on type.
 * For checkbox: renders a check icon when checked.
 * For radio: renders an inner dot when checked.
 */
declare const SelectionIndicator: React.ForwardRefExoticComponent<SelectionIndicatorProps & React.RefAttributes<HTMLSpanElement>>;
export interface FeaturedIconProps {
    /** The icon content to display */
    children: React.ReactNode;
    /** Size of the featured icon container */
    size?: SelectionSize;
    /** Additional CSS classes */
    className?: string;
}
/**
 * FeaturedIcon is a container for icons with border and shadow.
 * Used in icon-simple and icon-card variants.
 */
declare const FeaturedIcon: React.ForwardRefExoticComponent<FeaturedIconProps & React.RefAttributes<HTMLDivElement>>;
export type ColorDotColor = 'gray' | 'orange' | 'red' | 'darkRed' | 'brand' | 'success' | 'warning' | 'error' | string;
export interface ColorDotProps {
    /** Color of the dot (named color or hex) */
    color?: ColorDotColor;
    /** Size of the dot */
    size?: SelectionSize;
    /** Additional CSS classes */
    className?: string;
}
/**
 * ColorDot renders a colored dot for chip variant.
 * Supports named colors (gray, orange, red, etc.) and hex colors.
 */
declare const ColorDot: React.ForwardRefExoticComponent<ColorDotProps & React.RefAttributes<HTMLSpanElement>>;
export { ColorDot, FeaturedIcon, SelectionIndicator };
