element-plus 1.2.0-beta.3 → 1.2.0-beta.4

package/lib/components/input/src/input.vue_vue_type_template_id_3290dcb6_lang.js

@@ -0,0 +1,187 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+
+const _hoisted_1 = {
+  key: 0,
+  class: "el-input-group__prepend"
+};
+const _hoisted_2 = ["type", "disabled", "readonly", "autocomplete", "tabindex", "aria-label", "placeholder"];
+const _hoisted_3 = {
+  key: 1,
+  class: "el-input__prefix"
+};
+const _hoisted_4 = { class: "el-input__prefix-inner" };
+const _hoisted_5 = {
+  key: 2,
+  class: "el-input__suffix"
+};
+const _hoisted_6 = { class: "el-input__suffix-inner" };
+const _hoisted_7 = {
+  key: 3,
+  class: "el-input__count"
+};
+const _hoisted_8 = { class: "el-input__count-inner" };
+const _hoisted_9 = {
+  key: 3,
+  class: "el-input-group__append"
+};
+const _hoisted_10 = ["tabindex", "disabled", "readonly", "autocomplete", "aria-label", "placeholder"];
+const _hoisted_11 = {
+  key: 0,
+  class: "el-input__count"
+};
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_icon = vue.resolveComponent("el-icon");
+  const _component_circle_close = vue.resolveComponent("circle-close");
+  const _component_icon_view = vue.resolveComponent("icon-view");
+  return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
+    class: vue.normalizeClass([
+      _ctx.type === "textarea" ? "el-textarea" : "el-input",
+      _ctx.inputSize ? "el-input--" + _ctx.inputSize : "",
+      {
+        "is-disabled": _ctx.inputDisabled,
+        "is-exceed": _ctx.inputExceed,
+        "el-input-group": _ctx.$slots.prepend || _ctx.$slots.append,
+        "el-input-group--append": _ctx.$slots.append,
+        "el-input-group--prepend": _ctx.$slots.prepend,
+        "el-input--prefix": _ctx.$slots.prefix || _ctx.prefixIcon,
+        "el-input--suffix": _ctx.$slots.suffix || _ctx.suffixIcon || _ctx.clearable || _ctx.showPassword,
+        "el-input--suffix--password-clear": _ctx.clearable && _ctx.showPassword
+      },
+      _ctx.$attrs.class
+    ]),
+    style: vue.normalizeStyle(_ctx.containerStyle),
+    onMouseenter: _cache[17] || (_cache[17] = (...args) => _ctx.onMouseEnter && _ctx.onMouseEnter(...args)),
+    onMouseleave: _cache[18] || (_cache[18] = (...args) => _ctx.onMouseLeave && _ctx.onMouseLeave(...args))
+  }, [
+    vue.createCommentVNode(" input "),
+    _ctx.type !== "textarea" ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
+      vue.createCommentVNode(" prepend slot "),
+      _ctx.$slots.prepend ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        vue.renderSlot(_ctx.$slots, "prepend")
+      ])) : vue.createCommentVNode("v-if", true),
+      vue.createElementVNode("input", vue.mergeProps({
+        ref: "input",
+        class: "el-input__inner"
+      }, _ctx.attrs, {
+        type: _ctx.showPassword ? _ctx.passwordVisible ? "text" : "password" : _ctx.type,
+        disabled: _ctx.inputDisabled,
+        readonly: _ctx.readonly,
+        autocomplete: _ctx.autocomplete,
+        tabindex: _ctx.tabindex,
+        "aria-label": _ctx.label,
+        placeholder: _ctx.placeholder,
+        style: _ctx.inputStyle,
+        onCompositionstart: _cache[0] || (_cache[0] = (...args) => _ctx.handleCompositionStart && _ctx.handleCompositionStart(...args)),
+        onCompositionupdate: _cache[1] || (_cache[1] = (...args) => _ctx.handleCompositionUpdate && _ctx.handleCompositionUpdate(...args)),
+        onCompositionend: _cache[2] || (_cache[2] = (...args) => _ctx.handleCompositionEnd && _ctx.handleCompositionEnd(...args)),
+        onInput: _cache[3] || (_cache[3] = (...args) => _ctx.handleInput && _ctx.handleInput(...args)),
+        onFocus: _cache[4] || (_cache[4] = (...args) => _ctx.handleFocus && _ctx.handleFocus(...args)),
+        onBlur: _cache[5] || (_cache[5] = (...args) => _ctx.handleBlur && _ctx.handleBlur(...args)),
+        onChange: _cache[6] || (_cache[6] = (...args) => _ctx.handleChange && _ctx.handleChange(...args)),
+        onKeydown: _cache[7] || (_cache[7] = (...args) => _ctx.handleKeydown && _ctx.handleKeydown(...args))
+      }), null, 16, _hoisted_2),
+      vue.createCommentVNode(" prefix slot "),
+      _ctx.$slots.prefix || _ctx.prefixIcon ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3, [
+        vue.createElementVNode("span", _hoisted_4, [
+          vue.renderSlot(_ctx.$slots, "prefix"),
+          _ctx.prefixIcon ? (vue.openBlock(), vue.createBlock(_component_el_icon, {
+            key: 0,
+            class: "el-input__icon"
+          }, {
+            default: vue.withCtx(() => [
+              (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.prefixIcon)))
+            ]),
+            _: 1
+          })) : vue.createCommentVNode("v-if", true)
+        ])
+      ])) : vue.createCommentVNode("v-if", true),
+      vue.createCommentVNode(" suffix slot "),
+      _ctx.suffixVisible ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_5, [
+        vue.createElementVNode("span", _hoisted_6, [
+          !_ctx.showClear || !_ctx.showPwdVisible || !_ctx.isWordLimitVisible ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
+            vue.renderSlot(_ctx.$slots, "suffix"),
+            _ctx.suffixIcon ? (vue.openBlock(), vue.createBlock(_component_el_icon, {
+              key: 0,
+              class: "el-input__icon"
+            }, {
+              default: vue.withCtx(() => [
+                (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.suffixIcon)))
+              ]),
+              _: 1
+            })) : vue.createCommentVNode("v-if", true)
+          ], 64)) : vue.createCommentVNode("v-if", true),
+          _ctx.showClear ? (vue.openBlock(), vue.createBlock(_component_el_icon, {
+            key: 1,
+            class: "el-input__icon el-input__clear",
+            onMousedown: _cache[8] || (_cache[8] = vue.withModifiers(() => {
+            }, ["prevent"])),
+            onClick: _ctx.clear
+          }, {
+            default: vue.withCtx(() => [
+              vue.createVNode(_component_circle_close)
+            ]),
+            _: 1
+          }, 8, ["onClick"])) : vue.createCommentVNode("v-if", true),
+          _ctx.showPwdVisible ? (vue.openBlock(), vue.createBlock(_component_el_icon, {
+            key: 2,
+            class: "el-input__icon el-input__clear",
+            onClick: _ctx.handlePasswordVisible
+          }, {
+            default: vue.withCtx(() => [
+              vue.createVNode(_component_icon_view)
+            ]),
+            _: 1
+          }, 8, ["onClick"])) : vue.createCommentVNode("v-if", true),
+          _ctx.isWordLimitVisible ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_7, [
+            vue.createElementVNode("span", _hoisted_8, vue.toDisplayString(_ctx.textLength) + " / " + vue.toDisplayString(_ctx.attrs.maxlength), 1)
+          ])) : vue.createCommentVNode("v-if", true)
+        ]),
+        _ctx.validateState && _ctx.validateIcon ? (vue.openBlock(), vue.createBlock(_component_el_icon, {
+          key: 0,
+          class: "el-input__icon el-input__validateIcon"
+        }, {
+          default: vue.withCtx(() => [
+            (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.validateIcon)))
+          ]),
+          _: 1
+        })) : vue.createCommentVNode("v-if", true)
+      ])) : vue.createCommentVNode("v-if", true),
+      vue.createCommentVNode(" append slot "),
+      _ctx.$slots.append ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_9, [
+        vue.renderSlot(_ctx.$slots, "append")
+      ])) : vue.createCommentVNode("v-if", true)
+    ], 64)) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
+      vue.createCommentVNode(" textarea "),
+      vue.createElementVNode("textarea", vue.mergeProps({
+        ref: "textarea",
+        class: "el-textarea__inner"
+      }, _ctx.attrs, {
+        tabindex: _ctx.tabindex,
+        disabled: _ctx.inputDisabled,
+        readonly: _ctx.readonly,
+        autocomplete: _ctx.autocomplete,
+        style: _ctx.computedTextareaStyle,
+        "aria-label": _ctx.label,
+        placeholder: _ctx.placeholder,
+        onCompositionstart: _cache[9] || (_cache[9] = (...args) => _ctx.handleCompositionStart && _ctx.handleCompositionStart(...args)),
+        onCompositionupdate: _cache[10] || (_cache[10] = (...args) => _ctx.handleCompositionUpdate && _ctx.handleCompositionUpdate(...args)),
+        onCompositionend: _cache[11] || (_cache[11] = (...args) => _ctx.handleCompositionEnd && _ctx.handleCompositionEnd(...args)),
+        onInput: _cache[12] || (_cache[12] = (...args) => _ctx.handleInput && _ctx.handleInput(...args)),
+        onFocus: _cache[13] || (_cache[13] = (...args) => _ctx.handleFocus && _ctx.handleFocus(...args)),
+        onBlur: _cache[14] || (_cache[14] = (...args) => _ctx.handleBlur && _ctx.handleBlur(...args)),
+        onChange: _cache[15] || (_cache[15] = (...args) => _ctx.handleChange && _ctx.handleChange(...args)),
+        onKeydown: _cache[16] || (_cache[16] = (...args) => _ctx.handleKeydown && _ctx.handleKeydown(...args))
+      }), null, 16, _hoisted_10),
+      _ctx.isWordLimitVisible ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_11, vue.toDisplayString(_ctx.textLength) + " / " + vue.toDisplayString(_ctx.attrs.maxlength), 1)) : vue.createCommentVNode("v-if", true)
+    ], 64))
+  ], 38)), [
+    [vue.vShow, _ctx.type !== "hidden"]
+  ]);
+}
+
+exports.render = render;
+//# sourceMappingURL=input.vue_vue_type_template_id_3290dcb6_lang.js.map

