@feedmepos/mf-menu 1.0.1-dev.2 → 1.0.1-dev.3

package/dist/ProductInternalTools-DRcfn5DE.js

@@ -0,0 +1,2147 @@
+import { defineComponent as E, ref as M, computed as O, openBlock as d, createBlock as j, unref as t, withCtx as B, createElementVNode as l, toDisplayString as g, createElementBlock as $, Fragment as R, renderList as V, createVNode as k, createCommentVNode as U, normalizeClass as D, normalizeStyle as oe, createTextVNode as X, h as c, withModifiers as J, shallowRef as pe, onBeforeUnmount as ge, watch as fe } from "vue";
+import { useI18n as P } from "@feedmepos/mf-common";
+import { useSnackbar as ne, components as u, SnackbarPosition as W } from "@feedmepos/ui-library";
+import { _ as _e } from "./PageLayout.vue_vue_type_script_setup_true_lang-B3szUH39.js";
+import { B as se, z as be, c as ye, b as G, a as ee, u as Y } from "./provide-UZbVvMqZ.js";
+import { r as he, c as ve, _ as le, a as we } from "./ProductImageEditorDialog.vue_vue_type_script_setup_true_lang-yZSYrcYe.js";
+import { _ as re } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const ke = /\.(jpe?g|png|webp|gif|bmp|heic|heif|tiff?)$/i, xe = 4;
+function $e(y) {
+  return y.split("/").some((r) => r.startsWith(".") || r === "__MACOSX");
+}
+function ie(y) {
+  return Array.from(y).map((r) => ({
+    path: r.webkitRelativePath || r.name,
+    file: r
+  }));
+}
+async function Fe(y) {
+  const r = Array.from(y.items).map((e) => {
+    var F;
+    return (F = e.webkitGetAsEntry) == null ? void 0 : F.call(e);
+  }).filter((e) => !!e);
+  if (!r.length) return ie(Array.from(y.files));
+  const s = [];
+  async function w(e, F) {
+    if (e.isFile) {
+      const C = await new Promise(
+        (h, b) => e.file(h, b)
+      );
+      s.push({ path: `${F}${e.name}`, file: C });
+      return;
+    }
+    const p = e.createReader();
+    for (; ; ) {
+      const C = await new Promise(
+        (h, b) => p.readEntries(h, b)
+      );
+      if (!C.length) break;
+      for (const h of C) await w(h, `${F}${e.name}/`);
+    }
+  }
+  for (const e of r) await w(e, "");
+  return s;
+}
+function Ie(y) {
+  return new Promise(
+    (r, s) => ye(y, (w, e) => w ? s(w) : r(e))
+  );
+}
+function Z(y) {
+  var s;
+  const r = ((s = y.split(".").pop()) == null ? void 0 : s.toLowerCase()) ?? "";
+  return {
+    jpg: "image/jpeg",
+    jpeg: "image/jpeg",
+    png: "image/png",
+    webp: "image/webp",
+    gif: "image/gif",
+    json: "application/json"
+  }[r] ?? "application/octet-stream";
+}
+async function Ce(y) {
+  const r = [];
+  for (const s of y) {
+    if (!/\.zip$/i.test(s.path)) {
+      r.push(s);
+      continue;
+    }
+    const w = await Ie(
+      new Uint8Array(await s.file.arrayBuffer())
+    );
+    for (const [e, F] of Object.entries(w)) {
+      if (e.endsWith("/")) continue;
+      const p = e.split("/").pop() ?? e;
+      r.push({
+        path: e,
+        file: new File([F], p, { type: Z(e) })
+      });
+    }
+  }
+  return r;
+}
+async function ce(y) {
+  const r = await crypto.subtle.digest("SHA-256", y);
+  return Array.from(new Uint8Array(r)).map((s) => s.toString(16).padStart(2, "0")).join("");
+}
+function ue(y) {
+  return {
+    contentType: y.blob.type || "image/jpeg",
+    fileName: y.fileName,
+    width: y.width,
+    height: y.height,
+    byteLength: y.blob.size,
+    bytes: y.blob,
+    readDataUrl: () => he(y.blob)
+  };
+}
+async function de(y, r, s) {
+  const w = new Array(y.length);
+  let e = 0, F = 0;
+  async function p() {
+    for (; e < y.length; ) {
+      const C = e++;
+      w[C] = await r(y[C], C), s == null || s(++F);
+    }
+  }
+  return await Promise.all(Array.from({ length: xe }, p)), w;
+}
+async function Se(y, r, s) {
+  const w = (await Ce(y)).filter((m) => !$e(m.path)), e = w.find(
+    (m) => m.path.split("/").pop() === se
+  );
+  let F = null;
+  if (e)
+    try {
+      F = {
+        path: e.path,
+        data: JSON.parse(await e.file.text())
+      };
+    } catch {
+      F = null;
+    }
+  const p = w.filter((m) => ke.test(m.path)), C = w.length - p.length - (e ? 1 : 0), h = /* @__PURE__ */ new Map(), b = await de(
+    p,
+    async (m, v) => {
+      const x = `file-${v}`, T = await m.file.arrayBuffer(), I = /\.(jpe?g|png|webp)$/i.test(m.path) ? await ve(
+        new File([T], m.file.name, {
+          type: m.file.type || Z(m.path)
+        })
+      ).catch(() => null) : null;
+      return I && h.set(x, URL.createObjectURL(I.blob)), {
+        key: x,
+        path: m.path,
+        contentType: m.file.type || Z(m.path),
+        byteLength: m.file.size,
+        sha256: await ce(T),
+        prepared: I ? ue(I) : null
+      };
+    },
+    (m) => s == null ? void 0 : s(m, p.length)
+  );
+  return {
+    source: {
+      label: r.label,
+      kind: r.kind,
+      totalBytes: y.reduce((m, v) => m + v.file.size, 0),
+      files: b,
+      ignoredCount: C,
+      manifest: F
+    },
+    previews: h
+  };
+}
+function Q(y) {
+  for (const r of y.values()) URL.revokeObjectURL(r);
+  y.clear();
+}
+function Be(y) {
+  return ue(y);
+}
+async function ze(y, r, s) {
+  const w = {}, e = {};
+  let F = 0;
+  await de(
+    y.entries,
+    async (h) => {
+      try {
+        const b = await fetch(h.url, { cache: "no-store" });
+        if (!b.ok) throw new Error(String(b.status));
+        const m = await b.arrayBuffer();
+        w[h.key] = await ce(m), e[h.path] = new Uint8Array(m);
+      } catch {
+        F++;
+      }
+    },
+    (h) => s == null ? void 0 : s(h, y.entries.length)
+  );
+  const p = r(w);
+  e[p.path] = new TextEncoder().encode(p.content);
+  const C = await new Promise(
+    (h, b) => be(
+      e,
+      { level: 0 },
+      (m, v) => m ? b(m) : h(v)
+    )
+  );
+  return { blob: new Blob([C], { type: "application/zip" }), failed: F };
+}
+function Ue(y, r) {
+  const s = URL.createObjectURL(y), w = document.createElement("a");
+  w.href = s, w.download = r, w.click(), setTimeout(() => URL.revokeObjectURL(s), 1e4);
+}
+const je = { class: "flex flex-col gap-4" }, Te = { class: "fm-typo-en-title-sm-600" }, Le = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Oe = { class: "flex flex-col gap-16" }, Re = { class: "flex flex-col gap-8" }, Ae = { class: "fm-typo-en-body-lg-600" }, Me = { class: "grid grid-cols-4 gap-8" }, Ve = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, Ee = { class: "flex flex-col gap-8" }, Pe = { class: "fm-typo-en-body-lg-600" }, Ke = {
+  key: 0,
+  class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary"
+}, Ne = { class: "fm-typo-en-body-sm-600" }, De = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, Ge = {
+  key: 0,
+  class: "flex flex-col gap-4"
+}, qe = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, He = { class: "flex w-full items-center justify-end gap-8" }, We = /* @__PURE__ */ E({
+  __name: "BatchImageDownloadDialog",
+  props: {
+    overview: {}
+  },
+  emits: ["close"],
+  setup(y, { emit: r }) {
+    const s = y, w = r, { t: e } = P(), F = G(), p = ne(), C = ee(), h = M(
+      s.overview.download.formats.filter(
+        (I) => I.kind === "original" || s.overview.coverage.ratios.some(
+          (z) => z.id === I.id && z.required
+        )
+      ).map((I) => I.id)
+    ), b = M(!1), m = O(() => {
+      const I = e("menu.product_batch_image.download.sample_category"), z = e("menu.product_batch_image.setup.naming.sample_name"), f = (n) => e("menu.product_batch_image.download.tree_entry", {
+        path: e("menu.product_batch_image.download.sample_entry", {
+          category: I,
+          name: z,
+          suffix: n
+        })
+      });
+      return [
+        f(".jpg"),
+        f("@16x9.jpg"),
+        f(" #2.jpg"),
+        e("menu.product_batch_image.download.tree_last", {
+          path: se
+        })
+      ];
+    }), v = M(null), x = O(
+      () => s.overview.download.formats.map((I) => ({
+        id: I.id,
+        label: I.label ?? e("menu.product_image.manage.original")
+      }))
+    );
+    function T(I, z) {
+      h.value = z ? [.../* @__PURE__ */ new Set([...h.value, I])] : h.value.filter((f) => f !== I);
+    }
+    async function A() {
+      var I;
+      v.value = { done: 0, total: 0 };
+      try {
+        const z = await C.productBatchImage.planDownload({
+          formatIds: h.value,
+          coverOnly: b.value
+        });
+        if (z.kind !== "success") {
+          p.open({
+            type: "error",
+            title: z.kind === "failure" ? F(z.error.message) : z.kind === "rejected" ? e(((I = z.issues[0]) == null ? void 0 : I.code) ?? "menu.error.unexpected") : e("menu.error.unexpected"),
+            position: W.BOTTOM
+          });
+          return;
+        }
+        const f = z.value, { blob: n, failed: i } = await ze(
+          f,
+          (o) => C.productBatchImage.downloadManifest(f, o),
+          (o, a) => {
+            v.value = { done: o, total: a };
+          }
+        );
+        Ue(n, f.archiveName), p.open({
+          type: i ? "warning" : "success",
+          title: i ? e("menu.product_batch_image.download.partial", { count: i }) : e("menu.product_batch_image.download.done", {
+            count: f.entries.length
+          }),
+          position: W.BOTTOM
+        }), w("close");
+      } finally {
+        v.value = null;
+      }
+    }
+    return (I, z) => (d(), j(t(u).FmDialog, {
+      "model-value": !0,
+      "max-width": 600,
+      "onUpdate:modelValue": z[2] || (z[2] = (f) => !f && !v.value && w("close"))
+    }, {
+      "dialog-header": B(() => [
+        l("div", je, [
+          l("p", Te, g(t(e)("menu.product_batch_image.download.title")), 1),
+          l("p", Le, g(t(e)("menu.product_batch_image.download.subtitle", {
+            count: I.overview.productCount,
+            images: I.overview.coverage.withImages + I.overview.coverage.legacyOnly
+          })), 1)
+        ])
+      ]),
+      "dialog-footer": B(() => [
+        l("div", He, [
+          k(t(u).FmButton, {
+            variant: "tertiary",
+            label: t(e)("menu.common.actions.cancel"),
+            disabled: !!v.value,
+            onClick: z[1] || (z[1] = (f) => w("close"))
+          }, null, 8, ["label", "disabled"]),
+          k(t(u).FmButton, {
+            variant: "primary",
+            "prepend-icon": "download",
+            label: t(e)("menu.product_batch_image.download.action"),
+            disabled: !!v.value || !h.value.length,
+            onClick: A
+          }, null, 8, ["label", "disabled"])
+        ])
+      ]),
+      default: B(() => [
+        l("div", Oe, [
+          l("section", Re, [
+            l("p", Ae, g(t(e)("menu.product_batch_image.download.formats")), 1),
+            l("div", Me, [
+              (d(!0), $(R, null, V(x.value, (f) => (d(), j(t(u).FmCheckbox, {
+                key: f.id,
+                "model-value": h.value.includes(f.id),
+                value: "",
+                label: f.label,
+                "onUpdate:modelValue": (n) => T(f.id, n)
+              }, null, 8, ["model-value", "label", "onUpdate:modelValue"]))), 128))
+            ]),
+            l("p", Ve, g(t(e)("menu.product_batch_image.download.formats_hint")), 1)
+          ]),
+          l("section", Ee, [
+            l("p", Pe, g(t(e)("menu.product_batch_image.download.images")), 1),
+            k(t(u).FmRadioGroup, {
+              "model-value": b.value ? "cover" : "all",
+              class: "flex gap-16",
+              "onUpdate:modelValue": z[0] || (z[0] = (f) => b.value = f === "cover")
+            }, {
+              default: B(() => [
+                k(t(u).FmRadio, {
+                  value: "all",
+                  label: t(e)("menu.product_batch_image.download.all_images", {
+                    count: I.overview.download.allImages
+                  })
+                }, null, 8, ["label"]),
+                k(t(u).FmRadio, {
+                  value: "cover",
+                  label: t(e)("menu.product_batch_image.download.cover_only", {
+                    count: I.overview.download.coverImages
+                  })
+                }, null, 8, ["label"])
+              ]),
+              _: 1
+            }, 8, ["model-value"]),
+            I.overview.download.legacyProducts ? (d(), $("p", Ke, g(t(e)("menu.product_batch_image.download.legacy_hint", {
+              count: I.overview.download.legacyProducts
+            })), 1)) : U("", !0)
+          ]),
+          k(t(u).FmCard, {
+            variant: "outlined",
+            class: "flex flex-col gap-4 p-12"
+          }, {
+            default: B(() => [
+              l("code", Ne, g(t(e)("menu.product_batch_image.download.sample_archive")), 1),
+              (d(!0), $(R, null, V(m.value, (f) => (d(), $("code", {
+                key: f,
+                class: "fm-typo-en-body-sm-400"
+              }, g(f), 1))), 128))
+            ]),
+            _: 1
+          }),
+          l("p", De, g(t(e)("menu.product_batch_image.download.round_trip_hint")), 1),
+          v.value ? (d(), $("div", Ge, [
+            l("p", qe, g(t(e)("menu.product_batch_image.download.progress", {
+              done: v.value.done,
+              total: v.value.total
+            })), 1),
+            k(t(u).FmProgressBar, {
+              value: v.value.total ? v.value.done / v.value.total * 100 : 0,
+              indeterminate: !v.value.total
+            }, null, 8, ["value", "indeterminate"])
+          ])) : U("", !0)
+        ])
+      ]),
+      _: 1
+    }));
+  }
+}), Xe = { class: "flex flex-wrap gap-4" }, Je = /* @__PURE__ */ E({
+  __name: "BatchImageFormatChips",
+  props: {
+    formats: {}
+  },
+  setup(y) {
+    const r = y, { t: s } = P(), w = {
+      uploaded: "is-uploaded",
+      file: "is-uploaded",
+      ai: "is-ai",
+      generating: "is-generating",
+      failed: "is-failed",
+      missing: "is-missing"
+    };
+    function e(p) {
+      switch (p) {
+        case "ai":
+          return s("menu.product_batch_image.format.ai");
+        case "generating":
+          return s("menu.product_batch_image.format.generating");
+        case "failed":
+          return s("menu.product_batch_image.format.failed");
+        case "missing":
+          return s("menu.product_batch_image.format.missing");
+        case "file":
+          return s("menu.product_batch_image.format.file");
+        default:
+          return "";
+      }
+    }
+    const F = () => r.formats.map((p) => {
+      const C = e(p.source);
+      return {
+        id: p.id,
+        label: C ? s("menu.product_batch_image.format.chip", {
+          label: p.label,
+          state: C
+        }) : p.label,
+        variant: w[p.source],
+        ratio: `${p.width} / ${p.height}`
+      };
+    });
+    return (p, C) => (d(), $("div", Xe, [
+      (d(!0), $(R, null, V(F(), (h) => (d(), $("span", {
+        key: h.id,
+        class: D(["batch-format-chip fm-typo-en-body-sm-600", h.variant])
+      }, [
+        l("i", {
+          class: "batch-format-chip__ratio",
+          style: oe({ aspectRatio: h.ratio }),
+          "aria-hidden": "true"
+        }, null, 4),
+        X(" " + g(h.label), 1)
+      ], 2))), 128))
+    ]));
+  }
+}), te = /* @__PURE__ */ re(Je, [["__scopeId", "data-v-ed54f76d"]]), Qe = { class: "inline-flex items-center gap-4 whitespace-nowrap rounded-[6px] bg-fm-color-neutral-gray-100 py-[1px] pl-[6px] pr-8 fm-typo-en-body-sm-600 text-fm-color-neutral-gray-400" }, me = /* @__PURE__ */ E({
+  __name: "BatchImageLegacyChip",
+  setup(y) {
+    const { t: r } = P();
+    return (s, w) => (d(), $("span", Qe, [
+      k(t(u).FmIcon, {
+        name: "image",
+        outline: "",
+        color: "neutral-gray-400",
+        size: "sm"
+      }),
+      X(" " + g(t(r)("menu.product_batch_image.legacy_thumbnail")), 1)
+    ]));
+  }
+}), Ye = ["src", "alt"], N = /* @__PURE__ */ E({
+  __name: "BatchImageThumb",
+  props: {
+    src: { default: null },
+    alt: {},
+    size: { default: "md" }
+  },
+  setup(y) {
+    return (r, s) => (d(), j(t(u).FmCard, {
+      variant: "outlined",
+      class: D([
+        "flex shrink-0 items-center justify-center overflow-hidden rounded-md",
+        r.size === "sm" ? "w-32 !h-32" : r.size === "lg" ? "w-64 !h-64" : "w-40 !h-40"
+      ])
+    }, {
+      default: B(() => [
+        r.src ? (d(), $("img", {
+          key: 0,
+          src: r.src,
+          alt: r.alt,
+          class: "h-full w-full object-cover"
+        }, null, 8, Ye)) : (d(), j(t(u).FmIcon, {
+          key: 1,
+          name: "image",
+          outline: "",
+          color: "neutral-gray-300",
+          size: "sm"
+        }))
+      ]),
+      _: 1
+    }, 8, ["class"]));
+  }
+}), Ze = /* @__PURE__ */ E({
+  __name: "BatchImageBadge",
+  props: {
+    label: {},
+    variant: {}
+  },
+  setup(y) {
+    return (r, s) => (d(), $("span", {
+      class: D(["batch-image-badge", [
+        `is-${r.variant}`,
+        r.variant === "cover" ? "" : "fm-typo-en-body-sm-600"
+      ]])
+    }, g(r.label), 3));
+  }
+}), K = /* @__PURE__ */ re(Ze, [["__scopeId", "data-v-10dcba04"]]), et = { class: "flex flex-col gap-4" }, tt = { class: "fm-typo-en-title-sm-600" }, at = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, ot = { class: "flex flex-col gap-16" }, nt = { class: "flex flex-col gap-8" }, st = { class: "flex justify-between fm-typo-en-body-md-400" }, lt = { class: "fm-typo-en-body-md-600" }, rt = { class: "text-fm-color-typo-secondary" }, it = { class: "flex items-start gap-12" }, ct = { class: "flex flex-col" }, ut = { class: "fm-typo-en-body-md-600" }, dt = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, mt = { class: "flex w-full items-center justify-between gap-12" }, pt = { class: "flex flex-col" }, gt = { class: "fm-typo-en-body-md-600" }, ft = {
+  key: 0,
+  class: "fm-typo-en-body-sm-400 text-fm-color-system-error-300"
+}, _t = { class: "flex w-full items-center justify-between gap-12" }, bt = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, yt = /* @__PURE__ */ E({
+  __name: "BatchImageProgressDialog",
+  props: {
+    progress: {}
+  },
+  emits: ["stop"],
+  setup(y, { emit: r }) {
+    const s = y, w = r, { t: e } = P(), F = G(), p = O(
+      () => s.progress.totalFiles ? Math.round(
+        s.progress.uploadedFiles / s.progress.totalFiles * 100
+      ) : 0
+    ), C = O(() => {
+      const v = ["upload", "save", "cleanup"].indexOf(s.progress.step);
+      return [
+        {
+          key: "upload",
+          title: e("menu.product_batch_image.progress.step.upload"),
+          detail: e("menu.product_batch_image.progress.step.upload_detail", {
+            done: s.progress.finishedProducts,
+            total: s.progress.totalProducts
+          }),
+          state: v > 0 ? "done" : "now"
+        },
+        {
+          key: "save",
+          title: e("menu.product_batch_image.progress.step.save"),
+          detail: e("menu.product_batch_image.progress.step.save_detail"),
+          state: v > 1 ? "done" : v === 1 ? "now" : "next"
+        },
+        {
+          key: "generate",
+          title: e("menu.product_batch_image.progress.step.generate"),
+          detail: e("menu.product_batch_image.progress.step.generate_detail", {
+            count: s.progress.generatingFormats
+          }),
+          state: "next"
+        }
+      ];
+    });
+    function h(m, v, x) {
+      switch (m) {
+        case "done":
+          return e("menu.product_batch_image.progress.status.done");
+        case "failed":
+          return e("menu.product_batch_image.progress.status.failed");
+        case "skipped":
+          return e("menu.product_batch_image.progress.status.skipped");
+        case "uploading":
+          return e("menu.product_batch_image.progress.status.uploading", {
+            done: v,
+            total: x
+          });
+        default:
+          return e("menu.product_batch_image.progress.status.waiting");
+      }
+    }
+    const b = {
+      done: "success",
+      failed: "critical",
+      skipped: "neutral",
+      uploading: "info",
+      waiting: "neutral"
+    };
+    return (m, v) => (d(), j(t(u).FmDialog, {
+      "model-value": !0,
+      "max-width": 620,
+      "close-button": !1
+    }, {
+      "dialog-header": B(() => [
+        l("div", et, [
+          l("p", tt, g(t(e)("menu.product_batch_image.progress.title")), 1),
+          l("p", at, g(t(e)("menu.product_batch_image.progress.keep_open")), 1)
+        ])
+      ]),
+      "dialog-footer": B(() => [
+        l("div", _t, [
+          l("p", bt, g(t(e)("menu.product_batch_image.progress.stop_hint")), 1),
+          k(t(u).FmButton, {
+            variant: "secondary",
+            disabled: m.progress.stopping || m.progress.step !== "upload",
+            label: m.progress.stopping ? t(e)("menu.product_batch_image.progress.stopping") : t(e)("menu.product_batch_image.progress.stop"),
+            onClick: v[0] || (v[0] = (x) => w("stop"))
+          }, null, 8, ["disabled", "label"])
+        ])
+      ]),
+      default: B(() => [
+        l("div", ot, [
+          l("div", nt, [
+            l("div", st, [
+              l("span", lt, g(t(e)("menu.product_batch_image.progress.uploading")), 1),
+              l("span", rt, g(t(e)("menu.product_batch_image.progress.counts", {
+                files: m.progress.uploadedFiles,
+                totalFiles: m.progress.totalFiles,
+                products: m.progress.finishedProducts,
+                totalProducts: m.progress.totalProducts
+              })), 1)
+            ]),
+            k(t(u).FmProgressBar, { value: p.value }, null, 8, ["value"])
+          ]),
+          k(t(u).FmList, null, {
+            default: B(() => [
+              (d(!0), $(R, null, V(C.value, (x) => (d(), j(t(u).FmListItem, {
+                key: x.key,
+                class: "!px-0"
+              }, {
+                default: B(() => [
+                  l("div", it, [
+                    k(t(u).FmIcon, {
+                      name: x.state === "done" ? "check_circle" : x.state === "now" ? "pending" : "radio_button_unchecked",
+                      color: x.state === "done" ? "system-success-300" : x.state === "now" ? "primary" : "neutral-gray-300"
+                    }, null, 8, ["name", "color"]),
+                    l("div", ct, [
+                      l("span", ut, g(x.title), 1),
+                      l("span", dt, g(x.detail), 1)
+                    ])
+                  ])
+                ]),
+                _: 2
+              }, 1024))), 128))
+            ]),
+            _: 1
+          }),
+          k(t(u).FmList, {
+            separator: "",
+            class: "max-h-[240px] overflow-y-auto rounded-md border border-fm-color-neutral-gray-100"
+          }, {
+            default: B(() => [
+              (d(!0), $(R, null, V(m.progress.rows, (x) => (d(), j(t(u).FmListItem, {
+                key: x.productId
+              }, {
+                default: B(() => [
+                  l("div", mt, [
+                    l("div", pt, [
+                      l("span", gt, g(x.name), 1),
+                      x.error ? (d(), $("span", ft, g(t(F)(x.error)), 1)) : U("", !0)
+                    ]),
+                    k(K, {
+                      variant: b[x.status],
+                      label: h(x.status, x.doneFiles, x.totalFiles)
+                    }, null, 8, ["variant", "label"])
+                  ])
+                ]),
+                _: 2
+              }, 1024))), 128))
+            ]),
+            _: 1
+          })
+        ])
+      ]),
+      _: 1
+    }));
+  }
+}), ht = { class: "flex flex-col gap-16 py-16" }, vt = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, wt = { class: "fm-typo-en-body-md-400" }, kt = { class: "fm-typo-en-body-md-400" }, xt = { class: "fm-typo-en-body-md-400" }, $t = {
+  key: 3,
+  class: "fm-typo-en-body-sm-400 text-fm-color-system-warning-300"
+}, Ft = { class: "grid grid-cols-2 gap-12 md:grid-cols-4" }, It = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, Ct = { class: "fm-typo-en-title-sm-600 tabular-nums" }, St = {
+  key: 0,
+  class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary"
+}, Bt = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, zt = /* @__PURE__ */ E({
+  __name: "BatchImageResult",
+  props: {
+    result: {},
+    sourceLabel: {}
+  },
+  emits: ["retry", "close"],
+  setup(y, { emit: r }) {
+    const s = y, w = r, { t: e } = P(), F = G(), p = {
+      done: ["success", "menu.product_batch_image.result.status.done"],
+      generating: ["info", "menu.product_batch_image.result.status.generating"],
+      format_failed: [
+        "warning",
+        "menu.product_batch_image.result.status.format_failed"
+      ],
+      failed: ["critical", "menu.product_batch_image.result.status.failed"],
+      partial: ["warning", "menu.product_batch_image.result.status.partial"]
+    }, C = O(() => [
+      {
+        id: "product",
+        header: () => e("menu.product_batch_image.columns.product"),
+        enableSorting: !1,
+        cell: (b) => {
+          const m = b.row.original;
+          return c("div", { class: "flex items-center gap-8 py-8" }, [
+            c(N, { src: m.coverUrl, alt: m.name }),
+            c("div", { class: "flex flex-col" }, [
+              c("span", { class: "fm-typo-en-body-md-600" }, m.name),
+              m.code ? c(
+                "span",
+                {
+                  class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary"
+                },
+                m.code
+              ) : null
+            ])
+          ]);
+        }
+      },
+      {
+        id: "images",
+        header: () => e("menu.product_batch_image.columns.images"),
+        size: 100,
+        enableSorting: !1,
+        cell: (b) => c(
+          "span",
+          { class: "fm-typo-en-body-md-400" },
+          String(b.row.original.imageCount)
+        )
+      },
+      {
+        id: "formats",
+        header: () => e("menu.product_batch_image.columns.formats"),
+        enableSorting: !1,
+        cell: (b) => {
+          const m = b.row.original;
+          return m.error ? c(
+            "span",
+            { class: "fm-typo-en-body-sm-400 text-fm-color-system-error-300" },
+            F(m.error)
+          ) : m.formats ? c(te, { formats: m.formats }) : null;
+        }
+      },
+      {
+        id: "status",
+        header: () => e("menu.product_batch_image.result.columns.status"),
+        size: 170,
+        enableSorting: !1,
+        cell: (b) => {
+          const m = b.row.original, [v, x] = p[m.status];
+          return c(K, { variant: v, label: e(x) });
+        }
+      }
+    ]), h = O(
+      () => s.result.failed.length ? [
+        {
+          label: e("menu.product_batch_image.result.retry", {
+            count: s.result.failed.length
+          }),
+          click: () => w("retry")
+        }
+      ] : []
+    );
+    return (b, m) => (d(), j(le, {
+      show: !0,
+      title: t(e)("menu.product_batch_image.result.title"),
+      "primary-action": { label: t(e)("menu.product_batch_image.result.done") },
+      "secondary-actions": h.value,
+      onOnPrimary: m[0] || (m[0] = (v) => w("close")),
+      onOnCancel: m[1] || (m[1] = (v) => w("close"))
+    }, {
+      default: B(() => [
+        l("div", ht, [
+          l("p", vt, g(b.sourceLabel), 1),
+          b.result.updated ? (d(), j(t(u).FmCard, {
+            key: 0,
+            variant: "outlined",
+            class: "flex items-center gap-8 p-12"
+          }, {
+            default: B(() => [
+              k(t(u).FmIcon, {
+                name: "check_circle",
+                color: "system-success-300"
+              }),
+              l("span", wt, g(t(e)("menu.product_batch_image.result.updated", {
+                count: b.result.updated
+              })), 1)
+            ]),
+            _: 1
+          })) : U("", !0),
+          b.result.saveError ? (d(), j(t(u).FmCard, {
+            key: 1,
+            variant: "outlined",
+            class: "flex items-center gap-8 p-12"
+          }, {
+            default: B(() => [
+              k(t(u).FmIcon, {
+                name: "error",
+                color: "system-error-300"
+              }),
+              l("span", kt, g(t(e)("menu.product_batch_image.result.save_failed", {
+                reason: t(F)(b.result.saveError)
+              })), 1)
+            ]),
+            _: 1
+          })) : b.result.failed.length ? (d(), j(t(u).FmCard, {
+            key: 2,
+            variant: "outlined",
+            class: "flex items-center gap-8 p-12"
+          }, {
+            default: B(() => [
+              k(t(u).FmIcon, {
+                name: "error",
+                color: "system-error-300"
+              }),
+              l("span", xt, g(t(e)("menu.product_batch_image.result.failed", {
+                count: b.result.failed.length
+              })), 1)
+            ]),
+            _: 1
+          })) : U("", !0),
+          b.result.cleanupFailed ? (d(), $("p", $t, g(t(e)("menu.product_image.error.cleanup_failed")), 1)) : U("", !0),
+          l("div", Ft, [
+            (d(!0), $(R, null, V([
+              [
+                "menu.product_batch_image.result.kpi.updated",
+                String(b.result.updated),
+                null
+              ],
+              [
+                "menu.product_batch_image.result.kpi.images",
+                String(b.result.imagesUploaded),
+                null
+              ],
+              [
+                "menu.product_batch_image.result.kpi.formats",
+                String(b.result.formats.done),
+                t(e)("menu.product_batch_image.coverage.of_total", {
+                  total: b.result.formats.total
+                })
+              ],
+              [
+                "menu.product_batch_image.result.kpi.skipped",
+                String(b.result.skippedFiles),
+                null
+              ]
+            ], (v) => (d(), j(t(u).FmCard, {
+              key: v[0],
+              variant: "outlined",
+              class: "flex flex-col gap-4 p-12"
+            }, {
+              default: B(() => [
+                l("span", It, g(t(e)(v[0])), 1),
+                l("span", Ct, [
+                  X(g(v[1]) + " ", 1),
+                  v[2] ? (d(), $("small", St, g(v[2]), 1)) : U("", !0)
+                ])
+              ]),
+              _: 2
+            }, 1024))), 128))
+          ]),
+          l("p", Bt, g(t(e)("menu.product_batch_image.result.generation_hint")), 1),
+          k(t(u).FmTable, {
+            "column-defs": C.value,
+            "row-data": [...b.result.rows],
+            "page-size": b.result.rows.length || 1,
+            "get-row-id": (v) => v.productId,
+            "hide-footer": "",
+            "shrink-at": !1
+          }, null, 8, ["column-defs", "row-data", "page-size", "get-row-id"])
+        ])
+      ]),
+      _: 1
+    }, 8, ["title", "primary-action", "secondary-actions"]));
+  }
+}), Ut = {
+  key: 0,
+  class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary"
+}, jt = { class: "flex flex-col gap-16 py-16" }, Tt = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Lt = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, Ot = { class: "flex-1 fm-typo-en-body-md-400" }, Rt = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, At = /* @__PURE__ */ E({
+  __name: "BatchImageReview",
+  props: {
+    session: {},
+    view: {},
+    previews: {}
+  },
+  emits: ["back", "start", "crop"],
+  setup(y, { emit: r }) {
+    const s = y, w = r, { t: e } = P(), F = G(), p = M("ready"), C = O(() => [
+      {
+        value: "ready",
+        label: e("menu.product_batch_image.review.tabs.ready", {
+          count: s.view.counts.ready
+        })
+      },
+      {
+        value: "attention",
+        label: e("menu.product_batch_image.review.tabs.attention", {
+          count: s.view.counts.attentionOpen
+        })
+      },
+      {
+        value: "unmatched",
+        label: e("menu.product_batch_image.review.tabs.unmatched", {
+          count: s.view.counts.unmatchedOpen
+        })
+      }
+    ]), h = O(
+      () => {
+        var o;
+        return [
+          (o = s.view.source) == null ? void 0 : o.label,
+          s.view.via === "manifest" ? e("menu.product_batch_image.review.via_manifest") : e("menu.product_batch_image.review.via_name"),
+          s.view.via === "name" ? s.view.mode === "replace" ? e("menu.product_batch_image.setup.mode.replace") : e("menu.product_batch_image.setup.mode.append") : null,
+          s.view.generateMissing && s.view.via === "name" ? e("menu.product_batch_image.review.ai_fills") : null
+        ].filter(Boolean).join(e("menu.product_batch_image.separator"));
+      }
+    ), b = (o) => o.split("/").pop() ?? o;
+    function m(o) {
+      const a = o.change;
+      switch (a.kind) {
+        case "replace":
+          return e("menu.product_batch_image.review.change.replace", {
+            from: a.from,
+            to: a.to
+          });
+        case "replace_legacy":
+          return e("menu.product_batch_image.review.change.replace_legacy");
+        case "add":
+          return e("menu.product_batch_image.review.change.add", {
+            count: a.to
+          });
+        case "append":
+          return e("menu.product_batch_image.review.change.append", {
+            from: a.from,
+            to: a.to
+          });
+        case "update":
+          return e("menu.product_batch_image.review.change.update", {
+            count: a.files
+          });
+      }
+    }
+    const v = O(() => [
+      {
+        id: "include",
+        header: () => c(u.FmCheckbox, {
+          modelValue: s.view.counts.included === s.view.counts.ready,
+          value: "",
+          "aria-label": e("menu.product_batch_image.review.include_all"),
+          "onUpdate:modelValue": (o) => s.session.setAllIncluded(o)
+        }),
+        size: 48,
+        enableSorting: !1,
+        cell: (o) => {
+          const a = o.row.original;
+          return c(u.FmCheckbox, {
+            modelValue: a.included,
+            value: "",
+            "aria-label": e("menu.product_batch_image.review.include", {
+              name: a.name
+            }),
+            "onUpdate:modelValue": (_) => s.session.setIncluded(a.productId, _)
+          });
+        }
+      },
+      {
+        id: "product",
+        header: () => e("menu.product_batch_image.columns.product"),
+        size: 220,
+        enableSorting: !1,
+        cell: (o) => {
+          const a = o.row.original;
+          return c("div", { class: "flex flex-col gap-4 py-8" }, [
+            c("span", { class: "fm-typo-en-body-md-600" }, a.name),
+            a.code ? c(
+              "span",
+              {
+                class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary"
+              },
+              a.code
+            ) : null,
+            a.renamedFrom ? c(K, {
+              variant: "info",
+              label: e("menu.product_batch_image.review.renamed", {
+                name: a.name
+              })
+            }) : null
+          ]);
+        }
+      },
+      {
+        id: "current",
+        header: () => e("menu.product_batch_image.review.columns.current"),
+        size: 160,
+        enableSorting: !1,
+        cell: (o) => {
+          const a = o.row.original;
+          return a.currentCount ? c("div", { class: "flex items-center" }, [
+            ...a.currentImageUrls.map(
+              (_, L) => c(N, {
+                key: _,
+                src: _,
+                alt: e("menu.product_batch_image.image_alt", {
+                  name: a.name,
+                  index: L + 1
+                }),
+                class: L ? "-ml-12" : ""
+              })
+            ),
+            a.currentLegacy ? c(me, { class: "ml-8" }) : null
+          ]) : c(
+            "span",
+            { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" },
+            e("menu.product_batch_image.no_image")
+          );
+        }
+      },
+      {
+        id: "next",
+        header: () => e("menu.product_batch_image.review.columns.next"),
+        enableSorting: !1,
+        cell: (o) => {
+          const a = o.row.original, _ = a.changes.filter((S) => S.kind !== "new_image").map(
+            (S) => c(
+              "div",
+              { class: "flex items-center gap-8", key: S.fileKey },
+              [
+                c(N, {
+                  src: s.previews.get(S.fileKey) ?? null,
+                  alt: b(S.path),
+                  size: "sm"
+                }),
+                c("div", { class: "flex flex-col" }, [
+                  c(
+                    "code",
+                    { class: "fm-typo-en-body-sm-600" },
+                    b(S.path)
+                  ),
+                  c(
+                    "span",
+                    {
+                      class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary"
+                    },
+                    S.kind === "replace_original" ? S.regenerated ? e(
+                      "menu.product_batch_image.review.replace_original_ai",
+                      {
+                        index: S.imageIndex,
+                        count: S.regenerated
+                      }
+                    ) : e(
+                      "menu.product_batch_image.review.replace_original",
+                      {
+                        index: S.imageIndex
+                      }
+                    ) : e("menu.product_batch_image.review.replace_format", {
+                      index: S.imageIndex,
+                      ratio: S.formatLabel ?? ""
+                    })
+                  )
+                ])
+              ]
+            )
+          ), L = a.newImages.map(
+            (S) => c(
+              u.FmCard,
+              {
+                key: S.fileKey,
+                variant: "outlined",
+                class: "flex gap-8 p-8"
+              },
+              () => [
+                c("div", { class: "relative" }, [
+                  c(N, {
+                    src: s.previews.get(S.fileKey) ?? null,
+                    alt: b(S.fileName),
+                    size: "lg"
+                  }),
+                  S.isCover ? c(K, {
+                    class: "absolute left-4 top-4",
+                    variant: "cover",
+                    label: e("menu.product_image.cover_badge")
+                  }) : null
+                ]),
+                c("div", { class: "flex flex-col gap-4" }, [
+                  c(
+                    "code",
+                    { class: "fm-typo-en-body-sm-600" },
+                    e("menu.product_batch_image.review.new_image", {
+                      index: S.position,
+                      name: b(S.fileName)
+                    })
+                  ),
+                  S.formats.length ? c(te, { formats: S.formats }) : null
+                ])
+              ]
+            )
+          );
+          return c("div", { class: "flex flex-wrap gap-8 py-8" }, [
+            ..._,
+            ...L
+          ]);
+        }
+      },
+      {
+        id: "change",
+        header: () => e("menu.product_batch_image.review.columns.change"),
+        size: 170,
+        enableSorting: !1,
+        cell: (o) => {
+          const a = o.row.original;
+          return c("div", { class: "flex flex-col items-start gap-4 py-8" }, [
+            c(K, {
+              variant: a.included ? a.change.kind === "add" ? "success" : "info" : "neutral",
+              label: a.included ? m(a) : e("menu.product_batch_image.review.excluded")
+            }),
+            a.included && a.removedImages > 0 ? c(
+              "span",
+              {
+                class: "fm-typo-en-body-sm-600 text-fm-color-system-warning-400"
+              },
+              e("menu.product_batch_image.review.images_removed", {
+                count: a.removedImages
+              })
+            ) : null
+          ]);
+        }
+      }
+    ]), x = {
+      skip: "menu.product_batch_image.attention.actions.skip",
+      add_as_new_image: "menu.product_batch_image.attention.actions.add_as_new_image",
+      use_as_original: "menu.product_batch_image.attention.actions.use_as_original",
+      add_format: "menu.product_batch_image.attention.actions.add_format"
+    };
+    function T(o) {
+      return o.code ? e("menu.product_batch_image.product_option", {
+        name: o.name,
+        code: o.code
+      }) : o.name;
+    }
+    const A = M(""), I = O(() => (s.view, s.session.productOptions(A.value).map((o) => ({
+      label: T(o),
+      value: o.productId
+    }))));
+    function z(o) {
+      return o && !I.value.some((a) => a.value === o.productId) ? [
+        { label: T(o), value: o.productId },
+        ...I.value
+      ] : I.value;
+    }
+    function f(o, a, _, L) {
+      return c("div", { class: "flex items-center gap-8 py-8" }, [
+        c(N, {
+          src: s.previews.get(o) ?? null,
+          alt: b(a)
+        }),
+        c("div", { class: "flex flex-col" }, [
+          c("code", { class: "fm-typo-en-body-sm-600 break-all" }, a),
+          _ && L ? c(
+            "span",
+            { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" },
+            e("menu.product_batch_image.review.dimensions", {
+              width: _,
+              height: L
+            })
+          ) : null
+        ])
+      ]);
+    }
+    const n = O(() => [
+      {
+        id: "file",
+        header: () => e("menu.product_batch_image.review.columns.file"),
+        size: 280,
+        enableSorting: !1,
+        cell: (o) => {
+          const a = o.row.original;
+          return f(a.fileKey, a.path, a.width, a.height);
+        }
+      },
+      {
+        id: "product",
+        header: () => e("menu.product_batch_image.columns.product"),
+        size: 200,
+        enableSorting: !1,
+        cell: (o) => {
+          const a = o.row.original;
+          return c(
+            "span",
+            { class: "fm-typo-en-body-md-400" },
+            a.product ? T(a.product) : a.candidates.map(T).join(", ") || e("menu.catalog.empty_value")
+          );
+        }
+      },
+      {
+        id: "issue",
+        header: () => e("menu.product_batch_image.review.columns.issue"),
+        enableSorting: !1,
+        cell: (o) => {
+          const a = o.row.original;
+          return c("div", { class: "flex flex-col gap-4 py-8" }, [
+            c(
+              "span",
+              {
+                class: [
+                  "fm-typo-en-body-md-600",
+                  a.state === "fixed" ? "text-fm-color-system-success-300" : a.state === "skipped" ? "text-fm-color-typo-secondary" : ""
+                ]
+              },
+              F(a.title)
+            ),
+            c(
+              "span",
+              { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" },
+              F(a.detail)
+            )
+          ]);
+        }
+      },
+      {
+        id: "fix",
+        header: () => e("menu.product_batch_image.review.columns.fix"),
+        size: 320,
+        enableSorting: !1,
+        cell: (o) => {
+          const a = o.row.original;
+          return a.state !== "open" ? c("div", { class: "flex items-center gap-8" }, [
+            c(K, {
+              variant: a.state === "fixed" ? "success" : "neutral",
+              label: a.state === "fixed" ? a.product && a.issue === "ambiguous" ? e("menu.product_batch_image.attention.assigned_to", {
+                name: T(a.product)
+              }) : e("menu.product_batch_image.attention.fixed") : e("menu.product_batch_image.attention.skipped.title")
+            }),
+            a.undoable ? c(u.FmButton, {
+              variant: "tertiary",
+              label: e("menu.product_batch_image.attention.actions.undo"),
+              onClick: () => s.session.resolve(a.fileKey, null)
+            }) : null
+          ]) : a.issue === "ambiguous" ? c("div", { class: "flex items-center gap-8" }, [
+            c(u.FmSelect, {
+              class: "flex-1",
+              modelValue: null,
+              items: a.candidates.map((_) => ({
+                label: T(_),
+                value: _.productId
+              })),
+              placeholder: e(
+                "menu.product_batch_image.attention.choose_product"
+              ),
+              "aria-label": e(
+                "menu.product_batch_image.attention.choose_product_for",
+                {
+                  file: b(a.path)
+                }
+              ),
+              "onUpdate:modelValue": (_) => s.session.assign(a.fileKey, _)
+            }),
+            c(u.FmButton, {
+              variant: "tertiary",
+              label: e(x.skip),
+              onClick: () => s.session.resolve(a.fileKey, "skip")
+            })
+          ]) : c("div", { class: "flex flex-wrap items-center gap-8" }, [
+            a.crop ? c(u.FmButton, {
+              variant: "primary",
+              prependIcon: "crop",
+              label: e("menu.product_batch_image.attention.actions.crop", {
+                ratio: a.crop.label
+              }),
+              onClick: () => w("crop", a)
+            }) : null,
+            ...a.actions.map(
+              (_) => c(u.FmButton, {
+                key: _,
+                variant: _ === "skip" ? "tertiary" : "secondary",
+                label: e(x[_]),
+                onClick: () => s.session.resolve(a.fileKey, _)
+              })
+            )
+          ]);
+        }
+      }
+    ]), i = O(() => [
+      {
+        id: "file",
+        header: () => e("menu.product_batch_image.review.columns.file"),
+        size: 300,
+        enableSorting: !1,
+        cell: (o) => {
+          const a = o.row.original;
+          return f(a.fileKey, a.path, a.width, a.height);
+        }
+      },
+      {
+        id: "reason",
+        header: () => e("menu.product_batch_image.review.columns.reason"),
+        enableSorting: !1,
+        cell: (o) => {
+          const a = o.row.original;
+          return c("div", { class: "flex flex-col gap-4 py-8" }, [
+            c("span", { class: "fm-typo-en-body-md-600" }, F(a.reason)),
+            c(
+              "span",
+              { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" },
+              F(a.detail)
+            )
+          ]);
+        }
+      },
+      {
+        id: "assign",
+        header: () => e("menu.product_batch_image.review.columns.assign"),
+        size: 360,
+        enableSorting: !1,
+        cell: (o) => {
+          var _;
+          const a = o.row.original;
+          return c("div", { class: "flex items-center gap-8" }, [
+            c(u.FmSelect, {
+              class: "flex-1",
+              modelValue: ((_ = a.assigned) == null ? void 0 : _.productId) ?? null,
+              items: z(a.assigned),
+              searchable: !0,
+              onSearch: async (L) => {
+                A.value = L;
+              },
+              clearable: !0,
+              placeholder: e("menu.product_batch_image.attention.choose_product"),
+              "aria-label": e(
+                "menu.product_batch_image.attention.choose_product_for",
+                {
+                  file: b(a.path)
+                }
+              ),
+              "onUpdate:modelValue": (L) => s.session.assign(a.fileKey, L ?? null)
+            }),
+            a.assigned ? c(K, {
+              variant: "success",
+              label: e("menu.product_batch_image.unmatched.assigned")
+            }) : a.suggestion ? c(u.FmButton, {
+              variant: "secondary",
+              label: e("menu.product_batch_image.unmatched.use"),
+              onClick: () => s.session.acceptSuggestions([a.fileKey])
+            }) : null
+          ]);
+        }
+      }
+    ]);
+    return (o, a) => (d(), j(le, {
+      show: !0,
+      title: t(e)("menu.product_batch_image.review.title"),
+      "primary-action": {
+        label: t(e)("menu.product_batch_image.review.start", {
+          count: o.view.counts.included
+        }),
+        disabled: o.view.start.state !== "allowed"
+      },
+      "secondary-actions": [
+        { label: t(e)("menu.common.actions.back"), click: () => w("back") }
+      ],
+      onOnPrimary: a[2] || (a[2] = (_) => w("start")),
+      onOnCancel: a[3] || (a[3] = (_) => w("back"))
+    }, {
+      "append-title": B(() => [
+        o.view.counts.attentionOpen ? (d(), $("span", Ut, g(t(e)("menu.product_batch_image.review.unresolved_skipped", {
+          count: o.view.counts.attentionOpen
+        })), 1)) : U("", !0)
+      ]),
+      default: B(() => [
+        l("div", jt, [
+          l("p", Tt, g(h.value), 1),
+          k(t(u).FmTabs, {
+            "model-value": p.value,
+            items: C.value,
+            "onUpdate:modelValue": a[0] || (a[0] = (_) => p.value = _)
+          }, null, 8, ["model-value", "items"]),
+          p.value === "ready" ? (d(), $(R, { key: 0 }, [
+            l("p", Lt, g(t(e)("menu.product_batch_image.review.legend")), 1),
+            k(t(u).FmTable, {
+              "column-defs": v.value,
+              "row-data": [...o.view.ready],
+              "page-size": o.view.ready.length || 1,
+              "get-row-id": (_) => _.productId,
+              "hide-footer": "",
+              "shrink-at": !1
+            }, null, 8, ["column-defs", "row-data", "page-size", "get-row-id"])
+          ], 64)) : p.value === "attention" ? (d(), j(t(u).FmTable, {
+            key: 1,
+            "column-defs": n.value,
+            "row-data": [...o.view.attention],
+            "page-size": o.view.attention.length || 1,
+            "get-row-id": (_) => _.fileKey,
+            "hide-footer": "",
+            "shrink-at": !1
+          }, null, 8, ["column-defs", "row-data", "page-size", "get-row-id"])) : (d(), $(R, { key: 2 }, [
+            o.view.counts.nearMatches ? (d(), j(t(u).FmCard, {
+              key: 0,
+              variant: "outlined",
+              class: "flex items-center gap-12 p-12"
+            }, {
+              default: B(() => [
+                k(t(u).FmIcon, {
+                  name: "info",
+                  outline: "",
+                  color: "system-info-300"
+                }),
+                l("p", Ot, g(t(e)("menu.product_batch_image.unmatched.near_matches", {
+                  count: o.view.counts.nearMatches
+                })), 1),
+                k(t(u).FmButton, {
+                  variant: "secondary",
+                  label: t(e)("menu.product_batch_image.unmatched.use_all"),
+                  onClick: a[1] || (a[1] = (_) => o.session.acceptSuggestions())
+                }, null, 8, ["label"])
+              ]),
+              _: 1
+            })) : U("", !0),
+            k(t(u).FmTable, {
+              "column-defs": i.value,
+              "row-data": [...o.view.unmatched],
+              "page-size": o.view.unmatched.length || 1,
+              "get-row-id": (_) => _.fileKey,
+              "hide-footer": "",
+              "shrink-at": !1
+            }, null, 8, ["column-defs", "row-data", "page-size", "get-row-id"]),
+            l("p", Rt, g(t(e)("menu.product_batch_image.unmatched.hint")), 1)
+          ], 64))
+        ])
+      ]),
+      _: 1
+    }, 8, ["title", "primary-action", "secondary-actions"]));
+  }
+}), Mt = { class: "flex flex-col gap-4" }, Vt = { class: "fm-typo-en-title-md-600" }, Et = { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" }, Pt = { class: "flex flex-col gap-24" }, Kt = { class: "flex flex-col gap-8" }, Nt = { class: "fm-typo-en-body-lg-600" }, Dt = { class: "flex flex-1 flex-col gap-4" }, Gt = { class: "fm-typo-en-body-md-600" }, qt = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, Ht = {
+  key: 0,
+  class: "flex flex-col gap-4"
+}, Wt = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, Xt = { class: "flex flex-1 flex-col gap-4" }, Jt = { class: "fm-typo-en-body-md-600" }, Qt = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, Yt = { class: "fm-typo-en-body-md-400" }, Zt = { class: "grid grid-cols-4 gap-8" }, ea = { class: "fm-typo-en-title-sm-600 tabular-nums" }, ta = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, aa = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, oa = {
+  key: 0,
+  class: "fm-typo-en-body-md-400 text-fm-color-system-warning-300"
+}, na = { class: "grid grid-cols-4 gap-8" }, sa = { class: "fm-typo-en-title-sm-600 tabular-nums" }, la = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, ra = { class: "flex flex-col gap-8" }, ia = { class: "fm-typo-en-body-lg-600" }, ca = { class: "fm-typo-en-body-sm-600" }, ua = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, da = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, ma = { class: "flex flex-col gap-8" }, pa = { class: "fm-typo-en-body-lg-600" }, ga = {
+  key: 1,
+  class: "flex flex-col gap-8"
+}, fa = { class: "fm-typo-en-body-lg-600" }, _a = { class: "flex w-full items-center justify-end gap-8" }, ba = { class: "mr-auto fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, ya = /* @__PURE__ */ E({
+  __name: "BatchImageUpdateSheet",
+  props: {
+    session: {},
+    view: {},
+    productCount: {},
+    reading: {}
+  },
+  emits: ["pick", "clear", "review", "cancel"],
+  setup(y, { emit: r }) {
+    const s = y, w = r, { t: e, n: F, d: p } = P(), C = M(null), h = M(null), b = M(!1);
+    function m(n, i) {
+      var _;
+      const o = n.length === 1 && /\.zip$/i.test(n[0].path), a = (_ = n[0]) != null && _.path.includes("/") ? n[0].path.split("/")[0] : null;
+      return {
+        label: o ? n[0].file.name : a || e("menu.product_batch_image.setup.files_label", {
+          count: n.length
+        }),
+        kind: o ? "zip" : a ? "folder" : i
+      };
+    }
+    function v(n, i) {
+      const o = n.target, a = ie(o.files ?? []);
+      o.value = "", w("pick", a, m(a, i));
+    }
+    async function x(n) {
+      if (b.value = !1, !n.dataTransfer) return;
+      const i = await Fe(n.dataTransfer);
+      w("pick", i, m(i, "files"));
+    }
+    const T = O(() => {
+      const n = e("menu.product_batch_image.setup.naming.sample_name"), i = e("menu.product_batch_image.setup.naming.sample_folder"), o = (a, _) => e("menu.product_batch_image.setup.naming.example_file", {
+        name: a,
+        suffix: _
+      });
+      return [
+        [o(n, ".jpg"), e("menu.product_batch_image.setup.naming.original")],
+        [
+          o(n, "@16x9.jpg"),
+          e("menu.product_batch_image.setup.naming.format")
+        ],
+        [
+          o(n, " #2.jpg"),
+          e("menu.product_batch_image.setup.naming.second")
+        ],
+        [
+          o(i, "/2@4x3.jpg"),
+          e("menu.product_batch_image.setup.naming.folder")
+        ]
+      ];
+    }), A = (n) => F(Math.round(n / 1024 / 1024 * 10) / 10), I = O(
+      () => !!s.view.source && !s.reading && (s.view.counts.ready > 0 || s.view.attention.length > 0 || s.view.unmatched.length > 0)
+    ), z = O(
+      () => s.view.via === "manifest" ? e("menu.product_batch_image.setup.review_changes", {
+        count: s.view.summary.changed + s.view.summary.newFiles
+      }) : e("menu.product_batch_image.setup.review_products", {
+        count: s.view.summary.matchedProducts
+      })
+    ), f = O(
+      () => s.view.manifestExportedAt ? p(new Date(s.view.manifestExportedAt)) : ""
+    );
+    return (n, i) => (d(), j(t(u).FmSideSheet, {
+      "model-value": !0,
+      "max-width": 560,
+      "dismiss-away": "",
+      "onUpdate:modelValue": i[12] || (i[12] = (o) => !o && w("cancel"))
+    }, {
+      "side-sheet-header": B(() => [
+        l("div", Mt, [
+          l("p", Vt, g(t(e)("menu.product_batch_image.setup.title")), 1),
+          l("p", Et, g(t(e)("menu.product_batch_image.scope.all", { count: n.productCount })), 1)
+        ])
+      ]),
+      "side-sheet-footer": B(() => [
+        l("div", _a, [
+          l("p", ba, g(t(e)("menu.product_batch_image.setup.no_changes_yet")), 1),
+          k(t(u).FmButton, {
+            class: "shrink-0",
+            variant: "tertiary",
+            label: t(e)("menu.common.actions.cancel"),
+            onClick: i[10] || (i[10] = (o) => w("cancel"))
+          }, null, 8, ["label"]),
+          k(t(u).FmButton, {
+            class: "shrink-0",
+            variant: "primary",
+            label: z.value,
+            disabled: !I.value,
+            onClick: i[11] || (i[11] = (o) => w("review"))
+          }, null, 8, ["label", "disabled"])
+        ])
+      ]),
+      default: B(() => [
+        l("div", Pt, [
+          l("section", Kt, [
+            l("p", Nt, g(t(e)("menu.product_batch_image.setup.files")), 1),
+            l("div", {
+              class: D([
+                "flex items-center gap-12 rounded-md border border-dashed p-16",
+                b.value ? "border-fm-color-primary" : "border-fm-color-neutral-gray-300"
+              ]),
+              onDragleave: i[4] || (i[4] = J((o) => b.value = !1, ["prevent"])),
+              onDragover: i[5] || (i[5] = J((o) => b.value = !0, ["prevent"])),
+              onDrop: J(x, ["prevent"])
+            }, [
+              k(t(u).FmIcon, {
+                name: "cloud_upload",
+                outline: "",
+                color: "primary"
+              }),
+              l("div", Dt, [
+                l("p", Gt, g(t(e)("menu.product_batch_image.setup.drop_hint")), 1),
+                l("p", qt, g(t(e)("menu.product_batch_image.setup.accepts")), 1)
+              ]),
+              k(t(u).FmButton, {
+                variant: "secondary",
+                label: t(e)("menu.product_batch_image.setup.choose_files"),
+                onClick: i[0] || (i[0] = (o) => {
+                  var a;
+                  return (a = C.value) == null ? void 0 : a.click();
+                })
+              }, null, 8, ["label"]),
+              k(t(u).FmButton, {
+                variant: "secondary",
+                "prepend-icon": "folder",
+                label: t(e)("menu.product_batch_image.setup.choose_folder"),
+                onClick: i[1] || (i[1] = (o) => {
+                  var a;
+                  return (a = h.value) == null ? void 0 : a.click();
+                })
+              }, null, 8, ["label"]),
+              l("input", {
+                ref_key: "fileInput",
+                ref: C,
+                class: "hidden",
+                type: "file",
+                multiple: "",
+                accept: "image/*,.zip,application/zip",
+                onChange: i[2] || (i[2] = (o) => v(o, "files"))
+              }, null, 544),
+              l("input", {
+                ref_key: "folderInput",
+                ref: h,
+                class: "hidden",
+                type: "file",
+                webkitdirectory: "",
+                onChange: i[3] || (i[3] = (o) => v(o, "folder"))
+              }, null, 544)
+            ], 34),
+            n.reading ? (d(), $("div", Ht, [
+              l("p", Wt, g(t(e)("menu.product_batch_image.setup.reading", {
+                done: n.reading.done,
+                total: n.reading.total
+              })), 1),
+              k(t(u).FmProgressBar, {
+                value: n.reading.total ? n.reading.done / n.reading.total * 100 : 0,
+                indeterminate: !n.reading.total
+              }, null, 8, ["value", "indeterminate"])
+            ])) : U("", !0),
+            n.view.source && !n.reading ? (d(), j(t(u).FmCard, {
+              key: 1,
+              variant: "outlined",
+              class: "flex items-center gap-12 p-12"
+            }, {
+              default: B(() => [
+                k(t(u).FmIcon, {
+                  name: n.view.source.kind === "folder" ? "folder" : "folder_zip",
+                  outline: "",
+                  color: "neutral-gray-400"
+                }, null, 8, ["name"]),
+                l("div", Xt, [
+                  l("p", Jt, g(n.view.source.label), 1),
+                  l("p", Qt, g(t(e)("menu.product_batch_image.setup.source_meta", {
+                    size: A(n.view.source.totalBytes),
+                    count: n.view.source.fileCount,
+                    ignored: n.view.source.ignoredCount
+                  })), 1)
+                ]),
+                k(t(u).FmButton, {
+                  variant: "tertiary",
+                  label: t(e)("menu.common.actions.remove"),
+                  onClick: i[6] || (i[6] = (o) => w("clear"))
+                }, null, 8, ["label"])
+              ]),
+              _: 1
+            })) : U("", !0)
+          ]),
+          n.view.source && !n.reading ? (d(), $(R, { key: 0 }, [
+            n.view.via === "manifest" ? (d(), $(R, { key: 0 }, [
+              k(t(u).FmCard, {
+                variant: "outlined",
+                class: "flex items-start gap-8 p-12"
+              }, {
+                default: B(() => [
+                  k(t(u).FmIcon, {
+                    name: "check_circle",
+                    color: "system-success-300"
+                  }),
+                  l("p", Yt, g(t(e)("menu.product_batch_image.setup.manifest_found", {
+                    date: f.value
+                  })), 1)
+                ]),
+                _: 1
+              }),
+              l("div", Zt, [
+                (d(!0), $(R, null, V([
+                  [
+                    n.view.summary.changed,
+                    "menu.product_batch_image.setup.stat.changed"
+                  ],
+                  [
+                    n.view.summary.unchanged,
+                    "menu.product_batch_image.setup.stat.unchanged"
+                  ],
+                  [
+                    n.view.summary.newFiles,
+                    "menu.product_batch_image.setup.stat.new_files"
+                  ],
+                  [
+                    n.view.summary.cannotMatch,
+                    "menu.product_batch_image.setup.stat.cannot_match"
+                  ]
+                ], (o) => (d(), $("div", {
+                  key: o[1],
+                  class: D([
+                    "flex flex-col gap-2 rounded-[8px] px-12 py-8",
+                    o[0] > 0 && o[1] === "menu.product_batch_image.setup.stat.cannot_match" ? "bg-fm-color-system-warning-100 text-fm-color-system-warning-400" : "bg-fm-color-neutral-gray-100"
+                  ])
+                }, [
+                  l("span", ea, g(o[0]), 1),
+                  l("span", ta, g(t(e)(o[1])), 1)
+                ], 2))), 128))
+              ]),
+              n.view.formatsEnabled ? (d(), j(t(u).FmCheckbox, {
+                key: 0,
+                "model-value": n.view.redoAi,
+                value: "",
+                label: t(e)("menu.product_batch_image.setup.redo_ai"),
+                sublabel: t(e)("menu.product_batch_image.setup.redo_ai_hint"),
+                "onUpdate:modelValue": i[7] || (i[7] = (o) => n.session.setRedoAi(o))
+              }, null, 8, ["model-value", "label", "sublabel"])) : U("", !0),
+              l("p", aa, g(t(e)("menu.product_batch_image.setup.in_place_hint")), 1)
+            ], 64)) : (d(), $(R, { key: 1 }, [
+              n.view.foreignManifest ? (d(), $("p", oa, g(t(e)("menu.product_batch_image.setup.foreign_manifest")), 1)) : U("", !0),
+              l("div", na, [
+                (d(!0), $(R, null, V([
+                  [
+                    n.view.summary.matchedProducts,
+                    "menu.product_batch_image.setup.stat.matched"
+                  ],
+                  [
+                    n.view.summary.images,
+                    "menu.product_batch_image.setup.stat.images"
+                  ],
+                  [
+                    n.view.summary.ownFormatFiles,
+                    "menu.product_batch_image.setup.stat.own_formats"
+                  ],
+                  [
+                    n.view.summary.toCheck,
+                    "menu.product_batch_image.setup.stat.to_check"
+                  ]
+                ], (o) => (d(), $("div", {
+                  key: o[1],
+                  class: D([
+                    "flex flex-col gap-2 rounded-[8px] px-12 py-8",
+                    o[0] > 0 && o[1] === "menu.product_batch_image.setup.stat.to_check" ? "bg-fm-color-system-warning-100 text-fm-color-system-warning-400" : "bg-fm-color-neutral-gray-100"
+                  ])
+                }, [
+                  l("span", sa, g(o[0]), 1),
+                  l("span", la, g(t(e)(o[1])), 1)
+                ], 2))), 128))
+              ]),
+              l("section", ra, [
+                l("p", ia, g(t(e)("menu.product_batch_image.setup.naming_title")), 1),
+                k(t(u).FmCard, {
+                  variant: "outlined",
+                  class: "flex flex-col gap-4 p-12"
+                }, {
+                  default: B(() => [
+                    (d(!0), $(R, null, V(T.value, (o) => (d(), $("div", {
+                      key: o[0],
+                      class: "flex justify-between gap-12"
+                    }, [
+                      l("code", ca, g(o[0]), 1),
+                      l("span", ua, g(o[1]), 1)
+                    ]))), 128))
+                  ]),
+                  _: 1
+                }),
+                l("p", da, g(t(e)("menu.product_batch_image.setup.naming_hint")), 1)
+              ]),
+              l("section", ma, [
+                l("p", pa, g(t(e)("menu.product_batch_image.setup.existing_title")), 1),
+                k(t(u).FmRadioGroup, {
+                  "model-value": n.view.mode,
+                  class: "flex flex-col gap-8",
+                  "onUpdate:modelValue": i[8] || (i[8] = (o) => n.session.setMode(o))
+                }, {
+                  default: B(() => [
+                    k(t(u).FmRadio, {
+                      value: "replace",
+                      label: t(e)("menu.product_batch_image.setup.mode.replace"),
+                      sublabel: t(e)("menu.product_batch_image.setup.mode.replace_hint")
+                    }, null, 8, ["label", "sublabel"]),
+                    k(t(u).FmRadio, {
+                      value: "append",
+                      label: t(e)("menu.product_batch_image.setup.mode.append"),
+                      sublabel: t(e)("menu.product_batch_image.setup.mode.append_hint")
+                    }, null, 8, ["label", "sublabel"])
+                  ]),
+                  _: 1
+                }, 8, ["model-value"])
+              ]),
+              n.view.formatsEnabled ? (d(), $("section", ga, [
+                l("p", fa, g(t(e)("menu.product_batch_image.setup.missing_title")), 1),
+                k(t(u).FmCheckbox, {
+                  "model-value": n.view.generateMissing,
+                  value: "",
+                  label: t(e)("menu.product_batch_image.setup.generate_missing", {
+                    count: n.view.summary.formatsToGenerate
+                  }),
+                  sublabel: t(e)("menu.product_batch_image.setup.generate_missing_hint", {
+                    required: n.view.requiredFormats.join(", "),
+                    menu: n.view.menuFormats.join(", ") || t(e)("menu.catalog.empty_value")
+                  }),
+                  "onUpdate:modelValue": i[9] || (i[9] = (o) => n.session.setGenerateMissing(o))
+                }, null, 8, ["model-value", "label", "sublabel"])
+              ])) : U("", !0)
+            ], 64))
+          ], 64)) : U("", !0)
+        ])
+      ]),
+      _: 1
+    }));
+  }
+}), ha = /* @__PURE__ */ E({
+  __name: "BatchImageUpdateFlow",
+  emits: ["close"],
+  setup(y, { emit: r }) {
+    const s = r, { t: w } = P(), e = ne(), F = ee(), p = F.productBatchImage.openImport(), C = Y(p), h = O(
+      () => C.value.status === "ready" ? C.value.value : null
+    ), b = Y(F.productBatchImage.overview), m = O(
+      () => b.value.status === "ready" ? b.value.value.productCount : 0
+    ), v = M("setup"), x = pe(/* @__PURE__ */ new Map()), T = M(null);
+    async function A(a, _) {
+      if (a.length) {
+        T.value = { done: 0, total: 0 };
+        try {
+          const L = await Se(a, _, (S, q) => {
+            T.value = { done: S, total: q };
+          });
+          Q(x.value), x.value = L.previews, p.setSource(L.source);
+        } catch {
+          e.open({
+            type: "error",
+            title: w("menu.product_batch_image.setup.read_failed"),
+            position: W.BOTTOM
+          });
+        } finally {
+          T.value = null;
+        }
+      }
+    }
+    function I() {
+      p.clearSource(), Q(x.value), x.value = /* @__PURE__ */ new Map();
+    }
+    async function z() {
+      var _;
+      const a = await p.start();
+      a.kind === "rejected" && e.open({
+        type: "error",
+        title: w(((_ = a.issues[0]) == null ? void 0 : _.code) ?? "menu.error.unexpected"),
+        position: W.BOTTOM
+      });
+    }
+    const f = M(null);
+    async function n(a) {
+      const _ = x.value.get(a.fileKey);
+      if (!_ || !a.crop) return;
+      const L = await (await fetch(_)).blob();
+      f.value = {
+        row: a,
+        file: new File([L], a.path.split("/").pop() ?? "image.jpg", {
+          type: L.type || "image/jpeg"
+        })
+      };
+    }
+    function i(a) {
+      const _ = f.value;
+      if (f.value = null, !_ || !a) return;
+      const L = new Map(x.value), S = L.get(_.row.fileKey);
+      S && URL.revokeObjectURL(S), L.set(_.row.fileKey, URL.createObjectURL(a.blob)), x.value = L, p.replaceFile(_.row.fileKey, Be(a));
+    }
+    function o() {
+      var a;
+      ((a = h.value) == null ? void 0 : a.phase) !== "running" && s("close");
+    }
+    return ge(() => {
+      p.dispose(), Q(x.value);
+    }), (a, _) => {
+      var L, S, q, ae;
+      return h.value ? (d(), $(R, { key: 0 }, [
+        h.value.phase === "draft" && v.value === "setup" ? (d(), j(ya, {
+          key: 0,
+          session: t(p),
+          view: h.value,
+          "product-count": m.value,
+          reading: T.value,
+          onPick: A,
+          onClear: I,
+          onReview: _[0] || (_[0] = (H) => v.value = "review"),
+          onCancel: o
+        }, null, 8, ["session", "view", "product-count", "reading"])) : U("", !0),
+        h.value.phase !== "finished" && v.value === "review" ? (d(), j(At, {
+          key: 1,
+          session: t(p),
+          view: h.value,
+          previews: x.value,
+          onBack: _[1] || (_[1] = (H) => v.value = "setup"),
+          onStart: z,
+          onCrop: n
+        }, null, 8, ["session", "view", "previews"])) : U("", !0),
+        h.value.phase === "running" && h.value.progress ? (d(), j(yt, {
+          key: 2,
+          progress: h.value.progress,
+          onStop: _[2] || (_[2] = (H) => t(p).stop())
+        }, null, 8, ["progress"])) : U("", !0),
+        h.value.phase === "finished" && h.value.result ? (d(), j(zt, {
+          key: 3,
+          result: h.value.result,
+          "source-label": ((L = h.value.source) == null ? void 0 : L.label) ?? "",
+          onRetry: _[3] || (_[3] = (H) => t(p).retryFailed()),
+          onClose: o
+        }, null, 8, ["result", "source-label"])) : U("", !0),
+        f.value ? (d(), j(we, {
+          key: 4,
+          file: f.value.file,
+          "aspect-ratio": ((S = f.value.row.crop) == null ? void 0 : S.aspectRatio) ?? null,
+          "ratio-label": ((q = f.value.row.crop) == null ? void 0 : q.label) ?? null,
+          hint: t(w)("menu.product_batch_image.attention.crop_hint", {
+            ratio: ((ae = f.value.row.crop) == null ? void 0 : ae.label) ?? ""
+          }),
+          mode: "upload",
+          onCancel: _[4] || (_[4] = (H) => f.value = null),
+          onConfirm: i
+        }, null, 8, ["file", "aspect-ratio", "ratio-label", "hint"])) : U("", !0)
+      ], 64)) : U("", !0);
+    };
+  }
+}), va = { class: "ml-auto flex items-center gap-8" }, wa = {
+  key: 0,
+  class: "flex justify-center py-48"
+}, ka = {
+  key: 1,
+  class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary"
+}, xa = {
+  key: 2,
+  class: "flex flex-col gap-16"
+}, $a = {
+  key: 0,
+  class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary"
+}, Fa = { class: "flex flex-wrap items-center gap-12" }, Ia = { class: "w-[320px]" }, Ca = { class: "min-w-[240px] flex-1" }, Sa = { class: "whitespace-nowrap rounded-lg bg-fm-color-neutral-gray-100 px-12 py-8 fm-typo-en-body-md-600" }, Ba = { class: "overflow-hidden rounded-[10px] border border-solid border-fm-color-neutral-gray-200" }, za = { class: "-mb-px -mr-px grid grid-cols-[repeat(auto-fit,minmax(160px,1fr))]" }, Ua = { class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary" }, ja = { class: "fm-typo-en-title-sm-600 tabular-nums" }, Ta = {
+  key: 0,
+  class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary"
+}, La = {
+  key: 0,
+  class: "fm-typo-en-body-sm-400 text-fm-color-typo-secondary"
+}, Oa = {
+  class: "mt-auto flex h-4 overflow-hidden rounded-full bg-fm-color-neutral-gray-100",
+  "aria-hidden": "true"
+}, Na = /* @__PURE__ */ E({
+  __name: "ProductInternalTools",
+  setup(y) {
+    const { t: r } = P(), s = G(), e = ee().productBatchImage, F = Y(e.overview), p = O(
+      () => F.value.status === "ready" ? F.value.value : null
+    ), C = M("");
+    let h = null;
+    fe(C, (f) => {
+      h && clearTimeout(h), h = setTimeout(() => e.setFilter({ search: f }), 200);
+    });
+    const b = O(
+      () => {
+        var f;
+        return (((f = p.value) == null ? void 0 : f.categories) ?? []).map((n) => ({
+          label: n.label,
+          value: n.id
+        }));
+      }
+    ), m = M(!1), v = M(!1);
+    function x(f) {
+      return f.state === "disabled" && f.reason ? s(f.reason) : "";
+    }
+    const T = {
+      uploaded: "var(--fm-color-system-green-300)",
+      ai: "var(--fm-color-secondary-plum)",
+      legacy: "var(--fm-color-neutral-gray-300)",
+      none: "var(--fm-color-system-red-300)"
+    }, A = (f, n) => n > 0 ? Math.min(100, f / n * 100) : 0, I = O(() => {
+      const f = p.value;
+      if (!f) return [];
+      const { coverage: n, productCount: i } = f;
+      return [
+        {
+          id: "with-images",
+          label: r("menu.product_batch_image.coverage.with_images"),
+          value: String(n.withImages),
+          total: r("menu.product_batch_image.coverage.of_total", {
+            total: i
+          }),
+          segments: [
+            {
+              colour: T.uploaded,
+              share: A(n.withImages, i)
+            }
+          ]
+        },
+        {
+          id: "legacy",
+          label: r("menu.product_batch_image.coverage.legacy"),
+          value: String(n.legacyOnly),
+          segments: [
+            {
+              colour: T.legacy,
+              share: A(n.legacyOnly, i)
+            }
+          ]
+        },
+        {
+          id: "no-image",
+          label: r("menu.product_batch_image.coverage.no_image"),
+          value: String(n.noImage),
+          segments: [
+            { colour: T.none, share: A(n.noImage, i) }
+          ]
+        },
+        ...n.ratios.map((o) => ({
+          id: `ratio-${o.id}`,
+          label: o.required ? r("menu.product_batch_image.coverage.required_format", {
+            ratio: o.label
+          }) : r("menu.product_batch_image.coverage.menu_format", {
+            ratio: o.label
+          }),
+          value: String(o.uploaded + o.ai),
+          total: r("menu.product_batch_image.coverage.of_total", {
+            total: o.total
+          }),
+          note: r("menu.product_batch_image.coverage.split", {
+            uploaded: o.uploaded,
+            ai: o.ai
+          }),
+          segments: [
+            { colour: T.uploaded, share: A(o.uploaded, o.total) },
+            { colour: T.ai, share: A(o.ai, o.total) }
+          ]
+        }))
+      ];
+    }), z = O(() => [
+      {
+        id: "images",
+        header: () => r("menu.product_batch_image.columns.images"),
+        size: 150,
+        enableSorting: !1,
+        cell: (f) => {
+          const n = f.row.original, i = n.imageUrls.length ? n.imageUrls.map(
+            (o, a) => c(N, {
+              key: o,
+              src: o,
+              alt: r("menu.product_batch_image.image_alt", {
+                name: n.name,
+                index: a + 1
+              }),
+              class: a ? "-ml-12" : ""
+            })
+          ) : [c(N, { alt: n.name })];
+          return c("div", { class: "flex items-center py-8" }, [
+            ...i,
+            n.imageCount > 1 ? c(
+              "span",
+              {
+                class: "ml-8 fm-typo-en-body-sm-600 text-fm-color-typo-secondary"
+              },
+              String(n.imageCount)
+            ) : null
+          ]);
+        }
+      },
+      {
+        accessorKey: "code",
+        header: () => r("menu.product_batch_image.columns.code"),
+        size: 110,
+        cell: (f) => c(
+          "span",
+          { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" },
+          f.row.original.code ?? r("menu.catalog.empty_value")
+        )
+      },
+      {
+        accessorKey: "name",
+        header: () => r("menu.product_batch_image.columns.name"),
+        cell: (f) => c(
+          "span",
+          { class: "fm-typo-en-body-md-600" },
+          f.row.original.name
+        )
+      },
+      {
+        id: "category",
+        header: () => r("menu.product_batch_image.columns.category"),
+        size: 160,
+        enableSorting: !1,
+        cell: (f) => c(
+          "span",
+          { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" },
+          f.row.original.categoryLabel ?? r("menu.product_batch_image.no_category")
+        )
+      },
+      {
+        id: "formats",
+        header: () => r("menu.product_batch_image.columns.formats"),
+        enableSorting: !1,
+        cell: (f) => {
+          const n = f.row.original;
+          return n.legacyOnly ? c(me) : n.formats ? c(te, { formats: n.formats }) : c(
+            "span",
+            { class: "fm-typo-en-body-md-400 text-fm-color-typo-secondary" },
+            n.imageCount ? r("menu.catalog.empty_value") : r("menu.product_batch_image.no_image")
+          );
+        }
+      }
+    ]);
+    return (f, n) => (d(), j(_e, {
+      heading: t(r)("menu.productInternalTools.title")
+    }, {
+      "append-heading": B(() => {
+        var i, o;
+        return [
+          l("div", va, [
+            k(t(u).FmButton, {
+              variant: "secondary",
+              "prepend-icon": "download",
+              label: t(r)("menu.product_batch_image.actions.download"),
+              disabled: ((i = p.value) == null ? void 0 : i.downloadAction.state) !== "allowed",
+              onClick: n[0] || (n[0] = (a) => v.value = !0)
+            }, null, 8, ["label", "disabled"]),
+            k(t(u).FmButton, {
+              variant: "primary",
+              "prepend-icon": "upload",
+              label: t(r)("menu.product_batch_image.actions.update"),
+              disabled: ((o = p.value) == null ? void 0 : o.update.state) !== "allowed",
+              onClick: n[1] || (n[1] = (a) => m.value = !0)
+            }, null, 8, ["label", "disabled"])
+          ])
+        ];
+      }),
+      default: B(() => [
+        t(F).status === "loading" ? (d(), $("div", wa, [
+          k(t(u).FmCircularProgress)
+        ])) : t(F).status === "unavailable" ? (d(), $("p", ka, g(t(s)(t(F).reason)), 1)) : p.value ? (d(), $("div", xa, [
+          p.value.update.state === "disabled" ? (d(), $("p", $a, g(x(p.value.update)), 1)) : U("", !0),
+          l("div", Fa, [
+            l("div", Ia, [
+              k(t(u).FmSelect, {
+                "model-value": [...p.value.filter.categoryIds],
+                items: b.value,
+                multiselect: "",
+                searchable: "",
+                clearable: "",
+                placeholder: t(r)("menu.product_batch_image.filters.all_categories"),
+                "aria-label": t(r)("menu.product_batch_image.filters.categories"),
+                "onUpdate:modelValue": n[2] || (n[2] = (i) => t(e).setFilter({ categoryIds: i }))
+              }, null, 8, ["model-value", "items", "placeholder", "aria-label"])
+            ]),
+            l("div", Ca, [
+              k(t(u).FmSearch, {
+                modelValue: C.value,
+                "onUpdate:modelValue": n[3] || (n[3] = (i) => C.value = i),
+                placeholder: t(r)("menu.product_batch_image.filters.search")
+              }, null, 8, ["modelValue", "placeholder"])
+            ]),
+            l("span", Sa, g(p.value.filtered ? t(r)("menu.product_batch_image.scope.filtered", {
+              count: p.value.productCount,
+              total: p.value.totalProductCount
+            }) : t(r)("menu.product_batch_image.scope.all", {
+              count: p.value.productCount
+            })), 1)
+          ]),
+          l("div", Ba, [
+            l("div", za, [
+              (d(!0), $(R, null, V(I.value, (i) => (d(), $("div", {
+                key: i.id,
+                class: "flex flex-col gap-4 border-0 border-b border-r border-solid border-fm-color-neutral-gray-200 px-16 py-12"
+              }, [
+                l("span", Ua, g(i.label), 1),
+                l("span", ja, [
+                  X(g(i.value) + " ", 1),
+                  i.total ? (d(), $("small", Ta, g(i.total), 1)) : U("", !0)
+                ]),
+                i.note ? (d(), $("span", La, g(i.note), 1)) : U("", !0),
+                l("div", Oa, [
+                  (d(!0), $(R, null, V(i.segments, (o, a) => (d(), $("i", {
+                    key: a,
+                    class: "block h-full",
+                    style: oe({
+                      width: `${o.share}%`,
+                      background: o.colour
+                    })
+                  }, null, 4))), 128))
+                ])
+              ]))), 128))
+            ])
+          ]),
+          k(t(u).FmTable, {
+            "column-defs": z.value,
+            "row-data": [...p.value.rows],
+            "page-size": p.value.rows.length || 1,
+            "get-row-id": (i) => i.id,
+            "hide-footer": "",
+            "pin-header-row": "",
+            "shrink-at": !1
+          }, null, 8, ["column-defs", "row-data", "page-size", "get-row-id"])
+        ])) : U("", !0),
+        m.value ? (d(), j(ha, {
+          key: 3,
+          onClose: n[4] || (n[4] = (i) => m.value = !1)
+        })) : U("", !0),
+        v.value && p.value ? (d(), j(We, {
+          key: 4,
+          overview: p.value,
+          onClose: n[5] || (n[5] = (i) => v.value = !1)
+        }, null, 8, ["overview"])) : U("", !0)
+      ]),
+      _: 1
+    }, 8, ["heading"]));
+  }
+});
+export {
+  Na as default
+};