import { ElementType, ReactNode, Ref, ChangeEvent, KeyboardEvent, FocusEvent, ComponentPropsWithoutRef } from 'react';
import { Color } from '../types.js';
import { SurfaceCutOwnProps } from './SurfaceCut.js';
export type InputSize = 'sm' | 'md' | 'lg' | 'xl' | '2xl';
interface InputOwnProps<C extends ElementType = 'div', IC extends ElementType = 'input'> {
    /** Polymorphic **wrapper** element. Defaults to `'div'`. (For the inner input, see `inputComponent`.) */
    as?: C;
    /** Native `<input type>`. Default `'text'`. */
    type?: string;
    /** Controlled value. */
    value?: string | number;
    /**
     * Custom node displayed in place of the raw `value` while the input is `readOnly` or unfocused.
     *
     * Useful for formatted display (e.g. show "1,234.56" while the underlying value is `1234.56`) - the real value re-appears on focus for editing.
     */
    displayValue?: ReactNode;
    /** Native `placeholder` shown when the input is empty. */
    placeholder?: string;
    /** Native `name` attribute, used for form submission. */
    name?: string;
    /** Native `required` attribute. Default `false`. */
    required?: boolean;
    /** Visually dim the input and disable interaction. Default `false`. */
    disabled?: boolean;
    /** Make the input non-editable but still focusable for value display/copying. */
    readOnly?: boolean;
    /** `id` for the inner `<input>`. Used to wire an external `<label htmlFor>`. */
    inputId?: string;
    /** Apply pill (`rounded-full`) corners. Default `false` - uses size-specific radii. */
    rounded?: boolean;
    /** Input size token. Drives height, padding, and font size. Default `'lg'`. */
    size?: InputSize;
    /** Fires on every keystroke. First arg is the new value, second is the raw event. */
    onChange?: (value: string, event: ChangeEvent<HTMLInputElement>) => void;
    /** Forwarded to the inner `<input>` - fires on key down. */
    onKeyDown?: (e: KeyboardEvent<HTMLInputElement>) => void;
    /** Forwarded to the inner `<input>` - fires when the input gains focus. */
    onFocus?: (e: FocusEvent<HTMLInputElement>) => void;
    /** Forwarded to the inner `<input>` - fires when the input loses focus. */
    onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
    /** Called when the clear button is pressed. Pair with `clearButton`. */
    onClear?: () => void;
    /** Accent color token. Drives the focus ring and `infoMessage` colors. Default: theme accent. */
    color?: Color;
    /** Slot rendered before the input element, inside the surface (e.g. unit label, currency symbol). */
    prefix?: ReactNode;
    /** Native `min` attribute. Forwarded to the inner `<input>` (useful for `type="number"`/`"date"`). */
    min?: number | string;
    /** Native `step` attribute. Forwarded to the inner `<input>` (useful for `type="number"`). */
    step?: number | string;
    /** Slot rendered after the input element, inside the surface. */
    suffix?: ReactNode;
    /** Extra classes for the outer wrapper. */
    className?: string;
    /** Extra classes for the inner `SurfaceCut` content area (where prefix/input/suffix live). */
    contentClassName?: string;
    /** Extra classes for the actual `<input>` element (or `inputComponent`). */
    inputClassName?: string;
    /** Native `max` attribute. Forwarded to the inner `<input>` (useful for `type="number"`/`"date"`). */
    max?: number | string;
    /** Native `maxLength` attribute. */
    maxLength?: number;
    /** Render a clear (X) button on the right that fires `onClear`. Hidden when `value` is empty. */
    clearButton?: boolean;
    /** Accessible label for the clear button. Default: `'Clear'`. */
    clearLabel?: string;
    /**
     * Validity state. Default `true`. When `false`, switches the focus ring to red and shows `errorMessage` (instead of `infoMessage`).
     */
    valid?: boolean;
    /** Render the focus ring flush against the element (`inset-0`) instead of offset outside it (`-inset-1.5`). Use when the input sits at the edge of an `overflow` container, where the offset ring would add unwanted scroll overflow. Default `false`. */
    tightFocusRing?: boolean;
    /** Floating label shown above the input on focus. Hidden when `valid === false` or `readOnly`. */
    infoMessage?: ReactNode;
    /** Floating error label. Always visible (no focus required) when `valid === false`. */
    errorMessage?: ReactNode;
    /** Native `pattern` attribute - regex validated on form submission. */
    pattern?: string;
    /** Native `inputMode` - hints at the mobile keyboard layout to display. */
    inputMode?: 'none' | 'text' | 'tel' | 'url' | 'email' | 'numeric' | 'decimal' | 'search';
    /** Icon node rendered inside the surface, absolutely positioned on the left. Shifts input padding. */
    icon?: ReactNode;
    /** Extra classes for the icon wrapper. */
    iconClassName?: string;
    /** Forwarded to the `SurfaceCut` root element. */
    ref?: Ref<HTMLElement>;
    /** Forwarded to the inner `<input>` (or `inputComponent`) element. */
    inputRef?: Ref<HTMLInputElement>;
    /** Native `autoFocus` - focus the input on mount. */
    autoFocus?: boolean;
    /**
     * Polymorphic **input** element. Defaults to `'input'`. Use this to swap in a custom component (e.g. a masked input library) that should still inherit the Input chrome (focus ring, clear button, prefix/suffix, etc.).
     */
    inputComponent?: IC;
    /** Extra props forwarded to the `inputComponent`. Typed against the chosen component. */
    inputComponentProps?: Partial<ComponentPropsWithoutRef<IC>>;
}
export type InputProps<C extends ElementType = 'div', IC extends ElementType = 'input'> = InputOwnProps<C, IC> & Omit<SurfaceCutOwnProps<C>, keyof InputOwnProps<C, IC> | 'children'> & Omit<ComponentPropsWithoutRef<C>, keyof InputOwnProps<C, IC>>;
/** Shape of `Input` defaults that can be supplied via `CladdProvider`'s `defaults` prop. */
export type InputDefaultProps = Partial<Omit<InputOwnProps, 'as' | 'ref' | 'inputRef' | 'inputComponent' | 'inputComponentProps' | 'value' | 'onChange'>>;
export declare const Input: <C extends ElementType = "div", IC extends ElementType = "input">(props: InputProps<C, IC>) => import("react/jsx-runtime").JSX.Element;
export {};
//# sourceMappingURL=Input.d.ts.map