vue3-image-compressor 1.0.4

package/dist/vue-image-compressor.js

@@ -0,0 +1,660 @@
+import { ref as b, onUnmounted as Q, computed as q, defineComponent as H, watch as K, openBlock as _, createElementBlock as k, createElementVNode as g, withModifiers as N, renderSlot as S, toDisplayString as T, unref as m, createCommentVNode as z, withDirectives as X, isRef as Y, Fragment as Z, renderList as ee, vModelSelect as te, createTextVNode as ne } from "vue";
+const L = {
+  mozJPEG: {
+    label: "MozJPEG",
+    mimeType: "image/jpeg",
+    extension: "jpg"
+  },
+  webP: {
+    label: "WebP",
+    mimeType: "image/webp",
+    extension: "webp"
+  },
+  avif: {
+    label: "AVIF",
+    mimeType: "image/avif",
+    extension: "avif"
+  },
+  jxl: {
+    label: "JPEG XL",
+    mimeType: "image/jxl",
+    extension: "jxl"
+  },
+  oxiPNG: {
+    label: "OxiPNG",
+    mimeType: "image/png",
+    extension: "png"
+  },
+  browserJPEG: {
+    label: "Browser JPEG",
+    mimeType: "image/jpeg",
+    extension: "jpg"
+  },
+  browserPNG: {
+    label: "Browser PNG",
+    mimeType: "image/png",
+    extension: "png"
+  },
+  browserGIF: {
+    label: "Browser GIF",
+    mimeType: "image/gif",
+    extension: "gif"
+  },
+  qoi: {
+    label: "QOI",
+    mimeType: "image/qoi",
+    extension: "qoi"
+  },
+  wp2: {
+    label: "WebP2",
+    mimeType: "image/webp2",
+    extension: "wp2"
+  }
+}, W = {
+  mozJPEG: {
+    quality: 75,
+    baseline: !1,
+    arithmetic: !1,
+    progressive: !0,
+    optimize_coding: !0,
+    smoothing: 0,
+    color_space: 3,
+    quant_table: 3,
+    trellis_multipass: !1,
+    trellis_opt_zero: !1,
+    trellis_opt_table: !1,
+    trellis_loops: 1,
+    auto_subsample: !0,
+    chroma_subsample: 2,
+    separate_chroma_quality: !1,
+    chroma_quality: 75
+  },
+  webP: {
+    quality: 75,
+    target_size: 0,
+    target_PSNR: 0,
+    method: 4,
+    sns_strength: 50,
+    filter_strength: 60,
+    filter_sharpness: 0,
+    filter_type: 1,
+    partitions: 0,
+    segments: 4,
+    pass: 1,
+    show_compressed: 0,
+    preprocessing: 0,
+    autofilter: 0,
+    partition_limit: 0,
+    alpha_compression: 1,
+    alpha_filtering: 1,
+    alpha_quality: 100,
+    lossless: 0,
+    exact: 0,
+    use_delta_palette: 0,
+    vlnr: 0,
+    near_lossless: 60
+  },
+  avif: {
+    cqLevel: 33,
+    denoiseLevel: 0,
+    cqAlphaLevel: -1,
+    tileRows: 0,
+    tileCols: 0,
+    speed: 6,
+    subsample: 1,
+    chromaDeltaQ: !1,
+    sharpness: 0,
+    tune: 0
+  },
+  jxl: {
+    effort: 7,
+    quality: 75,
+    progressive: !1,
+    targetPsize: 0
+  },
+  oxiPNG: {
+    level: 2
+  },
+  browserJPEG: {
+    quality: 0.75
+  },
+  browserPNG: {},
+  browserGIF: {},
+  qoi: {},
+  wp2: {
+    quality: 75
+  }
+}, re = Object.keys(L);
+async function oe(t) {
+  const e = await createImageBitmap(t), r = document.createElement("canvas");
+  r.width = e.width, r.height = e.height;
+  const n = r.getContext("2d");
+  return n.drawImage(e, 0, 0), n.getImageData(0, 0, r.width, r.height);
+}
+async function J(t, e, r) {
+  const n = document.createElement("canvas");
+  return n.width = t.width, n.height = t.height, n.getContext("2d").putImageData(t, 0, 0), new Promise((p) => {
+    n.toBlob(
+      (c) => p(c),
+      e,
+      r
+    );
+  });
+}
+function Ge(t) {
+  return new Promise((e, r) => {
+    const n = new Image();
+    n.onload = () => {
+      e({ width: n.width, height: n.height }), URL.revokeObjectURL(n.src);
+    }, n.onerror = r, n.src = URL.createObjectURL(t);
+  });
+}
+async function se(t) {
+  const e = new Uint8Array(await t.slice(0, 4).arrayBuffer());
+  return e[0] === 137 && e[1] === 80 ? "image/png" : e[0] === 255 && e[1] === 216 ? "image/jpeg" : e[0] === 71 && e[1] === 73 ? "image/gif" : e[0] === 82 && e[1] === 73 ? "image/webp" : e[0] === 0 && e[1] === 0 ? "image/avif" : t.type || "image/jpeg";
+}
+function ae(t) {
+  return new Promise((e) => {
+    const r = new Image();
+    r.onload = () => e(!0), r.onerror = () => e(!1), r.src = `data:${t};base64,`;
+  });
+}
+function ie(t, e, r) {
+  return new File([t], e, { type: r });
+}
+function $(t, e = 2) {
+  if (t === 0) return "0 Bytes";
+  const r = 1024, n = e < 0 ? 0 : e, u = ["Bytes", "KB", "MB", "GB"], p = Math.floor(Math.log(t) / Math.log(r));
+  return parseFloat((t / Math.pow(r, p)).toFixed(n)) + " " + u[p];
+}
+function le(t, e) {
+  return t === 0 ? 0 : Math.round((t - e) / t * 100);
+}
+function ce(t, e) {
+  return `${t.replace(/\.[^.]+$/, "")}_compressed.${e}`;
+}
+function V(t) {
+  return URL.createObjectURL(t);
+}
+function ue(t) {
+  URL.revokeObjectURL(t);
+}
+const de = 1e4;
+function me() {
+  const t = b(!1), e = b(!1), r = b(null);
+  let n = null, u = null;
+  function p() {
+    if (!n)
+      try {
+        e.value = !0, n = new Worker(
+          new URL(
+            /* @vite-ignore */
+            "/assets/imageWorker-DyeUTFOy.js",
+            import.meta.url
+          ),
+          { type: "module" }
+        ), t.value = !0, r.value = null;
+      } catch (x) {
+        r.value = x instanceof Error ? x : new Error("Failed to start worker"), console.error("Worker start failed:", x);
+      } finally {
+        e.value = !1;
+      }
+  }
+  function c() {
+    u && (clearTimeout(u), u = null), n && (n.terminate(), n = null, t.value = !1);
+  }
+  function h() {
+    u && clearTimeout(u), u = window.setTimeout(() => {
+      c();
+    }, de);
+  }
+  async function w() {
+    if (n || p(), !n)
+      throw new Error("Worker failed to initialize");
+    return n;
+  }
+  async function P(x, C) {
+    if (x.aborted)
+      throw new DOMException("AbortError", "AbortError");
+    return clearTimeout(u), new Promise((G, R) => {
+      const O = () => {
+        c(), R(new DOMException("AbortError", "AbortError"));
+      };
+      x.addEventListener("abort", O), C().then(G).catch(R).finally(() => {
+        x.removeEventListener("abort", O), h();
+      });
+    });
+  }
+  return Q(() => {
+    c();
+  }), {
+    isReady: t,
+    isLoading: e,
+    error: r,
+    worker: n,
+    getWorkerApi: w,
+    executeTask: P,
+    terminateWorker: c
+  };
+}
+function pe() {
+  const t = b(!1), e = b(0), r = b(null), n = b(null), u = b(null), { getWorkerApi: p, executeTask: c } = me(), h = q(() => t.value && !!u.value);
+  async function w(d, o) {
+    const a = await se(o), i = await ae(a), f = await p();
+    if (!i) {
+      if (a === "image/avif")
+        return c(d, () => f.avifDecode(o));
+      if (a === "image/webp")
+        return c(d, () => f.webpDecode(o));
+      if (a === "image/jxl")
+        return c(d, () => f.jxlDecode(o));
+      if (a === "image/webp2")
+        return c(d, () => f.wp2Decode(o));
+      if (a === "image/qoi")
+        return c(d, () => f.qoiDecode(o));
+    }
+    return oe(o);
+  }
+  async function P(d, o, a) {
+    if (a === 0) return o;
+    const i = await p();
+    return c(
+      d,
+      () => i.rotate(o, { rotate: a })
+    );
+  }
+  async function x(d, o, a) {
+    var v, y;
+    let i = o;
+    const f = await p();
+    return (v = a.resize) != null && v.enabled && (i = await c(
+      d,
+      () => f.resize(i, {
+        width: a.resize.width || i.width,
+        height: a.resize.height || i.height,
+        method: a.resize.method || "lanczos3",
+        fitMethod: a.resize.fitMethod || "stretch",
+        premultiply: !0,
+        linearRGB: !0
+      })
+    )), (y = a.quantize) != null && y.enabled && (i = await c(
+      d,
+      () => f.quantize(i, {
+        numColors: a.quantize.numColors || 256,
+        dither: a.quantize.dither || 1
+      })
+    )), i;
+  }
+  async function C(d, o, a) {
+    const i = await p(), f = a.encoder;
+    if (f === "browserJPEG")
+      return (await J(
+        o,
+        "image/jpeg",
+        a.encoderOptions.quality
+      )).arrayBuffer();
+    if (f === "browserPNG")
+      return (await J(o, "image/png")).arrayBuffer();
+    if (f === "browserGIF")
+      throw new Error("Browser GIF encoding not supported directly");
+    const y = {
+      mozJPEG: i.mozjpegEncode,
+      webP: i.webpEncode,
+      avif: i.avifEncode,
+      jxl: i.jxlEncode,
+      oxiPNG: i.oxipngEncode,
+      qoi: i.qoiEncode,
+      wp2: i.wp2Encode
+    }[f];
+    if (!y)
+      throw new Error(`Unknown encoder: ${f}`);
+    return (await c(
+      d,
+      () => y.call(i, o, a.encoderOptions)
+    )).buffer;
+  }
+  async function G(d, o) {
+    var f;
+    u.value = new AbortController();
+    const a = u.value.signal;
+    t.value = !0, e.value = 0, r.value = null;
+    const i = n.value;
+    n.value = null, (f = i == null ? void 0 : i.compressed) != null && f.blobUrl && ue(i.compressed.blobUrl);
+    try {
+      e.value = 10;
+      const v = {
+        file: d,
+        size: d.size,
+        width: 0,
+        height: 0,
+        blobUrl: V(d)
+      }, y = await w(a, d);
+      v.width = y.width, v.height = y.height, e.value = 25;
+      const j = await P(
+        a,
+        y,
+        o.rotate || 0
+      );
+      e.value = 35;
+      const U = await x(a, j, o);
+      e.value = 50;
+      const F = await C(a, U, o);
+      e.value = 80;
+      const I = L[o.encoder], M = ce(
+        d.name,
+        (I == null ? void 0 : I.extension) || "bin"
+      ), D = ie(
+        F,
+        M,
+        (I == null ? void 0 : I.mimeType) || "application/octet-stream"
+      ), B = {
+        file: D,
+        size: D.size,
+        width: U.width,
+        height: U.height,
+        blobUrl: V(D)
+      }, l = {
+        original: v,
+        compressed: B,
+        savingsBytes: v.size - B.size,
+        savingsPercent: le(v.size, B.size),
+        encoderType: o.encoder,
+        encoderOptions: o.encoderOptions
+      };
+      return n.value = l, e.value = 100, l;
+    } catch (v) {
+      if (v instanceof DOMException && v.name === "AbortError")
+        throw r.value = "已取消", v;
+      const y = v instanceof Error ? v.message : "压缩失败";
+      throw r.value = y, console.error("Compression error:", v), v;
+    } finally {
+      t.value = !1, u.value = null;
+    }
+  }
+  function R() {
+    u.value && u.value.abort();
+  }
+  function O() {
+    if (!n.value) return;
+    const { compressed: d } = n.value, o = document.createElement("a");
+    o.href = d.blobUrl, o.download = d.file.name, document.body.appendChild(o), o.click(), document.body.removeChild(o);
+  }
+  return {
+    compress: G,
+    cancel: R,
+    downloadResult: O,
+    isCompressing: t,
+    progress: e,
+    error: r,
+    result: n,
+    canCancel: h
+  };
+}
+function fe() {
+  const t = b("mozJPEG"), e = b({}), r = q(() => L[t.value]), n = q(
+    () => W[t.value]
+  ), u = q(
+    () => re.map((w) => ({
+      type: w,
+      label: L[w].label,
+      mimeType: L[w].mimeType,
+      extension: L[w].extension
+    }))
+  );
+  function p(w) {
+    t.value = w, e.value = { ...W[w] };
+  }
+  function c(w, P) {
+    e.value = {
+      ...e.value,
+      [w]: P
+    };
+  }
+  function h() {
+    e.value = { ...n.value };
+  }
+  return h(), {
+    selectedEncoder: t,
+    encoderOptions: e,
+    currentMeta: r,
+    currentDefaults: n,
+    availableEncoders: u,
+    selectEncoder: p,
+    updateOption: c,
+    resetOptions: h
+  };
+}
+const ve = { class: "image-compressor" }, ge = {
+  key: 0,
+  class: "preview-area"
+}, we = { class: "preview-item" }, be = ["src"], he = { class: "preview-item" }, ye = ["src"], Ee = {
+  key: 1,
+  class: "compressing"
+}, _e = ["value"], ke = { key: 2 }, xe = {
+  key: 1,
+  class: "encoder-settings"
+}, Oe = ["value"], Te = {
+  key: 0,
+  class: "quality-control"
+}, ze = ["value"], Pe = {
+  key: 2,
+  class: "actions"
+}, Ie = ["disabled"], Ce = {
+  key: 3,
+  class: "error"
+}, Re = /* @__PURE__ */ H({
+  __name: "ImageCompressor",
+  props: {
+    defaultEncoder: {},
+    defaultOptions: {}
+  },
+  emits: ["success", "error", "cancel"],
+  setup(t, { emit: e }) {
+    const r = t, n = e, u = b(null), p = b(null), c = b(""), h = b(""), {
+      compress: w,
+      cancel: P,
+      downloadResult: x,
+      isCompressing: C,
+      progress: G,
+      error: R,
+      result: O,
+      canCancel: d
+    } = pe(), {
+      selectedEncoder: o,
+      encoderOptions: a,
+      availableEncoders: i,
+      selectEncoder: f,
+      updateOption: v
+    } = fe();
+    r.defaultEncoder && f(r.defaultEncoder), r.defaultOptions && Object.entries(r.defaultOptions).forEach(([l, s]) => v(l, s));
+    const y = q(
+      () => p.value ? $(p.value.size) : ""
+    ), j = q(
+      () => O.value ? $(O.value.compressed.size) : ""
+    ), U = q(
+      () => ["mozJPEG", "webP", "jxl", "browserJPEG", "wp2"].includes(o.value)
+    );
+    function F(l) {
+      const s = l.target;
+      s.files && s.files[0] && M(s.files[0]);
+    }
+    function I(l) {
+      var s;
+      (s = l.dataTransfer) != null && s.files[0] && M(l.dataTransfer.files[0]);
+    }
+    function M(l) {
+      l.type.startsWith("image/") && (p.value = l, c.value = URL.createObjectURL(l), h.value && (URL.revokeObjectURL(h.value), h.value = ""));
+    }
+    function D() {
+      f(o.value);
+    }
+    async function B() {
+      if (p.value)
+        try {
+          const l = {
+            encoder: o.value,
+            encoderOptions: { ...a.value }
+          }, s = await w(p.value, l);
+          h.value = s.compressed.blobUrl, n("success", s);
+        } catch (l) {
+          if (l instanceof DOMException && l.name === "AbortError") {
+            n("cancel");
+            return;
+          }
+          n("error", l instanceof Error ? l : new Error(String(l)));
+        }
+    }
+    return K(
+      () => p.value,
+      (l, s) => {
+        l && l !== s && c.value && URL.revokeObjectURL(c.value);
+      }
+    ), (l, s) => (_(), k("div", ve, [
+      g("div", {
+        class: "upload-zone",
+        onDrop: N(I, ["prevent"]),
+        onDragover: s[1] || (s[1] = N(() => {
+        }, ["prevent"]))
+      }, [
+        g("input", {
+          type: "file",
+          accept: "image/*",
+          onChange: F,
+          ref_key: "fileInput",
+          ref: u,
+          class: "file-input"
+        }, null, 544),
+        g("div", {
+          class: "upload-prompt",
+          onClick: s[0] || (s[0] = (E) => {
+            var A;
+            return (A = u.value) == null ? void 0 : A.click();
+          })
+        }, [
+          S(l.$slots, "upload-prompt", {}, () => [
+            s[6] || (s[6] = g("p", null, "拖拽图片到此处，或点击上传", -1))
+          ], !0)
+        ])
+      ], 32),
+      c.value ? (_(), k("div", ge, [
+        g("div", we, [
+          s[7] || (s[7] = g("h4", null, "原始图片", -1)),
+          g("img", {
+            src: c.value,
+            alt: "Original"
+          }, null, 8, be),
+          g("p", null, T(y.value), 1)
+        ]),
+        g("div", he, [
+          s[8] || (s[8] = g("h4", null, "压缩后", -1)),
+          h.value ? (_(), k("img", {
+            key: 0,
+            src: h.value,
+            alt: "Compressed"
+          }, null, 8, ye)) : m(C) ? (_(), k("div", Ee, [
+            g("progress", {
+              value: m(G),
+              max: "100"
+            }, null, 8, _e),
+            g("p", null, "压缩中... " + T(m(G)) + "%", 1)
+          ])) : z("", !0),
+          j.value ? (_(), k("p", ke, T(j.value), 1)) : z("", !0)
+        ])
+      ])) : z("", !0),
+      c.value ? (_(), k("div", xe, [
+        s[9] || (s[9] = g("label", null, "编码器：", -1)),
+        X(g("select", {
+          "onUpdate:modelValue": s[2] || (s[2] = (E) => Y(o) ? o.value = E : null),
+          onChange: D
+        }, [
+          (_(!0), k(Z, null, ee(m(i), (E) => (_(), k("option", {
+            key: E.type,
+            value: E.type
+          }, T(E.label) + " (" + T(E.extension) + ") ", 9, Oe))), 128))
+        ], 544), [
+          [te, m(o)]
+        ]),
+        U.value ? (_(), k("div", Te, [
+          g("label", null, [
+            ne(" 质量: " + T(m(a).quality ?? 75) + " ", 1),
+            g("input", {
+              type: "range",
+              min: "0",
+              max: "100",
+              value: m(a).quality ?? 75,
+              onInput: s[3] || (s[3] = (E) => m(v)("quality", Number(E.target.value))),
+              "-------": "",
+              REPLACE: ""
+            }, null, 40, ze)
+          ])
+        ])) : z("", !0),
+        S(l.$slots, "encoder-settings", {
+          encoder: m(o),
+          options: m(a)
+        }, void 0, !0)
+      ])) : z("", !0),
+      c.value ? (_(), k("div", Pe, [
+        g("button", {
+          onClick: B,
+          disabled: m(C),
+          class: "btn-primary"
+        }, T(m(C) ? "压缩中..." : "开始压缩"), 9, Ie),
+        m(d) ? (_(), k("button", {
+          key: 0,
+          onClick: s[4] || (s[4] = //@ts-ignore
+          (...E) => m(P) && m(P)(...E)),
+          class: "btn-secondary"
+        }, " 取消 ")) : z("", !0),
+        m(O) ? (_(), k("button", {
+          key: 1,
+          onClick: s[5] || (s[5] = //@ts-ignore
+          (...E) => m(x) && m(x)(...E)),
+          class: "btn-success"
+        }, " 下载 (节省 " + T(m(O).savingsPercent) + "%) ", 1)) : z("", !0)
+      ])) : z("", !0),
+      m(R) ? (_(), k("div", Ce, T(m(R)), 1)) : z("", !0)
+    ]));
+  }
+}), Ue = (t, e) => {
+  const r = t.__vccOpts || t;
+  for (const [n, u] of e)
+    r[n] = u;
+  return r;
+}, Le = /* @__PURE__ */ Ue(Re, [["__scopeId", "data-v-86f2b482"]]), je = [
+  { value: "lanczos3", label: "Lanczos3" },
+  { value: "catrom", label: "Catrom" },
+  { value: "mitchell", label: "Mitchell" },
+  { value: "triangle", label: "Triangle" },
+  { value: "vector", label: "Vector" }
+], De = [
+  { value: "stretch", label: "拉伸" },
+  { value: "contain", label: "适应" }
+], Be = [
+  { value: 0, label: "不旋转" },
+  { value: 90, label: "顺时针 90°" },
+  { value: 180, label: "旋转 180°" },
+  { value: 270, label: "逆时针 90°" }
+];
+export {
+  W as DEFAULT_ENCODER_OPTIONS,
+  re as ENCODER_LIST,
+  L as ENCODER_REGISTRY,
+  De as FIT_METHODS,
+  Le as ImageCompressor,
+  je as RESIZE_METHODS,
+  Be as ROTATE_OPTIONS,
+  ie as arrayBufferToFile,
+  oe as blobToImageData,
+  le as calculateSavings,
+  ae as canDecodeImageType,
+  V as createBlobUrl,
+  $ as formatBytes,
+  ce as generateCompressedFilename,
+  Ge as getImageDimensions,
+  J as imageDataToBlob,
+  ue as revokeBlobUrl,
+  se as sniffMimeType,
+  pe as useCompression,
+  fe as useEncoderRegistry,
+  me as useWorker
+};

