@opentiny/tiny-robot 0.3.0-alpha.9 → 0.3.0-rc.0

package/dist/action-group/index.js

@@ -1,7 +1,7 @@
-import { defineComponent as $, useSlots as H, computed as i, ref as f, watch as N, nextTick as W, createElementBlock as _, openBlock as o, createBlock as v, createCommentVNode as R, Fragment as G, renderList as I, unref as h, withCtx as S, createElementVNode as w, resolveDynamicComponent as x, renderSlot as L, createVNode as E, Transition as j, withDirectives as q, normalizeClass as J, withModifiers as K, toDisplayString as Q, vShow as U } from "vue";
-import { c as Y } from "../tiny-robot-svgs.js";
-import { T as M } from "../index5.js";
-import { o as Z, b as ee } from "../index2.js";
+import { defineComponent as $, useSlots as H, computed as i, ref as f, watch as I, nextTick as W, createElementBlock as _, openBlock as o, createBlock as v, createCommentVNode as N, Fragment as R, renderList as G, unref as h, withCtx as S, createElementVNode as w, resolveDynamicComponent as x, renderSlot as L, createVNode as E, Transition as j, withDirectives as q, normalizeClass as J, withModifiers as K, toDisplayString as Q, vShow as U } from "vue";
+import { IconMenu as Y } from "@opentiny/tiny-robot-svgs";
+import { TinyTooltip as M } from "@opentiny/vue";
+import { o as Z, c as ee } from "../index2.js";
 import te from "../icon-button/index.js";
 import { _ as oe } from "../_plugin-vue_export-helper.js";
 const ne = { class: "tr-action-group" }, re = ["onClick"], le = ["onClick"], ae = { class: "tr-action-group__dropdown-item-text" }, ce = /* @__PURE__ */ $({
@@ -17,10 +17,10 @@ const ne = { class: "tr-action-group" }, re = ["onClick"], le = ["onClick"], ae
       var a, t;
       const e = F.default();
       return Array.isArray(e) ? e.length === 1 && ((a = e[0].type) == null ? void 0 : a.toString()) === "Symbol(v-fgt)" ? e[0].children : e : ((t = e.type) == null ? void 0 : t.toString()) === "Symbol(v-fgt)" ? e.children : [e];
-    }), b = i(() => {
+    }), y = i(() => {
       const e = l.maxNum ?? Number.MAX_SAFE_INTEGER;
       return e > 0 ? e : Number.MAX_SAFE_INTEGER;
-    }), y = i(() => p.value.length > b.value), V = i(() => y.value ? p.value.slice(0, b.value) : p.value), z = i(() => y.value ? p.value.slice(b.value) : []), m = f(null), d = f(null), n = f(!1), P = () => {
+    }), b = i(() => p.value.length > y.value), V = i(() => b.value ? p.value.slice(0, y.value) : p.value), z = i(() => b.value ? p.value.slice(y.value) : []), m = f(null), d = f(null), n = f(!1), P = () => {
       n.value = !n.value;
     };
     Z(
@@ -38,14 +38,14 @@ const ne = { class: "tr-action-group" }, re = ["onClick"], le = ["onClick"], ae
       const e = d.value.getBoundingClientRect(), a = m.value.getBoundingClientRect();
       B.value = a.bottom + e.height + 16 > D.value ? "placement-top" : "placement-bottom";
     };
