ivue-material-plus
Version:
A high quality UI components Library with Vue.js
1 lines • 32.7 kB
Source Map (JSON)
{"version":3,"file":"index2.mjs","sources":["../../../../../src/components/ivue-input/index.vue"],"sourcesContent":["<template>\r\n <div :class=\"wrapClasses\">\r\n <template v-if=\"type !== 'textarea'\">\r\n <!-- 前置内容,仅在 text 类型下有效 -->\r\n <div\r\n :class=\"[`${prefixCls}-group-prepend`, ...prependColor]\"\r\n :style=\"prependStyle\"\r\n v-if=\"prepend\"\r\n >\r\n <slot name=\"prepend\"></slot>\r\n </div>\r\n <!-- 输入框 -->\r\n <div :class=\"contentClass\">\r\n <!-- 首部图标 -->\r\n <span :class=\"[`${prefixCls}-prefix`]\" v-show=\"showPrefix\">\r\n <slot name=\"prefix\">\r\n <i class=\"ivue-icon\">{{ prefix }}</i>\r\n </slot>\r\n </span>\r\n\r\n <input\r\n :class=\"inputClass\"\r\n :placeholder=\"placeholder\"\r\n :spellcheck=\"spellcheck\"\r\n :type=\"currentType\"\r\n :disabled=\"inputDisabled\"\r\n :autocomplete=\"autocomplete\"\r\n :readonly=\"readonly\"\r\n :name=\"name\"\r\n :value=\"currentValue\"\r\n :autofocus=\"autofocus\"\r\n :number=\"number\"\r\n :id=\"inputId\"\r\n :maxlength=\"maxlength\"\r\n @keyup.enter=\"handleEnter\"\r\n @keyup=\"handleKeyup\"\r\n @keypress=\"handleKeypress\"\r\n @keydown=\"handleKeydown\"\r\n @input=\"handleInput\"\r\n @focus=\"handleFocus\"\r\n @blur=\"handleBlur\"\r\n ref=\"input\"\r\n />\r\n\r\n <!-- 重置选择 -->\r\n <div\r\n :class=\"[`${prefixCls}-icon`, `${prefixCls}-clear`]\"\r\n v-if=\"clearable && currentValue && !disabled\"\r\n @click.stop=\"handleClear\"\r\n >\r\n <ivue-icon\r\n :class=\"[`${prefixCls}-icon-clear`, showSuffix ? 'is-suffix' : '']\"\r\n >{{ clearIcon }}</ivue-icon\r\n >\r\n </div>\r\n <!-- 字数统计 -->\r\n <span :class=\"`${prefixCls}-word-count`\" v-if=\"showWordLimit\"\r\n >{{ textLength }}/{{ upperLimit }}</span\r\n >\r\n <!-- 是否显示密码 -->\r\n <div\r\n :class=\"[`${prefixCls}-suffix`, `${prefixCls}-password`]\"\r\n v-if=\"password\"\r\n @click=\"handleShowPassword\"\r\n >\r\n <template v-if=\"showPassword\">\r\n <slot name=\"password-on\">\r\n <i class=\"ivue-icon\">{{ passwordIcon.on }}</i>\r\n </slot>\r\n </template>\r\n <template v-else>\r\n <slot name=\"password-off\">\r\n <i class=\"ivue-icon\">{{ passwordIcon.off }}</i>\r\n </slot>\r\n </template>\r\n </div>\r\n <!-- 尾部图标 -->\r\n <span\r\n :class=\"[`${prefixCls}-suffix`]\"\r\n v-if=\"showSuffix\"\r\n @click.stop=\"handleSuffix\"\r\n >\r\n <slot name=\"suffix\">\r\n <i class=\"ivue-icon\">{{ suffix }}</i>\r\n </slot>\r\n </span>\r\n </div>\r\n <!-- 搜索型输入框 -->\r\n <template v-if=\"search && enterButton === false\">\r\n <i :class=\"[`${prefixCls}-icon`, 'ivue-icon']\" @click=\"handleSearch\"\r\n >search</i\r\n >\r\n </template>\r\n <template v-else-if=\"search && enterButton\">\r\n <div\r\n :class=\"[`${prefixCls}-group-append`, `${prefixCls}-search`]\"\r\n @click=\"handleSearch\"\r\n >\r\n <i :class=\"['ivue-icon']\" v-if=\"enterButton === true\">search</i>\r\n <template v-else>{{ enterButton }}</template>\r\n </div>\r\n </template>\r\n <!-- 后置内容,仅在 text 类型下有效 -->\r\n <div\r\n :class=\"[`${prefixCls}-group-append`, ...appendColor]\"\r\n :style=\"appendStyle\"\r\n v-if=\"append\"\r\n >\r\n <slot name=\"append\"></slot>\r\n </div>\r\n </template>\r\n <template v-else>\r\n <textarea\r\n :id=\"inputId\"\r\n :name=\"name\"\r\n :disabled=\"inputDisabled\"\r\n :class=\"textareaClasses\"\r\n :style=\"textareaStyles\"\r\n :value=\"currentValue\"\r\n :placeholder=\"placeholder\"\r\n :autofocus=\"autofocus\"\r\n :readonly=\"readonly\"\r\n :rows=\"rows\"\r\n :maxlength=\"maxlength\"\r\n :spellcheck=\"spellcheck\"\r\n :wrap=\"wrap\"\r\n @keyup.enter=\"handleEnter\"\r\n @keyup=\"handleKeyup\"\r\n @keypress=\"handleKeypress\"\r\n @keydown=\"handleKeydown\"\r\n @focus=\"handleFocus\"\r\n @blur=\"handleBlur\"\r\n @input=\"handleInput\"\r\n ref=\"textarea\"\r\n ></textarea>\r\n <!-- 字数统计 -->\r\n <span :class=\"`${prefixCls}-word-count`\" v-if=\"showWordLimit\"\r\n >{{ textLength }}/{{ upperLimit }}</span\r\n >\r\n </template>\r\n </div>\r\n</template>\r\n\r\n<script lang=\"ts\">\r\nimport {\r\n PropType,\r\n ref,\r\n computed,\r\n defineComponent,\r\n nextTick,\r\n watch,\r\n onMounted,\r\n} from 'vue';\r\n\r\nimport { calcTextareaHeight } from '../../utils/calc-textarea-height';\r\nimport { oneOf } from '../../utils/assist';\r\nimport { useFormItem, useFormItemInputId, useDisabled } from '../../hooks';\r\nimport { debugWarn } from '../../utils/error';\r\n\r\n// component\r\nimport IvueIcon from '../ivue-icon/index.vue';\r\n\r\n// type\r\nimport type { Props, TextareaStyles, Size } from './types/input';\r\n\r\nfunction isCssColor(color) {\r\n return !!color && !!color.match(/^(#|(rgb|hsl)a?\\()/);\r\n}\r\n\r\nconst prefixCls = 'ivue-input';\r\n\r\nexport default defineComponent({\r\n name: prefixCls,\r\n emits: [\r\n 'update:modelValue',\r\n 'on-change',\r\n 'on-focus',\r\n 'on-blur',\r\n 'on-clear',\r\n 'on-enter',\r\n 'on-keyup',\r\n 'on-keypress',\r\n 'on-keydown',\r\n 'on-suffix',\r\n 'on-search',\r\n ],\r\n // 声明事件\r\n props: {\r\n /**\r\n * 绑定的值,可使用 v-model 双向绑定\r\n *\r\n * @type {String | Number}\r\n */\r\n modelValue: {\r\n type: [String, Number],\r\n default: '',\r\n },\r\n /**\r\n * 输入框类型\r\n *\r\n * @type {String}\r\n */\r\n type: {\r\n type: String,\r\n default: 'text',\r\n },\r\n /**\r\n * 占位文本\r\n *\r\n * @type {String}\r\n */\r\n placeholder: {\r\n type: String,\r\n default: '',\r\n },\r\n /**\r\n * 原生的 spellcheck 属性\r\n *\r\n * @type {Boolean}\r\n */\r\n spellcheck: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n /**\r\n * 设置输入框为禁用状态\r\n *\r\n * @type {Boolean}\r\n */\r\n disabled: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n /**\r\n * 原生的自动完成功能\r\n *\r\n * @type {String}\r\n */\r\n autocomplete: {\r\n type: String,\r\n default: 'off',\r\n },\r\n /**\r\n * 设置输入框为只读\r\n *\r\n * @type {Boolean}\r\n */\r\n readonly: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n /**\r\n * 输入框name\r\n *\r\n * @type {String}\r\n */\r\n name: {\r\n type: String,\r\n },\r\n /**\r\n * 最大输入长度\r\n *\r\n * @type {Number}\r\n */\r\n maxlength: {\r\n type: Number,\r\n },\r\n /**\r\n * id\r\n *\r\n * @type {String}\r\n */\r\n id: {\r\n type: String,\r\n },\r\n /**\r\n * 自动获取焦点\r\n *\r\n * @type {Boolean}\r\n */\r\n autofocus: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n /**\r\n * 只允许用户输入number\r\n *\r\n * @type {Boolean}\r\n */\r\n number: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n /**\r\n * prepend前置内容背景颜色\r\n *\r\n * @type {String}\r\n */\r\n prependBgColor: {\r\n type: String,\r\n default: '#f8f8f9',\r\n },\r\n /**\r\n * append前后置内容背景颜色\r\n *\r\n * @type {String}\r\n */\r\n appendBgColor: {\r\n type: String,\r\n default: '#f8f8f9',\r\n },\r\n /**\r\n * 输入框头部图标\r\n *\r\n * @type {String}\r\n */\r\n prefix: {\r\n type: String,\r\n default: '',\r\n },\r\n /**\r\n * 输入框尾部图标\r\n *\r\n * @type {String}\r\n */\r\n suffix: {\r\n type: String,\r\n default: '',\r\n },\r\n /**\r\n * 输入框尺寸,可选值为large、small、default或者不设置\r\n *\r\n *\r\n * @type {String}\r\n */\r\n size: {\r\n type: String as PropType<Size>,\r\n validator(value: string) {\r\n return oneOf(value, ['small', 'large', 'default']);\r\n },\r\n default() {\r\n return 'default';\r\n },\r\n },\r\n /**\r\n * 是否显示清除按钮\r\n *\r\n * @type {Boolean}\r\n */\r\n clearable: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n /**\r\n * 输入框清除图标\r\n *\r\n * @type {String}\r\n */\r\n clearIcon: {\r\n type: String,\r\n default: 'cancel',\r\n },\r\n /**\r\n * 是否显示输入字数统计,可以配合 maxlength 使用\r\n *\r\n * @type {Boolean}\r\n */\r\n showWordLimit: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n /**\r\n * 是否显示切换密码图标\r\n *\r\n * @type {Boolean}\r\n */\r\n password: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n /**\r\n * 密码图标\r\n *\r\n * @type {Object}\r\n */\r\n passwordIcon: {\r\n type: Object,\r\n default: () => {\r\n return {\r\n on: 'visibility',\r\n off: 'visibility_off',\r\n };\r\n },\r\n },\r\n /**\r\n * 是否显示为搜索型输入框\r\n *\r\n * @type {Boolean}\r\n */\r\n search: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n /**\r\n * 开启 search 时可用,是否有确认按钮,可设为按钮文字\r\n *\r\n * @type {Boolean, String}\r\n */\r\n enterButton: {\r\n type: [Boolean, String],\r\n default: false,\r\n },\r\n /**\r\n * 文本域默认行数,仅在 textarea 类型下有效\r\n *\r\n * @type {Number}\r\n */\r\n rows: {\r\n type: Number,\r\n default: 2,\r\n },\r\n /**\r\n * 自适应内容高度,仅在 textarea 类型下有效\r\n * 指定最小行数和最大行数\r\n *\r\n * @type {Object}\r\n */\r\n autoHeight: {\r\n type: [Boolean, Object],\r\n default: false,\r\n },\r\n /**\r\n * 是否显示边框\r\n *\r\n * @type {Boolean}\r\n */\r\n border: {\r\n type: Boolean,\r\n default: true,\r\n },\r\n /**\r\n * 是否使用纯value\r\n *\r\n * @type {Boolean}\r\n */\r\n isValue: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n /**\r\n * 原生的 wrap 属性,可选值为 hard 和 soft,仅在 textarea 下生效\r\n *\r\n * @type {String}\r\n */\r\n wrap: {\r\n validator(value: string) {\r\n return oneOf(value, ['hard', 'soft']);\r\n },\r\n default: 'soft',\r\n },\r\n /**\r\n * 自定义输入方法\r\n *\r\n * @type {Boolean}\r\n */\r\n inputFunction: {\r\n type: Function,\r\n },\r\n /**\r\n * 输入时是否触发表单的校验\r\n *\r\n * @type {Boolean}\r\n */\r\n validateEvent: {\r\n type: Boolean,\r\n default: true,\r\n },\r\n },\r\n // 组合式 API\r\n setup(props: Props, { slots, emit }) {\r\n // 当前输入值\r\n const currentValue = ref<string | number>(props.modelValue);\r\n\r\n // 文本框样式\r\n const textareaStyles = ref<TextareaStyles>({});\r\n\r\n // 显示密码\r\n const showPassword = ref<boolean>(false);\r\n\r\n // 是否有焦点\r\n const focused = ref<boolean>(false);\r\n\r\n // ref = textarea\r\n const textarea = ref<HTMLTextAreaElement>();\r\n // ref = input\r\n const input = ref<HTMLInputElement>();\r\n\r\n // 输入框禁用\r\n const inputDisabled = useDisabled();\r\n\r\n // computed\r\n\r\n // 外层样式\r\n const wrapClasses = computed(() => {\r\n return [\r\n `${prefixCls}-wrapper`,\r\n {\r\n [`${prefixCls}-wrapper-${props.size}`]: !!props.size,\r\n [`${prefixCls}-wrapper-clearable`]: props.clearable,\r\n [`${prefixCls}-type-${props.type}`]: props.type,\r\n [`${prefixCls}-group`]:\r\n prepend.value ||\r\n append.value ||\r\n (props.search && props.enterButton),\r\n [`${prefixCls}-group-${props.size}`]:\r\n (prepend.value ||\r\n append.value ||\r\n (props.search && props.enterButton)) &&\r\n !!props.size,\r\n [`${prefixCls}-group-with-prepend`]: prepend.value,\r\n [`${prefixCls}-group-with-append`]:\r\n append.value || (props.search && props.enterButton),\r\n },\r\n ];\r\n });\r\n\r\n // 输入框外层样式\r\n const contentClass = computed(() => {\r\n return [\r\n `${prefixCls}-content`,\r\n {\r\n [`${prefixCls}-group`]:\r\n prepend.value ||\r\n append.value ||\r\n (props.search && props.enterButton),\r\n [`${prefixCls}-no-border`]: !props.border,\r\n [`${prefixCls}-content--prepend`]: prepend.value,\r\n [`${prefixCls}-content--append`]:\r\n append.value || (props.search && props.enterButton),\r\n [`${prefixCls}-content--disabled`]: inputDisabled.value,\r\n // 获取焦点\r\n [`${prefixCls}-content--focused`]: focused.value,\r\n },\r\n ];\r\n });\r\n\r\n // 输入框样式\r\n const inputClass = computed(() => {\r\n return [\r\n prefixCls,\r\n {\r\n [`${prefixCls}-${props.size}`]: !!props.size,\r\n [`${prefixCls}-with-prefix`]: showPrefix.value,\r\n [`${prefixCls}-with-suffix`]:\r\n showSuffix.value || (props.search && props.enterButton === false),\r\n [`${prefixCls}-disabled`]: inputDisabled.value,\r\n [`${prefixCls}-no-border`]: !props.border,\r\n },\r\n ];\r\n });\r\n\r\n // 文本框样式\r\n const textareaClasses = computed(() => {\r\n return [\r\n prefixCls,\r\n `${prefixCls}-textarea`,\r\n {\r\n [`${prefixCls}-disabled`]: inputDisabled.value,\r\n [`${prefixCls}-no-border`]: !props.border,\r\n },\r\n ];\r\n });\r\n\r\n // 前置内容背景\r\n const prependColor = computed(() => {\r\n let _color = {};\r\n\r\n if (!isCssColor(props.prependBgColor)) {\r\n _color = { [props.prependBgColor]: true };\r\n }\r\n\r\n return [_color];\r\n });\r\n\r\n // 前置内容背景\r\n const prependStyle = computed(() => {\r\n let _color = {};\r\n\r\n if (isCssColor(props.prependBgColor)) {\r\n _color = { 'background-color': `${props.prependBgColor}` };\r\n }\r\n\r\n return _color;\r\n });\r\n\r\n // 后置内容背景\r\n const appendColor = computed(() => {\r\n let _color = {};\r\n\r\n if (!isCssColor(props.appendBgColor)) {\r\n _color = { [props.appendBgColor]: true };\r\n }\r\n\r\n return [_color];\r\n });\r\n\r\n // 后置内容背景\r\n const appendStyle = computed(() => {\r\n let _color = {};\r\n\r\n if (isCssColor(props.appendBgColor)) {\r\n _color = { 'background-color': `${props.appendBgColor}` };\r\n }\r\n\r\n return _color;\r\n });\r\n\r\n // 输入的内容\r\n const nativeInputValue = computed(() => {\r\n return props.modelValue;\r\n });\r\n\r\n // 输入上限\r\n const upperLimit = computed(() => {\r\n return props.maxlength;\r\n });\r\n\r\n // 监听输入的长度\r\n const textLength = computed(() => {\r\n if (typeof currentValue.value === 'number') {\r\n return String(currentValue.value).length;\r\n }\r\n\r\n return (currentValue.value || '').length;\r\n });\r\n\r\n // 获取当前输入框type\r\n const currentType = computed(() => {\r\n let type = props.type;\r\n\r\n if (type === 'password' && props.password && showPassword.value) {\r\n type = 'text';\r\n }\r\n\r\n return type;\r\n });\r\n\r\n // 是否有前置内容\r\n const prepend = computed(() => {\r\n let state = false;\r\n\r\n if (props.type !== 'textarea') {\r\n state = slots.prepend !== undefined;\r\n }\r\n\r\n return state;\r\n });\r\n\r\n // 是否有后置内容\r\n const append = computed(() => {\r\n let state = false;\r\n\r\n if (props.type !== 'textarea') {\r\n state = slots.append !== undefined;\r\n }\r\n\r\n return state;\r\n });\r\n\r\n // 是否显示输入框头部图标\r\n const showPrefix = computed(() => {\r\n let state = false;\r\n\r\n if (props.type !== 'textarea') {\r\n state = props.prefix !== '' || slots.prefix !== undefined;\r\n }\r\n\r\n return state;\r\n });\r\n\r\n // 是否显示输入框尾部图标\r\n const showSuffix = computed(() => {\r\n let state = false;\r\n\r\n if (props.type !== 'textarea') {\r\n state = props.suffix !== '' || slots.suffix !== undefined;\r\n }\r\n\r\n return state;\r\n });\r\n\r\n // methods\r\n\r\n // 按下回车键时触发\r\n const handleEnter = (event: Event) => {\r\n emit('on-enter', event);\r\n };\r\n\r\n // 原生的 keyup 事件\r\n const handleKeyup = (event: Event) => {\r\n emit('on-keyup', event);\r\n };\r\n\r\n // 原生的 keypress 事件\r\n const handleKeypress = (event: Event) => {\r\n emit('on-keypress', event);\r\n };\r\n\r\n // 原生的 keydown 事件\r\n const handleKeydown = (event: Event) => {\r\n emit('on-keydown', event);\r\n };\r\n\r\n // 尾部图标点击事件\r\n const handleSuffix = (event: Event) => {\r\n emit('on-suffix', event);\r\n };\r\n\r\n // 更新value\r\n const setNativeInputValue = () => {\r\n if (props.modelValue === currentValue.value) {\r\n return;\r\n }\r\n\r\n currentValue.value = nativeInputValue.value;\r\n };\r\n\r\n // 设置当前值\r\n const setCurrentValue = (value: string | number) => {\r\n if (value === currentValue.value) {\r\n return;\r\n }\r\n\r\n nextTick(() => {\r\n resizeTextarea();\r\n });\r\n\r\n currentValue.value = value;\r\n\r\n if (!props.isValue) {\r\n nextTick(() => {\r\n setNativeInputValue();\r\n });\r\n }\r\n };\r\n\r\n // 自适应内容高度,仅在 textarea 类型下有效,可传入对象,\r\n // 如 { minRows: 2, maxRows: 6 }\r\n const resizeTextarea = () => {\r\n const autoHeight = props.autoHeight;\r\n\r\n // 是否是 textarea 是否开启了自适应高度\r\n if (!autoHeight || props.type !== 'textarea') {\r\n return;\r\n }\r\n\r\n const minRows = autoHeight.minRows;\r\n const maxRows = autoHeight.maxRows;\r\n\r\n // 文本框样式\r\n textareaStyles.value = calcTextareaHeight(\r\n textarea.value,\r\n minRows,\r\n maxRows\r\n );\r\n };\r\n\r\n // 输入事件\r\n const handleInput = (event: Event) => {\r\n let value = (event.target as HTMLInputElement).value;\r\n\r\n // 是否开启了 Number 类型\r\n if (props.number) {\r\n value = value.replace(/[^\\d]+/g, '');\r\n\r\n (event.target as HTMLInputElement).value = value;\r\n }\r\n\r\n // 自定义输入方法\r\n if (props.inputFunction) {\r\n value = props.inputFunction(value);\r\n\r\n (event.target as HTMLInputElement).value = value;\r\n }\r\n\r\n // updated v-model\r\n emit('update:modelValue', value);\r\n\r\n setCurrentValue(value);\r\n\r\n emit('on-change', (event.target as HTMLInputElement).value);\r\n };\r\n\r\n // 输入框聚焦时触发\r\n const handleFocus = (event: Event) => {\r\n focused.value = true;\r\n\r\n emit('on-focus', event);\r\n };\r\n\r\n // 输入框失去焦点时触发\r\n const handleBlur = (event: Event) => {\r\n focused.value = false;\r\n\r\n emit('on-blur', event);\r\n\r\n if (props.validateEvent) {\r\n formItem?.validate?.('blur').catch((err) => debugWarn(err));\r\n }\r\n };\r\n\r\n // 清除数据\r\n const handleClear = () => {\r\n emit('update:modelValue', '');\r\n\r\n setCurrentValue('');\r\n\r\n emit('on-clear');\r\n\r\n emit('on-change', '');\r\n };\r\n\r\n // 获取焦点\r\n const focus = (option) => {\r\n const $el = props.type === 'textarea' ? textarea.value : input.value;\r\n\r\n // 获取焦点\r\n $el.focus(option);\r\n\r\n // 选择内容\r\n const { cursor } = option || {};\r\n\r\n if (cursor) {\r\n const len = $el.value.length;\r\n\r\n switch (cursor) {\r\n case 'start':\r\n $el.setSelectionRange(0, 0);\r\n break;\r\n case 'end':\r\n $el.setSelectionRange(len, len);\r\n break;\r\n default:\r\n $el.setSelectionRange(0, len);\r\n }\r\n }\r\n };\r\n\r\n // 失去焦点\r\n const blur = () => {\r\n if (props.type === 'textarea') {\r\n textarea.value.blur();\r\n } else {\r\n input.value.blur();\r\n }\r\n };\r\n\r\n // 是否显示密码\r\n const handleShowPassword = () => {\r\n // 是否禁用\r\n if (inputDisabled.value) {\r\n return false;\r\n }\r\n\r\n showPassword.value = !showPassword.value;\r\n\r\n // 焦点\r\n focus(null);\r\n\r\n const len = `${currentValue.value}`.length;\r\n\r\n setTimeout(() => {\r\n input.value.setSelectionRange(len, len);\r\n }, 0);\r\n };\r\n\r\n // 点击搜索\r\n const handleSearch = () => {\r\n if (inputDisabled.value) {\r\n return false;\r\n }\r\n\r\n input.value.focus();\r\n\r\n emit('on-search', currentValue.value);\r\n };\r\n\r\n // 监听value\r\n watch(\r\n () => props.modelValue,\r\n (value) => {\r\n setCurrentValue(value);\r\n\r\n // 输入时是否触发表单的校验\r\n if (props.validateEvent) {\r\n formItem?.validate?.('change').catch((err) => debugWarn(err));\r\n }\r\n }\r\n );\r\n\r\n // native input value is set explicitly\r\n // do not use v-model / :value in template\r\n watch(nativeInputValue, () => {\r\n setNativeInputValue();\r\n });\r\n\r\n // when change between <input> and <textarea>,\r\n // update DOM dependent value and styles\r\n watch(\r\n () => props.type,\r\n () => {\r\n nextTick(() => {\r\n // 更新value\r\n setNativeInputValue();\r\n // 自适应内容高度,仅在 textarea 类型下有效,可传入对象,\r\n resizeTextarea();\r\n });\r\n }\r\n );\r\n\r\n // onMounted\r\n onMounted(() => {\r\n // 自适应内容高度,仅在 textarea 类型下有效,可传入对象,\r\n resizeTextarea();\r\n });\r\n\r\n // 设置表单对应的输入框id\r\n const { formItem } = useFormItem();\r\n\r\n // 输入框id\r\n const { inputId } = useFormItemInputId(props, {\r\n formItemContext: formItem,\r\n });\r\n\r\n return {\r\n prefixCls,\r\n\r\n // data\r\n inputId,\r\n inputDisabled,\r\n\r\n // computed\r\n wrapClasses,\r\n contentClass,\r\n inputClass,\r\n textareaStyles,\r\n textareaClasses,\r\n prependStyle,\r\n prependColor,\r\n appendColor,\r\n appendStyle,\r\n upperLimit,\r\n textLength,\r\n currentType,\r\n prepend,\r\n append,\r\n showPrefix,\r\n showSuffix,\r\n\r\n // methods\r\n handleEnter,\r\n handleKeyup,\r\n handleKeypress,\r\n handleKeydown,\r\n handleFocus,\r\n handleBlur,\r\n handleInput,\r\n handleClear,\r\n setCurrentValue,\r\n handleShowPassword,\r\n handleSuffix,\r\n handleSearch,\r\n focus,\r\n blur,\r\n\r\n // data\r\n showPassword,\r\n currentValue,\r\n textarea,\r\n input,\r\n };\r\n },\r\n components: {\r\n IvueIcon,\r\n },\r\n});\r\n</script>\r\n"],"names":["_resolveComponent","_normalizeClass","_openBlock","_createElementBlock","_Fragment","_createCommentVNode","_normalizeStyle","_createElementVNode","_withDirectives","_vShow","_withModifiers","_toDisplayString","_renderSlot"],"mappings":"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"}