hys-ui 0.2.0 → 0.3.0

package/dist/composables/useUpload.js

@@ -0,0 +1,472 @@
+import { ref as T, inject as me, computed as ee, shallowRef as ae, watch as K, onDeactivated as je, onBeforeUnmount as Ee, onActivated as Pe, nextTick as pe } from "vue";
+import { fieldKey as qe, formKey as Ie, useHysControlState as Ke } from "./formContext.js";
+import { useChoiceNativeReset as Ne } from "./choiceModel.js";
+import { useUploadModel as We } from "./useUploadModel.js";
+import { useUploadRequests as Ce } from "./useUploadRequests.js";
+import { uploadLocale as Be, uploadUrl as R, uploadImage as N, uploadStatus as we, uploadFailure as Q, uploadPercent as He } from "./upload.js";
+function Ye(i, d) {
+  const te = T(), ie = T(), U = T(), c = T(!0), F = T(!1), A = T(!1), S = T(""), w = me(qe, void 0), k = me(Ie, void 0), j = Ke(i), m = ee(
+    () => c.value && !j.disabled.value && !i.readonly && !i.loading
+  ), ge = ee(() => ({ ...Be, ...i.locale })), o = We(i, d, () => c.value), x = /* @__PURE__ */ new Map(), v = /* @__PURE__ */ new Map(), E = /* @__PURE__ */ new Map(), W = /* @__PURE__ */ new Set(), z = ae(/* @__PURE__ */ new Set());
+  let P, D = 0, p = 0, g, b, M, O;
+  const L = ae(/* @__PURE__ */ new Map()), I = ae(), re = () => Number.isFinite(i.limit) && i.limit > 0 ? Math.floor(i.limit) : 1 / 0, y = (e) => c.value && !e.aborted && m.value;
+  function X(e) {
+    const a = Q(e).message;
+    S.value = a, d("error", a);
+  }
+  function C() {
+    i.validateEvent !== !1 && !(k != null && k.resetting.value) && pe(() => {
+      var e;
+      c.value && !(k != null && k.resetting.value) && ((e = w == null ? void 0 : w.validate) == null || e.call(w, "change"));
+    });
+  }
+  function q(e, a, t) {
+    c.value && (S.value = t, d("error", t), d("invalid", { file: e, reason: a, message: t, files: o.files.value }));
+  }
+  function be(e) {
+    return !i.accept || i.accept.split(",").some((a) => {
+      const t = a.trim().toLowerCase(), r = e.type.toLowerCase();
+      return t.startsWith(".") ? e.name.toLowerCase().endsWith(t) : t.endsWith("/*") ? r.startsWith(t.slice(0, -1)) : r === t;
+    });
+  }
+  async function le(e, a) {
+    if (y(a)) {
+      if (!be(e)) {
+        q(e, "type", "文件类型不符合要求：" + e.name);
+        return;
+      }
+      if (Number.isFinite(i.maxSize) && i.maxSize > 0 && e.size > i.maxSize) {
+        q(e, "size", "文件超过大小限制：" + e.name);
+        return;
+      }
+      try {
+        const t = i.beforeUpload ? await i.beforeUpload(e, { signal: a, files: o.files.value }) : void 0;
+        if (!y(a) || t === !1) return;
+        const r = t instanceof Blob ? t : e;
+        if (Number.isFinite(i.maxSize) && i.maxSize > 0 && r.size > i.maxSize) {
+          q(e, "size", "处理后的文件超过大小限制：" + e.name);
+          return;
+        }
+        return r;
+      } catch (t) {
+        y(a) && q(e, "validation", Q(t).message);
+      }
+    }
+  }
+  async function ye(e, a, t) {
+    const r = await o.commit(
+      (l) => l.map(
+        (u) => e.has(u.uid) && (t == null ? void 0 : t(u.uid)) !== !1 ? { ...u, ...e.get(u.uid) } : u
+      ),
+      a,
+      { guard: () => c.value && (t == null ? void 0 : t()) !== !1 }
+    );
+    return r && ["success", "error", "retry"].includes(a) && C(), r;
+  }
+  const f = Ce({
+    props: i,
+    files: o.files,
+    available: m,
+    live: () => c.value,
+    emit: d,
+    patch: ye,
+    forget: (e) => x.delete(e),
+    prepare: async (e, a) => {
+      if (!e.raw) return;
+      const t = x.get(e.uid);
+      if ((t == null ? void 0 : t.raw) === e.raw) return t.body;
+      const r = await le(e.raw, a);
+      return r && y(a) && x.set(e.uid, { raw: e.raw, body: r }), r;
+    }
+  });
+  function Y() {
+    D++, P == null || P.abort(), P = void 0, F.value = !1, A.value = !1, p = 0, U.value && (U.value.value = "");
+  }
+  function Z(e) {
+    return typeof e == "string" ? e : e.uid;
+  }
+  async function $(e) {
+    if (!m.value || F.value) return [];
+    const a = i.multiple === !1 ? [...e].slice(0, 1) : [...e];
+    if (!a.length) return [];
+    if ((i.multiple === !1 ? 0 : o.files.value.length) + a.length > re())
+      return d("exceed", a), U.value && (U.value.value = ""), [];
+    const t = ++D, r = new AbortController();
+    P = r, F.value = !0, S.value = "";
+    const l = [], u = /* @__PURE__ */ new Map();
+    try {
+      for (const n of a) {
+        if (t !== D || !y(r.signal)) return [];
+        const G = await le(n, r.signal);
+        if (!G) continue;
+        if (t !== D || !y(r.signal)) return [];
+        const ve = crypto.randomUUID();
+        let h;
+        try {
+          const J = {
+            uid: ve,
+            name: n.name,
+            size: n.size,
+            raw: n,
+            status: "ready",
+            percentage: 0,
+            type: n.type,
+            ...n.webkitRelativePath ? { relativePath: n.webkitRelativePath } : {}
+          };
+          if (h = i.createFile ? { ...J, ...i.createFile(n, ve) } : J, !h.uid || typeof h.uid != "string" || typeof h.name != "string" || !h.raw || o.files.value.some((Ae) => Ae.uid === h.uid) || u.has(h.uid)) {
+            q(n, "identity", "文件标识无效或重复：" + n.name);
+            continue;
+          }
+        } catch (J) {
+          q(n, "identity", Q(J).message);
+          continue;
+        }
+        l.push(h), u.set(h.uid, { raw: h.raw, body: G });
+      }
+      if (!l.length || t !== D || !y(r.signal))
+        return [];
+      if (!await o.commit(
+        (n) => {
+          if ((i.multiple === !1 ? 0 : n.length) + l.length > re()) {
+            d("exceed", a);
+            return;
+          }
+          return i.multiple === !1 ? l : [...n, ...l];
+        },
+        "select",
+        {
+          guard: () => t === D && y(r.signal),
+          accepted: () => {
+            for (const [n, G] of u) x.set(n, G);
+            d(
+              "select",
+              l.map((n) => n.raw)
+            );
+          }
+        }
+      )) return [];
+      if (C(), i.autoUpload !== !1 && f.configured.value)
+        for (const n of l) f.submit(n.uid);
+      return l;
+    } finally {
+      t === D && (F.value = !1, P = void 0, U.value && (U.value.value = ""));
+    }
+  }
+  async function ue(e) {
+    if (!m.value) return !1;
+    const a = Z(e), t = o.files.value.find((l) => l.uid === a);
+    if (!t || v.has(a)) return !1;
+    const r = new AbortController();
+    v.set(a, r), E.set(a, t.raw), z.value = new Set(v.keys());
+    try {
+      if (i.beforeRemove && await i.beforeRemove(t, o.files.value, {
+        signal: r.signal,
+        files: o.files.value
+      }) === !1 || !y(r.signal) || !o.files.value.some(
+        (u) => u.uid === a && u.raw === t.raw
+      ))
+        return !1;
+      W.add(a);
+      const l = await o.commit(
+        (u) => u.some((s) => s.uid === a && s.raw === t.raw) ? u.filter((s) => s.uid !== a) : void 0,
+        "remove",
+        {
+          guard: () => y(r.signal),
+          accepted: () => d("remove", t)
+        }
+      );
+      return l && (S.value = "", C()), l;
+    } catch (l) {
+      return y(r.signal) && (X(l), d("removeError", Q(l), t)), !1;
+    } finally {
+      W.delete(a), v.get(a) === r && (v.delete(a), E.delete(a), z.value = new Set(v.keys()));
+    }
+  }
+  function ne(e) {
+    var r;
+    Y(), o.cancel();
+    const a = new Set(
+      o.files.value.filter((l) => !e || e.includes(we(l))).map((l) => l.uid)
+    );
+    for (const l of a)
+      f.abort(l, "clear", !1), (r = v.get(l)) == null || r.abort(), v.delete(l), E.delete(l), x.delete(l);
+    z.value = new Set(v.keys()), S.value = "";
+    const t = o.commit(
+      (l) => l.filter((u) => !a.has(u.uid)),
+      "clear",
+      { force: !0, allowInactive: !0 }
+    );
+    return t.then((l) => {
+      l && C();
+    }), t;
+  }
+  function B(e) {
+    var a;
+    return R(e.thumbUrl, !0) ?? (N(e) ? R(e.url, !0) : void 0) ?? ((a = L.value.get(e.uid)) == null ? void 0 : a.url);
+  }
+  function oe(e) {
+    const a = L.value.get(e.uid);
+    if (a && a.raw === e.raw) return a.url;
+    if (!(!e.raw || !N(e) || typeof URL.createObjectURL != "function"))
+      try {
+        const t = URL.createObjectURL(e.raw);
+        return a && URL.revokeObjectURL(a.url), L.value = new Map(L.value).set(e.uid, {
+          raw: e.raw,
+          url: t
+        }), t;
+      } catch {
+      }
+  }
+  function he() {
+    for (const e of L.value.values())
+      URL.revokeObjectURL(e.url);
+    L.value = /* @__PURE__ */ new Map();
+  }
+  function H() {
+    var l;
+    const e = c.value && i.showFileList !== !1 && i.listType !== "text", a = new Map(o.files.value.map((u) => [u.uid, u]));
+    let t = !1;
+    const r = new Map(L.value);
+    for (const [u, s] of r) {
+      const n = a.get(u);
+      (!n || n.raw !== s.raw || !e && ((l = I.value) == null ? void 0 : l.file.uid) !== u || R(n.thumbUrl, !0) || N(n) && R(n.url, !0)) && (URL.revokeObjectURL(s.url), r.delete(u), t = !0);
+    }
+    if (t && (L.value = r), e)
+      for (const u of o.files.value)
+        N(u) && !B(u) && oe(u);
+  }
+  function se() {
+    g == null || g.abort(), g = void 0, M = void 0, I.value = void 0, H();
+  }
+  async function ce(e) {
+    const a = o.files.value.find((r) => r.uid === Z(e));
+    if (!a || !c.value || j.disabled.value || i.loading)
+      return !1;
+    g == null || g.abort();
+    const t = new AbortController();
+    g = t, M = a;
+    try {
+      d("preview", a);
+      const r = i.previewFile ? await i.previewFile(a, {
+        signal: t.signal,
+        files: o.files.value
+      }) : void 0;
+      if (!c.value || t.signal.aborted || !o.files.value.some(
+        (u) => u.uid === a.uid && u.raw === a.raw
+      ) || r === !1)
+        return !1;
+      const l = typeof r == "string" ? R(r, !0) : B(a) ?? oe(a);
+      return l ? (I.value = { file: a, url: l }, !0) : !1;
+    } catch (r) {
+      return c.value && !t.signal.aborted && X(r), !1;
+    }
+  }
+  async function fe(e) {
+    const a = o.files.value.find((r) => r.uid === Z(e));
+    if (!a || !c.value || j.disabled.value || i.loading)
+      return !1;
+    b == null || b.abort();
+    const t = new AbortController();
+    b = t, O = a;
+    try {
+      d("download", a);
+      const r = i.downloadFile ? await i.downloadFile(a, {
+        signal: t.signal,
+        files: o.files.value
+      }) : void 0;
+      if (!c.value || t.signal.aborted || !o.files.value.some((n) => n.uid === a.uid && n.raw === a.raw))
+        return !1;
+      if (i.downloadFile && typeof r != "string")
+        return r !== !1;
+      let l;
+      const u = typeof r == "string" ? R(r) : R(a.url) ?? (a.raw && typeof URL.createObjectURL == "function" ? l = URL.createObjectURL(a.raw) : void 0);
+      if (!u) return !1;
+      const s = document.createElement("a");
+      return s.href = u, s.download = a.name, s.rel = "noopener noreferrer", s.target = "_blank", document.body.append(s), s.click(), s.remove(), l && setTimeout(() => URL.revokeObjectURL(l), 0), !0;
+    } catch (r) {
+      return c.value && !t.signal.aborted && X(r), !1;
+    }
+  }
+  function Ue(e) {
+    return i.showPreview !== !1 && (!!i.previewFile || N(e) && !!(e.raw || B(e)));
+  }
+  function ke(e) {
+    return i.showDownload !== !1 && !!(i.downloadFile || e.raw || R(e.url));
+  }
+  function Le(e) {
+    return {
+      file: e,
+      status: we(e),
+      percentage: He(e),
+      queued: f.queuedKeys.value.has(e.uid),
+      busy: f.activeKeys.value.has(e.uid) || z.value.has(e.uid),
+      thumbnail: B(e),
+      actions: {
+        preview: () => ce(e),
+        download: () => fe(e),
+        remove: () => ue(e),
+        retry: () => f.retry(e.uid),
+        abort: () => f.abort(e.uid)
+      }
+    };
+  }
+  function V(e) {
+    var a;
+    !m.value || F.value || (e == null || e.preventDefault(), e == null || e.stopPropagation(), (a = U.value) == null || a.click());
+  }
+  function Re(e) {
+    i.openFileDialogOnClick === !1 || e.defaultPrevented || e.target.closest(
+      "input,textarea,select,a[href],[data-upload-no-trigger]"
+    ) || V(e);
+  }
+  function Fe(e) {
+    e.target.closest(
+      'button,a[href],input,textarea,select,[contenteditable="true"]'
+    ) || (e.key === "Enter" || e.key === " ") && i.openFileDialogOnClick !== !1 && V(e);
+  }
+  function Se(e) {
+    var t;
+    if (A.value = !1, p = 0, i.drag === !1 || !m.value) return;
+    const a = Array.from(((t = e.dataTransfer) == null ? void 0 : t.files) ?? []);
+    a.length && (e.preventDefault(), d("drop", e), $(a));
+  }
+  function xe(e) {
+    var a;
+    i.drag === !1 || !m.value || !Array.from(((a = e.dataTransfer) == null ? void 0 : a.types) ?? []).includes("Files") || (e.preventDefault(), p++, A.value = !0);
+  }
+  function ze(e) {
+    var a;
+    i.drag === !1 || !m.value || !Array.from(((a = e.dataTransfer) == null ? void 0 : a.types) ?? []).includes("Files") || (e.preventDefault(), e.dataTransfer && (e.dataTransfer.dropEffect = "copy"), A.value = !0);
+  }
+  function De() {
+    p = Math.max(0, p - 1), p || (A.value = !1);
+  }
+  function Me(e) {
+    var t;
+    if (!i.paste || !m.value) return;
+    const a = Array.from(((t = e.clipboardData) == null ? void 0 : t.files) ?? []);
+    a.length && (e.preventDefault(), d("paste", e), $(a));
+  }
+  function _(e = !0) {
+    Y(), o.cancel();
+    const a = new Set(f.tasks.value.keys());
+    f.cleanup();
+    for (const t of v.values()) t.abort();
+    v.clear(), E.clear(), W.clear(), z.value = /* @__PURE__ */ new Set(), g == null || g.abort(), b == null || b.abort(), M = O = void 0, I.value = void 0, he(), e && o.interrupt(a);
+  }
+  K(
+    m,
+    (e) => {
+      e || _();
+    },
+    { flush: "sync" }
+  ), K(
+    () => [
+      i.accept,
+      i.limit,
+      i.maxSize,
+      i.multiple,
+      i.beforeUpload
+    ],
+    () => {
+      Y();
+      for (const [e, a] of f.tasks.value)
+        a.phase === "preparing" && f.abort(e, "configuration");
+    }
+  ), K(
+    () => o.files.value.map((e) => [
+      e.uid,
+      e.raw,
+      e.url,
+      e.thumbUrl,
+      e.type,
+      e.name
+    ]),
+    () => {
+      var t, r, l, u;
+      const e = o.files.value, a = new Map(e.map((s) => [s.uid, s]));
+      for (const [s, n] of x)
+        ((t = a.get(s)) == null ? void 0 : t.raw) !== n.raw && x.delete(s);
+      for (const [s, n] of v)
+        (!a.has(s) && !W.has(s) || a.has(s) && ((r = a.get(s)) == null ? void 0 : r.raw) !== E.get(s)) && (n.abort(), v.delete(s), E.delete(s), z.value = new Set(v.keys()));
+      M && (!a.has(M.uid) || ((l = a.get(M.uid)) == null ? void 0 : l.raw) !== M.raw) && se(), O && (!a.has(O.uid) || ((u = a.get(O.uid)) == null ? void 0 : u.raw) !== O.raw) && (b == null || b.abort(), b = void 0, O = void 0), H();
+    },
+    { flush: "post" }
+  ), K(() => [i.listType, i.showFileList], H);
+  function de() {
+    _(!1), o.resetLocal(), S.value = "";
+  }
+  K(
+    () => k == null ? void 0 : k.resetting.value,
+    (e) => {
+      e && de();
+    },
+    { flush: "sync" }
+  ), Ne(U, de), je(() => {
+    c.value = !1, _();
+  }), Ee(() => {
+    c.value = !1, _();
+  }), Pe(() => {
+    c.value = !0, H();
+  });
+  const Oe = ee(() => ({
+    files: o.files.value,
+    busy: F.value,
+    disabled: !m.value,
+    uploading: f.uploading.value,
+    queued: f.queued.value,
+    open: V,
+    submit: () => f.submit(),
+    abort: () => f.abort(),
+    clear: () => ne()
+  }));
+  function Te(e) {
+    var a, t;
+    (a = te.value) != null && a.contains(e.relatedTarget) || i.validateEvent !== !1 && ((t = w == null ? void 0 : w.validate) == null || t.call(w, "blur"));
+  }
+  return {
+    element: te,
+    zone: ie,
+    input: U,
+    active: c,
+    available: m,
+    disabled: j.disabled,
+    size: j.size,
+    label: j.label,
+    field: w,
+    checking: F,
+    dragging: A,
+    lastError: S,
+    words: ge,
+    files: o.files,
+    requests: f,
+    removing: z,
+    preview: I,
+    closePreview: se,
+    context: Le,
+    scope: Oe,
+    canPreview: Ue,
+    canDownload: ke,
+    open: V,
+    click: Re,
+    keys: Fe,
+    drop: Se,
+    dragEnter: xe,
+    dragOver: ze,
+    dragLeave: De,
+    paste: Me,
+    blur: Te,
+    addFiles: $,
+    remove: ue,
+    clearFiles: ne,
+    previewFile: ce,
+    download: fe,
+    focus: () => {
+      var e;
+      m.value && ((e = ie.value) == null || e.focus());
+    }
+  };
+}
+export {
+  Ye as useUpload
+};

