import { Select as SelectBase } from '@base-ui/react/select';
import { ReactNode } from 'react';
import { FieldErrorMatch } from '../field/field';
/** Select variant definitions (currently empty, reserved for future additions). */
export declare const KUMO_SELECT_VARIANTS: {};
export declare const KUMO_SELECT_DEFAULT_VARIANTS: {};
/**
 * Select component styling metadata for Figma plugin code generation
 * Extracted from select.tsx implementation (source of truth)
 */
export declare const KUMO_SELECT_STYLING: {
    readonly trigger: {
        readonly height: 36;
        readonly paddingX: 12;
        readonly borderRadius: 8;
        readonly background: "color-secondary";
        readonly text: "text-color-surface";
        readonly ring: "color-border";
        readonly fontSize: 16;
        readonly fontWeight: 400;
    };
    readonly stateTokens: {
        readonly focus: {
            readonly ring: "color-active";
        };
        readonly disabled: {
            readonly opacity: 0.5;
        };
    };
    readonly icons: {
        readonly caret: {
            readonly name: "ph-caret-up-down";
            readonly size: 20;
        };
        readonly check: {
            readonly name: "ph-check";
            readonly size: 20;
        };
    };
    readonly popup: {
        readonly background: "color-secondary";
        readonly ring: "color-border";
        readonly borderRadius: 8;
        readonly padding: 6;
    };
    readonly option: {
        readonly paddingX: 8;
        readonly paddingY: 6;
        readonly borderRadius: 4;
        readonly fontSize: 16;
        readonly highlightBackground: "color-surface-secondary";
    };
};
export interface KumoSelectVariantsProps {
}
export declare function selectVariants(_props?: KumoSelectVariantsProps): string;
type SelectPropsGeneric<T, Multiple extends boolean | undefined = false> = SelectBase.Root.Props<T, Multiple> & KumoSelectVariantsProps & {
    multiple?: Multiple;
    renderValue?: (value: Multiple extends true ? T[] : T) => ReactNode;
    className?: string;
    /**
     * Label content for the select.
     * When provided, enables the Field wrapper with a visible label.
     * For accessibility without a visible label, use `aria-label` instead.
     */
    label?: ReactNode;
    /**
     * @deprecated Use `aria-label` for hidden labels instead of `label` + `hideLabel={true}`.
     * When `label` is provided without `hideLabel`, the label is now visible by default (matching Input behavior).
     * This prop will be removed in a future version.
     */
    hideLabel?: boolean;
    placeholder?: string;
    loading?: boolean;
    /** Tooltip content to display next to the label via an info icon */
    labelTooltip?: ReactNode;
    /** Helper text displayed below the select */
    description?: ReactNode;
    /** Error message or validation error object */
    error?: string | {
        message: ReactNode;
        match: FieldErrorMatch;
    };
};
/**
 * Select component props.
 *
 * **Accessible Name Required:** Select should have one of:
 * 1. `label` prop (recommended) - enables Field wrapper with visible label
 * 2. `aria-label` - for selects without visible label (accessibility-only)
 * 3. `aria-labelledby` - for custom label association
 *
 * @example
 * ```tsx
 * // With visible label (recommended)
 * <Select label="Country" onValueChange={setValue}>
 *   <Select.Option value="us">United States</Select.Option>
 *   <Select.Option value="uk">United Kingdom</Select.Option>
 * </Select>
 *
 * // Without visible label (use aria-label for accessibility)
 * <Select aria-label="Select a country" onValueChange={setValue}>
 *   <Select.Option value="us">United States</Select.Option>
 * </Select>
 * ```
 */
export interface SelectProps {
    /** Additional CSS classes merged via `cn()`. */
    className?: string;
    /**
     * Label content for the select.
     * When provided, enables the Field wrapper with a visible label above the select.
     * For accessibility without a visible label, use `aria-label` instead.
     */
    label?: ReactNode;
    /**
     * @deprecated Use `aria-label` for hidden labels instead of `label` + `hideLabel={true}`.
     * When `label` is provided without `hideLabel`, the label is now visible by default (matching Input behavior).
     * This prop will be removed in a future version.
     */
    hideLabel?: boolean;
    /** Placeholder text shown when no value is selected. */
    placeholder?: string;
    /** When `true`, shows a skeleton loader in place of the selected value. */
    loading?: boolean;
    /** Whether the select is disabled. */
    disabled?: boolean;
    /** Whether the select is required. When `false`, shows "(optional)" text. */
    required?: boolean;
    /** Tooltip content displayed next to the label via an info icon. */
    labelTooltip?: ReactNode;
    /** Currently selected value (controlled mode). */
    value?: unknown;
    /** Initial value for uncontrolled mode. */
    defaultValue?: unknown;
    /** Callback fired when the selected value changes. */
    onValueChange?: (value: unknown) => void;
    /** Enable multi-select mode. */
    multiple?: boolean;
    /** `Select.Option` elements to render in the dropdown. */
    children?: ReactNode;
    /** Helper text displayed below the select. */
    description?: ReactNode;
    /** Error message string or validation error object with `match` key. */
    error?: string | {
        message: ReactNode;
        match: FieldErrorMatch;
    };
}
/**
 * Dropdown for selecting a value from a list of options.
 * Wraps Base UI Select with Kumo styling and optional Field integration.
 *
 * @example
 * ```tsx
 * <Select label="Fruit" onValueChange={setFruit}>
 *   <Select.Option value="apple">Apple</Select.Option>
 *   <Select.Option value="banana">Banana</Select.Option>
 * </Select>
 * ```
 */
export declare function Select<T, Multiple extends boolean | undefined = false>({ children, className, renderValue, label, hideLabel, placeholder, loading, labelTooltip, description, error, required, ...props }: SelectPropsGeneric<T, Multiple> & {
    required?: boolean;
}): import("react/jsx-runtime").JSX.Element;
export declare namespace Select {
    var Option: <T>({ children, value }: OptionProps<T>) => import("react/jsx-runtime").JSX.Element;
}
type OptionProps<T> = {
    children: ReactNode;
    value: T;
};
export {};
//# sourceMappingURL=select.d.ts.map