package/lib/components/input/src/input.vue_vue_type_template_id_3290dcb6_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.vue_vue_type_template_id_3290dcb6_lang.js","sources":["../../../../../../packages/components/input/src/input.vue?vue&type=template&id=3290dcb6&lang.js"],"sourcesContent":["<template>\n  <div\n    v-show=\"type !== 'hidden'\"\n    :class=\"[\n      type === 'textarea' ? 'el-textarea' : 'el-input',\n      inputSize ? 'el-input--' + inputSize : '',\n      {\n        'is-disabled': inputDisabled,\n        'is-exceed': inputExceed,\n        'el-input-group': $slots.prepend || $slots.append,\n        'el-input-group--append': $slots.append,\n        'el-input-group--prepend': $slots.prepend,\n        'el-input--prefix': $slots.prefix || prefixIcon,\n        'el-input--suffix':\n          $slots.suffix || suffixIcon || clearable || showPassword,\n        'el-input--suffix--password-clear': clearable && showPassword,\n      },\n      $attrs.class,\n    ]\"\n    :style=\"containerStyle\"\n    @mouseenter=\"onMouseEnter\"\n    @mouseleave=\"onMouseLeave\"\n  >\n    <!-- input -->\n    <template v-if=\"type !== 'textarea'\">\n      <!-- prepend slot -->\n      <div v-if=\"$slots.prepend\" class=\"el-input-group__prepend\">\n        <slot name=\"prepend\" />\n      </div>\n\n      <input\n        ref=\"input\"\n        class=\"el-input__inner\"\n        v-bind=\"attrs\"\n        :type=\"showPassword ? (passwordVisible ? 'text' : 'password') : type\"\n        :disabled=\"inputDisabled\"\n        :readonly=\"readonly\"\n        :autocomplete=\"autocomplete\"\n        :tabindex=\"tabindex\"\n        :aria-label=\"label\"\n        :placeholder=\"placeholder\"\n        :style=\"inputStyle\"\n        @compositionstart=\"handleCompositionStart\"\n        @compositionupdate=\"handleCompositionUpdate\"\n        @compositionend=\"handleCompositionEnd\"\n        @input=\"handleInput\"\n        @focus=\"handleFocus\"\n        @blur=\"handleBlur\"\n        @change=\"handleChange\"\n        @keydown=\"handleKeydown\"\n      />\n\n      <!-- prefix slot -->\n      <span v-if=\"$slots.prefix || prefixIcon\" class=\"el-input__prefix\">\n        <span class=\"el-input__prefix-inner\">\n          <slot name=\"prefix\"></slot>\n          <el-icon v-if=\"prefixIcon\" class=\"el-input__icon\">\n            <component :is=\"prefixIcon\" />\n          </el-icon>\n        </span>\n      </span>\n\n      <!-- suffix slot -->\n      <span v-if=\"suffixVisible\" class=\"el-input__suffix\">\n        <span class=\"el-input__suffix-inner\">\n          <template v-if=\"!showClear || !showPwdVisible || !isWordLimitVisible\">\n            <slot name=\"suffix\"></slot>\n            <el-icon v-if=\"suffixIcon\" class=\"el-input__icon\">\n              <component :is=\"suffixIcon\" />\n            </el-icon>\n          </template>\n          <el-icon\n            v-if=\"showClear\"\n            class=\"el-input__icon el-input__clear\"\n            @mousedown.prevent\n            @click=\"clear\"\n          >\n            <circle-close />\n          </el-icon>\n          <el-icon\n            v-if=\"showPwdVisible\"\n            class=\"el-input__icon el-input__clear\"\n            @click=\"handlePasswordVisible\"\n          >\n            <icon-view />\n          </el-icon>\n          <span v-if=\"isWordLimitVisible\" class=\"el-input__count\">\n            <span class=\"el-input__count-inner\">\n              {{ textLength }} / {{ attrs.maxlength }}\n            </span>\n          </span>\n        </span>\n        <el-icon\n          v-if=\"validateState && validateIcon\"\n          class=\"el-input__icon el-input__validateIcon\"\n        >\n          <component :is=\"validateIcon\" />\n        </el-icon>\n      </span>\n\n      <!-- append slot -->\n      <div v-if=\"$slots.append\" class=\"el-input-group__append\">\n        <slot name=\"append\" />\n      </div>\n    </template>\n\n    <!-- textarea -->\n    <template v-else>\n      <textarea\n        ref=\"textarea\"\n        class=\"el-textarea__inner\"\n        v-bind=\"attrs\"\n        :tabindex=\"tabindex\"\n        :disabled=\"inputDisabled\"\n        :readonly=\"readonly\"\n        :autocomplete=\"autocomplete\"\n        :style=\"computedTextareaStyle\"\n        :aria-label=\"label\"\n        :placeholder=\"placeholder\"\n        @compositionstart=\"handleCompositionStart\"\n        @compositionupdate=\"handleCompositionUpdate\"\n        @compositionend=\"handleCompositionEnd\"\n        @input=\"handleInput\"\n        @focus=\"handleFocus\"\n        @blur=\"handleBlur\"\n        @change=\"handleChange\"\n        @keydown=\"handleKeydown\"\n      />\n      <span v-if=\"isWordLimitVisible\" class=\"el-input__count\">\n        {{ textLength }} / {{ attrs.maxlength }}\n      </span>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  inject,\n  computed,\n  watch,\n  nextTick,\n  getCurrentInstance,\n  ref,\n  shallowRef,\n  onMounted,\n  onUpdated,\n} from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { CircleClose, View as IconView } from '@element-plus/icons'\nimport { ValidateComponentsMap } from '@element-plus/utils/icon'\nimport { elFormKey, elFormItemKey } from '@element-plus/tokens'\nimport { useAttrs, useFormItem } from '@element-plus/hooks'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { isObject } from '@element-plus/utils/util'\nimport isServer from '@element-plus/utils/isServer'\nimport { isKorean } from '@element-plus/utils/isDef'\nimport { calcTextareaHeight } from './calc-textarea-height'\nimport { inputProps, inputEmits } from './input'\n\nimport type { StyleValue } from '@element-plus/utils/types'\n\ntype TargetElement = HTMLInputElement | HTMLTextAreaElement\n\nconst PENDANT_MAP = {\n  suffix: 'append',\n  prefix: 'prepend',\n} as const\n\nexport default defineComponent({\n  name: 'ElInput',\n\n  components: { ElIcon, CircleClose, IconView },\n\n  inheritAttrs: false,\n\n  props: inputProps,\n  emits: inputEmits,\n\n  setup(props, { slots, emit, attrs: rawAttrs }) {\n    const instance = getCurrentInstance()!\n    const attrs = useAttrs()\n\n    const elForm = inject(elFormKey, undefined)\n    const elFormItem = inject(elFormItemKey, undefined)\n\n    const { size: inputSize, disabled: inputDisabled } = useFormItem({})\n\n    const input = ref<HTMLInputElement>()\n    const textarea = ref<HTMLTextAreaElement>()\n    const focused = ref(false)\n    const hovering = ref(false)\n    const isComposing = ref(false)\n    const passwordVisible = ref(false)\n    const _textareaCalcStyle = shallowRef(props.inputStyle)\n\n    const inputOrTextarea = computed(() => input.value || textarea.value)\n\n    const needStatusIcon = computed(() => elForm?.statusIcon ?? false)\n    const validateState = computed(() => elFormItem?.validateState || '')\n    const validateIcon = computed(\n      () => ValidateComponentsMap[validateState.value]\n    )\n    const containerStyle = computed(() => rawAttrs.style as StyleValue)\n    const computedTextareaStyle = computed<StyleValue>(() => [\n      props.inputStyle,\n      _textareaCalcStyle.value,\n      { resize: props.resize },\n    ])\n    const nativeInputValue = computed(() =>\n      props.modelValue === null || props.modelValue === undefined\n        ? ''\n        : String(props.modelValue)\n    )\n    const showClear = computed(\n      () =>\n        props.clearable &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        !!nativeInputValue.value &&\n        (focused.value || hovering.value)\n    )\n    const showPwdVisible = computed(\n      () =>\n        props.showPassword &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        (!!nativeInputValue.value || focused.value)\n    )\n    const isWordLimitVisible = computed(\n      () =>\n        props.showWordLimit &&\n        !!attrs.value.maxlength &&\n        (props.type === 'text' || props.type === 'textarea') &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        !props.showPassword\n    )\n    const textLength = computed(() => Array.from(nativeInputValue.value).length)\n    const inputExceed = computed(\n      () =>\n        // show exceed style if length of initial value greater then maxlength\n        !!isWordLimitVisible.value &&\n        textLength.value > Number(attrs.value.maxlength)\n    )\n\n    const resizeTextarea = () => {\n      const { type, autosize } = props\n\n      if (isServer || type !== 'textarea') return\n\n      if (autosize) {\n        const minRows = isObject(autosize) ? autosize.minRows : undefined\n        const maxRows = isObject(autosize) ? autosize.maxRows : undefined\n        _textareaCalcStyle.value = {\n          ...calcTextareaHeight(textarea.value!, minRows, maxRows),\n        }\n      } else {\n        _textareaCalcStyle.value = {\n          minHeight: calcTextareaHeight(textarea.value!).minHeight,\n        }\n      }\n    }\n\n    const setNativeInputValue = () => {\n      const input = inputOrTextarea.value\n      if (!input || input.value === nativeInputValue.value) return\n      input.value = nativeInputValue.value\n    }\n\n    const calcIconOffset = (place: 'prefix' | 'suffix') => {\n      const { el } = instance.vnode\n      if (!el) return\n      const elList: HTMLSpanElement[] = Array.from(\n        el.querySelectorAll(`.el-input__${place}`)\n      )\n      const target = elList.find((item) => item.parentNode === el)\n\n      if (!target) return\n\n      const pendant = PENDANT_MAP[place]\n\n      if (slots[pendant]) {\n        target.style.transform = `translateX(${place === 'suffix' ? '-' : ''}${\n          el.querySelector(`.el-input-group__${pendant}`).offsetWidth\n        }px)`\n      } else {\n        target.removeAttribute('style')\n      }\n    }\n\n    const updateIconOffset = () => {\n      calcIconOffset('prefix')\n      calcIconOffset('suffix')\n    }\n\n    const handleInput = (event: Event) => {\n      const { value } = event.target as TargetElement\n\n      // should not emit input during composition\n      // see: https://github.com/ElemeFE/element/issues/10516\n      if (isComposing.value) return\n\n      // hack for https://github.com/ElemeFE/element/issues/8548\n      // should remove the following line when we don't support IE\n      if (value === nativeInputValue.value) return\n\n      emit(UPDATE_MODEL_EVENT, value)\n      emit('input', value)\n\n      // ensure native input value is controlled\n      // see: https://github.com/ElemeFE/element/issues/12850\n      nextTick(setNativeInputValue)\n    }\n\n    const handleChange = (event: Event) => {\n      emit('change', (event.target as TargetElement).value)\n    }\n\n    const focus = () => {\n      // see: https://github.com/ElemeFE/element/issues/18573\n      nextTick(() => {\n        inputOrTextarea.value?.focus()\n      })\n    }\n\n    const blur = () => {\n      inputOrTextarea.value?.blur()\n    }\n\n    const handleFocus = (event: FocusEvent) => {\n      focused.value = true\n      emit('focus', event)\n    }\n\n    const handleBlur = (event: FocusEvent) => {\n      focused.value = false\n      emit('blur', event)\n      if (props.validateEvent) {\n        elFormItem?.validate?.('blur')\n      }\n    }\n\n    const select = () => {\n      inputOrTextarea.value?.select()\n    }\n\n    const handleCompositionStart = (event: CompositionEvent) => {\n      emit('compositionstart', event)\n      isComposing.value = true\n    }\n\n    const handleCompositionUpdate = (event: CompositionEvent) => {\n      emit('compositionupdate', event)\n      const text = (event.target as HTMLInputElement)?.value\n      const lastCharacter = text[text.length - 1] || ''\n      isComposing.value = !isKorean(lastCharacter)\n    }\n\n    const handleCompositionEnd = (event: CompositionEvent) => {\n      emit('compositionend', event)\n      if (isComposing.value) {\n        isComposing.value = false\n        handleInput(event)\n      }\n    }\n\n    const clear = () => {\n      emit(UPDATE_MODEL_EVENT, '')\n      emit('change', '')\n      emit('clear')\n      emit('input', '')\n    }\n\n    const handlePasswordVisible = () => {\n      passwordVisible.value = !passwordVisible.value\n      focus()\n    }\n\n    const suffixVisible = computed(\n      () =>\n        !!slots.suffix ||\n        !!props.suffixIcon ||\n        showClear.value ||\n        props.showPassword ||\n        isWordLimitVisible.value ||\n        (!!validateState.value && needStatusIcon.value)\n    )\n\n    watch(\n      () => props.modelValue,\n      () => {\n        nextTick(resizeTextarea)\n        if (props.validateEvent) {\n          elFormItem?.validate?.('change')\n        }\n      }\n    )\n\n    // native input value is set explicitly\n    // do not use v-model / :value in template\n    // see: https://github.com/ElemeFE/element/issues/14521\n    watch(nativeInputValue, () => setNativeInputValue())\n\n    // when change between <input> and <textarea>,\n    // update DOM dependent value and styles\n    // https://github.com/ElemeFE/element/issues/14857\n    watch(\n      () => props.type,\n      () => {\n        nextTick(() => {\n          setNativeInputValue()\n          resizeTextarea()\n          updateIconOffset()\n        })\n      }\n    )\n\n    onMounted(() => {\n      setNativeInputValue()\n      updateIconOffset()\n      nextTick(resizeTextarea)\n    })\n\n    onUpdated(() => {\n      nextTick(updateIconOffset)\n    })\n\n    const onMouseLeave = (evt: MouseEvent) => {\n      hovering.value = false\n      emit('mouseleave', evt)\n    }\n\n    const onMouseEnter = (evt: MouseEvent) => {\n      hovering.value = true\n      emit('mouseenter', evt)\n    }\n\n    const handleKeydown = (evt: KeyboardEvent) => {\n      emit('keydown', evt)\n    }\n\n    return {\n      input,\n      textarea,\n      attrs,\n      inputSize,\n      validateState,\n      validateIcon,\n      containerStyle,\n      computedTextareaStyle,\n      inputDisabled,\n      showClear,\n      showPwdVisible,\n      isWordLimitVisible,\n      textLength,\n      hovering,\n      inputExceed,\n      passwordVisible,\n      inputOrTextarea,\n      suffixVisible,\n\n      resizeTextarea,\n      handleInput,\n      handleChange,\n      handleFocus,\n      handleBlur,\n      handleCompositionStart,\n      handleCompositionUpdate,\n      handleCompositionEnd,\n      handlePasswordVisible,\n      clear,\n      select,\n      focus,\n      blur,\n      onMouseLeave,\n      onMouseEnter,\n      handleKeydown,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createCommentVNode","_renderSlot","_createElementVNode","_mergeProps","_createBlock","_createVNode"],"mappings":";;;;;;;;EA0BiC,OAAM;AAAA;;;;EA2BQ,OAAM;AAAA;qBACvC,OAAM;;;EASa,OAAM;AAAA;qBACzB,OAAM;;;EAsBsB,OAAM;AAAA;qBAC9B,OAAM;;;EAcQ,OAAM;AAAA;;;;EA2BA,OAAM;AAAA;;;;;8CA/H1CA;IAEG;;;;;;;;;;;;;;;IAgBA,0BAAO;IACP,uDAAY;IACZ,uDAAY;;IAEbC;IACgB,6CAAhBD;MACEC;MACW,YAAO,4BAAlBD,8BAAA;QACEE;;MAGFC,gCAAAC;QACE,KAAI;AAAA,QACJ,OAAM;AAAA,SACE;QACP,MAAM,oBAAgB,6CAAyC;QAC/D,UAAU;QACV,UAAU;QACV,cAAc;QACd,UAAU;QACV,cAAY;QACZ,aAAa;QACb,OAAO;QACP,2DAAkB;QAClB,4DAAmB;QACnB,yDAAgB;QAChB,gDAAO;QACP,gDAAO;QACP,+CAAM;QACN,iDAAQ;QACR,kDAAS;;MAGZH;MACY,YAAO,UAAU,oCAA7BD,+BAAA;QACEG,+BAAA;UACED;UACe,oCAAfG;;YAA2B,OAAM;AAAA;iCAC/B;gCAAAA,4CAAgB;;;;;;MAKtBJ;MACY,uCAAZD,+BAAA;QACEG,+BAAA;WACmB,mBAAc,wBAAmB,4CAAlDH;YACEE;YACe,oCAAfG;;cAA2B,OAAM;AAAA;mCAC/B;kCAAAA,4CAAgB;;;;;UAIZ,mCADRA;;YAEE,OAAM;AAAA,YACL,yDAAD;;YACC,SAAO;;iCAER;cAAAC;;;;UAGM,wCADRD;;YAEE,OAAM;AAAA,YACL,SAAO;;iCAER;cAAAC;;;;UAEU,4CAAZN,+BAAA;YACEG,+BAAA,gCACK,+CAAmB,WAAM;;;QAK1B,sBAAiB,sCADzBE;;UAEE,OAAM;AAAA;+BAEN;8BAAAA,4CAAgB;;;;;MAIpBJ;MACW,YAAO,2BAAlBD,8BAAA;QACEE;;gCAKJF;MADAC;MAEEE,mCAAAC;QACE,KAAI;AAAA,QACJ,OAAM;AAAA,SACE;QACP,UAAU;QACV,UAAU;QACV,UAAU;QACV,cAAc;QACd,OAAO;QACP,cAAY;QACZ,aAAa;QACb,2DAAkB;QAClB,8DAAmB;QACnB,2DAAgB;QAChB,kDAAO;QACP,kDAAO;QACP,iDAAM;QACN,mDAAQ;QACR,oDAAS;;MAEA,4CAAZJ,+BAAA,iCACK,+CAAmB,WAAM;;;gBA/HxB;;;;;;"}

