@artmate/chat
Version:
**开箱即用的AI组件库（基于 Vue3 + ElementPlus）**
179 lines (178 loc) • 5.43 kB
JavaScript
import { defineComponent as P, useSlots as z, ref as c, watch as F, computed as $, createElementBlock as k, unref as y, openBlock as w, Fragment as I, createVNode as o, withCtx as n, renderSlot as m, normalizeStyle as R, normalizeClass as T } from "vue";
import q from "../fileList/index.vue.js";
/* empty css */
import { useNamespace as A } from "../hooks/useNamespace.js";
import S from "./DropArea.vue.js";
/* empty css */
import b from "./PlaceholderUploader.vue.js";
/* empty css */
import U from "./silentUploader.vue.js";
const V = ["dir"], W = /* @__PURE__ */ P({
name: "Attachment",
__name: "index",
props: {
direction: {},
uploadProps: {},
items: { default: () => [] },
rootClassName: {},
getDropContainer: {},
className: {},
classNames: {},
styles: {},
rootStyle: {},
onChange: {},
disabled: { type: Boolean },
overflow: {}
},
setup(L, { expose: D }) {
const e = L, v = A("attachment"), E = z(), u = c(), f = c(), p = c(), i = c(e.items);
F(
() => e.items,
(s) => {
i.value = s;
}
);
function _(s, a) {
var t;
const l = {
file: s,
fileList: a
};
i.value = a, (t = e.onChange) == null || t.call(e, l);
}
const r = $(
() => ({
...e.uploadProps,
fileList: i.value,
onChange: _
})
);
function B(s) {
const a = i.value.filter((l) => l.uid !== s.uid);
_(s, a);
}
const g = $(() => i.value.length > 0);
return D({
ref: u.value,
nativeElement: p.value,
upload: (s) => {
var l;
const a = ((l = f.value) == null ? void 0 : l.$el).querySelector('input[type="file"]');
if (a) {
const t = new DataTransfer();
t.items.add(s), a.files = t.files, a.dispatchEvent(new Event("change", { bubbles: !0 }));
}
}
}), (s, a) => {
var l, t, h, C, N;
return y(E).default ? (w(), k(I, { key: 0 }, [
o(U, {
ref_key: "uploadRef",
ref: f,
disabled: e.disabled,
"root-class-name": e.rootClassName,
upload: r.value
}, {
default: n(() => [
m(s.$slots, "default")
]),
_: 3
}, 8, ["disabled", "root-class-name", "upload"]),
o(S, {
"class-name": e.rootClassName,
disabled: e.disabled,
"get-drop-container": e.getDropContainer
}, {
default: n(() => {
var d;
return [
o(b, {
ref_key: "CurrentRef",
ref: u,
"class-name": (d = e.classNames) == null ? void 0 : d.placeholder,
disabled: e.disabled,
upload: r.value,
type: "drop"
}, null, 8, ["class-name", "disabled", "upload"])
];
}),
_: 1
}, 8, ["class-name", "disabled", "get-drop-container"])
], 64)) : (w(), k("div", {
key: 1,
ref_key: "containerRef",
ref: p,
class: T([
y(v).b(),
e.direction === "rtl" && [y(v).b("rtl")],
e.className,
e.rootClassName
]),
dir: e.direction || "ltr",
style: R(e.rootStyle)
}, [
o(q, {
disabled: e.disabled,
"item-class-name": (l = e.classNames) == null ? void 0 : l.item,
"item-style": (t = e.styles) == null ? void 0 : t.item,
items: i.value,
"list-class-name": (h = e.classNames) == null ? void 0 : h.list,
"list-style": {
...(C = e.styles) == null ? void 0 : C.list,
display: g.value ? "" : "none"
},
"on-remove": B,
overflow: e.overflow,
upload: r.value
}, null, 8, ["disabled", "item-class-name", "item-style", "items", "list-class-name", "list-style", "overflow", "upload"]),
o(b, {
ref_key: "uploadRef",
ref: f,
"class-name": (N = e.classNames) == null ? void 0 : N.placeholder,
disabled: e.disabled,
style: R(g.value ? { display: "none" } : {}),
upload: r.value,
type: "inline"
}, {
icon: n(() => [
m(s.$slots, "icon")
]),
title: n(() => [
m(s.$slots, "title")
]),
description: n(() => [
m(s.$slots, "description")
]),
_: 3
}, 8, ["class-name", "disabled", "style", "upload"]),
o(S, {
disabled: e.disabled,
"get-drop-container": e.getDropContainer || (() => p.value)
}, {
default: n(() => {
var d;
return [
o(b, {
ref_key: "CurrentRef",
ref: u,
"class-name": (d = e.classNames) == null ? void 0 : d.placeholder,
disabled: e.disabled,
upload: r.value,
type: "drop"
}, {
default: n(() => [
m(s.$slots, "drop")
]),
_: 3
}, 8, ["class-name", "disabled", "upload"])
];
}),
_: 3
}, 8, ["disabled", "get-drop-container"])
], 14, V));
};
}
});
export {
W as default
};