import { CLBorderRadius, CLIconNames, CLInputTypes, CLGenericFocusFunction, CLGenericFunction, CLGenericInputFunction, CLSizes, CLColors, CLColorVariants, CLOrientation } from '../../../index.ts';
export interface CLInputProps {
/** Sets the aria-label on the input. It should be used when there is no label present. */
ariaLabel?: string;
/** See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#autocomplete for more details. */
autoComplete?: boolean;
/** The border radius size. The property can be one of `CLBorderRadius`, e.g. `CLBorderRadius.Medium`. */
borderRadius?: CLBorderRadius;
/** A `boolean` value which dictates the busy state of the input. */
busy?: boolean;
/** When set to `true` and `maxLength` is set, it will display a character counter below the input. */
charCounter?: boolean;
/** Sets the color of element's borders. The property can be one of `CLColors`, e.g. `CLColors.Primary`. */
color?: CLColors;
/** Set the disabled state. */
disabled?: boolean;
/** When set to true, sets the width of the Input to 100% of it's parent. */
fluid?: boolean;
/** The form whom the input belongs to. Useful for when a input is not within a `form` element. */
form?: string;
/** When a prefix or suffix is set, setting this to `true` changes the layout. */
grouped?: boolean;
/** A unique identifier, this is required. */
id: string;
/** The label text to be displayed which is associated to the input. */
label?: string;
/** The maximum amount of characters allowed for entry. */
maxLength?: number;
/** An array of messages to be displayed. */
messages?: string[];
/** The message type. The property can be one of `CLColors`, e.g. `CLColors.Danger`. */
messageType?: CLColors;
/** The minimum amount of characters required for entry. */
minLength?: number;
/** A string representing name of the input. The name is submitted along with the input value when the form it belongs to is submitted. */
name: string;
/** A callback function which handles when the input loses focus. */
onBlur?: CLGenericFocusFunction;
/** A callback function which handles when the input value changes. */
onChange?: CLGenericFunction;
/** A callback function which handles when the input gains focus. */
onFocus?: CLGenericFocusFunction;
/** A callback function which handles when the input value changes due to user input. */
onInput?: CLGenericInputFunction;
/** A callback function which handles when the prefix icon is clicked. */
onPrefixClick?: (event?: MouseEvent) => void;
/** A callback function which handles when the suffix icon is clicked. */
onSuffixClick?: (event?: MouseEvent) => void;
/** Sets the label position to be above or to the left of the form element. The property can be one of `CLOrientation` */
orientation?: CLOrientation;
/** A regexp pattern that can be used for validation. */
pattern?: string;
/** Setting this value would render the string the `` component below the input. */
pill?: string;
/** The default text shown when there is no value. Useful for providing a hint of what type of input is expected. */
placeholder?: string;
/** Sets the icon or text to be displayed before the user input. */
prefix?: string | CLIconNames;
/** Sets the aria-label for the prefix icon when it's interactive. */
prefixAriaLabel?: string;
/** When set to `true` the input cannot be edited. */
readonly?: boolean;
/** Set the required state. */
required?: boolean;
/** When set to `false` it will not render with rounded corners. */
rounded?: boolean;
/** Sets the input size. The property can be one of `CLSizes`, e.g. `CLSizes.Medium`. */
size?: CLSizes;
/** A hint provided to browsers that support it, whether or not to check for spelling errors. */
spellCheck?: boolean;
/**Sets the icon or text to be displayed after the user input. */
suffix?: string | CLIconNames;
/** Sets the aria-label for the suffix icon when it's interactive. */
suffixAriaLabel?: string;
/** Sets a custom ID used for unit tests. */
testId?: string;
/**Set the type of input, supports various input types. */
type?: CLInputTypes;
/** Sets the color variant. The property can be one of `CLColorVariants.Outline | CLColorVariants.Ghost`, e.g `CLColorVariants.Outline`. */
variant?: CLColorVariants.Outline | CLColorVariants.Ghost;
}
declare const _default: import('vue').DefineComponent<{
modelValue?: string | number;
} & CLInputProps, {
inputRef: Readonly>;
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
reset: (...args: any[]) => void;
"update:modelValue": (value: string | number) => void;
}, string, import('vue').PublicProps, Readonly<{
modelValue?: string | number;
} & CLInputProps> & Readonly<{
onReset?: ((...args: any[]) => any) | undefined;
"onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
}>, {
size: CLSizes;
color: CLColors;
variant: CLColorVariants.Outline | CLColorVariants.Ghost;
fluid: boolean;
rounded: boolean;
testId: string;
type: CLInputTypes;
form: string;
label: string;
pattern: string;
onFocus: CLGenericFocusFunction;
onBlur: CLGenericFocusFunction;
onChange: CLGenericFunction;
onInput: CLGenericInputFunction;
borderRadius: CLBorderRadius;
required: boolean;
prefix: string | CLIconNames;
ariaLabel: string;
busy: boolean;
disabled: boolean;
pill: string;
placeholder: string;
orientation: CLOrientation;
messages: string[];
messageType: CLColors;
maxLength: number;
grouped: boolean;
suffix: string | CLIconNames;
autoComplete: boolean;
charCounter: boolean;
minLength: number;
onPrefixClick: (event?: MouseEvent) => void;
onSuffixClick: (event?: MouseEvent) => void;
prefixAriaLabel: string;
readonly: boolean;
spellCheck: boolean;
suffixAriaLabel: string;
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
'input-elem': HTMLInputElement;
}, HTMLDivElement>;
export default _default;