import React from "react";
import { type FormFieldSize } from "../../types/general.types.js";
import { type FormHeightNames } from "../../system/Sizes.js";
import type { IconKey, IconProps } from "../Icons/types/IconProps.type";
export declare const StyledInput: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "width"> & {
    suffix?: string;
    prefix?: string;
    icon?: React.FC<IconProps> | IconKey;
    /**
     * The width of the input. Defaults to `"full"`, which stretches the input to fill its container.
     *
     * - `"sm"` (4rem): short numeric values, e.g. an amount inline in a sentence.
     * - `"md"` (8rem): short values such as a date or postal code.
     * - `"lg"` (14rem) and `"xl"` (20rem): names and other free text that shouldn't span the whole container.
     * - `"full"`: fills the container.
     *
     * Pass an array to change the width per breakpoint, from the smallest up
     * (default, `sm`, `md`, `lg`, `xl`). For example, `["full", "xl"]` fills the container
     * on small screens and is 20rem wide from the `sm` breakpoint up.
     *
     * Use this prop instead of an inline `style` width.
     */
    width?: FormFieldSize | [FormFieldSize, FormFieldSize?, FormFieldSize?, FormFieldSize?, FormFieldSize?];
    height?: FormHeightNames;
    isError?: boolean;
    isClearIconVisible?: boolean;
    onClickClearField?: () => void;
    /** Accessible name of the clear button. */
    clearButtonLabel?: string;
} & React.RefAttributes<HTMLInputElement>>;