@element-plus/nightly 0.0.20260624 → 0.0.20260626

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

@@ -661,10 +661,10 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   })>;
   ElTooltip: SFCWithInstall<{
     new (...args: any[]): _$vue.CreateComponentPublicInstanceWithMixins<Readonly<UseTooltipProps> & Readonly<{
+      onOpen?: ((...args: any[]) => any) | undefined;
       onClose?: ((...args: any[]) => any) | undefined;
-      onHide?: ((...args: any[]) => any) | undefined;
       onShow?: ((...args: any[]) => any) | undefined;
-      onOpen?: ((...args: any[]) => any) | undefined;
+      onHide?: ((...args: any[]) => any) | undefined;
       "onUpdate:visible"?: ((...args: any[]) => any) | undefined;
       "onBefore-show"?: ((...args: any[]) => any) | undefined;
       "onBefore-hide"?: ((...args: any[]) => any) | undefined;
@@ -677,14 +677,17 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       onClose: (event?: Event, delay?: number) => void;
       hide: (event?: Event) => void;
     }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+      open: (...args: any[]) => void;
       close: (...args: any[]) => void;
-      hide: (...args: any[]) => void;
       show: (...args: any[]) => void;
-      open: (...args: any[]) => void;
+      hide: (...args: any[]) => void;
       "update:visible": (...args: any[]) => void;
       "before-show": (...args: any[]) => void;
       "before-hide": (...args: any[]) => void;
     }, _$vue.PublicProps, {
+      showAfter: number;
+      hideAfter: number;
+      autoClose: number;
       offset: number;
       teleported: boolean;
       effect: PopperEffect;
@@ -707,9 +710,6 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       arrowOffset: number;
       showArrow: boolean;
       role: typeof roleTypes[number];
-      showAfter: number;
-      hideAfter: number;
-      autoClose: number;
       trigger: Arrayable<TooltipTriggerType>;
       triggerKeys: string[];
     }, false, {}, {}, _$vue.GlobalComponents, _$vue.GlobalDirectives, string, {}, any, _$vue.ComponentProvideOptions, {
@@ -720,10 +720,10 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       M: {};
       Defaults: {};
     }, Readonly<UseTooltipProps> & Readonly<{
+      onOpen?: ((...args: any[]) => any) | undefined;
       onClose?: ((...args: any[]) => any) | undefined;
-      onHide?: ((...args: any[]) => any) | undefined;
       onShow?: ((...args: any[]) => any) | undefined;
-      onOpen?: ((...args: any[]) => any) | undefined;
+      onHide?: ((...args: any[]) => any) | undefined;
       "onUpdate:visible"?: ((...args: any[]) => any) | undefined;
       "onBefore-show"?: ((...args: any[]) => any) | undefined;
       "onBefore-hide"?: ((...args: any[]) => any) | undefined;
@@ -736,6 +736,9 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       onClose: (event?: Event, delay?: number) => void;
       hide: (event?: Event) => void;
     }, {}, {}, {}, {
+      showAfter: number;
+      hideAfter: number;
+      autoClose: number;
       offset: number;
       teleported: boolean;
       effect: PopperEffect;
@@ -758,9 +761,6 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       arrowOffset: number;
       showArrow: boolean;
       role: typeof roleTypes[number];
-      showAfter: number;
-      hideAfter: number;
-      autoClose: number;
       trigger: Arrayable<TooltipTriggerType>;
       triggerKeys: string[];
     }>;
@@ -768,10 +768,10 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     __isTeleport?: never;
     __isSuspense?: never;
   } & _$vue.ComponentOptionsBase<Readonly<UseTooltipProps> & Readonly<{
+    onOpen?: ((...args: any[]) => any) | undefined;
     onClose?: ((...args: any[]) => any) | undefined;
-    onHide?: ((...args: any[]) => any) | undefined;
     onShow?: ((...args: any[]) => any) | undefined;
-    onOpen?: ((...args: any[]) => any) | undefined;
+    onHide?: ((...args: any[]) => any) | undefined;
     "onUpdate:visible"?: ((...args: any[]) => any) | undefined;
     "onBefore-show"?: ((...args: any[]) => any) | undefined;
     "onBefore-hide"?: ((...args: any[]) => any) | undefined;
@@ -784,14 +784,17 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     onClose: (event?: Event, delay?: number) => void;
     hide: (event?: Event) => void;
   }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+    open: (...args: any[]) => void;
     close: (...args: any[]) => void;
-    hide: (...args: any[]) => void;
     show: (...args: any[]) => void;