package/lib/components/input/src/input2.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var input_vue_vue_type_script_lang = require('./input.vue_vue&type=script&lang.js');
-var input_vue_vue_type_template_id_3290dcb6_lang = require('./input.vue_vue&type=template&id=3290dcb6&lang.js');
+var input_vue_vue_type_script_lang = require('./input.vue_vue_type_script_lang.js');
+var input_vue_vue_type_template_id_3290dcb6_lang = require('./input.vue_vue_type_template_id_3290dcb6_lang.js');
 
 input_vue_vue_type_script_lang["default"].render = input_vue_vue_type_template_id_3290dcb6_lang.render;
 input_vue_vue_type_script_lang["default"].__file = "packages/components/input/src/input.vue";

package/lib/components/input-number/index.d.ts

@@ -147,8 +147,8 @@ export declare const ElInputNumber: import("../../utils/types").SFCWithInstall<i
         size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", unknown>;
         disabled: boolean;
         modelValue: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
-        form: string;
         label: string;
+        form: string;
         resize: import("../../utils/props").BuildPropType<StringConstructor, "none" | "both" | "horizontal" | "vertical", unknown>;
         autosize: boolean | {
             minRows?: number | undefined;
@@ -298,8 +298,8 @@ export declare const ElInputNumber: import("../../utils/types").SFCWithInstall<i
         size: import("../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", unknown>;
         disabled: boolean;
         modelValue: import("../../utils/props").BuildPropType<import("../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
-        form: string;
         label: string;
+        form: string;
         resize: import("../../utils/props").BuildPropType<StringConstructor, "none" | "both" | "horizontal" | "vertical", unknown>;
         autosize: boolean | {
             minRows?: number | undefined;

package/lib/components/input-number/index.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var withInstall = require('../../utils/with-install.js');
 require('./src/input-number2.js');
 var inputNumber = require('./src/input-number.js');
-var inputNumber_vue_vue_type_script_lang = require('./src/input-number.vue_vue&type=script&lang.js');
+var inputNumber_vue_vue_type_script_lang = require('./src/input-number.vue_vue_type_script_lang.js');
 
 const ElInputNumber = withInstall.withInstall(inputNumber_vue_vue_type_script_lang["default"]);
 

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

@@ -148,8 +148,8 @@ declare const _default: import("vue").DefineComponent<{
         size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", unknown>;
         disabled: boolean;
         modelValue: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
-        form: string;
         label: string;
+        form: string;
         resize: import("../../../utils/props").BuildPropType<StringConstructor, "none" | "both" | "horizontal" | "vertical", unknown>;
         autosize: boolean | {
             minRows?: number | undefined;
@@ -299,8 +299,8 @@ declare const _default: import("vue").DefineComponent<{
         size: import("../../../utils/props").BuildPropType<StringConstructor, "" | "small" | "large" | "medium" | "mini", unknown>;
         disabled: boolean;
         modelValue: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | number | null | undefined>, unknown, unknown>;
-        form: string;
         label: string;
+        form: string;
         resize: import("../../../utils/props").BuildPropType<StringConstructor, "none" | "both" | "horizontal" | "vertical", unknown>;
         autosize: boolean | {
             minRows?: number | undefined;

package/lib/components/input-number/src/input-number.vue_vue_type_script_lang.js

@@ -0,0 +1,212 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+var index$1 = require('../../icon/index.js');
+require('../../../directives/index.js');
+require('../../../hooks/index.js');
+var index = require('../../input/index.js');
+var util = require('../../../utils/util.js');
+var error = require('../../../utils/error.js');
+var icons = require('@element-plus/icons');
+var inputNumber = require('./input-number.js');
+var index$2 = require('../../../directives/repeat-click/index.js');
+var index$3 = require('../../../hooks/use-form-item/index.js');
+
+var script = vue.defineComponent({
+  name: "ElInputNumber",
+  components: {
+    ElInput: index.ElInput,
+    ElIcon: index$1.ElIcon,
+    ArrowUp: icons.ArrowUp,
+    ArrowDown: icons.ArrowDown,
+    Plus: icons.Plus,
+    Minus: icons.Minus
+  },
+  directives: {
+    RepeatClick: index$2["default"]
+  },
+  props: inputNumber.inputNumberProps,
+  emits: inputNumber.inputNumberEmits,
+  setup(props, { emit }) {
+    const input = vue.ref();
+    const data = vue.reactive({
+      currentValue: props.modelValue,
+      userInput: null
+    });
+    const minDisabled = vue.computed(() => _decrease(props.modelValue) < props.min);
+    const maxDisabled = vue.computed(() => _increase(props.modelValue) > props.max);
+    const numPrecision = vue.computed(() => {
+      const stepPrecision = getPrecision(props.step);
+      if (props.precision !== void 0) {
+        if (stepPrecision > props.precision) {
+          error.debugWarn("InputNumber", "precision should not be less than the decimal places of step");
+        }
+        return props.precision;
+      } else {
+        return Math.max(getPrecision(props.modelValue), stepPrecision);
+      }
+    });
+    const controlsAtRight = vue.computed(() => {
+      return props.controls && props.controlsPosition === "right";
+    });
+    const { size: inputNumberSize, disabled: inputNumberDisabled } = index$3.useFormItem({});
+    const displayValue = vue.computed(() => {
+      if (data.userInput !== null) {
+        return data.userInput;
+      }
+      let currentValue = data.currentValue;
+      if (util.isNumber(currentValue)) {
+        if (Number.isNaN(currentValue))
+          return "";
+        if (props.precision !== void 0) {
+          currentValue = currentValue.toFixed(props.precision);
+        }
+      }
+      return currentValue;
+    });
+    const toPrecision = (num, pre) => {
+      if (pre === void 0)
+        pre = numPrecision.value;
+      return parseFloat(`${Math.round(num * Math.pow(10, pre)) / Math.pow(10, pre)}`);
+    };
+    const getPrecision = (value) => {
+      if (value === void 0)
+        return 0;
+      const valueString = value.toString();
+      const dotPosition = valueString.indexOf(".");
+      let precision = 0;
+      if (dotPosition !== -1) {
+        precision = valueString.length - dotPosition - 1;
+      }
+      return precision;
+    };
+    const _increase = (val) => {
+      if (!util.isNumber(val))
+        return data.currentValue;
+      const precisionFactor = Math.pow(10, numPrecision.value);
+      val = util.isNumber(val) ? val : NaN;
+      return toPrecision((precisionFactor * val + precisionFactor * props.step) / precisionFactor);
+    };
+    const _decrease = (val) => {
+      if (!util.isNumber(val))
+        return data.currentValue;
+      const precisionFactor = Math.pow(10, numPrecision.value);
+      val = util.isNumber(val) ? val : NaN;
+      return toPrecision((precisionFactor * val - precisionFactor * props.step) / precisionFactor);
+    };
+    const increase = () => {
+      if (inputNumberDisabled.value || maxDisabled.value)
+        return;
+      const value = props.modelValue || 0;
+      const newVal = _increase(value);
+      setCurrentValue(newVal);
+    };
+    const decrease = () => {
+      if (inputNumberDisabled.value || minDisabled.value)
+        return;
+      const value = props.modelValue || 0;
+      const newVal = _decrease(value);
+      setCurrentValue(newVal);
+    };
+    const setCurrentValue = (newVal) => {
+      const oldVal = data.currentValue;
+      if (typeof newVal === "number" && props.precision !== void 0) {
+        newVal = toPrecision(newVal, props.precision);
+      }
+      if (newVal !== void 0 && newVal >= props.max)
+        newVal = props.max;
+      if (newVal !== void 0 && newVal <= props.min)
+        newVal = props.min;
+      if (oldVal === newVal)
+        return;
+      if (!util.isNumber(newVal)) {
+        newVal = NaN;
+      }
+      data.userInput = null;
+      emit("update:modelValue", newVal);
+      emit("input", newVal);
+      emit("change", newVal, oldVal);
+      data.currentValue = newVal;
+    };
+    const handleInput = (value) => {
+      return data.userInput = value;
+    };
+    const handleInputChange = (value) => {
+      const newVal = Number(value);
+      if (util.isNumber(newVal) && !Number.isNaN(newVal) || value === "") {
+        setCurrentValue(newVal);
+      }
+      data.userInput = null;
+    };
+    const focus = () => {
+      var _a, _b;
+      (_b = (_a = input.value) == null ? void 0 : _a.focus) == null ? void 0 : _b.call(_a);
+    };
+    const blur = () => {
+      var _a, _b;
+      (_b = (_a = input.value) == null ? void 0 : _a.blur) == null ? void 0 : _b.call(_a);
+    };
+    vue.watch(() => props.modelValue, (value) => {
+      let newVal = Number(value);
+      if (newVal !== void 0) {
+        if (isNaN(newVal))
+          return;
+        if (props.stepStrictly) {
+          const stepPrecision = getPrecision(props.step);
+          const precisionFactor = Math.pow(10, stepPrecision);
+          newVal = Math.round(newVal / props.step) * precisionFactor * props.step / precisionFactor;
+        }
+        if (props.precision !== void 0) {
+          newVal = toPrecision(newVal, props.precision);
+        }
+      }
+      if (newVal !== void 0 && newVal >= props.max) {
+        newVal = props.max;
+        emit("update:modelValue", newVal);
+      }
+      if (newVal !== void 0 && newVal <= props.min) {
+        newVal = props.min;
+        emit("update:modelValue", newVal);
+      }
+      data.currentValue = newVal;
+      data.userInput = null;
+    }, { immediate: true });
+    vue.onMounted(() => {
+      var _a;
+      const innerInput = (_a = input.value) == null ? void 0 : _a.input;
+      innerInput.setAttribute("role", "spinbutton");
+      innerInput.setAttribute("aria-valuemax", String(props.max));
+      innerInput.setAttribute("aria-valuemin", String(props.min));
+      innerInput.setAttribute("aria-valuenow", String(data.currentValue));
+      innerInput.setAttribute("aria-disabled", String(inputNumberDisabled.value));
+      if (!util.isNumber(props.modelValue)) {
+        emit("update:modelValue", Number(props.modelValue));
+      }
+    });
+    vue.onUpdated(() => {
+      var _a;
+      const innerInput = (_a = input.value) == null ? void 0 : _a.input;
+      innerInput.setAttribute("aria-valuenow", data.currentValue);
+    });
+    return {
+      input,
+      displayValue,
+      handleInput,
+      handleInputChange,
+      controlsAtRight,
+      decrease,
+      increase,
+      inputNumberSize,
+      inputNumberDisabled,
+      maxDisabled,
+      minDisabled,
+      focus,
+      blur
+    };
+  }
+});
+
+exports["default"] = script;
+//# sourceMappingURL=input-number.vue_vue_type_script_lang.js.map

package/lib/components/input-number/src/input-number.vue_vue_type_script_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-number.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/input-number/src/input-number.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      'el-input-number',\n      inputNumberSize ? 'el-input-number--' + inputNumberSize : '',\n      { 'is-disabled': inputNumberDisabled },\n      { 'is-without-controls': !controls },\n      { 'is-controls-right': controlsAtRight },\n    ]\"\n    @dragstart.prevent\n  >\n    <span\n      v-if=\"controls\"\n      v-repeat-click=\"decrease\"\n      class=\"el-input-number__decrease\"\n      role=\"button\"\n      :class=\"{ 'is-disabled': minDisabled }\"\n      @keydown.enter=\"decrease\"\n    >\n      <el-icon>\n        <arrow-down v-if=\"controlsAtRight\" />\n        <minus v-else />\n      </el-icon>\n    </span>\n    <span\n      v-if=\"controls\"\n      v-repeat-click=\"increase\"\n      class=\"el-input-number__increase\"\n      role=\"button\"\n      :class=\"{ 'is-disabled': maxDisabled }\"\n      @keydown.enter=\"increase\"\n    >\n      <el-icon>\n        <arrow-up v-if=\"controlsAtRight\" />\n        <plus v-else />\n      </el-icon>\n    </span>\n    <el-input\n      ref=\"input\"\n      type=\"number\"\n      :model-value=\"displayValue\"\n      :placeholder=\"placeholder\"\n      :disabled=\"inputNumberDisabled\"\n      :size=\"inputNumberSize\"\n      :max=\"max\"\n      :min=\"min\"\n      :name=\"name\"\n      :label=\"label\"\n      @keydown.up.prevent=\"increase\"\n      @keydown.down.prevent=\"decrease\"\n      @blur=\"(event) => $emit('blur', event)\"\n      @focus=\"(event) => $emit('focus', event)\"\n      @input=\"handleInput\"\n      @change=\"handleInputChange\"\n    />\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  reactive,\n  ref,\n  watch,\n  onMounted,\n  onUpdated,\n} from 'vue'\n\nimport { ElIcon } from '@element-plus/components/icon'\nimport { RepeatClick } from '@element-plus/directives'\nimport { useFormItem } from '@element-plus/hooks'\nimport ElInput from '@element-plus/components/input'\nimport { isNumber } from '@element-plus/utils/util'\nimport { debugWarn } from '@element-plus/utils/error'\nimport { ArrowUp, ArrowDown, Plus, Minus } from '@element-plus/icons'\nimport { inputNumberProps, inputNumberEmits } from './input-number'\n\nimport type { ComponentPublicInstance } from 'vue'\n\ninterface IData {\n  currentValue: number\n  userInput: null | number | string\n}\n\nexport default defineComponent({\n  name: 'ElInputNumber',\n  components: {\n    ElInput,\n    ElIcon,\n    ArrowUp,\n    ArrowDown,\n    Plus,\n    Minus,\n  },\n  directives: {\n    RepeatClick,\n  },\n  props: inputNumberProps,\n  emits: inputNumberEmits,\n  setup(props, { emit }) {\n    const input = ref<ComponentPublicInstance<typeof ElInput>>()\n    const data = reactive<IData>({\n      currentValue: props.modelValue,\n      userInput: null,\n    })\n\n    const minDisabled = computed(() => _decrease(props.modelValue) < props.min)\n    const maxDisabled = computed(() => _increase(props.modelValue) > props.max)\n\n    const numPrecision = computed(() => {\n      const stepPrecision = getPrecision(props.step)\n      if (props.precision !== undefined) {\n        if (stepPrecision > props.precision) {\n          debugWarn(\n            'InputNumber',\n            'precision should not be less than the decimal places of step'\n          )\n        }\n        return props.precision\n      } else {\n        return Math.max(getPrecision(props.modelValue), stepPrecision)\n      }\n    })\n    const controlsAtRight = computed(() => {\n      return props.controls && props.controlsPosition === 'right'\n    })\n\n    const { size: inputNumberSize, disabled: inputNumberDisabled } =\n      useFormItem({})\n\n    const displayValue = computed(() => {\n      if (data.userInput !== null) {\n        return data.userInput\n      }\n      let currentValue: number | string = data.currentValue\n      if (isNumber(currentValue)) {\n        if (Number.isNaN(currentValue)) return ''\n        if (props.precision !== undefined) {\n          currentValue = currentValue.toFixed(props.precision)\n        }\n      }\n      return currentValue\n    })\n    const toPrecision = (num: number, pre?: number) => {\n      if (pre === undefined) pre = numPrecision.value\n      return parseFloat(\n        `${Math.round(num * Math.pow(10, pre)) / Math.pow(10, pre)}`\n      )\n    }\n    const getPrecision = (value: number | undefined) => {\n      if (value === undefined) return 0\n      const valueString = value.toString()\n      const dotPosition = valueString.indexOf('.')\n      let precision = 0\n      if (dotPosition !== -1) {\n        precision = valueString.length - dotPosition - 1\n      }\n      return precision\n    }\n    const _increase = (val: number) => {\n      if (!isNumber(val)) return data.currentValue\n      const precisionFactor = Math.pow(10, numPrecision.value)\n      // Solve the accuracy problem of JS decimal calculation by converting the value to integer.\n      val = isNumber(val) ? val : NaN\n      return toPrecision(\n        (precisionFactor * val + precisionFactor * props.step) / precisionFactor\n      )\n    }\n    const _decrease = (val: number) => {\n      if (!isNumber(val)) return data.currentValue\n      const precisionFactor = Math.pow(10, numPrecision.value)\n      // Solve the accuracy problem of JS decimal calculation by converting the value to integer.\n      val = isNumber(val) ? val : NaN\n      return toPrecision(\n        (precisionFactor * val - precisionFactor * props.step) / precisionFactor\n      )\n    }\n    const increase = () => {\n      if (inputNumberDisabled.value || maxDisabled.value) return\n      const value = props.modelValue || 0\n      const newVal = _increase(value)\n      setCurrentValue(newVal)\n    }\n    const decrease = () => {\n      if (inputNumberDisabled.value || minDisabled.value) return\n      const value = props.modelValue || 0\n      const newVal = _decrease(value)\n      setCurrentValue(newVal)\n    }\n    const setCurrentValue = (newVal: number) => {\n      const oldVal = data.currentValue\n      if (typeof newVal === 'number' && props.precision !== undefined) {\n        newVal = toPrecision(newVal, props.precision)\n      }\n      if (newVal !== undefined && newVal >= props.max) newVal = props.max\n      if (newVal !== undefined && newVal <= props.min) newVal = props.min\n      if (oldVal === newVal) return\n      if (!isNumber(newVal)) {\n        newVal = NaN\n      }\n      data.userInput = null\n      emit('update:modelValue', newVal)\n      emit('input', newVal)\n      emit('change', newVal, oldVal)\n      data.currentValue = newVal\n    }\n    const handleInput = (value: string) => {\n      return (data.userInput = value)\n    }\n    const handleInputChange = (value: string) => {\n      const newVal = Number(value)\n      if ((isNumber(newVal) && !Number.isNaN(newVal)) || value === '') {\n        setCurrentValue(newVal)\n      }\n      data.userInput = null\n    }\n\n    const focus = () => {\n      input.value?.focus?.()\n    }\n\n    const blur = () => {\n      input.value?.blur?.()\n    }\n\n    watch(\n      () => props.modelValue,\n      (value) => {\n        let newVal = Number(value)\n        if (newVal !== undefined) {\n          if (isNaN(newVal)) return\n          if (props.stepStrictly) {\n            const stepPrecision = getPrecision(props.step)\n            const precisionFactor = Math.pow(10, stepPrecision)\n            newVal =\n              (Math.round(newVal / props.step) * precisionFactor * props.step) /\n              precisionFactor\n          }\n          if (props.precision !== undefined) {\n            newVal = toPrecision(newVal, props.precision)\n          }\n        }\n        if (newVal !== undefined && newVal >= props.max) {\n          newVal = props.max\n          emit('update:modelValue', newVal)\n        }\n        if (newVal !== undefined && newVal <= props.min) {\n          newVal = props.min\n          emit('update:modelValue', newVal)\n        }\n        data.currentValue = newVal\n        data.userInput = null\n      },\n      { immediate: true }\n    )\n    onMounted(() => {\n      const innerInput = input.value?.input as HTMLInputElement\n      innerInput.setAttribute('role', 'spinbutton')\n      innerInput.setAttribute('aria-valuemax', String(props.max))\n      innerInput.setAttribute('aria-valuemin', String(props.min))\n      innerInput.setAttribute('aria-valuenow', String(data.currentValue))\n      innerInput.setAttribute(\n        'aria-disabled',\n        String(inputNumberDisabled.value)\n      )\n      if (!isNumber(props.modelValue)) {\n        emit('update:modelValue', Number(props.modelValue))\n      }\n    })\n    onUpdated(() => {\n      const innerInput = input.value?.input\n      innerInput.setAttribute('aria-valuenow', data.currentValue)\n    })\n    return {\n      input,\n      displayValue,\n      handleInput,\n      handleInputChange,\n      controlsAtRight,\n      decrease,\n      increase,\n      inputNumberSize,\n      inputNumberDisabled,\n      maxDisabled,\n      minDisabled,\n      focus,\n      blur,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElInput","ElIcon","ArrowUp","ArrowDown","Plus","Minus","RepeatClick","inputNumberProps","inputNumberEmits","ref","reactive","computed","useFormItem","isNumber"],"mappings":"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"}

package/lib/components/input-number/src/input-number.vue_vue_type_template_id_dec60af6_lang.js

@@ -0,0 +1,80 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_arrow_down = vue.resolveComponent("arrow-down");
+  const _component_minus = vue.resolveComponent("minus");
+  const _component_el_icon = vue.resolveComponent("el-icon");
+  const _component_arrow_up = vue.resolveComponent("arrow-up");
+  const _component_plus = vue.resolveComponent("plus");
+  const _component_el_input = vue.resolveComponent("el-input");
+  const _directive_repeat_click = vue.resolveDirective("repeat-click");
+  return vue.openBlock(), vue.createElementBlock("div", {
+    class: vue.normalizeClass([
+      "el-input-number",
+      _ctx.inputNumberSize ? "el-input-number--" + _ctx.inputNumberSize : "",
+      { "is-disabled": _ctx.inputNumberDisabled },
+      { "is-without-controls": !_ctx.controls },
+      { "is-controls-right": _ctx.controlsAtRight }
+    ]),
+    onDragstart: _cache[4] || (_cache[4] = vue.withModifiers(() => {
+    }, ["prevent"]))
+  }, [
+    _ctx.controls ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", {
+      key: 0,
+      class: vue.normalizeClass(["el-input-number__decrease", { "is-disabled": _ctx.minDisabled }]),
+      role: "button",
+      onKeydown: _cache[0] || (_cache[0] = vue.withKeys((...args) => _ctx.decrease && _ctx.decrease(...args), ["enter"]))
+    }, [
+      vue.createVNode(_component_el_icon, null, {
+        default: vue.withCtx(() => [
+          _ctx.controlsAtRight ? (vue.openBlock(), vue.createBlock(_component_arrow_down, { key: 0 })) : (vue.openBlock(), vue.createBlock(_component_minus, { key: 1 }))
+        ]),
+        _: 1
+      })
+    ], 34)), [
+      [_directive_repeat_click, _ctx.decrease]
+    ]) : vue.createCommentVNode("v-if", true),
+    _ctx.controls ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", {
+      key: 1,
+      class: vue.normalizeClass(["el-input-number__increase", { "is-disabled": _ctx.maxDisabled }]),
+      role: "button",
+      onKeydown: _cache[1] || (_cache[1] = vue.withKeys((...args) => _ctx.increase && _ctx.increase(...args), ["enter"]))
+    }, [
+      vue.createVNode(_component_el_icon, null, {
+        default: vue.withCtx(() => [
+          _ctx.controlsAtRight ? (vue.openBlock(), vue.createBlock(_component_arrow_up, { key: 0 })) : (vue.openBlock(), vue.createBlock(_component_plus, { key: 1 }))
+        ]),
+        _: 1
+      })
+    ], 34)), [
+      [_directive_repeat_click, _ctx.increase]
+    ]) : vue.createCommentVNode("v-if", true),
+    vue.createVNode(_component_el_input, {
+      ref: "input",
+      type: "number",
+      "model-value": _ctx.displayValue,
+      placeholder: _ctx.placeholder,
+      disabled: _ctx.inputNumberDisabled,
+      size: _ctx.inputNumberSize,
+      max: _ctx.max,
+      min: _ctx.min,
+      name: _ctx.name,
+      label: _ctx.label,
+      onKeydown: [
+        vue.withKeys(vue.withModifiers(_ctx.increase, ["prevent"]), ["up"]),
+        vue.withKeys(vue.withModifiers(_ctx.decrease, ["prevent"]), ["down"])
+      ],
+      onBlur: _cache[2] || (_cache[2] = (event) => _ctx.$emit("blur", event)),
+      onFocus: _cache[3] || (_cache[3] = (event) => _ctx.$emit("focus", event)),
+      onInput: _ctx.handleInput,
+      onChange: _ctx.handleInputChange
+    }, null, 8, ["model-value", "placeholder", "disabled", "size", "max", "min", "name", "label", "onKeydown", "onInput", "onChange"])
+  ], 34);
+}
+
+exports.render = render;
+//# sourceMappingURL=input-number.vue_vue_type_template_id_dec60af6_lang.js.map

