@dcodegroup-au/dsg-vue/dist/components/Elements/DsgInput.vue.d.ts

Front-end Vue/Tailwind DSG for UntitledUI.

/**
 * ------------------------------------------------
 *  # Setup: Props
 * ------------------------------------------------
 */
export interface DsgInputCurrencyPair {
    label: string;
    value: string;
    symbol: string;
}
export interface DsgInputPhoneFormat {
    countryCode: string;
    countrySymbol: string;
    format: string;
}
export interface DsgInputValidationPattern {
    pattern: string | RegExp | Function;
    error: string;
}
export type DsgInputTheme = "default" | "phone" | "currency" | "website" | "copy" | "credit-card" | "tags" | "textarea" | "textarea-tags";
export type DsgInputSize = "sm" | "md";
export type DsgInputWidth = "auto" | "full";
export type DsgInputType = "color" | "date" | "datetime" | "email" | "password" | "month" | "number" | "tel" | "text" | "time" | "week" | "textarea";
export type DsgInputTooltipTheme = "light" | "dark";
export interface DsgInputProps {
    label?: string;
    type?: DsgInputType;
    theme?: DsgInputTheme;
    disabled?: boolean;
    icon?: string | null;
    size?: DsgInputSize;
    width?: DsgInputWidth;
    tags?: string[];
    hint?: string;
    placeholder?: string;
    name?: string;
    step?: string;
    hasTooltip?: boolean;
    toolTip?: string | undefined;
    min?: number | undefined;
    max?: number | undefined;
    hasClearButton?: boolean;
    tooltipTheme?: DsgInputTooltipTheme;
    autocomplete?: string | undefined;
    currencyPairs?: DsgInputCurrencyPair[];
    phoneFormat?: DsgInputPhoneFormat[];
    websiteHttps?: boolean;
    websiteWww?: boolean;
    validateOnInput?: boolean;
    validateOnLoad?: boolean;
    validationPatterns?: DsgInputValidationPattern[];
    hideHintOnError?: boolean;
    minLength?: number;
    classes?: string;
    errors?: string[] | string;
    hasCopyButton?: boolean;
    preventDefault?: boolean;
    iconClickable?: boolean;
    requiredLabel?: boolean | string;
    allowableCharacters?: string | string[] | RegExp;
    formatter?: Function;
}
type __VLS_Props = DsgInputProps;
type __VLS_PublicProps = {
    modelValue?: any;
} & __VLS_Props;
declare function __VLS_template(): {
    attrs: Partial<{}>;
    slots: {
        'dsg-input--tooltip-content'?(_: {}): any;
    };
    refs: {
        themeInputWrapper: HTMLDivElement;
        creditCardIcon: import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('../Icons/DsgCreditCardIcon.vue').DsgCreditCardIconProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
            P: {};
            B: {};
            D: {};
            C: {};
            M: {};
            Defaults: {};
        }, Readonly<import('../Icons/DsgCreditCardIcon.vue').DsgCreditCardIconProps> & Readonly<{}>, {}, {}, {}, {}, {}> | null;
        themeInputEl: HTMLTextAreaElement;
        dsgInputTooltipWrapper: HTMLSpanElement;
        dsgInputClearButtonWrapper: HTMLButtonElement;
    };
    rootEl: HTMLDivElement;
};
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {
    focus: (isFocused?: boolean) => void;
    validate: () => void;
    callbackValidation: (callback: Function) => void;
    setErrors: (errors: string[]) => void;
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
    [x: string]: any;
} & {
    [x: string]: any;
}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
    [x: `on${Capitalize<any>}`]: ((...args: any) => any) | undefined;
}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
    themeInputWrapper: HTMLDivElement;
    creditCardIcon: import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('../Icons/DsgCreditCardIcon.vue').DsgCreditCardIconProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
        P: {};
        B: {};
        D: {};
        C: {};
        M: {};
        Defaults: {};
    }, Readonly<import('../Icons/DsgCreditCardIcon.vue').DsgCreditCardIconProps> & Readonly<{}>, {}, {}, {}, {}, {}> | null;
    themeInputEl: HTMLTextAreaElement;
    dsgInputTooltipWrapper: HTMLSpanElement;
    dsgInputClearButtonWrapper: HTMLButtonElement;
}, HTMLDivElement>;
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
export default _default;
type __VLS_WithTemplateSlots<T, S> = T & {
    new (): {
        $slots: S;
    };
};