-    open: (...args: any[]) => void;
+    hide: (...args: any[]) => void;
     "update:visible": (...args: any[]) => void;
     "before-show": (...args: any[]) => void;
     "before-hide": (...args: any[]) => void;
   }, string, {
+    showAfter: number;
+    hideAfter: number;
+    autoClose: number;
     offset: number;
     teleported: boolean;
     effect: PopperEffect;
@@ -814,9 +817,6 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     arrowOffset: number;
     showArrow: boolean;
     role: typeof roleTypes[number];
-    showAfter: number;
-    hideAfter: number;
-    autoClose: number;
     trigger: Arrayable<TooltipTriggerType>;
     triggerKeys: string[];
   }, {}, string, {}, _$vue.GlobalComponents, _$vue.GlobalDirectives, string, _$vue.ComponentProvideOptions> & _$vue.VNodeProps & _$vue.AllowedComponentProps & _$vue.ComponentCustomProps & (new () => {

package/es/components/form/src/form-item.d.ts

@@ -86,7 +86,7 @@ declare const formItemProps: {
   };
   readonly error: StringConstructor;
   readonly validateStatus: {
-    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "" | "success" | "error" | "validating", unknown>>;
+    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "" | "error" | "success" | "validating", unknown>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;

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

@@ -27,7 +27,7 @@ declare const __VLS_base: _$vue.DefineComponent<FormItemProps, {
   /**
    * @description Validation state.
    */
-  validateState: _$vue.Ref<"" | "success" | "error" | "validating", "" | "success" | "error" | "validating">;
+  validateState: _$vue.Ref<"" | "error" | "success" | "validating", "" | "error" | "success" | "validating">;
   /**
    * @description Validate form item.
    */

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

@@ -86,7 +86,7 @@ interface ImageProps {
 declare const imageProps: {
   readonly hideOnClickModal: BooleanConstructor;
   readonly src: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
-  readonly fit: EpPropFinalized<StringConstructor, "" | "fill" | "none" | "contain" | "cover" | "scale-down", unknown, "", boolean>;
+  readonly fit: EpPropFinalized<StringConstructor, "" | "fill" | "contain" | "cover" | "none" | "scale-down", unknown, "", boolean>;
   readonly loading: {
     readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "lazy" | "eager", unknown>>;
     readonly required: false;

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

@@ -35,25 +35,25 @@ declare const __VLS_base: _$vue.DefineComponent<ImageProps, {
   /** @description manually open preview */showPreview: typeof clickHandler;
 }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
   close: () => void;
-  error: (evt: Event) => void;
-  show: () => void;
   load: (evt: Event) => void;
+  error: (evt: Event) => void;
   switch: (val: number) => void;
+  show: () => void;
 }, string, _$vue.PublicProps, Readonly<ImageProps> & Readonly<{
   onClose?: (() => any) | undefined;
-  onError?: ((evt: Event) => any) | undefined;
-  onShow?: (() => any) | undefined;
   onLoad?: ((evt: Event) => any) | undefined;
+  onError?: ((evt: Event) => any) | undefined;
   onSwitch?: ((val: number) => any) | undefined;
+  onShow?: (() => any) | undefined;
 }>, {
-  infinite: boolean;
-  scale: number;
   src: string;
   fit: ImageFitType;
+  previewSrcList: string[];
   initialIndex: number;
+  infinite: boolean;
   closeOnPressEscape: boolean;
-  previewSrcList: string[];
   zoomRate: number;
+  scale: number;
   minScale: number;
   maxScale: number;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;

package/es/components/image-viewer/src/image-viewer.vue.d.ts

@@ -38,19 +38,19 @@ declare const __VLS_base: _$vue.DefineComponent<ImageViewerProps, {
 }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
   close: () => void;
   error: (evt: Event) => void;
-  rotate: (deg: number) => void;
   switch: (index: number) => void;
+  rotate: (deg: number) => void;
 }, string, _$vue.PublicProps, Readonly<ImageViewerProps> & Readonly<{
   onClose?: (() => any) | undefined;
   onError?: ((evt: Event) => any) | undefined;
-  onRotate?: ((deg: number) => any) | undefined;
   onSwitch?: ((index: number) => any) | undefined;
+  onRotate?: ((deg: number) => any) | undefined;
 }>, {
-  infinite: boolean;
-  scale: number;
   initialIndex: number;
+  infinite: boolean;
   closeOnPressEscape: boolean;
   zoomRate: number;
+  scale: number;
   minScale: number;
   maxScale: number;
   urlList: string[];

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

@@ -155,7 +155,7 @@ interface InputProps {
  * @deprecated Removed after 3.0.0, Use `InputProps` instead.
  */
 declare const inputProps: {
-  readonly inputmode: EpPropFinalized<(new (...args: any[]) => "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal") | (() => "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal" | undefined) | (((new (...args: any[]) => "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal") | (() => "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal" | undefined)) | null)[], unknown, unknown, undefined, boolean>;
+  readonly inputmode: EpPropFinalized<(new (...args: any[]) => "none" | "text" | "email" | "search" | "tel" | "url" | "numeric" | "decimal") | (() => "none" | "text" | "email" | "search" | "tel" | "url" | "numeric" | "decimal" | undefined) | (((new (...args: any[]) => "none" | "text" | "email" | "search" | "tel" | "url" | "numeric" | "decimal") | (() => "none" | "text" | "email" | "search" | "tel" | "url" | "numeric" | "decimal" | undefined)) | null)[], unknown, unknown, undefined, boolean>;
   readonly name: StringConstructor;
   readonly ariaLabel: StringConstructor;
   readonly id: EpPropFinalized<StringConstructor, unknown, unknown, undefined, boolean>;

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

@@ -32,10 +32,10 @@ declare const __VLS_base: _$vue.DefineComponent<InputProps, {
   clear: (evt?: MouseEvent) => void; /** @description resize textarea. */
   resizeTextarea: () => void;
 }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+  clear: (evt: MouseEvent | undefined) => void;
   "update:modelValue": (value: string) => void;
   change: (value: string, evt?: Event | undefined) => void;
   input: (value: string) => void;
-  clear: (evt: MouseEvent | undefined) => void;
   focus: (evt: FocusEvent) => void;
   blur: (evt: FocusEvent) => void;
   mouseleave: (evt: MouseEvent) => void;
@@ -45,10 +45,10 @@ declare const __VLS_base: _$vue.DefineComponent<InputProps, {
   compositionupdate: (evt: CompositionEvent) => void;
   compositionend: (evt: CompositionEvent) => void;
 }, string, _$vue.PublicProps, Readonly<InputProps> & Readonly<{
+  onClear?: ((evt: MouseEvent | undefined) => any) | undefined;
   "onUpdate:modelValue"?: ((value: string) => any) | undefined;
   onChange?: ((value: string, evt?: Event | undefined) => any) | undefined;
   onInput?: ((value: string) => any) | undefined;
-  onClear?: ((evt: MouseEvent | undefined) => any) | undefined;
   onFocus?: ((evt: FocusEvent) => any) | undefined;
   onBlur?: ((evt: FocusEvent) => any) | undefined;
   onMouseleave?: ((evt: MouseEvent) => any) | undefined;

package/es/components/input-number/src/input-number.d.ts

@@ -106,7 +106,7 @@ interface InputNumberProps {
  * @deprecated Removed after 3.0.0, Use `InputNumberProps` instead.
  */
 declare const inputNumberProps: {
-  readonly inputmode: EpPropFinalized<(new (...args: any[]) => "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal") | (() => "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal" | undefined) | (((new (...args: any[]) => "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal") | (() => "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal" | undefined)) | null)[], unknown, unknown, undefined, boolean>;
+  readonly inputmode: EpPropFinalized<(new (...args: any[]) => "none" | "text" | "email" | "search" | "tel" | "url" | "numeric" | "decimal") | (() => "none" | "text" | "email" | "search" | "tel" | "url" | "numeric" | "decimal" | undefined) | (((new (...args: any[]) => "none" | "text" | "email" | "search" | "tel" | "url" | "numeric" | "decimal") | (() => "none" | "text" | "email" | "search" | "tel" | "url" | "numeric" | "decimal" | undefined)) | null)[], unknown, unknown, undefined, boolean>;
   readonly align: EpPropFinalized<(new (...args: any[]) => "left" | "center" | "right") | (() => "left" | "center" | "right") | (((new (...args: any[]) => "left" | "center" | "right") | (() => "left" | "center" | "right")) | null)[], unknown, unknown, "center", boolean>;
   readonly disabledScientific: BooleanConstructor;
   readonly formatter: {

package/es/components/input-number/src/input-number.vue.d.ts

@@ -34,7 +34,7 @@ declare const __VLS_base: _$vue.DefineComponent<InputNumberProps, {
   readonly: boolean;
   tabindex: string | number;
   validateEvent: boolean;
-  inputmode: "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal";
+  inputmode: "none" | "text" | "email" | "search" | "tel" | "url" | "numeric" | "decimal";
   max: number;
   min: number;
   align: "left" | "right" | "center";

package/es/components/input-otp/src/input-otp.d.ts

@@ -33,7 +33,7 @@ interface InputOtpProps extends Pick<AriaProps, 'ariaLabel'> {
   type?: 'outlined' | 'filled' | 'underlined';
   /**
    * @description The size of the OTP fields
-   * @default 'default'
+   * @default undefined
    */
   size?: ComponentSize;
   /**

package/es/components/input-otp/src/input-otp.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"input-otp.mjs","names":[],"sources":["../../../../../../packages/components/input-otp/src/input-otp.ts"],"sourcesContent":["import { CHANGE_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { isString } from '@element-plus/utils'\n\nimport type { InputHTMLAttributes, VNode } from 'vue'\nimport type { ComponentSize } from '@element-plus/constants'\nimport type { AriaProps } from '@element-plus/hooks'\n\nexport interface InputOtpProps extends Pick<AriaProps, 'ariaLabel'> {\n  /**\n   * @description The value of the OTP fields.\n   *\n   * Since numbers must not have leading zeros, `modelValue` is allowed to be a number only during initialization.\n   *\n   * @default undefined\n   */\n  modelValue?: string | number\n  /**\n   * @description The OTP fields length\n   * @default 6\n   */\n  length?: number\n  /**\n   * @description Custom validator function\n   * @default () => true\n   */\n  validator?: (char: string, index: number) => boolean\n  /**\n   * @description Native input mode for virtual keyboards\n   */\n  inputmode?: InputHTMLAttributes['inputmode']\n  /**\n   * @description The type of the OTP fields\n   * @default 'outlined'\n   */\n  type?: 'outlined' | 'filled' | 'underlined'\n  /**\n   * @description The size of the OTP fields\n   * @default 'default'\n   */\n  size?: ComponentSize\n  /**\n   * @description Whether to enable password mode\n   */\n  mask?: boolean\n  /**\n   * @description Whether the OTP fields are disabled\n   * @default undefined\n   */\n  disabled?: boolean\n  /**\n   * @description Same as `readonly` in native input\n   */\n  readonly?: boolean\n  /**\n   * @description Same as `id` in native input\n   */\n  id?: string\n  /**\n   * @description Whether to trigger form validation\n   */\n  validateEvent?: boolean\n  /**\n   * @description The separator between OTP fields\n   */\n  separator?: string | VNode | ((index: number) => string | VNode)\n}\n\nexport const inputOtpEmits = {\n  [UPDATE_MODEL_EVENT]: (value: string) => isString(value),\n  [CHANGE_EVENT]: (value: string) => isString(value),\n  finish: (value: string) => isString(value),\n  focus: (eve: FocusEvent) => eve instanceof FocusEvent,\n  blur: (eve: FocusEvent) => eve instanceof FocusEvent,\n}\n\nexport type InputOtpEmits = typeof inputOtpEmits\n"],"mappings":";;;AAmEA,MAAa,gBAAgB;EAC1B,sBAAsB,UAAkB,SAAS,MAAM;EACvD,gBAAgB,UAAkB,SAAS,MAAM;CAClD,SAAS,UAAkB,SAAS,MAAM;CAC1C,QAAQ,QAAoB,eAAe;CAC3C,OAAO,QAAoB,eAAe;CAC3C"}
+{"version":3,"file":"input-otp.mjs","names":[],"sources":["../../../../../../packages/components/input-otp/src/input-otp.ts"],"sourcesContent":["import { CHANGE_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { isString } from '@element-plus/utils'\n\nimport type { InputHTMLAttributes, VNode } from 'vue'\nimport type { ComponentSize } from '@element-plus/constants'\nimport type { AriaProps } from '@element-plus/hooks'\n\nexport interface InputOtpProps extends Pick<AriaProps, 'ariaLabel'> {\n  /**\n   * @description The value of the OTP fields.\n   *\n   * Since numbers must not have leading zeros, `modelValue` is allowed to be a number only during initialization.\n   *\n   * @default undefined\n   */\n  modelValue?: string | number\n  /**\n   * @description The OTP fields length\n   * @default 6\n   */\n  length?: number\n  /**\n   * @description Custom validator function\n   * @default () => true\n   */\n  validator?: (char: string, index: number) => boolean\n  /**\n   * @description Native input mode for virtual keyboards\n   */\n  inputmode?: InputHTMLAttributes['inputmode']\n  /**\n   * @description The type of the OTP fields\n   * @default 'outlined'\n   */\n  type?: 'outlined' | 'filled' | 'underlined'\n  /**\n   * @description The size of the OTP fields\n   * @default undefined\n   */\n  size?: ComponentSize\n  /**\n   * @description Whether to enable password mode\n   */\n  mask?: boolean\n  /**\n   * @description Whether the OTP fields are disabled\n   * @default undefined\n   */\n  disabled?: boolean\n  /**\n   * @description Same as `readonly` in native input\n   */\n  readonly?: boolean\n  /**\n   * @description Same as `id` in native input\n   */\n  id?: string\n  /**\n   * @description Whether to trigger form validation\n   */\n  validateEvent?: boolean\n  /**\n   * @description The separator between OTP fields\n   */\n  separator?: string | VNode | ((index: number) => string | VNode)\n}\n\nexport const inputOtpEmits = {\n  [UPDATE_MODEL_EVENT]: (value: string) => isString(value),\n  [CHANGE_EVENT]: (value: string) => isString(value),\n  finish: (value: string) => isString(value),\n  focus: (eve: FocusEvent) => eve instanceof FocusEvent,\n  blur: (eve: FocusEvent) => eve instanceof FocusEvent,\n}\n\nexport type InputOtpEmits = typeof inputOtpEmits\n"],"mappings":";;;AAmEA,MAAa,gBAAgB;EAC1B,sBAAsB,UAAkB,SAAS,MAAM;EACvD,gBAAgB,UAAkB,SAAS,MAAM;CAClD,SAAS,UAAkB,SAAS,MAAM;CAC1C,QAAQ,QAAoB,eAAe;CAC3C,OAAO,QAAoB,eAAe;CAC3C"}

package/es/components/input-otp/src/input-otp.vue.d.ts

@@ -1,4 +1,3 @@
-import { ComponentSize } from "../../../constants/size.js";
 import { InputOtpProps } from "./input-otp.js";
 import * as _$vue from "vue";
 
@@ -35,10 +34,9 @@ declare const __VLS_base: _$vue.DefineComponent<InputOtpProps, {
   onBlur?: ((eve: FocusEvent) => any) | undefined;
   onFinish?: ((value: string) => any) | undefined;
 }>, {
-  type: "outlined" | "filled" | "underlined";
   length: number;
+  type: "outlined" | "filled" | "underlined";
   validator: (char: string, index: number) => boolean;
-  size: ComponentSize;
   disabled: boolean;
   validateEvent: boolean;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;

package/es/components/input-otp/src/input-otp.vue_vue_type_script_setup_true_lang.mjs

@@ -6,7 +6,7 @@ import { rAF } from "../../../utils/raf.mjs";
 import { NOOP } from "../../../utils/functions.mjs";
 import { useLocale } from "../../../hooks/use-locale/index.mjs";
 import { useNamespace } from "../../../hooks/use-namespace/index.mjs";
-import { useFormDisabled } from "../../form/src/hooks/use-form-common-props.mjs";
+import { useFormDisabled, useFormSize } from "../../form/src/hooks/use-form-common-props.mjs";
 import { useFormItem, useFormItemInputId } from "../../form/src/hooks/use-form-item.mjs";
 import { inputOtpEmits } from "./input-otp.mjs";
 import { clamp } from "@vueuse/core";
@@ -57,8 +57,7 @@ var input_otp_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
 		},
 		size: {
 			type: null,
-			required: false,
-			default: "default"
+			required: false
 		},
 		mask: {
 			type: Boolean,
@@ -115,6 +114,7 @@ var input_otp_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
 		const { t } = useLocale();
 		const { formItem } = useFormItem();
 		const { inputId, isLabeledByFormItem } = useFormItemInputId(props, { formItemContext: formItem });
+		const size = useFormSize();
 		const disabled = useFormDisabled();
 		let modelValueOnFocus = props.modelValue;
 		const getFirstIndex = (maxIndex) => {
@@ -244,7 +244,7 @@ var input_otp_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
 				id: unref(inputId),
 				class: normalizeClass([
 					unref(ns).b(),
-					unref(ns).m(__props.size),
+					unref(ns).m(unref(size)),
 					unref(ns).m(__props.type),
 					unref(ns).is("disabled", unref(disabled))
 				]),

package/es/components/input-otp/src/input-otp.vue_vue_type_script_setup_true_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"input-otp.vue_vue_type_script_setup_true_lang.mjs","names":["$slots"],"sources":["../../../../../../packages/components/input-otp/src/input-otp.vue"],"sourcesContent":["<template>\n  <div\n    :id=\"inputId\"\n    :class=\"[ns.b(), ns.m(size), ns.m(type), ns.is('disabled', disabled)]\"\n    role=\"group\"\n    :aria-label=\"\n      !isLabeledByFormItem\n        ? ariaLabel || t('el.inputOTP.groupLabel')\n        : undefined\n    \"\n    :aria-labelledby=\"isLabeledByFormItem ? formItem?.labelId : undefined\"\n  >\n    <template v-for=\"(_, index) in length\" :key=\"index\">\n      <label :class=\"ns.e('input-field')\">\n        <input\n          ref=\"inputRefs\"\n          :value=\"innerValue[index]\"\n          :class=\"ns.e('input')\"\n          :type=\"mask ? 'password' : 'text'\"\n          :disabled=\"disabled\"\n          :readonly=\"readonly\"\n          :inputmode=\"inputmode\"\n          autocomplete=\"one-time-code\"\n          :aria-label=\"t('el.inputOTP.defaultLabel', { index: index + 1 })\"\n          @focus=\"handleFocus\"\n          @blur=\"handleBlur\"\n          @click=\"focus(index)\"\n          @keydown=\"handleKeydown($event, index)\"\n          @input=\"handleInput($event, index)\"\n        />\n      </label>\n      <slot\n        v-if=\"($slots.separator || separators[index]) && index < length - 1\"\n        name=\"separator\"\n        :index=\"index\"\n      >\n        <component :is=\"() => separators[index]\" />\n      </slot>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref, watch } from 'vue'\nimport { clamp } from '@vueuse/core'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { NOOP, getEventCode, isFunction, rAF } from '@element-plus/utils'\nimport {\n  useFormDisabled,\n  useFormItem,\n  useFormItemInputId,\n} from '@element-plus/components/form'\nimport {\n  CHANGE_EVENT,\n  EVENT_CODE,\n  UPDATE_MODEL_EVENT,\n} from '@element-plus/constants'\nimport { inputOtpEmits } from './input-otp'\n\nimport type { InputOtpProps } from './input-otp'\n\ndefineOptions({\n  name: 'ElInputOtp',\n})\n\nconst props = withDefaults(defineProps<InputOtpProps>(), {\n  length: 6,\n  validator: () => true,\n  type: 'outlined',\n  size: 'default',\n  disabled: undefined,\n  validateEvent: true,\n})\nconst emit = defineEmits(inputOtpEmits)\n\nconst initialValue = computed(() => {\n  const value = String(props.modelValue ?? '')\n  return Array.from({ length: props.length }, (_, i) => value.charAt(i))\n})\n\nconst separators = computed(() => {\n  const { separator } = props\n  const _separator = isFunction(separator) ? separator : () => separator\n  return Array.from({ length: props.length - 1 }, (_, i) => _separator(i))\n})\n\nconst innerValue = ref<string[]>(initialValue.value)\nconst isFocused = ref(false)\nconst inputRefs = ref<(HTMLInputElement | undefined)[]>([])\n\nconst ns = useNamespace('input-otp')\nconst { t } = useLocale()\nconst { formItem } = useFormItem()\nconst { inputId, isLabeledByFormItem } = useFormItemInputId(props, {\n  formItemContext: formItem,\n})\nconst disabled = useFormDisabled()\nlet modelValueOnFocus = props.modelValue\n\nconst getFirstIndex = (maxIndex: number) => {\n  const index = innerValue.value.findIndex((char, i) => !char && i <= maxIndex)\n  return index === -1 ? maxIndex : index\n}\n\nconst handleFocus = (event: FocusEvent) => {\n  if (inputRefs.value?.includes(event.relatedTarget as any)) {\n    return\n  }\n\n  isFocused.value = true\n  emit('focus', event)\n}\n\nconst handleBlur = (event: FocusEvent) => {\n  if (inputRefs.value?.includes(event.relatedTarget as any)) {\n    return\n  }\n\n  isFocused.value = false\n  emit('blur', event)\n  if (props.validateEvent) {\n    formItem?.validate?.('blur').catch(NOOP)\n  }\n}\n\nconst updateModelValue = (emitFinish = true) => {\n  const value = innerValue.value.join('').slice(0, props.length)\n  if (value !== props.modelValue) {\n    emit(UPDATE_MODEL_EVENT, value)\n    if (emitFinish && value.length === props.length) {\n      emit('finish', value)\n    }\n  }\n}\n\nconst handleKeydown = (event: KeyboardEvent, index: number) => {\n  const code = getEventCode(event)\n  let preventDefault = true\n\n  switch (code) {\n    case EVENT_CODE.backspace:\n      if (props.readonly) break\n      innerValue.value[index] = ''\n      focus(index - 1)\n      updateModelValue()\n      break\n    case EVENT_CODE.delete:\n      if (props.readonly) break\n      innerValue.value[index] = ''\n      focus(index)\n      updateModelValue()\n      break\n    case EVENT_CODE.up:\n    case EVENT_CODE.left:\n      focus(index - 1)\n      break\n    case EVENT_CODE.down:\n    case EVENT_CODE.right:\n      focus(index + 1)\n      break\n    default:\n      preventDefault = false\n  }\n\n  if (preventDefault) {\n    event.preventDefault()\n  }\n}\n\nconst handleInput = (event: Event, index: number) => {\n  const target = event.target as HTMLInputElement\n  const targetIndex = getFirstIndex(index)\n  let focusIndex = targetIndex + 1\n  let value = target.value\n\n  // Safari and Firefox do not trigger the paste event during autofill,\n  // so the paste logic needs to be handled in the input event\n  if (value.length > 1) {\n    const chars = castValues(value, targetIndex)\n\n    // Avoid innerValue inconsistency with the input box value after pasting when char has no change\n    target.value = innerValue.value[index] ?? ''\n\n    chars.forEach((char, i) => (innerValue.value[targetIndex + i] = char))\n    focus(targetIndex + chars.length)\n    updateModelValue()\n    return\n  }\n\n  if (!props.validator(value, targetIndex)) {\n    target.value = innerValue.value[index] ?? ''\n    value = target.value\n    focusIndex = targetIndex\n  }\n\n  innerValue.value[targetIndex] = value\n  if (targetIndex !== index) {\n    target.value = innerValue.value[index] ?? ''\n  }\n  focus(focusIndex)\n  updateModelValue()\n}\n\nconst castValues = (value: InputOtpProps['modelValue'], startIndex = 0) => {\n  const chars = `${value ?? ''}`.split('')\n  const result: string[] = []\n  for (const char of chars) {\n    if (result.length + startIndex >= props.length) {\n      break\n    }\n    if (props.validator(char, result.length + startIndex)) {\n      result.push(char)\n    }\n  }\n  return result\n}\n\nconst focus = (index: number = 0) => {\n  const focusIndex = clamp(index, 0, props.length - 1)\n  const target = inputRefs.value?.[focusIndex]\n\n  if (document.activeElement !== target) {\n    target?.focus()\n  }\n  rAF(() => {\n    // When it is called, the focus may have already been captured by another element.\n    // e.g. typing quickly and deleting.\n    if (!props.readonly && document.activeElement === target) {\n      ;(target as HTMLInputElement | null)?.select()\n    }\n  })\n}\n\nconst blur = () => {\n  const target = inputRefs.value?.find(\n    (input) => document.activeElement === input\n  )\n  target?.blur()\n}\n\nwatch(\n  () => props.modelValue,\n  () => {\n    innerValue.value = initialValue.value\n\n    if (props.validateEvent) {\n      formItem?.validate?.('change').catch(NOOP)\n    }\n  }\n)\n\nwatch(\n  () => props.length,\n  () => {\n    innerValue.value = initialValue.value\n    updateModelValue(false)\n  }\n)\n\nwatch(isFocused, (value) => {\n  if (value) {\n    modelValueOnFocus = props.modelValue\n    return\n  }\n  if (modelValueOnFocus !== props.modelValue) {\n    emit(CHANGE_EVENT, props.modelValue as string)\n  }\n})\n\ndefineExpose({\n  /**\n   * @description HTML input elements array\n   */\n  inputRefs,\n  /**\n   * @description Focus an OTP input field\n   */\n  focus,\n  /**\n   * @description Blur the focused OTP input field\n   */\n  blur,\n})\n</script>\n"],"mappings":"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"}
+{"version":3,"file":"input-otp.vue_vue_type_script_setup_true_lang.mjs","names":["$slots"],"sources":["../../../../../../packages/components/input-otp/src/input-otp.vue"],"sourcesContent":["<template>\n  <div\n    :id=\"inputId\"\n    :class=\"[ns.b(), ns.m(size), ns.m(type), ns.is('disabled', disabled)]\"\n    role=\"group\"\n    :aria-label=\"\n      !isLabeledByFormItem\n        ? ariaLabel || t('el.inputOTP.groupLabel')\n        : undefined\n    \"\n    :aria-labelledby=\"isLabeledByFormItem ? formItem?.labelId : undefined\"\n  >\n    <template v-for=\"(_, index) in length\" :key=\"index\">\n      <label :class=\"ns.e('input-field')\">\n        <input\n          ref=\"inputRefs\"\n          :value=\"innerValue[index]\"\n          :class=\"ns.e('input')\"\n          :type=\"mask ? 'password' : 'text'\"\n          :disabled=\"disabled\"\n          :readonly=\"readonly\"\n          :inputmode=\"inputmode\"\n          autocomplete=\"one-time-code\"\n          :aria-label=\"t('el.inputOTP.defaultLabel', { index: index + 1 })\"\n          @focus=\"handleFocus\"\n          @blur=\"handleBlur\"\n          @click=\"focus(index)\"\n          @keydown=\"handleKeydown($event, index)\"\n          @input=\"handleInput($event, index)\"\n        />\n      </label>\n      <slot\n        v-if=\"($slots.separator || separators[index]) && index < length - 1\"\n        name=\"separator\"\n        :index=\"index\"\n      >\n        <component :is=\"() => separators[index]\" />\n      </slot>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref, watch } from 'vue'\nimport { clamp } from '@vueuse/core'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { NOOP, getEventCode, isFunction, rAF } from '@element-plus/utils'\nimport {\n  useFormDisabled,\n  useFormItem,\n  useFormItemInputId,\n  useFormSize,\n} from '@element-plus/components/form'\nimport {\n  CHANGE_EVENT,\n  EVENT_CODE,\n  UPDATE_MODEL_EVENT,\n} from '@element-plus/constants'\nimport { inputOtpEmits } from './input-otp'\n\nimport type { InputOtpProps } from './input-otp'\n\ndefineOptions({\n  name: 'ElInputOtp',\n})\n\nconst props = withDefaults(defineProps<InputOtpProps>(), {\n  length: 6,\n  validator: () => true,\n  type: 'outlined',\n  disabled: undefined,\n  validateEvent: true,\n})\nconst emit = defineEmits(inputOtpEmits)\n\nconst initialValue = computed(() => {\n  const value = String(props.modelValue ?? '')\n  return Array.from({ length: props.length }, (_, i) => value.charAt(i))\n})\n\nconst separators = computed(() => {\n  const { separator } = props\n  const _separator = isFunction(separator) ? separator : () => separator\n  return Array.from({ length: props.length - 1 }, (_, i) => _separator(i))\n})\n\nconst innerValue = ref<string[]>(initialValue.value)\nconst isFocused = ref(false)\nconst inputRefs = ref<(HTMLInputElement | undefined)[]>([])\n\nconst ns = useNamespace('input-otp')\nconst { t } = useLocale()\nconst { formItem } = useFormItem()\nconst { inputId, isLabeledByFormItem } = useFormItemInputId(props, {\n  formItemContext: formItem,\n})\nconst size = useFormSize()\nconst disabled = useFormDisabled()\nlet modelValueOnFocus = props.modelValue\n\nconst getFirstIndex = (maxIndex: number) => {\n  const index = innerValue.value.findIndex((char, i) => !char && i <= maxIndex)\n  return index === -1 ? maxIndex : index\n}\n\nconst handleFocus = (event: FocusEvent) => {\n  if (inputRefs.value?.includes(event.relatedTarget as any)) {\n    return\n  }\n\n  isFocused.value = true\n  emit('focus', event)\n}\n\nconst handleBlur = (event: FocusEvent) => {\n  if (inputRefs.value?.includes(event.relatedTarget as any)) {\n    return\n  }\n\n  isFocused.value = false\n  emit('blur', event)\n  if (props.validateEvent) {\n    formItem?.validate?.('blur').catch(NOOP)\n  }\n}\n\nconst updateModelValue = (emitFinish = true) => {\n  const value = innerValue.value.join('').slice(0, props.length)\n  if (value !== props.modelValue) {\n    emit(UPDATE_MODEL_EVENT, value)\n    if (emitFinish && value.length === props.length) {\n      emit('finish', value)\n    }\n  }\n}\n\nconst handleKeydown = (event: KeyboardEvent, index: number) => {\n  const code = getEventCode(event)\n  let preventDefault = true\n\n  switch (code) {\n    case EVENT_CODE.backspace:\n      if (props.readonly) break\n      innerValue.value[index] = ''\n      focus(index - 1)\n      updateModelValue()\n      break\n    case EVENT_CODE.delete:\n      if (props.readonly) break\n      innerValue.value[index] = ''\n      focus(index)\n      updateModelValue()\n      break\n    case EVENT_CODE.up:\n    case EVENT_CODE.left:\n      focus(index - 1)\n      break\n    case EVENT_CODE.down:\n    case EVENT_CODE.right:\n      focus(index + 1)\n      break\n    default:\n      preventDefault = false\n  }\n\n  if (preventDefault) {\n    event.preventDefault()\n  }\n}\n\nconst handleInput = (event: Event, index: number) => {\n  const target = event.target as HTMLInputElement\n  const targetIndex = getFirstIndex(index)\n  let focusIndex = targetIndex + 1\n  let value = target.value\n\n  // Safari and Firefox do not trigger the paste event during autofill,\n  // so the paste logic needs to be handled in the input event\n  if (value.length > 1) {\n    const chars = castValues(value, targetIndex)\n\n    // Avoid innerValue inconsistency with the input box value after pasting when char has no change\n    target.value = innerValue.value[index] ?? ''\n\n    chars.forEach((char, i) => (innerValue.value[targetIndex + i] = char))\n    focus(targetIndex + chars.length)\n    updateModelValue()\n    return\n  }\n\n  if (!props.validator(value, targetIndex)) {\n    target.value = innerValue.value[index] ?? ''\n    value = target.value\n    focusIndex = targetIndex\n  }\n\n  innerValue.value[targetIndex] = value\n  if (targetIndex !== index) {\n    target.value = innerValue.value[index] ?? ''\n  }\n  focus(focusIndex)\n  updateModelValue()\n}\n\nconst castValues = (value: InputOtpProps['modelValue'], startIndex = 0) => {\n  const chars = `${value ?? ''}`.split('')\n  const result: string[] = []\n  for (const char of chars) {\n    if (result.length + startIndex >= props.length) {\n      break\n    }\n    if (props.validator(char, result.length + startIndex)) {\n      result.push(char)\n    }\n  }\n  return result\n}\n\nconst focus = (index: number = 0) => {\n  const focusIndex = clamp(index, 0, props.length - 1)\n  const target = inputRefs.value?.[focusIndex]\n\n  if (document.activeElement !== target) {\n    target?.focus()\n  }\n  rAF(() => {\n    // When it is called, the focus may have already been captured by another element.\n    // e.g. typing quickly and deleting.\n    if (!props.readonly && document.activeElement === target) {\n      ;(target as HTMLInputElement | null)?.select()\n    }\n  })\n}\n\nconst blur = () => {\n  const target = inputRefs.value?.find(\n    (input) => document.activeElement === input\n  )\n  target?.blur()\n}\n\nwatch(\n  () => props.modelValue,\n  () => {\n    innerValue.value = initialValue.value\n\n    if (props.validateEvent) {\n      formItem?.validate?.('change').catch(NOOP)\n    }\n  }\n)\n\nwatch(\n  () => props.length,\n  () => {\n    innerValue.value = initialValue.value\n    updateModelValue(false)\n  }\n)\n\nwatch(isFocused, (value) => {\n  if (value) {\n    modelValueOnFocus = props.modelValue\n    return\n  }\n  if (modelValueOnFocus !== props.modelValue) {\n    emit(CHANGE_EVENT, props.modelValue as string)\n  }\n})\n\ndefineExpose({\n  /**\n   * @description HTML input elements array\n   */\n  inputRefs,\n  /**\n   * @description Focus an OTP input field\n   */\n  focus,\n  /**\n   * @description Blur the focused OTP input field\n   */\n  blur,\n})\n</script>\n"],"mappings":"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"}

package/es/components/input-otp/src/input-otp2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"input-otp2.mjs","names":[],"sources":["../../../../../../packages/components/input-otp/src/input-otp.vue"],"sourcesContent":["<template>\n  <div\n    :id=\"inputId\"\n    :class=\"[ns.b(), ns.m(size), ns.m(type), ns.is('disabled', disabled)]\"\n    role=\"group\"\n    :aria-label=\"\n      !isLabeledByFormItem\n        ? ariaLabel || t('el.inputOTP.groupLabel')\n        : undefined\n    \"\n    :aria-labelledby=\"isLabeledByFormItem ? formItem?.labelId : undefined\"\n  >\n    <template v-for=\"(_, index) in length\" :key=\"index\">\n      <label :class=\"ns.e('input-field')\">\n        <input\n          ref=\"inputRefs\"\n          :value=\"innerValue[index]\"\n          :class=\"ns.e('input')\"\n          :type=\"mask ? 'password' : 'text'\"\n          :disabled=\"disabled\"\n          :readonly=\"readonly\"\n          :inputmode=\"inputmode\"\n          autocomplete=\"one-time-code\"\n          :aria-label=\"t('el.inputOTP.defaultLabel', { index: index + 1 })\"\n          @focus=\"handleFocus\"\n          @blur=\"handleBlur\"\n          @click=\"focus(index)\"\n          @keydown=\"handleKeydown($event, index)\"\n          @input=\"handleInput($event, index)\"\n        />\n      </label>\n      <slot\n        v-if=\"($slots.separator || separators[index]) && index < length - 1\"\n        name=\"separator\"\n        :index=\"index\"\n      >\n        <component :is=\"() => separators[index]\" />\n      </slot>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref, watch } from 'vue'\nimport { clamp } from '@vueuse/core'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { NOOP, getEventCode, isFunction, rAF } from '@element-plus/utils'\nimport {\n  useFormDisabled,\n  useFormItem,\n  useFormItemInputId,\n} from '@element-plus/components/form'\nimport {\n  CHANGE_EVENT,\n  EVENT_CODE,\n  UPDATE_MODEL_EVENT,\n} from '@element-plus/constants'\nimport { inputOtpEmits } from './input-otp'\n\nimport type { InputOtpProps } from './input-otp'\n\ndefineOptions({\n  name: 'ElInputOtp',\n})\n\nconst props = withDefaults(defineProps<InputOtpProps>(), {\n  length: 6,\n  validator: () => true,\n  type: 'outlined',\n  size: 'default',\n  disabled: undefined,\n  validateEvent: true,\n})\nconst emit = defineEmits(inputOtpEmits)\n\nconst initialValue = computed(() => {\n  const value = String(props.modelValue ?? '')\n  return Array.from({ length: props.length }, (_, i) => value.charAt(i))\n})\n\nconst separators = computed(() => {\n  const { separator } = props\n  const _separator = isFunction(separator) ? separator : () => separator\n  return Array.from({ length: props.length - 1 }, (_, i) => _separator(i))\n})\n\nconst innerValue = ref<string[]>(initialValue.value)\nconst isFocused = ref(false)\nconst inputRefs = ref<(HTMLInputElement | undefined)[]>([])\n\nconst ns = useNamespace('input-otp')\nconst { t } = useLocale()\nconst { formItem } = useFormItem()\nconst { inputId, isLabeledByFormItem } = useFormItemInputId(props, {\n  formItemContext: formItem,\n})\nconst disabled = useFormDisabled()\nlet modelValueOnFocus = props.modelValue\n\nconst getFirstIndex = (maxIndex: number) => {\n  const index = innerValue.value.findIndex((char, i) => !char && i <= maxIndex)\n  return index === -1 ? maxIndex : index\n}\n\nconst handleFocus = (event: FocusEvent) => {\n  if (inputRefs.value?.includes(event.relatedTarget as any)) {\n    return\n  }\n\n  isFocused.value = true\n  emit('focus', event)\n}\n\nconst handleBlur = (event: FocusEvent) => {\n  if (inputRefs.value?.includes(event.relatedTarget as any)) {\n    return\n  }\n\n  isFocused.value = false\n  emit('blur', event)\n  if (props.validateEvent) {\n    formItem?.validate?.('blur').catch(NOOP)\n  }\n}\n\nconst updateModelValue = (emitFinish = true) => {\n  const value = innerValue.value.join('').slice(0, props.length)\n  if (value !== props.modelValue) {\n    emit(UPDATE_MODEL_EVENT, value)\n    if (emitFinish && value.length === props.length) {\n      emit('finish', value)\n    }\n  }\n}\n\nconst handleKeydown = (event: KeyboardEvent, index: number) => {\n  const code = getEventCode(event)\n  let preventDefault = true\n\n  switch (code) {\n    case EVENT_CODE.backspace:\n      if (props.readonly) break\n      innerValue.value[index] = ''\n      focus(index - 1)\n      updateModelValue()\n      break\n    case EVENT_CODE.delete:\n      if (props.readonly) break\n      innerValue.value[index] = ''\n      focus(index)\n      updateModelValue()\n      break\n    case EVENT_CODE.up:\n    case EVENT_CODE.left:\n      focus(index - 1)\n      break\n    case EVENT_CODE.down:\n    case EVENT_CODE.right:\n      focus(index + 1)\n      break\n    default:\n      preventDefault = false\n  }\n\n  if (preventDefault) {\n    event.preventDefault()\n  }\n}\n\nconst handleInput = (event: Event, index: number) => {\n  const target = event.target as HTMLInputElement\n  const targetIndex = getFirstIndex(index)\n  let focusIndex = targetIndex + 1\n  let value = target.value\n\n  // Safari and Firefox do not trigger the paste event during autofill,\n  // so the paste logic needs to be handled in the input event\n  if (value.length > 1) {\n    const chars = castValues(value, targetIndex)\n\n    // Avoid innerValue inconsistency with the input box value after pasting when char has no change\n    target.value = innerValue.value[index] ?? ''\n\n    chars.forEach((char, i) => (innerValue.value[targetIndex + i] = char))\n    focus(targetIndex + chars.length)\n    updateModelValue()\n    return\n  }\n\n  if (!props.validator(value, targetIndex)) {\n    target.value = innerValue.value[index] ?? ''\n    value = target.value\n    focusIndex = targetIndex\n  }\n\n  innerValue.value[targetIndex] = value\n  if (targetIndex !== index) {\n    target.value = innerValue.value[index] ?? ''\n  }\n  focus(focusIndex)\n  updateModelValue()\n}\n\nconst castValues = (value: InputOtpProps['modelValue'], startIndex = 0) => {\n  const chars = `${value ?? ''}`.split('')\n  const result: string[] = []\n  for (const char of chars) {\n    if (result.length + startIndex >= props.length) {\n      break\n    }\n    if (props.validator(char, result.length + startIndex)) {\n      result.push(char)\n    }\n  }\n  return result\n}\n\nconst focus = (index: number = 0) => {\n  const focusIndex = clamp(index, 0, props.length - 1)\n  const target = inputRefs.value?.[focusIndex]\n\n  if (document.activeElement !== target) {\n    target?.focus()\n  }\n  rAF(() => {\n    // When it is called, the focus may have already been captured by another element.\n    // e.g. typing quickly and deleting.\n    if (!props.readonly && document.activeElement === target) {\n      ;(target as HTMLInputElement | null)?.select()\n    }\n  })\n}\n\nconst blur = () => {\n  const target = inputRefs.value?.find(\n    (input) => document.activeElement === input\n  )\n  target?.blur()\n}\n\nwatch(\n  () => props.modelValue,\n  () => {\n    innerValue.value = initialValue.value\n\n    if (props.validateEvent) {\n      formItem?.validate?.('change').catch(NOOP)\n    }\n  }\n)\n\nwatch(\n  () => props.length,\n  () => {\n    innerValue.value = initialValue.value\n    updateModelValue(false)\n  }\n)\n\nwatch(isFocused, (value) => {\n  if (value) {\n    modelValueOnFocus = props.modelValue\n    return\n  }\n  if (modelValueOnFocus !== props.modelValue) {\n    emit(CHANGE_EVENT, props.modelValue as string)\n  }\n})\n\ndefineExpose({\n  /**\n   * @description HTML input elements array\n   */\n  inputRefs,\n  /**\n   * @description Focus an OTP input field\n   */\n  focus,\n  /**\n   * @description Blur the focused OTP input field\n   */\n  blur,\n})\n</script>\n"],"mappings":""}
+{"version":3,"file":"input-otp2.mjs","names":[],"sources":["../../../../../../packages/components/input-otp/src/input-otp.vue"],"sourcesContent":["<template>\n  <div\n    :id=\"inputId\"\n    :class=\"[ns.b(), ns.m(size), ns.m(type), ns.is('disabled', disabled)]\"\n    role=\"group\"\n    :aria-label=\"\n      !isLabeledByFormItem\n        ? ariaLabel || t('el.inputOTP.groupLabel')\n        : undefined\n    \"\n    :aria-labelledby=\"isLabeledByFormItem ? formItem?.labelId : undefined\"\n  >\n    <template v-for=\"(_, index) in length\" :key=\"index\">\n      <label :class=\"ns.e('input-field')\">\n        <input\n          ref=\"inputRefs\"\n          :value=\"innerValue[index]\"\n          :class=\"ns.e('input')\"\n          :type=\"mask ? 'password' : 'text'\"\n          :disabled=\"disabled\"\n          :readonly=\"readonly\"\n          :inputmode=\"inputmode\"\n          autocomplete=\"one-time-code\"\n          :aria-label=\"t('el.inputOTP.defaultLabel', { index: index + 1 })\"\n          @focus=\"handleFocus\"\n          @blur=\"handleBlur\"\n          @click=\"focus(index)\"\n          @keydown=\"handleKeydown($event, index)\"\n          @input=\"handleInput($event, index)\"\n        />\n      </label>\n      <slot\n        v-if=\"($slots.separator || separators[index]) && index < length - 1\"\n        name=\"separator\"\n        :index=\"index\"\n      >\n        <component :is=\"() => separators[index]\" />\n      </slot>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref, watch } from 'vue'\nimport { clamp } from '@vueuse/core'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { NOOP, getEventCode, isFunction, rAF } from '@element-plus/utils'\nimport {\n  useFormDisabled,\n  useFormItem,\n  useFormItemInputId,\n  useFormSize,\n} from '@element-plus/components/form'\nimport {\n  CHANGE_EVENT,\n  EVENT_CODE,\n  UPDATE_MODEL_EVENT,\n} from '@element-plus/constants'\nimport { inputOtpEmits } from './input-otp'\n\nimport type { InputOtpProps } from './input-otp'\n\ndefineOptions({\n  name: 'ElInputOtp',\n})\n\nconst props = withDefaults(defineProps<InputOtpProps>(), {\n  length: 6,\n  validator: () => true,\n  type: 'outlined',\n  disabled: undefined,\n  validateEvent: true,\n})\nconst emit = defineEmits(inputOtpEmits)\n\nconst initialValue = computed(() => {\n  const value = String(props.modelValue ?? '')\n  return Array.from({ length: props.length }, (_, i) => value.charAt(i))\n})\n\nconst separators = computed(() => {\n  const { separator } = props\n  const _separator = isFunction(separator) ? separator : () => separator\n  return Array.from({ length: props.length - 1 }, (_, i) => _separator(i))\n})\n\nconst innerValue = ref<string[]>(initialValue.value)\nconst isFocused = ref(false)\nconst inputRefs = ref<(HTMLInputElement | undefined)[]>([])\n\nconst ns = useNamespace('input-otp')\nconst { t } = useLocale()\nconst { formItem } = useFormItem()\nconst { inputId, isLabeledByFormItem } = useFormItemInputId(props, {\n  formItemContext: formItem,\n})\nconst size = useFormSize()\nconst disabled = useFormDisabled()\nlet modelValueOnFocus = props.modelValue\n\nconst getFirstIndex = (maxIndex: number) => {\n  const index = innerValue.value.findIndex((char, i) => !char && i <= maxIndex)\n  return index === -1 ? maxIndex : index\n}\n\nconst handleFocus = (event: FocusEvent) => {\n  if (inputRefs.value?.includes(event.relatedTarget as any)) {\n    return\n  }\n\n  isFocused.value = true\n  emit('focus', event)\n}\n\nconst handleBlur = (event: FocusEvent) => {\n  if (inputRefs.value?.includes(event.relatedTarget as any)) {\n    return\n  }\n\n  isFocused.value = false\n  emit('blur', event)\n  if (props.validateEvent) {\n    formItem?.validate?.('blur').catch(NOOP)\n  }\n}\n\nconst updateModelValue = (emitFinish = true) => {\n  const value = innerValue.value.join('').slice(0, props.length)\n  if (value !== props.modelValue) {\n    emit(UPDATE_MODEL_EVENT, value)\n    if (emitFinish && value.length === props.length) {\n      emit('finish', value)\n    }\n  }\n}\n\nconst handleKeydown = (event: KeyboardEvent, index: number) => {\n  const code = getEventCode(event)\n  let preventDefault = true\n\n  switch (code) {\n    case EVENT_CODE.backspace:\n      if (props.readonly) break\n      innerValue.value[index] = ''\n      focus(index - 1)\n      updateModelValue()\n      break\n    case EVENT_CODE.delete:\n      if (props.readonly) break\n      innerValue.value[index] = ''\n      focus(index)\n      updateModelValue()\n      break\n    case EVENT_CODE.up:\n    case EVENT_CODE.left:\n      focus(index - 1)\n      break\n    case EVENT_CODE.down:\n    case EVENT_CODE.right:\n      focus(index + 1)\n      break\n    default:\n      preventDefault = false\n  }\n\n  if (preventDefault) {\n    event.preventDefault()\n  }\n}\n\nconst handleInput = (event: Event, index: number) => {\n  const target = event.target as HTMLInputElement\n  const targetIndex = getFirstIndex(index)\n  let focusIndex = targetIndex + 1\n  let value = target.value\n\n  // Safari and Firefox do not trigger the paste event during autofill,\n  // so the paste logic needs to be handled in the input event\n  if (value.length > 1) {\n    const chars = castValues(value, targetIndex)\n\n    // Avoid innerValue inconsistency with the input box value after pasting when char has no change\n    target.value = innerValue.value[index] ?? ''\n\n    chars.forEach((char, i) => (innerValue.value[targetIndex + i] = char))\n    focus(targetIndex + chars.length)\n    updateModelValue()\n    return\n  }\n\n  if (!props.validator(value, targetIndex)) {\n    target.value = innerValue.value[index] ?? ''\n    value = target.value\n    focusIndex = targetIndex\n  }\n\n  innerValue.value[targetIndex] = value\n  if (targetIndex !== index) {\n    target.value = innerValue.value[index] ?? ''\n  }\n  focus(focusIndex)\n  updateModelValue()\n}\n\nconst castValues = (value: InputOtpProps['modelValue'], startIndex = 0) => {\n  const chars = `${value ?? ''}`.split('')\n  const result: string[] = []\n  for (const char of chars) {\n    if (result.length + startIndex >= props.length) {\n      break\n    }\n    if (props.validator(char, result.length + startIndex)) {\n      result.push(char)\n    }\n  }\n  return result\n}\n\nconst focus = (index: number = 0) => {\n  const focusIndex = clamp(index, 0, props.length - 1)\n  const target = inputRefs.value?.[focusIndex]\n\n  if (document.activeElement !== target) {\n    target?.focus()\n  }\n  rAF(() => {\n    // When it is called, the focus may have already been captured by another element.\n    // e.g. typing quickly and deleting.\n    if (!props.readonly && document.activeElement === target) {\n      ;(target as HTMLInputElement | null)?.select()\n    }\n  })\n}\n\nconst blur = () => {\n  const target = inputRefs.value?.find(\n    (input) => document.activeElement === input\n  )\n  target?.blur()\n}\n\nwatch(\n  () => props.modelValue,\n  () => {\n    innerValue.value = initialValue.value\n\n    if (props.validateEvent) {\n      formItem?.validate?.('change').catch(NOOP)\n    }\n  }\n)\n\nwatch(\n  () => props.length,\n  () => {\n    innerValue.value = initialValue.value\n    updateModelValue(false)\n  }\n)\n\nwatch(isFocused, (value) => {\n  if (value) {\n    modelValueOnFocus = props.modelValue\n    return\n  }\n  if (modelValueOnFocus !== props.modelValue) {\n    emit(CHANGE_EVENT, props.modelValue as string)\n  }\n})\n\ndefineExpose({\n  /**\n   * @description HTML input elements array\n   */\n  inputRefs,\n  /**\n   * @description Focus an OTP input field\n   */\n  focus,\n  /**\n   * @description Blur the focused OTP input field\n   */\n  blur,\n})\n</script>\n"],"mappings":""}

package/es/components/input-tag/src/input-tag.vue.d.ts

@@ -24,20 +24,20 @@ declare const __VLS_base: _$vue.DefineComponent<InputTagProps, {
   focus: () => void;
   blur: () => void;
 }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+  clear: () => void;
   "update:modelValue": (value?: string[] | undefined) => void;
   change: (value?: string[] | undefined) => void;
   input: (value: string) => void;
-  clear: () => void;
   focus: (evt: FocusEvent) => void;
   blur: (evt: FocusEvent) => void;
   "add-tag": (value: string | string[]) => void;
   "remove-tag": (value: string, index: number) => void;
   "drag-tag": (oldIndex: number, newIndex: number, value: string) => void;
 }, string, _$vue.PublicProps, Readonly<InputTagProps> & Readonly<{
+  onClear?: (() => any) | undefined;
   "onUpdate:modelValue"?: ((value?: string[] | undefined) => any) | undefined;
   onChange?: ((value?: string[] | undefined) => any) | undefined;
   onInput?: ((value: string) => any) | undefined;
-  onClear?: (() => any) | undefined;
   onFocus?: ((evt: FocusEvent) => any) | undefined;
   onBlur?: ((evt: FocusEvent) => any) | undefined;
   "onAdd-tag"?: ((value: string | string[]) => any) | undefined;

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

@@ -198,7 +198,7 @@ declare const mentionProps: {
   popperStyle: EpPropFinalized<(new (...args: any[]) => string | false | _$vue.CSSProperties | _$vue.StyleValue[]) | (() => _$vue.StyleValue) | (((new (...args: any[]) => string | false | _$vue.CSSProperties | _$vue.StyleValue[]) | (() => _$vue.StyleValue)) | null)[], unknown, unknown, undefined, boolean>;
   popperOptions: EpPropFinalized<(new (...args: any[]) => Partial<Options>) | (() => Partial<Options>) | (((new (...args: any[]) => Partial<Options>) | (() => Partial<Options>)) | null)[], unknown, unknown, () => Partial<Options>, boolean>;
   props: EpPropFinalized<(new (...args: any[]) => MentionOptionProps) | (() => MentionOptionProps) | (((new (...args: any[]) => MentionOptionProps) | (() => MentionOptionProps)) | null)[], unknown, unknown, () => Required<MentionOptionProps>, boolean>;
-  inputmode: EpPropFinalized<(new (...args: any[]) => "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal") | (() => "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal" | undefined) | (((new (...args: any[]) => "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal") | (() => "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal" | undefined)) | null)[], unknown, unknown, undefined, boolean>;
+  inputmode: EpPropFinalized<(new (...args: any[]) => "none" | "text" | "email" | "search" | "tel" | "url" | "numeric" | "decimal") | (() => "none" | "text" | "email" | "search" | "tel" | "url" | "numeric" | "decimal" | undefined) | (((new (...args: any[]) => "none" | "text" | "email" | "search" | "tel" | "url" | "numeric" | "decimal") | (() => "none" | "text" | "email" | "search" | "tel" | "url" | "numeric" | "decimal" | undefined)) | null)[], unknown, unknown, undefined, boolean>;
   name: StringConstructor;
   ariaLabel: StringConstructor;
   id: EpPropFinalized<StringConstructor, unknown, unknown, undefined, boolean>;

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

@@ -103,9 +103,9 @@ declare const _default: _$vue.DefineComponent<ExtractPropTypes<{
   readonly hideTimeout: EpPropFinalized<NumberConstructor, unknown, unknown, 300, boolean>;
   readonly persistent: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
 }>> & Readonly<{
+  onOpen?: ((index: string, indexPath: string[]) => any) | undefined;
   onClose?: ((index: string, indexPath: string[]) => any) | undefined;
   onSelect?: ((index: string, indexPath: string[], item: MenuItemClicked, routerResult?: Promise<void | NavigationFailure> | undefined) => any) | undefined;
-  onOpen?: ((index: string, indexPath: string[]) => any) | undefined;
 }>, {
   readonly collapse: boolean;
   readonly ellipsis: EpPropMergeType<BooleanConstructor, unknown, unknown>;

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

@@ -130,7 +130,7 @@ declare const messageProps: {
     readonly prototype: any;
   }) | null)[], unknown, unknown, undefined, boolean>;
   readonly showClose: EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
-  readonly type: EpPropFinalized<StringConstructor, "info" | "primary" | "success" | "warning" | "error", unknown, "info", boolean>;
+  readonly type: EpPropFinalized<StringConstructor, "error" | "info" | "primary" | "success" | "warning", unknown, "info", boolean>;
   readonly plain: EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
   readonly offset: EpPropFinalized<NumberConstructor, unknown, unknown, 16, boolean>;
   readonly placement: EpPropFinalized<StringConstructor, "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right", unknown, undefined, boolean>;

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

@@ -18,10 +18,10 @@ declare const __VLS_base: _$vue.DefineComponent<MessageProps, {
   onDestroy?: (() => any) | undefined;
 }>, {
   type: MessageType;
-  message: string | _$vue.VNode | (() => _$vue.VNode);
   zIndex: number;
-  offset: number;
   onClose: () => void;
+  message: string | _$vue.VNode | (() => _$vue.VNode);
+  offset: number;
   id: string;
   icon: IconPropType;
   placement: MessagePlacement;

package/es/components/message-box/src/index.vue.d.ts

@@ -229,7 +229,7 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   autofocus: _$vue.Ref<boolean, boolean>;
   title: _$vue.Ref<string | undefined, string | undefined>;
   message: _$vue.Ref<string, string>;
-  type: _$vue.Ref<"" | "info" | "primary" | "success" | "warning" | "error", "" | "info" | "primary" | "success" | "warning" | "error">;
+  type: _$vue.Ref<"" | "error" | "info" | "primary" | "success" | "warning", "" | "error" | "info" | "primary" | "success" | "warning">;
   icon: _$vue.Ref<string | _$vue.FunctionalComponent<any, {}, any, {}> | {
     new (...args: any[]): any;
     __isFragment?: never;
@@ -4578,10 +4578,10 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   onVanish?: ((...args: any[]) => any) | undefined;
 }>, {
   center: boolean;
+  closeOnPressEscape: boolean;
   container: string;
   overflow: boolean;
   closeOnClickModal: boolean;
-  closeOnPressEscape: boolean;
   lockScroll: boolean;
   modal: boolean;
   draggable: boolean;
@@ -4748,10 +4748,10 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   }, {}, {}, {}, string, _$vue.ComponentProvideOptions, true, {}, any>;
   ElInput: SFCWithInstall<{
     new (...args: any[]): _$vue.CreateComponentPublicInstanceWithMixins<Readonly<InputProps> & Readonly<{
+      onClear?: ((evt: MouseEvent | undefined) => any) | undefined;
       "onUpdate:modelValue"?: ((value: string) => any) | undefined;
       onChange?: ((value: string, evt?: Event | undefined) => any) | undefined;
       onInput?: ((value: string) => any) | undefined;
-      onClear?: ((evt: MouseEvent | undefined) => any) | undefined;
       onFocus?: ((evt: FocusEvent) => any) | undefined;
       onBlur?: ((evt: FocusEvent) => any) | undefined;
       onMouseleave?: ((evt: MouseEvent) => any) | undefined;
@@ -4774,10 +4774,10 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       clear: (evt?: MouseEvent) => void;
       resizeTextarea: () => void;
     }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+      clear: (evt: MouseEvent | undefined) => void;
       "update:modelValue": (value: string) => void;
       change: (value: string, evt?: Event | undefined) => void;
       input: (value: string) => void;
-      clear: (evt: MouseEvent | undefined) => void;
       focus: (evt: FocusEvent) => void;
       blur: (evt: FocusEvent) => void;
       mouseleave: (evt: MouseEvent) => void;
@@ -4806,10 +4806,10 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       M: {};
       Defaults: {};
     }, Readonly<InputProps> & Readonly<{
+      onClear?: ((evt: MouseEvent | undefined) => any) | undefined;
       "onUpdate:modelValue"?: ((value: string) => any) | undefined;
       onChange?: ((value: string, evt?: Event | undefined) => any) | undefined;
       onInput?: ((value: string) => any) | undefined;
-      onClear?: ((evt: MouseEvent | undefined) => any) | undefined;
       onFocus?: ((evt: FocusEvent) => any) | undefined;
       onBlur?: ((evt: FocusEvent) => any) | undefined;
       onMouseleave?: ((evt: MouseEvent) => any) | undefined;
@@ -4848,10 +4848,10 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     __isTeleport?: never;
     __isSuspense?: never;
   } & _$vue.ComponentOptionsBase<Readonly<InputProps> & Readonly<{
+    onClear?: ((evt: MouseEvent | undefined) => any) | undefined;
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
     onChange?: ((value: string, evt?: Event | undefined) => any) | undefined;
     onInput?: ((value: string) => any) | undefined;
-    onClear?: ((evt: MouseEvent | undefined) => any) | undefined;
     onFocus?: ((evt: FocusEvent) => any) | undefined;
     onBlur?: ((evt: FocusEvent) => any) | undefined;
     onMouseleave?: ((evt: MouseEvent) => any) | undefined;
@@ -4874,10 +4874,10 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     clear: (evt?: MouseEvent) => void;
     resizeTextarea: () => void;
   }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+    clear: (evt: MouseEvent | undefined) => void;
     "update:modelValue": (value: string) => void;
     change: (value: string, evt?: Event | undefined) => void;
     input: (value: string) => void;
-    clear: (evt: MouseEvent | undefined) => void;
     focus: (evt: FocusEvent) => void;
     blur: (evt: FocusEvent) => void;
     mouseleave: (evt: MouseEvent) => void;

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

@@ -112,7 +112,7 @@ declare const notificationProps: {
   readonly position: EpPropFinalized<StringConstructor, "top-left" | "top-right" | "bottom-left" | "bottom-right", unknown, "top-right", boolean>;
   readonly showClose: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly title: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
-  readonly type: EpPropFinalized<StringConstructor, "" | "info" | "primary" | "success" | "warning" | "error", unknown, "", boolean>;
+  readonly type: EpPropFinalized<StringConstructor, "" | "error" | "info" | "primary" | "success" | "warning", unknown, "", boolean>;
   readonly zIndex: NumberConstructor;
   readonly closeIcon: EpPropFinalized<(new (...args: any[]) => (string | _$vue.Component) & {}) | (() => string | _$vue.Component) | (((new (...args: any[]) => (string | _$vue.Component) & {}) | (() => string | _$vue.Component)) | null)[], unknown, unknown, _$vue.DefineComponent<{}, void, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<{}>, {}, {}, {}, {}, string, _$vue.ComponentProvideOptions, true, {}, any>, boolean>;
 };