tdesign-mobile-vue
Version:
tdesign-mobile-vue
228 lines (220 loc) • 9.36 kB
JavaScript
/**
* tdesign v1.8.3
* (c) 2025 TDesign Group
* @license MIT
*/
;
Object.defineProperty(exports, '__esModule', { value: true });
var _typeof = require('@babel/runtime/helpers/typeof');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var vue = require('vue');
var hooks_useLengthLimit = require('../hooks/useLengthLimit.js');
var config = require('../config.js');
var textarea_props = require('./props.js');
var _common_js_utils_calcTextareaHeight = require('../_common/js/utils/calcTextareaHeight.js');
var form_const = require('../form/const.js');
var form_hooks = require('../form/hooks.js');
var hooks_useClass = require('../hooks/useClass.js');
var hooks_tnode = require('../hooks/tnode.js');
var hooks_useVModel = require('../hooks/useVModel.js');
require('../_common/js/log/log.js');
require('../_common/js/utils/helper.js');
require('@babel/runtime/helpers/toConsumableArray');
require('@babel/runtime/helpers/objectWithoutProperties');
require('../_chunks/dep-942c3444.js');
require('../_chunks/dep-1ee41e7f.js');
require('../_chunks/dep-be12e3cf.js');
require('../_chunks/dep-dcb71613.js');
require('../_chunks/dep-0c65c975.js');
require('../_chunks/dep-489cc4a7.js');
require('../_chunks/dep-6b4fd003.js');
require('../_chunks/dep-2785f324.js');
require('../_chunks/dep-077b00fa.js');
require('../_chunks/dep-3830a939.js');
require('../_chunks/dep-e0b95f1e.js');
require('../_common/js/global-config/mobile/default-config.js');
require('../_common/js/global-config/mobile/locale/zh_CN.js');
require('../_chunks/dep-18ad56fc.js');
require('../_chunks/dep-f9e965d5.js');
require('dayjs');
require('../_chunks/dep-6e709ab0.js');
require('../_chunks/dep-800d35e0.js');
require('../_chunks/dep-d15535dc.js');
require('../_chunks/dep-2d4b3b6e.js');
require('../_chunks/dep-502b30ed.js');
require('../_chunks/dep-75085caa.js');
require('../_chunks/dep-064922bf.js');
require('../_chunks/dep-031a2fb2.js');
require('../_chunks/dep-c63ef9fd.js');
require('../_chunks/dep-96271380.js');
require('../_chunks/dep-93bd9bb3.js');
require('../_chunks/dep-a5597253.js');
require('../_chunks/dep-43e3ffa1.js');
require('../_chunks/dep-806b2a5f.js');
require('../_chunks/dep-8fb38ffd.js');
require('../_chunks/dep-9e6af4c8.js');
require('../hooks/render-tnode.js');
require('../_chunks/dep-73971288.js');
require('../_chunks/dep-3063ebb4.js');
require('../_chunks/dep-fe4c83ed.js');
require('../_chunks/dep-2a740630.js');
require('../_chunks/dep-efffe4f1.js');
require('../_chunks/dep-12a11698.js');
require('../_chunks/dep-7c008ce3.js');
require('../_chunks/dep-55bdb8ca.js');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var _typeof__default = /*#__PURE__*/_interopDefaultLegacy(_typeof);
var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
var prefix = config["default"].prefix;
var _Textarea = vue.defineComponent({
name: "".concat(prefix, "-textarea"),
props: textarea_props["default"],
setup: function setup(props2, context) {
var renderTNodeJSX = hooks_tnode.useTNodeJSX();
var isDisabled = form_hooks.useFormDisabled();
var formItem = vue.inject(form_const.FormItemInjectionKey, void 0);
var textareaClass = hooks_useClass.usePrefixClass("textarea");
var textareaClasses = vue.computed(function () {
return ["".concat(textareaClass.value), _defineProperty__default["default"](_defineProperty__default["default"]({}, "".concat(textareaClass.value, "--layout-").concat(props2.layout), props2.layout), "".concat(textareaClass.value, "--border"), props2.bordered)];
});
var textareaInnerClasses = vue.computed(function () {
return ["".concat(textareaClass.value, "__wrapper-inner"), _defineProperty__default["default"](_defineProperty__default["default"]({}, "".concat(textareaClass.value, "--disabled"), isDisabled.value), "".concat(textareaClass.value, "--readonly"), props2.readonly)];
});
var textareaRef = vue.ref();
var textareaStyle = vue.ref();
var _toRefs = vue.toRefs(props2),
value = _toRefs.value,
modelValue = _toRefs.modelValue;
var _useVModel = hooks_useVModel["default"](value, modelValue, props2.defaultValue, props2.onChange),
_useVModel2 = _slicedToArray__default["default"](_useVModel, 2),
innerValue = _useVModel2[0],
setInnerValue = _useVModel2[1];
var limitParams = vue.computed(function () {
return {
value: [void 0, null].includes(innerValue.value) ? void 0 : String(innerValue.value),
maxlength: Number(props2.maxlength),
maxcharacter: props2.maxcharacter,
allowInputOverMax: props2.allowInputOverMax
};
});
var _useLengthLimit = hooks_useLengthLimit["default"](limitParams),
limitNumber = _useLengthLimit.limitNumber,
getValueByLimitNumber = _useLengthLimit.getValueByLimitNumber;
var setInputValue = function setInputValue() {
var v = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
var input = textareaRef.value;
var sV = String(v);
if (!input) {
return;
}
if (input.value !== sV) {
input.value = sV;
}
};
var adjustTextareaHeight = function adjustTextareaHeight() {
if (props2.autosize === true) {
textareaStyle.value = _common_js_utils_calcTextareaHeight["default"](textareaRef.value);
} else if (props2.autosize === false) {
textareaStyle.value = _common_js_utils_calcTextareaHeight["default"](textareaRef.value, 1, 1);
} else if (_typeof__default["default"](props2.autosize) === "object") {
var _props2$autosize = props2.autosize,
minRows = _props2$autosize.minRows,
maxRows = _props2$autosize.maxRows;
textareaStyle.value = _common_js_utils_calcTextareaHeight["default"](textareaRef.value, minRows, maxRows);
} else if (context.attrs.rows) {
textareaStyle.value = {
height: "auto",
minHeight: "auto"
};
}
};
var handleInput = function handleInput(e) {
if (e instanceof InputEvent) {
if (e.isComposing || e.inputType === "insertCompositionText") return;
}
textareaValueChangeHandle();
};
var textareaValueChangeHandle = function textareaValueChangeHandle() {
var textarea = textareaRef.value;
setInnerValue(getValueByLimitNumber(textarea.value));
vue.nextTick(function () {
return setInputValue(innerValue.value);
});
adjustTextareaHeight();
};
var handleCompositionend = function handleCompositionend(e) {
textareaValueChangeHandle();
};
var handleFocus = function handleFocus(e) {
var _props2$onFocus;
(_props2$onFocus = props2.onFocus) === null || _props2$onFocus === void 0 || _props2$onFocus.call(props2, innerValue.value, {
e: e
});
};
var handleBlur = function handleBlur(e) {
var _props2$onBlur;
formItem === null || formItem === void 0 || formItem.handleBlur();
(_props2$onBlur = props2.onBlur) === null || _props2$onBlur === void 0 || _props2$onBlur.call(props2, innerValue.value, {
e: e
});
};
vue.onMounted(function () {
if (props2.autofocus) {
var _textareaRef$value;
(_textareaRef$value = textareaRef.value) === null || _textareaRef$value === void 0 || _textareaRef$value.focus();
}
textareaValueChangeHandle();
adjustTextareaHeight();
});
vue.watch(innerValue, function () {
vue.nextTick(function () {
adjustTextareaHeight();
});
});
vue.watch(function () {
return props2.autosize;
}, function () {
adjustTextareaHeight();
});
return function () {
var renaderLabel = function renaderLabel() {
var label = renderTNodeJSX("label");
return label ? vue.createVNode("div", {
"class": "".concat(textareaClass.value, "__label")
}, [label]) : null;
};
var readerIndicator = function readerIndicator() {
var isShowIndicator = props2.indicator && (props2.maxcharacter || props2.maxlength);
if (!isShowIndicator) {
return null;
}
return vue.createVNode("div", {
"class": "".concat(textareaClass.value, "__indicator")
}, [" ", limitNumber.value]);
};
var textareaAttrs = {
ref: textareaRef,
class: textareaInnerClasses.value,
style: textareaStyle.value,
value: innerValue.value,
name: props2.name,
disabled: isDisabled.value,
placeholder: props2.placeholder,
readonly: props2.readonly,
onFocus: handleFocus,
onBlur: handleBlur,
onInput: handleInput,
onCompositionend: handleCompositionend
};
return vue.createVNode("div", {
"class": textareaClasses.value
}, [renaderLabel(), vue.createVNode("div", {
"class": "".concat(textareaClass.value, "__wrapper")
}, [vue.createVNode("textarea", textareaAttrs, null), readerIndicator()])]);
};
}
});
exports["default"] = _Textarea;
//# sourceMappingURL=textarea.js.map