/// <reference types="tinycolor2" />
import { Color, GradientColorPoint } from '../utils';
import { TdColorPickerProps, ColorPickerChangeTrigger } from '../type';
import { TdColorModes } from '../interfaces';
declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
    baseClassName: import("@vue/composition-api").ComputedRef<string>;
    statusClassNames: {
        loading: string;
        loadMore: string;
        disabled: string;
        focused: string;
        success: string;
        error: string;
        warning: string;
        selected: string;
        active: string;
        checked: string;
        current: string;
        hidden: string;
        visible: string;
        expanded: string;
        indeterminate: string;
    };
    t: <T>(pattern: T, ...args: any[]) => any;
    global: import("@vue/composition-api").ComputedRef<{} & import("../..").ColorPickerConfig>;
    color: import("@vue/composition-api").Ref<{
        states: {
            s: number;
            v: number;
            h: number;
            a: number;
        };
        originColor: string;
        isGradient: boolean;
        gradientStates: {
            colors: {
                id?: string;
                color?: string;
                left?: number;
            }[];
            degree: number;
            selectedId: string;
            css?: string;
        };
        update: (input: string) => void;
        saturation: number;
        value: number;
        hue: number;
        alpha: number;
        readonly rgb: string;
        readonly rgba: string;
        readonly hsv: string;
        readonly hsva: string;
        readonly hsl: string;
        readonly hsla: string;
        readonly hex: string;
        readonly hex8: string;
        readonly cmyk: string;
        readonly css: string;
        readonly linearGradient: string;
        gradientColors: {
            id?: string;
            color?: string;
            left?: number;
        }[];
        gradientSelectedId: string;
        gradientDegree: number;
        readonly gradientSelectedPoint: {
            id?: string;
            color?: string;
            left?: number;
        };
        getFormatsColorMap: () => {
            HEX: string;
            CMYK: string;
            RGB: string;
            RGBA: string;
            HSL: string;
            HSLA: string;
            HSV: string;
            HSVA: string;
            CSS: string;
            HEX8: string;
        };
        updateCurrentGradientColor: () => false | Color;
        updateStates: (input: string) => void;
        getRgba: () => {
            r: number;
            g: number;
            b: number;
            a: number;
        };
        getCmyk: () => {
            c: number;
            m: number;
            y: number;
            k: number;
        };
        getHsva: () => import("tinycolor2").ColorFormats.HSVA;
        getHsla: () => import("tinycolor2").ColorFormats.HSLA;
        equals: (color: string) => boolean;
    }>;
    mode: import("@vue/composition-api").Ref<TdColorModes>;
    isGradient: import("@vue/composition-api").ComputedRef<boolean>;
    formatModel: import("@vue/composition-api").Ref<"RGB" | "RGBA" | "HSL" | "HSLA" | "HSB" | "HSV" | "HSVA" | "HEX" | "CMYK" | "CSS">;
    recentlyUsedColors: import("@vue/composition-api").Ref<boolean | string[]>;
    previewColorStyle: import("@vue/composition-api").ComputedRef<string>;
    addRecentlyUsedColor: () => void;
    handleModeChange: (value: TdColorModes) => void;
    handleSatAndValueChange: ({ saturation, value }: {
        saturation: number;
        value: number;
    }) => void;
    handleHueChange: (hue: number) => void;
    handleAlphaChange: (alpha: number) => void;
    handleGradientChange: ({ key, payload, }: {
        key: 'degree' | 'selectedId' | 'colors';
        payload: number | string | GradientColorPoint[];
    }) => void;
    handleSetColor: (type: 'system' | 'used', value: string) => void;
    handleFormatModeChange: (format: TdColorPickerProps['format']) => "RGB" | "RGBA" | "HSL" | "HSLA" | "HSB" | "HSV" | "HSVA" | "HEX" | "CMYK" | "CSS";
    handleInputChange: (input: string, alpha?: number) => void;
    handleRecentlyUsedColorsChange: (colors: string[]) => void;
}> & import("@vue/composition-api").Data, {}, {}, {
    togglePopup: {
        type: FunctionConstructor;
    };
    clearable: BooleanConstructor;
    closeBtn: {
        type: import("vue").PropType<string | boolean | ((h: import("vue").CreateElement) => import("vue/types/vnode").ScopedSlotReturnValue)>;
        default: boolean;
    };
    colorModes: {
        type: import("vue").PropType<("monochrome" | "linear-gradient")[]>;
        default: () => string[];
    };
    disabled: BooleanConstructor;
    enableAlpha: BooleanConstructor;
    enableMultipleGradient: {
        type: BooleanConstructor;
        default: boolean;
    };
    format: {
        type: import("vue").PropType<"RGB" | "RGBA" | "HSL" | "HSLA" | "HSB" | "HSV" | "HSVA" | "HEX" | "CMYK" | "CSS">;
        default: "RGB" | "RGBA" | "HSL" | "HSLA" | "HSB" | "HSV" | "HSVA" | "HEX" | "CMYK" | "CSS";
        validator(val: "RGB" | "RGBA" | "HSL" | "HSLA" | "HSB" | "HSV" | "HSVA" | "HEX" | "CMYK" | "CSS"): boolean;
    };
    inputProps: {
        type: import("vue").PropType<import("../..").InputProps<import("../..").InputValue>>;
    };
    multiple: BooleanConstructor;
    popupProps: {
        type: import("vue").PropType<import("../..").TdPopupProps>;
    };
    recentColors: {
        type: import("vue").PropType<boolean | string[]>;
        default: () => boolean | string[];
    };
    defaultRecentColors: {
        type: import("vue").PropType<boolean | string[]>;
        default: () => boolean | string[];
    };
    selectInputProps: {
        type: import("vue").PropType<import("../..").TdSelectInputProps>;
    };
    showPrimaryColorPreview: {
        type: BooleanConstructor;
        default: boolean;
    };
    size: {
        type: import("vue").PropType<import("../..").SizeEnum>;
        default: import("../..").SizeEnum;
        validator(val: import("../..").SizeEnum): boolean;
    };
    swatchColors: {
        type: import("vue").PropType<string[]>;
    };
    value: {
        type: StringConstructor;
        default: string;
    };
    defaultValue: {
        type: StringConstructor;
        default: string;
    };
    onChange: import("vue").PropType<(value: string, context: {
        color: import("../type").ColorObject;
        trigger: ColorPickerChangeTrigger;
    }) => void>;
    onPaletteBarChange: import("vue").PropType<(context: {
        color: import("../type").ColorObject;
    }) => void>;
    onRecentColorsChange: import("vue").PropType<(value: string[]) => void>;
}, import("@vue/composition-api").ExtractPropTypes<{
    togglePopup: {
        type: FunctionConstructor;
    };
    clearable: BooleanConstructor;
    closeBtn: {
        type: import("vue").PropType<string | boolean | ((h: import("vue").CreateElement) => import("vue/types/vnode").ScopedSlotReturnValue)>;
        default: boolean;
    };
    colorModes: {
        type: import("vue").PropType<("monochrome" | "linear-gradient")[]>;
        default: () => string[];
    };
    disabled: BooleanConstructor;
    enableAlpha: BooleanConstructor;
    enableMultipleGradient: {
        type: BooleanConstructor;
        default: boolean;
    };
    format: {
        type: import("vue").PropType<"RGB" | "RGBA" | "HSL" | "HSLA" | "HSB" | "HSV" | "HSVA" | "HEX" | "CMYK" | "CSS">;
        default: "RGB" | "RGBA" | "HSL" | "HSLA" | "HSB" | "HSV" | "HSVA" | "HEX" | "CMYK" | "CSS";
        validator(val: "RGB" | "RGBA" | "HSL" | "HSLA" | "HSB" | "HSV" | "HSVA" | "HEX" | "CMYK" | "CSS"): boolean;
    };
    inputProps: {
        type: import("vue").PropType<import("../..").InputProps<import("../..").InputValue>>;
    };
    multiple: BooleanConstructor;
    popupProps: {
        type: import("vue").PropType<import("../..").TdPopupProps>;
    };
    recentColors: {
        type: import("vue").PropType<boolean | string[]>;
        default: () => boolean | string[];
    };
    defaultRecentColors: {
        type: import("vue").PropType<boolean | string[]>;
        default: () => boolean | string[];
    };
    selectInputProps: {
        type: import("vue").PropType<import("../..").TdSelectInputProps>;
    };
    showPrimaryColorPreview: {
        type: BooleanConstructor;
        default: boolean;
    };
    size: {
        type: import("vue").PropType<import("../..").SizeEnum>;
        default: import("../..").SizeEnum;
        validator(val: import("../..").SizeEnum): boolean;
    };
    swatchColors: {
        type: import("vue").PropType<string[]>;
    };
    value: {
        type: StringConstructor;
        default: string;
    };
    defaultValue: {
        type: StringConstructor;
        default: string;
    };
    onChange: import("vue").PropType<(value: string, context: {
        color: import("../type").ColorObject;
        trigger: ColorPickerChangeTrigger;
    }) => void>;
    onPaletteBarChange: import("vue").PropType<(context: {
        color: import("../type").ColorObject;
    }) => void>;
    onRecentColorsChange: import("vue").PropType<(value: string[]) => void>;
}>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
    value: string;
    disabled: boolean;
    multiple: boolean;
    size: import("../..").SizeEnum;
    defaultValue: string;
    format: "RGB" | "RGBA" | "HSL" | "HSLA" | "HSB" | "HSV" | "HSVA" | "HEX" | "CMYK" | "CSS";
    clearable: boolean;
    closeBtn: string | boolean | ((h: import("vue").CreateElement) => import("vue/types/vnode").ScopedSlotReturnValue);
    colorModes: ("monochrome" | "linear-gradient")[];
    recentColors: boolean | string[];
    defaultRecentColors: boolean | string[];
    enableAlpha: boolean;
    enableMultipleGradient: boolean;
    showPrimaryColorPreview: boolean;
} & {
    onChange?: (value: string, context: {
        color: import("../type").ColorObject;
        trigger: ColorPickerChangeTrigger;
    }) => void;
    inputProps?: unknown;
    popupProps?: unknown;
    selectInputProps?: unknown;
    swatchColors?: string[];
    onPaletteBarChange?: (context: {
        color: import("../type").ColorObject;
    }) => void;
    onRecentColorsChange?: (value: string[]) => void;
    togglePopup?: Function;
}, import("@vue/composition-api").ShallowUnwrapRef<{
    baseClassName: import("@vue/composition-api").ComputedRef<string>;
    statusClassNames: {
        loading: string;
        loadMore: string;
        disabled: string;
        focused: string;
        success: string;
        error: string;
        warning: string;
        selected: string;
        active: string;
        checked: string;
        current: string;
        hidden: string;
        visible: string;
        expanded: string;
        indeterminate: string;
    };
    t: <T>(pattern: T, ...args: any[]) => any;
    global: import("@vue/composition-api").ComputedRef<{} & import("../..").ColorPickerConfig>;
    color: import("@vue/composition-api").Ref<{
        states: {
            s: number;
            v: number;
            h: number;
            a: number;
        };
        originColor: string;
        isGradient: boolean;
        gradientStates: {
            colors: {
                id?: string;
                color?: string;
                left?: number;
            }[];
            degree: number;
            selectedId: string;
            css?: string;
        };
        update: (input: string) => void;
        saturation: number;
        value: number;
        hue: number;
        alpha: number;
        readonly rgb: string;
        readonly rgba: string;
        readonly hsv: string;
        readonly hsva: string;
        readonly hsl: string;
        readonly hsla: string;
        readonly hex: string;
        readonly hex8: string;
        readonly cmyk: string;
        readonly css: string;
        readonly linearGradient: string;
        gradientColors: {
            id?: string;
            color?: string;
            left?: number;
        }[];
        gradientSelectedId: string;
        gradientDegree: number;
        readonly gradientSelectedPoint: {
            id?: string;
            color?: string;
            left?: number;
        };
        getFormatsColorMap: () => {
            HEX: string;
            CMYK: string;
            RGB: string;
            RGBA: string;
            HSL: string;
            HSLA: string;
            HSV: string;
            HSVA: string;
            CSS: string;
            HEX8: string;
        };
        updateCurrentGradientColor: () => false | Color;
        updateStates: (input: string) => void;
        getRgba: () => {
            r: number;
            g: number;
            b: number;
            a: number;
        };
        getCmyk: () => {
            c: number;
            m: number;
            y: number;
            k: number;
        };
        getHsva: () => import("tinycolor2").ColorFormats.HSVA;
        getHsla: () => import("tinycolor2").ColorFormats.HSLA;
        equals: (color: string) => boolean;
    }>;
    mode: import("@vue/composition-api").Ref<TdColorModes>;
    isGradient: import("@vue/composition-api").ComputedRef<boolean>;
    formatModel: import("@vue/composition-api").Ref<"RGB" | "RGBA" | "HSL" | "HSLA" | "HSB" | "HSV" | "HSVA" | "HEX" | "CMYK" | "CSS">;
    recentlyUsedColors: import("@vue/composition-api").Ref<boolean | string[]>;
    previewColorStyle: import("@vue/composition-api").ComputedRef<string>;
    addRecentlyUsedColor: () => void;
    handleModeChange: (value: TdColorModes) => void;
    handleSatAndValueChange: ({ saturation, value }: {
        saturation: number;
        value: number;
    }) => void;
    handleHueChange: (hue: number) => void;
    handleAlphaChange: (alpha: number) => void;
    handleGradientChange: ({ key, payload, }: {
        key: 'degree' | 'selectedId' | 'colors';
        payload: number | string | GradientColorPoint[];
    }) => void;
    handleSetColor: (type: 'system' | 'used', value: string) => void;
    handleFormatModeChange: (format: TdColorPickerProps['format']) => "RGB" | "RGBA" | "HSL" | "HSLA" | "HSB" | "HSV" | "HSVA" | "HEX" | "CMYK" | "CSS";
    handleInputChange: (input: string, alpha?: number) => void;
    handleRecentlyUsedColorsChange: (colors: string[]) => void;
}>, import("@vue/composition-api").Data, {}, {}, {}, {}, {}, {
    value: string;
    disabled: boolean;
    multiple: boolean;
    size: import("../..").SizeEnum;
    defaultValue: string;
    format: "RGB" | "RGBA" | "HSL" | "HSLA" | "HSB" | "HSV" | "HSVA" | "HEX" | "CMYK" | "CSS";
    clearable: boolean;
    closeBtn: string | boolean | ((h: import("vue").CreateElement) => import("vue/types/vnode").ScopedSlotReturnValue);
    colorModes: ("monochrome" | "linear-gradient")[];
    recentColors: boolean | string[];
    defaultRecentColors: boolean | string[];
    enableAlpha: boolean;
    enableMultipleGradient: boolean;
    showPrimaryColorPreview: boolean;
} & {
    onChange?: (value: string, context: {
        color: import("../type").ColorObject;
        trigger: ColorPickerChangeTrigger;
    }) => void;
    inputProps?: unknown;
    popupProps?: unknown;
    selectInputProps?: unknown;
    swatchColors?: string[];
    onPaletteBarChange?: (context: {
        color: import("../type").ColorObject;
    }) => void;
    onRecentColorsChange?: (value: string[]) => void;
    togglePopup?: Function;
}, {
    value: string;
    disabled: boolean;
    multiple: boolean;
    size: import("../..").SizeEnum;
    defaultValue: string;
    format: "RGB" | "RGBA" | "HSL" | "HSLA" | "HSB" | "HSV" | "HSVA" | "HEX" | "CMYK" | "CSS";
    clearable: boolean;
    closeBtn: string | boolean | ((h: import("vue").CreateElement) => import("vue/types/vnode").ScopedSlotReturnValue);
    colorModes: ("monochrome" | "linear-gradient")[];
    recentColors: boolean | string[];
    defaultRecentColors: boolean | string[];
    enableAlpha: boolean;
    enableMultipleGradient: boolean;
    showPrimaryColorPreview: boolean;
}, true>);
export default _default;