import { default as React } from 'react';
import { ControlColor } from './helpers/control-colors';
declare const inputClasses: {
    base: string;
    numberType: string;
    error: string;
    size: {
        sm: string;
        md: string;
        lg: string;
        xl: string;
    };
    rounded: {
        none: string;
        sm: string;
        md: string;
        lg: string;
        full: string;
    };
    variant: {
        ghost: {
            base: string;
        };
        solid: {
            base: string;
        };
        transparent: {
            base: string;
        };
    };
};
export interface PinCodeProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'type' | 'onChange'> {
    /** Current value of the pin code */
    value?: string;
    /** Callback function called when pin code changes */
    onChange?: (value: string) => void;
    /** This Pin Code component only support these two types */
    type?: 'text' | 'number';
    /** Mask and unmask to hide and show pin code */
    mask?: boolean;
    /** Set pin code length */
    length?: number;
    /** Make pin code horizontally center */
    center?: boolean;
    /** Set placeholder text */
    placeholder?: string;
    /** The size of the component. `"sm"` is equivalent to the dense input styling. */
    size?: keyof typeof inputClasses.size;
    /** The rounded variants are: */
    rounded?: keyof typeof inputClasses.rounded;
    /** The variants of the component are: */
    variant?: keyof typeof inputClasses.variant;
    /** Change input color */
    color?: ControlColor;
    /** Show error message using this prop */
    error?: string;
    /** Add custom classes for the input filed extra style */
    inputClassName?: string;
    /** This prop allows you to customize the error message style */
    errorClassName?: string;
    /** This prop allows you to add a helper text to the pin code component */
    helperText?: string;
    /** This prop allows you to add a helper text to the pin code component */
    helperTextClassName?: string;
    /** This prop allows you to make the pin code component full width */
    fullWidth?: boolean;
}
/**
 * A basic widget for getting pin code. Here is the API documentation of the Pin Code component.
 * And the rest of the props of PinCode are the same as the original html input field.
 * You can use props like `disabled`, `placeholder`, `defaultValue` etc.
 */
export declare function PinCode({ type, value, onChange, mask, length, center, size, rounded, variant, color, placeholder, error, className, inputClassName, errorClassName, helperText, helperTextClassName, fullWidth, ...props }: PinCodeProps): import("react/jsx-runtime").JSX.Element;
export default PinCode;
