@feedmepos/mf-media 0.0.9 → 0.0.10-dev.2

package/dist/AiStudio-9f9c1203.js

@@ -0,0 +1,797 @@
+import { defineComponent as j, computed as F, resolveComponent as E, openBlock as m, createElementBlock as h, createElementVNode as s, normalizeStyle as ee, createVNode as k, toDisplayString as u, unref as a, createCommentVNode as U, normalizeClass as N, createTextVNode as ae, createBlock as G, Fragment as D, renderList as V, mergeModels as H, useModel as q, renderSlot as ne, withCtx as te, ref as B, withDirectives as ie, vModelText as le, onMounted as re } from "vue";
+import { defineStore as de, storeToRefs as ce } from "pinia";
+import { useI18n as L, useCoreStore as ue } from "@feedmepos/mf-common";
+import { useDialog as me, useSnackbar as fe } from "@feedmepos/ui-library";
+import { V as K, S as pe, J as ve, X as xe } from "./media-picker-cf281640.js";
+const ge = { class: "rounded-xl border border-fm-color-neutral-gray-200 bg-white overflow-hidden" }, ye = ["src", "alt"], be = {
+  key: 1,
+  class: "absolute inset-0 flex flex-col items-center justify-center gap-4 p-12 text-center"
+}, he = { class: "text-xs font-semibold" }, _e = { class: "text-xs text-fm-color-typo-secondary line-clamp-3" }, $e = {
+  key: 2,
+  class: "absolute inset-0 flex items-center justify-center"
+}, ke = { class: "flex flex-col items-center gap-8" }, Ie = { class: "text-xs text-fm-color-typo-secondary" }, we = {
+  key: 3,
+  class: "absolute left-8 top-8 px-4 py-4 rounded text-xs font-bold bg-black/60 text-white"
+}, Te = {
+  key: 0,
+  class: "flex items-center gap-4 px-8 py-8"
+}, Ce = { class: "flex-1 text-xs text-fm-color-typo-secondary truncate" }, Se = ["title"], Fe = ["title"], Re = ["title"], Ee = {
+  key: 1,
+  class: "flex justify-end px-8 py-8"
+}, J = "w-32 h-32 rounded-md flex items-center justify-center text-fm-color-typo-secondary hover:bg-fm-color-neutral-gray-100", Be = /* @__PURE__ */ j({
+  __name: "StudioImageCard",
+  props: {
+    item: {},
+    ratio: {},
+    fromRef: { type: Boolean }
+  },
+  emits: ["preview", "variant", "discard", "save"],
+  setup(e, { emit: x }) {
+    const t = e, l = x, { t: r } = L(), v = F(() => t.item.status === "success" && !!t.item.url), g = F(() => t.item.status === "failed"), w = F(() => t.ratio.replace("x", " / ")), n = F(
+      () => t.item.width && t.item.height ? `${t.item.width}×${t.item.height}` : ""
+    );
+    return ($, b) => {
+      const C = E("FmIcon"), T = E("FmCircularProgress"), S = E("FmButton");
+      return m(), h("div", ge, [
+        s("div", {
+          class: "relative bg-fm-color-neutral-gray-100",
+          style: ee({ aspectRatio: w.value })
+        }, [
+          v.value ? (m(), h("img", {
+            key: 0,
+            src: e.item.url,
+            class: "w-full h-full object-cover",
+            alt: n.value
+          }, null, 8, ye)) : g.value ? (m(), h("div", be, [
+            k(C, {
+              name: "error_outline",
+              size: "md"
+            }),
+            s("span", he, u(a(r)("media.studio.failed")), 1),
+            s("span", _e, u(e.item.error), 1)
+          ])) : (m(), h("div", $e, [
+            s("div", ke, [
+              k(T, { size: "md" }),
+              s("span", Ie, u(a(r)("media.studio.rendering")), 1)
+            ])
+          ])),
+          v.value ? (m(), h("span", we, u(e.fromRef ? a(r)("media.studio.refTag") : a(r)("media.studio.aiTag")), 1)) : U("", !0)
+        ], 4),
+        v.value ? (m(), h("div", Te, [
+          s("span", Ce, u(n.value), 1),
+          s("button", {
+            type: "button",
+            class: N(J),
+            title: a(r)("media.studio.preview"),
+            onClick: b[0] || (b[0] = (f) => l("preview"))
+          }, [
+            k(C, {
+              name: "open_in_full",
+              size: "sm"
+            })
+          ], 8, Se),
+          s("button", {
+            type: "button",
+            class: N(J),
+            title: a(r)("media.studio.variant"),
+            onClick: b[1] || (b[1] = (f) => l("variant"))
+          }, [
+            k(C, {
+              name: "add_photo_alternate",
+              size: "sm"
+            })
+          ], 8, Fe),
+          s("button", {
+            type: "button",
+            class: N(J),
+            title: a(r)("media.studio.discard"),
+            onClick: b[2] || (b[2] = (f) => l("discard"))
+          }, [
+            k(C, {
+              name: "delete",
+              size: "sm"
+            })
+          ], 8, Re),
+          k(S, {
+            label: e.item.saved ? a(r)("media.studio.saved") : a(r)("media.studio.save"),
+            variant: "primary",
+            size: "md",
+            disabled: e.item.saved,
+            onClick: b[3] || (b[3] = (f) => l("save"))
+          }, null, 8, ["label", "disabled"])
+        ])) : g.value ? (m(), h("div", Ee, [
+          k(S, {
+            label: a(r)("media.studio.retry"),
+            variant: "tertiary",
+            size: "md",
+            onClick: b[4] || (b[4] = (f) => l("variant"))
+          }, null, 8, ["label"])
+        ])) : U("", !0)
+      ]);
+    };
+  }
+}), ze = { class: "flex flex-col gap-12" }, Pe = { class: "flex items-center gap-12" }, Ue = { class: "flex-1 min-w-0 flex flex-col gap-4" }, Oe = { class: "text-sm font-semibold line-clamp-2" }, Ae = { class: "text-xs text-fm-color-typo-secondary" }, De = {
+  key: 0,
+  class: "flex items-center gap-4 text-xs font-semibold"
+}, Me = { class: "grid gap-16 grid-cols-[repeat(auto-fill,minmax(min(240px,100%),1fr))]" }, Ve = /* @__PURE__ */ j({
+  __name: "StudioBatch",
+  props: {
+    batch: {}
+  },
+  emits: ["regenerate", "preview", "variant", "discard", "save"],
+  setup(e, { emit: x }) {
+    const t = e, l = x, { t: r } = L(), v = F(
+      () => t.batch.items.some((n) => n.status === "pending" || n.status === "processing")
+    ), g = F(
+      () => !!(t.batch.params.refAssetId || t.batch.params.refTmpToken)
+    ), w = F(() => {
+      const n = {
+        style: r(`media.studio.styles.${t.batch.params.style}`),
+        ratio: t.batch.params.ratio,
+        count: t.batch.items.length
+      };
+      return g.value ? r("media.studio.batchMetaRef", { ...n, strength: t.batch.params.refStrength ?? 55 }) : r("media.studio.batchMeta", n);
+    });
+    return (n, $) => {
+      const b = E("FmCircularProgress"), C = E("FmButton");
+      return m(), h("div", ze, [
+        s("div", Pe, [
+          s("div", Ue, [
+            s("span", Oe, u(e.batch.params.prompt), 1),
+            s("span", Ae, u(w.value), 1)
+          ]),
+          v.value ? (m(), h("span", De, [
+            k(b, { size: "md" }),
+            ae(" " + u(a(r)("media.studio.generating")), 1)
+          ])) : (m(), G(C, {
+            key: 1,
+            label: a(r)("media.studio.regenerate"),
+            variant: "tertiary",
+            size: "md",
+            "prepend-icon": "refresh",
+            onClick: $[0] || ($[0] = (T) => l("regenerate"))
+          }, null, 8, ["label"]))
+        ]),
+        s("div", Me, [
+          (m(!0), h(D, null, V(e.batch.items, (T) => (m(), G(Be, {
+            key: T.taskId,
+            item: T,
+            ratio: e.batch.params.ratio,
+            "from-ref": g.value,
+            onPreview: (S) => l("preview", T),
+            onVariant: $[1] || ($[1] = (S) => l("variant")),
+            onDiscard: (S) => l("discard", T),
+            onSave: (S) => l("save", T)
+          }, null, 8, ["item", "ratio", "from-ref", "onPreview", "onDiscard", "onSave"]))), 128))
+        ])
+      ]);
+    };
+  }
+}), Ne = [
+  "none",
+  "photo",
+  "flatlay",
+  "studio",
+  "warm",
+  "illus"
+], je = ["1x1", "4x3", "3x4", "16x9"], Le = [1, 2, 4];
+function X(e) {
+  return `/media-v1/businesses/${e}/generations`;
+}
+async function qe(e, x) {
+  const { data: t } = await K().post(X(e), x);
+  return t;
+}
+async function Ge(e, x) {
+  const { data: t } = await K().get(
+    `${X(e)}/${x}`
+  );
+  return t;
+}
+async function He(e, x) {
+  const { data: t } = await K().post(
+    `${X(e)}/ref-upload-intent`,
+    x
+  );
+  return t;
+}
+async function Ye(e, x) {
+  const t = await fetch(e.uploadUrl, {
+    method: e.method,
+    headers: { "Content-Type": x.type },
+    body: x
+  });
+  if (!t.ok)
+    throw new Error(`reference upload failed: ${t.status} ${await t.text()}`);
+}
+const Je = { class: "w-[320px] max-h-screen overflow-auto flex flex-col gap-16 p-16 rounded-xl border border-fm-color-neutral-gray-200 bg-white sticky top-0 self-start" }, Ke = { class: "flex flex-col gap-8" }, Xe = { class: "flex items-baseline gap-8" }, We = { class: "text-sm font-semibold" }, Qe = { class: "text-xs text-fm-color-typo-tertiary" }, Ze = { class: "grid grid-cols-2 gap-8" }, et = ["onClick"], tt = { class: "flex items-center gap-8" }, st = { class: "text-sm font-semibold" }, ot = { class: "text-xs text-fm-color-typo-secondary" }, at = { class: "flex flex-col gap-8" }, nt = {
+  key: 0,
+  class: "flex items-center gap-8 px-8 py-8 rounded-lg bg-[#FFF7F0]"
+}, it = { class: "text-xs" }, lt = { class: "flex flex-col gap-8" }, rt = { class: "text-sm font-semibold" }, dt = { class: "flex flex-wrap gap-4" }, ct = { class: "flex flex-col gap-8" }, ut = { class: "text-sm font-semibold" }, mt = { class: "grid grid-cols-2 gap-8" }, ft = ["onClick"], pt = { class: "text-fm-color-typo-secondary" }, vt = { class: "flex flex-col gap-8" }, xt = { class: "text-sm font-semibold" }, gt = { class: "flex gap-8" }, yt = ["onClick"], bt = { class: "flex flex-col gap-8 sticky bottom-0 bg-white pt-12" }, ht = { class: "text-xs text-fm-color-typo-tertiary text-center" }, _t = "border-[--fm-color-brand-primary,#FF7823] bg-[#FFF7F0]", $t = "border-fm-color-neutral-gray-200 bg-white", kt = /* @__PURE__ */ j({
+  __name: "StudioControls",
+  props: /* @__PURE__ */ H({
+    busy: { type: Boolean },
+    hasRef: { type: Boolean }
+  }, {
+    prompt: { required: !0 },
+    promptModifiers: {},
+    style: { required: !0 },
+    styleModifiers: {},
+    ratio: { required: !0 },
+    ratioModifiers: {},
+    count: { required: !0 },
+    countModifiers: {}
+  }),
+  emits: /* @__PURE__ */ H(["generate"], ["update:prompt", "update:style", "update:ratio", "update:count"]),
+  setup(e, { emit: x }) {
+    const t = e, l = q(e, "prompt"), r = q(e, "style"), v = q(e, "ratio"), g = q(e, "count"), w = x, { t: n } = L(), $ = ["hero", "banner", "social", "menu"], b = {
+      hero: "restaurant",
+      banner: "campaign",
+      social: "photo_camera",
+      menu: "menu_book"
+    }, C = F(
+      () => $.map((o) => ({
+        key: o,
+        icon: b[o],
+        name: n(`media.studio.tpl.${o}.name`),
+        desc: n(`media.studio.tpl.${o}.desc`),
+        prompt: n(`media.studio.tpl.${o}.prompt`)
+      }))
+    ), T = F(
+      () => {
+        var o;
+        return (o = C.value.find((y) => y.prompt === l.value)) == null ? void 0 : o.key;
+      }
+    ), S = F(() => /\[[^\]]+\]/.test(l.value)), f = F(() => l.value.trim().length > 0 && !t.busy);
+    function i(o) {
+      return o ? _t : $t;
+    }
+    return (o, y) => {
+      const _ = E("FmIcon"), z = E("FmTextarea"), O = E("FmChip"), Y = E("FmButton");
+      return m(), h("div", Je, [
+        s("div", Ke, [
+          s("div", Xe, [
+            s("span", We, u(a(n)("media.studio.templates")), 1),
+            s("span", Qe, u(a(n)("media.studio.templatesHint")), 1)
+          ]),
+          s("div", Ze, [
+            (m(!0), h(D, null, V(C.value, (d) => (m(), h("button", {
+              key: d.key,
+              type: "button",
+              class: N(["flex flex-col items-start gap-4 p-12 rounded-lg border text-left", i(T.value === d.key)]),
+              onClick: (M) => l.value = d.prompt
+            }, [
+              s("span", tt, [
+                k(_, {
+                  name: d.icon,
+                  size: "sm"
+                }, null, 8, ["name"]),
+                s("span", st, u(d.name), 1)
+              ]),
+              s("span", ot, u(d.desc), 1)
+            ], 10, et))), 128))
+          ])
+        ]),
+        s("div", at, [
+          k(z, {
+            modelValue: l.value,
+            "onUpdate:modelValue": y[0] || (y[0] = (d) => l.value = d),
+            label: a(n)("media.studio.prompt"),
+            placeholder: e.hasRef ? a(n)("media.studio.promptPlaceholderRef") : a(n)("media.studio.promptPlaceholder"),
+            "max-length": 500,
+            "show-word-count": ""
+          }, null, 8, ["modelValue", "label", "placeholder"]),
+          S.value ? (m(), h("div", nt, [
+            k(_, {
+              name: "info",
+              size: "sm"
+            }),
+            s("span", it, u(a(n)("media.studio.slotHint")), 1)
+          ])) : U("", !0)
+        ]),
+        ne(o.$slots, "default"),
+        s("div", lt, [
+          s("span", rt, u(a(n)("media.studio.style")), 1),
+          s("div", dt, [
+            (m(!0), h(D, null, V(a(Ne), (d) => (m(), G(O, {
+              key: d,
+              label: a(n)(`media.studio.styles.${d}`),
+              selected: r.value === d,
+              selectable: "",
+              compact: "",
+              onClick: (M) => r.value = d
+            }, null, 8, ["label", "selected", "onClick"]))), 128))
+          ])
+        ]),
+        s("div", ct, [
+          s("span", ut, u(a(n)("media.studio.ratio")), 1),
+          s("div", mt, [
+            (m(!0), h(D, null, V(a(je), (d) => (m(), h("button", {
+              key: d,
+              type: "button",
+              class: N(["flex items-center justify-center gap-4 h-40 rounded-lg border text-xs font-semibold", i(v.value === d)]),
+              onClick: (M) => v.value = d
+            }, [
+              s("span", null, u(d), 1),
+              s("span", pt, u(a(n)(`media.studio.ratios.${d}`)), 1)
+            ], 10, ft))), 128))
+          ])
+        ]),
+        s("div", vt, [
+          s("span", xt, u(a(n)("media.studio.count")), 1),
+          s("div", gt, [
+            (m(!0), h(D, null, V(a(Le), (d) => (m(), h("button", {
+              key: d,
+              type: "button",
+              class: N(["flex-1 h-40 rounded-lg border text-sm font-semibold", i(g.value === d)]),
+              onClick: (M) => g.value = d
+            }, " × " + u(d), 11, yt))), 128))
+          ])
+        ]),
+        s("div", bt, [
+          k(Y, {
+            label: e.busy ? a(n)("media.studio.generateBusy") : a(n)("media.studio.generate"),
+            "prepend-icon": "auto_awesome",
+            variant: "primary",
+            size: "md",
+            disabled: !f.value,
+            onClick: y[1] || (y[1] = (d) => w("generate"))
+          }, null, 8, ["label", "disabled"]),
+          s("span", ht, u(a(n)("media.studio.disclaimer")), 1)
+        ])
+      ]);
+    };
+  }
+}), It = {
+  key: 0,
+  class: "flex h-[560px]"
+}, wt = { class: "flex-1 min-w-0 flex items-center justify-center bg-black p-16" }, Tt = ["src", "alt"], Ct = { class: "w-[300px] flex-shrink-0 flex flex-col gap-12 p-16 overflow-y-auto" }, St = { class: "flex items-start justify-between gap-8" }, Ft = { class: "fm-typo-en-title-sm-600" }, Rt = ["title"], Et = { class: "text-sm font-semibold break-words" }, Bt = { class: "text-xs text-fm-color-typo-secondary" }, zt = /* @__PURE__ */ j({
+  __name: "StudioPreviewDialog",
+  props: {
+    item: {},
+    prompt: {}
+  },
+  emits: ["close", "save", "variant"],
+  setup(e, { emit: x }) {
+    const t = e, l = x, { t: r } = L();
+    return (v, g) => {
+      const w = E("FmIcon"), n = E("FmButton"), $ = E("FmDialog");
+      return m(), G($, {
+        "model-value": !!t.item,
+        "max-width": 920,
+        "max-height": "560px",
+        "content-class": "!p-0 studio-preview-dialog-content",
+        "close-button": !1,
+        "onUpdate:modelValue": g[3] || (g[3] = (b) => !b && l("close"))
+      }, {
+        default: te(() => [
+          t.item ? (m(), h("div", It, [
+            s("div", wt, [
+              s("img", {
+                src: t.item.url,
+                class: "max-w-full max-h-full object-contain",
+                alt: t.prompt
+              }, null, 8, Tt)
+            ]),
+            s("div", Ct, [
+              s("div", St, [
+                s("span", Ft, u(a(r)("media.studio.preview")), 1),
+                s("button", {
+                  type: "button",
+                  class: "w-32 h-32 rounded-lg bg-fm-color-neutral-gray-100 flex items-center justify-center flex-shrink-0",
+                  title: a(r)("media.library.cancelButton"),
+                  onClick: g[0] || (g[0] = (b) => l("close"))
+                }, [
+                  k(w, {
+                    name: "close",
+                    size: "sm"
+                  })
+                ], 8, Rt)
+              ]),
+              s("span", Et, u(t.prompt), 1),
+              s("span", Bt, u(t.item.width) + "×" + u(t.item.height), 1),
+              g[4] || (g[4] = s("div", { class: "flex-1" }, null, -1)),
+              k(n, {
+                label: a(r)("media.studio.variant"),
+                variant: "tertiary",
+                size: "md",
+                onClick: g[1] || (g[1] = (b) => l("variant"))
+              }, null, 8, ["label"]),
+              k(n, {
+                label: t.item.saved ? a(r)("media.studio.saved") : a(r)("media.studio.save"),
+                variant: "primary",
+                size: "md",
+                disabled: t.item.saved,
+                onClick: g[2] || (g[2] = (b) => l("save"))
+              }, null, 8, ["label", "disabled"])
+            ])
+          ])) : U("", !0)
+        ]),
+        _: 1
+      }, 8, ["model-value"]);
+    };
+  }
+}), Pt = { class: "flex flex-col gap-8" }, Ut = { class: "flex items-baseline gap-8" }, Ot = { class: "text-sm font-semibold" }, At = { class: "text-xs text-fm-color-typo-tertiary" }, Dt = {
+  key: 0,
+  class: "flex items-center gap-8 p-8 rounded-lg border border-fm-color-neutral-gray-200"
+}, Mt = ["src"], Vt = { class: "flex-1 text-xs truncate" }, Nt = { class: "flex gap-8" }, jt = { class: "text-xs text-fm-color-typo-tertiary" }, Lt = {
+  key: 2,
+  class: "text-xs text-[--fm-color-typo-critical,#FF3B30]"
+}, qt = {
+  key: 3,
+  class: "flex flex-col gap-4"
+}, Gt = { class: "flex items-baseline gap-8" }, Ht = { class: "text-xs font-semibold" }, Yt = { class: "text-xs font-semibold" }, Jt = { class: "text-xs text-fm-color-typo-secondary" }, Kt = /* @__PURE__ */ j({
+  __name: "StudioRefPicker",
+  props: /* @__PURE__ */ H({
+    businessId: {},
+    restaurantId: {}
+  }, {
+    strength: { required: !0 },
+    strengthModifiers: {}
+  }),
+  emits: /* @__PURE__ */ H(["change"], ["update:strength"]),
+  setup(e, { emit: x }) {
+    const t = e, l = q(e, "strength"), r = x, { t: v } = L(), g = B(!1), w = B(!1), n = B(""), $ = B(null), b = B(null), C = F(() => l.value <= 35 ? v("media.studio.refWeak") : l.value >= 70 ? v("media.studio.refStrong") : v("media.studio.refMid"));
+    function T(i) {
+      g.value = !1, n.value = "", $.value = { url: i.url, label: i.asset.fileName }, r("change", {
+        refAssetId: i.asset.id,
+        // null means the original was picked, and the request omits refRatio for that.
+        refRatio: i.ratio ?? void 0,
+        label: i.asset.fileName
+      });
+    }
+    async function S(i) {
+      var y;
+      const o = (y = i.target.files) == null ? void 0 : y[0];
+      if (o) {
+        w.value = !0, n.value = "";
+        try {
+          const _ = await He(t.businessId, {
+            contentType: o.type,
+            fileSize: o.size
+          });
+          await Ye(_, o), $.value = { url: URL.createObjectURL(o), label: o.name }, r("change", { refTmpToken: _.token, label: o.name });
+        } catch (_) {
+          n.value = _ instanceof Error ? _.message : String(_), $.value = null, r("change", null);
+        } finally {
+          w.value = !1, b.value && (b.value.value = "");
+        }
+      }
+    }
+    function f() {
+      $.value = null, n.value = "", r("change", null);
+    }
+    return (i, o) => {
+      const y = E("FmButton");
+      return m(), h("div", Pt, [
+        s("div", Ut, [
+          s("span", Ot, u(a(v)("media.studio.ref")), 1),
+          s("span", At, u(a(v)("media.studio.refHint")), 1)
+        ]),
+        $.value ? (m(), h("div", Dt, [
+          $.value.url ? (m(), h("img", {
+            key: 0,
+            src: $.value.url,
+            class: "w-48 h-48 rounded object-cover",
+            alt: ""
+          }, null, 8, Mt)) : U("", !0),
+          s("span", Vt, u($.value.label), 1),
+          k(y, {
+            label: a(v)("media.studio.refClear"),
+            variant: "tertiary",
+            size: "md",
+            onClick: f
+          }, null, 8, ["label"])
+        ])) : (m(), h(D, { key: 1 }, [
+          s("div", Nt, [
+            k(y, {
+              label: a(v)("media.studio.refPick"),
+              variant: "tertiary",
+              size: "md",
+              class: "flex-1",
+              onClick: o[0] || (o[0] = (_) => g.value = !0)
+            }, null, 8, ["label"]),
+            k(y, {
+              label: a(v)("media.studio.refUpload"),
+              variant: "tertiary",
+              size: "md",
+              class: "flex-1",
+              disabled: w.value,
+              onClick: o[1] || (o[1] = (_) => {
+                var z;
+                return (z = b.value) == null ? void 0 : z.click();
+              })
+            }, null, 8, ["label", "disabled"]),
+            s("input", {
+              ref_key: "fileInput",
+              ref: b,
+              type: "file",
+              accept: "image/jpeg,image/png,image/webp",
+              class: "hidden",
+              onChange: S
+            }, null, 544)
+          ]),
+          s("span", jt, u(a(v)("media.studio.refUploadHint")), 1)
+        ], 64)),
+        n.value ? (m(), h("span", Lt, u(n.value), 1)) : U("", !0),
+        $.value ? (m(), h("div", qt, [
+          s("div", Gt, [
+            s("span", Ht, u(a(v)("media.studio.refStrength")), 1),
+            o[4] || (o[4] = s("span", { class: "flex-1" }, null, -1)),
+            s("span", Yt, u(l.value) + "%", 1)
+          ]),
+          ie(s("input", {
+            "onUpdate:modelValue": o[2] || (o[2] = (_) => l.value = _),
+            type: "range",
+            min: "10",
+            max: "90",
+            step: "5",
+            class: "w-full cursor-pointer accent-[--fm-color-brand-primary,#FF7823]"
+          }, null, 512), [
+            [
+              le,
+              l.value,
+              void 0,
+              { number: !0 }
+            ]
+          ]),
+          s("span", Jt, u(C.value), 1)
+        ])) : U("", !0),
+        k(a(pe), {
+          open: g.value,
+          "onUpdate:open": o[3] || (o[3] = (_) => g.value = _),
+          "business-id": e.businessId,
+          "restaurant-id": e.restaurantId,
+          "allow-upload": !1,
+          onSelect: T
+        }, null, 8, ["open", "business-id", "restaurant-id"])
+      ]);
+    };
+  }
+}), Xt = "ai", Wt = "ai-generated";
+function Qt(e) {
+  return e === "success" || e === "failed";
+}
+function Z(e) {
+  return e.some((x) => !Qt(x.status));
+}
+function Zt(e, x) {
+  return e.map((t) => {
+    const l = x.find((r) => r.taskId === t.taskId);
+    return l ? { ...t, ...l, saved: t.saved } : t;
+  });
+}
+function es(e) {
+  const x = !!(e.refAssetId || e.refTmpToken);
+  return {
+    prompt: e.prompt.trim(),
+    style: e.style,
+    ratio: e.ratio,
+    count: e.count,
+    refAssetId: e.refAssetId,
+    refRatio: e.refRatio,
+    refTmpToken: e.refTmpToken,
+    refStrength: x ? e.refStrength : void 0,
+    restaurantId: e.restaurantId
+  };
+}
+const ts = 3e3, ss = de("mediaGeneration", () => {
+  const e = B([]), x = F(() => e.value.some((f) => Z(f.items)));
+  let t, l = "";
+  function r(f, i) {
+    const o = e.value.find((y) => y.batchId === f);
+    o && (o.items = Zt(o.items, i));
+  }
+  function v() {
+    t !== void 0 || !l || (t = setTimeout(async () => {
+      t = void 0;
+      const f = e.value.filter((i) => Z(i.items));
+      for (const i of f)
+        try {
+          const o = await Ge(l, i.batchId);
+          r(i.batchId, o.items);
+        } catch {
+        }
+      x.value && v();
+    }, ts));
+  }
+  async function g(f, i) {
+    l = f;
+    const o = await qe(f, es(i));
+    e.value.unshift({
+      batchId: o.batchId,
+      params: i,
+      items: o.items.map((y) => ({
+        taskId: y.taskId,
+        assetId: y.assetId,
+        imageId: y.imageId,
+        status: y.status,
+        attempts: 0,
+        error: y.error,
+        saved: !1
+      }))
+    }), v();
+  }
+  async function w(f, i) {
+    await g(f, i);
+  }
+  async function n(f, i) {
+    await g(f, { ...i.params });
+  }
+  async function $(f, i) {
+    await g(f, { ...i.params, count: 1 });
+  }
+  async function b(f, i, o) {
+    var _;
+    await ve(f, o.assetId, [Wt]);
+    const y = (_ = e.value.find((z) => z.batchId === i.batchId)) == null ? void 0 : _.items.find((z) => z.taskId === o.taskId);
+    y && (y.saved = !0);
+  }
+  async function C(f, i, o) {
+    await xe(f, [
+      {
+        refType: Xt,
+        refId: i.batchId,
+        imageId: o.imageId,
+        aspectRatios: null
+      }
+    ]);
+    const y = e.value.find((_) => _.batchId === i.batchId);
+    y && (y.items = y.items.filter((_) => _.taskId !== o.taskId), y.items.length === 0 && (e.value = e.value.filter((_) => _.batchId !== i.batchId)));
+  }
+  function T(f) {
+    l = f, x.value && v();
+  }
+  function S() {
+    t !== void 0 && clearTimeout(t), t = void 0, e.value = [];
+  }
+  return { batches: e, busy: x, compose: w, regenerate: n, variantOf: $, save: b, discard: C, resume: T, reset: S };
+}), os = { class: "flex items-start gap-24 p-24" }, as = { class: "flex-1 min-w-0 flex flex-col gap-24" }, ns = {
+  key: 0,
+  class: "min-h-[340px] flex flex-col items-center justify-center gap-12 border-2 border-dashed border-fm-color-neutral-gray-300 rounded-2xl"
+}, is = { class: "text-lg font-semibold" }, ls = { class: "text-sm text-fm-color-typo-secondary" }, fs = /* @__PURE__ */ j({
+  __name: "AiStudio",
+  setup(e) {
+    const x = ue(), { t } = L(), l = me(), r = fe(), v = F(() => {
+      var p;
+      return ((p = x.currentBusiness.value) == null ? void 0 : p.id) ?? "";
+    }), g = F(() => {
+      var p;
+      return (p = x.currentRestaurant.value) == null ? void 0 : p._id;
+    }), w = ss(), { batches: n, busy: $ } = ce(w);
+    re(() => w.resume(v.value));
+    const b = B(""), C = B("photo"), T = B("1x1"), S = B(2), f = B(55), i = B(null), o = F(() => !!i.value);
+    function y() {
+      var p, c, R, P;
+      return {
+        prompt: b.value,
+        style: C.value,
+        ratio: T.value,
+        count: S.value,
+        refAssetId: (p = i.value) == null ? void 0 : p.refAssetId,
+        refRatio: (c = i.value) == null ? void 0 : c.refRatio,
+        refTmpToken: (R = i.value) == null ? void 0 : R.refTmpToken,
+        refStrength: i.value ? f.value : void 0,
+        refLabel: (P = i.value) == null ? void 0 : P.label,
+        restaurantId: g.value
+      };
+    }
+    function _(p) {
+      var R, P;
+      return ((P = (R = p == null ? void 0 : p.response) == null ? void 0 : R.data) == null ? void 0 : P.message) ?? (p instanceof Error ? p.message : String(p));
+    }
+    function z(p) {
+      var c, R;
+      return (R = (c = p == null ? void 0 : p.response) == null ? void 0 : c.data) == null ? void 0 : R.code;
+    }
+    function O(p) {
+      const c = z(p) === "INSUFFICIENT_TOKENS" ? t("media.studio.insufficientTokens") : _(p);
+      r.open({ type: "error", title: c });
+    }
+    async function Y() {
+      try {
+        await w.compose(v.value, y());
+      } catch (p) {
+        O(p);
+      }
+    }
+    const d = B(null);
+    async function M(p, c) {
+      try {
+        await w.save(v.value, p, c), r.open({ type: "success", title: t("media.studio.savedToast") });
+      } catch (R) {
+        O(R);
+      }
+    }
+    function se(p, c) {
+      l.open({
+        title: t("media.studio.discardTitle"),
+        message: t("media.studio.discardMessage"),
+        primaryActions: { text: t("media.studio.discard"), close: !1, variant: "destructive" },
+        secondaryActions: { text: t("media.library.cancelButton"), close: !0 }
+      }).onPrimary(async () => {
+        var R;
+        try {
+          await w.discard(v.value, p, c), ((R = d.value) == null ? void 0 : R.item.taskId) === c.taskId && (d.value = null), r.open({ type: "success", title: t("media.studio.discardedToast") });
+        } catch (P) {
+          O(P);
+        }
+        l.close();
+      });
+    }
+    async function W(p) {
+      try {
+        await w.variantOf(v.value, p);
+      } catch (c) {
+        O(c);
+      }
+    }
+    async function oe(p) {
+      try {
+        await w.regenerate(v.value, p);
+      } catch (c) {
+        O(c);
+      }
+    }
+    return (p, c) => {
+      var P, Q;
+      const R = E("FmIcon");
+      return m(), h("div", os, [
+        k(kt, {
+          prompt: b.value,
+          "onUpdate:prompt": c[2] || (c[2] = (I) => b.value = I),
+          style: ee(C.value),
+          "onUpdate:style": c[3] || (c[3] = (I) => C.value = I),
+          ratio: T.value,
+          "onUpdate:ratio": c[4] || (c[4] = (I) => T.value = I),
+          count: S.value,
+          "onUpdate:count": c[5] || (c[5] = (I) => S.value = I),
+          class: "flex-shrink-0",
+          busy: a($),
+          "has-ref": o.value,
+          onGenerate: Y
+        }, {
+          default: te(() => [
+            k(Kt, {
+              strength: f.value,
+              "onUpdate:strength": c[0] || (c[0] = (I) => f.value = I),
+              "business-id": v.value,
+              "restaurant-id": g.value,
+              onChange: c[1] || (c[1] = (I) => i.value = I)
+            }, null, 8, ["strength", "business-id", "restaurant-id"])
+          ]),
+          _: 1
+        }, 8, ["prompt", "style", "ratio", "count", "busy", "has-ref"]),
+        s("div", as, [
+          a(n).length === 0 ? (m(), h("div", ns, [
+            k(R, {
+              name: "auto_awesome",
+              size: "xl"
+            }),
+            s("span", is, u(a(t)("media.studio.emptyTitle")), 1),
+            s("span", ls, u(a(t)("media.studio.emptyHint")), 1)
+          ])) : U("", !0),
+          (m(!0), h(D, null, V(a(n), (I) => (m(), G(Ve, {
+            key: I.batchId,
+            batch: I,
+            onRegenerate: (A) => oe(I),
+            onVariant: (A) => W(I),
+            onPreview: (A) => d.value = { batch: I, item: A },
+            onDiscard: (A) => se(I, A),
+            onSave: (A) => M(I, A)
+          }, null, 8, ["batch", "onRegenerate", "onVariant", "onPreview", "onDiscard", "onSave"]))), 128))
+        ]),
+        k(zt, {
+          item: ((P = d.value) == null ? void 0 : P.item) ?? null,
+          prompt: ((Q = d.value) == null ? void 0 : Q.batch.params.prompt) ?? "",
+          onClose: c[6] || (c[6] = (I) => d.value = null),
+          onSave: c[7] || (c[7] = (I) => d.value && M(d.value.batch, d.value.item)),
+          onVariant: c[8] || (c[8] = (I) => d.value && W(d.value.batch))
+        }, null, 8, ["item", "prompt"])
+      ]);
+    };
+  }
+});
+export {
+  fs as default
+};