@opensig/opendesign
Version:
<p align="center"><img src="../docs/public/opendesign-logo-light.png"/></p> <h1 align="center">opendesign</h1> <p align="center">一个 Vue 3 组件库</p> <p align="center"><b>皮肤可定制,使用 TypeScript</b></p>
140 lines (139 loc) • 4.87 kB
JavaScript
"use strict";
const vue = require("vue");
const types = require("./types.js");
const provide = require("../form/provide.js");
const InBox_vue_vue_type_script_setup_true_lang = require("../_components/in-box/InBox.vue.js");
const InTextarea_vue_vue_type_script_setup_true_lang = require("../_components/in-textarea/InTextarea.vue.js");
const helper = require("../_utils/helper.js");
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
__name: "OTextarea",
props: types.textareaProps,
emits: ["update:modelValue", "change", "input", "blur", "focus", "clear"],
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emits = __emit;
const formItemInjection = vue.inject(provide.formItemInjectKey, null);
const inTextareaRef = vue.ref();
const color = vue.computed(() => {
var _a;
if (formItemInjection == null ? void 0 : formItemInjection.fieldResult.value) {
return ((_a = formItemInjection == null ? void 0 : formItemInjection.fieldResult.value) == null ? void 0 : _a.type) || "normal";
} else {
return props.color;
}
});
const onInput = (e) => {
var _a, _b;
emits("input", e);
(_b = formItemInjection == null ? void 0 : (_a = formItemInjection.fieldHandlers).onInput) == null ? void 0 : _b.call(_a);
};
const isFocus = vue.ref(false);
const onFocus = (e) => {
var _a, _b;
if (isFocus.value) {
return;
}
isFocus.value = true;
emits("focus", e);
(_b = formItemInjection == null ? void 0 : (_a = formItemInjection.fieldHandlers).onFocus) == null ? void 0 : _b.call(_a);
};
const onBlur = (e) => {
var _a, _b;
isFocus.value = false;
emits("blur", e);
(_b = formItemInjection == null ? void 0 : (_a = formItemInjection.fieldHandlers).onBlur) == null ? void 0 : _b.call(_a);
};
const onClear = (e) => {
emits("clear", e);
};
const onUpdatedModelValue = (value) => {
emits("update:modelValue", value);
};
const onChange = (value) => {
var _a, _b;
emits("change", value);
(_b = formItemInjection == null ? void 0 : (_a = formItemInjection.fieldHandlers).onChange) == null ? void 0 : _b.call(_a);
};
const textareaId = vue.ref(props.textareaId);
vue.onMounted(() => {
if (!textareaId.value) {
textareaId.value = helper.uniqueId();
}
});
const round = vue.computed(() => {
return props.round === "pill" ? "var(--o-radius_control-l)" : props.round;
});
__expose({
focus: () => {
var _a;
return (_a = inTextareaRef.value) == null ? void 0 : _a.focus();
},
blur: () => {
var _a;
return (_a = inTextareaRef.value) == null ? void 0 : _a.blur();
},
clear: () => {
var _a;
return (_a = inTextareaRef.value) == null ? void 0 : _a.clear();
},
inputEl: () => {
var _a;
return (_a = inTextareaRef.value) == null ? void 0 : _a.inputEl;
}
});
return (_ctx, _cache) => {
return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(
vue.h(
vue.unref(InBox_vue_vue_type_script_setup_true_lang),
{
class: "o-textarea",
size: props.size,
variant: props.variant,
color: color.value,
disabled: props.disabled,
readonly: props.readonly,
round: round.value,
focused: isFocus.value
},
{
default: () => vue.h(
vue.unref(InTextarea_vue_vue_type_script_setup_true_lang),
{
ref: "inTextareaRef",
class: "o-textarea-textarea",
modelValue: vue.unref(helper.formateToString)(props.modelValue),
defaultValue: vue.unref(helper.formateToString)(props.defaultValue),
textareaId: textareaId.value,
...vue.unref(helper.pick)(props, [
"scrollbar",
"placeholder",
"disabled",
"readonly",
"clearable",
"format",
"validate",
"valueOnInvalidChange",
"autoSize",
"resize",
"rows",
"cols",
"getLength",
"maxLength",
"inputOnOutlimit"
]),
onChange,
onInput,
onFocus,
onBlur,
onClear,
"onUpdate:modelValue": onUpdatedModelValue
},
vue.unref(helper.pick)(_ctx.$slots, ["prefix", "suffix"])
)
}
)
));
};
}
});
module.exports = _sfc_main;