package/dist/vue-image-compressor.umd.cjs

@@ -0,0 +1 @@
+(function(s,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(s=typeof globalThis<"u"?globalThis:s||self,e(s.VueImageCompressor={},s.Vue))})(this,function(s,e){"use strict";var v=typeof document<"u"?document.currentScript:null;const B={mozJPEG:{label:"MozJPEG",mimeType:"image/jpeg",extension:"jpg"},webP:{label:"WebP",mimeType:"image/webp",extension:"webp"},avif:{label:"AVIF",mimeType:"image/avif",extension:"avif"},jxl:{label:"JPEG XL",mimeType:"image/jxl",extension:"jxl"},oxiPNG:{label:"OxiPNG",mimeType:"image/png",extension:"png"},browserJPEG:{label:"Browser JPEG",mimeType:"image/jpeg",extension:"jpg"},browserPNG:{label:"Browser PNG",mimeType:"image/png",extension:"png"},browserGIF:{label:"Browser GIF",mimeType:"image/gif",extension:"gif"},qoi:{label:"QOI",mimeType:"image/qoi",extension:"qoi"},wp2:{label:"WebP2",mimeType:"image/webp2",extension:"wp2"}},S={mozJPEG:{quality:75,baseline:!1,arithmetic:!1,progressive:!0,optimize_coding:!0,smoothing:0,color_space:3,quant_table:3,trellis_multipass:!1,trellis_opt_zero:!1,trellis_opt_table:!1,trellis_loops:1,auto_subsample:!0,chroma_subsample:2,separate_chroma_quality:!1,chroma_quality:75},webP:{quality:75,target_size:0,target_PSNR:0,method:4,sns_strength:50,filter_strength:60,filter_sharpness:0,filter_type:1,partitions:0,segments:4,pass:1,show_compressed:0,preprocessing:0,autofilter:0,partition_limit:0,alpha_compression:1,alpha_filtering:1,alpha_quality:100,lossless:0,exact:0,use_delta_palette:0,vlnr:0,near_lossless:60},avif:{cqLevel:33,denoiseLevel:0,cqAlphaLevel:-1,tileRows:0,tileCols:0,speed:6,subsample:1,chromaDeltaQ:!1,sharpness:0,tune:0},jxl:{effort:7,quality:75,progressive:!1,targetPsize:0},oxiPNG:{level:2},browserJPEG:{quality:.75},browserPNG:{},browserGIF:{},qoi:{},wp2:{quality:75}},G=Object.keys(B);async function M(n){const t=await createImageBitmap(n),r=document.createElement("canvas");r.width=t.width,r.height=t.height;const o=r.getContext("2d");return o.drawImage(t,0,0),o.getImageData(0,0,r.width,r.height)}async function L(n,t,r){const o=document.createElement("canvas");return o.width=n.width,o.height=n.height,o.getContext("2d").putImageData(n,0,0),new Promise(p=>{o.toBlob(m=>p(m),t,r)})}function Z(n){return new Promise((t,r)=>{const o=new Image;o.onload=()=>{t({width:o.width,height:o.height}),URL.revokeObjectURL(o.src)},o.onerror=r,o.src=URL.createObjectURL(n)})}async function x(n){const t=new Uint8Array(await n.slice(0,4).arrayBuffer());return t[0]===137&&t[1]===80?"image/png":t[0]===255&&t[1]===216?"image/jpeg":t[0]===71&&t[1]===73?"image/gif":t[0]===82&&t[1]===73?"image/webp":t[0]===0&&t[1]===0?"image/avif":n.type||"image/jpeg"}function F(n){return new Promise(t=>{const r=new Image;r.onload=()=>t(!0),r.onerror=()=>t(!1),r.src=`data:${n};base64,`})}function A(n,t,r){return new File([n],t,{type:r})}function V(n,t=2){if(n===0)return"0 Bytes";const r=1024,o=t<0?0:t,u=["Bytes","KB","MB","GB"],p=Math.floor(Math.log(n)/Math.log(r));return parseFloat((n/Math.pow(r,p)).toFixed(o))+" "+u[p]}function W(n,t){return n===0?0:Math.round((n-t)/n*100)}function J(n,t){return`${n.replace(/\.[^.]+$/,"")}_compressed.${t}`}function q(n){return URL.createObjectURL(n)}function $(n){URL.revokeObjectURL(n)}const X=1e4;function H(){const n=e.ref(!1),t=e.ref(!1),r=e.ref(null);let o=null,u=null;function p(){if(!o)try{t.value=!0,o=new Worker(new URL("/assets/imageWorker-DyeUTFOy.js",typeof document>"u"&&typeof location>"u"?require("url").pathToFileURL(__filename).href:typeof document>"u"?location.href:v&&v.tagName.toUpperCase()==="SCRIPT"&&v.src||new URL("vue-image-compressor.umd.cjs",document.baseURI).href),{type:"module"}),n.value=!0,r.value=null}catch(_){r.value=_ instanceof Error?_:new Error("Failed to start worker"),console.error("Worker start failed:",_)}finally{t.value=!1}}function m(){u&&(clearTimeout(u),u=null),o&&(o.terminate(),o=null,n.value=!1)}function w(){u&&clearTimeout(u),u=window.setTimeout(()=>{m()},X)}async function E(){if(o||p(),!o)throw new Error("Worker failed to initialize");return o}async function T(_,C){if(_.aborted)throw new DOMException("AbortError","AbortError");return clearTimeout(u),new Promise((R,N)=>{const k=()=>{m(),N(new DOMException("AbortError","AbortError"))};_.addEventListener("abort",k),C().then(R).catch(N).finally(()=>{_.removeEventListener("abort",k),w()})})}return e.onUnmounted(()=>{m()}),{isReady:n,isLoading:t,error:r,worker:o,getWorkerApi:E,executeTask:T,terminateWorker:m}}function Q(){const n=e.ref(!1),t=e.ref(0),r=e.ref(null),o=e.ref(null),u=e.ref(null),{getWorkerApi:p,executeTask:m}=H(),w=e.computed(()=>n.value&&!!u.value);async function E(f,a){const i=await x(a),c=await F(i),g=await p();if(!c){if(i==="image/avif")return m(f,()=>g.avifDecode(a));if(i==="image/webp")return m(f,()=>g.webpDecode(a));if(i==="image/jxl")return m(f,()=>g.jxlDecode(a));if(i==="image/webp2")return m(f,()=>g.wp2Decode(a));if(i==="image/qoi")return m(f,()=>g.qoiDecode(a))}return M(a)}async function T(f,a,i){if(i===0)return a;const c=await p();return m(f,()=>c.rotate(a,{rotate:i}))}async function _(f,a,i){var b,h;let c=a;const g=await p();return(b=i.resize)!=null&&b.enabled&&(c=await m(f,()=>g.resize(c,{width:i.resize.width||c.width,height:i.resize.height||c.height,method:i.resize.method||"lanczos3",fitMethod:i.resize.fitMethod||"stretch",premultiply:!0,linearRGB:!0}))),(h=i.quantize)!=null&&h.enabled&&(c=await m(f,()=>g.quantize(c,{numColors:i.quantize.numColors||256,dither:i.quantize.dither||1}))),c}async function C(f,a,i){const c=await p(),g=i.encoder;if(g==="browserJPEG")return(await L(a,"image/jpeg",i.encoderOptions.quality)).arrayBuffer();if(g==="browserPNG")return(await L(a,"image/png")).arrayBuffer();if(g==="browserGIF")throw new Error("Browser GIF encoding not supported directly");const h={mozJPEG:c.mozjpegEncode,webP:c.webpEncode,avif:c.avifEncode,jxl:c.jxlEncode,oxiPNG:c.oxipngEncode,qoi:c.qoiEncode,wp2:c.wp2Encode}[g];if(!h)throw new Error(`Unknown encoder: ${g}`);return(await m(f,()=>h.call(c,a,i.encoderOptions))).buffer}async function R(f,a){var g;u.value=new AbortController;const i=u.value.signal;n.value=!0,t.value=0,r.value=null;const c=o.value;o.value=null,(g=c==null?void 0:c.compressed)!=null&&g.blobUrl&&$(c.compressed.blobUrl);try{t.value=10;const b={file:f,size:f.size,width:0,height:0,blobUrl:q(f)},h=await E(i,f);b.width=h.width,b.height=h.height,t.value=25;const D=await T(i,h,a.rotate||0);t.value=35;const I=await _(i,D,a);t.value=50;const j=await C(i,I,a);t.value=80;const O=B[a.encoder],z=J(f.name,(O==null?void 0:O.extension)||"bin"),P=A(j,z,(O==null?void 0:O.mimeType)||"application/octet-stream"),U={file:P,size:P.size,width:I.width,height:I.height,blobUrl:q(P)},d={original:b,compressed:U,savingsBytes:b.size-U.size,savingsPercent:W(b.size,U.size),encoderType:a.encoder,encoderOptions:a.encoderOptions};return o.value=d,t.value=100,d}catch(b){if(b instanceof DOMException&&b.name==="AbortError")throw r.value="已取消",b;const h=b instanceof Error?b.message:"压缩失败";throw r.value=h,console.error("Compression error:",b),b}finally{n.value=!1,u.value=null}}function N(){u.value&&u.value.abort()}function k(){if(!o.value)return;const{compressed:f}=o.value,a=document.createElement("a");a.href=f.blobUrl,a.download=f.file.name,document.body.appendChild(a),a.click(),document.body.removeChild(a)}return{compress:R,cancel:N,downloadResult:k,isCompressing:n,progress:t,error:r,result:o,canCancel:w}}function K(){const n=e.ref("mozJPEG"),t=e.ref({}),r=e.computed(()=>B[n.value]),o=e.computed(()=>S[n.value]),u=e.computed(()=>G.map(E=>({type:E,label:B[E].label,mimeType:B[E].mimeType,extension:B[E].extension})));function p(E){n.value=E,t.value={...S[E]}}function m(E,T){t.value={...t.value,[E]:T}}function w(){t.value={...o.value}}return w(),{selectedEncoder:n,encoderOptions:t,currentMeta:r,currentDefaults:o,availableEncoders:u,selectEncoder:p,updateOption:m,resetOptions:w}}const ee={class:"image-compressor"},te={key:0,class:"preview-area"},ne={class:"preview-item"},oe=["src"],re={class:"preview-item"},ae=["src"],le={key:1,class:"compressing"},ie=["value"],se={key:2},ce={key:1,class:"encoder-settings"},de=["value"],me={key:0,class:"quality-control"},ue=["value"],fe={key:2,class:"actions"},pe=["disabled"],ge={key:3,class:"error"},be=((n,t)=>{const r=n.__vccOpts||n;for(const[o,u]of t)r[o]=u;return r})(e.defineComponent({__name:"ImageCompressor",props:{defaultEncoder:{},defaultOptions:{}},emits:["success","error","cancel"],setup(n,{emit:t}){const r=n,o=t,u=e.ref(null),p=e.ref(null),m=e.ref(""),w=e.ref(""),{compress:E,cancel:T,downloadResult:_,isCompressing:C,progress:R,error:N,result:k,canCancel:f}=Q(),{selectedEncoder:a,encoderOptions:i,availableEncoders:c,selectEncoder:g,updateOption:b}=K();r.defaultEncoder&&g(r.defaultEncoder),r.defaultOptions&&Object.entries(r.defaultOptions).forEach(([d,l])=>b(d,l));const h=e.computed(()=>p.value?V(p.value.size):""),D=e.computed(()=>k.value?V(k.value.compressed.size):""),I=e.computed(()=>["mozJPEG","webP","jxl","browserJPEG","wp2"].includes(a.value));function j(d){const l=d.target;l.files&&l.files[0]&&z(l.files[0])}function O(d){var l;(l=d.dataTransfer)!=null&&l.files[0]&&z(d.dataTransfer.files[0])}function z(d){d.type.startsWith("image/")&&(p.value=d,m.value=URL.createObjectURL(d),w.value&&(URL.revokeObjectURL(w.value),w.value=""))}function P(){g(a.value)}async function U(){if(p.value)try{const d={encoder:a.value,encoderOptions:{...i.value}},l=await E(p.value,d);w.value=l.compressed.blobUrl,o("success",l)}catch(d){if(d instanceof DOMException&&d.name==="AbortError"){o("cancel");return}o("error",d instanceof Error?d:new Error(String(d)))}}return e.watch(()=>p.value,(d,l)=>{d&&d!==l&&m.value&&URL.revokeObjectURL(m.value)}),(d,l)=>(e.openBlock(),e.createElementBlock("div",ee,[e.createElementVNode("div",{class:"upload-zone",onDrop:e.withModifiers(O,["prevent"]),onDragover:l[1]||(l[1]=e.withModifiers(()=>{},["prevent"]))},[e.createElementVNode("input",{type:"file",accept:"image/*",onChange:j,ref_key:"fileInput",ref:u,class:"file-input"},null,544),e.createElementVNode("div",{class:"upload-prompt",onClick:l[0]||(l[0]=y=>{var Y;return(Y=u.value)==null?void 0:Y.click()})},[e.renderSlot(d.$slots,"upload-prompt",{},()=>[l[6]||(l[6]=e.createElementVNode("p",null,"拖拽图片到此处，或点击上传",-1))],!0)])],32),m.value?(e.openBlock(),e.createElementBlock("div",te,[e.createElementVNode("div",ne,[l[7]||(l[7]=e.createElementVNode("h4",null,"原始图片",-1)),e.createElementVNode("img",{src:m.value,alt:"Original"},null,8,oe),e.createElementVNode("p",null,e.toDisplayString(h.value),1)]),e.createElementVNode("div",re,[l[8]||(l[8]=e.createElementVNode("h4",null,"压缩后",-1)),w.value?(e.openBlock(),e.createElementBlock("img",{key:0,src:w.value,alt:"Compressed"},null,8,ae)):e.unref(C)?(e.openBlock(),e.createElementBlock("div",le,[e.createElementVNode("progress",{value:e.unref(R),max:"100"},null,8,ie),e.createElementVNode("p",null,"压缩中... "+e.toDisplayString(e.unref(R))+"%",1)])):e.createCommentVNode("",!0),D.value?(e.openBlock(),e.createElementBlock("p",se,e.toDisplayString(D.value),1)):e.createCommentVNode("",!0)])])):e.createCommentVNode("",!0),m.value?(e.openBlock(),e.createElementBlock("div",ce,[l[9]||(l[9]=e.createElementVNode("label",null,"编码器：",-1)),e.withDirectives(e.createElementVNode("select",{"onUpdate:modelValue":l[2]||(l[2]=y=>e.isRef(a)?a.value=y:null),onChange:P},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(c),y=>(e.openBlock(),e.createElementBlock("option",{key:y.type,value:y.type},e.toDisplayString(y.label)+" ("+e.toDisplayString(y.extension)+") ",9,de))),128))],544),[[e.vModelSelect,e.unref(a)]]),I.value?(e.openBlock(),e.createElementBlock("div",me,[e.createElementVNode("label",null,[e.createTextVNode(" 质量: "+e.toDisplayString(e.unref(i).quality??75)+" ",1),e.createElementVNode("input",{type:"range",min:"0",max:"100",value:e.unref(i).quality??75,onInput:l[3]||(l[3]=y=>e.unref(b)("quality",Number(y.target.value))),"-------":"",REPLACE:""},null,40,ue)])])):e.createCommentVNode("",!0),e.renderSlot(d.$slots,"encoder-settings",{encoder:e.unref(a),options:e.unref(i)},void 0,!0)])):e.createCommentVNode("",!0),m.value?(e.openBlock(),e.createElementBlock("div",fe,[e.createElementVNode("button",{onClick:U,disabled:e.unref(C),class:"btn-primary"},e.toDisplayString(e.unref(C)?"压缩中...":"开始压缩"),9,pe),e.unref(f)?(e.openBlock(),e.createElementBlock("button",{key:0,onClick:l[4]||(l[4]=(...y)=>e.unref(T)&&e.unref(T)(...y)),class:"btn-secondary"}," 取消 ")):e.createCommentVNode("",!0),e.unref(k)?(e.openBlock(),e.createElementBlock("button",{key:1,onClick:l[5]||(l[5]=(...y)=>e.unref(_)&&e.unref(_)(...y)),class:"btn-success"}," 下载 (节省 "+e.toDisplayString(e.unref(k).savingsPercent)+"%) ",1)):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0),e.unref(N)?(e.openBlock(),e.createElementBlock("div",ge,e.toDisplayString(e.unref(N)),1)):e.createCommentVNode("",!0)]))}}),[["__scopeId","data-v-86f2b482"]]),Ee=[{value:"lanczos3",label:"Lanczos3"},{value:"catrom",label:"Catrom"},{value:"mitchell",label:"Mitchell"},{value:"triangle",label:"Triangle"},{value:"vector",label:"Vector"}],we=[{value:"stretch",label:"拉伸"},{value:"contain",label:"适应"}],he=[{value:0,label:"不旋转"},{value:90,label:"顺时针 90°"},{value:180,label:"旋转 180°"},{value:270,label:"逆时针 90°"}];s.DEFAULT_ENCODER_OPTIONS=S,s.ENCODER_LIST=G,s.ENCODER_REGISTRY=B,s.FIT_METHODS=we,s.ImageCompressor=be,s.RESIZE_METHODS=Ee,s.ROTATE_OPTIONS=he,s.arrayBufferToFile=A,s.blobToImageData=M,s.calculateSavings=W,s.canDecodeImageType=F,s.createBlobUrl=q,s.formatBytes=V,s.generateCompressedFilename=J,s.getImageDimensions=Z,s.imageDataToBlob=L,s.revokeBlobUrl=$,s.sniffMimeType=x,s.useCompression=Q,s.useEncoderRegistry=K,s.useWorker=H,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});

package/dist/workers/imageWorker.d.ts

@@ -0,0 +1,4 @@
+import { WorkerApi } from '../types/worker';
+
+declare const workerApi: WorkerApi;
+export default workerApi;

package/dist/workers/utils/emscripten.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Emscripten WASM 模块初始化工具
+ * 对标 Squoosh: src/features/worker-utils/index.ts
+ */
+export declare function initEmscriptenModule<T extends EmscriptenWasm.Module>(moduleFactory: EmscriptenWasm.ModuleFactory<T>): Promise<T>;
+export declare function blobToArrayBuffer(blob: Blob): Promise<ArrayBuffer>;