element-plus
Version:
A Component Library for Vue 3
240 lines (239 loc) • 9.98 kB
TypeScript
import type { ExtractPublicPropTypes } from 'vue';
import type ColorPicker from './color-picker.vue';
import type { AriaProps, UseEmptyValuesProps } from 'element-plus/es/hooks';
import type { ComponentSize } from 'element-plus/es/constants';
import type { ElTooltipContentProps } from 'element-plus/es/components/tooltip';
export interface ColorPickerProps extends UseEmptyValuesProps, Pick<AriaProps, 'ariaLabel'> {
/**
* @description when color-picker inactive and persistent is false, the color panel will be destroyed
*/
persistent?: boolean;
/**
* @description binding value
*/
modelValue?: string | null;
/**
* @description ColorPicker id
*/
id?: string;
/**
* @description whether to display the alpha slider
*/
showAlpha?: boolean;
/**
* @description color format of v-model
*/
colorFormat?: string;
/**
* @description whether to disable the ColorPicker
*/
disabled?: boolean;
/**
* @description whether to show clear button
*/
clearable?: boolean;
/**
* @description size of ColorPicker
*/
size?: ComponentSize;
/**
* @description custom class name for ColorPicker's dropdown
*/
popperClass?: ElTooltipContentProps['popperClass'];
/**
* @description custom style for ColorPicker's dropdown
*/
popperStyle?: ElTooltipContentProps['popperStyle'];
/**
* @description ColorPicker tabindex
*/
tabindex?: string | number;
/**
* @description whether color-picker popper is teleported to the body
*/
teleported?: ElTooltipContentProps['teleported'];
/**
* @description which color-picker panel appends to
*/
appendTo?: ElTooltipContentProps['appendTo'];
/**
* @description predefined color options
*/
predefine?: string[];
/**
* @description whether to trigger form validation
*/
validateEvent?: boolean;
}
/**
* @deprecated Removed after 3.0.0, Use `ColorPickerProps` instead.
*/
export declare const colorPickerProps: {
readonly ariaLabel: StringConstructor;
readonly emptyValues: ArrayConstructor;
readonly valueOnClear: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string | number | boolean | Function) | (() => string | number | boolean | Function | null) | ((new (...args: any[]) => string | number | boolean | Function) | (() => string | number | boolean | Function | null))[], unknown, unknown, undefined, boolean>;
readonly persistent: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly modelValue: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string) | (() => string | null) | ((new (...args: any[]) => string) | (() => string | null))[], unknown, unknown, undefined, boolean>;
readonly id: StringConstructor;
readonly showAlpha: BooleanConstructor;
readonly colorFormat: StringConstructor;
readonly disabled: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
readonly clearable: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "small" | "default" | "large", never>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly popperClass: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | ((new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly popperStyle: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | false | import("vue").CSSProperties | import("vue").StyleValue[]) | (() => import("vue").StyleValue) | ((new (...args: any[]) => string | false | import("vue").CSSProperties | import("vue").StyleValue[]) | (() => import("vue").StyleValue))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly tabindex: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, 0, boolean>;
readonly teleported: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly appendTo: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>) | ((new (...args: any[]) => string | HTMLElement) | (() => import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly predefine: {
readonly type: import("vue").PropType<string[]>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly validateEvent: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
};
export declare const colorPickerEmits: {
"update:modelValue": (val: string | null) => boolean;
change: (val: string | null) => boolean;
activeChange: (val: string | null) => boolean;
focus: (evt: FocusEvent) => boolean;
blur: (evt: FocusEvent) => boolean;
clear: () => boolean;
};
/**
* @deprecated Removed after 3.0.0, Use `ColorPickerProps` instead.
*/
export type ColorPickerPropsPublic = ExtractPublicPropTypes<typeof colorPickerProps>;
export type ColorPickerEmits = typeof colorPickerEmits;
export type ColorPickerInstance = InstanceType<typeof ColorPicker> & unknown;
/**
* @description default values for ColorPickerProps, used in components that extend ColorPickerProps
*/
export declare const colorPickerPropsDefaults: {
readonly persistent: true;
readonly modelValue: undefined;
readonly disabled: undefined;
readonly clearable: true;
readonly popperStyle: undefined;
readonly tabindex: 0;
readonly teleported: true;
readonly validateEvent: true;
readonly valueOnClear: undefined;
};