package/lib/components/input-number/src/input-number.vue_vue_type_template_id_dec60af6_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-number.vue_vue_type_template_id_dec60af6_lang.js","sources":["../../../../../../packages/components/input-number/src/input-number.vue?vue&type=template&id=dec60af6&lang.js"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      'el-input-number',\n      inputNumberSize ? 'el-input-number--' + inputNumberSize : '',\n      { 'is-disabled': inputNumberDisabled },\n      { 'is-without-controls': !controls },\n      { 'is-controls-right': controlsAtRight },\n    ]\"\n    @dragstart.prevent\n  >\n    <span\n      v-if=\"controls\"\n      v-repeat-click=\"decrease\"\n      class=\"el-input-number__decrease\"\n      role=\"button\"\n      :class=\"{ 'is-disabled': minDisabled }\"\n      @keydown.enter=\"decrease\"\n    >\n      <el-icon>\n        <arrow-down v-if=\"controlsAtRight\" />\n        <minus v-else />\n      </el-icon>\n    </span>\n    <span\n      v-if=\"controls\"\n      v-repeat-click=\"increase\"\n      class=\"el-input-number__increase\"\n      role=\"button\"\n      :class=\"{ 'is-disabled': maxDisabled }\"\n      @keydown.enter=\"increase\"\n    >\n      <el-icon>\n        <arrow-up v-if=\"controlsAtRight\" />\n        <plus v-else />\n      </el-icon>\n    </span>\n    <el-input\n      ref=\"input\"\n      type=\"number\"\n      :model-value=\"displayValue\"\n      :placeholder=\"placeholder\"\n      :disabled=\"inputNumberDisabled\"\n      :size=\"inputNumberSize\"\n      :max=\"max\"\n      :min=\"min\"\n      :name=\"name\"\n      :label=\"label\"\n      @keydown.up.prevent=\"increase\"\n      @keydown.down.prevent=\"decrease\"\n      @blur=\"(event) => $emit('blur', event)\"\n      @focus=\"(event) => $emit('focus', event)\"\n      @input=\"handleInput\"\n      @change=\"handleInputChange\"\n    />\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  reactive,\n  ref,\n  watch,\n  onMounted,\n  onUpdated,\n} from 'vue'\n\nimport { ElIcon } from '@element-plus/components/icon'\nimport { RepeatClick } from '@element-plus/directives'\nimport { useFormItem } from '@element-plus/hooks'\nimport ElInput from '@element-plus/components/input'\nimport { isNumber } from '@element-plus/utils/util'\nimport { debugWarn } from '@element-plus/utils/error'\nimport { ArrowUp, ArrowDown, Plus, Minus } from '@element-plus/icons'\nimport { inputNumberProps, inputNumberEmits } from './input-number'\n\nimport type { ComponentPublicInstance } from 'vue'\n\ninterface IData {\n  currentValue: number\n  userInput: null | number | string\n}\n\nexport default defineComponent({\n  name: 'ElInputNumber',\n  components: {\n    ElInput,\n    ElIcon,\n    ArrowUp,\n    ArrowDown,\n    Plus,\n    Minus,\n  },\n  directives: {\n    RepeatClick,\n  },\n  props: inputNumberProps,\n  emits: inputNumberEmits,\n  setup(props, { emit }) {\n    const input = ref<ComponentPublicInstance<typeof ElInput>>()\n    const data = reactive<IData>({\n      currentValue: props.modelValue,\n      userInput: null,\n    })\n\n    const minDisabled = computed(() => _decrease(props.modelValue) < props.min)\n    const maxDisabled = computed(() => _increase(props.modelValue) > props.max)\n\n    const numPrecision = computed(() => {\n      const stepPrecision = getPrecision(props.step)\n      if (props.precision !== undefined) {\n        if (stepPrecision > props.precision) {\n          debugWarn(\n            'InputNumber',\n            'precision should not be less than the decimal places of step'\n          )\n        }\n        return props.precision\n      } else {\n        return Math.max(getPrecision(props.modelValue), stepPrecision)\n      }\n    })\n    const controlsAtRight = computed(() => {\n      return props.controls && props.controlsPosition === 'right'\n    })\n\n    const { size: inputNumberSize, disabled: inputNumberDisabled } =\n      useFormItem({})\n\n    const displayValue = computed(() => {\n      if (data.userInput !== null) {\n        return data.userInput\n      }\n      let currentValue: number | string = data.currentValue\n      if (isNumber(currentValue)) {\n        if (Number.isNaN(currentValue)) return ''\n        if (props.precision !== undefined) {\n          currentValue = currentValue.toFixed(props.precision)\n        }\n      }\n      return currentValue\n    })\n    const toPrecision = (num: number, pre?: number) => {\n      if (pre === undefined) pre = numPrecision.value\n      return parseFloat(\n        `${Math.round(num * Math.pow(10, pre)) / Math.pow(10, pre)}`\n      )\n    }\n    const getPrecision = (value: number | undefined) => {\n      if (value === undefined) return 0\n      const valueString = value.toString()\n      const dotPosition = valueString.indexOf('.')\n      let precision = 0\n      if (dotPosition !== -1) {\n        precision = valueString.length - dotPosition - 1\n      }\n      return precision\n    }\n    const _increase = (val: number) => {\n      if (!isNumber(val)) return data.currentValue\n      const precisionFactor = Math.pow(10, numPrecision.value)\n      // Solve the accuracy problem of JS decimal calculation by converting the value to integer.\n      val = isNumber(val) ? val : NaN\n      return toPrecision(\n        (precisionFactor * val + precisionFactor * props.step) / precisionFactor\n      )\n    }\n    const _decrease = (val: number) => {\n      if (!isNumber(val)) return data.currentValue\n      const precisionFactor = Math.pow(10, numPrecision.value)\n      // Solve the accuracy problem of JS decimal calculation by converting the value to integer.\n      val = isNumber(val) ? val : NaN\n      return toPrecision(\n        (precisionFactor * val - precisionFactor * props.step) / precisionFactor\n      )\n    }\n    const increase = () => {\n      if (inputNumberDisabled.value || maxDisabled.value) return\n      const value = props.modelValue || 0\n      const newVal = _increase(value)\n      setCurrentValue(newVal)\n    }\n    const decrease = () => {\n      if (inputNumberDisabled.value || minDisabled.value) return\n      const value = props.modelValue || 0\n      const newVal = _decrease(value)\n      setCurrentValue(newVal)\n    }\n    const setCurrentValue = (newVal: number) => {\n      const oldVal = data.currentValue\n      if (typeof newVal === 'number' && props.precision !== undefined) {\n        newVal = toPrecision(newVal, props.precision)\n      }\n      if (newVal !== undefined && newVal >= props.max) newVal = props.max\n      if (newVal !== undefined && newVal <= props.min) newVal = props.min\n      if (oldVal === newVal) return\n      if (!isNumber(newVal)) {\n        newVal = NaN\n      }\n      data.userInput = null\n      emit('update:modelValue', newVal)\n      emit('input', newVal)\n      emit('change', newVal, oldVal)\n      data.currentValue = newVal\n    }\n    const handleInput = (value: string) => {\n      return (data.userInput = value)\n    }\n    const handleInputChange = (value: string) => {\n      const newVal = Number(value)\n      if ((isNumber(newVal) && !Number.isNaN(newVal)) || value === '') {\n        setCurrentValue(newVal)\n      }\n      data.userInput = null\n    }\n\n    const focus = () => {\n      input.value?.focus?.()\n    }\n\n    const blur = () => {\n      input.value?.blur?.()\n    }\n\n    watch(\n      () => props.modelValue,\n      (value) => {\n        let newVal = Number(value)\n        if (newVal !== undefined) {\n          if (isNaN(newVal)) return\n          if (props.stepStrictly) {\n            const stepPrecision = getPrecision(props.step)\n            const precisionFactor = Math.pow(10, stepPrecision)\n            newVal =\n              (Math.round(newVal / props.step) * precisionFactor * props.step) /\n              precisionFactor\n          }\n          if (props.precision !== undefined) {\n            newVal = toPrecision(newVal, props.precision)\n          }\n        }\n        if (newVal !== undefined && newVal >= props.max) {\n          newVal = props.max\n          emit('update:modelValue', newVal)\n        }\n        if (newVal !== undefined && newVal <= props.min) {\n          newVal = props.min\n          emit('update:modelValue', newVal)\n        }\n        data.currentValue = newVal\n        data.userInput = null\n      },\n      { immediate: true }\n    )\n    onMounted(() => {\n      const innerInput = input.value?.input as HTMLInputElement\n      innerInput.setAttribute('role', 'spinbutton')\n      innerInput.setAttribute('aria-valuemax', String(props.max))\n      innerInput.setAttribute('aria-valuemin', String(props.min))\n      innerInput.setAttribute('aria-valuenow', String(data.currentValue))\n      innerInput.setAttribute(\n        'aria-disabled',\n        String(inputNumberDisabled.value)\n      )\n      if (!isNumber(props.modelValue)) {\n        emit('update:modelValue', Number(props.modelValue))\n      }\n    })\n    onUpdated(() => {\n      const innerInput = input.value?.input\n      innerInput.setAttribute('aria-valuenow', data.currentValue)\n    })\n    return {\n      input,\n      displayValue,\n      handleInput,\n      handleInputChange,\n      controlsAtRight,\n      decrease,\n      increase,\n      inputNumberSize,\n      inputNumberDisabled,\n      maxDisabled,\n      minDisabled,\n      focus,\n      blur,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createVNode","_createBlock"],"mappings":";;;;;;;;;;;;;;0BACEA;IACG;;;;;;;IAOA,yDAAD;;;IAGQ,qDADRA;;MAGE,2BAAM,8CAEmB;MADzB,MAAK;AAAA,MAEJ,+DAAe;;MAEhBC;6BACE;UAAkB,yCAAlBC,wEACAA;;;;;gCARc;;IAYV,qDADRF;;MAGE,2BAAM,8CAEmB;MADzB,MAAK;AAAA,MAEJ,+DAAe;;MAEhBC;6BACE;UAAgB,yCAAhBC,sEACAA;;;;;gCARc;;IAWlBD;MACE,KAAI;AAAA,MACJ,MAAK;AAAA,MACJ,eAAa;MACb,aAAa;MACb,UAAU;MACV,MAAM;MACN,KAAK;MACL,KAAK;MACL,MAAM;MACN,OAAO;MACP;uCAAoB;uCACE;;MACtB,mCAAO,UAAU,mBAAc;AAAA,MAC/B,oCAAQ,UAAU,oBAAe;AAAA,MACjC,SAAO;MACP,UAAQ;;;;;;;"}