import { InputType } from './Input.type';
import { PropsWithChildren, FocusEvent } from 'react';

type PinInputProps = PropsWithChildren<{
    id?: string;
    type?: InputType;
    mask?: boolean;
    color?: string;
    fontSize?: string;
    fontWeight?: string;
    placeholder?: string;
    value?: string[];
    pattern?: RegExp;
    enableVirtualKeyboard?: boolean;
    onValueChange?: (details: {
        values: string[];
    }) => void;
    onValueComplete?: (details: {
        values: string[];
    }) => void;
}>;
export declare const PinInput: {
    ({ id, type, mask, placeholder, value, pattern, enableVirtualKeyboard, onValueChange, onValueComplete, children, }: PropsWithChildren<PinInputProps>): import("react/jsx-runtime").JSX.Element;
    displayName: string;
    Root: any;
    Input: import('react').ForwardRefExoticComponent<{
        index: number;
        readOnly?: boolean | undefined;
        onBlur?: ((e: FocusEvent<HTMLInputElement>) => void) | undefined;
        onFocus?: ((e: FocusEvent<HTMLInputElement>) => void) | undefined;
    } & Partial<Pick<import("react").CSSProperties, "display" | "flex" | "flexWrap" | "flexBasis" | "flexGrow" | "flexShrink" | "flexDirection" | "justifyContent" | "alignItems" | "alignContent" | "alignSelf" | "order" | "gap">> & Partial<Pick<import("react").CSSProperties, "gridGap" | "gridRowGap" | "gridColumnGap" | "gridTemplateRows" | "gridTemplateColumns" | "gridTemplateAreas" | "gridArea">> & Partial<Pick<import("react").CSSProperties, "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft">> & Partial<Pick<import("react").CSSProperties, "width" | "height" | "minWidth" | "maxWidth" | "minHeight" | "maxHeight">> & Partial<Pick<import("react").CSSProperties, "color" | "fontSize" | "fontWeight" | "lineHeight" | "textAlign" | "letterSpacing" | "whiteSpace" | "textOverflow">> & Partial<Pick<import("react").CSSProperties, "backgroundColor" | "backgroundImage" | "backgroundSize" | "backgroundPosition" | "backgroundRepeat">> & Partial<Pick<import("react").CSSProperties, "boxShadow" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "borderWidth" | "borderStyle" | "outline">> & Partial<Pick<import("react").CSSProperties, "position" | "top" | "right" | "bottom" | "left">> & Partial<Pick<import("react").CSSProperties, "cursor" | "zIndex" | "opacity" | "overflow" | "overflowX" | "overflowY" | "transition" | "transform">> & import("react").RefAttributes<HTMLInputElement>>;
    Label: ({ children }: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
    Control: ({ children }: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
};
export {};