tdesign-mobile-vue
Version:
tdesign-mobile-vue
231 lines (223 loc) • 9.48 kB
JavaScript
/**
* tdesign v1.10.0
* (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-f1dfb936.js');
require('../_chunks/dep-a53404c8.js');
require('../_chunks/dep-93492f08.js');
require('../_chunks/dep-afbc7386.js');
require('../_chunks/dep-77928cee.js');
require('../_chunks/dep-37157f59.js');
require('../_chunks/dep-7185f130.js');
require('../_chunks/dep-e7a19ef8.js');
require('../_chunks/dep-ca802b16.js');
require('../_chunks/dep-8faf539a.js');
require('../_chunks/dep-89a5c268.js');
require('../_common/js/global-config/mobile/default-config.js');
require('../_common/js/global-config/mobile/locale/zh_CN.js');
require('../_chunks/dep-f1b022d4.js');
require('../_chunks/dep-cf7b394b.js');
require('dayjs');
require('../_chunks/dep-820109e5.js');
require('../_chunks/dep-e7b24284.js');
require('../_chunks/dep-5c74143d.js');
require('../_chunks/dep-d9829397.js');
require('../_chunks/dep-86a65b5b.js');
require('../_chunks/dep-f1b8f994.js');
require('../_chunks/dep-ea958be9.js');
require('../_chunks/dep-ca892ae6.js');
require('../_chunks/dep-3beabe42.js');
require('../_chunks/dep-4010f39f.js');
require('../_chunks/dep-ca176637.js');
require('../_chunks/dep-7cea0cb6.js');
require('../_chunks/dep-260a218a.js');
require('../_chunks/dep-bfb01be8.js');
require('../_chunks/dep-2ef39d0b.js');
require('../_chunks/dep-ece32dab.js');
require('../_chunks/dep-2920a2ac.js');
require('../_chunks/dep-3911e21a.js');
require('../hooks/render-tnode.js');
require('../_chunks/dep-4ac62806.js');
require('../_chunks/dep-4c545d76.js');
require('../_chunks/dep-2c2d52bc.js');
require('../_chunks/dep-916464c0.js');
require('../_chunks/dep-e2ced27d.js');
require('../_chunks/dep-6e037233.js');
require('../_chunks/dep-1d4bd4d5.js');
require('../_chunks/dep-3faf272b.js');
require('../_common/js/utils/general.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