-    return N(n, (e) => {
+    return I(n, (e) => {
       e && W(() => {
         T();
       });
-    }), N(D, () => {
+    }), I(D, () => {
       n.value && T();
     }), (e, a) => (o(), _("div", ne, [
-      (o(!0), _(G, null, I(V.value, (t, C) => {
+      (o(!0), _(R, null, G(V.value, (t, C) => {
         var c;
         return o(), v(h(M), {
           key: C,
@@ -69,7 +69,7 @@ const ne = { class: "tr-action-group" }, re = ["onClick"], le = ["onClick"], ae
           _: 2
         }, 1032, ["content", "disabled"]);
       }), 128)),
-      y.value ? (o(), v(h(M), {
+      b.value ? (o(), v(h(M), {
         key: 0,
         content: "更多",
         effect: "dark",
@@ -94,7 +94,7 @@ const ne = { class: "tr-action-group" }, re = ["onClick"], le = ["onClick"], ae
                   ref: d,
                   class: J(["tr-action-group__dropdown", B.value])
                 }, [
-                  (o(!0), _(G, null, I(z.value, (t, C) => {
+                  (o(!0), _(R, null, G(z.value, (t, C) => {
                     var c;
                     return o(), _("li", {
                       class: "tr-action-group__dropdown-item",
@@ -104,7 +104,7 @@ const ne = { class: "tr-action-group" }, re = ["onClick"], le = ["onClick"], ae
                         return A((s = t.props) == null ? void 0 : s.name);
                       }, ["stop"])
                     }, [
-                      l.dropDownShowLabelOnly ? R("", !0) : (o(), v(x(t), { key: 0 })),
+                      l.dropDownShowLabelOnly ? N("", !0) : (o(), v(x(t), { key: 0 })),
                       w("span", ae, Q((c = t.props) == null ? void 0 : c.label), 1)
                     ], 8, le);
                   }), 128))
@@ -117,10 +117,10 @@ const ne = { class: "tr-action-group" }, re = ["onClick"], le = ["onClick"], ae
           ], 512)
         ]),
         _: 3
-      }, 8, ["disabled"])) : R("", !0)
+      }, 8, ["disabled"])) : N("", !0)
     ]));
   }
-}), g = /* @__PURE__ */ oe(ce, [["__scopeId", "data-v-f8531261"]]), u = /* @__PURE__ */ $({
+}), g = /* @__PURE__ */ oe(ce, [["__scopeId", "data-v-f0173895"]]), u = /* @__PURE__ */ $({
   __name: "ActionGroupItem",
   props: {
     name: {},

package/dist/attachments/index.js

@@ -0,0 +1,526 @@
+import { computed as C, ref as R, onUnmounted as Y, defineComponent as B, mergeModels as W, useModel as Z, createElementBlock as d, openBlock as o, withModifiers as P, createElementVNode as p, createVNode as F, unref as f, Fragment as z, renderList as D, normalizeClass as U, h as ee, createCommentVNode as k, createBlock as L, toDisplayString as x, withCtx as te, resolveDynamicComponent as O, watch as ne } from "vue";
+import { IconFileOther as re, IconFileFolder as V, IconFilePpt as q, IconFileExcel as K, IconFileWord as G, IconFilePdf as H, IconFileImage as J, IconClose as se, IconArrowLeft as ae, IconArrowRight as oe, IconFileRemove as ie, IconImageLoading as j, IconImageWarning as E } from "@opentiny/tiny-robot-svgs";
+import { _ as S } from "../_plugin-vue_export-helper.js";
+import { TinyTooltip as le } from "@opentiny/vue";
+const A = {
+  image: J,
+  pdf: H,
+  word: G,
+  excel: K,
+  ppt: q,
+  folder: V,
+  other: re
+}, N = [
+  {
+    type: "image",
+    matcher: (t) => {
+      var n, u;
+      if (typeof t != "string")
+        return ((n = t.type) == null ? void 0 : n.startsWith("image/")) || !1;
+      const s = ((u = t.split(".").pop()) == null ? void 0 : u.toLowerCase()) || "";
+      return ["png", "jpg", "jpeg", "gif", "webp", "bmp", "svg"].includes(s);
+    },
+    icon: J
+  },
+  {
+    type: "pdf",
+    matcher: (t) => typeof t != "string" ? t.type === "application/pdf" : t.toLowerCase().endsWith(".pdf"),
+    icon: H
+  },
+  {
+    type: "word",
+    matcher: (t) => {
+      var n;
+      if (typeof t != "string")
+        return t.type === "application/msword" || t.type === "application/vnd.openxmlformats-officedocument.wordprocessingml.document";
+      const s = ((n = t.split(".").pop()) == null ? void 0 : n.toLowerCase()) || "";
+      return ["doc", "docx"].includes(s);
+    },
+    icon: G
+  },
+  {
+    type: "excel",
+    matcher: (t) => {
+      var n;
+      if (typeof t != "string")
+        return t.type === "application/vnd.ms-excel" || t.type === "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
+      const s = ((n = t.split(".").pop()) == null ? void 0 : n.toLowerCase()) || "";
+      return ["xls", "xlsx"].includes(s);
+    },
+    icon: K
+  },
+  {
+    type: "ppt",
+    matcher: (t) => {
+      var n;
+      if (typeof t != "string")
+        return t.type === "application/vnd.ms-powerpoint" || t.type === "application/vnd.openxmlformats-officedocument.presentationml.presentation";
+      const s = ((n = t.split(".").pop()) == null ? void 0 : n.toLowerCase()) || "";
+      return ["ppt", "pptx"].includes(s);
+    },
+    icon: q
+  },
+  {
+    type: "folder",
+    matcher: (t) => typeof t != "string" ? !1 : t.toLowerCase().endsWith("folder"),
+    icon: V
+  }
+];
+function Q(t = {}) {
+  const { customIcons: s, fileMatchers: n } = t, u = () => {
+    let e = [];
+    return n ? e = n.concat(N) : e = N, e;
+  }, i = (e = "other") => C(() => {
+    if (s != null && s[e])
+      return s[e];
+    const r = u().find((_) => _.type === e);
+    return r != null && r.icon ? r.icon : A[e] ? A[e] : A.other;
+  }), v = (e) => {
+    const a = u();
+    for (const r of a)
+      if (r.matcher(e))
+        return r.type;
+    return "other";
+  }, g = () => Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15), I = (e) => e < 1024 ? e + " B" : e < 1024 * 1024 ? (e / 1024).toFixed(2) + " KB" : (e / (1024 * 1024)).toFixed(2) + " MB", b = (e) => typeof e.url == "string" && !!e.url && typeof e.size == "number", w = (e) => e.rawFile instanceof File, l = (e) => e.map((a) => {
+    if (b(a))
+      return c(a);
+    if (w(a))
+      return m(a);
+  }), h = (e) => ({
+    id: e.id || g(),
+    name: e.name || "",
+    status: e.status || "success",
+    message: e.message || ""
+  }), c = (e) => {
+    const a = h(e), r = e.url, _ = e.size, M = r.split("/").pop() || "";
+    return {
+      ...a,
+      name: a.name || M,
+      fileType: v(M),
+      size: _,
+      url: r
+    };
+  }, m = (e) => {
+    const a = h(e), r = e.rawFile;
+    return {
+      ...a,
+      name: a.name || r.name,
+      fileType: v(r),
+      rawFile: r,
+      size: e.size || r.size,
+      url: e.url
+    };
+  };
+  return {
+    detectFileType: v,
+    generateID: g,
+    formatFileSize: I,
+    normalizeAttachments: l,
+    getIconComponent: i
+  };
+}
+const ce = (t, s) => {
+  if (t.startsWith("blob:") || t.startsWith("data:")) {
+    const n = document.createElement("a");
+    n.href = t, n.download = s, document.body.appendChild(n), requestAnimationFrame(() => {
+      n.click(), document.body.removeChild(n), URL.revokeObjectURL(t);
+    });
+  }
+};
+function de(t, s) {
+  const n = R([]), u = C(() => t.file.fileType === "image"), i = (l) => {
+    const h = URL.createObjectURL(l);
+    return n.value.push(h), h;
+  }, v = (l) => {
+    s("preview", l, t.file);
+  }, g = (l) => {
+    if (s("download", l, t.file), !l.defaultPrevented && t.file.rawFile && !t.file.url) {
+      const h = i(t.file.rawFile);
+      ce(h, t.file.name || t.file.rawFile.name);
+    }
+  }, I = () => {
+    s("remove", t.file);
+  }, b = () => {
+    s("retry", t.file);
+  }, w = (l, h) => {
+    h.stopPropagation(), l.handler && l.handler(t.file), l.type === "preview" ? v(h) : l.type === "download" ? g(h) : s("action", { action: l, file: t.file });
+  };
+  return Y(() => {
+    n.value.forEach((l) => {
+      URL.revokeObjectURL(l);
+    }), n.value = [];
+  }), {
+    isImage: u,
+    handlePreview: v,
+    downloadFile: g,
+    handleRemove: I,
+    handleRetry: b,
+    handleCustomAction: w
+  };
+}
+const ue = { class: "tr-image-preview__main" }, fe = ["disabled"], pe = { class: "tr-image-preview__content" }, me = ["src", "alt"], _e = ["disabled"], ve = { class: "tr-image-preview__footer" }, he = { class: "tr-image-preview__thumbnails" }, ge = ["onClick"], ye = ["src", "alt"], we = /* @__PURE__ */ B({
+  __name: "ImagePreview",
+  props: /* @__PURE__ */ W({
+    images: {}
+  }, {
+    currentIndex: { required: !0 },
+    currentIndexModifiers: {}
+  }),
+  emits: /* @__PURE__ */ W(["close"], ["update:currentIndex"]),
+  setup(t, { emit: s }) {
+    const n = t, u = s, i = Z(t, "currentIndex"), v = C(() => n.images[i.value]), g = () => {
+      i.value > 0 && i.value--;
+    }, I = () => {
+      i.value < n.images.length - 1 && i.value++;
+    }, b = (l) => {
+      i.value = l;
+    };
+    function w() {
+      u("close");
+    }
+    return (l, h) => {
+      var c, m;
+      return o(), d("div", {
+        class: "tr-image-preview",
+        onClick: P(w, ["self"])
+      }, [
+        p("button", {
+          class: "tr-image-preview__close",
+          onClick: w
+        }, [
+          F(f(se))
+        ]),
+        p("div", ue, [
+          p("button", {
+            class: "tr-image-preview__nav tr-image-preview__nav--left",
+            onClick: P(g, ["stop"]),
+            disabled: i.value === 0
+          }, [
+            F(f(ae))
+          ], 8, fe),
+          p("div", pe, [
+            p("img", {
+              src: (c = v.value) == null ? void 0 : c.url,
+              alt: (m = v.value) == null ? void 0 : m.name,
+              class: "tr-image-preview__image"
+            }, null, 8, me)
+          ]),
+          p("button", {
+            class: "tr-image-preview__nav tr-image-preview__nav--right",
+            onClick: P(I, ["stop"]),
+            disabled: i.value === l.images.length - 1
+          }, [
+            F(f(oe))
+          ], 8, _e)
+        ]),
+        p("div", ve, [
+          p("div", he, [
+            (o(!0), d(z, null, D(l.images, (e, a) => (o(), d("div", {
+              key: e.id,
+              class: U(["tr-image-preview__thumbnail", { "tr-image-preview__thumbnail--active": a === i.value }]),
+              onClick: (r) => b(a)
+            }, [
+              p("img", {
+                src: e.url,
+                alt: e.name
+              }, null, 8, ye)
+            ], 10, ge))), 128))
+          ])
+        ])
+      ]);
+    };
+  }
+}), Ie = /* @__PURE__ */ S(we, [["__scopeId", "data-v-027af77c"]]);
+function be(t, s, n = {}) {
+  const u = R(!1), i = R([]), v = R(0), g = (c) => {
+    v.value = c;
+  }, I = (c) => {
+    const m = t.value.findIndex((e) => e.id === c.id);
+    if (m !== -1 && c.url && t.value.splice(m, 1, c), c.fileType === "image") {
+      i.value = t.value.filter(
+        (a) => a.fileType === "image" && a.status !== "error" && a.status !== "uploading"
+      );
+      const e = i.value.findIndex((a) => a.id === c.id);
+      e !== -1 && (v.value = e, u.value = !0);
+    }
+  }, b = (c, m) => {
+    s("preview", c, m), !c.defaultPrevented && I(m);
+  }, w = () => {
+    u.value = !1;
+  }, l = (c, m) => {
+    n.onDownload ? n.onDownload(c, m) : s("download", c, m);
+  };
+  return {
+    // 显示预览
+    handlePreview: b,
+    // 渲染预览组件
+    renderPreview: () => u.value ? ee(Ie, {
+      images: i.value,
+      currentIndex: v.value,
+      "onUpdate:currentIndex": g,
+      onClose: w,
+      onDownload: l
+    }) : null
+  };
+}
+function ke(t, s) {
+  return {
+    actualListType: C(() => s && s !== "auto" ? s : t.value.length === 0 ? "card" : t.value.every((i) => i.fileType === "image") ? "picture" : "card")
+  };
+}
+const Ce = ["data-file-type"], Fe = {
+  key: 1,
+  class: "tr-file-card__picture-container"
+}, xe = ["src", "alt"], Pe = {
+  key: 0,
+  class: "tr-file-card__picture-overlay"
+}, Me = {
+  key: 1,
+  class: "tr-file-card__status-overlay tr-file-card__status-overlay--picture"
+}, Re = {
+  key: 0,
+  class: "tr-file-card__status-icon tr-file-card__status-icon--loading"
+}, Ue = {
+  key: 0,
+  class: "tr-file-card__status-icon--loading-text"
+}, Le = {
+  key: 2,
+  class: "tr-file-card__default-container"
+}, $e = { class: "tr-file-card__icon-wrapper" }, Te = {
+  key: 0,
+  class: "tr-file-card__status-overlay tr-file-card__status-overlay--icon"
+}, Ae = {
+  key: 0,
+  class: "tr-file-card__status-icon tr-file-card__status-icon--loading"
+}, Be = { class: "tr-file-card__content" }, ze = { class: "tr-file-card__info" }, De = ["title"], Se = {
+  key: 0,
+  class: "tr-file-card__status"
+}, We = {
+  key: 0,
+  class: "tr-file-card__status-success"
+}, je = { class: "tr-file-card__status-info" }, Ee = { class: "tr-file-card__file-type" }, Ne = {
+  key: 0,
+  class: "tr-file-card__file-size"
+}, Oe = {
+  key: 0,
+  class: "tr-file-card__actions"
+}, Ve = ["href", "target", "onClick"], qe = ["onClick"], Ke = {
+  key: 1,
+  class: "tr-file-card__status-uploading"
+}, Ge = {
+  key: 2,
+  class: "tr-file-card__status-error"
+}, He = /* @__PURE__ */ B({
+  __name: "FileCard",
+  props: {
+    file: {},
+    variant: { default: "card" },
+    showStatus: { type: Boolean, default: !0 },
+    fileIcons: {},
+    disabled: { type: Boolean },
+    actions: {},
+    fileMatchers: {}
+  },
+  emits: ["remove", "preview", "action", "retry", "download"],
+  setup(t, { emit: s }) {
+    const n = t, u = s, { formatFileSize: i, getIconComponent: v } = Q({
+      customIcons: n.fileIcons,
+      fileMatchers: n.fileMatchers
+    }), { isImage: g, handlePreview: I, handleRemove: b, handleCustomAction: w, handleRetry: l } = de(n, u), h = C(() => v(n.file.fileType).value), c = C(() => n.file.status === "uploading"), m = C(() => n.file.status === "success"), e = C(() => n.file.status === "error"), a = C(() => [
+      n.variant === "picture" ? "tr-file-card--picture" : "tr-file-card",
+      `tr-file-card--${n.file.fileType || "other"}`,
+      {
+        "tr-file-card--uploading": c.value,
+        "tr-file-card--error": e.value,
+        "tr-file-card--success": m.value
+      }
+    ]);
+    return (r, _) => {
+      var M;
+      return o(), d("div", {
+        class: U(a.value),
+        "data-file-type": r.file.fileType || "other",
+        onClick: _[3] || (_[3] = (y) => r.variant === "picture" ? f(I)(y) : void 0)
+      }, [
+        r.disabled ? k("", !0) : (o(), d("button", {
+          key: 0,
+          class: "tr-file-card__close-btn",
+          onClick: _[0] || (_[0] = P(
+            //@ts-ignore
+            (...y) => f(b) && f(b)(...y),
+            ["stop"]
+          )),
+          "aria-label": "移除文件"
+        }, [
+          F(f(ie))
+        ])),
+        r.variant === "picture" ? (o(), d("div", Fe, [
+          p("img", {
+            src: r.file.url,
+            alt: r.file.name,
+            class: "tr-file-card__picture-img"
+          }, null, 8, xe),
+          m.value ? (o(), d("div", Pe, _[4] || (_[4] = [
+            p("span", { class: "tr-file-card__picture-overlay-text" }, "预览", -1)
+          ]))) : k("", !0),
+          c.value || e.value ? (o(), d("div", Me, [
+            c.value ? (o(), d("div", Re, [
+              F(f(j)),
+              r.file.message ? (o(), d("span", Ue, x(r.file.message), 1)) : k("", !0)
+            ])) : e.value ? (o(), L(f(le), {
+              key: 1,
+              content: "解析失败",
+              placement: "top",
+              effect: "light"
+            }, {
+              default: te(() => [
+                F(f(E), { class: "tr-file-card__status-icon tr-file-card__status-icon--error" })
+              ]),
+              _: 1
+            })) : k("", !0)
+          ])) : k("", !0)
+        ])) : (o(), d("div", Le, [
+          p("div", {
+            class: U(["tr-file-card__icon", { "tr-file-card__icon--clickable": f(g) }]),
+            onClick: _[1] || (_[1] = P((y) => f(g) ? f(I)(y) : null, ["stop"]))
+          }, [
+            p("div", $e, [
+              (o(), L(O(h.value), { class: "tr-file-card__file-icon" })),
+              c.value || e.value ? (o(), d("div", Te, [
+                c.value ? (o(), d("div", Ae, [
+                  F(f(j))
+                ])) : e.value ? (o(), L(f(E), {
+                  key: 1,
+                  class: "tr-file-card__status-icon tr-file-card__status-icon--error"
+                })) : k("", !0)
+              ])) : k("", !0)
+            ])
+          ], 2),
+          p("div", Be, [
+            p("div", ze, [
+              p("div", {
+                class: "tr-file-card__name",
+                title: r.file.name
+              }, x(r.file.name), 9, De),
+              r.showStatus ? (o(), d("div", Se, [
+                m.value ? (o(), d("div", We, [
+                  p("div", je, [
+                    p("span", Ee, x(((M = r.file.fileType) == null ? void 0 : M.toUpperCase()) || "FILE"), 1),
+                    r.file.size ? (o(), d("span", Ne, x(f(i)(r.file.size)), 1)) : k("", !0)
+                  ]),
+                  r.actions ? (o(), d("div", Oe, [
+                    (o(!0), d(z, null, D(r.actions, (y, X) => (o(), d("div", {
+                      key: X,
+                      class: "tr-file-card__action-btn"
+                    }, [
+                      y.type === "download" ? (o(), d("a", {
+                        key: 0,
+                        class: "tr-file-card__action-btn--download",
+                        href: r.file.url ?? "javascript:void(0)",
+                        target: r.file.url ? "_blank" : "_self",
+                        onClick: (T) => f(w)(y, T)
+                      }, x(y.label), 9, Ve)) : (o(), d("button", {
+                        key: 1,
+                        class: U(`tr-file-card__action-btn--${y.type}`),
+                        onClick: (T) => f(w)(y, T)
+                      }, x(y.label), 11, qe))
+                    ]))), 128))
+                  ])) : k("", !0)
+                ])) : c.value ? (o(), d("div", Ke, _[5] || (_[5] = [
+                  p("span", { class: "tr-file-card__uploading-text" }, "上传中...", -1)
+                ]))) : e.value ? (o(), d("div", Ge, [
+                  _[6] || (_[6] = p("span", { class: "tr-file-card__error-text" }, "上传失败", -1)),
+                  p("button", {
+                    class: "tr-file-card__retry-btn",
+                    onClick: _[2] || (_[2] = //@ts-ignore
+                    (...y) => f(l) && f(l)(...y))
+                  }, "重试")
+                ])) : k("", !0)
+              ])) : k("", !0)
+            ])
+          ])
+        ]))
+      ], 10, Ce);
+    };
+  }
+}), Je = /* @__PURE__ */ S(He, [["__scopeId", "data-v-a569c028"]]), Qe = { class: "tr-attachments" }, Xe = /* @__PURE__ */ B({
+  __name: "index",
+  props: {
+    items: {},
+    disabled: { type: Boolean },
+    wrap: { type: Boolean },
+    fileIcons: {},
+    actions: { default: () => [
+      {
+        label: "下载",
+        type: "download"
+      },
+      {
+        label: "预览",
+        type: "preview"
+      }
+    ] },
+    variant: { default: "auto" },
+    fileMatchers: { default: () => [] }
+  },
+  emits: ["update:items", "remove", "download", "retry", "preview", "action"],
+  setup(t, { emit: s }) {
+    const n = t, u = s, i = R(n.items || []), { actualListType: v } = ke(i, n.variant), { handlePreview: g, renderPreview: I } = be(i, u, { enableDownload: !0 });
+    function b(e) {
+      if (n.disabled) return;
+      const a = i.value.findIndex((r) => r.id === e.id);
+      a !== -1 && (i.value.splice(a, 1), u("remove", e), u("update:items", i.value));
+    }
+    function w(e, a) {
+      u("download", e, a);
+    }
+    function l(e) {
+      u("retry", e);
+    }
+    function h(e) {
+      u("action", e);
+    }
+    const c = C(() => n.wrap ? "wrap" : "no-wrap"), { normalizeAttachments: m } = Q({
+      fileMatchers: n.fileMatchers
+    });
+    return ne(
+      () => n.items,
+      (e) => {
+        e && e.length > 0 && (i.value = m(e));
+      },
+      { deep: !0, immediate: !0 }
+    ), (e, a) => (o(), d("div", Qe, [
+      i.value.length > 0 ? (o(), d("div", {
+        key: 0,
+        class: U(["tr-attachments__file-list", c.value]),
+        onClick: a[0] || (a[0] = P(() => {
+        }, ["stop"]))
+      }, [
+        (o(!0), d(z, null, D(i.value, (r) => (o(), L(Je, {
+          key: r.id,
+          file: r,
+          variant: f(v),
+          "file-icons": e.fileIcons,
+          disabled: e.disabled,
+          actions: e.actions,
+          "show-status": !0,
+          "file-matchers": e.fileMatchers,
+          onRemove: b,
+          onPreview: f(g),
+          onDownload: w,
+          onRetry: l,
+          onAction: h
+        }, null, 8, ["file", "variant", "file-icons", "disabled", "actions", "file-matchers", "onPreview"]))), 128))
+      ], 2)) : k("", !0),
+      (o(), L(O(f(I)())))
+    ]));
+  }
+}), $ = /* @__PURE__ */ S(Xe, [["__scopeId", "data-v-e09559ac"]]);
+$.name = "TrAttachments";
+const Ye = function(t) {
+  t.component($.name, $);
+};
+$.install = Ye;
+export {
+  $ as default
+};