tdesign-mobile-vue
Version:
tdesign-mobile-vue
235 lines (227 loc) • 10.3 kB
JavaScript
/**
* tdesign v1.15.0
* (c) 2026 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-cb7c9eda.js');
require('../_chunks/dep-19edd656.js');
require('../_chunks/dep-194379ee.js');
require('../_chunks/dep-16ad1a12.js');
require('../_chunks/dep-642ebff4.js');
require('../_chunks/dep-527cf8f4.js');
require('../_chunks/dep-faa5bfcf.js');
require('../_chunks/dep-e224a131.js');
require('../_chunks/dep-f3575e93.js');
require('../_chunks/dep-9990e77b.js');
require('../_chunks/dep-00f961e4.js');
require('../_common/js/global-config/mobile/default-config.js');
require('../_common/js/global-config/mobile/locale/zh_CN.js');
require('../_chunks/dep-60a4bcda.js');
require('../_chunks/dep-0f8521ff.js');
require('dayjs');
require('../_chunks/dep-663766d0.js');
require('../_chunks/dep-9d8a972e.js');
require('../_chunks/dep-f7499720.js');
require('../_chunks/dep-9b240313.js');
require('../_chunks/dep-8e913c55.js');
require('../_chunks/dep-0abf2cb5.js');
require('../_chunks/dep-1232d344.js');
require('../_chunks/dep-4bbf6d4f.js');
require('../_chunks/dep-4f58ec50.js');
require('../_chunks/dep-f527f423.js');
require('../_chunks/dep-e8a08cb5.js');
require('../_chunks/dep-3bfe327c.js');
require('../_chunks/dep-c6906728.js');
require('../_chunks/dep-858df101.js');
require('../_chunks/dep-310a1957.js');
require('../_chunks/dep-c4e7cd96.js');
require('../_chunks/dep-dfc30a62.js');
require('../_chunks/dep-aee19c43.js');
require('../hooks/render-tnode.js');
require('../_chunks/dep-7c3f62db.js');
require('../_chunks/dep-f6a2d298.js');
require('../_chunks/dep-800a2ea8.js');
require('../_chunks/dep-43708eba.js');
require('../_chunks/dep-fb97f75f.js');
require('../_chunks/dep-2a1aba78.js');
require('../_chunks/dep-2255a654.js');
require('../_chunks/dep-b9f96695.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);
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
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"), "".concat(textareaClass.value, "__placeholder"), _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: _objectSpread(_objectSpread({}, textareaStyle.value), {}, {
caretColor: props2.cursorColor
}),
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