@artmate/chat
Version:
**开箱即用的AI组件库（基于 Vue3 + ElementPlus）**
129 lines (128 loc) • 4.21 kB
JavaScript
import { defineComponent as E, useSlots as T, ref as k, watch as I, createElementBlock as i, openBlock as d, normalizeClass as a, unref as s, createVNode as v, createElementVNode as N, createCommentVNode as m, withCtx as K, renderSlot as l, mergeProps as P } from "vue";
import { useElementSize as R } from "../../../node_modules/@vueuse/core/index.js";
import { ElInput as D } from "element-plus";
import O from "../collapseTransition/index.vue.js";
/* empty css */
import { useNamespace as q } from "../hooks/useNamespace.js";
const H = /* @__PURE__ */ E({
__name: "index",
props: {
modelValue: {},
classNames: { default: void 0 },
placeholder: { default: "" },
disabled: { type: Boolean, default: !1 },
loading: { type: Boolean, default: !1 },
readOnly: { type: Boolean },
rootClassName: { default: "" },
submitType: { type: [String, Boolean], default: "enter" },
autoSize: {}
},
emits: ["update:modelValue", "submit", "change", "keyPress"],
setup(V, { expose: $, emit: C }) {
const u = V, p = C, f = T(), o = q("sender"), c = k(), b = k(), { width: S } = R(b);
I(S, (e) => {
var r;
const t = (r = c.value) == null ? void 0 : r.$el;
if (!t) return;
const n = t.querySelector("textarea");
n && (n.style.textIndent = `${e + 8}px`);
}, {
flush: "post"
});
function z(e) {
p("change", e);
}
function w(e) {
z(e);
}
function h() {
u.modelValue && !u.loading && p("submit");
}
function B(e) {
const t = e.key === "Enter";
switch (u.submitType) {
case "enter": {
t && !e.shiftKey && (e.preventDefault(), h());
break;
}
case "shiftEnter": {
t && e.shiftKey && (e.preventDefault(), h());
break;
}
}
p("keyPress", e);
}
return $({
inputRef: c
}), (e, t) => {
var n, r;
return d(), i("div", {
class: a([s(o).b(), e.disabled && s(o).b("disabled"), e.rootClassName])
}, [
v(O, null, {
default: K(() => [
l(e.$slots, "header")
]),
_: 3
}),
N("div", {
class: a(s(o).b("content"))
}, [
f.prefix ? (d(), i("div", {
key: 0,
class: a([s(o).b("prefix"), (n = e.classNames) == null ? void 0 : n.prefix])
}, [
l(e.$slots, "prefix")
], 2)) : m("", !0),
l(e.$slots, "components", {}, () => {
var g;
return [
N("div", {
class: a([s(o).b("input"), (g = e.classNames) == null ? void 0 : g.input])
}, [
f.tip ? (d(), i("div", {
key: 0,
ref_key: "inputTip",
ref: b,
class: a(s(o).b("input-tip"))
}, [
l(e.$slots, "tip")
], 2)) : m("", !0),
v(s(D), P({
ref_key: "inputRef",
ref: c,
autosize: e.autoSize || { maxRows: 8 },
disabled: e.disabled,
"model-value": e.modelValue,
readonly: e.readOnly,
placeholder: u.placeholder,
resize: "none",
type: "textarea"
}, e.$attrs, {
onChange: w,
onKeydown: t[0] || (t[0] = (y) => B(y)),
"onUpdate:modelValue": t[1] || (t[1] = (y) => p("update:modelValue", y))
}), null, 16, ["autosize", "disabled", "model-value", "readonly", "placeholder"])
], 2)
];
}),
f.actions ? (d(), i("div", {
key: 1,
class: a([s(o).b("actions-list"), (r = e.classNames) == null ? void 0 : r.actions])
}, [
l(e.$slots, "actions")
], 2)) : m("", !0)
], 2),
f.footer ? (d(), i("div", {
key: 0,
class: a(s(o).b("footer"))
}, [
l(e.$slots, "footer")
], 2)) : m("", !0)
], 2);
};
}
});
export {
H as default
};