@shopware-ag/meteor-component-library/dist/common/MtColorpicker.d.ts

The meteor component library is a Vue component library developed by Shopware. It is based on the [Meteor Design System](https://shopware.design/).

import { PropType } from 'vue';
import { FocusTrap } from 'focus-trap';
declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
    /**
     * The value of the colorpicker field.
     */
    modelValue: {
        type: PropType<string | null>;
        required: false;
        default: string;
    };
    /**
     * A label for your text field. Usually used to guide the user what value this field controls.
     */
    label: {
        type: StringConstructor;
        required: false;
        default: null;
    };
    /**
     * A text that helps the user to understand what this field does.
     */
    helpText: {
        type: StringConstructor;
        required: false;
        default: null;
    };
    /**
     * Change the output value which gets emitted and shown in the field.
     * @values auto, hex, hsl, rgb
     */
    colorOutput: {
        type: PropType<"auto" | "hex" | "hsl" | "rgb">;
        required: false;
        default: string;
    };
    /**
     * If activated then the color value can contain alpha values
     */
    alpha: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Determines if the field is disabled.
     */
    disabled: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Determines if the field is required.
     */
    required: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    placeholder: {
        type: StringConstructor;
        required: false;
    };
    /**
     * Toggles the inheritance visualization.
     */
    isInherited: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Determines if the field is inheritable.
     */
    isInheritanceField: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Determines the active state of the inheritance toggle.
     */
    disableInheritanceToggle: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Determines if the field can be edited
     */
    readonly: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Toggle the labels above each field inside the colorpicker
     */
    colorLabels: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    zIndex: {
        type: PropType<number | null>;
        required: false;
        default: null;
    };
    /**
     * An error in your business logic related to this field.
     *
     * @example {"code": 500, "detail": "Error while saving"}
     */
    error: {
        type: ObjectConstructor;
        required: false;
        default: null;
    };
    /**
     * @ignore
     */
    name: {
        type: StringConstructor;
        required: false;
        default: null;
    };
    /**
     * Show the colorpicker in a compact mode
     */
    compact: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Use apply-mode to apply the color value on button click
     */
    applyMode: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
}>, {
    t: import('vue-i18n').ComposerTranslation<{
        en: {
            "mt-colorpicker": {
                apply: string;
            };
        };
        de: {
            "mt-colorpicker": {
                apply: string;
            };
        };
    }, "en" | "de", import('@intlify/core-base').RemoveIndexSignature<{
        [x: string]: import('vue-i18n').LocaleMessageValue<import('vue-i18n').VueMessageType>;
    }>, never, "mt-colorpicker" | "mt-colorpicker.apply", "mt-colorpicker" | "mt-colorpicker.apply">;
}, {
    localValue: string | {
        string: string;
        red: string;
        green: string;
        blue: string;
        alpha?: string;
    };
    visible: boolean;
    isDragging: boolean;
    userInput: null;
    luminanceValue: number;
    saturationValue: number;
    hueValue: number;
    alphaValue: number;
    hasFocus: boolean;
    trap: FocusTrap | null;
    hueStep: number;
    alphaStep: number;
}, {
    colorValue: {
        get(): string | {
            string: string;
            red: string;
            green: string;
            blue: string;
            alpha?: string;
        };
        set(newColor: {
            string: string;
            red: string;
            green: string;
            blue: string;
            alpha?: string;
        }): void;
    };
    integerAlpha: {
        get(): number;
        set(newAlphaValue: number): void;
    };
    sliderBackground(): string;
    isColorValid(): boolean;
    previewColorValue(): string;
    selectorBackground(): string;
    redValue: {
        get(): number;
        set(newRedValue: number): void;
    };
    greenValue: {
        get(): number;
        set(newGreenValue: number): void;
    };
    blueValue: {
        get(): number;
        set(newBlueValue: number): void;
    };
    rgbValue(): string;
    hslValue(): string;
    hexValue: {
        get(): string | {
            string: string;
            red: string;
            green: string;
            blue: string;
            alpha?: string | undefined;
        };
        set(newValue: string): void;
    };
    convertedValue(): string | {
        string: string;
        red: string;
        green: string;
        blue: string;
        alpha?: string;
    };
    selectorPositionX(): string;
    selectorPositionY(): string;
    selectorStyles(): {
        backgroundColor: string;
        top: string;
        left: string;
    };
    componentClasses(): {
        "mt-colorpicker": boolean;
        "mt-colorpicker--compact": boolean;
    };
}, {
    debounceEmitColorValue: (...args: any[]) => void;
    outsideClick(e: Event): void;
    setOutsideClickEvent(): void;
    removeOutsideClickEvent(): void;
    toggleColorPicker(): void;
    applyColor(): void;
    moveSelector(event: MouseEvent): void;
    keyMoveSelector(event: KeyboardEvent): void;
    setDragging(event: MouseEvent): void;
    removeDragging(): void;
    setSingleRGBValue(newColorValue: number, type: "red" | "green" | "blue"): void;
    setHslaValues(hue: number, saturation: number, luminance: number, alpha?: number): void;
    splitRGBValues(rgbString: string): {
        red: number;
        green: number;
        blue: number;
        alpha?: number;
    };
    splitHSLValues(hslString: string): {
        hue: number;
        saturation: number;
        luminance: number;
        alpha?: number;
    };
    convertHSLtoRGB(previousHue: number, previousSaturation: number, previousLuminance: number, previousAlpha: number): string | {
        string: string;
        red: string;
        green: string;
        blue: string;
        alpha?: string;
    };
    convertHSLtoHEX(previousHue: number, previousSaturation: number, previousLuminance: number, previousAlpha?: number): string | {
        string: string;
        red: string;
        green: string;
        blue: string;
        alpha?: string | undefined;
    };
    convertHSL(mode: "hex" | "rgb", color: {
        hue: number;
        saturation: number;
        luminance: number;
        alpha?: number | string;
    }): {
        string: string;
        red: string;
        green: string;
        blue: string;
        alpha?: string;
    } | string;
    convertRGBtoHSL(previousRed: number, previousGreen: number, previousBlue: number): {
        string: string;
        hue: number;
        saturation: number;
        luminance: number;
    };
    convertHEXtoHSL(previousHex: string): false | {
        string: string;
        hue: number;
        saturation: number;
        luminance: number;
        alpha?: number;
    };
    onClickInput(): void;
    setFocusClass(): void;
    removeFocusClass(): void;
    adjustHueStepSize(event: KeyboardEvent): void;
    adjustAlphaStepSize(event: KeyboardEvent): void;
}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("inheritance-remove" | "inheritance-restore" | "update:modelValue")[], "inheritance-remove" | "inheritance-restore" | "update:modelValue", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
    /**
     * The value of the colorpicker field.
     */
    modelValue: {
        type: PropType<string | null>;
        required: false;
        default: string;
    };
    /**
     * A label for your text field. Usually used to guide the user what value this field controls.
     */
    label: {
        type: StringConstructor;
        required: false;
        default: null;
    };
    /**
     * A text that helps the user to understand what this field does.
     */
    helpText: {
        type: StringConstructor;
        required: false;
        default: null;
    };
    /**
     * Change the output value which gets emitted and shown in the field.
     * @values auto, hex, hsl, rgb
     */
    colorOutput: {
        type: PropType<"auto" | "hex" | "hsl" | "rgb">;
        required: false;
        default: string;
    };
    /**
     * If activated then the color value can contain alpha values
     */
    alpha: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Determines if the field is disabled.
     */
    disabled: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Determines if the field is required.
     */
    required: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    placeholder: {
        type: StringConstructor;
        required: false;
    };
    /**
     * Toggles the inheritance visualization.
     */
    isInherited: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Determines if the field is inheritable.
     */
    isInheritanceField: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Determines the active state of the inheritance toggle.
     */
    disableInheritanceToggle: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Determines if the field can be edited
     */
    readonly: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Toggle the labels above each field inside the colorpicker
     */
    colorLabels: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    zIndex: {
        type: PropType<number | null>;
        required: false;
        default: null;
    };
    /**
     * An error in your business logic related to this field.
     *
     * @example {"code": 500, "detail": "Error while saving"}
     */
    error: {
        type: ObjectConstructor;
        required: false;
        default: null;
    };
    /**
     * @ignore
     */
    name: {
        type: StringConstructor;
        required: false;
        default: null;
    };
    /**
     * Show the colorpicker in a compact mode
     */
    compact: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
    /**
     * Use apply-mode to apply the color value on button click
     */
    applyMode: {
        type: BooleanConstructor;
        required: false;
        default: boolean;
    };
}>> & Readonly<{
    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
    "onInheritance-remove"?: ((...args: any[]) => any) | undefined;
    "onInheritance-restore"?: ((...args: any[]) => any) | undefined;
}>, {
    name: string;
    required: boolean;
    label: string;
    disabled: boolean;
    isInherited: boolean;
    error: Record<string, any>;
    modelValue: string | null;
    readonly: boolean;
    helpText: string;
    zIndex: number | null;
    isInheritanceField: boolean;
    disableInheritanceToggle: boolean;
    colorOutput: "auto" | "hex" | "hsl" | "rgb";
    alpha: boolean;
    colorLabels: boolean;
    compact: boolean;
    applyMode: boolean;
}, {}, {
    "mt-base-field": import('vue').DefineComponent<import('vue').ExtractPropTypes<{
        disabled: {
            type: BooleanConstructor;
            required: false;
            default: boolean;
        };
        required: {
            type: BooleanConstructor;
            required: false;
            default: boolean;
        };
        isInherited: {
            type: BooleanConstructor;
            required: false;
            default: boolean;
        };
        isInheritanceField: {
            type: BooleanConstructor;
            required: false;
            default: boolean;
        };
        disableInheritanceToggle: {
            type: BooleanConstructor;
            required: false;
            default: boolean;
        };
        copyable: {
            type: BooleanConstructor;
            required: false;
            default: boolean;
        };
        copyableTooltip: {
            type: BooleanConstructor;
            required: false;
            default: boolean;
        };
        hasFocus: {
            type: BooleanConstructor;
            required: true;
        };
        helpText: {
            type: StringConstructor;
            required: false;
            default: string;
        };
        copyableText: {
            type: StringConstructor;
            required: false;
            default: string;
        };
        size: {
            type: StringConstructor;
            required: false;
            default: string;
            validator(value: string): boolean;
        };
        name: {
            type: StringConstructor;
            required: false;
            default: null;
        };
    }>, {
        hasSlotContent: (slot: import('vue').Slot | undefined | null, props?: any) => boolean;
        future: {
            removeCardWidth: boolean;
            removeDefaultMargin: boolean;
        };
    }, {
        id: string | undefined;
    }, {
        identification(): string;
        showLabel(): boolean;
        mtFieldLabelClasses(): {
            "is--required": boolean;
        };
        mtBlockSize(): string;
        hasError(): boolean;
    }, {}, import('vue').DefineComponent<import('vue').ExtractPropTypes<{
        validation: {
            type: (BooleanConstructor | ObjectConstructor | StringConstructor | ArrayConstructor)[];
            required: false;
            default: null;
        };
    }>, {}, {}, {
        isValid(): boolean;
    }, {
        validate(value: unknown): boolean;
        validateRule(value: unknown, rule: string): boolean;
    }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
        validation: {
            type: (BooleanConstructor | ObjectConstructor | StringConstructor | ArrayConstructor)[];
            required: false;
            default: null;
        };
    }>> & Readonly<{}>, {
        validation: string | boolean | Record<string, any> | unknown[];
    }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any> | import('vue').DefineComponent<import('vue').ExtractPropTypes<{
        mapInheritance: {
            type: ObjectConstructor;
            required: false;
            default: null;
        };
        name: {
            type: StringConstructor;
            required: false;
            default: null;
        };
    }>, {}, {}, {
        formFieldName(): string | undefined;
    }, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
        mapInheritance: {
            type: ObjectConstructor;
            required: false;
            default: null;
        };
        name: {
            type: StringConstructor;
            required: false;
            default: null;
        };
    }>> & Readonly<{}>, {
        name: string;
        mapInheritance: Record<string, any>;
    }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
        disabled: {
            type: BooleanConstructor;
            required: false;
            default: boolean;
        };
        required: {
            type: BooleanConstructor;
            required: false;
            default: boolean;
        };
        isInherited: {
            type: BooleanConstructor;
            required: false;
            default: boolean;
        };
        isInheritanceField: {
            type: BooleanConstructor;
            required: false;
            default: boolean;
        };
        disableInheritanceToggle: {
            type: BooleanConstructor;
            required: false;
            default: boolean;
        };
        copyable: {
            type: BooleanConstructor;
            required: false;
            default: boolean;
        };
        copyableTooltip: {
            type: BooleanConstructor;
            required: false;
            default: boolean;
        };
        hasFocus: {
            type: BooleanConstructor;
            required: true;
        };
        helpText: {
            type: StringConstructor;
            required: false;
            default: string;
        };
        copyableText: {
            type: StringConstructor;
            required: false;
            default: string;
        };
        size: {
            type: StringConstructor;
            required: false;
            default: string;
            validator(value: string): boolean;
        };
        name: {
            type: StringConstructor;
            required: false;
            default: null;
        };
    }>> & Readonly<{}>, {
        name: string;
        size: string;
        required: boolean;
        disabled: boolean;
        isInherited: boolean;
        helpText: string;
        copyableText: string;
        isInheritanceField: boolean;
        disableInheritanceToggle: boolean;
        copyable: boolean;
        copyableTooltip: boolean;
    }, {}, {
        "mt-inheritance-switch": import('vue').DefineComponent<{
            isInherited: boolean;
            disabled?: boolean;
        }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
            inheritanceRemove: () => any;
            inheritanceRestore: () => any;
        }, string, import('vue').PublicProps, Readonly<{
            isInherited: boolean;
            disabled?: boolean;
        }> & Readonly<{
            onInheritanceRemove?: (() => any) | undefined;
            onInheritanceRestore?: (() => any) | undefined;
        }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
        "mt-help-text": import('vue').DefineComponent<{
            text: string;
            width?: number;
            showDelay?: number;
            hideDelay?: number;
            placement?: import('@floating-ui/utils').Placement;
        }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{
            text: string;
            width?: number;
            showDelay?: number;
            hideDelay?: number;
            placement?: import('@floating-ui/utils').Placement;
        }> & Readonly<{}>, {
            showDelay: number;
            hideDelay: number;
        }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
        "mt-field-copyable": import('vue').DefineComponent<import('vue').ExtractPropTypes<{
            copyableText: {
                type: StringConstructor;
                required: false;
                default: null;
            };
            tooltip: {
                type: BooleanConstructor;
                required: false;
                default: boolean;
            };
        }>, {
            copyToClipboard: () => void;
            tooltipText: import('vue').ComputedRef<string>;
            wasCopied: import('vue').Ref<boolean, boolean>;
        }, {}, {}, {}, import('vue').DefineComponent<{}, {}, {}, {}, {
            createNotification(): void;
            createNotificationSuccess(config: any): void;
            createNotificationInfo(config: any): void;
            createNotificationWarning(config: any): void;
            createNotificationError(config: any): void;
            createSystemNotificationSuccess(config: any): void;
            createSystemNotificationInfo(config: any): void;
            createSystemNotificationWarning(config: any): void;
            createSystemNotificationError(config: any): void;
            createSystemNotification(config: any): void;
        }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
            copyableText: {
                type: StringConstructor;
                required: false;
                default: null;
            };
            tooltip: {
                type: BooleanConstructor;
                required: false;
                default: boolean;
            };
        }>> & Readonly<{}>, {
            tooltip: boolean;
            copyableText: string;
        }, {}, {
            "mt-icon": import('vue').DefineComponent<{
                name: string;
                color?: string;
                decorative?: boolean;
                size?: string;
                mode?: "solid" | "regular";
            }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{
                name: string;
                color?: string;
                decorative?: boolean;
                size?: string;
                mode?: "solid" | "regular";
            }> & Readonly<{}>, {
                color: string;
                decorative: boolean;
                size: string;
                mode: "solid" | "regular";
            }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
        }, {
            tooltip: import('vue').ObjectDirective<any, any, string, string>;
        }, string, import('vue').ComponentProvideOptions, true, {}, any>;
    }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
    "mt-text": {
        new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{
            size?: "2xs" | "xs" | "s" | "m" | "l" | "xl" | "2xl" | "3xl";
            weight?: "bold" | "semibold" | "medium" | "regular";
            color?: "color-text-primary-default" | "color-text-primary-disabled" | "color-text-primary-inverse" | "color-text-secondary-default" | "color-text-secondary-disabled" | "color-text-secondary-inverse" | "color-text-tertiary-default" | "color-text-brand-default" | "color-text-brand-hover" | "color-text-brand-pressed" | "color-text-brand-disabled" | "color-text-brand-inverse" | "color-text-critical-default" | "color-text-critical-hover" | "color-text-critical-pressed" | "color-text-critical-disabled" | "color-text-critical-dark" | "color-text-attention-default" | "color-text-positive-default" | "color-text-accent-default" | "color-text-static-default" | "color-text-inverse-default" | "color-static-white" | "color-static-black" | string;
            as?: string | import('vue').Component;
        }> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
            color: "color-text-primary-default" | "color-text-primary-disabled" | "color-text-primary-inverse" | "color-text-secondary-default" | "color-text-secondary-disabled" | "color-text-secondary-inverse" | "color-text-tertiary-default" | "color-text-brand-default" | "color-text-brand-hover" | "color-text-brand-pressed" | "color-text-brand-disabled" | "color-text-brand-inverse" | "color-text-critical-default" | "color-text-critical-hover" | "color-text-critical-pressed" | "color-text-critical-disabled" | "color-text-critical-dark" | "color-text-attention-default" | "color-text-positive-default" | "color-text-accent-default" | "color-text-static-default" | "color-text-inverse-default" | "color-static-white" | "color-static-black" | string;
            size: "2xs" | "xs" | "s" | "m" | "l" | "xl" | "2xl" | "3xl";
            weight: "bold" | "semibold" | "medium" | "regular";
            as: string | import('vue').Component;
        }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
            P: {};
            B: {};
            D: {};
            C: {};
            M: {};
            Defaults: {};
        }, Readonly<{
            size?: "2xs" | "xs" | "s" | "m" | "l" | "xl" | "2xl" | "3xl";
            weight?: "bold" | "semibold" | "medium" | "regular";
            color?: "color-text-primary-default" | "color-text-primary-disabled" | "color-text-primary-inverse" | "color-text-secondary-default" | "color-text-secondary-disabled" | "color-text-secondary-inverse" | "color-text-tertiary-default" | "color-text-brand-default" | "color-text-brand-hover" | "color-text-brand-pressed" | "color-text-brand-disabled" | "color-text-brand-inverse" | "color-text-critical-default" | "color-text-critical-hover" | "color-text-critical-pressed" | "color-text-critical-disabled" | "color-text-critical-dark" | "color-text-attention-default" | "color-text-positive-default" | "color-text-accent-default" | "color-text-static-default" | "color-text-inverse-default" | "color-static-white" | "color-static-black" | string;
            as?: string | import('vue').Component;
        }> & Readonly<{}>, {}, {}, {}, {}, {
            color: "color-text-primary-default" | "color-text-primary-disabled" | "color-text-primary-inverse" | "color-text-secondary-default" | "color-text-secondary-disabled" | "color-text-secondary-inverse" | "color-text-tertiary-default" | "color-text-brand-default" | "color-text-brand-hover" | "color-text-brand-pressed" | "color-text-brand-disabled" | "color-text-brand-inverse" | "color-text-critical-default" | "color-text-critical-hover" | "color-text-critical-pressed" | "color-text-critical-disabled" | "color-text-critical-dark" | "color-text-attention-default" | "color-text-positive-default" | "color-text-accent-default" | "color-text-static-default" | "color-text-inverse-default" | "color-static-white" | "color-static-black" | string;
            size: "2xs" | "xs" | "s" | "m" | "l" | "xl" | "2xl" | "3xl";
            weight: "bold" | "semibold" | "medium" | "regular";
            as: string | import('vue').Component;
        }>;
        __isFragment?: never;
        __isTeleport?: never;
        __isSuspense?: never;
    } & import('vue').ComponentOptionsBase<Readonly<{
        size?: "2xs" | "xs" | "s" | "m" | "l" | "xl" | "2xl" | "3xl";
        weight?: "bold" | "semibold" | "medium" | "regular";
        color?: "color-text-primary-default" | "color-text-primary-disabled" | "color-text-primary-inverse" | "color-text-secondary-default" | "color-text-secondary-disabled" | "color-text-secondary-inverse" | "color-text-tertiary-default" | "color-text-brand-default" | "color-text-brand-hover" | "color-text-brand-pressed" | "color-text-brand-disabled" | "color-text-brand-inverse" | "color-text-critical-default" | "color-text-critical-hover" | "color-text-critical-pressed" | "color-text-critical-disabled" | "color-text-critical-dark" | "color-text-attention-default" | "color-text-positive-default" | "color-text-accent-default" | "color-text-static-default" | "color-text-inverse-default" | "color-static-white" | "color-static-black" | string;
        as?: string | import('vue').Component;
    }> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
        color: "color-text-primary-default" | "color-text-primary-disabled" | "color-text-primary-inverse" | "color-text-secondary-default" | "color-text-secondary-disabled" | "color-text-secondary-inverse" | "color-text-tertiary-default" | "color-text-brand-default" | "color-text-brand-hover" | "color-text-brand-pressed" | "color-text-brand-disabled" | "color-text-brand-inverse" | "color-text-critical-default" | "color-text-critical-hover" | "color-text-critical-pressed" | "color-text-critical-disabled" | "color-text-critical-dark" | "color-text-attention-default" | "color-text-positive-default" | "color-text-accent-default" | "color-text-static-default" | "color-text-inverse-default" | "color-static-white" | "color-static-black" | string;
        size: "2xs" | "xs" | "s" | "m" | "l" | "xl" | "2xl" | "3xl";
        weight: "bold" | "semibold" | "medium" | "regular";
        as: string | import('vue').Component;
    }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
        $slots: {
            default?(_: {}): any;
        };
    });
    "mt-floating-ui": {
        new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('../../_internal/mt-floating-ui/mt-floating-ui').MtFloatingUiProps> & Readonly<{
            onClose?: (() => any) | undefined;
        }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
            close: () => any;
        }, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
            floatingUi: HTMLDivElement;
            floatingUiTrigger: HTMLDivElement;
            floatingUiContent: HTMLDivElement;
            floatingUiArrow: HTMLDivElement;
        }, HTMLDivElement, import('vue').ComponentProvideOptions, {
            P: {};
            B: {};
            D: {};
            C: {};
            M: {};
            Defaults: {};
        }, Readonly<import('../../_internal/mt-floating-ui/mt-floating-ui').MtFloatingUiProps> & Readonly<{
            onClose?: (() => any) | undefined;
        }>, {}, {}, {}, {}, {}>;
        __isFragment?: never;
        __isTeleport?: never;
        __isSuspense?: never;
    } & import('vue').ComponentOptionsBase<Readonly<import('../../_internal/mt-floating-ui/mt-floating-ui').MtFloatingUiProps> & Readonly<{
        onClose?: (() => any) | undefined;
    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
        close: () => any;
    }, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
        $slots: {
            trigger?(_: {}): any;
            default?(_: {
                referenceElementWidth: number;
                referenceElementHeight: number;
            }): any;
        };
    });
    "mt-button": {
        new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{
            is?: import('vue').Component | string;
            disabled?: boolean;
            variant?: "primary" | "secondary" | "tertiary" | "critical" | "action";
            ghost?: boolean;
            size?: "x-small" | "small" | "default" | "large";
            square?: boolean;
            block?: boolean;
            link?: string;
            isLoading?: boolean;
        }> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
            size: "x-small" | "small" | "default" | "large";
            link: string;
            variant: "primary" | "secondary" | "tertiary" | "critical" | "action";
            is: import('vue').Component | string;
        }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
            P: {};
            B: {};
            D: {};
            C: {};
            M: {};
            Defaults: {};
        }, Readonly<{
            is?: import('vue').Component | string;
            disabled?: boolean;
            variant?: "primary" | "secondary" | "tertiary" | "critical" | "action";
            ghost?: boolean;
            size?: "x-small" | "small" | "default" | "large";
            square?: boolean;
            block?: boolean;
            link?: string;
            isLoading?: boolean;
        }> & Readonly<{}>, {}, {}, {}, {}, {
            size: "x-small" | "small" | "default" | "large";
            link: string;
            variant: "primary" | "secondary" | "tertiary" | "critical" | "action";
            is: import('vue').Component | string;
        }>;
        __isFragment?: never;
        __isTeleport?: never;
        __isSuspense?: never;
    } & import('vue').ComponentOptionsBase<Readonly<{
        is?: import('vue').Component | string;
        disabled?: boolean;
        variant?: "primary" | "secondary" | "tertiary" | "critical" | "action";
        ghost?: boolean;
        size?: "x-small" | "small" | "default" | "large";
        square?: boolean;
        block?: boolean;
        link?: string;
        isLoading?: boolean;
    }> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
        size: "x-small" | "small" | "default" | "large";
        link: string;
        variant: "primary" | "secondary" | "tertiary" | "critical" | "action";
        is: import('vue').Component | string;
    }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
        $slots: Readonly<{
            default: null;
            iconFront: {
                size: number;
            };
            iconBack: {
                size: number;
            };
        }> & {
            default: null;
            iconFront: {
                size: number;
            };
            iconBack: {
                size: number;
            };
        };
    });
    "mt-field-error": import('vue').DefineComponent<{
        error?: Record<string, any> | null;
    }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{
        error?: Record<string, any> | null;
    }> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
export default _default;