@element-plus/nightly 0.0.20260311 → 0.0.20260313

package/es/components/carousel/src/carousel-item.vue.d.ts

@@ -13,8 +13,8 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
   name: string;
   label: string;
 }>>>, {
-  label: string | number;
   name: string;
+  label: string | number;
 }, {}>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/es/components/carousel/src/carousel.d.ts

@@ -63,11 +63,11 @@ interface CarouselProps {
 declare const carouselProps: {
   readonly initialIndex: EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
   readonly height: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
-  readonly trigger: EpPropFinalized<StringConstructor, "click" | "hover", unknown, "hover", boolean>;
+  readonly trigger: EpPropFinalized<StringConstructor, "hover" | "click", unknown, "hover", boolean>;
   readonly autoplay: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly interval: EpPropFinalized<NumberConstructor, unknown, unknown, 3000, boolean>;
   readonly indicatorPosition: EpPropFinalized<StringConstructor, "" | "none" | "outside", unknown, "", boolean>;
-  readonly arrow: EpPropFinalized<StringConstructor, "always" | "hover" | "never", unknown, "hover", boolean>;
+  readonly arrow: EpPropFinalized<StringConstructor, "always" | "never" | "hover", unknown, "hover", boolean>;
   readonly type: EpPropFinalized<StringConstructor, "" | "card", unknown, "", boolean>;
   readonly cardScale: EpPropFinalized<NumberConstructor, unknown, unknown, 0.83, boolean>;
   readonly loop: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;

package/es/components/carousel/src/carousel.vue.d.ts

@@ -42,13 +42,13 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
 }>>> & {
   onChange?: ((current: number, prev: number) => any) | undefined;
 }, {
+  initialIndex: number;
   type: "" | "card";
+  trigger: "hover" | "click";
+  loop: boolean;
   direction: "horizontal" | "vertical";
   height: string;
-  loop: boolean;
-  trigger: "hover" | "click";
   arrow: "always" | "hover" | "never";
-  initialIndex: number;
   autoplay: boolean;
   interval: number;
   indicatorPosition: "" | "none" | "outside";

package/es/components/cascader/src/cascader.d.ts

@@ -169,7 +169,7 @@ declare const cascaderProps: {
   maxCollapseTags: EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
   collapseTagsTooltip: BooleanConstructor;
   maxCollapseTagsTooltipHeight: {
-    readonly type: vue.PropType<EpPropMergeType<(StringConstructor | NumberConstructor)[], unknown, unknown>>;
+    readonly type: vue.PropType<EpPropMergeType<(NumberConstructor | StringConstructor)[], unknown, unknown>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
@@ -184,7 +184,7 @@ declare const cascaderProps: {
     new (): any;
     readonly prototype: any;
   })[], unknown, unknown, () => true, boolean>;
-  placement: EpPropFinalized<(new (...args: any[]) => "top" | "bottom" | "left" | "right" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement) | ((new (...args: any[]) => "top" | "bottom" | "left" | "right" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement))[], Placement, unknown, string, boolean>;
+  placement: EpPropFinalized<(new (...args: any[]) => "auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement) | ((new (...args: any[]) => "auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement))[], Placement, unknown, string, boolean>;
   fallbackPlacements: EpPropFinalized<(new (...args: any[]) => Placement[]) | (() => Placement[]) | ((new (...args: any[]) => Placement[]) | (() => Placement[]))[], unknown, unknown, string[], boolean>;
   popperClass: {
     readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | {
@@ -298,14 +298,14 @@ declare const cascaderProps: {
   effect: EpPropFinalized<(new (...args: any[]) => string) | (() => PopperEffect) | ((new (...args: any[]) => string) | (() => PopperEffect))[], unknown, unknown, string, boolean>;
   tagType: {
     default: string;
-    type: vue.PropType<EpPropMergeType<StringConstructor, "primary" | "success" | "warning" | "info" | "danger", unknown>>;
+    type: vue.PropType<EpPropMergeType<StringConstructor, "info" | "primary" | "success" | "warning" | "danger", unknown>>;
     required: false;
     validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
   };
   tagEffect: {
     default: string;
-    type: vue.PropType<EpPropMergeType<StringConstructor, "plain" | "dark" | "light", unknown>>;
+    type: vue.PropType<EpPropMergeType<StringConstructor, "dark" | "light" | "plain", unknown>>;
     required: false;
     validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;

package/es/components/cascader/src/cascader.vue.d.ts

@@ -58,11 +58,11 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
   focus: () => void; /** @description blur the input element */
   blur: () => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
-  clear: () => void;
+  "update:modelValue": (value: CascaderValue | null | undefined) => void;
   focus: (evt: FocusEvent) => void;
   blur: (evt: FocusEvent) => void;
+  clear: () => void;
   change: (value: CascaderValue | null | undefined) => void;
-  "update:modelValue": (value: CascaderValue | null | undefined) => void;
   visibleChange: (val: boolean) => void;
   expandChange: (val: CascaderValue) => void;
   removeTag: (val: CascaderNodeValue | CascaderNodePathValue) => void;
@@ -93,33 +93,33 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
   onFocus?: ((evt: FocusEvent) => any) | undefined;
   onBlur?: ((evt: FocusEvent) => any) | undefined;
   onChange?: ((value: CascaderValue | null | undefined) => any) | undefined;
-  onClear?: (() => any) | undefined;
   "onUpdate:modelValue"?: ((value: CascaderValue | null | undefined) => any) | undefined;
+  onClear?: (() => any) | undefined;
   onVisibleChange?: ((val: boolean) => any) | undefined;
   onExpandChange?: ((val: CascaderValue) => any) | undefined;
   onRemoveTag?: ((val: CascaderNodeValue | CascaderNodePathValue) => any) | undefined;
 }, {
+  teleported: boolean;
+  props: CascaderProps;
   disabled: boolean;
+  clearIcon: IconPropType;
+  validateEvent: boolean;
+  separator: string;
   valueOnClear: string | number | boolean | Function | null;
-  props: CascaderProps;
+  tagType: "info" | "primary" | "success" | "warning" | "danger";
+  tagEffect: "dark" | "light" | "plain";
   effect: PopperEffect;
+  maxCollapseTags: number;
   popperStyle: string | false | vue.CSSProperties | StyleValue[] | null;
   fallbackPlacements: Placement[];
   placement: Placement;
   persistent: boolean;
-  teleported: boolean;
   options: CascaderOption[];
-  separator: string;
   debounce: number;
-  clearIcon: IconPropType;
-  validateEvent: boolean;
-  showPrefix: boolean;
   filterMethod: (node: Node, keyword: string) => boolean;
+  showPrefix: boolean;
   showAllLevels: boolean;
-  maxCollapseTags: number;
   beforeFilter: (value: string) => boolean | Promise<any>;
-  tagType: "primary" | "success" | "warning" | "info" | "danger";
-  tagEffect: "plain" | "dark" | "light";
   showCheckedStrategy: "parent" | "child";
 }, {}>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/es/components/cascader-panel/src/index.vue.d.ts

@@ -153,8 +153,8 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
   loadLazyRootNodes: () => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
   close: () => void;
-  change: (value: CascaderValue | null | undefined) => void;
   "update:modelValue": (value: CascaderValue | null | undefined) => void;
+  change: (value: CascaderValue | null | undefined) => void;
   "expand-change": (value: CascaderNodePathValue) => void;
 }, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<CascaderPanelProps>, {
   options: () => CascaderOption[];

package/es/components/check-tag/src/check-tag.d.ts

@@ -24,7 +24,7 @@ interface CheckTagProps {
 declare const checkTagProps: {
   readonly checked: BooleanConstructor;
   readonly disabled: BooleanConstructor;
-  readonly type: EpPropFinalized<StringConstructor, "primary" | "success" | "warning" | "info" | "danger", unknown, "primary", boolean>;
+  readonly type: EpPropFinalized<StringConstructor, "info" | "primary" | "success" | "warning" | "danger", unknown, "primary", boolean>;
 };
 /**
  * @deprecated Removed after 3.0.0, Use `CheckTagProps` instead.

package/es/components/checkbox/src/checkbox-button.vue.d.ts

@@ -19,8 +19,8 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
   readonly id: undefined;
   readonly validateEvent: true;
 }>, unknown, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
-  change: (val: CheckboxValueType) => void;
   "update:modelValue": (val: CheckboxValueType) => void;
+  change: (val: CheckboxValueType) => void;
 }, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<CheckboxProps>, {
   readonly modelValue: undefined;
   readonly label: undefined;
@@ -37,13 +37,13 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
   onChange?: ((val: CheckboxValueType) => any) | undefined;
   "onUpdate:modelValue"?: ((val: CheckboxValueType) => any) | undefined;
 }, {
-  disabled: boolean;
   id: string;
-  label: string | boolean | number | object;
-  name: string;
-  value: string | boolean | number | object;
+  disabled: boolean;
   modelValue: number | string | boolean;
   validateEvent: boolean;
+  name: string;
+  value: string | boolean | number | object;
+  label: string | boolean | number | object;
   trueValue: string | number;
   falseValue: string | number;
   trueLabel: string | number;

package/es/components/checkbox/src/checkbox-group.vue.d.ts

@@ -20,8 +20,8 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
   }>;
   type: string;
 }>, unknown, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
-  change: (val: CheckboxValueType[]) => void;
   "update:modelValue": (val: CheckboxGroupValueType) => void;
+  change: (val: CheckboxValueType[]) => void;
 }, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<CheckboxGroupProps>, {
   modelValue: () => never[];
   disabled: undefined;
@@ -37,16 +37,16 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
   onChange?: ((val: CheckboxValueType[]) => any) | undefined;
   "onUpdate:modelValue"?: ((val: CheckboxGroupValueType) => any) | undefined;
 }, {
-  disabled: boolean;
-  type: "checkbox" | "button";
-  tag: string;
   props: {
     value?: string;
     label?: string;
     disabled?: string;
   };
+  type: "checkbox" | "button";
+  disabled: boolean;
   modelValue: CheckboxGroupValueType;
   validateEvent: boolean;
+  tag: string;
 }, {}>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/es/components/checkbox/src/checkbox.d.ts

@@ -86,21 +86,21 @@ declare const checkboxProps: {
    * @description binding value
    */
   modelValue: {
-    type: (BooleanConstructor | StringConstructor | NumberConstructor)[];
+    type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
     default: undefined;
   };
   /**
    * @description label of the Checkbox when used inside a `checkbox-group`
    */
   label: {
-    type: (BooleanConstructor | ObjectConstructor | StringConstructor | NumberConstructor)[];
+    type: (BooleanConstructor | ObjectConstructor | NumberConstructor | StringConstructor)[];
     default: undefined;
   };
   /**
    * @description value of the Checkbox when used inside a `checkbox-group`
    */
   value: {
-    type: (BooleanConstructor | ObjectConstructor | StringConstructor | NumberConstructor)[];
+    type: (BooleanConstructor | ObjectConstructor | NumberConstructor | StringConstructor)[];
     default: undefined;
   };
   /**
@@ -129,14 +129,14 @@ declare const checkboxProps: {
    * @description value of the Checkbox if it's checked
    */
   trueValue: {
-    type: (StringConstructor | NumberConstructor)[];
+    type: (NumberConstructor | StringConstructor)[];
     default: undefined;
   };
   /**
    * @description value of the Checkbox if it's not checked
    */
   falseValue: {
-    type: (StringConstructor | NumberConstructor)[];
+    type: (NumberConstructor | StringConstructor)[];
     default: undefined;
   };
   /**
@@ -144,7 +144,7 @@ declare const checkboxProps: {
    * @description value of the Checkbox if it's checked
    */
   trueLabel: {
-    type: (StringConstructor | NumberConstructor)[];
+    type: (NumberConstructor | StringConstructor)[];
     default: undefined;
   };
   /**
@@ -152,7 +152,7 @@ declare const checkboxProps: {
    * @description value of the Checkbox if it's not checked
    */
   falseLabel: {
-    type: (StringConstructor | NumberConstructor)[];
+    type: (NumberConstructor | StringConstructor)[];
     default: undefined;
   };
   /**
@@ -178,7 +178,7 @@ declare const checkboxProps: {
   /**
    * @description input tabindex
    */
-  tabindex: (StringConstructor | NumberConstructor)[];
+  tabindex: (NumberConstructor | StringConstructor)[];
   /**
    * @description whether to trigger form validation
    */

package/es/components/checkbox/src/checkbox.vue.d.ts

@@ -19,8 +19,8 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
   readonly id: undefined;
   readonly validateEvent: true;
 }>, unknown, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
-  change: (val: CheckboxValueType) => void;
   "update:modelValue": (val: CheckboxValueType) => void;
+  change: (val: CheckboxValueType) => void;
 }, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<CheckboxProps>, {
   readonly modelValue: undefined;
   readonly label: undefined;
@@ -37,13 +37,13 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
   onChange?: ((val: CheckboxValueType) => any) | undefined;
   "onUpdate:modelValue"?: ((val: CheckboxValueType) => any) | undefined;
 }, {
-  disabled: boolean;
   id: string;
-  label: string | boolean | number | object;
-  name: string;
-  value: string | boolean | number | object;
+  disabled: boolean;
   modelValue: number | string | boolean;
   validateEvent: boolean;
+  name: string;
+  value: string | boolean | number | object;
+  label: string | boolean | number | object;
   trueValue: string | number;
   falseValue: string | number;
   trueLabel: string | number;

package/es/components/col/src/col.vue.d.ts

@@ -29,10 +29,10 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
   lg: () => {};
   xl: () => {};
 }>>>, {
-  tag: string;
   push: number;
-  span: number;
   offset: number;
+  span: number;
+  tag: string;
   pull: number;
   xs: ColSize;
   sm: ColSize;

package/es/components/collapse/src/collapse.vue.d.ts

@@ -13,8 +13,8 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
   /** @description active names */activeNames: vue.Ref<(string | number)[]>; /** @description set active names */
   setActiveNames: (_activeNames: CollapseActiveName[]) => void;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
-  change: (value: CollapseModelValue) => void;
   "update:modelValue": (value: CollapseModelValue) => void;
+  change: (value: CollapseModelValue) => void;
 }, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<CollapseProps>, {
   modelValue: () => never[];
   expandIconPosition: string;

package/es/components/color-picker/src/color-picker.vue.d.ts

@@ -39,11 +39,11 @@ declare const __VLS_export: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypePro
    */
   blur: typeof blur;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
-  clear: () => void;
+  "update:modelValue": (val: string | null) => void;
   focus: (evt: FocusEvent) => void;
   blur: (evt: FocusEvent) => void;
+  clear: () => void;
   change: (val: string | null) => void;
-  "update:modelValue": (val: string | null) => void;
   activeChange: (val: string | null) => void;
 }, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<ColorPickerProps>, {
   readonly persistent: true;
@@ -59,19 +59,19 @@ declare const __VLS_export: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypePro
   onFocus?: ((evt: FocusEvent) => any) | undefined;
   onBlur?: ((evt: FocusEvent) => any) | undefined;
   onChange?: ((val: string | null) => any) | undefined;
-  onClear?: (() => any) | undefined;
   "onUpdate:modelValue"?: ((val: string | null) => any) | undefined;
+  onClear?: (() => any) | undefined;
   onActiveChange?: ((val: string | null) => any) | undefined;
 }, {
-  disabled: boolean;
-  valueOnClear: string | number | boolean | Function | null;
-  tabindex: string | number;
-  popperStyle: string | false | vue.CSSProperties | vue.StyleValue[] | null;
-  persistent: boolean;
   teleported: boolean;
+  disabled: boolean;
   modelValue: string | null;
   clearable: boolean;
+  tabindex: string | number;
   validateEvent: boolean;
+  valueOnClear: string | number | boolean | Function | null;
+  popperStyle: string | false | vue.CSSProperties | vue.StyleValue[] | null;
+  persistent: boolean;
 }, {}>;
 declare const _default: typeof __VLS_export;
 type __VLS_TypePropsToOption<T> = { [K in keyof T]-?: {} extends Pick<T, K> ? {

package/es/components/color-picker-panel/src/color-picker-panel.d.ts

@@ -3,10 +3,12 @@ import "../../../utils/index.js";
 import { Color } from "./utils/color.js";
 import { _default } from "./color-picker-panel.vue.js";
 import * as vue from "vue";
-import { ComputedRef, ExtractPublicPropTypes, InjectionKey } from "vue";
+import { ComputedRef, ExtractPublicPropTypes, InjectionKey, StyleValue } from "vue";
 import { ColorFormats } from "@ctrl/tinycolor";
 
 //#region ../../packages/components/color-picker-panel/src/color-picker-panel.d.ts
+type ClassObjectType = Record<string, boolean>;
+type ClassType = string | ClassObjectType | ClassType[];
 interface ColorPickerPanelProps {
   /**
    * @description binding value
@@ -36,6 +38,14 @@ interface ColorPickerPanelProps {
    * @description whether to trigger form validation
    */
   validateEvent?: boolean;
+  /**
+   * @description class names will be passed to hue-slider
+   */
+  hueSliderClass?: ClassType;
+  /**
+   * @description styles will be passed to hue-slider
+   */
+  hueSliderStyle?: StyleValue;
 }
 /**
  * @deprecated Removed after 3.0.0, Use `ColorPickerPanelProps` instead.
@@ -58,6 +68,18 @@ declare const colorPickerPanelProps: {
     __epPropKey: true;
   };
   readonly validateEvent: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+  readonly hueSliderClass: {
+    readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | ClassObjectType | ClassType[]) | (() => ClassType) | ((new (...args: any[]) => string | ClassObjectType | ClassType[]) | (() => ClassType))[], unknown, unknown>>;
+    readonly required: false;
+    readonly validator: ((val: unknown) => boolean) | undefined;
+    __epPropKey: true;
+  };
+  readonly hueSliderStyle: {
+    readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | false | vue.CSSProperties | StyleValue[]) | (() => StyleValue) | ((new (...args: any[]) => string | false | vue.CSSProperties | StyleValue[]) | (() => StyleValue))[], unknown, unknown>>;
+    readonly required: false;
+    readonly validator: ((val: unknown) => boolean) | undefined;
+    __epPropKey: true;
+  };
 };
 declare const colorPickerPanelEmits: {
   "update:modelValue": (val: string | null) => boolean;

package/es/components/color-picker-panel/src/color-picker-panel.mjs

@@ -23,7 +23,17 @@ const colorPickerPanelProps = buildProps({
 	validateEvent: {
 		type: Boolean,
 		default: true
-	}
+	},
+	hueSliderClass: { type: definePropType([
+		String,
+		Array,
+		Object
+	]) },
+	hueSliderStyle: { type: definePropType([
+		String,
+		Array,
+		Object
+	]) }
 });
 const colorPickerPanelEmits = { [UPDATE_MODEL_EVENT]: (val) => isString(val) || isNil(val) };
 const ROOT_COMMON_COLOR_INJECTION_KEY = Symbol("colorCommonPickerKey");

package/es/components/color-picker-panel/src/color-picker-panel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"color-picker-panel.mjs","names":[],"sources":["../../../../../../packages/components/color-picker-panel/src/color-picker-panel.ts"],"sourcesContent":["import { isNil } from 'lodash-unified'\nimport { buildProps, definePropType, isString } from '@element-plus/utils'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/constants'\n\nimport type { ComputedRef, ExtractPublicPropTypes, InjectionKey } from 'vue'\nimport type { ColorFormats } from '@ctrl/tinycolor'\nimport type ColorPickerPanel from './color-picker-panel.vue'\nimport type Color from './utils/color'\n\nexport interface ColorPickerPanelProps {\n  /**\n   * @description binding value\n   */\n  modelValue?: string | null\n  /**\n   * @description whether the color picker is bordered\n   */\n  border?: boolean\n  /**\n   * @description whether to display the alpha slider\n   */\n  showAlpha?: boolean\n  /**\n   * @description color format of v-model\n   */\n  colorFormat?: ColorFormats\n  /**\n   * @description whether to disable the color picker\n   */\n  disabled?: boolean\n  /**\n   * @description predefined color options\n   */\n  predefine?: string[]\n  /**\n   * @description whether to trigger form validation\n   */\n  validateEvent?: boolean\n}\n\n/**\n * @deprecated Removed after 3.0.0, Use `ColorPickerPanelProps` instead.\n */\nexport const colorPickerPanelProps = buildProps({\n  /**\n   * @description binding value\n   */\n  modelValue: {\n    type: definePropType<string | null>(String),\n    default: undefined,\n  },\n  /**\n   * @description whether the color picker is bordered\n   */\n  border: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description whether to display the alpha slider\n   */\n  showAlpha: Boolean,\n  /**\n   * @description color format of v-model\n   */\n  colorFormat: {\n    type: definePropType<ColorFormats>(String),\n  },\n  /**\n   * @description whether to disable the color picker\n   */\n  disabled: Boolean,\n  /**\n   * @description predefined color options\n   */\n  predefine: {\n    type: definePropType<string[]>(Array),\n  },\n  /**\n   * @description whether to trigger form validation\n   */\n  validateEvent: {\n    type: Boolean,\n    default: true,\n  },\n} as const)\nexport const colorPickerPanelEmits = {\n  [UPDATE_MODEL_EVENT]: (val: string | null) => isString(val) || isNil(val),\n}\n\n/**\n * @deprecated Removed after 3.0.0, Use `ColorPickerPanelProps` instead.\n */\nexport type ColorPickerPanelPropsPublic = ExtractPublicPropTypes<\n  typeof colorPickerPanelProps\n>\nexport type ColorPickerPanelEmits = typeof colorPickerPanelEmits\nexport type ColorPickerPanelInstance = InstanceType<typeof ColorPickerPanel> &\n  unknown\n\nexport interface ColorPickerPanelContext {\n  currentColor: ComputedRef<string>\n}\n\nexport interface CommonColorContext {\n  color: Color\n}\n\nexport const ROOT_COMMON_COLOR_INJECTION_KEY: InjectionKey<CommonColorContext> =\n  Symbol('colorCommonPickerKey')\nexport const colorPickerPanelContextKey: InjectionKey<ColorPickerPanelContext> =\n  Symbol('colorPickerPanelContextKey')\n"],"mappings":";;;;;;;;;AA2CA,MAAa,wBAAwB,WAAW;CAI9C,YAAY;EACV,MAAM,eAA8B,OAAO;EAC3C,SAAS;EACV;CAID,QAAQ;EACN,MAAM;EACN,SAAS;EACV;CAID,WAAW;CAIX,aAAa,EACX,MAAM,eAA6B,OAAO,EAC3C;CAID,UAAU;CAIV,WAAW,EACT,MAAM,eAAyB,MAAM,EACtC;CAID,eAAe;EACb,MAAM;EACN,SAAS;EACV;CACF,CAAU;AACX,MAAa,wBAAwB,GAClC,sBAAsB,QAAuB,SAAS,IAAI,IAAI,MAAM,IAAI,EAC1E;AAoBD,MAAa,kCACX,OAAO,uBAAuB;AAChC,MAAa,6BACX,OAAO,6BAA6B"}
+{"version":3,"file":"color-picker-panel.mjs","names":[],"sources":["../../../../../../packages/components/color-picker-panel/src/color-picker-panel.ts"],"sourcesContent":["import { isNil } from 'lodash-unified'\nimport { buildProps, definePropType, isString } from '@element-plus/utils'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/constants'\n\nimport type {\n  ComputedRef,\n  ExtractPublicPropTypes,\n  InjectionKey,\n  StyleValue,\n} from 'vue'\nimport type { ColorFormats } from '@ctrl/tinycolor'\nimport type ColorPickerPanel from './color-picker-panel.vue'\nimport type Color from './utils/color'\n\ntype ClassObjectType = Record<string, boolean>\ntype ClassType = string | ClassObjectType | ClassType[]\n\nexport interface ColorPickerPanelProps {\n  /**\n   * @description binding value\n   */\n  modelValue?: string | null\n  /**\n   * @description whether the color picker is bordered\n   */\n  border?: boolean\n  /**\n   * @description whether to display the alpha slider\n   */\n  showAlpha?: boolean\n  /**\n   * @description color format of v-model\n   */\n  colorFormat?: ColorFormats\n  /**\n   * @description whether to disable the color picker\n   */\n  disabled?: boolean\n  /**\n   * @description predefined color options\n   */\n  predefine?: string[]\n  /**\n   * @description whether to trigger form validation\n   */\n  validateEvent?: boolean\n  /**\n   * @description class names will be passed to hue-slider\n   */\n  hueSliderClass?: ClassType\n  /**\n   * @description styles will be passed to hue-slider\n   */\n  hueSliderStyle?: StyleValue\n}\n\n/**\n * @deprecated Removed after 3.0.0, Use `ColorPickerPanelProps` instead.\n */\nexport const colorPickerPanelProps = buildProps({\n  /**\n   * @description binding value\n   */\n  modelValue: {\n    type: definePropType<string | null>(String),\n    default: undefined,\n  },\n  /**\n   * @description whether the color picker is bordered\n   */\n  border: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description whether to display the alpha slider\n   */\n  showAlpha: Boolean,\n  /**\n   * @description color format of v-model\n   */\n  colorFormat: {\n    type: definePropType<ColorFormats>(String),\n  },\n  /**\n   * @description whether to disable the color picker\n   */\n  disabled: Boolean,\n  /**\n   * @description predefined color options\n   */\n  predefine: {\n    type: definePropType<string[]>(Array),\n  },\n  /**\n   * @description whether to trigger form validation\n   */\n  validateEvent: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description class names will be passed to <hue-slider />\n   */\n  hueSliderClass: {\n    type: definePropType<ClassType>([String, Array, Object]),\n  },\n  /**\n   * @description styles will be passed to <hue-slider />\n   */\n  hueSliderStyle: {\n    type: definePropType<StyleValue>([String, Array, Object]),\n  },\n} as const)\nexport const colorPickerPanelEmits = {\n  [UPDATE_MODEL_EVENT]: (val: string | null) => isString(val) || isNil(val),\n}\n\n/**\n * @deprecated Removed after 3.0.0, Use `ColorPickerPanelProps` instead.\n */\nexport type ColorPickerPanelPropsPublic = ExtractPublicPropTypes<\n  typeof colorPickerPanelProps\n>\nexport type ColorPickerPanelEmits = typeof colorPickerPanelEmits\nexport type ColorPickerPanelInstance = InstanceType<typeof ColorPickerPanel> &\n  unknown\n\nexport interface ColorPickerPanelContext {\n  currentColor: ComputedRef<string>\n}\n\nexport interface CommonColorContext {\n  color: Color\n}\n\nexport const ROOT_COMMON_COLOR_INJECTION_KEY: InjectionKey<CommonColorContext> =\n  Symbol('colorCommonPickerKey')\nexport const colorPickerPanelContextKey: InjectionKey<ColorPickerPanelContext> =\n  Symbol('colorPickerPanelContextKey')\n"],"mappings":";;;;;;;;;AA2DA,MAAa,wBAAwB,WAAW;CAI9C,YAAY;EACV,MAAM,eAA8B,OAAO;EAC3C,SAAS;EACV;CAID,QAAQ;EACN,MAAM;EACN,SAAS;EACV;CAID,WAAW;CAIX,aAAa,EACX,MAAM,eAA6B,OAAO,EAC3C;CAID,UAAU;CAIV,WAAW,EACT,MAAM,eAAyB,MAAM,EACtC;CAID,eAAe;EACb,MAAM;EACN,SAAS;EACV;CAID,gBAAgB,EACd,MAAM,eAA0B;EAAC;EAAQ;EAAO;EAAO,CAAC,EACzD;CAID,gBAAgB,EACd,MAAM,eAA2B;EAAC;EAAQ;EAAO;EAAO,CAAC,EAC1D;CACF,CAAU;AACX,MAAa,wBAAwB,GAClC,sBAAsB,QAAuB,SAAS,IAAI,IAAI,MAAM,IAAI,EAC1E;AAoBD,MAAa,kCACX,OAAO,uBAAuB;AAChC,MAAa,6BACX,OAAO,6BAA6B"}

package/es/components/color-picker-panel/src/color-picker-panel.vue.d.ts

@@ -38,9 +38,9 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
 }>>> & {
   "onUpdate:modelValue"?: ((val: string | null) => any) | undefined;
 }, {
-  border: boolean;
   modelValue: string | null;
   validateEvent: boolean;
+  border: boolean;
   showAlpha: boolean;
 }, {}>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/es/components/color-picker-panel/src/color-picker-panel.vue_vue_type_script_setup_true_lang.mjs

@@ -10,7 +10,7 @@ import hue_slider_default from "./components/hue-slider.mjs";
 import predefine_default from "./components/predefine.mjs";
 import sv_panel_default from "./components/sv-panel.mjs";
 import { useCommonColor } from "./composables/use-common-color.mjs";
-import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, inject, nextTick, normalizeClass, onMounted, openBlock, provide, ref, renderSlot, unref, watch } from "vue";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, inject, nextTick, normalizeClass, normalizeStyle, onMounted, openBlock, provide, ref, renderSlot, unref, watch } from "vue";
 
 //#region ../../packages/components/color-picker-panel/src/color-picker-panel.vue?vue&type=script&setup=true&lang.ts
 var color_picker_panel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
@@ -72,11 +72,17 @@ var color_picker_panel_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 				createElementVNode("div", { class: normalizeClass(unref(ns).e("wrapper")) }, [createVNode(hue_slider_default, {
 					ref_key: "hueRef",
 					ref: hueRef,
-					class: "hue-slider",
 					color: unref(color),
 					vertical: "",
-					disabled: unref(disabled)
-				}, null, 8, ["color", "disabled"]), createVNode(sv_panel_default, {
+					disabled: unref(disabled),
+					class: normalizeClass(["hue-slider", __props.hueSliderClass]),
+					style: normalizeStyle(__props.hueSliderStyle)
+				}, null, 8, [
+					"color",
+					"disabled",
+					"class",
+					"style"
+				]), createVNode(sv_panel_default, {
 					ref_key: "svRef",
 					ref: svRef,
 					color: unref(color),

package/es/components/color-picker-panel/src/color-picker-panel.vue_vue_type_script_setup_true_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"color-picker-panel.vue_vue_type_script_setup_true_lang.mjs","names":[],"sources":["../../../../../../packages/components/color-picker-panel/src/color-picker-panel.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[ns.b(), ns.is('disabled', disabled), ns.is('border', border)]\"\n    @focusout=\"handleFocusout\"\n  >\n    <div :class=\"ns.e('wrapper')\">\n      <hue-slider\n        ref=\"hueRef\"\n        class=\"hue-slider\"\n        :color=\"color\"\n        vertical\n        :disabled=\"disabled\"\n      />\n      <sv-panel ref=\"svRef\" :color=\"color\" :disabled=\"disabled\" />\n    </div>\n    <alpha-slider\n      v-if=\"showAlpha\"\n      ref=\"alphaRef\"\n      :color=\"color\"\n      :disabled=\"disabled\"\n    />\n    <predefine\n      v-if=\"predefine\"\n      ref=\"predefine\"\n      :enable-alpha=\"showAlpha\"\n      :color=\"color\"\n      :colors=\"predefine\"\n      :disabled=\"disabled\"\n    />\n    <div :class=\"ns.e('footer')\">\n      <el-input\n        ref=\"inputRef\"\n        v-model=\"customInput\"\n        :validate-event=\"false\"\n        size=\"small\"\n        :disabled=\"disabled\"\n        @change=\"handleConfirm\"\n      />\n      <slot name=\"footer\" />\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, nextTick, onMounted, provide, ref, watch } from 'vue'\nimport { ElInput } from '@element-plus/components/input'\nimport { useFormDisabled, useFormItem } from '@element-plus/components/form'\nimport { useNamespace } from '@element-plus/hooks'\nimport { debugWarn } from '@element-plus/utils'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport AlphaSlider from './components/alpha-slider.vue'\nimport HueSlider from './components/hue-slider.vue'\nimport Predefine from './components/predefine.vue'\nimport SvPanel from './components/sv-panel.vue'\nimport {\n  ROOT_COMMON_COLOR_INJECTION_KEY,\n  colorPickerPanelContextKey,\n  colorPickerPanelEmits,\n} from './color-picker-panel'\nimport { useCommonColor } from './composables/use-common-color'\n\nimport type { ColorPickerPanelProps } from './color-picker-panel'\nimport type { InputInstance } from '@element-plus/components/input'\n\ndefineOptions({\n  name: 'ElColorPickerPanel',\n})\nconst props = withDefaults(defineProps<ColorPickerPanelProps>(), {\n  modelValue: undefined,\n  border: true,\n  validateEvent: true,\n  showAlpha: false,\n})\nconst emit = defineEmits(colorPickerPanelEmits)\n\nconst ns = useNamespace('color-picker-panel')\nconst { formItem } = useFormItem()\nconst disabled = useFormDisabled()\nconst hueRef = ref<InstanceType<typeof HueSlider>>()\nconst svRef = ref<InstanceType<typeof SvPanel>>()\nconst alphaRef = ref<InstanceType<typeof AlphaSlider>>()\nconst inputRef = ref<InputInstance>()\nconst customInput = ref('')\n\nconst { color } = inject(\n  ROOT_COMMON_COLOR_INJECTION_KEY,\n  () => useCommonColor(props, emit),\n  true\n)\n\nfunction handleConfirm() {\n  color.fromString(customInput.value)\n  if (color.value !== customInput.value) {\n    customInput.value = color.value\n  }\n}\n\nfunction handleFocusout() {\n  if (props.validateEvent) {\n    formItem?.validate?.('blur').catch((err) => debugWarn(err))\n  }\n}\n\nfunction update() {\n  hueRef.value?.update()\n  svRef.value?.update()\n  alphaRef.value?.update()\n}\n\nonMounted(() => {\n  if (props.modelValue) {\n    customInput.value = color.value\n  }\n  nextTick(update)\n})\n\nwatch(\n  () => props.modelValue,\n  (newVal) => {\n    if (newVal !== color.value) {\n      newVal ? color.fromString(newVal) : color.clear()\n    }\n  }\n)\n\nwatch(\n  () => color.value,\n  (val) => {\n    emit(UPDATE_MODEL_EVENT, val)\n    customInput.value = val\n    if (props.validateEvent) {\n      formItem?.validate('change').catch((err) => debugWarn(err))\n    }\n  }\n)\n\nprovide(colorPickerPanelContextKey, {\n  currentColor: computed(() => color.value),\n})\n\ndefineExpose({\n  /**\n   * @description current color object\n   */\n  color,\n  /**\n   * @description custom input ref\n   */\n  inputRef,\n  /**\n   * @description update sub components\n   */\n  update,\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;EAmEA,MAAM,QAAQ;EAMd,MAAM,OAAO;EAEb,MAAM,KAAK,aAAa,qBAAoB;EAC5C,MAAM,EAAE,aAAa,aAAY;EACjC,MAAM,WAAW,iBAAgB;EACjC,MAAM,SAAS,KAAoC;EACnD,MAAM,QAAQ,KAAkC;EAChD,MAAM,WAAW,KAAsC;EACvD,MAAM,WAAW,KAAmB;EACpC,MAAM,cAAc,IAAI,GAAE;EAE1B,MAAM,EAAE,UAAU,OAChB,uCACM,eAAe,OAAO,KAAK,EACjC,KACF;EAEA,SAAS,gBAAgB;AACvB,SAAM,WAAW,YAAY,MAAK;AAClC,OAAI,MAAM,UAAU,YAAY,MAC9B,aAAY,QAAQ,MAAM;;EAI9B,SAAS,iBAAiB;AACxB,OAAI,MAAM,cACR,WAAU,WAAW,OAAO,CAAC,OAAO,QAAQ,UAAU,IAAI,CAAA;;EAI9D,SAAS,SAAS;AAChB,UAAO,OAAO,QAAO;AACrB,SAAM,OAAO,QAAO;AACpB,YAAS,OAAO,QAAO;;AAGzB,kBAAgB;AACd,OAAI,MAAM,WACR,aAAY,QAAQ,MAAM;AAE5B,YAAS,OAAM;IAChB;AAED,cACQ,MAAM,aACX,WAAW;AACV,OAAI,WAAW,MAAM,MACnB,UAAS,MAAM,WAAW,OAAO,GAAG,MAAM,OAAM;IAGtD;AAEA,cACQ,MAAM,QACX,QAAQ;AACP,QAAK,oBAAoB,IAAG;AAC5B,eAAY,QAAQ;AACpB,OAAI,MAAM,cACR,WAAU,SAAS,SAAS,CAAC,OAAO,QAAQ,UAAU,IAAI,CAAA;IAGhE;AAEA,UAAQ,4BAA4B,EAClC,cAAc,eAAe,MAAM,MAAM,EAC1C,CAAA;AAED,WAAa;GAIX;GAIA;GAIA;GACD,CAAA;;uBAxJC,mBAuCM,OAAA;IAtCH,OAAK,eAAA;KAAG,MAAA,GAAE,CAAC,GAAC;KAAI,MAAA,GAAE,CAAC,GAAE,YAAa,MAAA,SAAQ,CAAA;KAAG,MAAA,GAAE,CAAC,GAAE,UAAW,QAAA,OAAM;KAAA,CAAA;IACnE,YAAU;;IAEX,mBASM,OAAA,EATA,OAAK,eAAE,MAAA,GAAE,CAAC,EAAC,UAAA,CAAA,KACf,YAME,oBAAA;cALI;KAAJ,KAAI;KACJ,OAAM;KACL,OAAO,MAAA,MAAK;KACb,UAAA;KACC,UAAU,MAAA,SAAA;wCAEb,YAA4D,kBAAA;cAA9C;KAAJ,KAAI;KAAS,OAAO,MAAA,MAAK;KAAG,UAAU,MAAA,SAAA;;IAG1C,QAAA,0BADR,YAKE,sBAAA;;cAHI;KAAJ,KAAI;KACH,OAAO,MAAA,MAAK;KACZ,UAAU,MAAA,SAAA;;IAGL,QAAA,0BADR,YAOE,mBAAA;;KALA,KAAI;KACH,gBAAc,QAAA;KACd,OAAO,MAAA,MAAK;KACZ,QAAQ,QAAA;KACR,UAAU,MAAA,SAAA;;;;;;;IAEb,mBAUM,OAAA,EAVA,OAAK,eAAE,MAAA,GAAE,CAAC,EAAC,SAAA,CAAA,KACf,YAOE,MAAA,QAAA,EAAA;cANI;KAAJ,KAAI;iBACK,YAAA;kEAAA,YAAW,QAAA;KACnB,kBAAgB;KACjB,MAAK;KACJ,UAAU,MAAA,SAAQ;KAClB,UAAQ;6CAEX,WAAsB,KAAA,QAAA,SAAA"}
+{"version":3,"file":"color-picker-panel.vue_vue_type_script_setup_true_lang.mjs","names":[],"sources":["../../../../../../packages/components/color-picker-panel/src/color-picker-panel.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[ns.b(), ns.is('disabled', disabled), ns.is('border', border)]\"\n    @focusout=\"handleFocusout\"\n  >\n    <div :class=\"ns.e('wrapper')\">\n      <hue-slider\n        ref=\"hueRef\"\n        :color=\"color\"\n        vertical\n        :disabled=\"disabled\"\n        :class=\"['hue-slider', hueSliderClass]\"\n        :style=\"hueSliderStyle\"\n      />\n      <sv-panel ref=\"svRef\" :color=\"color\" :disabled=\"disabled\" />\n    </div>\n    <alpha-slider\n      v-if=\"showAlpha\"\n      ref=\"alphaRef\"\n      :color=\"color\"\n      :disabled=\"disabled\"\n    />\n    <predefine\n      v-if=\"predefine\"\n      ref=\"predefine\"\n      :enable-alpha=\"showAlpha\"\n      :color=\"color\"\n      :colors=\"predefine\"\n      :disabled=\"disabled\"\n    />\n    <div :class=\"ns.e('footer')\">\n      <el-input\n        ref=\"inputRef\"\n        v-model=\"customInput\"\n        :validate-event=\"false\"\n        size=\"small\"\n        :disabled=\"disabled\"\n        @change=\"handleConfirm\"\n      />\n      <slot name=\"footer\" />\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, nextTick, onMounted, provide, ref, watch } from 'vue'\nimport { ElInput } from '@element-plus/components/input'\nimport { useFormDisabled, useFormItem } from '@element-plus/components/form'\nimport { useNamespace } from '@element-plus/hooks'\nimport { debugWarn } from '@element-plus/utils'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport AlphaSlider from './components/alpha-slider.vue'\nimport HueSlider from './components/hue-slider.vue'\nimport Predefine from './components/predefine.vue'\nimport SvPanel from './components/sv-panel.vue'\nimport {\n  ROOT_COMMON_COLOR_INJECTION_KEY,\n  colorPickerPanelContextKey,\n  colorPickerPanelEmits,\n} from './color-picker-panel'\nimport { useCommonColor } from './composables/use-common-color'\n\nimport type { ColorPickerPanelProps } from './color-picker-panel'\nimport type { InputInstance } from '@element-plus/components/input'\n\ndefineOptions({\n  name: 'ElColorPickerPanel',\n})\nconst props = withDefaults(defineProps<ColorPickerPanelProps>(), {\n  modelValue: undefined,\n  border: true,\n  validateEvent: true,\n  showAlpha: false,\n})\nconst emit = defineEmits(colorPickerPanelEmits)\n\nconst ns = useNamespace('color-picker-panel')\nconst { formItem } = useFormItem()\nconst disabled = useFormDisabled()\nconst hueRef = ref<InstanceType<typeof HueSlider>>()\nconst svRef = ref<InstanceType<typeof SvPanel>>()\nconst alphaRef = ref<InstanceType<typeof AlphaSlider>>()\nconst inputRef = ref<InputInstance>()\nconst customInput = ref('')\n\nconst { color } = inject(\n  ROOT_COMMON_COLOR_INJECTION_KEY,\n  () => useCommonColor(props, emit),\n  true\n)\n\nfunction handleConfirm() {\n  color.fromString(customInput.value)\n  if (color.value !== customInput.value) {\n    customInput.value = color.value\n  }\n}\n\nfunction handleFocusout() {\n  if (props.validateEvent) {\n    formItem?.validate?.('blur').catch((err) => debugWarn(err))\n  }\n}\n\nfunction update() {\n  hueRef.value?.update()\n  svRef.value?.update()\n  alphaRef.value?.update()\n}\n\nonMounted(() => {\n  if (props.modelValue) {\n    customInput.value = color.value\n  }\n  nextTick(update)\n})\n\nwatch(\n  () => props.modelValue,\n  (newVal) => {\n    if (newVal !== color.value) {\n      newVal ? color.fromString(newVal) : color.clear()\n    }\n  }\n)\n\nwatch(\n  () => color.value,\n  (val) => {\n    emit(UPDATE_MODEL_EVENT, val)\n    customInput.value = val\n    if (props.validateEvent) {\n      formItem?.validate('change').catch((err) => debugWarn(err))\n    }\n  }\n)\n\nprovide(colorPickerPanelContextKey, {\n  currentColor: computed(() => color.value),\n})\n\ndefineExpose({\n  /**\n   * @description current color object\n   */\n  color,\n  /**\n   * @description custom input ref\n   */\n  inputRef,\n  /**\n   * @description update sub components\n   */\n  update,\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;EAoEA,MAAM,QAAQ;EAMd,MAAM,OAAO;EAEb,MAAM,KAAK,aAAa,qBAAoB;EAC5C,MAAM,EAAE,aAAa,aAAY;EACjC,MAAM,WAAW,iBAAgB;EACjC,MAAM,SAAS,KAAoC;EACnD,MAAM,QAAQ,KAAkC;EAChD,MAAM,WAAW,KAAsC;EACvD,MAAM,WAAW,KAAmB;EACpC,MAAM,cAAc,IAAI,GAAE;EAE1B,MAAM,EAAE,UAAU,OAChB,uCACM,eAAe,OAAO,KAAK,EACjC,KACF;EAEA,SAAS,gBAAgB;AACvB,SAAM,WAAW,YAAY,MAAK;AAClC,OAAI,MAAM,UAAU,YAAY,MAC9B,aAAY,QAAQ,MAAM;;EAI9B,SAAS,iBAAiB;AACxB,OAAI,MAAM,cACR,WAAU,WAAW,OAAO,CAAC,OAAO,QAAQ,UAAU,IAAI,CAAA;;EAI9D,SAAS,SAAS;AAChB,UAAO,OAAO,QAAO;AACrB,SAAM,OAAO,QAAO;AACpB,YAAS,OAAO,QAAO;;AAGzB,kBAAgB;AACd,OAAI,MAAM,WACR,aAAY,QAAQ,MAAM;AAE5B,YAAS,OAAM;IAChB;AAED,cACQ,MAAM,aACX,WAAW;AACV,OAAI,WAAW,MAAM,MACnB,UAAS,MAAM,WAAW,OAAO,GAAG,MAAM,OAAM;IAGtD;AAEA,cACQ,MAAM,QACX,QAAQ;AACP,QAAK,oBAAoB,IAAG;AAC5B,eAAY,QAAQ;AACpB,OAAI,MAAM,cACR,WAAU,SAAS,SAAS,CAAC,OAAO,QAAQ,UAAU,IAAI,CAAA;IAGhE;AAEA,UAAQ,4BAA4B,EAClC,cAAc,eAAe,MAAM,MAAM,EAC1C,CAAA;AAED,WAAa;GAIX;GAIA;GAIA;GACD,CAAA;;uBAzJC,mBAwCM,OAAA;IAvCH,OAAK,eAAA;KAAG,MAAA,GAAE,CAAC,GAAC;KAAI,MAAA,GAAE,CAAC,GAAE,YAAa,MAAA,SAAQ,CAAA;KAAG,MAAA,GAAE,CAAC,GAAE,UAAW,QAAA,OAAM;KAAA,CAAA;IACnE,YAAU;;IAEX,mBAUM,OAAA,EAVA,OAAK,eAAE,MAAA,GAAE,CAAC,EAAC,UAAA,CAAA,KACf,YAOE,oBAAA;cANI;KAAJ,KAAI;KACH,OAAO,MAAA,MAAK;KACb,UAAA;KACC,UAAU,MAAA,SAAQ;KAClB,OAAK,eAAA,CAAA,cAAiB,QAAA,eAAc,CAAA;KACpC,OAAK,eAAE,QAAA,eAAc;;;;;;QAExB,YAA4D,kBAAA;cAA9C;KAAJ,KAAI;KAAS,OAAO,MAAA,MAAK;KAAG,UAAU,MAAA,SAAA;;IAG1C,QAAA,0BADR,YAKE,sBAAA;;cAHI;KAAJ,KAAI;KACH,OAAO,MAAA,MAAK;KACZ,UAAU,MAAA,SAAA;;IAGL,QAAA,0BADR,YAOE,mBAAA;;KALA,KAAI;KACH,gBAAc,QAAA;KACd,OAAO,MAAA,MAAK;KACZ,QAAQ,QAAA;KACR,UAAU,MAAA,SAAA;;;;;;;IAEb,mBAUM,OAAA,EAVA,OAAK,eAAE,MAAA,GAAE,CAAC,EAAC,SAAA,CAAA,KACf,YAOE,MAAA,QAAA,EAAA;cANI;KAAJ,KAAI;iBACK,YAAA;kEAAA,YAAW,QAAA;KACnB,kBAAgB;KACjB,MAAK;KACJ,UAAU,MAAA,SAAQ;KAClB,UAAQ;6CAEX,WAAsB,KAAA,QAAA,SAAA"}

package/es/components/color-picker-panel/src/color-picker-panel2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"color-picker-panel2.mjs","names":[],"sources":["../../../../../../packages/components/color-picker-panel/src/color-picker-panel.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[ns.b(), ns.is('disabled', disabled), ns.is('border', border)]\"\n    @focusout=\"handleFocusout\"\n  >\n    <div :class=\"ns.e('wrapper')\">\n      <hue-slider\n        ref=\"hueRef\"\n        class=\"hue-slider\"\n        :color=\"color\"\n        vertical\n        :disabled=\"disabled\"\n      />\n      <sv-panel ref=\"svRef\" :color=\"color\" :disabled=\"disabled\" />\n    </div>\n    <alpha-slider\n      v-if=\"showAlpha\"\n      ref=\"alphaRef\"\n      :color=\"color\"\n      :disabled=\"disabled\"\n    />\n    <predefine\n      v-if=\"predefine\"\n      ref=\"predefine\"\n      :enable-alpha=\"showAlpha\"\n      :color=\"color\"\n      :colors=\"predefine\"\n      :disabled=\"disabled\"\n    />\n    <div :class=\"ns.e('footer')\">\n      <el-input\n        ref=\"inputRef\"\n        v-model=\"customInput\"\n        :validate-event=\"false\"\n        size=\"small\"\n        :disabled=\"disabled\"\n        @change=\"handleConfirm\"\n      />\n      <slot name=\"footer\" />\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, nextTick, onMounted, provide, ref, watch } from 'vue'\nimport { ElInput } from '@element-plus/components/input'\nimport { useFormDisabled, useFormItem } from '@element-plus/components/form'\nimport { useNamespace } from '@element-plus/hooks'\nimport { debugWarn } from '@element-plus/utils'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport AlphaSlider from './components/alpha-slider.vue'\nimport HueSlider from './components/hue-slider.vue'\nimport Predefine from './components/predefine.vue'\nimport SvPanel from './components/sv-panel.vue'\nimport {\n  ROOT_COMMON_COLOR_INJECTION_KEY,\n  colorPickerPanelContextKey,\n  colorPickerPanelEmits,\n} from './color-picker-panel'\nimport { useCommonColor } from './composables/use-common-color'\n\nimport type { ColorPickerPanelProps } from './color-picker-panel'\nimport type { InputInstance } from '@element-plus/components/input'\n\ndefineOptions({\n  name: 'ElColorPickerPanel',\n})\nconst props = withDefaults(defineProps<ColorPickerPanelProps>(), {\n  modelValue: undefined,\n  border: true,\n  validateEvent: true,\n  showAlpha: false,\n})\nconst emit = defineEmits(colorPickerPanelEmits)\n\nconst ns = useNamespace('color-picker-panel')\nconst { formItem } = useFormItem()\nconst disabled = useFormDisabled()\nconst hueRef = ref<InstanceType<typeof HueSlider>>()\nconst svRef = ref<InstanceType<typeof SvPanel>>()\nconst alphaRef = ref<InstanceType<typeof AlphaSlider>>()\nconst inputRef = ref<InputInstance>()\nconst customInput = ref('')\n\nconst { color } = inject(\n  ROOT_COMMON_COLOR_INJECTION_KEY,\n  () => useCommonColor(props, emit),\n  true\n)\n\nfunction handleConfirm() {\n  color.fromString(customInput.value)\n  if (color.value !== customInput.value) {\n    customInput.value = color.value\n  }\n}\n\nfunction handleFocusout() {\n  if (props.validateEvent) {\n    formItem?.validate?.('blur').catch((err) => debugWarn(err))\n  }\n}\n\nfunction update() {\n  hueRef.value?.update()\n  svRef.value?.update()\n  alphaRef.value?.update()\n}\n\nonMounted(() => {\n  if (props.modelValue) {\n    customInput.value = color.value\n  }\n  nextTick(update)\n})\n\nwatch(\n  () => props.modelValue,\n  (newVal) => {\n    if (newVal !== color.value) {\n      newVal ? color.fromString(newVal) : color.clear()\n    }\n  }\n)\n\nwatch(\n  () => color.value,\n  (val) => {\n    emit(UPDATE_MODEL_EVENT, val)\n    customInput.value = val\n    if (props.validateEvent) {\n      formItem?.validate('change').catch((err) => debugWarn(err))\n    }\n  }\n)\n\nprovide(colorPickerPanelContextKey, {\n  currentColor: computed(() => color.value),\n})\n\ndefineExpose({\n  /**\n   * @description current color object\n   */\n  color,\n  /**\n   * @description custom input ref\n   */\n  inputRef,\n  /**\n   * @description update sub components\n   */\n  update,\n})\n</script>\n"],"mappings":""}
+{"version":3,"file":"color-picker-panel2.mjs","names":[],"sources":["../../../../../../packages/components/color-picker-panel/src/color-picker-panel.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[ns.b(), ns.is('disabled', disabled), ns.is('border', border)]\"\n    @focusout=\"handleFocusout\"\n  >\n    <div :class=\"ns.e('wrapper')\">\n      <hue-slider\n        ref=\"hueRef\"\n        :color=\"color\"\n        vertical\n        :disabled=\"disabled\"\n        :class=\"['hue-slider', hueSliderClass]\"\n        :style=\"hueSliderStyle\"\n      />\n      <sv-panel ref=\"svRef\" :color=\"color\" :disabled=\"disabled\" />\n    </div>\n    <alpha-slider\n      v-if=\"showAlpha\"\n      ref=\"alphaRef\"\n      :color=\"color\"\n      :disabled=\"disabled\"\n    />\n    <predefine\n      v-if=\"predefine\"\n      ref=\"predefine\"\n      :enable-alpha=\"showAlpha\"\n      :color=\"color\"\n      :colors=\"predefine\"\n      :disabled=\"disabled\"\n    />\n    <div :class=\"ns.e('footer')\">\n      <el-input\n        ref=\"inputRef\"\n        v-model=\"customInput\"\n        :validate-event=\"false\"\n        size=\"small\"\n        :disabled=\"disabled\"\n        @change=\"handleConfirm\"\n      />\n      <slot name=\"footer\" />\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, nextTick, onMounted, provide, ref, watch } from 'vue'\nimport { ElInput } from '@element-plus/components/input'\nimport { useFormDisabled, useFormItem } from '@element-plus/components/form'\nimport { useNamespace } from '@element-plus/hooks'\nimport { debugWarn } from '@element-plus/utils'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport AlphaSlider from './components/alpha-slider.vue'\nimport HueSlider from './components/hue-slider.vue'\nimport Predefine from './components/predefine.vue'\nimport SvPanel from './components/sv-panel.vue'\nimport {\n  ROOT_COMMON_COLOR_INJECTION_KEY,\n  colorPickerPanelContextKey,\n  colorPickerPanelEmits,\n} from './color-picker-panel'\nimport { useCommonColor } from './composables/use-common-color'\n\nimport type { ColorPickerPanelProps } from './color-picker-panel'\nimport type { InputInstance } from '@element-plus/components/input'\n\ndefineOptions({\n  name: 'ElColorPickerPanel',\n})\nconst props = withDefaults(defineProps<ColorPickerPanelProps>(), {\n  modelValue: undefined,\n  border: true,\n  validateEvent: true,\n  showAlpha: false,\n})\nconst emit = defineEmits(colorPickerPanelEmits)\n\nconst ns = useNamespace('color-picker-panel')\nconst { formItem } = useFormItem()\nconst disabled = useFormDisabled()\nconst hueRef = ref<InstanceType<typeof HueSlider>>()\nconst svRef = ref<InstanceType<typeof SvPanel>>()\nconst alphaRef = ref<InstanceType<typeof AlphaSlider>>()\nconst inputRef = ref<InputInstance>()\nconst customInput = ref('')\n\nconst { color } = inject(\n  ROOT_COMMON_COLOR_INJECTION_KEY,\n  () => useCommonColor(props, emit),\n  true\n)\n\nfunction handleConfirm() {\n  color.fromString(customInput.value)\n  if (color.value !== customInput.value) {\n    customInput.value = color.value\n  }\n}\n\nfunction handleFocusout() {\n  if (props.validateEvent) {\n    formItem?.validate?.('blur').catch((err) => debugWarn(err))\n  }\n}\n\nfunction update() {\n  hueRef.value?.update()\n  svRef.value?.update()\n  alphaRef.value?.update()\n}\n\nonMounted(() => {\n  if (props.modelValue) {\n    customInput.value = color.value\n  }\n  nextTick(update)\n})\n\nwatch(\n  () => props.modelValue,\n  (newVal) => {\n    if (newVal !== color.value) {\n      newVal ? color.fromString(newVal) : color.clear()\n    }\n  }\n)\n\nwatch(\n  () => color.value,\n  (val) => {\n    emit(UPDATE_MODEL_EVENT, val)\n    customInput.value = val\n    if (props.validateEvent) {\n      formItem?.validate('change').catch((err) => debugWarn(err))\n    }\n  }\n)\n\nprovide(colorPickerPanelContextKey, {\n  currentColor: computed(() => color.value),\n})\n\ndefineExpose({\n  /**\n   * @description current color object\n   */\n  color,\n  /**\n   * @description custom input ref\n   */\n  inputRef,\n  /**\n   * @description update sub components\n   */\n  update,\n})\n</script>\n"],"mappings":""}

package/es/components/config-provider/src/config-provider.d.ts

@@ -139,10 +139,10 @@ declare const ConfigProvider: vue.DefineComponent<{
     __epPropKey: true;
   };
 }>>, {
+  readonly valueOnClear: EpPropMergeType<(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>;
   readonly a11y: EpPropMergeType<BooleanConstructor, unknown, unknown>;
   readonly keyboardNavigation: EpPropMergeType<BooleanConstructor, unknown, unknown>;
   readonly namespace: string;
-  readonly valueOnClear: EpPropMergeType<(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>;
 }, {}>;
 type ConfigProviderInstance = InstanceType<typeof ConfigProvider> & unknown;
 //#endregion

package/es/components/countdown/src/countdown.vue.d.ts

@@ -15,8 +15,8 @@ declare const __VLS_base: vue.DefineComponent<__VLS_WithDefaults<__VLS_TypeProps
    */
   displayValue: vue.ComputedRef<string>;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
-  finish: () => void;
   change: (value: number) => void;
+  finish: () => void;
 }, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<CountdownProps>, {
   format: string;
   value: number;