@hauzhengyi/vue3-otp-input
Version:
A fully customizable, OTP (one-time password) input component built with Vue 3.x and Vue Composition API.
100 lines (99 loc) • 3.06 kB
TypeScript
import { PropType, Ref } from "vue";
declare const _default: import("vue").DefineComponent<{
inputType: {
type: PropType<"number" | "tel" | "letter-numeric" | "password">;
validator: (value: string) => boolean;
default: string;
};
inputmode: {
type: PropType<"tel" | "none" | "text" | "url" | "email" | "numeric" | "decimal" | "search">;
default: string;
};
value: {
type: (StringConstructor | NumberConstructor)[];
};
separator: {
type: StringConstructor;
};
focus: {
type: BooleanConstructor;
};
inputClasses: {
type: PropType<string | string[]>;
};
conditionalClass: {
type: StringConstructor;
};
shouldAutoFocus: {
type: BooleanConstructor;
};
isLastChild: {
type: BooleanConstructor;
};
placeholder: {
type: StringConstructor;
};
isDisabled: {
type: BooleanConstructor;
};
}, {
handleOnChange: () => void;
handleOnKeyDown: (event: KeyboardEvent) => void;
handleOnPaste: (event: ClipboardEvent) => void;
handleOnFocus: () => void;
handleOnBlur: () => void;
input: Ref<HTMLInputElement>;
model: Ref<string | number>;
inputTypeValue: string;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("on-change" | "on-keydown" | "on-paste" | "on-focus" | "on-blur")[], "on-change" | "on-keydown" | "on-paste" | "on-focus" | "on-blur", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
inputType: {
type: PropType<"number" | "tel" | "letter-numeric" | "password">;
validator: (value: string) => boolean;
default: string;
};
inputmode: {
type: PropType<"tel" | "none" | "text" | "url" | "email" | "numeric" | "decimal" | "search">;
default: string;
};
value: {
type: (StringConstructor | NumberConstructor)[];
};
separator: {
type: StringConstructor;
};
focus: {
type: BooleanConstructor;
};
inputClasses: {
type: PropType<string | string[]>;
};
conditionalClass: {
type: StringConstructor;
};
shouldAutoFocus: {
type: BooleanConstructor;
};
isLastChild: {
type: BooleanConstructor;
};
placeholder: {
type: StringConstructor;
};
isDisabled: {
type: BooleanConstructor;
};
}>> & {
"onOn-change"?: ((...args: any[]) => any) | undefined;
"onOn-keydown"?: ((...args: any[]) => any) | undefined;
"onOn-paste"?: ((...args: any[]) => any) | undefined;
"onOn-focus"?: ((...args: any[]) => any) | undefined;
"onOn-blur"?: ((...args: any[]) => any) | undefined;
}, {
inputType: "number" | "tel" | "letter-numeric" | "password";
inputmode: "tel" | "none" | "text" | "url" | "email" | "numeric" | "decimal" | "search";
focus: boolean;
shouldAutoFocus: boolean;
isLastChild: boolean;
isDisabled: boolean;
}, {}>;
export default _default;