package/dist/composables/useUploadModel.js

@@ -0,0 +1,65 @@
+import { shallowRef as A, computed as p, nextTick as D, toRaw as F } from "vue";
+const P = (n, u) => Object.is(F(n), F(u));
+function L(n) {
+  const u = /* @__PURE__ */ new Set();
+  return n.filter(
+    (t) => t && typeof t.uid == "string" && t.uid && typeof t.name == "string" && !u.has(t.uid) && !!u.add(t.uid)
+  );
+}
+function G(n, u, t) {
+  const x = () => L(n.defaultFileList ?? n.defaultValue ?? []).map(
+    (c) => ({ ...c })
+  ), f = A(x()), b = p(() => n.fileList ?? n.modelValue), r = p(() => b.value !== void 0), d = p(() => L(b.value ?? f.value));
+  let i = 0, k = Promise.resolve();
+  async function S(c, l, a = {}) {
+    const h = i, g = async () => {
+      var O, R, z;
+      if (h !== i || !a.allowInactive && !t() || ((O = a.guard) == null ? void 0 : O.call(a)) === !1)
+        return !1;
+      const m = d.value, j = c(m);
+      if (!j) return !1;
+      const s = L(j), C = new Map(m.map((e) => [e.uid, e])), q = new Map(s.map((e) => [e.uid, e])), I = m.filter((e) => !q.has(e.uid)), w = s.map((e) => ({
+        file: e,
+        keys: Object.keys(e).filter(
+          (o) => !C.has(e.uid) || !P(C.get(e.uid)[o], e[o])
+        )
+      })).filter((e) => e.keys.length);
+      if (!a.force && !I.length && !w.length || (r.value || (f.value = s), u("update:fileList", s), u("update:modelValue", s), r.value && await D(), h !== i || !a.allowInactive && !t() || ((R = a.guard) == null ? void 0 : R.call(a)) === !1))
+        return !1;
+      const y = d.value, v = new Map(y.map((e) => [e.uid, e]));
+      return I.some((e) => v.has(e.uid)) || w.some(
+        ({ file: e, keys: o }) => !v.has(e.uid) || o.some(
+          (B) => !P(v.get(e.uid)[B], e[B])
+        )
+      ) ? !1 : ((z = a.accepted) == null || z.call(a), u("change", [...y]), u("fileChange", {
+        type: l,
+        files: [...y],
+        changed: w.map((e) => v.get(e.file.uid)).filter(Boolean)
+      }), !0);
+    };
+    if (!r.value) return g();
+    const V = k.then(g, g);
+    return k = V.catch(() => {
+    }), V;
+  }
+  function M() {
+    i++;
+  }
+  function T() {
+    M(), r.value || (f.value = x());
+  }
+  function U(c) {
+    const l = d.value.map(
+      (a) => c.has(a.uid) && a.status === "uploading" ? { ...a, status: "ready", percentage: 0 } : a
+    );
+    l.every((a, h) => a === d.value[h]) || (r.value || (f.value = l), u("update:fileList", l), u("update:modelValue", l), r.value || (u("change", [...l]), u("fileChange", {
+      type: "abort",
+      files: l,
+      changed: l.filter((a) => c.has(a.uid))
+    })));
+  }
+  return { files: d, controlled: r, commit: S, cancel: M, resetLocal: T, interrupt: U };
+}
+export {
+  G as useUploadModel
+};