@element-plus/nightly 0.0.20260623 → 0.0.20260625

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.d.ts

@@ -127,7 +127,7 @@ declare const inputTagProps: {
   readonly max: NumberConstructor;
   readonly tagType: {
     readonly default: "info";
-    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "primary" | "success" | "warning" | "info" | "danger", unknown>>;
+    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "primary" | "success" | "info" | "warning" | "danger", unknown>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     readonly __epPropKey: true;

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

@@ -24,9 +24,9 @@ declare const __VLS_base: _$vue.DefineComponent<InputTagProps, {
   focus: () => void;
   blur: () => void;
 }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+  change: (value?: string[] | undefined) => void;
   clear: () => void;
   "update:modelValue": (value?: string[] | undefined) => void;
-  change: (value?: string[] | undefined) => void;
   focus: (evt: FocusEvent) => void;
   blur: (evt: FocusEvent) => void;
   input: (value: string) => void;
@@ -34,9 +34,9 @@ declare const __VLS_base: _$vue.DefineComponent<InputTagProps, {
   "remove-tag": (value: string, index: number) => void;
   "drag-tag": (oldIndex: number, newIndex: number, value: string) => void;
 }, string, _$vue.PublicProps, Readonly<InputTagProps> & Readonly<{
+  onChange?: ((value?: string[] | undefined) => any) | undefined;
   onClear?: (() => any) | undefined;
   "onUpdate:modelValue"?: ((value?: string[] | undefined) => any) | undefined;
-  onChange?: ((value?: string[] | undefined) => any) | undefined;
   onFocus?: ((evt: FocusEvent) => any) | undefined;
   onBlur?: ((evt: FocusEvent) => any) | undefined;
   onInput?: ((value: string) => any) | undefined;
@@ -44,8 +44,8 @@ declare const __VLS_base: _$vue.DefineComponent<InputTagProps, {
   "onRemove-tag"?: ((value: string, index: number) => any) | undefined;
   "onDrag-tag"?: ((oldIndex: number, newIndex: number, value: string) => any) | undefined;
 }>, {
-  id: string;
   disabled: boolean;
+  id: string;
   tabindex: string | number;
   validateEvent: boolean;
   effect: PopperEffect;
@@ -53,7 +53,7 @@ declare const __VLS_base: _$vue.DefineComponent<InputTagProps, {
   clearIcon: IconPropType;
   saveOnBlur: boolean;
   trigger: "Enter" | "Space";
-  tagType: "primary" | "success" | "warning" | "info" | "danger";
+  tagType: "primary" | "success" | "info" | "warning" | "danger";
   tagEffect: "dark" | "light" | "plain";
   delimiter: string | RegExp;
   maxCollapseTags: number;

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

@@ -35,7 +35,7 @@ interface LinkProps {
  * @deprecated Removed after 3.0.0, Use `LinkProps` instead.
  */
 declare const linkProps: {
-  readonly type: EpPropFinalized<StringConstructor, "default" | "primary" | "success" | "warning" | "info" | "danger", unknown, undefined, boolean>;
+  readonly type: EpPropFinalized<StringConstructor, "primary" | "default" | "success" | "info" | "warning" | "danger", unknown, undefined, boolean>;
   readonly underline: EpPropFinalized<readonly [BooleanConstructor, StringConstructor], boolean | "always" | "never" | "hover", unknown, undefined, boolean>;
   readonly disabled: BooleanConstructor;
   readonly href: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;

package/es/components/mention/style/css.mjs

@@ -1,5 +1,5 @@
 import "../../base/style/css.mjs";
-import "../../tooltip/style/css.mjs";
 import "../../input/style/css.mjs";
 import "../../scrollbar/style/css.mjs";
+import "../../tooltip/style/css.mjs";
 import "@element-plus/nightly/theme-chalk/el-mention.css";

package/es/components/mention/style/index.mjs

@@ -1,5 +1,5 @@
 import "../../base/style/index.mjs";
-import "../../tooltip/style/index.mjs";
 import "../../input/style/index.mjs";
 import "../../scrollbar/style/index.mjs";
+import "../../tooltip/style/index.mjs";
 import "@element-plus/nightly/theme-chalk/src/mention.scss";

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

@@ -12,7 +12,7 @@ declare const menuProps: {
   readonly defaultOpeneds: EpPropFinalized<(new (...args: any[]) => string[]) | (() => string[]) | (((new (...args: any[]) => string[]) | (() => string[])) | null)[], unknown, unknown, () => [], boolean>;
   readonly uniqueOpened: BooleanConstructor;
   readonly router: BooleanConstructor;
-  readonly menuTrigger: EpPropFinalized<StringConstructor, "hover" | "click", unknown, "hover", boolean>;
+  readonly menuTrigger: EpPropFinalized<StringConstructor, "click" | "hover", unknown, "hover", boolean>;
   readonly collapse: BooleanConstructor;
   readonly backgroundColor: StringConstructor;
   readonly textColor: StringConstructor;
@@ -48,7 +48,7 @@ declare const _default: _$vue.DefineComponent<ExtractPropTypes<{
   readonly defaultOpeneds: EpPropFinalized<(new (...args: any[]) => string[]) | (() => string[]) | (((new (...args: any[]) => string[]) | (() => string[])) | null)[], unknown, unknown, () => [], boolean>;
   readonly uniqueOpened: BooleanConstructor;
   readonly router: BooleanConstructor;
-  readonly menuTrigger: EpPropFinalized<StringConstructor, "hover" | "click", unknown, "hover", boolean>;
+  readonly menuTrigger: EpPropFinalized<StringConstructor, "click" | "hover", unknown, "hover", boolean>;
   readonly collapse: BooleanConstructor;
   readonly backgroundColor: StringConstructor;
   readonly textColor: StringConstructor;
@@ -81,7 +81,7 @@ declare const _default: _$vue.DefineComponent<ExtractPropTypes<{
   readonly defaultOpeneds: EpPropFinalized<(new (...args: any[]) => string[]) | (() => string[]) | (((new (...args: any[]) => string[]) | (() => string[])) | null)[], unknown, unknown, () => [], boolean>;
   readonly uniqueOpened: BooleanConstructor;
   readonly router: BooleanConstructor;
-  readonly menuTrigger: EpPropFinalized<StringConstructor, "hover" | "click", unknown, "hover", boolean>;
+  readonly menuTrigger: EpPropFinalized<StringConstructor, "click" | "hover", unknown, "hover", boolean>;
   readonly collapse: BooleanConstructor;
   readonly backgroundColor: StringConstructor;
   readonly textColor: StringConstructor;
@@ -115,7 +115,7 @@ declare const _default: _$vue.DefineComponent<ExtractPropTypes<{
   readonly hideTimeout: number;
   readonly defaultActive: string;
   readonly defaultOpeneds: string[];
-  readonly menuTrigger: EpPropMergeType<StringConstructor, "hover" | "click", unknown>;
+  readonly menuTrigger: EpPropMergeType<StringConstructor, "click" | "hover", unknown>;
   readonly collapseTransition: EpPropMergeType<BooleanConstructor, unknown, unknown>;
   readonly popperOffset: number;
   readonly ellipsisIcon: EpPropMergeType<(new (...args: any[]) => (string | Component) & {}) | (() => string | Component) | (((new (...args: any[]) => (string | Component) & {}) | (() => string | Component)) | null)[], 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, "primary" | "success" | "warning" | "info" | "error", unknown, "info", boolean>;
+  readonly type: EpPropFinalized<StringConstructor, "primary" | "success" | "info" | "warning" | "error", unknown, "info", boolean>;
   readonly plain: EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
   readonly offset: EpPropFinalized<NumberConstructor, unknown, unknown, 16, boolean>;
   readonly placement: EpPropFinalized<StringConstructor, "bottom" | "top" | "top-left" | "top-right" | "bottom-left" | "bottom-right", unknown, undefined, boolean>;

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

@@ -17,15 +17,15 @@ declare const __VLS_base: _$vue.DefineComponent<MessageProps, {
 }, string, _$vue.PublicProps, Readonly<MessageProps> & Readonly<{
   onDestroy?: (() => any) | undefined;
 }>, {
-  id: string;
   type: MessageType;
+  id: string;
+  icon: IconPropType;
   zIndex: number;
   offset: number;
   placement: MessagePlacement;
-  icon: IconPropType;
   message: string | _$vue.VNode | (() => _$vue.VNode);
-  onClose: () => void;
   showClose: boolean;
+  onClose: () => void;
   plain: boolean;
   customClass: string;
   dangerouslyUseHTMLString: boolean;

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<"" | "primary" | "success" | "warning" | "info" | "error", "" | "primary" | "success" | "warning" | "info" | "error">;
+  type: _$vue.Ref<"" | "primary" | "success" | "info" | "warning" | "error", "" | "primary" | "success" | "info" | "warning" | "error">;
   icon: _$vue.Ref<string | _$vue.FunctionalComponent<any, {}, any, {}> | {
     new (...args: any[]): any;
     __isFragment?: never;
@@ -4031,8 +4031,8 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   dangerouslyUseHTMLString: _$vue.Ref<boolean, boolean>;
   confirmButtonText: _$vue.Ref<string, string>;
   cancelButtonText: _$vue.Ref<string, string>;
-  confirmButtonType: _$vue.Ref<"" | "default" | "text" | "primary" | "success" | "warning" | "info" | "danger", "" | "default" | "text" | "primary" | "success" | "warning" | "info" | "danger">;
-  cancelButtonType: _$vue.Ref<"" | "default" | "text" | "primary" | "success" | "warning" | "info" | "danger", "" | "default" | "text" | "primary" | "success" | "warning" | "info" | "danger">;
+  confirmButtonType: _$vue.Ref<"" | "primary" | "default" | "success" | "info" | "warning" | "danger" | "text", "" | "primary" | "default" | "success" | "info" | "warning" | "danger" | "text">;
+  cancelButtonType: _$vue.Ref<"" | "primary" | "default" | "success" | "info" | "warning" | "danger" | "text", "" | "primary" | "default" | "success" | "info" | "warning" | "danger" | "text">;
   confirmButtonLoading: _$vue.Ref<boolean, boolean>;
   cancelButtonLoading: _$vue.Ref<boolean, boolean>;
   confirmButtonLoadingIcon: _$vue.Ref<string | _$vue.FunctionalComponent<any, {}, any, {}> | {
@@ -4578,14 +4578,14 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   onVanish?: ((...args: any[]) => any) | undefined;
 }>, {
   center: boolean;
-  container: string;
-  overflow: boolean;
   closeOnClickModal: boolean;
   closeOnPressEscape: boolean;
   lockScroll: boolean;
   modal: boolean;
   draggable: boolean;
+  overflow: boolean;
   showClose: boolean;
+  container: string;
   roundButton: boolean;
   closeOnHashChange: boolean;
   boxType: MessageBoxType;
@@ -4601,7 +4601,7 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     }>, {
       ref: _$vue.Ref<HTMLButtonElement | undefined, HTMLButtonElement | undefined>;
       size: _$vue.ComputedRef<"" | "default" | "small" | "large">;
-      type: _$vue.ComputedRef<"" | "default" | "text" | "primary" | "success" | "warning" | "info" | "danger">;
+      type: _$vue.ComputedRef<"primary" | "" | "default" | "success" | "info" | "warning" | "danger" | "text">;
       disabled: _$vue.ComputedRef<boolean>;
       shouldAddSpace: _$vue.ComputedRef<boolean>;
     }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
@@ -4609,6 +4609,7 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     }, _$vue.PublicProps, {
       disabled: boolean;
       type: ButtonType;
+      tag: string | _$vue.Component;
       text: boolean;
       round: boolean;
       dashed: boolean;
@@ -4616,7 +4617,6 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       loadingIcon: IconPropType;
       plain: boolean;
       autoInsertSpace: boolean;
-      tag: string | _$vue.Component;
     }, false, {}, {}, _$vue.GlobalComponents, _$vue.GlobalDirectives, string, {}, any, _$vue.ComponentProvideOptions, {
       P: {};
       B: {};
@@ -4629,12 +4629,13 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     }>, {
       ref: _$vue.Ref<HTMLButtonElement | undefined, HTMLButtonElement | undefined>;
       size: _$vue.ComputedRef<"" | "default" | "small" | "large">;
-      type: _$vue.ComputedRef<"" | "default" | "text" | "primary" | "success" | "warning" | "info" | "danger">;
+      type: _$vue.ComputedRef<"primary" | "" | "default" | "success" | "info" | "warning" | "danger" | "text">;
       disabled: _$vue.ComputedRef<boolean>;
       shouldAddSpace: _$vue.ComputedRef<boolean>;
     }, {}, {}, {}, {
       disabled: boolean;
       type: ButtonType;
+      tag: string | _$vue.Component;
       text: boolean;
       round: boolean;
       dashed: boolean;
@@ -4642,7 +4643,6 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       loadingIcon: IconPropType;
       plain: boolean;
       autoInsertSpace: boolean;
-      tag: string | _$vue.Component;
     }>;
     __isFragment?: never;
     __isTeleport?: never;
@@ -4652,7 +4652,7 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   }>, {
     ref: _$vue.Ref<HTMLButtonElement | undefined, HTMLButtonElement | undefined>;
     size: _$vue.ComputedRef<"" | "default" | "small" | "large">;
-    type: _$vue.ComputedRef<"" | "default" | "text" | "primary" | "success" | "warning" | "info" | "danger">;
+    type: _$vue.ComputedRef<"primary" | "" | "default" | "success" | "info" | "warning" | "danger" | "text">;
     disabled: _$vue.ComputedRef<boolean>;
     shouldAddSpace: _$vue.ComputedRef<boolean>;
   }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
@@ -4660,6 +4660,7 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   }, string, {
     disabled: boolean;
     type: ButtonType;
+    tag: string | _$vue.Component;
     text: boolean;
     round: boolean;
     dashed: boolean;
@@ -4667,7 +4668,6 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     loadingIcon: IconPropType;
     plain: boolean;
     autoInsertSpace: boolean;
-    tag: string | _$vue.Component;
   }, {}, string, {}, _$vue.GlobalComponents, _$vue.GlobalDirectives, string, _$vue.ComponentProvideOptions> & _$vue.VNodeProps & _$vue.AllowedComponentProps & _$vue.ComponentCustomProps & (new () => {
     $slots: {
       loading?: (props: {}) => any;
@@ -4680,7 +4680,7 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     setPropsDefaults: (defaults: {
       readonly size?: "" | "default" | "small" | "large" | (() => "" | "default" | "small" | "large") | undefined;
       readonly disabled?: boolean | (() => boolean) | undefined;
-      readonly type?: "" | "default" | "text" | "primary" | "success" | "warning" | "info" | "danger" | (() => "" | "default" | "text" | "primary" | "success" | "warning" | "info" | "danger") | undefined;
+      readonly type?: "" | "primary" | "default" | "success" | "info" | "warning" | "danger" | "text" | (() => "" | "primary" | "default" | "success" | "info" | "warning" | "danger" | "text") | undefined;
       readonly icon?: string | _$vue.FunctionalComponent<any, {}, any, {}> | {
         new (...args: any[]): any;
         __isFragment?: never;
@@ -4748,9 +4748,9 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   }, {}, {}, {}, string, _$vue.ComponentProvideOptions, true, {}, any>;
   ElInput: SFCWithInstall<{
     new (...args: any[]): _$vue.CreateComponentPublicInstanceWithMixins<Readonly<InputProps> & Readonly<{
+      onChange?: ((value: string, evt?: Event | undefined) => any) | undefined;
       onClear?: ((evt: MouseEvent | undefined) => any) | undefined;
       "onUpdate:modelValue"?: ((value: string) => any) | undefined;
-      onChange?: ((value: string, evt?: Event | undefined) => any) | undefined;
       onFocus?: ((evt: FocusEvent) => any) | undefined;
       onBlur?: ((evt: FocusEvent) => any) | undefined;
       onInput?: ((value: string) => any) | undefined;
@@ -4774,9 +4774,9 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       clear: (evt?: MouseEvent) => void;
       resizeTextarea: () => void;
     }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+      change: (value: string, evt?: Event | undefined) => void;
       clear: (evt: MouseEvent | undefined) => void;
       "update:modelValue": (value: string) => void;
-      change: (value: string, evt?: Event | undefined) => void;
       focus: (evt: FocusEvent) => void;
       blur: (evt: FocusEvent) => void;
       input: (value: string) => void;
@@ -4787,11 +4787,11 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       compositionupdate: (evt: CompositionEvent) => void;
       compositionend: (evt: CompositionEvent) => void;
     }, _$vue.PublicProps, {
-      modelValue: string | number | null;
       disabled: boolean;
+      type: InputType;
+      modelValue: string | number | null;
       tabindex: string | number;
       validateEvent: boolean;
-      type: InputType;
       modelModifiers: InputModelModifiers;
       autocomplete: string;
       clearIcon: IconPropType;
@@ -4806,9 +4806,9 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       M: {};
       Defaults: {};
     }, Readonly<InputProps> & Readonly<{
+      onChange?: ((value: string, evt?: Event | undefined) => any) | undefined;
       onClear?: ((evt: MouseEvent | undefined) => any) | undefined;
       "onUpdate:modelValue"?: ((value: string) => any) | undefined;
-      onChange?: ((value: string, evt?: Event | undefined) => any) | undefined;
       onFocus?: ((evt: FocusEvent) => any) | undefined;
       onBlur?: ((evt: FocusEvent) => any) | undefined;
       onInput?: ((value: string) => any) | undefined;
@@ -4832,11 +4832,11 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
       clear: (evt?: MouseEvent) => void;
       resizeTextarea: () => void;
     }, {}, {}, {}, {
-      modelValue: string | number | null;
       disabled: boolean;
+      type: InputType;
+      modelValue: string | number | null;
       tabindex: string | number;
       validateEvent: boolean;
-      type: InputType;
       modelModifiers: InputModelModifiers;
       autocomplete: string;
       clearIcon: IconPropType;
@@ -4848,9 +4848,9 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     __isTeleport?: never;
     __isSuspense?: never;
   } & _$vue.ComponentOptionsBase<Readonly<InputProps> & Readonly<{
+    onChange?: ((value: string, evt?: Event | undefined) => any) | undefined;
     onClear?: ((evt: MouseEvent | undefined) => any) | undefined;
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
-    onChange?: ((value: string, evt?: Event | undefined) => any) | undefined;
     onFocus?: ((evt: FocusEvent) => any) | undefined;
     onBlur?: ((evt: FocusEvent) => any) | undefined;
     onInput?: ((value: string) => any) | undefined;
@@ -4874,9 +4874,9 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     clear: (evt?: MouseEvent) => void;
     resizeTextarea: () => void;
   }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+    change: (value: string, evt?: Event | undefined) => void;
     clear: (evt: MouseEvent | undefined) => void;
     "update:modelValue": (value: string) => void;
-    change: (value: string, evt?: Event | undefined) => void;
     focus: (evt: FocusEvent) => void;
     blur: (evt: FocusEvent) => void;
     input: (value: string) => void;
@@ -4887,11 +4887,11 @@ declare const __VLS_export: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     compositionupdate: (evt: CompositionEvent) => void;
     compositionend: (evt: CompositionEvent) => void;
   }, string, {
-    modelValue: string | number | null;
     disabled: boolean;
+    type: InputType;
+    modelValue: string | number | null;
     tabindex: string | number;
     validateEvent: boolean;
-    type: InputType;
     modelModifiers: InputModelModifiers;
     autocomplete: string;
     clearIcon: IconPropType;

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, "" | "primary" | "success" | "warning" | "info" | "error", unknown, "", boolean>;
+  readonly type: EpPropFinalized<StringConstructor, "" | "primary" | "success" | "info" | "warning" | "error", 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>;
 };

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

@@ -16,13 +16,13 @@ declare const __VLS_base: _$vue.DefineComponent<NotificationProps, {
 }, string, _$vue.PublicProps, Readonly<NotificationProps> & Readonly<{
   onDestroy?: (() => any) | undefined;
 }>, {
-  id: string;
   type: NotificationType;
+  id: string;
+  title: string;
   offset: number;
   onClick: () => void;
   position: NotificationPosition;
   message: string | _$vue.VNode | (() => _$vue.VNode);
-  title: string;
   closeIcon: IconPropType;
   showClose: boolean;
   customClass: string;

package/es/components/page-header/src/page-header.vue.d.ts

@@ -22,8 +22,8 @@ declare const __VLS_base: _$vue.DefineComponent<PageHeaderProps, {}, {}, {}, {},
 }, string, _$vue.PublicProps, Readonly<PageHeaderProps> & Readonly<{
   onBack?: (() => any) | undefined;
 }>, {
-  content: string;
   icon: IconPropType;
+  content: string;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

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

@@ -136,9 +136,9 @@ declare const _default: _$vue.DefineComponent<ExtractPropTypes<{
 }>, {
   readonly layout: string;
   readonly disabled: boolean;
+  readonly small: boolean;
   readonly popperClass: string;
   readonly teleported: EpPropMergeType<BooleanConstructor, unknown, unknown>;
-  readonly small: boolean;
   readonly background: boolean;
   readonly pagerCount: number;
   readonly pageSizes: number[];

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

@@ -79,8 +79,8 @@ declare const popconfirmProps: {
   readonly title: StringConstructor;
   readonly confirmButtonText: StringConstructor;
   readonly cancelButtonText: StringConstructor;
-  readonly confirmButtonType: EpPropFinalized<StringConstructor, "" | "default" | "text" | "primary" | "success" | "warning" | "info" | "danger", unknown, "primary", boolean>;
-  readonly cancelButtonType: EpPropFinalized<StringConstructor, "" | "default" | "text" | "primary" | "success" | "warning" | "info" | "danger", unknown, "text", boolean>;
+  readonly confirmButtonType: EpPropFinalized<StringConstructor, "" | "primary" | "default" | "success" | "info" | "warning" | "danger" | "text", unknown, "primary", boolean>;
+  readonly cancelButtonType: EpPropFinalized<StringConstructor, "" | "primary" | "default" | "success" | "info" | "warning" | "danger" | "text", unknown, "text", boolean>;
   readonly icon: 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>;
   readonly iconColor: EpPropFinalized<StringConstructor, unknown, unknown, "#f90", boolean>;
   readonly hideIcon: BooleanConstructor;

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

@@ -24,9 +24,9 @@ declare const __VLS_base: _$vue.DefineComponent<PopconfirmProps, {
   onConfirm?: ((e: MouseEvent) => any) | undefined;
   onCancel?: ((e: MouseEvent) => any) | undefined;
 }>, {
+  icon: IconPropType;
   teleported: boolean;
   effect: PopperEffect;
-  icon: IconPropType;
   width: string | number;
   hideAfter: number;
   confirmButtonType: ButtonType;

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

@@ -112,9 +112,9 @@ interface PopoverProps {
  * @deprecated Removed after 3.0.0, Use `PopoverProps` instead.
  */
 declare const popoverProps: {
-  readonly trigger: EpPropFinalized<(new (...args: any[]) => "focus" | "hover" | "click" | "contextmenu" | TooltipTriggerType[]) | (() => Arrayable<TooltipTriggerType>) | (((new (...args: any[]) => "focus" | "hover" | "click" | "contextmenu" | TooltipTriggerType[]) | (() => Arrayable<TooltipTriggerType>)) | null)[], unknown, unknown, "hover", boolean>;
+  readonly trigger: EpPropFinalized<(new (...args: any[]) => "focus" | "click" | "hover" | "contextmenu" | TooltipTriggerType[]) | (() => Arrayable<TooltipTriggerType>) | (((new (...args: any[]) => "focus" | "click" | "hover" | "contextmenu" | TooltipTriggerType[]) | (() => Arrayable<TooltipTriggerType>)) | null)[], unknown, unknown, "hover", boolean>;
   readonly triggerKeys: EpPropFinalized<(new (...args: any[]) => string[]) | (() => string[]) | (((new (...args: any[]) => string[]) | (() => string[])) | null)[], unknown, unknown, () => string[], boolean>;
-  readonly 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$1) | (((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$1)) | null)[], unknown, unknown, "bottom", boolean>;
+  readonly placement: EpPropFinalized<(new (...args: any[]) => "right" | "left" | "auto" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement$1) | (((new (...args: any[]) => "right" | "left" | "auto" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement$1)) | null)[], unknown, unknown, "bottom", boolean>;
   readonly disabled: BooleanConstructor;
   readonly visible: EpPropFinalized<(new (...args: any[]) => boolean) | (() => boolean | null) | (((new (...args: any[]) => boolean) | (() => boolean | null)) | null)[], unknown, unknown, null, boolean>;
   readonly transition: StringConstructor;

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

@@ -30,9 +30,9 @@ declare const __VLS_base: _$vue.DefineComponent<PopoverProps, {
   "onAfter-enter"?: (() => any) | undefined;
   "onAfter-leave"?: (() => any) | undefined;
 }>, {
+  tabindex: string | number;
   persistent: boolean;
   popperStyle: string | false | _$vue.CSSProperties | _$vue.StyleValue[] | null;
-  tabindex: string | number;
   teleported: boolean;
   visible: boolean | null;
   effect: PopperEffect;

package/es/components/popper/src/composables/use-content.d.ts

@@ -51,9 +51,9 @@ declare const usePopperContent: (props: PopperContentProps) => {
         popperEscapeOffsets: _$_popperjs_core0.SideObject;
       };
       offset?: {
-        auto?: _$_popperjs_core0.Offsets | undefined;
-        left?: _$_popperjs_core0.Offsets | undefined;
         right?: _$_popperjs_core0.Offsets | undefined;
+        left?: _$_popperjs_core0.Offsets | undefined;
+        auto?: _$_popperjs_core0.Offsets | undefined;
         bottom?: _$_popperjs_core0.Offsets | undefined;
         top?: _$_popperjs_core0.Offsets | undefined;
         "auto-start"?: _$_popperjs_core0.Offsets | undefined;

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

@@ -7,11 +7,11 @@ type __VLS_Slots = {} & {
   default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_base: _$vue.DefineComponent<RadioButtonProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<RadioButtonProps> & Readonly<{}>, {
-  modelValue: string | number | boolean;
   disabled: boolean;
-  name: string;
-  value: string | number | boolean;
+  modelValue: string | number | boolean;
   label: string | number | boolean;
+  value: string | number | boolean;
+  name: string;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;